shuhi-ui/src/views/data/productPush/components/page-search.vue

<!-- 搜索表单 -->
<template>
  <ele-card :body-style="{ paddingBottom: '8px' }">
    <ProSearch
      :items="formItems"
      ref="searchRef"
      @search="search"
      :initKeys="initKeys"
    ></ProSearch>
  </ele-card>
</template>

<script setup>
  import { reactive, ref, defineEmits, defineProps, computed, getCurrentInstance } from 'vue';
  import ProSearch from '@/components/CommonPage/ProSearch2.vue';

  defineOptions({ name: 'page-search' });

  const props = defineProps({
    status: {
      type: String,
      default: ''
    }
  });

  const emit = defineEmits(['search']);
  const searchRef = ref(null);

  // 初始值
  const initKeys = reactive({
    isbn: '',
    processor: '',
    isPush: '',
    pushStatus: props.status,
    createTimeRange: [],
    pushTimeRange: []
  });

  // 表单项定义
  const formItems = computed(() => {
    return [
      {
        type: 'input',
        label: 'ISBN',
        prop: 'isbn'
      },
      {
        type: 'input',
        label: '处理人',
        prop: 'processor'
      },
      {
        type: 'select',
        label: '是否推送',
        prop: 'isPush',
        options: [
          { label: '是', value: '是' },
          { label: '否', value: '否' }
        ]
      },
      {
        type: 'select',
        label: '推送状态',
        prop: 'pushStatus',
        options: [
          { label: '成功', value: '成功' },
          { label: '失败', value: '失败' },
          { label: '系统错误', value: '系统错误' },
          { label: '无数据', value: '无数据' }
        ]
      },
      {
        type: 'daterange',
        label: '创建时间',
        prop: 'createTimeRange',
        props: {
          valueFormat: 'YYYY-MM-DD HH:mm:ss',
          rangeSeparator: '到',
          startPlaceholder: '开始日期',
          endPlaceholder: '结束日期'
        }
      },
      {
        type: 'daterange',
        label: '推送时间',
        prop: 'pushTimeRange',
        props: {
          valueFormat: 'YYYY-MM-DD HH:mm:ss',
          rangeSeparator: '到',
          startPlaceholder: '开始日期',
          endPlaceholder: '结束日期'
        }
      }
    ];
  });

  // 搜索
  const search = (data) => {
    const params = { ...data };

    // 处理时间范围
    if (params.createTimeRange && params.createTimeRange.length) {
      params.createTimeStart = params.createTimeRange[0];
      params.createTimeEnd = params.createTimeRange[1];
      delete params.createTimeRange;
    }

    if (params.pushTimeRange && params.pushTimeRange.length) {
      params.pushTimeStart = params.pushTimeRange[0];
      params.pushTimeEnd = params.pushTimeRange[1];
      delete params.pushTimeRange;
    }

    emit('search', params);
  };
</script>