性能优化

src/views/modules/logistics-fare/logistics-template/popup/add-template.vue

@@ -46,6 +46,7 @@ const BASE_DATA = {
 export default {
   data() {
     return {
+      reRender: false,
       currentPanel: "基础信息",
       modalData: {},
       modalConfig: {
@@ -108,7 +109,7 @@ export default {
             ) {
               item.conditionType = "件数+金额";
             } else if (
-              typeof item.price == 'number' &&
+              typeof item.price == "number" &&
               typeof item.number != "number"
             ) {
               item.conditionType = "金额";
@@ -165,13 +166,18 @@ export default {
   },
   computed: {
     computedCityOptions() {
+      let _arr = cloneDeep(this.$api.mer_admin.getCityOptions());
       return ($rowIndex, list = []) => {
+        console.log("计算");
+
+        if (this.reRender == false) {
+          return _arr;
+        }
         // console.time();
-        let _arr = cloneDeep(this.$api.mer_admin.getCityOptions());
-        let selectedArray = [];
+        let selectedArray = new Set();
         for (let i = 0; i < list.length; i++) {
           if (i != $rowIndex) {
-            selectedArray = selectedArray.concat(list[i].cityCodes);
+            selectedArray = new Set([...selectedArray, ...list[i].cityCodes]);
           }
         }
         // 根据数组过滤树形结构数组
@@ -191,7 +197,7 @@ export default {
               if (item == null) {
                 return false;
               }
-              return !bList.includes(item.code);
+              return !bList.has(item.code);
             });
         };
         let new_arr = filterTreeArray(_arr, selectedArray);
@@ -266,11 +272,10 @@ export default {
         //自定义运费
         {
           label: "自定义运费配置",
+          prop: "customShippingFareConfig",
           type: "jsx-out",
           show: this.modalData.fareConfig == "自定义运费",
           render: () => {
-            console.log("执行了render函数");
-            
             const tableCols = [
               {
                 title: "运送到",
@@ -278,6 +283,7 @@ export default {
                 field: "cityCodes",
                 type: "jsx",
                 render: ({ row, $rowIndex }) => {
+                  console.log("this.reRender", this.reRender);
                   const change = (e) => {
                     console.log(e);
                     console.log(
@@ -300,6 +306,10 @@ export default {
                       }}
                     >
                       <el-cascader
+                        on-visible-change={(e) => {
+                          console.log(e);
+                          this.reRender = e;
+                        }}
                         ref="cityCode"
                         style="width:100%;"
                         v-model={row.cityCodes}
@@ -603,7 +613,7 @@ export default {
         //指定包邮条件
         {
           label: "",
-          prop: "",
+          prop: "123",
           type: "jsx-out",
           show: this.modalData.fareConfig == "自定义运费",
           render: () => {
@@ -634,6 +644,10 @@ export default {
                         style="width:100%;"
                         v-model={row.cityCodes}
                         onChange={change}
+                        on-visible-change={(e) => {
+                          console.log(e);
+                          this.reRender = e;
+                        }}
                         options={this.computedCityOptions(
                           $rowIndex,
                           this.modalData.shippingTemplatesConditionList