Fixiaobai
2023-09-20 12e26ca45149414930deecfef9e8f7ba3ae6d929
src/components/view/standard-table/target.vue
@@ -1,49 +1,49 @@
<template>
    <div class="standard">
      <div>
        <el-table ref="multipleTable" :data="tableData" row-key="rowId" border max-height="675"
        @select-all="selectAll" @select="selectTr"
      <div style="width: 100%;height: 68vh;overflow-x: auto;">
        <el-table ref="multipleTable" :data="tableData" row-key="rowId" border
        @select-all="selectAll" @select="selectTr"
        @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="60" label="序号"></el-table-column>
        <el-table-column prop="tfather" label="工序">
        <el-table-column  type="selection" width="55"></el-table-column>
        <el-table-column  type="index" width="60" label="序号"></el-table-column>
        <el-table-column prop="tfather" label="工序" width="200" :resizable="false">
            <template slot-scope="scope">
                <el-tag type="primary" v-if="scope.row.tfather != null">01</el-tag>
                <el-tag class="tag" type="primary" v-if="scope.row.tfather != null">01</el-tag>
                <span>{{scope.row.tfather}}</span>
            </template>
        </el-table-column>
        <el-table-column prop="tname" label="工艺名称">
        <el-table-column prop="tname" label="工艺名称" width="200" :resizable="false">
            <template slot-scope="scope">
                <el-tag type="success" v-if="scope.row.tname != null">02</el-tag>
                <el-tag type="success" v-if="scope.row.tname != null" class="tag">02</el-tag>
                <span>{{scope.row.tname}}</span>
            </template>  
        </el-table-column>
        <el-table-column prop="pfather" label="项目">
        <el-table-column prop="pfather" label="项目" width="200" :resizable="false">
            <template slot-scope="scope">
                <el-tag type="info" color="#faf2ff" v-if="scope.row.pfather != null">
                <el-tag type="info" color="#faf2ff" v-if="scope.row.pfather != null" class="tag">
                  <span style="color: #e1affb">03</span>
                </el-tag>
                <span>{{scope.row.pfather}}</span>
            </template>  
        </el-table-column>
        <el-table-column prop="pname" label="指标名称">
        <el-table-column prop="pname" label="指标名称" width="200" :resizable="false">
            <template slot-scope="scope">
                <span>{{scope.row.pname}}</span>
            </template>
        </el-table-column>
        <el-table-column prop="unit" label="单位"></el-table-column>
        <el-table-column prop="internal" label="内控值">
        <el-table-column prop="unit" label="单位" :resizable="false"></el-table-column>
        <el-table-column prop="internal" label="内控值" :resizable="false">
          <template slot-scope="scope">
            <el-input v-model="scope.row.internal" 
            v-if="scope.row.pname != null"
            v-if="scope.row.pname != null" size="small"
            @blur="updateVal(scope.row)"></el-input>
          </template>
        </el-table-column>
        <el-table-column prop="required" label="标准值">
        <el-table-column prop="required" label="标准值" :resizable="false">
          <template slot-scope="scope">
            <el-input v-model="scope.row.required" 
            v-if="scope.row.pname != null"
            v-if="scope.row.pname != null" size="small"
            @blur="updateVal(scope.row)"></el-input>
          </template>
        </el-table-column>
@@ -56,12 +56,19 @@
    export default {
      data() {
        return {
          tnameWidth:200,
          pfatherWidth:200,
          selects: [],
          deleteList:[],
          isAllSelect:false,
        }
      },
      props:['tableData','tableType'],
      created() {},
      mounted() {},
      created() {
      },
      mounted() {
      },
      methods: {
        // 表格树全部选中配置
      // 全选/取消选操作
@@ -72,6 +79,7 @@
      },
      //选择某行
        selectTr(selection, row) {
        console.log("sss---",selection,row);
        this.$set(row, "isChecked", !row.isChecked);
        this.$nextTick(() => {
          this.isAllSelect = row.isChecked;
@@ -80,6 +88,7 @@
      },
      //递归子级
      toggleSelect(data, flag, type) {
        console.log("递归子级---",data,flag,type);
        if (type === "all") {
          if (data.length > 0) {
            data.forEach((item) => {
@@ -99,13 +108,33 @@
          }
        }
      },
      //改变选中
      toggleSelection(row, flag) {
        console.log("改变选中---",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.deleteList = [];
        val.forEach((v) => {
          if (v.id !== undefined) {
            this.deleteList.push(v.id);
          }
          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.pid);
        }
      },
      // 表格树全部选中配置  结束
        updateVal(row){
@@ -116,11 +145,7 @@
          }).then(res=>{
            this.$message.success(res.message);
          }).catch(error=>{
            this.$message.error(error.message);
          })
        },
        handleSelectionChange(val) {
          this.selects = val;
        },
      }
    }
@@ -135,6 +160,17 @@
      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>
    .standard * {