328 lines
11 KiB
Vue
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>
|