3

src/App.vue

@@ -5,8 +5,26 @@
 </template>
 
 <script>
+import { ref, onMounted } from "vue"
 export default {
   name: 'App',
+  setup() {
+    onMounted(() => {
+      document.title = 'SCD检测'
+      // 创建一个 link 元素
+      const link = document.createElement('link');
+      link.rel = 'icon';
+      link.type = 'image/x-icon';
+      link.href = '../../assets/icon/Avatar.png'; // 替换为你的图标路径
+      // 获取当前文档中原有的 link 元素
+      const existingLink = document.querySelector('link[rel="icon"]');
+      // 如果存在原有的 link 元素，则替换它；否则，将新创建的 link 元素添加到 head 中
+      if (existingLink) {
+        document.head.removeChild(existingLink);
+      }
+      document.head.appendChild(link);
+    })
+  },
   components: {
   }
 }

src/main.js

@@ -14,7 +14,7 @@ import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
 import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
 //logicflow相关配置
 import LogicFlow from "@logicflow/core";
-import { BpmnElement, Control, MiniMap,Menu,Snapshot } from '@logicflow/extension';
+import { BpmnElement, Control, MiniMap,Menu,Snapshot,RectResize  } from '@logicflow/extension';
 // 左边工具栏以及编辑节点的样式
 // import 'bpmn-js-properties-panel/dist/assets/bpmn-js-properties-panel.css'
 const app = createApp(App)
@@ -30,6 +30,7 @@ LogicFlow.use(BpmnElement);
 LogicFlow.use(Control);
 LogicFlow.use(Menu);
 LogicFlow.use(Snapshot);
+LogicFlow.use(RectResize)
 // LogicFlow.use(MiniMap);
 // 使用 app 实例来挂载应用
 app.mount('#app')

src/pages/components/draw/DrawDesigns.vue

@@ -4,10 +4,12 @@
             <div ref="container" class="container" v-loading="loading"></div>
         </div>
         <!-- 功能模态框 -->
-        <AbilityModal v-if="abModal" :abModal="abModal" :modelId="modelId" :iedType="iedType" @abilityBack="abilityBack">
+        <AbilityModal v-if="abModal" :abModal="abModal" :modelId="modelId" :iedType="iedType"
+            @abilityBack="abilityBack">
         </AbilityModal>
-        <LineDouble v-if="ldModal" :ldModal="ldModal" :modelId="modelId" :startTarget="startTarget" :endTarget="endTarget"
-            :numCase="numCase" :startText="startText" :endText="endText" :lineType="lineType" @lineBack="lineBack">
+        <LineDouble v-if="ldModal" :ldModal="ldModal" :modelId="modelId" :startTarget="startTarget"
+            :endTarget="endTarget" :numCase="numCase" :startText="startText" :endText="endText" :lineType="lineType"
+            @lineBack="lineBack">
         </LineDouble>
     </div>
 </template>
@@ -21,7 +23,19 @@ import { ElMessage } from 'element-plus';
 import { useRouter, useRoute } from 'vue-router';
 import AbilityModal from "../drawModal/AbilityModal.vue"
 import LineDouble from '../drawModal/LineDouble.vue';
-import { DndPanel, SelectionSelect, Group, Menu, MiniMap, regeister, Snapshot, lfJson2Xml, lfXml2Json } from "@logicflow/extension";
+import {
+    DndPanel,
+    SelectionSelect,
+    Group,
+    Menu,
+    MiniMap,
+    regeister,
+    Snapshot,
+    lfJson2Xml,
+    lfXml2Json,
+    RectResize,
+    NodeResize,
+} from "@logicflow/extension";
 import "@logicflow/core/dist/style/index.css";
 import "@logicflow/extension/lib/style/index.css";
 export default {
@@ -268,20 +282,24 @@ export default {
             copyColor.value = props.lineMenuColor//颜色
             setTimeout(() => {
                 cid.getModelInfo({ id: copyObj.value.id ? copyObj.value.id : route.query.modelid - 0, pageno: 1, pagesize: 20 }).then(res => {
-                    emit("drawCor",res.data)
+                    emit("drawCor", res.data)
                     const filteredArray = res.data[0].ied_type.filter(param => param !== null)
+                    console.log(filteredArray,'asd');
                     needMap.value = filteredArray.map(item => {
                         return {
                             type: 'rect',
                             text: item.name,
                             label: item.name,
                             icon: '',
+                            id:item.id,
                             properties: {
                                 ied_type: item.code,
                                 id: item.id
-                            }
+                            },
+                            children:["129007"]
                         }
                     })
+                  
                     lf.value = new LogicFlow({
                         // 通过选项指定了渲染的容器和需要显示网格
                         container: container.value,//需要显示画布的容器ref
@@ -295,7 +313,7 @@ export default {
                         //     },
                         // },//网格,
                         grid: true,
-                        plugins: [DndPanel, SelectionSelect, Group, Menu, MiniMap, Snapshot],//全局加载的组件
+                        plugins: [DndPanel, SelectionSelect, Group, Menu, MiniMap, Snapshot, RectResize, NodeResize],//全局加载的组件
                         keyboard: {
                             enabled: true
                         },
@@ -384,11 +402,11 @@ export default {
                     });
                     lf.value.on("edge:click", function (data, e, position) {
                         delId.value = data.data.id
-                        if (copyColor.value == '#255CE7') {
-                            lf.value.graphModel.updateText(data.data.id, "GOOSE");
-                        } else if (copyColor.value == 'orange') {
-                            lf.value.graphModel.updateText(data.data.id, "SV");
-                        }
+                        // if (copyColor.value == '#255CE7') {
+                        //     lf.value.graphModel.updateText(data.data.id, "GOOSE");
+                        // } else if (copyColor.value == 'orange') {
+                        //     lf.value.graphModel.updateText(data.data.id, "SV");
+                        // }
                     })
                     lf.value.on("edge:add", function (data, e, position) {
                         if (copyColor.value == '#255CE7') {
@@ -410,13 +428,13 @@ export default {
                         setY.value = data.data.y
                         emit("backxy", setX.value, setY.value)
                     })
-                    lf.value.on('anchor:drop', function (data, e, position) {//添加线上文字
-                        if (numCase.value == 0) {
-                            lf.value.graphModel.updateText(data.edgeModel.id, "SV");
-                        } else if (numCase.value == 1) {
-                            lf.value.graphModel.updateText(data.edgeModel.id, "GOOSE");
-                        }
-                    })
+                    // lf.value.on('anchor:drop', function (data, e, position) {//添加线上文字
+                    //     if (numCase.value == 0) {
+                    //         lf.value.graphModel.updateText(data.edgeModel.id, "SV");
+                    //     } else if (numCase.value == 1) {
+                    //         lf.value.graphModel.updateText(data.edgeModel.id, "GOOSE");
+                    //     }
+                    // })
                     lf.value.on('node:dbclick', function (data, e, position) {//双击打开弹窗
                         console.log(data, 'datas');
                         iedType.value = data.data.properties.ied_type
@@ -432,11 +450,11 @@ export default {
                         endTarget.value = end.properties
                         console.log(copyColor.value, 'copy');
                         console.log(data, 'data');
-                        if (copyColor.value == '#255CE7') {
-                            lf.value.graphModel.updateText(data.data.id, "GOOSE");
-                        } else if (copyColor.value == 'orange') {
-                            lf.value.graphModel.updateText(data.data.id, "SV");
-                        }
+                        // if (copyColor.value == '#255CE7') {
+                        //     lf.value.graphModel.updateText(data.data.id, "GOOSE");
+                        // } else if (copyColor.value == 'orange') {
+                        //     lf.value.graphModel.updateText(data.data.id, "SV");
+                        // }
                         ldModal.value = true
                     })
                     lf.value.on('node:mousemove', function (data, e) {//传递坐标轴参数到父组件

src/pages/components/drawModal/LineDouble.vue

@@ -1,6 +1,7 @@
 <template>
     <div>
-        <el-dialog v-model="dialogVisible" title="装置端子关系配置" width="60%" @close="handleClose" :close-on-click-modal="false">
+        <el-dialog v-model="dialogVisible" title="装置端子关系配置" width="60%" @close="handleClose"
+            :close-on-click-modal="false">
             <div class="masBox" v-loading="pastLoading">
                 <div class="leftBox">
                     <h1 style="
@@ -10,16 +11,17 @@
                     padding-bottom: 10px;
                     ">{{ startTxt }}</h1>
                     <div style="height: auto;">
-                        <div style="margin-bottom: 10px;" v-for="(item, index) in curList" @click="setIndex(item, index)">
+                        <div style="margin-bottom: 10px;" v-for="(item, index) in curList"
+                            @click="setIndex(item, index)">
                             <span :class="index == leftIndex ? 'result' : 'anther'">{{ index + 1 }}</span>
                             <span :class="index == leftIndex ? 'results' : 'anthers'" :id="item.id">{{ item.fcda_name
-                            }}</span>
+                                }}</span>
                         </div>
                     </div>
                 </div>
                 <div class="middleBox">
                     <p class="background" :style="{ 'background-image': `url(${setBackground})`, 'color': setColor }">{{
-                        setGooseOrSv }}</p>
+            setGooseOrSv }}</p>
                 </div>
                 <div class="rightBox" v-loading="loading">
                     <h1 style="
@@ -150,7 +152,7 @@ export default {
                 sv_or_goose: gv.value,
                 in_or_out: "输出"
             }).then(res => {
-                if (res.code == 0) {
+                if (res.data) {
                     let tmpList = [];
                     //对结果进行重排排序：将已关联到输出装置的端子排在前面
                     res.data.forEach((item, index) => {
@@ -162,7 +164,7 @@ export default {
                         }
                     })
                     curList.value = tmpList
-                    console.log(curList.value, 'cur');
+                    pastLoading.value = false
                 } else {
                     ElMessage({
                         message: res.msg,
@@ -176,7 +178,8 @@ export default {
                 sv_or_goose: gv.value,
                 in_or_out: "接收"
             }).then(res => {
-                if (res.code == 0) {
+                console.log(res.data, '!!!!!');
+                if (res.data) {
                     //对结果进行重排排序：将已关联到输出装置的端子排在前面
                     let tmpList = [];
                     res.data.forEach((item, index) => {
@@ -191,12 +194,14 @@ export default {
                     // 将 setTimeout 移动到 then 方法中
                     setTimeout(() => {
                         res.data.forEach((item, index) => {
+
                             let line = {
                                 start: item.from_fcda_id,
                                 end: item.id
                             };
                             let starts = document.getElementById(line.start);
                             let ends = document.getElementById(line.end);
+                            console.log(starts, ends, '??????');
                             // 检查 starts 和 ends 是否存在
                             if (starts && ends) {
                                 leaderLineList.value.push(new LeaderLine(starts, ends, {
@@ -285,54 +290,56 @@ export default {
         })
         // 下标选择
         function setIndex(row, num) {
-            //loading.value = true
-            // loading.value = true
+            console.log(row, 'row');
             if (row && num) {
                 leftFcda.value = row.id
+                checkList.value = [row.to_fcda_id]
+                fcdaIds.value = row.to_fcda_id
                 leftIndex.value = num
-                flow.getModelOn({
-                    model_id: modelIds.value - 0,
-                    from_fcda_id: row.id - 0
-                }).then(res => {
-                    if (res.data != null) {
-                        together.value = res.data
-                        checkList.value = together.value.map(item => {
-                            return item.to_fcda_id
-                        })
-                        fcdaIds.value = res.data.map(item => {
-                            return item.to_fcda_id
-                        }).join(",")
-                        loading.value = false
-                    } else {
-                        together.value = []
-                        checkList.value = []
-                        loading.value = false
-                    }
-                })
-
+                // flow.getModelOn({
+                //     model_id: modelIds.value - 0,
+                //     from_fcda_id: row.id - 0
+                // }).then(res => {
+                //     if (res.data != null) {
+                //         together.value = res.data
+                //         checkList.value = together.value.map(item => {
+                //             return item.to_fcda_id
+                //         })
+                //         fcdaIds.value = res.data.map(item => {
+                //             return item.to_fcda_id
+                //         }).join(",")
+                //         loading.value = false
+                //     } else {
+                //         together.value = []
+                //         checkList.value = []
+                //         loading.value = false
+                //     }
+                // })
             } else {
                 if (curList.value.length > 0) {
                     leftFcda.value = curList.value[0].id
+                    checkList.value = [curList.value[0].to_fcda_id]
+                    fcdaIds.value = curList.value[0].to_fcda_id
                     leftIndex.value = 0
-                    flow.getModelOn({
-                        model_id: modelIds.value - 0,
-                        from_fcda_id: curList.value[0].id - 0
-                    }).then(res => {
-                        if (res.data != null) {
-                            together.value = res.data
-                            checkList.value = together.value.map(item => {
-                                return item.to_fcda_id
-                            })
-                            fcdaIds.value = res.data.map(item => {
-                                return item.to_fcda_id
-                            }).join(",")
-                            loading.value = false
-                        } else {
-                            together.value = []
-                            checkList.value = []
-                            loading.value = false
-                        }
-                    })
+                    // flow.getModelOn({
+                    //     model_id: modelIds.value - 0,
+                    //     from_fcda_id: curList.value[0].id - 0
+                    // }).then(res => {
+                    //     if (res.data != null) {
+                    //         together.value = res.data
+                    //         checkList.value = together.value.map(item => {
+                    //             return item.to_fcda_id
+                    //         })
+                    //         fcdaIds.value = res.data.map(item => {
+                    //             return item.to_fcda_id
+                    //         }).join(",")
+                    //         loading.value = false
+                    //     } else {
+                    //         together.value = []
+                    //         checkList.value = []
+                    //         loading.value = false
+                    //     }
+                    // })
                 } else {
                     ElMessage({
                         type: "info",

src/pages/login/LoginNow.vue

@@ -12,8 +12,7 @@
             </div>
             <!-- 登录信息 -->
             <div class="formBox">
-                <el-form :model="loginForm" label-width="45px" 
-                style="padding-top: 24px;">
+                <el-form :model="loginForm" label-width="45px" style="padding-top: 24px;">
                     <el-form-item label="账号">
                         <el-input class="loginInp" v-model="loginForm.username" placeholder="你的账号..." maxlength="32" />
                     </el-form-item>
@@ -124,12 +123,6 @@ export default {
         }
         onMounted(() => {
             window.addEventListener('keyup', handleKeyUp);
-            // window.onload = function () {
-            //     // 设置定时器，在 5000 毫秒（即 5 秒）后执行刷新操作
-            //     setTimeout(function () {
-            //         location.reload(); // 执行页面刷新
-            //     }, 100); // 5000 毫秒 = 5 秒
-            // };
         })
         onBeforeUnmount(() => {
             window.removeEventListener('keyup', handleKeyUp);

src/pages/mission/components/CreateMis.vue

@@ -28,7 +28,8 @@
                     <el-form-item label="检测模型" prop="cmodel">
                         <el-input class="bestInput" style="width: 600px;" disabled placeholder="输入内容"
                             v-model="newMission.cmodel"></el-input>
-                        <el-button @click="modelOpen" style="height: 40px;margin-left: 5px;" type="primary" plain><el-icon>
+                        <el-button @click="modelOpen" style="height: 40px;margin-left: 5px;" type="primary"
+                            plain><el-icon>
                                 <Coin style="color: #449DFD;" />
                             </el-icon>选择模型</el-button>
                     </el-form-item>
@@ -39,6 +40,7 @@
                         </el-select>
                     </el-form-item>
                     <el-form-item prop="misMes">
+
                         <template #label>
                             <span style="color: red;">任务说明</span>
                         </template>
@@ -49,13 +51,14 @@
                         <el-upload ref="upload" class="upload-demo" :http-request="nowUpload" :limit="2"
                             element-loading-text="上传中..." element-loading-background="rgba(255, 255, 255, 0.8)"
                             :show-file-list="false">
+
                             <template #trigger>
                                 <el-button style="border-bottom: 1px solid #7BBAFD;width: calc(100vw - 1000px);"
                                     type="primary" plain>{{ scdName ? scdName : '选择SCD文件' }}</el-button>
                             </template>
                         </el-upload>
-                        <span style="margin-left: 10px;" v-loading="scdLoading">{{ textIs ? scdLoading ? ' 正在进行SCD间隔装置分析' :
-                            ' SCD分析已完成' : '' }}
+                        <span style="margin-left: 10px;" v-loading="scdLoading">{{ textIs ? scdLoading ? '正在进行SCD间隔装置分析'
+            : 'SCD分析已完成' : '' }}
                         </span>
                     </el-form-item>
                 </el-form>
@@ -80,7 +83,15 @@
                         style="text-align: left;cursor: pointer;" @click="jgClick(item, index)">
                         {{ item.name }}
                     </p> -->
-                    <el-tree :props="anyProps" :data="anyData" @node-click="handleCheckChange" />
+                    <!-- <el-tree :props="anyProps" :data="anyData" @node-click="handleCheckChange" /> -->
+                    <el-tree :props="anyProps" :data="anyData" @node-click="handleCheckChange" node-key="id">
+                        <template #default="{ node, data }">
+                            <el-badge v-if="data.isLog" :value="filterLength" class="item">
+                                <span>{{ node.label }}</span>
+                            </el-badge>
+                            <span v-else>{{ node.label }}</span>
+                        </template>
+                    </el-tree>
                 </div>
                 <!-- 装置列表 -->
                 <div class="unitBox">
@@ -90,7 +101,8 @@
                         </div>
                         <div style="height: 24px;line-height: 22px;margin-left: 5px;">
                             <span style="font-size: 16px;font-weight: 400;">装置列表——间隔：<em>{{ jg }}</em></span>
-                            <span style="font-size: 16px;font-weight: 400;">检测模型：<em>{{ flashLevel ? flashLevel : '' }}</em></span>
+                            <span style="font-size: 16px;font-weight: 400;">检测模型：<em>{{ flashLevel ? flashLevel : ''
+                                    }}</em></span>
                         </div>
                         <div
                             style="position: absolute;top: 0px;right: 0px;display: flex;justify-content: center;align-items: center;">
@@ -108,8 +120,9 @@
                         <!-- <div v-for="(item, index) in mx">
                             {{ item.ied_name }}
                         </div> -->
-                        <el-tag v-for="(item, index) in mx" :key="item.ied_name" @click="tagClick(item, index)" size="large"
-                            :class="item.isChoose ? 'mx-2' : 'mx-1'" closable="true" effect="plain" @close="tagClose(item)">
+                        <el-tag v-for="(item, index) in mx" :key="item.ied_name" @click="tagClick(item, index)"
+                            size="large" :class="item.isChoose ? 'mx-2' : 'mx-1'" closable="true" effect="plain"
+                            @close="tagClose(item)">
                             {{ '[' + item.ied_name + ']' + (item.attr_desc || '') }}
                         </el-tag>
                     </div>
@@ -128,7 +141,8 @@
             </ModelTree>
             <FlashCreate v-if="fcModal" :fcModal="fcModal" @fcBack="fcBack"></FlashCreate>
             <CheckIed v-if="iedModal" :iedModal="iedModal" :loadScdId="loadScdId" @iedBack="iedBack"
-                @iedArrBack="iedArrBack"></CheckIed>
+                @iedArrBack="iedArrBack">
+            </CheckIed>
         </div>
     </div>
 </template>
@@ -231,6 +245,7 @@ export default {
         let saveLoading = ref(false)
         let editAndAdd = ref("新建检测任务")
         let textIs = ref(false)
+        let filterLength = ref(0)//装置筛选有无attr_desc属性时的数组长度
         watch(() => props.editRow, (newVal) => {
             needEdit.value = newVal
         })
@@ -276,7 +291,9 @@ export default {
                             scd.getLoadScd({ scd_id: res.data.scd_id * 1 }).then(res => {
                                 if (res.code == 0) {
                                     successScd.value = true
-                                    anyData.value = res.data
+                                    anyData.value = res.data.map(item => {
+                                        return { ...item, isLog: false }; // 使用展开运算符为每个对象添加一个名为 isLog 的新属性，并设置其值为 true
+                                    });
                                 }
                             })
                         }
@@ -364,8 +381,9 @@ export default {
                             scd.getLoadScd({ scd_id: loadScdId.value - 0 }).then(res => {
                                 if (res.code == 0) {
                                     successScd.value = true
-                                    anyData.value = res.data
-                                    console.log(anyData.value, 'any')
+                                    anyData.value = res.data.map(item => {
+                                        return { ...item, isLog: false }; // 使用展开运算符为每个对象添加一个名为 isLog 的新属性，并设置其值为 true
+                                    });
                                 } else {
                                     ElMessage({
                                         message: res.msg,
@@ -422,6 +440,20 @@ export default {
                 if (res.data != null) {
                     mx.value = res.data.map(item => ({ ...item, isChoose: false }));
                     iedName.value = mx.value.map(item => item.ied_name).join(',')
+                    // 该循环是为了判断树形结构上是否有提示
+                    let ccc = res.data.map(param => {
+                        if (!param.attr_desc) {
+                            return param
+                        }
+                    })
+                    // 去除掉undefined
+                    const filteredArray = ccc.filter(item => item !== undefined);
+                    console.log(filteredArray, 'filter');
+                    if (filteredArray.length > 0) {
+                        filterLength.value = filteredArray.length
+                        e.isLog = true
+                        console.log(e, '修改');
+                    }
                     iedLoading.value = false
                 } else {
                     mx.value = []
@@ -579,6 +611,7 @@ export default {
             editAndAdd,
             textIs,
             saveLoading,
+            filterLength,//装置筛选有无attr_desc属性时的数组长度
         }
     },
     components: {

src/pages/setting/components/SystemCode.vue

@@ -1,42 +1,64 @@
 <template>
     <div>
-        <div class="bigBox">
+        <div class="bigBox" v-loading="loading">
             <div class="settingBox">
                 <h2>系统代码管理</h2>
             </div>
             <div class="tableBox">
-                <el-button type="primary" plain @click="openModal(0)">
-                    <el-icon>
-                        <Plus />
-                    </el-icon>
-                    新增系统字典
-                </el-button>
-                <el-table :data="systemList" style="width: 100%;height: calc(100vh - 260px);" :stripe="true">
-                    <el-table-column fixed prop="code" label="字典代码" width="auto" />
-                    <el-table-column prop="name" label="字典名称" width="auto" />
-                    <el-table-column prop="parentcode" label="上级字典代码" width="auto" />
-                    <el-table-column fixed="right" label="操作" width="120">
-                        <template #default="scope">
-                            <el-button link type="primary" size="small" @click="openModal(1, scope.row)">
-                                <el-icon>
-                                    <EditPen />
-                                </el-icon>编辑</el-button>
-                            <el-button style="color: red;" link type="primary" size="small" @click="delItem(scope.row)">
-                                <el-icon style="color: red;">
-                                    <Delete />
-                                </el-icon>删除</el-button>
+                <div style="width: 30%;">
+                    <el-tree :data="treeFather" node-key="id" :props="defaultProps" @node-click="handleNodeClick">
+                        <template #default="{ node, data }">
+                            <span class="custom-tree-node">
+                                <svg t="1709689483117" class="icon" viewBox="0 0 1180 1024" version="1.1"
+                                    xmlns="http://www.w3.org/2000/svg" p-id="1524" width="20" height="20">
+                                    <path
+                                        d="M1099.433546 289.842983h-1.08787v-99.462424a128.679511 128.679511 0 0 0-93.246023-126.65918v-3.263611A60.454505 60.454505 0 0 0 944.023508 0.003264H729.246837A60.454505 60.454505 0 0 0 668.326102 59.836128H122.526051A126.65918 126.65918 0 0 0 0.062941 190.380559V890.502778a12.277393 12.277393 0 0 0 2.331151 6.216401v1.243281c0 72.110257 46.623011 126.03754 113.760147 126.03754H969.821575c67.603366 0 105.212595-68.225006 122.463109-130.544431L1174.652004 419.610365c18.182974-75.063048-7.459682-129.767381-75.218458-129.767382z m-897.337556 0a160.072339 160.072339 0 0 0-132.253942 78.637479v-124.32803a73.198128 73.198128 0 0 1 46.623011-54.859743H668.326102a60.609915 60.609915 0 0 1 60.454505-59.988274h215.242901a60.609915 60.609915 0 0 1 60.454505 60.609914v3.108201a126.50377 126.50377 0 0 1 90.604052 97.908324z"
+                                        fill="#FF892A" p-id="1525"></path>
+                                </svg>
+                                <span>{{ node.label }}</span>
+                            </span>
                         </template>
-                    </el-table-column>
-                </el-table>
+                    </el-tree>
+                </div>
+                <div style="width: 70%;">
+                    <el-button type="primary" plain @click="openModal(0)">
+                        <el-icon>
+                            <Plus />
+                        </el-icon>
+                        新增系统字典
+                    </el-button>
+                    <el-table :data="systemList" style="width: 100%;height: calc(100vh - 260px);" :stripe="true">
+                        <el-table-column fixed prop="code" label="字典代码" width="auto" />
+                        <el-table-column prop="name" label="字典名称" width="auto" />
+                        <el-table-column prop="parentcode" label="上级字典代码" width="auto" />
+                        <el-table-column fixed="right" label="操作" width="120">
+
+                            <template #default="scope">
+                                <el-button link type="primary" size="small" @click="openModal(1, scope.row)">
+                                    <el-icon>
+                                        <EditPen />
+                                    </el-icon>编辑</el-button>
+                                <el-button style="color: red;" link type="primary" size="small"
+                                    @click="delItem(scope.row)">
+                                    <el-icon style="color: red;">
+                                        <Delete />
+                                    </el-icon>删除</el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
             </div>
             <div class="pageBox">
-                <Pagination :key="reloadKey" :tLength="totals" :pages="pages" :sizes="sizes" @getBack="getBack"></Pagination>
+                <!-- <Pagination :key="reloadKey" :tLength="totals" :pages="pages" :sizes="sizes" @getBack="getBack">
+                </Pagination> -->
             </div>
             <!-- 模态框盒子 -->
             <div class="modalBox">
-                <AddSc v-if="setModal" :setModal="setModal" :addOrEdit="addOrEdit" :searchSystem="searchSystem" :editRow="editRow" @getModal="getModal">
+                <AddSc v-if="setModal" :setModal="setModal" :addOrEdit="addOrEdit" :searchSystem="searchSystem"
+                    :editRow="editRow" @getModal="getModal">
                 </AddSc>
-                <DelSc v-if="delModal" :delModal="delModal" :delId="delId" :searchSystem="searchSystem" @delBack="delBack">
+                <DelSc v-if="delModal" :delModal="delModal" :delId="delId" :searchSystem="searchSystem"
+                    @delBack="delBack">
                 </DelSc>
             </div>
         </div>
@@ -49,6 +71,7 @@ import systemRow from '@/api/systemRow';
 import Pagination from './Pagination.vue';
 import AddSc from '../modalComp/AddSc.vue';
 import DelSc from '../modalComp/DelSc.vue'
+import { ElMenu, ElMessage } from 'element-plus';
 export default {
     setup() {
         let systemList = ref([])//系统字典列表数据
@@ -61,10 +84,64 @@ export default {
         let addOrEdit = ref(0)//控制编辑或新增tips
         let editRow = ref({})//编辑回显
         let reloadKey = ref(0)//重载组件
+        let treeFather = ref([])//树形组件父级
+        let defaultProps = ref({
+            label: "name",
+            codes: "code",
+            ids: 'id',
+            children: 'children'
+        })
+        let loading = ref(false)//加载动画
+        let pageCode = ref("")//分页组件需要的code
         function searchSystem() {//查询所有字典
-            systemRow.getAllRow({ pageindex: 1, pagesize: 10 }).then(res => {
-                systemList.value = res.data
-                totals.value = res.count
+            loading.value = true
+            systemList.value = []
+            systemRow.getChildren({}).then(res => {
+                // 拿到所有父级节点
+                if (res.data) {
+                    //赋值给树形节点
+                    treeFather.value = res.data.map(item => ({ ...item, children: [] }));
+                    //再调用接口拿下级
+                    systemRow.getAllRow({ pageindex: 1, pagesize: 9999999 }).then(oss => {
+                        // 遍历所有父级节点
+                        treeFather.value.forEach(parentNode => {
+                            // 遍历所有系统列表对象
+                            oss.data.forEach(childNode => {
+                                // 如果系统列表对象的 parentcode 等于当前父级节点的 code，则将系统列表对象添加到当前父级节点的 children 数组中
+                                if (childNode.parentcode === parentNode.code) {
+                                    // 确保当前父级节点有 children 数组，如果没有则创建
+                                    if (!parentNode.children) {
+                                        parentNode.children = [];
+                                    }
+                                    // 将系统列表对象添加到当前父级节点的 children 数组中
+                                    parentNode.children.push(childNode);
+                                }
+                            });
+                        });
+                    })
+                    loading.value = false
+                } else {
+                    loading.value = false
+                    messageFun(res.msg)
+                }
+            })
+        }
+        // 公共提示窗
+        function messageFun(msg) {
+            ElMessage({
+                message: msg,
+                type: "error"
+            })
+        }
+        function handleNodeClick(e) {
+            pageCode.value = e.code
+            systemRow.getChildren({ code: pageCode.value }).then(res => {
+                if (res.data) {
+                    systemList.value = res.data
+                    totals.value = res.data.length
+                } else {
+                    messageFun('未找到相关数据')
+                }
             })
         }
         function openModal(num, row) {//打开新增或编辑模态框
@@ -82,12 +159,12 @@ export default {
         function getBack(index, size) {//分页组件返回的数据
             pages.value = index
             sizes.value = size
-            systemRow.getAllRow({ pageindex: pages.value, pageSize: sizes.value }).then(res => {
+            systemRow.getAllRow({ pageindex: pages.value, pageSize: sizes.value, code: pageCode.value }).then(res => {
                 systemList.value = res.data
                 totals.value = res.count
             })
         }
-        function delBack(data,num) {//确认删除模态框返回的数据
+        function delBack(data, num) {//确认删除模态框返回的数据
             delModal.value = data
             reloadKey.value = num
         }
@@ -111,6 +188,12 @@ export default {
             delBack,//确认删除模态框返回的数据
             editRow,//编辑回显
             reloadKey,
+            treeFather,//树形父级
+            messageFun,//公共msg
+            defaultProps,//树形现实的数据key
+            handleNodeClick,//树形组件点击节点方法
+            loading,//加载方法
+            pageCode,//分页组件需要的code 
         }
     },
     components: {
@@ -134,4 +217,17 @@ export default {
     height: auto;
     text-align: center;
 }
+
+.el-tree {
+    width: calc(90%);
+    height: 72vh;
+    overflow-y: auto;
+}
+
+.tableBox {
+    width: 100%;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+}
 </style>

src/pages/system/components/InsideModule.vue

@@ -344,8 +344,8 @@ export default {
 }
 
 :deep(.lf-dnd-text) {
-    width: calc(100% - 8px);
-    height: 42px;
+    width: calc(100% - 6px);
+    height: 45px;
     border: 1px solid #d3daef;
     margin-left: 2px;
     color: #255CE7;
@@ -354,7 +354,7 @@ export default {
     background: #d3daef;
     border-radius: 3px;
     padding: 3px;
-    font-size: 14px;
+    font-size: 12px;
     font-weight: 400;
 }