虚回路信息，标题未写，侧边的数字展示差异项未完成

src/pages/netStructPicture/components/CidTree.vue

@@ -47,7 +47,7 @@
 import { ref, onMounted, toRefs, watch } from "vue";
 import cid from "@/api/cid/cid";
 import scdCheck from "@/api/scdCheck/scdCheck";
-import { stringify } from "uuid";
+import { compIedstatType } from "@/api/scdCheck/scdCheck2";
 import { useRoute } from "vue-router";
 const route = useRoute();
 const props = defineProps({
@@ -64,43 +64,54 @@ const props = defineProps({
     type: String,
     default: "",
   },
+  clickRowDatas: {
+    type: Object,
+    default: () => {},
+  },
 });
 const emit = defineEmits(["treeBack", "clickCode","treeBackDefalut"]);
 let tagList = ref(props.iedRelation);
 let tagChoose = ref('');
 let treeData = ref([
-  {
-    label: "装置信息",
-    itemcode: "ied",
-    children: [
-      {
-        label: "基本信息",
-        itemcode: "scd.ied",
-      },
-    ],
-  },
-  {
-    label: "通信参数",
-    itemcode: "Communication",
-    children: [
-      {
-        label: "通信接入点",
-        itemcode: "scd.ied.Communication",
-      },
-      {
-        label: "站控层通信参数",
-        itemcode: "scd.ied.Communication.S1",
-      },
-      {
-        label: "GOOSE 通信参数",
-        itemcode: "scd.ied.Communication.GSE",
-      },
-      {
-        label: "SV 通信参数",
-        itemcode: 'scd.ied.Communication.SMV',
-      },
-    ],
-  },
+{
+  label: "装置信息",
+  itemcode: "ied",
+  num:0,
+  children: [
+    {
+      label: "基本信息",
+      itemcode: "scd.ied",
+      num:0
+    },
+  ],
+},
+{
+  label: "通信参数",
+  itemcode: "Communication",
+  num:0,
+  children: [
+    {
+      label: "通信接入点",
+      itemcode: "scd.ied.Communication",
+      num:0,
+    },
+    {
+      label: "站控层通信参数",
+      itemcode: "scd.ied.Communication.S1",
+      num:0,
+    },
+    {
+      label: "GOOSE 通信参数",
+      itemcode: "scd.ied.Communication.GSE",
+      num:0,
+    },
+    {
+      label: "SV 通信参数",
+      itemcode: 'scd.ied.Communication.SMV',
+      num:0,
+    },
+  ],
+},
   {
     label: "测点信息",
     itemcode: "Point",
@@ -108,14 +119,17 @@ let treeData = ref([
       {
         label: "遥信",
         itemcode: "scd.ied.YX",
+        num:0,
       },
       {
         label: "遥控",
         itemcode: "scd.ied.YK",
+        num:0,
       },
       {
         label: "遥测",
         itemcode: "scd.ied.YC",
+        num:0,
       },
       {
         label: "遥脉",
@@ -125,59 +139,99 @@ let treeData = ref([
       {
         label: "定值",
         itemcode: "scd.ied.DZ",
+        num:0,
       },
     ],
   },
   {
     label: "回路配置",
     itemcode: "config",
+    num:0,
     children: [
       {
         label: "发布虚端子",
         itemcode: "scd.ied.FCDA",
+        num:0,
       },
       {
         label: "定阅虚端子",
         itemcode: "scd.ied.ExtRef",
+        num:0,
       },
       {
         label: "虚回路信息",
         itemcode: "scd.ied.Relation",
+        num:0,
       },
     ],
   },
   {
     label: "建模信息",
     itemcode: "model",
+    num:0,
     children: [
       {
         label: "数据集",
         itemcode: "scd.ied.DatSet",
+        num:0,
       },
       {
         label: "数据集成员",
         itemcode: "scd.ied.DatSetMeber",
+        num:0,
       },
       {
         label: "GOOSE控制块",
         itemcode: "scd.ied.GSEControl",
+        num:0,
       },
       {
         label: "SV控制块",
         itemcode: "scd.ied.SampledValueControl",
+        num:0,
       },
       {
         label: "报告控制块",
         itemcode: "scd.ied.ReportControl",
+        num:0,
       },
       {
         label: "日志控制块",
         itemcode: "scd.ied.LogControl",
+        num:0,
       },
     ],
   },
 ]);
+
 let needName = ref("");
+//得到差异项code的数字数据
+const codeStaticList = ref(null);
+const codeStatic = async () => {
+  const ids = clickRow.value ? clickRow.value.id : "";
+  const names = clickTage.value ? clickTage.value.ied_name :"";
+  const res = await compIedstatType({
+    comp_id: ids,
+    ied_name: names,
+    comptype: "u",
+  });
+  codeStaticList.value = res.data;
+  updateNum(treeData.value, codeStaticList.value);  
+  console.log('treeData.value', treeData.value)
+};
+const updateNum = (treeNode, data) => {
+  for (let node of treeNode) {  
+    // 检查当前节点的 itemcode 是否在 data 中  
+    if (data.hasOwnProperty(node.itemcode)) {  
+      node.num = parseInt(data[node.itemcode], 10);  
+    }  
+  
+    // 如果当前节点有子节点，递归处理子节点  
+    if (node.children) {  
+      updateNum(node.children, data);  
+    }  
+  }  
+}
 let defaultProps = ref({
   label: "label",
   children: "children",
@@ -206,8 +260,10 @@ const reload = () => {
     });
   }
 };
+const clickTage =ref(null);
 const tagClick = (row, num) => {
   tagChoose.value = num;
+  clickTage.value = row;
   cid
     .findFile({
       scd_id: route.query.id,
@@ -241,15 +297,27 @@ const tagClick = (row, num) => {
       //     emit("treeBack", needName.value, a[0].id);
       //   }
     });
+    codeStatic()
 };
+const clickRow = ref(props.clickRowDatas);
+//对比文件：头部对比的单个数据
+watch(
+  () => props.clickRowDatas,
+  (newValue) => {
+    if (newValue) {
+      clickRow.value = newValue;
+    }
+  }
+);
 const handleNodeClick = (e) => {
   emit("clickCode", e.itemcode);
 };
 onMounted(() => {
   tagChoose.value = props.iedRelation?Object.keys(props.iedRelation)[0]:'';
-  const rowDefalut = props.iedRelation?Object.values(props.iedRelation)[0]:'';
-    emit("treeBackDefalut",rowDefalut);
+  clickTage.value = props.iedRelation?Object.values(props.iedRelation)[0]:'';
+  emit("treeBackDefalut",clickTage.value);
   reload();
+  codeStatic()
 });
 </script>
 

src/pages/netStructPicture/components/Gsix.vue

@@ -1,7 +1,8 @@
 
+<!-- 一致性对比结果的画图 -->
 <script setup>
-import { computed, nextTick, onMounted, ref, watch } from "vue";
-import { compIedstatType, compResult } from "@/api/scdCheck/scdCheck2";
+import { nextTick, onMounted, ref, watch } from "vue";
+import { compResult } from "@/api/scdCheck/scdCheck2";
 import squer from "@/assets/image/CID/squer.png";
 import del0 from "@/assets/image/CID/del0.png";
 import modify0 from "@/assets/image/CID/modify0.png";
@@ -69,9 +70,9 @@ watch(
   (newValue) => {
     if (newValue) {
       cClickCode.value = newValue;
-      CodeImg(newValue);//找到差异项对应的图片进行展示
-      clickLineResult();//重置
-      clickLineResultMain();//重置
+      CodeImg(newValue); //找到差异项对应的图片进行展示
+      clickLineResult(); //重置
+      clickLineResultMain(); //重置
       loading.value = true;
       getData();
       nextTick(() => {
@@ -123,9 +124,10 @@ const getData = async () => {
     res.data.forEach((item) => {
       if (item.diff_desc) {
         let text;
-        text = item.diff_desc.replace(/[\r|\n|\t]/g, "");
+        text = item.diff_desc.replace(/[\r|\n|\t]/g, ""); //处理返回的数据中换行等，整理好规整数据
         item.diff_desc = JSON.parse(text);
       }
+      console.log("item", item);
       switch (item.diff_opt) {
         case "i": //新增
           leftI.value.push(item);
@@ -211,7 +213,8 @@ const newrightData = ref(null);
 const clickUpIdDomName = ref(null); //点击的name
 const clickUpTypeImgLeft = (arr, event, name) => {
   clickLineResult();
-  clickUpIdDomName.value = name;
+  clickUpIdDomName.value = name.replace(/[^\w\s]/g, ""); //如果有冒号query查找会报错，所以替换 成了点
+  console.log(" clickUpIdDomName.value", clickUpIdDomName.value);
   domListUpLeft.value = event.target;
   setTimeout(() => {
     setLeaderlines("UpLeft");
@@ -221,7 +224,7 @@ const clickUpTypeImgLeft = (arr, event, name) => {
 };
 const clickUpTypeImgRight = (arr, event, name) => {
   clickLineResult();
-  clickUpIdDomName.value = name;
+  clickUpIdDomName.value = name.replace(/[^\w\s]/g, "");
   domListUpRight.value = event.target;
   setTimeout(() => {
     setLeaderlines("UpRight");
@@ -517,14 +520,27 @@ const setLeaderlines = (types) => {
         }
       }
     }
-  } else if (types == "UpLeft" && domListUpLeft.value||types=='UpLeftBasic'&&cClickCode.value=='scd.ied') {
-    const startDom = types == "UpLeft"?domListUpLeft.value:document.getElementById('leftBasic');
-    const doms = document.querySelectorAll(`#${clickUpIdDomName.value}`);
+  } else if (
+    (types == "UpLeft" && domListUpLeft.value) ||
+    (types == "UpLeftBasic" && cClickCode.value == "scd.ied")
+  ) {
+    const startDom =
+      types == "UpLeft"
+        ? domListUpLeft.value
+        : document.getElementById("leftBasic");
+    console.log(
+      "first",
+      document.querySelectorAll(`#${clickUpIdDomName.value}`)
+    );
+    const doms =
+      types == "UpLeftBasic"
+        ? domListUpRight.value
+        : document.querySelectorAll(`#${clickUpIdDomName.value}`);
     let sameDom;
-    if(types == "UpLeft"){
+    if (types == "UpLeft") {
       sameDom = doms && doms.length > 1 ? doms[1] : doms[0]; //点击修改左侧或右侧每点击相同名字的dom
-    }else{
-      sameDom = document.getElementById('rightBasic'); //相同名字的dom
+    } else {
+      sameDom = document.getElementById("rightBasic"); //相同名字的dom
     }
     const lineStylUp = {
       ...lineStyleAdd,
@@ -598,7 +614,7 @@ const setLeaderlines = (types) => {
   }
   // else if(types=='UpLeftBasic'&&cClickCode.value=='scd.ied'){
   //   console.log('domListUpLeftName.value', domListUpLeftName.value)
-    
+
   // }
 };
 //滚动时重定位线条
@@ -730,7 +746,7 @@ onMounted(() => {
               clickUpTypeImgLeft(item.diff_desc, $event, item.diff_object_name)
             "
             :ref="(el) => setdomLeftMain(el, item.diff_object_name)"
-            :id="item.diff_object_name"
+            :id="item.diff_object_name.replace(/[^\w\s]/g, '')"
           >
             <div class="item-img">
               <img :src="codeImg" alt="" class="type-img" />
@@ -813,7 +829,7 @@ onMounted(() => {
             @click="
               clickUpTypeImgRight(item.diff_desc, $event, item.diff_object_name)
             "
-            :id="item.diff_object_name"
+            :id="item.diff_object_name.replace(/[^\w\s]/g, '')"
             :ref="(el) => setdomRightMain(el, item.diff_object_name)"
           >
             <div class="item-img">
@@ -869,7 +885,11 @@ onMounted(() => {
         </div>
       </div>
     </div>
-    <div class="middle-main" :class="{'middle-main-basic':cClickCode == 'scd.ied'}" ref="middleMain">
+    <div
+      class="middle-main"
+      :class="{ 'middle-main-basic': cClickCode == 'scd.ied' }"
+      ref="middleMain"
+    >
       <!-- 修改中间数据的名字 -->
       <div v-if="cClickCode != 'scd.ied'">
         <div v-for="(value, key) in newleftDataMiddle" :key="key">
@@ -1171,7 +1191,8 @@ onMounted(() => {
 .wraps {
   word-wrap: break-word;
 }
-.middle-main,.middle-main-basic{
+.middle-main,
+.middle-main-basic {
   width: 50%;
   position: absolute;
   left: 50%;
@@ -1194,8 +1215,8 @@ onMounted(() => {
     margin-bottom: 45px;
   }
 }
-.middle-main-basic{
-  top:50% !important;
-  transform: translate(-50%,-50%);
+.middle-main-basic {
+  top: 50% !important;
+  transform: translate(-50%, -50%);
 }
 </style>

src/pages/netStructPicture/components/ScdNow.vue

@@ -91,7 +91,8 @@
       @doneScl="doneScl"
       :checkDialogData="checkDialogData"
       :iedRelationData="iedRelationData"
-      :clickRowData ="clickRowData"
+      :clickRowData="clickRowData"
+      :recordDelIedVer="recordDelIedVer"
     ></scl-update>
     <div id="wrapperscd"></div>
   </div>
@@ -178,6 +179,7 @@ watch(
   (newValue) => {
     iedVer.value = {};
     clickRowData.value = {};
+    recordDelIedVer.value = null;
     if (newValue) {
       clickRowData.value = newValue;
       clickRow.value = true;
@@ -196,6 +198,7 @@ const detailData = ref(null);
 const scdVer = ref(null);
 const crcVer = ref(null);
 const iedVer = ref({});
+const recordDelIedVer = ref(null); //把删除的弹窗左侧列表记录传给点击修改后的弹窗，用于根据name找到删除项的ied_desc
 watch(
   () => props.scdipadMini,
   (newValue) => {
@@ -229,6 +232,7 @@ watch(
           iedVer.value[key].list.push(item);
         }
       }
+
       setTimeout(() => {
         lineWrite();
       }, 50);
@@ -251,7 +255,6 @@ const lookAddOrDel = async (comData, del) => {
   checkDialogData.value = null;
   scdView.value = true;
   const iedDetail = {};
-  console.log('comData', comData)
   for (let k = 0; k < comData.length; k++) {
     let item = comData[k];
     const key = item.ied_name;
@@ -262,31 +265,31 @@ const lookAddOrDel = async (comData, del) => {
   // 对键进行排序按a,b,c===
   keys.sort();
   for (let key of keys) {
-    // iedRelationData.value[key] = iedDetail[key];
-      // iedRelationData.value[key] = {...iedRelationData.value[key], ...iedDetail[key]};
+    iedRelationData.value[key] = iedDetail[key];
   }
-  console.log('iedRelationData.value', iedRelationData.value)
   if (del == "del" && clickRowData.value.target_id) {
-    delScdId.value = clickRowData.value.target_id;
+    delScdId.value = clickRowData.value.target_id; //点击删除的scdid要用对比文件的
   } else if (del == "add") {
     delScdId.value = route.query.id;
+  } else if (del == "edit") {
+    recordDelIedVer.value = iedVer.value ? iedVer.value.d.list : null;
   }
   // 对键进行排序===
   // if (del != "edit") {
-    const iedRes = await scdIedRelation({
-      scd_id: delScdId.value,
-      ied_name: comData[0].ied_name,
-      reset: 1,
-    });
-    checkDialogData.value = iedRes.data
-      ? iedRes.data[comData[0].ied_name]
-      : null;
-      if (del != "edit") {
+  const iedRes = await scdIedRelation({
+    scd_id: delScdId.value,
+    ied_name: comData[0].ied_name,
+    reset: 1,
+  });
+
+  checkDialogData.value = iedRes.data ? iedRes.data[comData[0].ied_name] : null;
+  if (del != "edit") {
     openBig.value = true;
   }
 };
 const lookAdd = async (comData) => {
-  console.log('comData=====', comData)
+  console.log("comData=====", comData);
+  lookAddOrDel(comData, "add");
   // lookType.value = 1;
   // emit("nowBack", lookType.value);
 };

src/pages/netStructPicture/components/SclUpdate.vue

@@ -23,6 +23,10 @@ const props = defineProps({
     type: Object,
     default: () => {},
   },
+  recordDelIedVer:{//删除的列表数据，从scdNow中获取的 
+    type: Array,
+    default: () => [],
+  }
 });
 const UPdate = ref("update");
 const newChicken = route.query.stationName;
@@ -113,6 +117,7 @@ onMounted(() => {});
           @treeBack="treeBack"
           @treeBackDefalut="treeBackDefalut"
           @clickCode="clickCode"
+          :clickRowDatas="clickRowDatas"
           :OpensclTrue="OpensclTrue"
           :iedRelation="iedRelation"
         ></CidTree>
@@ -132,6 +137,7 @@ onMounted(() => {});
               >
             </div>
           </div>
+          <!-- 一致性对比结果的画图 -->
           <Gsix
             v-if="clickCodeValue != 'scd.ied.Relation'"
             :clickRowDatas="clickRowDatas"
@@ -147,6 +153,7 @@ onMounted(() => {});
             v-else-if="clickCodeValue == 'scd.ied.Relation'"
             style="height: 67vh; overflow-y: auto"
           >
+          <!-- 一致性对比结果的虚回路画图 -->
             <virtualnformation
               :virtualScd="virtualScd"
               :clickRowDatas="clickRowDatas"
@@ -155,6 +162,7 @@ onMounted(() => {});
               :checkData="checkData"
               :OpensclTrue="OpensclTrue"
               @result="result"
+              :recordDelIedVer="recordDelIedVer"
             ></virtualnformation>
           </div>
         </div>

src/pages/netStructPicture/components/virtualRelation.vue

@@ -53,7 +53,7 @@
               {{ item.no }}
             </div>
             <div class="midlestyle" v-if="!item.isDecollate">
-              <div v-if="item.attr_da_name == 'general'">
+              <div v-if="item.attr_da_name == 'in'">
                 {{
                   `${item.attr_ld_inst}/${item.attr_ln_class}${item.attr_ln_inst}.${item.attr_do_name}.${item.attr_da_name}`
                 }}

src/pages/netStructPicture/components/virtualnformation.vue

@@ -4,17 +4,12 @@
     <!-- 关联图 -->
     <div class="main-cont" id="treedom3">
       <div class="main-left">
-        <div
-          v-for="(item, index) in leftList"
-          :key="index"
-          class="conts"
-          @click="clickImg(item)"
-        >
+        <div v-for="(item, index) in leftList" :key="index" class="conts">
           <div class="cont-title">
             <img :src="devicePng" alt="" class="img-item" />
             <div class="cont-item">
               <div>{{ item.ref_ied_desc }}</div>
-              <div>{{ item.ref_ied_name }}</div>
+              <div>{{ item.ied_name }}</div>
             </div>
           </div>
           <div
@@ -39,7 +34,7 @@
           <img :src="devicePng" alt="" class="img-item" />
           <div class="middle-title" v-if="tagList">
             <div>{{ tagList.desc }}</div>
-            <div>{{tagList.ied_name}}</div>
+            <div>{{ tagList.ied_name }}</div>
           </div>
         </div>
         <div class="middle-item">
@@ -121,17 +116,12 @@
       </div>
       <!-- 右侧 -->
       <div class="main-right">
-        <div
-          v-for="(item, index) in rightList"
-          :key="index"
-          class="conts"
-          @click="clickImg(item)"
-        >
+        <div v-for="(item, index) in rightList" :key="index" class="conts">
           <div class="cont-title">
             <img :src="devicePng" alt="" class="img-item" />
             <div class="cont-item">
               <div>{{ item.ref_ied_desc }}</div>
-              <div>{{ item.ref_ied_name }}</div>
+              <div>{{ item.ied_name }}</div>
             </div>
           </div>
           <div
@@ -180,6 +170,11 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  recordDelIedVer: {
+    //删除的列表数据，从sclUpdate中获取的
+    type: Array,
+    default: () => [],
+  },
 });
 const svInfo = ref(null);
 //处理两边的数据
@@ -187,20 +182,14 @@ const processBoth = (list, svResInfo, inoutType) => {
   list.forEach((item, index) => {
     item.titleItems = [];
     svResInfo.data.forEach((key) => {
-      if (key.ied_name == item.ref_ied_name) {
-        if (
-          (item.titleItems.length < 1 && key.inout_type == inoutType) ||
-          (!item.titleItems.some(
-            (titleKey) => titleKey.ref_ied_name == key.ied_name
-          ) &&
-            key.inout_type === inoutType)
-        ) {
+      if (key.ied_name == item.ied_name) {
+        if (key.inout_type == inoutType) {
           item.titleItems.push(key);
         }
       }
     });
   });
-  console.log('list=========', list)
+  console.log("list=========", list);
 };
 let leaderLines3 = ref([]); //控制线条显示
 const leftList = ref([]);
@@ -208,7 +197,6 @@ const rightList = ref([]);
 const domListMiddle3 = ref(new Map()); //获取中间所有的ref
 const domListRightChild3 = ref(new Map()); //获取右侧所有子的ref
 const domListLeftChild3 = ref(new Map()); //获取中间所有子的ref
-const listData3 = ref(null); //线条左右两侧的数据
 const emit = defineEmits(["result"]); //如果不加这个再次点击左侧会没有反应
 const setdomMiddle3 = (el, item) => {
   // 中间dom
@@ -263,8 +251,10 @@ watch(
   }
 );
 // //scd一致性对比====
+const bothdataList = ref([]); //处理得到总的两边的数据
 //得到中间的子版块数据
 const getNetworkInfo3 = async () => {
+  bothdataList.value = [];
   let svResInfo;
   //scd一致性对比====
   const ids = clickRow.value ? clickRow.value.id : "";
@@ -291,10 +281,24 @@ const getNetworkInfo3 = async () => {
     no: "",
     isDecollate: true,
   };
-//省略号===
+  //省略号===
   svResInfo.data.sort(function (a, b) {
     return a.no - b.no; // 从小到大排序
   });
+  //得到两边总的每个版块的ied_name名称
+  const maps = new Map();
+  svResInfo.data.forEach((item) => {
+    const key = item.ied_name + item.inout_type; //输入输出都是需要的
+    if (!maps.has(key)) {
+      maps.set(key, true);
+      if (item.inout_type == "in") {
+        leftList.value.push(item);
+      } else if (item.inout_type == "out") {
+        rightList.value.push(item);
+      }
+    }
+  });
+  console.log(rightList.value, "bothdataList.value", leftList.value);
   //处理两边的数据
   if (svResInfo.data.length > 0) {
     processBoth(leftList.value, svResInfo, "in");
@@ -492,7 +496,8 @@ watch(
     margin-left: 8px;
   }
 }
-.main-right {
+.main-right,
+.main-left {
   display: flex;
   @include left-and-right;
   .img-item {