<template>
    <template v-if="select.includes(name)">
        <el-select clearable>
            <el-option
                v-for="item in data[name]"
                :key="item.id"
                :label="item.dictLabel"
                :value="item.dictValue"
            />
        </el-select>
    </template>
    <template v-else-if="selectTree.includes(name)">
        <el-tree-select :data="data" :props="{value: 'id'}" node-key="id" clearable filterable @node-click="(nodeData, node) => change(nodeData)" />
    </template>
</template>
<script setup>
import useCatchStore from '@/stores/modules/catch'

const props = defineProps({
    name: {
        type: String,
        required: true,
    },
});
const emit = defineEmits(['change'])
const select = ["businessType", "suspectProblem", "processingStatus"];
const selectTree = ["problemSources"];

const catchStore = useCatchStore();
const data = select.includes(props.name) ? catchStore.getDicts([props.name]) : catchStore.getDictProblemSources()

function change(nodeData) {
    emit('change', nodeData)
}

</script>
<style lang="scss" scoped>
</style>