<template>
    <h2>测试下拉树组件-vue3</h2>


    <pro-button id="queryBtn" @click="onClick">点击</pro-button>
    <pro-button id="queryBtn" @click="onClick1">点击改变汇总关系</pro-button>
    <div>汇总:{{ relationNo }}</div>

    <div>机构:{{ brNos }}</div>
    <div>准则:{{ stddNo }}</div>
    <div>账套:{{ sobNo }}</div>
    <div>科目:{{ accNos }}</div>
    <!-- <div>
        <pro-tree3 v-model:value="brNos" treeType="deptTree" :showCheckbox="true" :isWithoutDsc="true"></pro-tree3>
    </div> -->
    <pro-form label-width="120px">
        <!-- <pro-form-grid colNum="2"> -->
        <pro-form-grid>

            <!-- 表单-->
            <!-- <pro-select3 :formItemProps="{ label: '汇总关系', prop: 'relationNo' }" v-model:value="formData.relationNo"
                placeholder="请选择汇总关系" :allowClear="true" selectType="relationNo" pageInterfaceNo="zzsearch_01_01_02">
            </pro-select3>

            <pro-select-tree3 :formItemProps="{ label: '机构', prop: 'brNo' }" treeType="deptTree"
                v-model:value="formData.brNo" :relationNo="formData.relationNo" :showCheckbox="false" :isAsync="false"
                :isWithoutDsc="true" @getNodes="getNodes">
            </pro-select-tree3>

            <pro-select3 :formItemProps="{ label: '交易系统', prop: 'sysNo' }" v-model:value="formData.sysNo"
                placeholder="请选择交易系统" :allowClear="true" selectType="perSys">
            </pro-select3>

            <pro-select3 :formItemProps="{ label: '币种', prop: 'curNo' }" v-model:value="formData.curNo"
                placeholder="请选择币种" :allowClear="true" selectType="curr">
            </pro-select3> -->

            <pro-select-tree3 :formItemProps="{ label: '账套', prop: 'sobNo' }" treeType="sobTree"
                v-model:value="formData.sobNo" v-model:stddNo="formData.stddNo" :brNos="formData.brNo"
                :showCheckbox="false" :multiple="false" mode="default">
            </pro-select-tree3>

            <!-- <pro-select-tree3 :formItemProps="{ label: '科目', prop: 'accNos' }" treeType="sobItemTree"
                v-model:value="formData.accNos" :stddNo="formData.stddNo" :sobNo="formData.sobNo" :showCheckbox="true">
            </pro-select-tree3>

            <pro-select3 :formItemProps="{ label: '科目级别', prop: 'accLvl' }" v-model:value="formData.accLvl"
                placeholder="请选择科目级别" :allowClear="true" selectType="accLvl" :sobNo="formData.sobNo">
            </pro-select3> -->



            <!-- <pro-select3 :formItemProps="{ label: '启用标志', prop: 'useYn' }" v-model:value="useYn" placeholder="请选择启用标志"
                :allowClear="true" tableName="com_usertype_info" colName="use_yn">
            </pro-select3>
            <pro-select3 :formItemProps="{ label: '科目级别', prop: 'accLvl' }" v-model:value="accLvl" placeholder="请选择科目级别"
                :allowClear="true" selectType="accLvl" sobNo="10">
            </pro-select3>

            <pro-select3 :formItemProps="{ label: '汇总关系', prop: 'relationNo' }" v-model:value="relationNo"
                placeholder="请选择汇总关系" :allowClear="true" selectType="relationNo" pageInterfaceNo="zzsearch_01_01_02">
            </pro-select3>

            <pro-select3 :formItemProps="{ label: '币种', prop: 'curNo' }" v-model:value="curNo" placeholder="请选择币种级别"
                :allowClear="true" selectType="curr">
            </pro-select3> -->

            <!-- <pro-select3 :formItemProps="{ label: '系统', prop: 'sysNo' }" v-model:value="sysNo" placeholder="请选择系统级别"
                :allowClear="true" selectType="perSys">
            </pro-select3> -->
            <!-- <pro-select-tree3 :formItemProps="{ label: '机构', prop: 'brNos' }" treeType="deptTree" v-model:value="brNos"
                :relationNo="relationNo" :showCheckbox="true" :isAsync="false" :isWithoutDsc="true"
                @getNodes="getNodes">
            </pro-select-tree3> -->

            <!-- <pro-select-tree3 :formItemProps="{ label: '账套', prop: 'sobNo' }" treeType="sobTree" v-model:value="sobNo"
                v-model:stddNo="stddNo" :brNos="brNos" :showCheckbox="false" :multiple="false">
            </pro-select-tree3> -->

            <!-- <pro-select-tree3 :formItemProps="{ label: '科目', prop: 'accNos' }" treeType="sobItemTree"
                v-model:value="accNos" :stddNo="stddNo" :sobNo="sobNo" :showCheckbox="true">
            </pro-select-tree3> -->

            <!-- <pro-select-tree3 :formItemProps="{ label: '异步机构', prop: 'asyncbrNos' }" treeType="deptTree"
                v-model:value="asyncbrNos" :relationNo="relationNo" :showCheckbox="true" :isAsync="true">
            </pro-select-tree3> -->

            <!-- <pro-select-tree3 :formItemProps="{ label: '其他', prop: 'accNos' }" v-model:value="areaNo"
                :treeData="areaTreeData" :showCheckbox="false">
            </pro-select-tree3> -->
        </pro-form-grid>
    </pro-form>

    <!--     
    <pro-select-tree3 treeType="deptTree" v-model:value="brNos" :relationNo="relationNo"
        :showCheckbox="true"></pro-select-tree3> -->
    <!-- <pro-select-tree3 treeType="sobTree" v-model:value="sobNo" :brNos="brNos" :showCheckbox="true"></pro-select-tree3> -->

    <!-- <pro-select-tree3 treeType="sobItemTree" v-model:value="accNos" :showCheckbox="true"></pro-select-tree3> -->





    <!-- <pro-tree3 :treeData="treeData" v-model:selectedKeys="selectedKeys" treeType="sobTree"></pro-tree3>
    <pro-tree3 treeType="deptTree" v-model:brNos="brNos" v-model:brKeys="brKeys" :showCheckbox="true"></pro-tree3>
    <div>1选中的机构外部:{{ brKeys }}</div>
    <div>2选中的机构内部:{{ brNos }}</div>

    <pro-tree3 treeType="sobTree" v-model:brNos="brNos"></pro-tree3> -->

    <!-- <pro-tree3 treeType="sobItemTree" checkable></pro-tree3> -->

    <!-- <pro-form label-width="120px">
        <pro-form-grid style="width: 1000px" colNum="2">
            <pro-select-tree3 :formItemProps="{ label: '机构', prop: 'brNos' }" checkable treeType="deptTree"
                @expand="expand"></pro-select-tree3>
            <pro-select-tree3 :formItemProps="{ label: '账套', prop: 'sobNo' }" treeType="sobTree"></pro-select-tree3>
        </pro-form-grid>
    </pro-form>
    <button @click="fetchData">点击</button>
    <div>返回的数据: {{ treeData }}</div> -->
</template>
<script setup>
import { ref, defineProps, defineExpose, onMounted, onBeforeUnmount, watch, nextTick, provide, defineEmits } from 'vue';

// 表单字段的初始值
const formData = ref({
    relationNo: '',
    brNo: [],
    sysNo: "",
    curNo: "",
    stddNo: "",
    sobNo: '',
    accNos: [],
    accLvl: ""
});


const relationNo = ref('');

// const relationNo = ref('AAAAAA');
function onClick1 () {
    // if (relationNo.value === 'AAAAAA') {
    //     relationNo.value = 'BBBBBB';
    // } else {
    //     relationNo.value = 'AAAAAA';
    // }
}
// const brNos = ref(['1']);
const asyncbrNos = ref(['1']);

// const brNos = ref(['1']);
const brNos = ref([]);

function getNodes (value, nodes) {
    console.log('父组件-getNode:', value, nodes);
}
function onClick () {
    if (brNos.value[0] === '1' || brNos.value[0] === '200000') {
        brNos.value = ['800000'];
    } else {
        brNos.value = ['200000'];
    }
}
const stddNo = ref('');
const sobNo = ref([]);
const accNos = ref([]);

const curNo = ref('');
const useYn = ref('');
const accLvl = ref('');
const sysNo = ref('');



const areaNo = ref(['12']);
const areaTreeData = ref([{ "no": "2", "stdd_no": "2", "sts": "1", "acc_cod_rules_bw": "21", "use_yn": "Y", "name": "新会计准则-1", "pid": "2@", "id": "2@", "show_seqn": "20", "acc_cod_rules_bn": "21", "children": [{ "default_yn": "N", "no": "2", "stdd_no": "12", "sts": "1", "acc_cod_rules_bw": "4/2/2", "use_yn": "Y", "name": "非默认账套-1", "pid": "2@", "id": "12", "show_seqn": "21", "acc_cod_rules_bn": "4/2/2/2", "children": [] }, { "default_yn": "Y", "no": "2", "stdd_no": "10", "sts": "1", "acc_cod_rules_bw": "4/2/2", "use_yn": "Y", "name": "默认账套-1", "pid": "2@", "id": "10", "show_seqn": "22", "acc_cod_rules_bn": "4/2/2/2", "children": [] }] }]);

</script>
