<template>
    <el-tree-select
        v-model="value"
        :data="dictContent"
        :props="{
            label: 'name',
            value: 'code',
        }"
        node-key="code"
        clearable
        filterable
        accordion
        style="width: 320px"
        @current-change="handleChange"
    />
</template>
<script setup>
import useCatchStore from "@/stores/modules/catch";
const catchSotre = useCatchStore();
const dictContent = catchSotre.getDictContent();

const props = defineProps({
    modelValue: {
        type: String,
        default: ''
    },
});
const emit = defineEmits(["update:modelValue", "change"]);

const value = ref(props.modelValue);

watch(() => props.modelValue, (val) => {
    value.value = val;
});
watch(value, (val) => {
    emit("update:modelValue", val);
});

function handleChange(nodeData, node) {
    emit("change", node);
}
</script>
<style lang="scss" scoped>
</style>