feat: 表格组件新增表头配置组件, 各列表页适配此组件

songshankun

2023-09-23 7f0ec738a0af4d9d334ce85012f864f2519ebb3f

 src/views/purchaseManage/purchase/index.vue

@@ -22,6 +22,7 @@
              ref="tableListRef"
              :table-list="tableList"
              @selCommonClick="selCommonClick"
              @selTableCol="selTableCol"
          >
            <template slot="tableButton">
              <el-table-column  label="状态" width="120">
@@ -84,7 +85,18 @@
        title: "创建",
        infomation: {}
      },
      purchaseStatusList: getDataByType("purchaseStatus")
      purchaseStatusList: getDataByType("purchaseStatus"),
      tableColumn: [
        { label: "采购单号", prop: "number", min: 150, isCommonClick: true },
        { label: "采购单名称", prop: "name", min: 130, isCommonClick: true },
        { label: "单据类型", prop: "orderType", min: 130 },
        { label: "供应商名称", prop: "contact", min: 130 },
        { label: "采购数量", prop: "quantity", min: 130 },
        { label: "收货仓库", prop: "warehouse", min: 130 },
        { label: "经办人", prop: "handledBy", min: 130 },
        { label: "制单人", prop: "creator", min: 130 }
      ],
      showCol: ['采购单号', '采购单名称', '单据类型', '供应商名称', '采购数量', '收货仓库', '经办人', '制单人']
    }
  },
  created() {
@@ -103,21 +115,27 @@
        return "--"
      }
    },
    setColumnVisible(showCol){
      return  this.tableColumn.map(ele=>{
        return {
          ...ele,
          isShowColumn:showCol.includes(ele.label)
        }
      })
    },
    setTable() {
      this.tableList = {
        tableInfomation: [],
        selectIndex: true,
        tableColumn: [
          { label: "采购单号", prop: "number", min: 150, isCommonClick: true },
          { label: "采购单名称", prop: "name", min: 130, isCommonClick: true },
          { label: "单据类型", prop: "orderType", min: 130 },
          { label: "供应商名称", prop: "contact", min: 130 },
          { label: "采购数量", prop: "quantity", min: 130 },
          { label: "收货仓库", prop: "warehouse", min: 130 },
          { label: "经办人", prop: "handledBy", min: 130 },
          { label: "制单人", prop: "creator", min: 130 }
        ]
        showcol: this.showCol,
        allcol: [],
        tableColumn:this.setColumnVisible(this.showCol)
      }
      this.tableList.allcol = this.tableList.tableColumn.filter(ele=>!ele.default).map(ele=>ele.label);
    },
    selTableCol(val) {
      this.showcol = val;
      this.tableList.tableColumn = this.setColumnVisible(val);
    },
    // 请求数据
    async getData() {