spc/src/views/spc-basic/components/productList-four-content.vue
2023-06-21 16:41:40 +08:00

328 lines
11 KiB
Vue

<!--
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2023-04-10 15:44:28
* @Description:
-->
<template>
<div class="baseTable">
<div v-if="workingProcedure.length && productFeaturesOptions.length">
<el-tabs @tab-click="tabClick">
<el-tab-pane
v-loading="loading"
element-loading-text="保存中"
element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)"
label="控制矩阵"
>
<el-button style="float:right" size="small" type="primary" @click="deleteFeatures()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
保存
</el-button>
<el-table
:data="productFeaturesList"
v-loading="dataListLoading"
border
style="width: 50%;"
>
<el-table-column prop="name" align="center"> </el-table-column>
<el-table-column
v-for="(item, index) in workingProcedure"
:key="item.id"
:label="item.workingProcedureName"
>
<template slot-scope="scope">
<el-checkbox
@change="
(checked) => CheckboxChange(checked, scope.row.id, item.workingProcedureId)
"
:checked="scope.row['checked' + index]"
>
</el-checkbox>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="特性列表" align="center">
<el-table
:data="dataList"
:header-cell-style="{
background: '#F2F4F9',
color: '#606266',
}"
style="width: 100%;"
>
<el-table-column
type="index"
header-align="center"
align="center"
label="序号"
width="50"
>
</el-table-column>
<el-table-column prop="code" align="center" label="编号"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"></el-table-column>
<el-table-column prop="type" align="center" label="特性类型">
<template slot-scope="scope">
<span>{{ scope.row.type === 2 ? "计数" : "计量" }}</span>
</template>
</el-table-column>
<el-table-column prop="defectLevel" align="center" label="缺陷等级">
<template slot-scope="scope">
<span>{{
scope.row.defectLevel === 1
? "致命缺陷"
: scope.row.defectLevel === 2
? "严重缺陷"
: "轻微缺陷"
}}</span>
</template>
</el-table-column>
<el-table-column prop="measureToolName" align="center" label="量具"></el-table-column>
<el-table-column prop="isSpc" align="center" label="SPC">
<template slot-scope="scope">
<span>{{ scope.row.isSpc === 1 ? "是" : "否" }}</span>
</template>
</el-table-column>
<el-table-column
prop="controlGraphName"
align="center"
label="分析图形"
></el-table-column>
<el-table-column prop="sampleSize" align="center" label="样本大小"></el-table-column>
<el-table-column
prop="samplingFrequency"
align="center"
label="抽样频率"
></el-table-column>
<el-table-column prop="unitName" align="center" label="单位"></el-table-column>
<el-table-column prop="decimalPlaces" align="center" label="小数位数"></el-table-column>
<el-table-column prop="specifications" align="center" label="规格"></el-table-column>
<el-table-column prop="lsl" align="center" label="LSL"></el-table-column>
<el-table-column prop="sl" align="center" label="SL"></el-table-column>
<el-table-column prop="usl" align="center" label="USL"></el-table-column>
<el-table-column prop="targetCpk" align="center" label="目标CPK"></el-table-column>
<el-table-column prop="targetPpk" align="center" label="目标PPK"></el-table-column>
<el-table-column prop="remark" align="center" label="备注"></el-table-column>
<el-table-column
fixed="right"
header-align="center"
align="center"
width="150"
:label="$t('handle')"
>
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">
<el-tooltip class="item" effect="dark" content="修改" placement="top">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-编辑"></use>
</svg>
</el-tooltip>
</el-button>
<el-button type="text" size="small" @click="productFeaturesHis(scope.row.id)">
<el-tooltip class="item" effect="dark" content="历史记录" placement="top">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#历史记录"></use>
</svg>
</el-tooltip>
</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</div>
<el-empty
v-else
description="该产品没有配置产品特性或工序,暂时不能分配过程控制特性"
></el-empty>
<four-add-or-update
v-if="fourAddOrUpdateVisible"
ref="fourAddOrUpdate"
@refreshFourDataList="getFourDataList"
></four-add-or-update>
<four-history v-if="productFeaturesHisVisible" ref="productFeaturesHisRef"></four-history>
</div>
</template>
<script>
import fourAddOrUpdate from "./productList-four-add";
import fourHistory from "./productList-four-history";
export default {
props: {
productFeaturesOptions: {
type: Array,
default: () => {
return [];
},
},
workingProcedure: {
type: Array,
default: () => {
return [];
},
},
productId: {
type: String,
},
},
data() {
return {
fourAddOrUpdateVisible: false,
productFeaturesList: [],
dataList: [],
setBatchInsert: [],
inspectionStage: 0,
dataListLoading: false,
loading: false,
productFeaturesHisVisible: false,
};
},
components: {
fourAddOrUpdate,
fourHistory,
},
methods: {
init(index) {
this.dataListLoading = false;
this.loading = false;
this.inspectionStage = parseInt(index);
this.productFeaturesList.splice(0, this.productFeaturesList.length);
this.$nextTick(() => {
this.getSelection();
if (this.productId) {
}
});
},
getSelection() {
this.setBatchInsert.splice(0, this.setBatchInsert.length);
this.dataListLoading = true;
this.$http
.post(
`/basic/productFeatures/getFeaturesByStageProcedure?inspectionStage=${this.inspectionStage}&productId=${this.productId}`
)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.productFeaturesList = this.productFeaturesOptions.map((item) => {
const obj = Object.assign({}, item);
this.workingProcedure.forEach((item1, index) => {
res.data.forEach((item2) => {
if (item2.productFeaturesId === item.id) {
if (item2.workingProcedureId === item1.workingProcedureId) {
Object.assign(obj, { ["checked" + index]: true });
this.CheckboxChange(true, item2.productFeaturesId, item2.workingProcedureId);
}
}
});
});
return obj;
});
this.dataListLoading = false;
})
.catch((e) => {
console.log(e);
this.dataListLoading = false;
});
},
tabClick(val) {
if (val.label === "特性列表") {
this.getFourDataList();
}
},
// 新增 / 修改
addOrUpdateHandle(id) {
this.fourAddOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.fourAddOrUpdate.init(id, this.productId);
});
},
deleteFeatures() {
this.loading = true;
this.workingProcedure.forEach((item, index) => {
this.$http
.delete(
`/basic/featuresStageProcedureRelation/deleteByStageProcedure?inspectionStage=${this.inspectionStage}&productId=${this.productId}&workingProcedureId=${item.workingProcedureId}`
)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
if (index === this.workingProcedure.length - 1) {
this.addFeatures();
}
})
.catch(() => {});
});
},
addFeatures() {
this.$http
.post("/basic/featuresStageProcedureRelation/batchInsert", [...this.setBatchInsert])
.then(({ data: res }) => {
this.loading = false;
if (res.code !== 0) {
return this.$message.error(res.msg);
}
})
.catch(() => {});
},
CheckboxChange(checked, productFeaturesId, workingProcedureId) {
this.setBatchInsert = [...this.setBatchInsert];
if (checked) {
const obj = {
inspectionStage: parseInt(this.inspectionStage),
productFeaturesId: productFeaturesId,
workingProcedureId: workingProcedureId,
};
this.setBatchInsert.push(obj);
} else {
const id1 = this.setBatchInsert.findIndex((item) => {
if (
item.productFeaturesId === productFeaturesId &&
item.workingProcedureId === workingProcedureId
) {
return true;
}
});
this.setBatchInsert.splice(id1, 1);
}
},
getFourDataList() {
this.$http
.post(
`/basic/productFeatures/getFeaturesList?inspectionStage=${this.inspectionStage}&productId=${this.productId}`
)
.then(({ data: res }) => {
if (res.code !== 0) {
this.dataList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.tabClick();
})
.catch(() => {});
},
productFeaturesHis(id) {
this.productFeaturesHisVisible = true;
this.$nextTick(() => {
this.$refs.productFeaturesHisRef.init(id);
});
},
// 表单提交
dataFormSubmit() {},
},
};
</script>
<style>
.baseTable .el-table__body tr.current-row > td.el-table__cell {
background-color: #eaf1fc;
}
.baseTable .el-table .el-table__cell {
padding: 0;
height: 35px;
}
</style>