scd一致性校验的新增删除，还有问题

src/api/scdCheck/scdCheck2.js

@@ -29,4 +29,12 @@ export function compStart(data) {
     data
   })
 }
+//scd文件开始对比查看
+export function compstatView(data) {
+  return request({
+    url: '/scd/comp/stat/result',
+    method: 'get',
+    params:data
+  })
+}
 

src/pages/netStructPicture/components/ScdNow.vue

@@ -1,59 +1,91 @@
 <template>
-  <div class="main">
-    <div class="scdBox">
-      <div class="navs">
-        <img src="../../../assets/image/squer_scd.png" alt="" />
-        <p>SCD版本</p>
-      </div>
-      <div>
-        <div id="oldScd">
-          <img src="../../../assets/icon/cilce_gray.png" alt="" />
-          <span>V1.1.0</span>
+  <div>
+    <div class="main" v-if="detailData">
+      <div class="scdBox">
+        <div class="navs">
+          <img src="../../../assets/image/squer_scd.png" alt="" />
+          <p>SCD版本</p>
         </div>
-        <img :src="jiantouPng" alt="" class="jiantou" />
-        <div id="newScd">
-          <img src="../../../assets/icon/clice_blue.png" alt="" />
-          <span>1000000111100022</span>
+        <div>
+          <div id="oldScd">
+            <img
+              src="../../../assets/icon/cilce_gray.png"
+              alt=""
+              class="circel-png"
+            />
+            <span v-if="scdVer && scdVer[1] != ''">{{ scdVer[0] }}</span>
+            <span v-else>无</span>
+          </div>
+          <img :src="jiantouPng" alt="" class="jiantou" />
+          <div id="newScd">
+            <img
+              src="../../../assets/icon/clice_blue.png"
+              alt=""
+              class="circel-png"
+            />
+            <span v-if="scdVer">{{ scdVer[0] }}</span>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="crcBox">
-      <div class="navs">
-        <img src="../../../assets/image/squer_crc.png" alt="" />
-        <p>CRC</p>
+      <div class="crcBox">
+        <div class="navs">
+          <img
+            src="../../../assets/image/squer_crc.png"
+            alt=""
+            class="circel-png"
+          />
+          <p>CRC</p>
+        </div>
+        <div>
+          <div id="oldCrc">
+            <img
+              src="../../../assets/icon/cilce_gray.png"
+              alt=""
+              class="circel-png"
+            />
+            <span v-if="crcVer && crcVer[1] != ''">{{ crcVer[1] }}</span>
+            <span v-else>无</span>
+          </div>
+          <img :src="jiantouPng" alt="" class="jiantou" />
+          <div id="newCrc">
+            <img src="../../../assets/icon/clice_blue.png" alt="" />
+            <span v-if="crcVer">{{ crcVer[0] }}</span>
+          </div>
+        </div>
       </div>
-      <div>
-        <div id="oldCrc">
-          <img src="../../../assets/icon/cilce_gray.png" alt="" />
-          <span>1000000111100000</span>
+      <div class="iedBox">
+        <div id="oldIed">
+          <img src="../../../assets/image/squer_ied.png" alt="" />
+          <p>IED</p>
         </div>
-        <img :src="jiantouPng" alt="" class="jiantou" />
-        <div id="newCrc">
-          <img src="../../../assets/icon/clice_blue.png" alt="" />
-          <span>1000000111100022</span>
+        <div id="newIed" v-if="iedVer">
+          <p id="addId" @click="lookAdd">
+            <img :src="newlyPng" alt="" class="icons" />
+            <span style="color: #134bea">新增({{ iedVer.i.list.length }})</span>
+          </p>
+          <p id="editId" @click="lookEdit">
+            <img :src="modifyPng" alt="" class="icons" />
+            <span style="color: #ffcb11">修改({{ iedVer.u.list.length }})</span>
+          </p>
+          <p id="delId" @click="lookDel">
+            <img :src="delPng" alt="" class="icons" />
+            <span style="color: #e50505">删除({{ iedVer.d.list.length }})</span>
+          </p>
         </div>
       </div>
     </div>
-    <div class="iedBox">
-      <div id="oldIed">
-        <img src="../../../assets/image/squer_ied.png" alt="" />
-        <p>IED</p>
-      </div>
-      <div id="newIed">
-        <p id="addId" @click="lookAdd">
-          <img :src="newlyPng" alt="" class="icons"/>
-          <span style="color: #134BEA">新增(5)</span>
-        </p>
-        <p id="editId" @click="lookEdit">
-          <img :src="modifyPng" alt="" class="icons" />
-          <span style="color: #FFCB11">修改(10)</span>
-        </p>
-        <p id="delId" @click="lookDel">
-          <img :src="delPng" alt="" class="icons"/>
-          <span style="color: #E50505">删除(2)</span>
-        </p>
-      </div>
+    <div v-else-if="clickRow" class="no-data">当前两个SCD文件没有差异!</div>
+    <div v-else-if="!clickRow" class="no-data">
+      请选择比对记录或创建新的比对
     </div>
+    <dialog-index
+      :openBig="openBig"
+      @done="done"
+      :checkDialogData="checkDialogData"
+      :iedRelationData="iedRelationData"
+      :scdView = "scdView"
+    ></dialog-index>
+    <div id="wrapperscd"></div>
   </div>
 </template>
 
@@ -67,20 +99,35 @@ import {
   defineEmits,
 } from "vue";
 import LeaderLine from "../../../../public/leader-line.min.js";
+import dialogIndex from "./dialogIndex.vue";
 import jiantouPng from "@/assets/image/scdcheck/jiantou.png";
 import modifyPng from "@/assets/image/scdcheck/modify.png";
 import newlyPng from "@/assets/image/scdcheck/newly.png";
 import delPng from "@/assets/image/scdcheck/del.png";
-let lineList = [];
+import { useRoute } from "vue-router";
+import { scdIedRelation } from "@/api/iedNetwork";
+const props = defineProps({
+  scdipadMini: {
+    type: Array,
+    default: () => [],
+  },
+  clickView: {
+    type: Object,
+    default: () => {},
+  },
+});
+let lineList = ref([]);
 let lookType = ref(0);
+const route = useRoute();
 const emit = defineEmits(["nowBack"]);
+const openBig = ref(false);
 const lineWrite = () => {
   let oldIed = document.getElementById("oldIed");
   let newIed = document.getElementById("newIed");
   let addId = document.getElementById("addId");
   let editId = document.getElementById("editId");
   let delId = document.getElementById("delId");
-  lineList.push(
+  lineList.value.push(
     new LeaderLine(oldIed, addId, {
       color: "#7484AB", //连接线颜色
       size: 2, //连接线宽度
@@ -91,7 +138,7 @@ const lineWrite = () => {
       endPlugSize: 2, //结束箭头size
     })
   );
-  lineList.push(
+  lineList.value.push(
     new LeaderLine(oldIed, editId, {
       color: "#7484AB", //连接线颜色
       size: 2, //连接线宽度
@@ -102,7 +149,7 @@ const lineWrite = () => {
       endPlugSize: 2, //结束箭头size
     })
   );
-  lineList.push(
+  lineList.value.push(
     new LeaderLine(oldIed, delId, {
       color: "#7484AB", //连接线颜色
       size: 2, //连接线宽度
@@ -113,11 +160,118 @@ const lineWrite = () => {
       endPlugSize: 2, //结束箭头size
     })
   );
+  hiddenLine2();
+  console.log("lineList.value", lineList.value);
 };
-const lookAdd = () => {
-  lookType.value = 1;
-  emit("nowBack", lookType.value);
+const clickRow = ref(false);
+watch(
+  () => props.clickView,
+  (newValue) => {
+    if (newValue) {
+      clickRow.value = true;
+      detailData.value = null;
+      iedVer.value = {};
+      lineList.value.forEach((item) => item.remove());
+      lineList.value = [];
+    }
+  }
+);
+const detailData = ref(null);
+const scdVer = ref(null);
+const crcVer = ref(null);
+const iedVer = ref({});
+watch(
+  () => props.scdipadMini,
+  (newValue) => {
+    if (newValue && clickRow) {
+      detailData.value = newValue;
+      // SCD版本数据
+      const scdv = detailData.value.filter(
+        (item) => item.diff_object_type == "scd.version"
+      );
+      scdVer.value =
+        scdv && scdv[0].diff_desc ? JSON.parse(scdv[0].diff_desc) : null;
+      // CRC版本数据
+      const crcV = detailData.value.filter(
+        (item) => item.diff_object_type == "scd.crc"
+      );
+      crcVer.value =
+        crcV && crcV[0].diff_desc ? JSON.parse(crcV[0].diff_desc) : null;
+      //IED版本数据，diff_opt中u是修改，i是新增，d是删除
+      const iedV = detailData.value.filter(
+        (item) => item.diff_object_type == "scd.ied"
+      );
+      for (let k = 0; k < iedV.length; k++) {
+        let item = iedV[k];
+        const key = item.diff_opt;
+        if (iedVer.value[key] == null) {
+          iedVer.value[key] = {
+            list: [item],
+          };
+        } else {
+          iedVer.value[key].list.push(item);
+        }
+      }
+      setTimeout(() => {
+        lineWrite();
+      }, 50);
+    }
+  }
+);
+//弹窗====
+const checkDialogData = ref(null);//选择弹框的第一条数据
+const done = (emits) => {
+  openBig.value = emits;
+  checkDialogData.value = null;
+  scdView.value = false;
+};
+const iedRelationData = ref({});//左侧所有数据
+const scdView = ref(false);//是否是点击Scd文件一致性校核进入的
+const lookAdd =async () => {
+  scdView.value = true;
+
+  for (let k = 0; k < iedVer.value.i.list.length; k++) {
+    let item = iedVer.value.i.list[k];
+    const key = item.ied_name;
+    iedRelationData.value[key] = item;
+  }
+  console.log('iedRelationData.value', iedRelationData.value)
+  const iedRes = await scdIedRelation({ scd_id: route.query.id,ied_name:'CE2201',reset: 1 });
+  checkDialogData.value = iedRes.data['CE2201'];
+  openBig.value = true;
+
+  // lookType.value = 1;
+  // emit("nowBack", lookType.value);
 };
+const hiddenLine2 = () => {
+  const elmWrapper = document.getElementById("wrapperscd");
+  // 移动 line
+  document.body.querySelectorAll("body>.leader-line").forEach((node) => {
+    elmWrapper.appendChild(node);
+  });
+  elmWrapper.style.transform = "none";
+  var rectWrapper = elmWrapper.getBoundingClientRect();
+  elmWrapper.style.transform = `translate(${
+    (rectWrapper.left + window.scrollY) * -1
+  }px, ${(rectWrapper.top + window.scrollX) * -1}px)`;
+};
+watch(
+  () => openBig.value,
+  (newValue) => {
+    lineList.value = [];
+    const elmWrapper = document.getElementById("wrapperscd");
+    if (elmWrapper) {
+      elmWrapper.querySelectorAll(".leader-line").forEach((node) => {
+        node.remove();
+      });
+    }
+    if (!newValue) {
+      setTimeout(() => {
+        lineWrite(); //时间400是一定需要的，不然显示了会马上删除，暂未找到原因
+      }, 400);
+    }
+  }
+);
 const lookEdit = () => {
   lookType.value = 2;
   emit("nowBack", lookType.value);
@@ -126,13 +280,9 @@ const lookDel = () => {
   lookType.value = 3;
   emit("nowBack", lookType.value);
 };
-onMounted(() => {
-  setTimeout(() => {
-    lineWrite();
-  }, 500);
-});
+onMounted(() => {});
 onBeforeUnmount(() => {
-  lineList.forEach((item) => item.remove());
+  // lineList.value.forEach((item) => item.remove());
 });
 </script>
 
@@ -146,8 +296,10 @@ p {
   padding: 0;
   font-size: 16px;
 }
-.scdBox,.crcBox,.iedBox {
-  width:23%;
+.scdBox,
+.crcBox,
+.iedBox {
+  width: 23%;
   height: auto;
   text-align: center;
   /* border: 1px solid red; */
@@ -163,18 +315,20 @@ p {
   position: absolute;
   right: -50px;
   margin-top: 24px;
-  span{
+  span {
     font-size: 16px;
   }
 }
 
-#addId,#editId,#delId {
+#addId,
+#editId,
+#delId {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 112px;
   height: 40px;
-  border: 2px dashed #255CE7;
+  border: 2px dashed #255ce7;
   background-color: rgb(239, 243, 255);
   border-radius: 2px;
   margin-bottom: 20px;
@@ -182,12 +336,12 @@ p {
 }
 
 #editId {
-  border: 2px dashed #FFCB11;
+  border: 2px dashed #ffcb11;
   background-color: rgb(255, 251, 242);
 }
 
 #delId {
-  border: 2px dashed #E50505;
+  border: 2px dashed #e50505;
   background-color: rgb(255, 236, 236);
 }
 .jiantou {
@@ -209,9 +363,16 @@ p {
   font-size: 16px;
   margin-bottom: 24px;
 }
-.icons{
-    width: 20px;
-    height: 20px;
-    margin-right: 4px;
+.icons {
+  width: 20px;
+  height: 20px;
+  margin-right: 4px;
+}
+.circel-png {
+  margin-right: 4px;
+}
+.no-data {
+  text-align: center;
+  margin-top: 40px;
 }
 </style>

src/pages/netStructPicture/components/basicInfo.vue

@@ -643,7 +643,7 @@ watch(
 const removeLine2 = () => {
   const elmWrapper = document.getElementById("wrappers");
   if (elmWrapper) {
-    document.body.querySelectorAll("body .leader-line").forEach((node) => {
+    document.body.querySelectorAll("#wrappers .leader-line").forEach((node) => {
       elmWrapper.removeChild(node);
     });
   }

src/pages/netStructPicture/components/dialogIndex.vue

@@ -140,6 +140,7 @@ const iedRelation = ref(null);
 watch(
   () => props.iedRelationData,
   (newValue) => {
+    console.log('iedRelation.value111111111',newValue)
     iedRelation.value = newValue;
   }
 );
@@ -157,7 +158,7 @@ const searchInput = ref("");
 //搜索ied编码或名称
 const searchIedList = ref([]);
 const searchClick = (value) => {
-  if (value) {
+  if (value&&iedRelation.value) {
     iedRelation.value = Object.values(iedRelation.value).filter((item) => {
       const lowercaseValue = value.toLowerCase(); //不区分大小写
       const iedNameLower = item.ied_name ? item.ied_name.toLowerCase() : null;

src/pages/netStructPicture/components/inoutControl.vue

@@ -671,7 +671,7 @@ const setLine2 = () => {
 const removeLine2 = () => {
   const elmWrapper = document.getElementById("wrapper");
   if (elmWrapper) {
-    elmWrapper.querySelectorAll("body .leader-line").forEach((node) => {
+    elmWrapper.querySelectorAll("#wrapper .leader-line").forEach((node) => {
       elmWrapper.removeChild(node);
       // node.remove();
     });

src/pages/netStructPicture/components/relationShip.vue

@@ -362,7 +362,7 @@ const setLine = () => {
 const removeLine = () => {
   const elmWrapper = document.getElementById("wrapper");
   if (elmWrapper) {
-    document.body.querySelectorAll("body .leader-line").forEach((node) => {
+    document.body.querySelectorAll("#wrapper .leader-line").forEach((node) => {
       elmWrapper.removeChild(node);
     });
   }

src/pages/netStructPicture/components/scdMap.vue

@@ -1,276 +1,191 @@
 <template>
-    <div>
-        <div class="fileBox">
-            <div>
-                <span style="border-right: 1px solid #516380;padding-right: 200px;">基准文件:
-                    <!-- {{ chicken }} -->
-                    <span style="color:#09162C;">{{ newChicken}}</span></span>
-            </div>
-            <div>
-                <span>对比文件:<span style="color:#09162C;">{{ kun }}</span></span>
-            </div>
-        </div>
-        <!-- <div class="mapBox" v-if="lookType == 0"> -->
-        <!-- <div class="scdBox">
-                <div>
-                    <img src="../../../assets/image/squer_scd.png" alt="">
-                    <p>SCD版本</p>
-                </div>
-                <div>
-                    <div id="oldScd">
-                        <img src="../../../assets/icon/cilce_gray.png" alt="">
-                        <span>V1.1.0</span>
-                    </div>
-                    <div id="newScd">
-                        <img src="../../../assets/icon/clice_blue.png" alt="">
-                        <span>V1.1.1</span>
-                    </div>
-                </div>
-            </div>
-            <div class="crcBox">
-                <div>
-                    <img src="../../../assets/image/squer_crc.png" alt="">
-                    <p>CRC</p>
-                </div>
-                <div>
-                    <div id="oldCrc">
-                        <img src="../../../assets/icon/cilce_gray.png" alt="">
-                        <span>1000000111100000</span>
-                    </div>
-                    <div id="newCrc">
-                        <img src="../../../assets/icon/clice_blue.png" alt="">
-                        <span>1000000111100022</span>
-                    </div>
-                </div>
-            </div>
-            <div class="iedBox">
-                <div id="oldIed">
-                    <img src="../../../assets/image/squer_ied.png" alt="">
-                    <p>IED</p>
-                </div>
-                <div id="newIed">
-                    <p id="addId" @click="lookAdd">
-                        <el-icon style="color: #1D48E8;font-size: 18px;display: block;">
-                            <CirclePlus />
-                        </el-icon>
-                        <span style="display: block;color: #1D48E8;">新增(5)</span>
-                    </p>
-                    <p id="editId" @click="lookEdit">
-                        <el-icon style="color: #FECC2A;font-size: 18px;display: block;">
-                            <EditPen />
-                        </el-icon>
-                        <span style="display: block;color: #FECC2A;">修改(10)</span>
-                    </p>
-                    <p id="delId" @click="lookDel">
-                        <el-icon style="color: red;font-size: 18px;display: block;">
-                            <Delete />
-                        </el-icon>
-                        <span style="display: block;color: red;">删除(2)</span>
-                    </p>
-                </div>
-            </div> -->
-        <!-- </div> -->
-        <div class="right-main">
-            <ScdNow v-if="lookType == 0" @nowBack="nowBack" :arrNew="arrNew"></ScdNow>
-        </div>
-        <ScdAdd v-if="lookType == 1" :arrNew="arrNew"></ScdAdd>
-        <ScdDel v-if="lookType == 3" :arrNew="arrNew"></ScdDel>
-        <ScdEdit v-if="lookType == 2" :arrNew="arrNew"></ScdEdit>
+  <div>
+    <div class="fileBox">
+      <div>
+        <span style="border-right: 1px solid #516380; padding-right: 30px"
+          >基准文件: <span style="color: #09162c">{{ newChicken }}</span></span
+        >
+      </div>
+      <div style="padding-left: 30px">
+        <span
+          >对比文件:<span style="color: #09162c" v-if="clickViewData">{{
+            clickViewData.target_name
+          }}</span></span
+        >
+      </div>
     </div>
+    <div class="right-main">
+      <ScdNow
+        v-if="lookType == 0"
+        @nowBack="nowBack"
+        :arrNew="arrNew"
+        :clickView="clickView"
+        :scdipadMini="scdipadMini"
+      ></ScdNow>
+    </div>
+    <ScdAdd v-if="lookType == 1" :arrNew="arrNew"></ScdAdd>
+    <ScdDel v-if="lookType == 3" :arrNew="arrNew"></ScdDel>
+    <ScdEdit v-if="lookType == 2" :arrNew="arrNew"></ScdEdit>
+  </div>
 </template>
 
-<script>
-import { ref, onMounted, toRefs, watch, onBeforeUnmount } from 'vue';
-import LeaderLine from '../../../../public/leader-line.min.js';
-import scdCheck from '@/api/scdCheck/scdCheck'
-import image from "../utils/image"
-import ScdAdd from './ScdAdd.vue';
-import ScdDel from './ScdDel.vue';
-import ScdEdit from './ScdEdit.vue';
-import ScdNow from './ScdNow.vue';
-import { ElLoading } from 'element-plus';
+<script setup>
+import { ref, onMounted, toRefs, watch, onBeforeUnmount } from "vue";
+import LeaderLine from "../../../../public/leader-line.min.js";
+import scdCheck from "@/api/scdCheck/scdCheck";
+import image from "../utils/image";
+import ScdAdd from "./ScdAdd.vue";
+import ScdDel from "./ScdDel.vue";
+import ScdEdit from "./ScdEdit.vue";
+import ScdNow from "./ScdNow.vue";
+import { ElLoading } from "element-plus";
 import { useRoute } from "vue-router";
-export default {
-    props: {
-        antherBack: {
-            type: Array,
-            required: true
-        },
-        activeNav: {
-            type: Number,
-            required: true
-        }
-    },
-    setup(props, { emit }) {
-        let arrNew = ref([])
-        let chicken = ref('')
-        const route = useRoute();
-        let kun = ref('')
-        let lineList = []//线条显示
-        let lookType = ref(0)//0为查看整体，1为新增，2为修改，3为删除
-        watch(() => props.antherBack, (newVal) => {
-            if(newVal == null) return
-            arrNew.value = newVal//监听传递数据变化
-            if (!arrNew.value || !newVal) {
-                return
-            } else {
-                if (arrNew.value.length == 1) {
-                    chicken.value = arrNew.value[0].scd_name
-                }
-                if (arrNew.value.length == 2) {
-                    chicken.value = arrNew.value[0].scd_name
-                    kun.value = arrNew.value[1].scd_name
-                }
-            }
-
-        })
-        function lastList() {//初始化数据
-            lookType.value = 0
-            arrNew.value = props.antherBack
-            if (!arrNew.value || !props.antherBack) {
-                if (arrNew.value.length == 1) {
-                    chicken.value = arrNew.value[0].scd_name
-                }
-                if (arrNew.value.length == 2) {
-                    chicken.value = arrNew.value[0].scd_name
-                    kun.value = arrNew.value[1].scd_name
-                }
-            }
-        }
-        function nowBack(data) {
-            lookType.value = data
-        }
-        const openFullScreen2 = () => {
-            const loading = ElLoading.service({
-                lock: true,
-                text: '正在加载',
-                background: 'rgba(0, 0, 0, 0.7)',
-            })
-            setTimeout(() => {
-                loading.close()
-            }, 2000)
-        }
-        const newChicken = ref('')
-        onMounted(() => {
-            newChicken.value = route.query.stationName;
-            lastList()
-            openFullScreen2()
-        })
-        onBeforeUnmount(() => {
-            lookType.value = 0
-            lineList.forEach(line => line.remove());//清除连线
-        })
-        return {
-            chicken,//基准文件
-            kun,//对比文件
-            arrNew,//传递数组
-            lastList,//初始化数据
-            lineList,//线条显示
-            lookType,//0为查看整体，1为新增，2为修改，3为删除
-            nowBack,
-            openFullScreen2,//加载
-            newChicken
-        }
-    },
-    components: {
-        ScdAdd,
-        ScdDel,
-        ScdEdit,
-        ScdNow
-    }
+const props = defineProps({
+  antherBack: {
+    type: Array,
+    required: true,
+  },
+  activeNav: {
+    type: Number,
+    required: true,
+  },
+  clickView: {
+    type: Object,
+    default: () => {},
+  },
+  scdipadMini: {
+    type: Array,
+    default: () => [],
+  },
+});
+let arrNew = ref([]);
+const route = useRoute();
+let lineList = []; //线条显示
+let lookType = ref(0); //0为查看整体，1为新增，2为修改，3为删除
+function nowBack(data) {
+  lookType.value = data;
 }
+const openFullScreen2 = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: "正在加载",
+    background: "rgba(0, 0, 0, 0.7)",
+  });
+  setTimeout(() => {
+    loading.close();
+  }, 300);
+};
+const newChicken = ref(""); //基准文件
+const clickViewData  = ref(null);
+watch(
+  () => props.clickView,
+  (newValue) => {
+    if (newValue) {
+        clickViewData.value = newValue
+    }
+  }
+);
+onMounted(() => {
+  newChicken.value = route.query.stationName;
+  openFullScreen2();
+});
+onBeforeUnmount(() => {
+  lookType.value = 0;
+  lineList.forEach((line) => line.remove()); //清除连线
+});
 </script>
 
 <style scoped lang="scss">
 p {
-    margin: 0;
-    padding: 0;
+  margin: 0;
+  padding: 0;
 }
 
 .fileBox {
-    width: 90%;
-    height: 40px;
-    background-color: white;
-    margin: 10px auto;
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
-    color: #516380;
+  width: 90%;
+  height: 40px;
+  background-color: white;
+  margin: 10px auto;
+  display: flex;
+  font-size: 14px;
+  justify-content: center;
+  align-items: center;
+  color: #516380;
 }
 
 .mapBox {
-    width: 100%;
-    height: calc(100vh - 350px);
-    margin: 0 auto;
-    display: flex;
-    justify-content: space-around;
-    align-items: flex-start;
+  width: 100%;
+  height: calc(100vh - 350px);
+  margin: 0 auto;
+  display: flex;
+  justify-content: space-around;
+  align-items: flex-start;
 }
 
 .scdBox {
-    width: 33%;
-    height: auto;
-    text-align: center;
-    /* border: 1px solid red; */
+  width: 33%;
+  height: auto;
+  text-align: center;
+  /* border: 1px solid red; */
 }
 
 .crcBox {
-    width: 33%;
-    height: auto;
-    text-align: center;
-    /* border: 1px solid red; */
+  width: 33%;
+  height: auto;
+  text-align: center;
+  /* border: 1px solid red; */
 }
 
 .iedBox {
-    width: 33%;
-    height: auto;
-    text-align: center;
-    /* border: 1px solid red; */
-    position: relative;
+  width: 33%;
+  height: auto;
+  text-align: center;
+  /* border: 1px solid red; */
+  position: relative;
 }
 
 #newIed {
-    position: absolute;
-    top: 100px;
-    right: 0px;
+  position: absolute;
+  top: 100px;
+  right: 0px;
 }
 
 #addId {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 112px;
-    height: 40px;
-    border: 1px dashed #1D48E8;
-    background-color: rgb(239, 243, 255);
-    border-radius: 5px;
-    margin-bottom: 20px;
-    cursor: pointer;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 112px;
+  height: 40px;
+  border: 1px dashed #1d48e8;
+  background-color: rgb(239, 243, 255);
+  border-radius: 5px;
+  margin-bottom: 20px;
+  cursor: pointer;
 }
 
 #editId {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 112px;
-    height: 40px;
-    border: 1px dashed #FECC2A;
-    background-color: rgb(255, 251, 242);
-    border-radius: 5px;
-    margin-bottom: 20px;
-    cursor: pointer;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 112px;
+  height: 40px;
+  border: 1px dashed #fecc2a;
+  background-color: rgb(255, 251, 242);
+  border-radius: 5px;
+  margin-bottom: 20px;
+  cursor: pointer;
 }
 
 #delId {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 112px;
-    height: 40px;
-    border: 1px dashed red;
-    background-color: rgb(255, 236, 236);
-    border-radius: 5px;
-    margin-bottom: 20px;
-    cursor: pointer;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 112px;
+  height: 40px;
+  border: 1px dashed red;
+  background-color: rgb(255, 236, 236);
+  border-radius: 5px;
+  margin-bottom: 20px;
+  cursor: pointer;
 }
 </style>

src/pages/netStructPicture/components/scdTree.vue

@@ -164,7 +164,12 @@ import {
   onUnmounted,
 } from "vue";
 import scdCheck from "@/api/scdCheck/scdCheck";
-import { uploadfile, tmpParse, compStart } from "@/api/scdCheck/scdCheck2";
+import {
+  uploadfile,
+  tmpParse,
+  compStart,
+  compstatView,
+} from "@/api/scdCheck/scdCheck2";
 import scd from "@/api/scd";
 import systemRow from "@/api/systemRow";
 import {
@@ -184,7 +189,7 @@ import uploadEPng from "@/assets/image/scdcheck/upload_error.png";
 import { useRoute } from "vue-router";
 import createds from "@/utils/scdMqtt.js";
 const route = useRoute();
-const emit = defineEmits(["scdTreeBack"]);
+const emit = defineEmits(["scdTreeBack","scdView","scdJpadList"]);
 let tableList = ref([]);
 let multipleTableRef = ref();
 let alreadyTriggered = ref(false);
@@ -213,7 +218,6 @@ const excelPort = () => {
       code: "scd-comp-result",
     })
     .then((res) => {
-      console.log(res, "port");
       if (res.data) {
         return;
       } else {
@@ -240,7 +244,6 @@ const uploadFile = async (e) => {
   fileList.value = [];
   chooseFile.value = "";
   loadingAddError.value = false;
-  console.log("e", e);
   loadingAdd.value = true;
   const fileRes = await uploadfile({
     file: e.file,
@@ -271,22 +274,21 @@ const uploadFile = async (e) => {
     });
   }
 };
-const searchScdCheck = (row) => {
   //查看scd对比
+const searchScdCheck = async (row) => {
+  emit('scdView',row)
   const loading = ElLoading.service({
     lock: true,
     text: "正在查询数据",
     background: "rgba(0, 0, 0, 0.7)",
   });
-  scdCheck.scdResult({ comp_id: row.id }).then((res) => {
-    console.log(res, "对比详细");
-    if (res.code == 0) {
-      loading.close();
-    }
+  const res = await compstatView({
+    comp_id: row.id,
   });
-  // scdCheck.scdAll({ comp_id: row.id }).then(res => {
-  //     console.log(res, '阿拉蕾');
-  // })
+  if (res.code == 0) {
+    emit('scdJpadList',res.data)
+    loading.close();
+  }
 };
 const lookScdBack = (data, row) => {
   //选择scd文件模态框返回数据
@@ -312,7 +314,6 @@ const startMqtt = (val) => {
   //val = 订阅地址
   //设置订阅地址
   PublicMqtt.value = new createds(val);
-  console.log("firPublicMqtt.valuest", PublicMqtt.value);
   //初始化mqtt
   PublicMqtt.value.init();
   //链接mqtt
@@ -371,7 +372,6 @@ watch(
 );
 //解析完成开始对比的点击
 const yesAnalysisClick = () => {
-  console.log("parentData.value", parentData.value);
   ElMessageBox.confirm(
     "该操作耗时较长，校验开始后将清除原有校验结果且无法中止,确定开始吗?",
     "Warning",
@@ -397,7 +397,7 @@ const yesAnalysisClick = () => {
       if (anRes.code == 0) {
         ElNotification.closeAll();
         loadingAdd.value = false;
-        aktType()
+        aktType();
         ElMessage({
           type: "success",
           message: "对比完成!",
@@ -405,7 +405,6 @@ const yesAnalysisClick = () => {
       }
     })
     .catch((err) => {
-      console.log("err", err);
     });
 };
 //解析失败活未完成开始对比的点击

src/pages/netStructPicture/components/virtualRelation.vue

@@ -350,7 +350,7 @@ const removeLine3 = () => {
   leaderLines3.value = [];
   const elmWrapper = document.getElementById("wrapper");
   if (elmWrapper) {
-    document.body.querySelectorAll("body .leader-line").forEach((node) => {
+    document.body.querySelectorAll("#wrapper .leader-line").forEach((node) => {
       elmWrapper.removeChild(node);
     });
   }

src/pages/netStructPicture/index.vue

@@ -66,10 +66,10 @@
               margin-top: 5px;
             ">
             <div class="treeBtn">
-              <scdTree :nowStation="nowStation" @scdTreeBack="scdTreeBack"></scdTree>
+              <scdTree :nowStation="nowStation" @scdTreeBack="scdTreeBack" @scdView="scdView" @scdJpadList="scdJpadList"></scdTree>
             </div>
             <div class="scdMap">
-              <scdMap :antherBack="antherBack" :activeNav="activeNav"></scdMap>
+              <scdMap :antherBack="antherBack" :scdipadMini="scdipadMini" :activeNav="activeNav" :clickView="clickView"></scdMap>
             </div>
           </div>
         </div>
@@ -208,6 +208,16 @@ const fileSuccess = (file, e) => {
 function scdTreeBack(data) {
   antherBack.value = data;
 }
+const clickView = ref(null);
+//点击左侧树查看的当前数据行
+const scdView = (row) =>{
+  clickView.value = row;
+}
+// 点击左侧树查看返回图的数据
+const scdipadMini= ref([])
+const scdJpadList = (data) =>{
+  scdipadMini.value = data;
+}
 const portExcel = () => {
   systemRow
     .portExcel({