zouyu
2023-09-11 1a874fa5f58c97c2cb8b3f38a1a089268f4bf124
src/components/view/standard-table/material.vue
@@ -1,12 +1,13 @@
<template>
    <div class="standard">
      <div>
            <el-table :data="tableData" max-height="675" style="width: 100%;margin-bottom: 20px;" row-key="rowId" border
            <el-table :data="tableData" max-height="675" row-key="rowId" border
            @select-all="selectAll" @select="selectTr" ref="multipleTable"
            @selection-change="handleSelectionChange" default-expand-all
              :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
              <el-table-column type="selection" width="55">
              </el-table-column>
              <el-table-column type="index" width="50" label="序号">
              <el-table-column type="index" width="60" label="序号">
              </el-table-column>
              <el-table-column prop="father" label="工序" sortable width="200px">
                <template slot-scope="scope">
@@ -19,7 +20,7 @@
              <el-table-column prop="tname" sortable label="工艺名称">
                <template slot-scope="scope">
                  <el-tag type="success" v-if="scope.row.tname != null">02</el-tag>
                  <span style="color: black">
                  <span style="color: #000000">
                    {{ scope.row.tname  }}
                  </span>
                  </template>
@@ -54,16 +55,54 @@
        }
      },
      props:['tableData','tableType'],
      created() {
        console.log(this.tableData,this.tableType)
      },
      mounted() {
      },
      created() {},
      mounted() {},
      methods: {
        // 表格树全部选中配置
        // 全选/取消选操作
        selectAll(val) {
          this.isAllSelect = !this.isAllSelect;
          let data = this.tableData;
          this.toggleSelect(data, this.isAllSelect, "all");
        },
        //选择某行
        selectTr(selection, row) {
          this.$set(row, "isChecked", !row.isChecked);
          this.$nextTick(() => {
            this.isAllSelect = row.isChecked;
            this.toggleSelect(row, row.isChecked, "tr");
          });
        },
        //递归子级
        toggleSelect(data, flag, type) {
          if (type === "all") {
            if (data.length > 0) {
              data.forEach((item) => {
                this.toggleSelection(item, flag);
                if (item.children && item.children.length > 0) {
                  this.toggleSelect(item.children, flag, type);
                }
              });
            }
          } else {
            if (data.children && data.children.length > 0) {
              data.children.forEach((item) => {
                item.isChecked = !item.isChecked;
                this.$refs.multipleTable.toggleRowSelection(item, flag);
                this.toggleSelect(item, flag, type);
              });
            }
          }
        },
        handleSelectionChange(val) {
          this.selects = val;
        }
          this.deleteList = [];
          val.forEach((v) => {
            if (v.id !== undefined) {
              this.deleteList.push(v.id);
            }
          });
        },
        // 表格树全部选中配置  结束
      }
    }
  </script>