Browse Source

Merge branch 'master' of http://120.26.64.82:3000/BFFE/CABaggageData2.0

zhongxiaoyu 2 years ago
parent
commit
77f33cbb7a
2 changed files with 120 additions and 11 deletions
  1. 111 11
      src/components/Table/index.vue
  2. 9 0
      src/layout/components/ToolBar/index.vue

+ 111 - 11
src/components/Table/index.vue

@@ -5,7 +5,7 @@
         <el-button size="small" @click="handleAdd" plain type="primary">新增</el-button>
       </div>
       <template v-if="tableData.length">
-        <el-table :data="filteredTableData" :span-method="tableSpanMethod" stripe show-summary border ref="table" :height="minHeight - 8 + 'vh'" class="table" style="width: 100%; overflow: auto">
+        <el-table :data="filteredTableData" :summary-method="getSummaries" :span-method="tableSpanMethod" stripe show-summary border ref="table" :height="minHeight - 8 + 'vh'" class="table" style="width: 100%; overflow: auto">
           <el-table-column v-for="(item, index) in tableColsCopy" :sortable="item.needSort ? true : false" :key="index" :prop="item.columnName" :label="item.columnLabel">
             <template #header>
               <span class="colTips">
@@ -33,10 +33,14 @@
               </span>
             </template>
           </el-table-column>
-          <el-table-column fixed="right" label="操作" width="100">
+          <el-table-column fixed="right" label="操作" width="130">
             <template slot-scope="scope">
-              <el-button type="text" @click="handleEdit(scope.row)" size="small" class="rmScs">编辑</el-button>
-              <el-button class="rmSc" type="text" @click="handleRemove(scope.row)" size="small">删除</el-button>
+              <div class="hd-td">
+                <div class="hd-tr">
+                  <el-button type="text" @click="handleEdit(scope.row)" size="small" class="rmScs">编辑</el-button>
+                  <el-button class="rmSc" type="text" @click="handleRemove(scope.row)" size="small">删除</el-button>
+                </div>
+              </div>
             </template>
           </el-table-column>
         </el-table>
@@ -55,13 +59,18 @@
               <el-row :gutter="20">
                 <el-col v-for="(item, index) in tableColsCopy" :key="index" :span="rows">
                   <el-form-item :label="item.columnLabel">
-                    <!-- <template v-if="
-                        item.dataType == 'longtext' ||
-                        item.dataType.includes('int')
+                    <template v-if="
+                        item.listqueryTemplateID ||
+                        item.listqueryTemplateID == 0
                       ">
+                      <el-select size="small" clearable style="width: 100%" v-model="tableForm[item.columnName]" placeholder="请选择">
+                        <el-option v-for="item in tableOptions[item.columnName]" :key="item.v" :label="item.k" :value="item.v">
+                        </el-option>
+                      </el-select>
+                    </template>
+                    <template v-else>
                       <el-input size="small" v-model="tableForm[item.columnName]"></el-input>
-                    </template> -->
-                    <el-input size="small" v-model="tableForm[item.columnName]"></el-input>
+                    </template>
                   </el-form-item>
                 </el-col>
               </el-row>
@@ -150,6 +159,9 @@ export default {
       tableForm: {}, //弹框表单
       rmTitle: "", //弹框-删除-标题
       tableObj: {}, //增/删/改数据缓存
+      tableOptions: {}, //弹框-下来数据缓存
+      tableArrs: [], //重组table-表头下拉
+      proAll: false //重组时-所有请求是否都完成
     };
   },
   computed: {
@@ -183,6 +195,18 @@ export default {
       });
     },
   },
+  watch: {
+    proAll: {
+      handler (val) {
+        if (val) {
+          setTimeout(() => {
+            this.setTable()
+          }, 200);
+        }
+      },
+      deep: true
+    }
+  },
   created () {
     this.getQuery();
   },
@@ -246,15 +270,62 @@ export default {
       this.tableColsCopy = this.tableCols.filter((item) => item.needShow);
       this.tableDataCopy = _.cloneDeep(this.tableData);
       const datas = _.cloneDeep(this.tableColsCopy);
-      datas.forEach((item) => {
+      const reqUts = []
+      datas.forEach(async (item) => {
         this.tableDataFilters[item.columnName] = [];
         if (item.needGroup) {
           this.tableGroups.push(item.columnName);
         }
+        if (item.listqueryTemplateID || item.listqueryTemplateID == 0) {
+          this.tableArrs.push(item.columnName)
+          const reqUt = this.getSelectData(item.listqueryTemplateID)
+          reqUts.push(reqUt)
+          this.tableOptions[item.columnName] = await this.getSelectData(item.listqueryTemplateID)
+        }
         // this.filterValues[item.columnName] = ''
       });
       setTableFilters(this.tableData, this.tableDataFilters);
       this.tableGroup(this.tableData);
+      this.getSelectDataAll(reqUts)
+    },
+    //获取所有获取弹框-下拉数据-请求状态
+    getSelectDataAll (reqUts) {
+      Promise.all(reqUts).then(res => {
+        this.proAll = true
+      }).catch(err => {
+        this.proAll = false
+      })
+    },
+    //获取弹框-下拉数据
+    async getSelectData (id) {
+      const { code, returnData } = await Query({
+        id,
+        dataContent: [],
+      });
+      if (code == 0) {
+        return returnData.listValues;
+      } else {
+        return [];
+      }
+    },
+    //重组table-显示名称
+    setTable () {
+      this.tableArrs.forEach(item => {
+        this.tableOptions[item].forEach(p => {
+          this.tableDataCopy.forEach(msg => {
+            if (msg[item] == p.v) {
+              msg[item] = p.k
+            }
+          })
+          this.tableDataFilters[item].forEach(cap => {
+            if (cap.value == p.v) {
+              cap.text = p.k
+              cap.value = p.k
+            }
+          })
+        })
+      })
+      this.tableData = this.tableDataCopy
     },
     //分组
     tableGroup (tableData) {
@@ -294,6 +365,30 @@ export default {
         };
       }
     },
+    //合计
+    getSummaries (param) {
+      const { columns, data } = param;
+      const sums = [];
+      columns.forEach((column, index) => {
+        this.tableColsCopy.forEach((p) => {
+          if (column.property == p.columnName && p.needCount) {
+            const values = data.map((item) => Number(item[column.property]));
+            if (!values.every((value) => isNaN(value))) {
+              sums[index] = values.reduce((prev, curr) => {
+                const value = Number(curr);
+                if (!isNaN(value)) {
+                  return prev + curr;
+                } else {
+                  return prev;
+                }
+              }, 0);
+              sums[index] += "";
+            }
+          }
+        });
+      });
+      return sums;
+    },
     //弹框-确定
     handleOk () {
       this.submitClickHandler();
@@ -308,6 +403,7 @@ export default {
       this.tableType = "add";
       this.tableTitle = "新增";
       this.tableForm = {};
+      console.log(this.tableOptions);
     },
     //表格-编辑
     handleEdit (row) {
@@ -411,7 +507,7 @@ export default {
       align-items: center;
       justify-content: center;
       float: left;
-      margin-right: 2px;
+      margin: 0 7px;
       span {
         color: #2d67e3;
       }
@@ -436,6 +532,10 @@ export default {
         }
       }
     }
+    .hd-td {
+      display: flex;
+      justify-content: center;
+    }
   }
   .data-table-btn {
     margin-bottom: 20px;

+ 9 - 0
src/layout/components/ToolBar/index.vue

@@ -45,10 +45,12 @@ export default {
   created() {
     const path = this.$route.path;
     const pathArr = path.split("/");
+    // console.log(path);
     if (pathArr.length > 2) {
       //子路由
       const name = pathArr[pathArr.length - 2];
       const childName = pathArr[pathArr.length - 1];
+      path;
       this.getRoutes(name, childName);
     } else {
       //一级路由
@@ -79,6 +81,13 @@ export default {
       } else {
         this.dataArr = arrs;
       }
+      if (this.dialog == false) {
+        this.dataArr.forEach((res, index) => {
+          if (res.path == this.$route.path) {
+            this.$store.dispatch("app/toggleDialog", index);
+          }
+        });
+      }
     },
   },
 };