解决列表查询条件数据回显冲突问题

zkqy-ui/src/views/asEditor/components/rightslider/queryListStyle/index.vue

@@ -307,7 +307,7 @@
           <template slot-scope="scope">
             <el-input
               v-model="scope.row.value"
-              :disabled="scope.row.type == '1'|| scope.row.type == '2'"
+              :disabled="scope.row.type == '1' || scope.row.type == '2'"
               placeholder="请输入参照值"
               size="normal"
             ></el-input>
@@ -318,7 +318,9 @@
             <el-button
               size="mini"
               type="danger"
-              @click="delContionHandler(scope.$index, queryContionTableData)">删除</el-button>
+              @click="delContionHandler(scope.$index, queryContionTableData)"
+              >删除</el-button
+            >
           </template>
         </el-table-column>
       </el-table>
@@ -397,7 +399,7 @@ export default {
   dicts: ["sys_time_format"],
   props: {
     datas: Object,
-    echoMessage: Object 
+    echoMessage: Object,
   },
   components: { vuedraggable },
   data() {
@@ -525,14 +527,14 @@ export default {
       immediate: true,
     },
   },
-  mounted() { },
+  mounted() {},
   methods: {
     // 列名变化回调
     changeModel() {
       console.log("列", this.datas);
-      let newObject = { }
+      let newObject = {};
       // newObject.fieldName = `${this.datas.tableName}.${this.datas.fieldName}`;
-      // newObject.value = "#{x}";   
+      // newObject.value = "#{x}";
       // newObject.operator = "=";
       // newObject.type = "1";
       // console.log(newObject);
@@ -543,7 +545,7 @@ export default {
     changeType(row) {
       if (row.type == 1) {
         row.value = "#{x}";
-      } else if(row.type == 2){
+      } else if (row.type == 2) {
         row.value = "#{userID}";
       } else {
         row.value = "";
@@ -588,7 +590,9 @@ export default {
     fieldEditHandler(row, index) {
       console.log(row);
       if (Object.keys(row.column_attribute || {}).length) {
-        this.column_attribute = JSON.parse(JSON.stringify(row.column_attribute));
+        this.column_attribute = JSON.parse(
+          JSON.stringify(row.column_attribute)
+        );
       } else {
         Object.assign(this.column_attribute, {
           isDateColumn: false,
@@ -636,9 +640,9 @@ export default {
       this.$nextTick(() => {
         this.initDragTable();
       });
-      if(this.echoMessage) {
+      if (this.echoMessage) {
         console.log("回显数据", this.echoMessage);
-        let echoMessage = this.echoMessage; 
+        let echoMessage = this.echoMessage;
         // 主表
         this.nameItem = JSON.parse(echoMessage.tableColumnName);
         console.log(this.nameItem);
@@ -646,24 +650,29 @@ export default {
         // 表格主键
         let tablelistSort = JSON.parse(echoMessage.tablelistSort);
         let dataSortFromEcho = tablelistSort.DataSort; // "student.id"
-        const idOnly = dataSortFromEcho.split('.').pop(); // "id"
+        const idOnly = dataSortFromEcho.split(".").pop(); // "id"
         this.listQueryData.mainForm.tablePrimaryKey = idOnly;
         this.listQueryData.mainForm.sortFieldName = idOnly;
         this.listQueryData.mainForm.sortType = tablelistSort.DataSortType;
         // 查询条件
         let tableQueryConditions = JSON.parse(echoMessage.tableQueryConditions);
-        this.queryContionTableData = tableQueryConditions.map(item => ({
-          ...item
-        }))
-        // 表格
-        this.mainTableData = this.nameItem.map((item, index) => ({
+        this.queryContionTableData = tableQueryConditions.map((item) => ({
           ...item,
-          fieldDescription: item.field_des,
-          column_attribute: JSON.parse(item.column_attribute),   
-        })) 
-        // if(this.listQueryData.mainForm.mainTableName){
-        //   this.mainTableFieldOptions = await this.getFieldOptions(this.listQueryData.mainForm.mainTableName);    
-        // }
+        }));
+        if (this.listQueryData.mainForm.mainTableName) {
+          this.mainTableFieldOptions = await this.getFieldOptions(
+            this.listQueryData.mainForm.mainTableName
+          );
+        }
+        // 表格
+        this.$nextTick(() => {
+          this.mainTableData = this.nameItem.map((item, index) => ({
+            ...item,
+            fieldDescription: item.field_des,
+            column_attribute: JSON.parse(item.column_attribute),
+          }));
+        });
+
         console.log(this.mainTableData);
       }
     },
@@ -687,7 +696,7 @@ export default {
       // 展示描述
       res.tableColumnName = [];
       res.tableColumnDesc = [];
-      console.log('this.mainTableData', this.mainTableData);
+      console.log("this.mainTableData", this.mainTableData);
       this.mainTableData.forEach((item, index) => {
         // console.log('item', item);
         let { tbname, fieldName, fieldDescription, column_attribute } = item;
@@ -724,24 +733,26 @@ export default {
       //   queryData.value = value;
       //   queryData.operator = operator;
       //   queryData.type = String(type);
-        
+
       // });
       // console.log(this.queryContionTableData);
       // this.tableQueryConditions.push(queryData)
       // console.log(this.tableQueryConditions);
       let queryDataArray = this.queryContionTableData.map((item) => {
-      let { fieldName, tableName, value, operator, type } = item;
-      return {
+        let { fieldName, tableName, value, operator, type } = item;
+        return {
           fieldName: fieldName,
           value: value,
           operator: operator,
-          type: String(type)
-          };
+          type: String(type),
+        };
       });
       // console.log(this.queryContionTableData);
       this.tableQueryConditions.push(...queryDataArray);
       // console.log(this.tableQueryConditions);
-      let tableQueryConditionsString = JSON.stringify(this.tableQueryConditions);
+      let tableQueryConditionsString = JSON.stringify(
+        this.tableQueryConditions
+      );
       res.tableQueryConditions = tableQueryConditionsString;
       // 排序
       this.tablelistSort = {
@@ -784,7 +795,6 @@ export default {
         this.$message.error("网络异常,请稍后再试");
       }
     },
-    
   },
   computed: {
     ...mapState({