| | |
| | | <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="pname" 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.pname != null"> |
| | | <span style="color: #e1affb">03</span> |
| | | <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="指标名称" 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.internal != 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.required != null" |
| | | v-if="scope.row.pname != null" size="small" |
| | | @blur="updateVal(scope.row)"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | export default { |
| | | data() { |
| | | return { |
| | | tnameWidth:200, |
| | | pfatherWidth:200, |
| | | selects: [], |
| | | deleteList:[], |
| | | isAllSelect:false, |
| | | } |
| | | }, |
| | | props:['tableData','tableType'], |
| | | created() {}, |
| | | mounted() {}, |
| | | created() { |
| | | }, |
| | | mounted() { |
| | | |
| | | }, |
| | | methods: { |
| | | // 表格树全部选中配置 |
| | | // 全选/取消选操作 |
| | |
| | | }, |
| | | //选择某行 |
| | | selectTr(selection, row) { |
| | | console.log("sss---",selection,row); |
| | | this.$set(row, "isChecked", !row.isChecked); |
| | | this.$nextTick(() => { |
| | | this.isAllSelect = row.isChecked; |
| | |
| | | }, |
| | | //递归子级 |
| | | toggleSelect(data, flag, type) { |
| | | console.log("递归子级---",data,flag,type); |
| | | if (type === "all") { |
| | | if (data.length > 0) { |
| | | data.forEach((item) => { |
| | |
| | | } |
| | | } |
| | | }, |
| | | //改变选中 |
| | | 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){ |
| | |
| | | }).then(res=>{ |
| | | this.$message.success(res.message); |
| | | }).catch(error=>{ |
| | | this.$message.error(error.message); |
| | | }) |
| | | }, |
| | | handleSelectionChange(val) { |
| | | this.selects = val; |
| | | }, |
| | | } |
| | | } |
| | |
| | | .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> |
| | |
| | | /* .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> |
| | | |