WholeProcessPlatform/frontend/src/views/shuJuTianBao/shengPiJiLu/shengPiJiLuSearch.vue

<template>
    <div class="guoYuSheShiShuJuTianBao-search">
        <BasicSearch ref="basicSearchRef" :searchList="searchList" :initial-values="initSearchData"
            @finish="onSearchFinish" @values-change="onValuesChange" @reset="handleReset">
        </BasicSearch>
    </div>
</template>

<script lang="ts" setup>
import { ref, computed, onMounted } from "vue";
import BasicSearch from "@/components/BasicSearch/index.vue"; // 确保路径正确
import { getDictItemsByCode } from '@/api/dict';
// --- Props & Emits ---
interface Props {

}

const props = defineProps<Props>();
const emit = defineEmits<{
    (e: "reset", values: any): void;
    (e: "searchFinish", values: any): void;
}>();


// 模拟 initSearchData
const initSearchData = {
  approvalNo:'',
  status:'',
};

const searchData = ref<any>({ ...initSearchData });

const searchList: any = computed(() => [
    {
        type: "Input",
        name: "approvalNo",
        label: "审批批次号",
        fieldProps: {
            allowClear: true,
        },
        options: [],
    },
    {
        type: "Select",
        name: "status",
        label: "审批状态",
        fieldProps: {
            allowClear: true,
        },
        options: statusData.value,
    },

]);
// --- Methods ---



// 2. 搜索表单逻辑
const onSearchFinish = (values: any) => {
    console.log(values);

    emit("searchFinish", values);
};
const handleReset = () => {
    emit("reset", initSearchData);
};

const onValuesChange = (changedValues: any, allValues: any) => {
    // 同步更新本地 searchData，以便其他逻辑使用
    searchData.value = { ...searchData.value, ...allValues };
};

// --- Lifecycle ---
onMounted(() => {
  emit("searchFinish", initSearchData);
  getstatusData()
});
const statusData = ref(false)
const getstatusData = () => {
  getDictItemsByCode({ dictCode: "approvalStatus" }).then((res) => {
    statusData.value = res.data;
  });
};
</script>
<style lang="scss"></style>