<!-- 搜索表单 -->
<template>
    <ele-card :body-style="{ paddingBottom: '8px' }">
        <ProSearch
            :items="formItems"
            ref="searchRef"
            @search="search"
            :initKeys="initKeys"
        >
            <template #buttons>
                <el-button type="primary" @click="searchRef.handleSearch()"
                    >查询</el-button
                >
                <el-button @click="searchRef.handleReset()">重置</el-button>
            </template>
        </ProSearch>
    </ele-card>
</template>

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

    const emit = defineEmits(['search']);

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

    const formItems = reactive([
        { type: 'input', label: '用户ID', prop: 'userId' },
        {
            type: 'dictSelect',
            label: '请选择类型',
            prop: 'type',
            props: {
                code: 'order_compensation_type'
            }
        },
        {
            type: 'datetimerange',
            label: '时间',
            prop: 'timeRange',
            props: {
                valueFormat: 'YYYY-MM-DD HH:mm:ss',
                format: 'YYYY-MM-DD HH:mm:ss',
                startPlaceholder: '开始时间',
                endPlaceholder: '结束时间',
                onChange: (value) => {
                    searchRef.value?.setData({
                        startTime: value ? value[0] : '',
                        endTime: value ? value[1] : ''
                    });
                }
            }
        }
    ]);

    const initKeys = reactive({
        startTime: '',
        endTime: '',
        timeRange: [],
        userId: '',
        status: '',
        type: ''
    });

    const searchRef = ref(null);
    /** 搜索 */
    const search = (data) => {
        let params = { ...data };
        delete params.timeRange;
        emit('search', params);
    };
</script>
