fix:补充提交表格修改0

ruoyi-ui/src/api/relateTable/index.js

@@ -43,3 +43,13 @@ export function delGroup(id) {
     method: 'delete'
   })
 }
+
+// 查询联动表格列表
+export function dragGroupTableInfo(query) {
+  return request({
+    url: '/dragform/common/dragGroupTableInfo',
+    method: 'get',
+    params: query,
+    baseURL: process.env.VUE_APP_BASE_API3
+  })
+}

ruoyi-ui/src/views/relateTable/components/RelateTableCard.vue

@@ -1,12 +1,13 @@
 <template>
   <el-card class="box-card" :body-style="{ padding: '0px' }">
     <div slot="header" class="clearfix">
+      <el-button icon="el-icon-plus" type="primary" @click="handleAdd">新增</el-button>
       <el-tag class="tag_NO">{{ Number(index) + 1 }}</el-tag>
       <span class="title">{{ cardData.title }}</span>
-      <el-button icon="el-icon-plus" type="primary">操作按钮</el-button>
     </div>
     <!-- body -->
     <el-table
+      v-loading="loading"
       ref="singleTable"
       :data="cardData.tableData"
       height="300"
@@ -14,28 +15,201 @@
       @current-change="handleCurrentChange"
       style="width: 100%"
     >
-      <el-table-column type="index" width="50"> </el-table-column>
-      <el-table-column property="date" label="日期" width="120">
+    <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="scope">
+          <el-dropdown>
+            <el-button type="warning" plain size="small">
+              处理<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-edit"
+                  @click="handleUpdate(scope.row)"
+                >修改
+                </el-button>
+              </el-dropdown-item>
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-delete"
+                  @click="handleDelete(scope.row)"
+                >删除
+                </el-button>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </template>
       </el-table-column>
-      <el-table-column property="name" label="姓名" width="120">
+      <el-table-column 
+        v-for="item in columns"
+        :key="item.key"
+        :label="item.value"
+        align="center"
+        :prop="item.key">
       </el-table-column>
-      <el-table-column property="address" label="地址"> </el-table-column>
     </el-table>
+        <!-- 添加或修改销售出库单：- 过磅记录生成数据对话框 -->
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
+      <k-form-build
+        class="formBuild"
+        ref="addFromRef"
+        :defaultValue="defaultValue"
+        @submit="tempSubBtn"
+        :value="jsonData"
+      />
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="editConfirmHandler">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </el-card>
 </template>
 
 <script>
+import {
+  delTableData,
+  dragTableInfo,
+  listTable,
+  unionListTableData,
+  getInfoBySqlKey,
+  addTableData,
+  batchEdit,
+  getStatisticList
+} from "@/api/tablelist/commonTable";
+import {camelCase} from "@/utils";
+import {dragGroupTableInfo} from "@/api/relateTable/index"
+import { tableInfo } from "@/api/dataEngine";
+import {inputDisableComplete} from "@/utils/other";
+
 export default {
   name: "RelateTableCard",
   props: ["cardData", "index"],
   components: {},
   data() {
     return {
-      currentRow: null,
+      // 弹出层标题
+      title: "",
+      // cru 弹窗
+      open: false,
+      // 回显表格数据,
+      defaultValue: {},
+      //存放表单渲染数据
+      jsonData: {},
+      // 遮罩层
+      loading: true,
+      // 表格组标识
+      groupKey: null,
+      // 共通查询参数接受子组件的参数
+      queryParams: {
+        pageNum: 1, // 第几页
+        pageSize: 10, // 每页大小
+        orderByColumn: "", // 根据某列排序
+        isAsc: "", // desc（降序）或 asc（升序）
+        // 基本查询参数
+        basicMap: {
+          tableName: "drag_form",
+        },
+        // 当前表字段筛选参数
+        queryMap: {
+          // 当前查询基本参数
+          // ... key : value         当前页面的筛选条件
+          // 超级查询的唯一值
+          queryCriteriaValue: "",
+        },
+      },
+      // 排序方式 默认降序
+      sortOrder: true,
+      // 当前模版信息
+      templateInfo: {},
+      // 用户表格数据
+      tableList: [],
+      // 列信息
+      columns: {},
     };
   },
+  created() {
+    this.groupKey = this.$route.query.groupKey;
+    this.getList()
+  },
   computed: {},
   methods: {
+    /** 查询列表 */
+    async getList(queryParams) {
+      this.loading = true;
+      // 序列化当前查询参数列表
+      queryParams && (this.queryParams.queryMap = queryParams.queryMap);
+      // 获取当前表单结构信息
+      let result = await  dragGroupTableInfo({queryMap: {groupKey: this.groupKey}})
+      if(result.code == 200){
+        let list = JSON.parse(result.msg)
+        let res = await dragTableInfo({queryMap: {tableKey : list[0].tableKey}})
+        console.log(res);
+        // 得到当前模版信息 --- sql columns queryWhere
+        this.templateInfo = res.data.resultMap;
+        console.log(this.templateInfo.template);
+        this.queryParams.orderByColumn =
+          res.data.resultMap.querySql.orderByColumn;
+        this.sortOrder = JSON.parse(res.data.resultMap.querySql.sortOrder);
+        // 根据拖拽时设置当前列表排列顺序
+        this.queryParams.isAsc = this.sortOrder ? "DESC" : "ASC"
+        this.tableName = this.templateInfo.template.dtTableName;
+        // 得到查询条件
+        this.queryFromWhere = res.data.resultMap.where;
+        //  得到当前列表信息
+        this.columns = this.columnsHandler(
+          JSON.parse(this.templateInfo.template.dtColumnName)
+        );
+      }
+        
+      if (this.templateInfo == {}) return;
+      // 调用查询需要携带当前table的唯一标识
+      this.queryParams.queryMap.sqlKey = this.templateInfo.template.sqlKey;
+      this.queryParams.orderByColumn = camelCase(
+        this.queryParams.orderByColumn || ""
+      );
+      // 根据sql语句查询当前表数据
+      console.log(this.queryParams)
+      unionListTableData(this.queryParams).then((res) => {
+        // console.log('unionListTableData');
+        console.log('res', res);
+        this.tableList = [];
+        res.rows.forEach((item) => {
+          this.tableList.push(item.resultMap);
+        });
+        // 驼峰转换
+        this.tableList = this.tableList.map((item) => {
+          let kv = {};
+          for (let itemKey in item) {
+            kv[camelCase(itemKey)] = item[itemKey];
+          }
+          return kv;
+        });
+        this.total = res.total;
+        this.loading = false;
+      });
+
+    },
+    // 处理列表信息
+    columnsHandler(columns) {
+      let resArr = [];
+      columns.forEach((item) => {
+        for (const key in item) {
+          let tempObj = {};
+          tempObj.key = camelCase(key);
+          tempObj.value = item[key];
+          resArr.push(tempObj);
+        }
+      });
+      return resArr;
+    },
     handleCurrentChange(val) {
       // 调用父组件方法更新表格数据
       this.$emit(
@@ -45,6 +219,99 @@ export default {
         this.$props.index
       );
     },
+    /** 新增按钮操作 */
+    handleAdd(row) {
+      // this.reset();
+      this.defaultValue = {};
+      getInfoBySqlKey(this.templateInfo.template.sqlKey).then(({data}) => {
+        if (!data || !data.dfVueTemplate) {
+          this.$message.error("当前表格未绑定表单!");
+          return;
+        }
+        this.jsonData = JSON.parse(data.dfVueTemplate);
+        this.open = true;
+        this.title = "添加信息";
+        // this.form.password = this.initPassword;
+        this.$nextTick(() => {
+          this.$refs.addFromRef.reset();
+          inputDisableComplete();
+        });
+      });
+    },
+    // 使用提交数据类型的按钮获取数据
+    tempSubBtn(getData) {
+      getData()
+        .then((values) => {
+          console.log("验证通过", values);
+        })
+        .catch(() => {
+          console.log("验证未通过，获取失败");
+        });
+    },
+    //提交编辑结果按钮回调
+    editConfirmHandler() {
+      this.$refs.addFromRef
+        .getData()
+        .then(async (values) => {
+          let data = {
+            basicMap: {
+              tableName: this.tableName,
+            },
+            addListMap: [values],
+          };
+          if (Object.keys(this.defaultValue).length) {
+            let updateData = {
+              // 基本参数
+              basicMap: {
+                // 表名
+                tableName: this.tableName,
+              },
+              conditionMap: {},
+              commMap: {},
+            };
+
+            // 后台接收需要是表中字段真实的名称，无所谓驼峰。
+          updateData.conditionMap[this.templateInfo.template?.primaryKey] =
+              this.defaultValue[
+                camelCase(this.templateInfo.template?.primaryKey)
+                ];
+            Object.keys(values).map((k) => {
+              updateData.commMap[k] = values[k];
+            });
+            let res = await batchEdit(updateData);
+            if (res.code == 200) {
+              this.$modal.msgSuccess("修改成功");
+            } else {
+              this.$modal.msgError("修改失败");
+            }
+            this.getList();
+          } else {
+            let res = await addTableData(data);
+            if (res.code == 200) {
+              this.$modal.msgSuccess("添加成功");
+            } else {
+              this.$modal.msgError("添加失败");
+            }
+            this.getList();
+          }
+          this.defaultValue = {};
+          this.toParentVal()
+          this.open = false;
+        })
+        .catch((res) => {
+          this.$modal.msgError("表单校验失败,请规范填写数据");
+        });
+    },
+    toParentVal(){
+      console.log(123);
+      this.$emit('tansToParent', this.getList())
+      this.$emit('formtansToParent', this.templateInfo.where)
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      // this.reset();
+    },
   },
 };
 </script>

ruoyi-ui/src/views/relateTable/index.vue

@@ -388,7 +388,7 @@
           </el-table>
           </el-form-item>
           <el-form-item class="btn">
-            <el-button @click="isShowForm = false">取消</el-button>
+            <el-button @click="cancelAddHandler">取消</el-button>
             <el-button type="primary" @click="confirmAddHandler('tableItemForm')">确认</el-button>
           </el-form-item>
         </el-form>
@@ -843,16 +843,23 @@ export default {
           return false;
           }
           // 判断是新增还是修改 true新增
+          let echoData = {
+            tableName: this.tableItemForm.tableName,
+            tableFieldData: this.tableFieldList,
+            formData: this.groupForm,
+          }
+          // 判断修改还是新增
           if(this.relateTitle){    
-            
-            let echoData = {
-              tableName: this.tableItemForm.tableName,
-              tableFieldData: this.tableFieldList,
-              formData: this.groupForm,
-            }
+            this.tableItemForm.rowId = Date.now();
+                       
+            this.groupList.push({tableFieldList: this.tableFieldList, tableItemForm: this.tableItemForm})
+
+            this.tableDataList.push(this.tableItemForm);
+
             let tableKey = uuidv4();
             let sqlKey = uuidv4();
             this.addDragData.push({
+            rowId: this.tableItemForm.rowId,
             tId: this.tId,
             dtName: this.tableItemForm.title,
             tableKey: tableKey,
@@ -869,10 +876,6 @@ export default {
             echoData: JSON.stringify(echoData),
             })
 
-            this.tableItemForm.rowId = Date.now();
-            this.groupList.push({tableFieldList: this.tableFieldList, tableItemForm: this.tableItemForm})
-
-            this.tableDataList.push(this.tableItemForm);
           } else {
             let columns = [],
             searchFieldList = []
@@ -906,6 +909,7 @@ export default {
       // console.log(row);
       // console.log('修改', this.groupList);
       // 展示字段的回显
+      console.log(this.addDragData);
       this.groupList.forEach(item => {
         if(item.tableItemForm.rowId == row.rowId) {
           this.tableFieldList = item.tableFieldList
@@ -915,6 +919,12 @@ export default {
       this.isShowForm = true;
       this.tableItemForm = row
     },
+    // 取消新增
+    cancelAddHandler(){
+      this.isShowForm = false;
+      this.tableItemForm = {}
+      this.tableFieldList = []
+    },
     // 更新路由
     reloadRouter() {
       this.$store.dispatch("GenerateRoutes").then((accessRoutes) => {
@@ -974,7 +984,7 @@ export default {
               orderNum: this.menuOrderNum,
               parentId: this.groupForm.routePath,
               path: groupKeyObj.groupKey,
-              query: JSON.stringify(groupKey),
+              query: JSON.stringify(groupKeyObj),
               status: "0",
               visible: "0",
             };
@@ -984,6 +994,7 @@ export default {
             if(result.code == 200){
               this.reloadRouter();
               let data = {
+                groupKey: groupKeyObj.groupKey,
                 groupName: '',
                 groupDescription: '',
                 groupTableInfo: [],
@@ -991,7 +1002,7 @@ export default {
               }
               this.addDragData.forEach((item, index) => {
               item.menuId = result.data;
-              item.sqlKey = tableKeyObj.tableKey
+              // item.sqlKey = tableKeyObj.tableKey
               let echo = JSON.parse(item.echoData)
               echo.formData = this.groupForm
               item.echoData = JSON.stringify(echo)
@@ -1005,7 +1016,9 @@ export default {
             data.groupTableInfo = JSON.stringify(data.groupTableInfo)
             data.dragTables = this.addDragData
 
+            // 添加表格组
             let res = await addGroup(data)
+
             if(res.code == 200){
               this.$message.success("创建成功");
 
@@ -1198,6 +1211,10 @@ export default {
     // 新增一个联动表格
     addOneTable() {
       this.relateTitle = true
+      if(this.relateTitle == true){
+        this.tableItemForm = {}
+        this.tableFieldList = []
+      }
       this.getAllTable()
       // 注意校验最后一条数据是否合法
       this.isShowForm = true;

ruoyi-ui/src/views/relateTable/relateTableEdit.vue

@@ -9,6 +9,8 @@
             :key="index"
           >
             <TableCard
+              @tansToParent="tansToParent"
+              @formtansToParent="formtansToParent"
               @updateData="updateDataList"
               :cardData="cardData"
               :index="index"
@@ -34,80 +36,80 @@ export default {
           tableId: "1",
           title: "一级表格",
           tableData: [
-            {
-              date: "2016-05-02",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1518 弄",
-            },
-            {
-              date: "2016-05-04",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1517 弄",
-            },
-            {
-              date: "2016-05-01",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1519 弄",
-            },
-            {
-              date: "2016-05-03",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1516 弄",
-            },
-          ],
-        },
-        {
-          tableId: "2",
-          title: "二级表格",
-          tableData: [
-            {
-              date: "2016-05-02",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1518 弄",
-            },
-            {
-              date: "2016-05-04",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1517 弄",
-            },
-            {
-              date: "2016-05-01",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1519 弄",
-            },
-            {
-              date: "2016-05-03",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1516 弄",
-            },
-          ],
-        },
-        {
-          tableId: "3",
-          title: "三级表格三级表格三级表格三级表格",
-          tableData: [
-            {
-              date: "2016-05-02",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1518 弄",
-            },
-            {
-              date: "2016-05-04",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1517 弄",
-            },
-            {
-              date: "2016-05-01",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1519 弄",
-            },
-            {
-              date: "2016-05-03",
-              name: "王小虎",
-              address: "上海市普陀区金沙江路 1516 弄",
-            },
+            // {
+            //   date: "2016-05-02",
+            //   name: "王小虎",
+            //   address: "上海市普陀区金沙江路 1518 弄",
+            // },
+            // {
+            //   date: "2016-05-04",
+            //   name: "王小虎",
+            //   address: "上海市普陀区金沙江路 1517 弄",
+            // },
+            // {
+            //   date: "2016-05-01",
+            //   name: "王小虎",
+            //   address: "上海市普陀区金沙江路 1519 弄",
+            // },
+            // {
+            //   date: "2016-05-03",
+            //   name: "王小虎",
+            //   address: "上海市普陀区金沙江路 1516 弄",
+            // },
           ],
         },
+        // {
+        //   tableId: "2",
+        //   title: "二级表格",
+        //   tableData: [
+        //     {
+        //       date: "2016-05-02",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1518 弄",
+        //     },
+        //     {
+        //       date: "2016-05-04",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1517 弄",
+        //     },
+        //     {
+        //       date: "2016-05-01",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1519 弄",
+        //     },
+        //     {
+        //       date: "2016-05-03",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1516 弄",
+        //     },
+        //   ],
+        // },
+        // {
+        //   tableId: "3",
+        //   title: "三级表格三级表格三级表格三级表格",
+        //   tableData: [
+        //     {
+        //       date: "2016-05-02",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1518 弄",
+        //     },
+        //     {
+        //       date: "2016-05-04",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1517 弄",
+        //     },
+        //     {
+        //       date: "2016-05-01",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1519 弄",
+        //     },
+        //     {
+        //       date: "2016-05-03",
+        //       name: "王小虎",
+        //       address: "上海市普陀区金沙江路 1516 弄",
+        //     },
+        //   ],
+        // },
       ],
     };
   },
@@ -117,6 +119,12 @@ export default {
       console.log(`第${index}个关联表的${row}行选中了,tableId:${tableId}`);
       // 更新对应card数据,并清空后续表格数据
     },
+    tansToParent(val){
+      console.log(val)
+    },
+    formtansToParent(val){
+      console.log(val);
+    }
   },
 };
 </script>
@@ -125,8 +133,7 @@ export default {
 .card_list {
   display: flex;
   .card_wrap {
-    // max-height: 400px;
-    max-width: 400px;
+    max-width: 600px;
     margin-right: 20px;
   }
 }

ruoyi-ui/src/views/tablelist/commonTable/listInfo.vue

@@ -18,7 +18,7 @@
           '&tableName=' +
           tableName +
           '&sqlKey=' +
-          sqlkey
+          tableKey
         "
         v-loading="upload.isUploading"
         :disabled="upload.isUploading"
@@ -291,7 +291,7 @@ export default {
       // 查询条件
       queryFromWhere: {},
       // 当前table唯一标识
-      sqlkey: null,
+      tableKey: null,
       // 当前表名称
       tableName: null,
       //存放html代码块
@@ -318,9 +318,10 @@ export default {
       // 获取当前表单结构信息
       dragTableInfo({queryMap: {tableKey: this.tableKey}})
         .then((res) => {
+          console.log(res);
           // 得到当前模版信息 --- sql columns queryWhere
           this.templateInfo = res.data.resultMap;
-          console.log('res', this.templateInfo)
+          // console.log('res', this.templateInfo)
           this.queryParams.orderByColumn =
             res.data.resultMap.querySql.orderByColumn;
           this.sortOrder = JSON.parse(res.data.resultMap.querySql.sortOrder);
@@ -337,7 +338,7 @@ export default {
         .finally((fes) => {
           if (this.templateInfo == {}) return;
           // 调用查询需要携带当前table的唯一标识
-          this.queryParams.queryMap.sqlkey = this.templateInfo.template.sqlKey;
+          this.queryParams.queryMap.sqlKey = this.templateInfo.template.sqlKey;
           this.queryParams.orderByColumn = camelCase(
             this.queryParams.orderByColumn || ""
           );
@@ -467,7 +468,7 @@ export default {
     handleAdd(row) {
       // this.reset();
       this.defaultValue = {};
-      getInfoBySqlKey(this.sqlkey).then(({data}) => {
+      getInfoBySqlKey(this.templateInfo.template.sqlKey).then(({data}) => {
         if (!data || !data.dfVueTemplate) {
           this.$message.error("当前表格未绑定表单!");
           return;
@@ -484,7 +485,7 @@ export default {
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      getInfoBySqlKey(this.sqlkey).then(({data}) => {
+      getInfoBySqlKey(this.templateInfo.template.sqlKey).then(({data}) => {
         if (!data || !data.dfVueTemplate) {
           this.$message.error("当前表格未绑定表单!");
           return;
@@ -597,7 +598,7 @@ export default {
     importTemplate() {
       this.download(
         process.env.VUE_APP_BASE_API3 +
-        `common/exportTemplate?tableName=${this.tableName}&sqlkey=${this.sqlkey}`,
+        `common/exportTemplate?tableName=${this.tableName}&sqlkey=${this.templateInfo.template.sqlKey}`,
         {},
         `下载模版名称${new Date().getTime()}.xlsx`
       );
@@ -690,6 +691,7 @@ export default {
         .catch((res) => {
           this.$modal.msgError("表单校验失败,请规范填写数据");
         });
+        
     },
     // 使用提交数据类型的按钮获取数据
     tempSubBtn(getData) {