Browse Source

表单模块下拉框数据收集

ZYZ 1 year ago
parent
commit
94a6a1502b

+ 40 - 42
zkqy-ui/src/views/asEditor/components/formDesign/selectEdit.vue

@@ -39,7 +39,7 @@
     <el-dialog
       title="设置下拉选项数据"
       :visible.sync="zisShow"
-      width="50%"
+      width="55%"
       :before-close="cancleHandler"
     >
       <el-form
@@ -234,7 +234,7 @@
       <template #footer>
         <span>
           <el-button @click="cancleHandler">取消</el-button>
-          <el-button type="primary" @click="conformHandler">确认</el-button>
+          <el-button type="primary" @click="conformHandler">确认11</el-button>
         </span>
       </template>
     </el-dialog>
@@ -283,7 +283,7 @@
             filterable
             @change="
               (value) => {
-                getFieldOptions(value, flagFormData.tableField);
+                getFieldOptions(value);
               }
             "
           >
@@ -355,10 +355,11 @@ import { mapState } from "vuex";
 import getOptionsSqlString from "@/utils/sqlString";
 export default {
   name: "selectEdit",
-  props: ["options", "selectItem", "dynamicKey","zisShow"],
+  props: ["options", "selectItem", "dynamicKey","selectDataKey"],
   components: {},
   data() {
     return {
+      zisShow: false,
       relateOptionShow: false,
       isShow: false,
       flagShow: false,
@@ -442,6 +443,9 @@ export default {
       ],
       editIndex: "", //当前编辑层级
     };
+  },
+  mounted() {
+    
   },
   watch: {
     myDynamicKey: {
@@ -471,17 +475,17 @@ export default {
     myOptions: {
       handler(nval) {
         console.log("options", nval);
-        //   this.btnList = [];
-        //   this.reset();
-        //   if (nval.sqlData && nval.sqlData.dynamicName == nval?.dynamicKey) {
-        //     this.btnList = nval.sqlData.echoDatas.map((item) => {
-        //       return {
-        //         sql: "",
-        //         echoData: item,
-        //       };
-        //     });
-        //   }
-        console.log(this.btnList);
+       /*    this.btnList = [];
+          this.reset();
+          if (nval.sqlData && nval.sqlData.dynamicName == nval?.dynamicKey) {
+            this.btnList = nval.sqlData.echoDatas.map((item) => {
+              return {
+                sql: "",
+                echoData: item,
+              };
+            });
+          }
+        console.log(this.btnList); */
       },
       deep: true,
       immediate: true,
@@ -511,7 +515,12 @@ export default {
     },
   },
   methods: {
-    
+    dialogShow(val) {
+      this.zisShow = true;
+
+      this.getAllTable();
+
+    },
     open() {
       this.$emit("open-dialog"); // 触发自定义事件
     },
@@ -585,7 +594,7 @@ export default {
       if (this.formData.tableName) {
         this.getFieldOptions(this.formData.tableName);
       }
-      this.isShow = true;
+      this.zisShow = true;
     },
     // 弹窗取消回调
     cancleHandler() {
@@ -594,30 +603,17 @@ export default {
     },
     // 弹窗确认回调
     conformHandler() {
-      let sql = getOptionsSqlString(this.formData, this.filterTableData);
-      // let sqlData = {};
-      // sqlData[this.formData.dynamicName] = sql;
-      let echoData = {
-        formData: {},
-        filterTableData: [],
-        // flagFormData: {},
-      };
-      Object.assign(echoData.formData, this.formData);
-      Object.assign(echoData.filterTableData, this.filterTableData);
-      // Object.assign(echoData.flagFormData, this.flagFormData);
-      echoData.filterTableData.forEach((item) => {
-        delete item.flagFormData.tableField.fieldOptions;
-      });
-      this.btnList[this.editIndex].sql = sql;
-      this.btnList[this.editIndex].echoData = JSON.stringify(echoData);
-      let sqlData = {};
-      sqlData.dynamicName = this.formData.dynamicName;
-      sqlData.sqls = this.btnList.map((item) => item.sql);
-      sqlData.echoDatas = this.btnList.map((item) => item.echoData);
-      this.$emit("setDynamicKey", sqlData);
-      this.reset();
-
-      this.isShow = false;
+      let selectQualifiedField = [
+        {
+          tableName: this.formData.tableName,
+          label: this.formData.optLabelData,
+          value: this.formData.optValueData,
+          selectDataKey: this.selectDataKey
+        }
+      ]
+      console.log(selectQualifiedField);
+      this.$emit('select-confirmed', selectQualifiedField);
+      this.zisShow = false;
     },
     // 获取所有表格
     async getAllTable() {
@@ -626,7 +622,7 @@ export default {
         databaseType: this.databaseType,
       };
       let res = await getFormName(data);
-
+      console.log(res.data, 123);
       this.tableList = res.data;
     },
     async getFieldOptions(value, tempData) {
@@ -638,8 +634,10 @@ export default {
       try {
         let res = await getListName(data);
         if (tempData) {
+          console.log(res, 456);
           tempData.fieldOptions = res;
         } else {
+          console.log(res, 4567);
           this.fieldList = res;
         }
       } catch (error) {

+ 38 - 25
zkqy-ui/src/views/asEditor/components/rightslider/investigatestyle/index.vue

@@ -95,8 +95,7 @@
           <el-form :model="dynamicValidateForm" ref="dynamicValidateForm" label-width="100px" class="demo-dynamic">
             <el-form-item
               v-for="(domain, index) in dynamicValidateForm.domains"
-              :key="domain.key"
-              
+              :key="domain.key"              
               :rules="[
                 {
                   validator: (rule, value, callback) => {
@@ -126,12 +125,11 @@
           <el-input
             type="textarea"
             v-model="item.value"
-            placeholder="动态数据变量名"
-            @input="onInputChange"
+            placeholder="动态数据变量名"          
             style="margin-top: 10px; margin-bottom: 10px;"
         ></el-input>
         </div>
-        <div v-if="shouldShowButton">
+        <div v-if="item.value.length && showDynamicInput===true">
           <el-button 
             type="primary" 
             icon="el-icon-edit" 
@@ -139,7 +137,7 @@
             @click="zisShowClick"
           ></el-button>
         </div>
-        <selectEdit :zisShow="zisShow"></selectEdit>
+        
         <el-input
           type="textarea"
           v-model="item.value"
@@ -160,6 +158,11 @@
         </el-button>
       </el-form-item>
     </el-form>
+    <selectEdit 
+      ref="selectEditRef" 
+      :selectDataKey="lieData"
+      @select-confirmed="handleSelectConfirmed"
+      ></selectEdit>
   </div>
 </template>
 
@@ -179,6 +182,7 @@ export default {
   },
   data() {
     return {
+      lieData:'',
       zisShow: false,
       isShow: false,
       flagShow: false,
@@ -240,8 +244,16 @@ export default {
   },
 
   methods: {
+    handleSelectConfirmed(selectedData) {
+      console.log('从子组件接收到的数据:', selectedData);
+      this.$emit('data-from-child', {
+        selectQualifiedField: selectedData, 
+        selectMapValue: this.dynamicValidateForm.domains
+      });      // 在这里处理接收到的数据,比如更新父组件的状态等
+    },
     zisShowClick(){
-      this.zisShow = !this.zisShow
+      // this.zisShow = !this.zisShow
+      this.$refs.selectEditRef.dialogShow(1111)
     },
     // 添加一级回调
     addHandler() {
@@ -331,7 +343,7 @@ export default {
       this.dynamicValidateForm.domains.push({
         label: '',
         value: '',
-        key: Date.now()
+        // key: Date.now()
       });
     },
     onInputChange() {
@@ -377,23 +389,23 @@ export default {
       this.tableList = res.data;
     },
     async getFieldOptions(value, tempData) {
-      // let data = {
-      //   databaseName: this.databaseName,
-      //   databaseType: this.databaseType,
-      //   tableName: value,
-      // };
-      // try {
-      //   let res = await getListName(data);
-      //   if (tempData) {
-      //     console.log(res,456);
-      //     tempData.fieldOptions = res;
-      //   } else {
-      //     console.log(res,4567);
-      //     this.fieldList = res;
-      //   }
-      // } catch (error) {
-      //   this.$message.error("网络异常,请稍后再试");
-      // }
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+        tableName: value,
+      };
+      try {
+        let res = await getListName(data);
+        if (tempData) {
+          console.log(res,456);
+          tempData.fieldOptions = res;
+        } else {
+          console.log(res,4567);
+          this.fieldList = res;
+        }
+      } catch (error) {
+        this.$message.error("网络异常,请稍后再试");
+      }
     },
 
     //添加文本
@@ -422,6 +434,7 @@ export default {
     // 列名变化回调
     changeModel() {
       console.log('列',this.datas);
+      this.lieData = this.datas.jsonData[0].fieldName
     },
   },
 }

+ 40 - 4
zkqy-ui/src/views/asEditor/layout/home/pageDesign.vue

@@ -150,6 +150,7 @@
             :is="rightcom"
             :datas="currentproperties"
             @componenmanagement="componenmanagement"
+            @data-from-child="handleDataFromChild"
           />
         </transition>
         <img src="" alt="" />
@@ -294,6 +295,15 @@ export default {
   },
   data() {
     return {
+      selectFormData:{
+        name: '',
+        pageJson: '',
+        fromMapDb:[],
+        selectQualifiedField:[],
+        selectMapValue:{
+          selectDataKey: [{ label: '', value: '' }]
+        }
+      },
       clickTimer: null,
       isSingleClick: false, // 是否是单击
       clickTimer: null, // 存储定时器引用
@@ -336,6 +346,22 @@ export default {
   },
 
   methods: {
+    handleDataFromChild({selectQualifiedField, selectMapValue}) {
+      let a= new Map();
+      console.log('从孙组件接收到的数据1:', '1:',selectQualifiedField,'2:',selectMapValue);
+      // 在这里处理接收到的数据,比如更新状态等
+      this.selectFormData.selectQualifiedField = JSON.stringify(selectQualifiedField);
+      // this.selectFormData.selectMapValue = JSON.stringify(selectMapValue);
+      let selectDataKeyValue = selectQualifiedField[0].selectDataKey;
+      console.log(selectDataKeyValue,"1111111");
+      console.log(selectDataKeyValue);
+      a.set(selectDataKeyValue,selectMapValue)
+  
+      a.selectDataKeyValue 
+      this.selectFormData.selectMapValue = a
+      // this.selectFormData.selectMapValue.selectDataKey = selectQualifiedField[0].selectDataKey;
+      // this.selectFormData.selectMapValue.selectDataKey.push(selectMapValue);
+    },
     // 预览回调
     previewHandle() {
       this.$refs.myRealTimeView.changeShowHandler();
@@ -371,9 +397,19 @@ export default {
 
     // 添加JSON数据
     addJSONData() {
-      let payload = this.getJSONData();
-      console.log(payload);
-      addmobilePageData(payload).then((response) => {
+      let JSONData = this.getJSONData();
+      // console.log(JSONData,898989);
+      this.selectFormData.name = JSONData.name; 
+      this.selectFormData.pageJson = JSONData.pageJson; 
+      let fromMapDbData = {
+        tableName: this.pageComponents[0].setStyle.tableName,
+        filderName: this.pageComponents[0].setStyle.jsonData[0].fieldName,
+        componentKey: this.pageComponents[0].component
+      };
+      let jsonString = JSON.stringify(fromMapDbData);
+      this.selectFormData.fromMapDb = jsonString
+      console.log(this.selectFormData,666666666666666666);
+      addmobilePageData(this.selectFormData).then((response) => {
         if (response.code == 200) {
           //成功
           this.$modal.msgSuccess("保存成功");
@@ -714,7 +750,7 @@ export default {
       /* 丢样式 */
       this.currentproperties = data.setStyle;
 
-      console.log(
+      console.log(5555,
         data,
         this.rightcom,
         this.currentproperties,