多选下拉树修改

zhaojiale

2022-08-09 4b709c7eeafe8dfb3a3f838cbde57d6d12cc96c1

多选下拉树修改

 src/views/contingencyManagement/panManagement/component/openAdd.vue

@@ -13,15 +13,14 @@
                        <el-form-item label="适用部门" prop="responsibleDepartment">
                            <el-tree-select
                                v-model="ruleForm.responsibleDepartment"
                                :data="data"
                                multiple
                                :render-after-expand="false"
                                :data="newTreeList"
                                class="w100"
                                :props="propse"
                                clearable
                show-checkbox
                check-strictly
                check-on-click-node
                placeholder="请选择"
                                multiple
                                :render-after-expand="false"
                                show-checkbox
                                placeholder="请选择"
                            />
                            <el-divider />
                        </el-form-item>
@@ -66,12 +65,13 @@
                        <el-form-item label="编写部门" prop="authorDeptId">
                            <el-tree-select
                                v-model="ruleForm.authorDeptId"
                                check-strictly
                                :data="data"
                                :data="newTreeList"
                                class="w100"
                                :props="propse"
                                clearable
                                multiple
                                :render-after-expand="false"
                                show-checkbox
                                placeholder="请选择"
                            />
                        </el-form-item>
@@ -209,24 +209,40 @@
        const releaseDate = ref('');
        // 上传附件
        const fileList = ref<UploadUserFile[]>([]);
        //部门树
        const department = () => {
            goalManagementApi()
                .getTreedepartment()
                .then((res) => {
                    if (res.data.code == 200) {
            data.value = res.data.data;
                    } else {
                        ElMessage.error(res.data.msg);
                    }
                });
        };
        const treeSelect = ref();
        // const trees = ref();
        //el-tree-select回显
        const propse = {
            label: 'depName',
            children: 'children',
            value: 'depId',
        };
        const newTreeList = [];
        //得到部门树
        const department = async () => {
            await goalManagementApi()
                    .getTreedepartment()
                    .then((res) => {
                        if (res.data.code == 200) {
                            data.value = res.data.data;
                            getTreeList(res.data.data, newTreeList);
                            console.log('newList',newTreeList)
                        } else {
                            ElMessage.error(res.data.msg);
                        }
                    });
        };
        // 递归树状数据且修改字段名
        const getTreeList = (treeList, newTreeList) => {
            treeList.map((c) => {
                let tempData = {
                    depName: c.depName,
                    value: c.depId,
                    children: [],
                };
                if (c.children && c.children.length > 0) {
                    tempData.children = [];
                    getTreeList(c.children, tempData.children);
                }
                newTreeList.push(tempData);
            });
        };
        onMounted(() => {
            department();
@@ -371,7 +387,7 @@
            data,
            Search,
            releaseDate,
            treeSelect,
            // treeSelect,
            // trees,
            propse,
            department,
@@ -394,6 +410,7 @@
            ruleForm,
            resetForm,
            onUser,
            newTreeList
        };
    },
});