楼盘表回显

 <!--
  * @Author: yangwei
  * @Date: 2023-02-28 15:47:12
- * @LastEditors: yangwei
- * @LastEditTime: 2023-09-20 17:14:39
+ * @LastEditors: vers
+ * @LastEditTime: 2024-02-05 16:06:30
  * @FilePath: \bdcdj-web\src\views\lpb\lpbContent\ch.vue
  * @Description:
  *
@@ -16,14 +16,16 @@
       border="1"
       cellspacing="0"
       cellpadding="0"
-      v-show="ch.length">
+      v-show="ch.length"
+    >
       <tr v-for="(cs, csIndex) in ch" :key="csIndex">
         <!-- 显示层数 -->
         <td
           class="floor"
           ref="cBsm"
           @contextmenu.prevent="openMenu($event, cs, 'c')"
-          @click="handleClickC($event, cs)">
+          @click="handleClickC($event, cs)"
+        >
           {{ cs.sjc }}层
         </td>
         <!-- 显示户 -->
@@ -35,15 +37,22 @@
           :data-qszt="hs.qszt"
           ref="hBsm"
           :key="hsIndex"
-          :style="{'border-color': borderColor}"
+          :style="{ 'border-color': borderColor }"
           :class="hs.select ? 'tdSelect' : ''"
           @click="handleClickH($event.target, hs.bsm, hs)"
           @dblclick="dbclick(hs.bsm)"
-          @contextmenu.prevent="openMenu($event, hs, 'h')">
+          @contextmenu.prevent="openMenu($event, hs, 'h')"
+        >
           {{ hs.shbw }}
-          <span @click.stop="" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
-          <span @click.stop="" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
-          <span @click.stop="" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
+          <span @click.stop="" class="hqszt lin" v-show="hs.qszt == '0'"
+            >临</span
+          >
+          <span @click.stop="" class="hqszt zheng" v-show="hs.qszt == '1'"
+            >正</span
+          >
+          <span @click.stop="" class="hqszt xian" v-show="hs.qszt == '2'"
+            >现</span
+          >
           <ul @click.stop="hDyztClick($event, hs.bsm, hs)" class="dyzt">
             <li style="background-color: #6edee1" v-show="hs.qqzt == '1'">
               确
@@ -71,14 +80,16 @@
 </template>
 
 <script>
+import { set } from "nprogress";
+
 export default {
   name: "BdcdjWebCh",
   inject: {
-    openMenu:{value:'openMenu',default:null},
-    selectAll:{value:'selectAll',default:null},
-    changeChoosedObj:{value:'changeChoosedObj',default:null},
-    clearChangeChoosedObj:{value:'clearChangeChoosedObj',default:null},
-    getBsmList:{value:'getBsmList',default:null}
+    openMenu: { value: "openMenu", default: null },
+    selectAll: { value: "selectAll", default: null },
+    changeChoosedObj: { value: "changeChoosedObj", default: null },
+    clearChangeChoosedObj: { value: "clearChangeChoosedObj", default: null },
+    getBsmList: { value: "getBsmList", default: null },
   },
   props: {
     ch: {
@@ -87,10 +98,10 @@ export default {
         return [];
       },
     },
-    onlyShow:{
+    onlyShow: {
       type: Boolean,
       default: true,
-    }
+    },
   },
   data() {
     return {
@@ -101,26 +112,27 @@ export default {
       //区分单双击事件的定时器
       time: null,
       // 边框颜色
-      borderColor:'rgb(230, 230, 230)',
+      borderColor: "rgb(230, 230, 230)",
       // 申请单元列表数据
-      unitIdList:[],
+      unitIdList: [],
       // 组件标识
-      compFlag:Math.random()
+      compFlag: Math.random(),
     };
   },
   mounted() {
     // 根据申请单元列表数据处理选中户
-    console.log("window.unitData",window.unitData);
-    if(window.unitData && window.unitData.length){
-      window.unitData.forEach(e => {
-        this.unitIdList.push(e.bdcdyid)
-      })
+    console.log("window.unitData", window.unitData);
+    if (window.unitData && window.unitData.length) {
+      window.unitData.forEach((e) => {
+        this.unitIdList.push(e.bdcdyid);
+      });
+      console.log(this.unitIdList, "this.unitIdList");
       this.ch.forEach((c) => {
         c.hs.forEach((h) => {
-          if (h.dyhbsm.indexOf(this.unitIdList) > -1) {
+          if (this.unitIdList.indexOf(h.dyhbsm) > -1) {
             h.select = true;
             // 使用hbsmList时，需要去重
-            this.hbsmList.push(h.bsm)
+            this.hbsmList.push(h.bsm);
           }
         });
       });
@@ -144,7 +156,7 @@ export default {
             e.target.className += " tdSelect";
             h.select = true;
             // 使用hbsmList时，需要去重
-            this.hbsmList.push(h.bsm)
+            this.hbsmList.push(h.bsm);
           });
         } else {
           //选中→未选中
@@ -217,84 +229,86 @@ export default {
      * @param {*} flag
      * @author: renchao
      */
-    zdySelectAll(val,flag) {
+    zdySelectAll(val, flag) {
       // 手动点击全部取消选中
-      !flag &&  this.clearChangeChoosedObj()
+      !flag && this.clearChangeChoosedObj();
       this.ch.forEach((c) => {
         c.hs.forEach((h) => {
           if (val) {
             h.select = true;
             // 使用hbsmList时，需要去重
-            this.hbsmList.push(h.bsm)
+            this.hbsmList.push(h.bsm);
           } else {
             h.select = false;
-            this.borderColor = 'rgb(230, 230, 230)'
-            this.hbsmList = []
+            this.borderColor = "rgb(230, 230, 230)";
+            this.hbsmList = [];
           }
         });
       });
-      this.$refs.hBsm && this.$refs.hBsm.forEach((item) => {
+      this.$refs.hBsm &&
+        this.$refs.hBsm.forEach((item) => {
           // item.style.borderColor = this.borderColor
-        item.style.backgroundColor =  '#fff';
+          item.style.backgroundColor = "#fff";
           // item.style.border = `1px solid ${this.borderColor}`
         });
     },
     //清除选中
-    clearChoosed(){
+    clearChoosed() {
       //清除选中户
-      this.zdySelectAll(false)
+      this.zdySelectAll(false);
       //清除选中层
       this.cbsmList = [];
-      this.$refs.cBsm && this.$refs.cBsm.forEach((item)=>{
-        item.className = 'floor'
-      })
+      this.$refs.cBsm &&
+        this.$refs.cBsm.forEach((item) => {
+          item.className = "floor";
+        });
     },
   },
   watch: {
     selectAll: {
       handler(val) {
         this.zdySelectAll(val.selectAll);
-        val.cancelChoosed && this.clearChoosed()
+        val.cancelChoosed && this.clearChoosed();
       },
       immediate: true,
       deep: true,
     },
-    hbsmList(val){ 
-      let list = []
-      val.length && val.forEach((i)=>{
+    hbsmList(val) {
+      let list = [];
+      val.length &&
+        val.forEach((i) => {
           this.ch.forEach((c) => {
             c.hs.forEach((h) => {
               if (i == h.bsm) {
-              list.push(
-                {
-                  bdcdyh:h.bdcdyh,
-                  bsm:h.bsm,
-                  dyhbsm:h.dyhbsm,
-                  bdcdyid:h.dyhbsm,
+                list.push({
+                  bdcdyh: h.bdcdyh,
+                  bsm: h.bsm,
+                  dyhbsm: h.dyhbsm,
+                  bdcdyid: h.dyhbsm,
                   zl: h.zl,
-                  bdcdylx:'7',
-                  flag:this.compFlag
-                }
-              )
+                  bdcdylx: "7",
+                  flag: this.compFlag,
+                });
               }
             });
           });
-      })
-      this.getBsmList(list,this.compFlag)
+        });
+      this.getBsmList(list, this.compFlag);
     },
     changeChoosedObj: {
       handler(val) {
-        this.borderColor = 'rgb(230, 230, 230)';
+        this.borderColor = "rgb(230, 230, 230)";
         if (val.bsms.length) {
           //清除选中户
-          this.zdySelectAll(false,true)
+          this.zdySelectAll(false, true);
           this.$refs.hBsm.forEach((item) => {
-            val.bsms.forEach((i,ind) => {
+            val.bsms.forEach((i, ind) => {
               if (item.dataset.bsm == i) {
                 if (ind == 0) {
                   //定位到第一个户所在位置
                   window.lpbContent.$refs.lpbContent.scrollTop = item.offsetTop;
-                  window.lpbContent.$refs.lpbContent.scrollLeft = item.offsetLeft;
+                  window.lpbContent.$refs.lpbContent.scrollLeft =
+                    item.offsetLeft;
                 }
                 // item.style.border = '1px solid '+ val.color;
                 // 背景色高亮
@@ -306,12 +320,12 @@ export default {
       },
       immediate: true,
       deep: true,
-    }
+    },
   },
 };
 </script>
 <style lang="scss" scoped>
-  .ch-wrap {
+.ch-wrap {
   display: flex;
   flex-direction: column-reverse;
   .chTable {
@@ -396,5 +410,5 @@ export default {
       }
     }
   }
-  }
+}
 </style>