Преглед изворни кода

refactor(规则管理): 优化自定义表格和文本组件DOM查询方式,移除调试日志

yusheng пре 5 месеци
родитељ
комит
2b35cad586

+ 19 - 8
src/views/rulesManagement/releaseRules/components/templateDiv/customTable.vue

@@ -8,6 +8,7 @@
     <el-button type="primary" @click="addRow(columns[0].length)" v-if="edit"
       >新增行</el-button
     >
+    <!-- <el-button type="primary" @click="copy()" v-if="edit">复制表格</el-button> -->
     <el-checkbox v-model="isMerge" style="margin-left: 10px" v-if="edit"
       >合并单元格</el-checkbox
     >
@@ -490,7 +491,6 @@
         this.units = units || {};
       },
       editInputChange(domObj) {
-        console.log(domObj, 'domObj');
         let data = JSON.parse(JSON.stringify(domObj));
         if (data.equation) {
           this.equation[data.id] = data.equation;
@@ -498,18 +498,19 @@
         if (data.units) {
           this.units[data.id] = data.units;
         }
-        let dom = document.getElementById(data.id);
+        let parentDom = document.getElementById(this.id);
+        let dom = parentDom.querySelector('#' + data.id);
 
         this.columns.forEach((item, index) => {
           let rowsIndex = item.findIndex((cells) => cells.id == this.domId);
-          if (!dom) {
-            this.$set(this.columns[index], rowsIndex, data);
-          } else {
+          this.$set(this.columns[index], rowsIndex, data);
+          rowsIndex = item.findIndex((cells) => cells.id == data.id);
+
+          if (dom) {
             if (rowsIndex >= 0) {
               let width = data.width - dom.parentElement.offsetWidth;
               let newWidth = this.columns[index][rowsIndex].style.width + width;
               this.columns[index][0].width = newWidth;
-              this.$set(this.columns[index], rowsIndex, data);
               item.forEach((cell, _index) => {
                 this.$set(this.columns[index][_index].style, 'width', newWidth);
                 this.$set(this.columns[index][_index], 'width', newWidth);
@@ -534,12 +535,22 @@
           });
         }
       },
-
+      // copy() {
+      //   this.$emit('copy', {
+      //     form: null,
+      //     equation: JSON.parse(JSON.stringify(this.equation)),
+      //     units: JSON.parse(JSON.stringify(this.units)),
+      //     valueObj: {
+      //       columns: JSON.parse(JSON.stringify(this.valueObj))
+      //     }
+      //   });
+      // },
       inputClick(item, type) {
         if (!this.edit) {
           return;
         }
-        let dom = document.getElementById(item.id);
+        let parentDom = document.getElementById(this.id);
+        let dom = parentDom.querySelector('#' + item.id);
 
         this.domId = item.id;
         this.$emit('editShow', {

+ 15 - 7
src/views/rulesManagement/releaseRules/components/templateDiv/customText.vue

@@ -3,14 +3,16 @@
   <div>
     <el-popover
       style="position: fixed; z-index: 2000"
-      
       ref="popoverRef"
       v-model="rightClickShow"
       @click.native="rightClickShow = false"
     >
-      <div style="display: flex;">
+      <div style="display: flex">
         <el-button type="primary" @click="addHtml">插入输入框</el-button>
-        <el-button style="margin-left: 10px;"type="primary" @click="addHtml('checkbox')"
+        <el-button
+          style="margin-left: 10px"
+          type="primary"
+          @click="addHtml('checkbox')"
           >插入勾选框</el-button
         >
       </div>
@@ -63,7 +65,8 @@
         if (Object.keys(this.valueObj).length) {
           for (let key in this.valueObj) {
             this.$nextTick(() => {
-              let dom = document.getElementById(key);
+              let parentDom = document.getElementById(this.id);
+              let dom = parentDom.querySelector('#' + key);
               dom.value = this.valueObj[key];
               if (dom.type == 'checkbox') {
                 console.log(this.valueObj[key]);
@@ -137,7 +140,8 @@
       },
       equationValue({ domId, value }) {
         if (domId) {
-          let dom = document.getElementById(domId);
+          let parentDom = document.getElementById(this.id);
+          let dom = parentDom.querySelector('#' + domId);
           if (dom) {
             this.valueObj[domId] = value;
             dom.value = value;
@@ -160,7 +164,8 @@
         this.objInit();
       },
       editInputChange(domObj) {
-        let dom = document.getElementById(this.domId);
+        let parentDom = document.getElementById(this.id);
+        let dom = parentDom.querySelector('#' + this.domId);
         dom.style.width = domObj.width + 'px';
         if (domObj.readonly == 2) {
           dom.setAttribute('readonly', 'readonly');
@@ -176,6 +181,7 @@
           this.units[domObj.id] = domObj.units;
         }
         dom.id = domObj.id;
+        this.domId = domObj.id;
       },
       onRightClick(PointerEvent) {
         this.rightClickShow = true;
@@ -192,7 +198,7 @@
       inputChange(event) {
         if (event.target && event.target.className == 'templateInput') {
           if (event.target.type == 'checkbox') {
-            this.valueObj[event.target.id] = event.target.checked
+            this.valueObj[event.target.id] = event.target.checked;
           } else {
             this.valueObj[event.target.id] = event.target.value;
           }
@@ -221,6 +227,8 @@
     },
 
     mounted() {
+      // let parentDom = document.getElementById(this.id);
+      // let dom = parentDom.querySelector('#' + this.domId);
       this.$nextTick(() => {
         document
           .getElementById(this.id)