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

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

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

    const formItems = reactive([
        { type: 'input', label: '原订单ID', prop: 'originOrderId' },
        { type: 'input', label: '退回订单ID', prop: 'refundOrderId' },
        { type: 'input', label: '用户ID', prop: 'userId' },
        { type: 'input', label: '寄件人手机号', prop: 'sendMobile' },
        { type: 'input', label: '退回运单号', prop: 'refundWaybillCode' },
        {
            type: 'select',
            label: '状态',
            prop: 'status',
            options: [
                { label: '进行中订单', value: '0' },
                { label: '待商家处理', value: '1' },
                { label: '待商家收货', value: '2' },
                { label: '待买家发货', value: '3' },
                { label: '已拒绝退款', value: '4' },
                { label: '退款成功', value: '5' },
                { label: '退款取消', value: '6' }
            ]
        },
        {
            type: 'select',
            label: '退款类型',
            prop: 'refundType',
            options: [
                { label: '极速退款', value: '0' },
                { label: '退货退款', value: '1' },
                { label: '仅退款', value: '2' },
                { label: '缺货退款', value: '3' }
            ]
        },
        {
            type: 'daterange',
            label: '创建时间',
            prop: 'dateRange',
            keys: ['createTimeStart', 'createTimeEnd'],
            props: {
                format: 'YYYY-MM-DD HH:mm:ss',
                valueFormat: 'YYYY-MM-DD HH:mm:ss',
                onChange: (val) => {
                    searchRef.value?.setData({
                        createTimeStart: val && val.length > 0 ? val[0] : '',
                        createTimeEnd: val && val.length > 0 ? val[1] : ''
                    });
                }
            }
        }
    ]);

    const initKeys = reactive({
        originOrderId: '',
        refundOrderId: '',
        userId: '',
        sendMobile: '',
        refundWaybillCode: '',
        status: '',
        refundType: '',
        createTimeStart: '',
        createTimeEnd: ''
    });

    const search = (data) => {
        let params = JSON.parse(JSON.stringify(data));
        delete params.dateRange;
        emit('search', params);
    };
</script>
