6

src/pages/components/draw/DrawDesigns.vue

@@ -11,6 +11,7 @@
             :endTarget="endTarget" :numCase="numCase" :startText="startText" :endText="endText" :lineType="lineType"
             @lineBack="lineBack">
         </LineDouble>
+        <GroupModelAdd v-if="groupType" :groupType="groupType" :modelId="modelId" @groupBack="groupBack"></GroupModelAdd>
     </div>
 </template>
 
@@ -23,6 +24,7 @@ import { ElMessage } from 'element-plus';
 import { useRouter, useRoute } from 'vue-router';
 import AbilityModal from "../drawModal/AbilityModal.vue"
 import LineDouble from '../drawModal/LineDouble.vue';
+import GroupModelAdd from '../drawModal/GroupModelAdd.vue';
 import {
     DndPanel,
     SelectionSelect,
@@ -118,6 +120,7 @@ export default {
         let nodeid = ref("")//节点的id
         let fun = ref()//储存父节点传来的函数
         let funOne = ref()//储存父节点传来的函数
+        let groupType = ref(false)//GroupModelAdd.vue组件显示与否
         watch(() => props.lineMenuColor, (newVal) => {
             copyColor.value = newVal
         })
@@ -550,14 +553,16 @@ export default {
                     })
                     //当将节点托入画布后触发事件
                     lf.value.on('node:dnd-add',function (nodedata){
+                        console.log(nodedata,'node');
                         if(nodedata.data.type=='my-group'){
                             let nodeid=nodedata.data.id
                             // 添加的是分组节点，需要打开一个窗口让用户设置该节点的ied_type并保存到properties中
                             let ied_type="user set iedtype"
                             lf.value.getNodeModelById(nodeid).setProperties({
                                 ied_type: ied_type,
-                                id:0  //分组的装置类型id固定为0
+                                id:-99  //分组的装置类型id固定为0
                             });
+                            groupType.value = true
                         }
                     })
                     // lf.value.register(logicFlows)
@@ -582,6 +587,10 @@ export default {
         function lineBack(data) {
             ldModal.value = data
         }
+        // GroupModelAdd.vue返回状态
+        function groupBack(data){
+            groupType.value = data
+        }
         onBeforeUnmount(() => {
             // lf.value.remove()
             // coolObj.value = {}
@@ -625,11 +634,14 @@ export default {
             fun,//储存父节点传来的函数
             listMap,//组件初始化
             funOne,//储存父节点传来的函数
+            groupType,//GroupModelAdd.vue组件显示与否
+            groupBack,// GroupModelAdd.vue返回状态
         }
     },
     components: {
         AbilityModal,//功能模态框
         LineDouble,//连接线模态框
+        GroupModelAdd,//分组专属模态框
     }
 }
 </script>

src/pages/components/drawModal/AbilityModal.vue

@@ -3,7 +3,7 @@
         <el-dialog v-model="dialogVisible" title="装置功能配置" width="70%" @close="handleClose"
             :close-on-click-modal="false">
             <div style="border-bottom: 1px solid #dbdbdb;">
-            <h1>装置编码设置:</h1>
+                <h1>装置编码设置:</h1>
                 <span>默认装置编码:</span>
                 <el-input style="width:300px;margin: 10px 10px;" v-model="oldType" disabled></el-input>
                 <span>自定义装置编码:</span>
@@ -133,10 +133,10 @@ export default {
                 tableData.value = res.data
             })
             flow.getIedType({
-                id:modelIds.value-0,
-                ied_type:iedTypes.value
-            }).then(res=>{
-                console.log(res,'sadsdada');
+                id: modelIds.value - 0,
+                ied_type: iedTypes.value
+            }).then(res => {
+                newType.value = res.data
             })
         }
 
@@ -246,7 +246,7 @@ export default {
                 model_id: modelIds.value - 0
             }).then(res => {
                 loading.close()
-                if (res.code !=0) {
+                if (res.code != 0) {
                     ElMessage({
                         message: res.msg,
                         type: 'error'
@@ -257,13 +257,13 @@ export default {
                     model_id: modelIds.value - 0,
                     ied_type: iedTypes.value
                 }).then(res => {
-                    if (res.code == 0) {                            
+                    if (res.code == 0) {
                         tableData.value = res.data
                         ElMessage({
                             message: "端子已全部成功删除",
                             type: "success"
                         });
-                    }else{
+                    } else {
                         ElMessage({
                             message: res.msg,
                             type: "error"

src/pages/components/drawModal/GroupModelAdd.vue

@@ -0,0 +1,93 @@
+<template>
+    <div>
+        <el-dialog v-model="dialogVisible" title="装置端子关系配置" width="30%" @close="handleClose"
+            :close-on-click-modal="false">
+            <span>装置编码：</span>
+            <el-input v-model="iedValue" :maxlength="5" :show-word-limit="true" style="width: 300px;"
+                placeholder="请输入装置编码"></el-input>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="cancels">取消</el-button>
+                    <el-button type="primary" @click="sureClick">确定</el-button>
+                </span>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import { ref, onMounted, watch, onBeforeUnmount } from 'vue';
+import flow from '@/api/flow/flow';
+import { ElMessage, ElLoading } from 'element-plus';
+export default {
+    props: {
+        groupType: {
+            type: Boolean,
+            required: true,
+        },//模态框显示 
+        modelId: {
+            type: String,
+            required: true,
+        },//DrawDesigns.vue传过来的模型id
+    },
+    setup(props, { emit }) {
+        let dialogVisible = ref(false)//模态框打开/关闭状态
+        let iedValue = ref('')//输入框value值
+        let modelType = ref("")//本组件的模型id
+        // 初始化组件
+        function reload() {
+            dialogVisible.value = props.groupType
+            modelType.value = props.modelId
+        }
+        // 关闭模态框
+        function modalClose() {
+            dialogVisible.value = false
+            emit("groupBack", dialogVisible.value)
+        }
+        // 确认按钮
+        function modalSure() {
+            if (iedValue.value == '') {
+                ElMessage({
+                    message: "请输入正确的编码",
+                    type: "error"
+                })
+            } else {
+                flow.updateIedType({
+                    id: modelType.value - 0,
+                    old_iedtype: "",
+                    new_iedtype: iedValue.value
+                }).then(res => {
+                    if (res.code == 0) {
+                        ElMessage({
+                            message: "添加成功",
+                            type: "success"
+                        })
+                        dialogVisible.value = false
+                        emit("groupBack", dialogVisible.value)
+                    } else {
+                        ElMessage({
+                            message: res.msg,
+                            type: "error"
+                        })
+                    }
+                })
+
+            }
+        }
+        onMounted(() => {
+            reload()
+        })
+        return {
+            reload,//初始化组件函数
+            handleClose: modalClose,//关闭模态框函数替代关闭函数
+            cancels: modalClose,//关闭模态框函数替代关闭函数
+            sureClick: modalSure,//确认按钮函数替代确认函数
+            iedValue,//输入框value值
+            dialogVisible,//模态框状态
+            modelType,//本组件的模型id
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped></style>