<template>
    <!-- <pro-select v-model:modelValue="internalValue" show-search placeholder="请选择账套级别" :optionData="options"
        :filter-option="filterOption" @focus="handleFocus" @blur="handleBlur">
    </pro-select>
    <div>internalValue: {{ internalValue }}</div> -->

    <pro-select-tree :options="subjectTree" :showCheckbox="false" :props="subjectProps" v-model:value="selectedSubject"
        @input="onSubjectSelect">
    </pro-select-tree>
</template>
<script setup>
import { ref, watch, defineProps, defineEmits, onMounted } from 'vue';


const subjectTree = ref([
    {
        id: '1',
        name: '科目1',
        children: [
            { id: '1-1', name: '科目1-1' },
            { id: '1-2', name: '科目1-2' }
        ]
    },
    {
        id: '2',
        name: '科目2',
        children: [
            { id: '2-1', name: '科目2-1' },
            { id: '2-2', name: '科目2-2' }
        ]
    }
]);
const subjectProps = {
    key: 'id',
    value: 'id',
    label: 'name',
    no: 'id',
    title: 'name',
    children: 'children',
    title: 'name',
    key: 'id',
};
const fieldNames = {
    title: 'name',
    key: 'id',
};

const selectedSubject = ref([]);
function onSubjectSelect (value) {
    console.log('wyq --onSubjectSelect', value);
    selectedSubject.value = value;
}


const props = defineProps({
    txBrNo: {
        type: String,
        default: ''
    },
    // 请求参数
    sobNo: {
        type: String,
        default: ''
    },
    addEndFlag: {
        type: String,
        default: 'false'
    },
    accLvl: {
        type: String,
        default: ''
    },
    formItemProps: Object, // 定义formItemProps prop
});
const emit = defineEmits(['update:accLvl']);
const internalValue = ref(props.accLvl);

// 钩子函数，页面加载完成后首先获取下汇总关系
onMounted(async () => {
    // 1.获取机构汇总关系枚举值
    internalValue.value = '10';
});

// 监听内部值的变化，向外传递
watch(internalValue, (newValue) => {
    console.log('wyq --internalValue change', newValue);
    emit('update:accLvl', newValue);
});

// 确保从父组件接收到的 `value` 更新时，内部状态也能同步
watch(() => props.accLvl, (newValue) => {
    console.log('wyq --props.accLvl change', newValue);

    if (newValue !== internalValue.value) {
        internalValue.value = newValue;
    }
});
watch(() => props.sobNo, async (newVal, oldVal) => {
    console.log('wyq --props.sobNo change', newVal);

    if (newVal != oldVal && newVal != '') {
        //await getRelationInfoNoOptions();
        if (newVal == '10') {
            options.value = [
                {
                    item_no: '1',
                    item_name: '一级科目',
                },
                {
                    item_no: '2',
                    item_name: '二级科目',
                },
                {
                    item_no: '3',
                    item_name: '三级科目',
                },
                {
                    item_no: '4',
                    item_name: '四级科目',
                }
            ]

            internalValue.value = '4'

        } else {
            options.value = [
                {
                    item_no: '1',
                    item_name: '一级科目',
                },
                {
                    item_no: '2',
                    item_name: '二级科目',
                },
                {
                    item_no: '3',
                    item_name: '三级科目',
                }
            ]
            internalValue.value = '3'
        }
    }
});

const options = ref([{
    item_no: '10',
    item_name: '默认账套',
},
{
    item_no: '12',
    item_name: '非默认账套',
}]);


const handleBlur = () => {
    console.log('blur');
};
const handleFocus = () => {
    console.log('focus');
};
const filterOption = (input, option) => {
    return option.item_name.toLowerCase().indexOf(input.toLowerCase()) >= 0;
};
</script>
