<template>
    <div class="approval-log-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";

// --- Props & Emits ---
interface Props {
    actionTypeDict: any[];
}

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


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

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

const searchList: any = computed(() => [
    {
        type: "Select",
        name: "action",
        label: "操作类型",
        fieldProps: {
            allowClear: true,
        },
        options: props.actionTypeDict || [],
    },
]);

// --- 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);
});
</script>
<style lang="scss"></style>
