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

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

    let { proxy } = getCurrentInstance();
    const emit = defineEmits(['search']);

    const formItems = computed(() => {
        return [
            { type: 'input', label: 'ISBN', prop: 'isbn' },
            { type: 'input', label: '审核员', prop: 'auditUserName' },
            { type: 'input', label: '录入员', prop: 'enterUserName' },
            {
                type: 'datetimerange',
                label: '时间范围',
                prop: 'time',
                props: {
                    format: 'YYYY-MM-DD HH:mm:ss',
                    valueFormat: 'YYYY-MM-DD HH:mm:ss',
                    startPlaceholder: '开始时间',
                    endPlaceholder: '结束时间',
                    onChange: (value) => {
                        searchRef.value?.setData({
                            startTime: value ? value[0] : '',
                            endTime: value ? value[1] : ''
                        });
                    }
                },
                colProps: {
                    span: 6
                }
            }
        ];
    });

    const initKeys = reactive({
        isbn: '',
        auditUserName: '',
        enterUserName: '',
        startTime: '',
        endTime: ''
    });

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