modified: src/components/view/equipmentmaintain.vue modified: src/com...

Fixiaobai

2023-09-20 039d01c3ee6217e18ef3bcaec263fd2ad59e6f68

 src/components/view/standard-table/material.vue

@@ -1,36 +1,50 @@
<template>
    <div class="standard">
      <div>
            <el-table :data="tableData" style="width: 100%;margin-bottom: 20px;" row-key="id" border
              @selection-change="handleSelectionChange" default-expand-all
      <div style="width: 100%;height: 68vh;overflow-x: auto;">
            <el-table :data="tableData"  row-key="rowId" border height="calc(90vh - 200px)"
            @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">
              <el-table-column prop="father" label="工序" width="200" :resizable="false">
                <template slot-scope="scope">
                      <el-tag v-if="scope.row.children" type="primary">01</el-tag>
                      <span style="color: #000000">
                        {{ scope.row.father }}
                      </span>
                  <el-tag class="tag" v-if="scope.row.father != null" type="primary">01</el-tag>
                  <span style="color: #000000">
                    {{ scope.row.father }}
                  </span>
              </template>
              </el-table-column>
              <el-table-column prop="name" sortable label="工艺名称">
              <el-table-column prop="tname" label="工艺名称" width="200" :resizable="false">
                <template slot-scope="scope">
                          <el-tag type="success" v-if="!scope.row.children">02</el-tag>
                          <span style="color: black">
                            {{ scope.row.name  }}
                          </span>
                          </template>
                  <el-tag type="success" v-if="scope.row.tname != null" class="tag">02</el-tag>
                  <span style="color: #000000">
                    {{ scope.row.tname  }}
                  </span>
                  </template>
              </el-table-column>
              <el-table-column prop="mname" label="材料名称">
              <el-table-column prop="mname" label="材料名称" width="200" :resizable="false">
                <template slot-scope="scope">
                  <el-tag type="info" class="tag" color="#faf2ff" v-if="scope.row.mname != null">
                    <span style="color: #e1affb">03</span>
                  </el-tag>
                  <span>
                    {{scope.row.mname}}
                  </span>
                </template>
              </el-table-column>
              <el-table-column prop="specifications" label="规格">
              <el-table-column prop="specifications" label="规格" :resizable="false">
              </el-table-column>
              <el-table-column prop="unit" label="单位">
              <el-table-column prop="unit" label="单位" :resizable="false">
              </el-table-column>
              <el-table-column prop="num" label="数量">
              <el-table-column prop="num" label="数量" :resizable="false">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.num" 
                    v-if="scope.row.mname != null" size="small"
                    @blur="updateVal(scope.row)"></el-input>
                </template>
              </el-table-column>
            </el-table>
          </div>
@@ -41,20 +55,90 @@
    export default {
      data() {
        return {
          selects: []
          hasChildren:true,
          selects: [],
          isAllSelect:false,
          deleteList:[],
        }
      },
      props:['tableData','tableType'],
      created() {
        console.log(this.tableData,this.tableType)
      },
      mounted() {
        
      },
      created() {},
      mounted() {},
      methods: {
        updateVal(row){
          this.$axios.post(this.$api.url.mBomWrite,{
            id : row.id,
            num : row.num
          }).then(res=>{
            this.$message.success(res.message);
          }).catch(error=>{
            this.$message.error(error.message);
          })
        },
        // 表格树全部选中配置
        // 全选/取消选操作
        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);
              });
            }
          }
        },
        //改变选中
        toggleSelection(row, flag) {
          this.$set(row, "isChecked", flag);
          this.$nextTick(() => {
            if (flag) {
              this.$refs.multipleTable.toggleRowSelection(row, flag);
            } else {
              this.$refs.multipleTable.clearSelection();
            }
          });
        },
        handleSelectionChange(val) {
          this.selects = val;
        this.deleteList = [];
        val.forEach((v) => {
          this.searchIdFun(v);
        });
        this.$emit("childData",this.deleteList);
      },
      //递归查找选中数据id
      searchIdFun(data){
        let obj = data;
        if(obj.children != undefined){
          this.searchIdFun(obj.children);
        }else{
          this.deleteList.push(obj.id);
        }
      },
        // 表格树全部选中配置  结束
      }
    }
  </script>
@@ -63,6 +147,17 @@
    .standard {
      width: 100%;
      height: 100%;
    }
    .tag{
      line-height:24px;
      text-align:center;
      width:36px;
      height:24px;
      
      border-radius:12px;
    }
    .tag:nth-child(1){
      margin-left:20px;
    }
  </style>
  <style>
@@ -98,8 +193,8 @@
    .standard .el-table__body {
      height: 100%;
    }
    .standard .el-table .el-table__row:not([class*="el-table__row--level-"]) td:nth-child(3){
    /* .standard .el-table .el-table__row:not([class*="el-table__row--level-"]) td:nth-child(3){
      padding-left: 23px !important;
     }
     } */
  </style>