<template>
|
<div class="rawInsBox">
|
<div class="title">
|
<el-row>
|
<el-col :span="12" style="line-height: 32px;">原材料检验</el-col>
|
<el-col :span="12" style="text-align: right;">
|
<el-button
|
icon="el-icon-circle-plus-outline"
|
v-show="detailId === null"
|
@click="addNewRawInspect"
|
style="background-color: #004ea2; color: #ffffff;"
|
>提 交</el-button
|
>
|
<el-button
|
icon="el-icon-download"
|
@click="
|
() => {
|
goBack();
|
}
|
"
|
>返 回</el-button
|
>
|
</el-col>
|
</el-row>
|
</div>
|
<div
|
class="raw-detail-info"
|
:class="detailId === null ? 'raw-detail-info-edit' : ''"
|
>
|
<el-form v-model="detailInfo" label-position="right" label-width="120px">
|
<el-row>
|
<el-col :span="7">
|
<el-form-item label="来料日期:">
|
<el-input
|
v-if="detailId !== null"
|
:disabled="detailId !== null"
|
v-model="detailInfo.formTime"
|
></el-input>
|
<el-date-picker
|
v-else
|
type="date"
|
value-format="yyyy-MM-dd"
|
v-model="detailInfo.formTime"
|
placeholder="选择日期"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="7">
|
<el-form-item label="原材料名称:">
|
<el-input
|
v-if="detailId !== null"
|
:disabled="detailId !== null"
|
v-model="detailInfo.name"
|
></el-input>
|
<el-input
|
v-else
|
v-model="detailInfo.name"
|
placeholder="请输入"
|
></el-input> </el-form-item
|
></el-col>
|
<el-col :span="7">
|
<el-form-item label="原材料编码:">
|
<el-input
|
:disabled="detailId !== null"
|
v-model="detailInfo.code"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="7">
|
<el-form-item label="规格型号:">
|
<el-input
|
v-if="detailId !== null"
|
:disabled="detailId !== null"
|
v-model="detailInfo.specifications"
|
></el-input>
|
<el-input
|
v-else
|
v-model="detailInfo.specificationsArr"
|
placeholder="请输入规格型号"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="7">
|
<el-form-item label="单位:">
|
<el-input
|
placeholder="请输入检验单位"
|
:disabled="detailId !== null"
|
v-model="detailInfo.unit"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="7">
|
<el-form-item label="数量:">
|
<el-input
|
placeholder="请输入检验数量"
|
:disabled="detailId !== null"
|
v-model="detailInfo.number"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="7">
|
<el-form-item label="供应商名称:">
|
<el-input
|
placeholder="请输入检验数量"
|
:disabled="detailId !== null"
|
v-model="detailInfo.number"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="7">
|
<el-form-item v-show="detailId !== null" label="报检日期:">
|
<el-input
|
:disabled="detailId !== null"
|
v-model="detailInfo.createTime"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="7">
|
<el-form-item v-show="detailId !== null" label="报检人:">
|
<el-input
|
:disabled="detailId !== null"
|
v-model="detailInfo.userName"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</div>
|
<div class="title">
|
<el-row>
|
<el-col :span="12" style="line-height: 32px;">检验项目</el-col>
|
<el-col :span="12" style="line-height: 32px; padding-top: 6px;">
|
<el-button v-if="detailId == null" style="float: right;"
|
>添加检验值列</el-button
|
>
|
<el-button
|
v-if="detailId == null"
|
style="float: right;margin-right: 30px;"
|
@click="clickAddLine()"
|
>添加检验行</el-button
|
>
|
</el-col>
|
</el-row>
|
</div>
|
<div class="raw-project-table">
|
<el-table :data="projectTable" style="width: 100%" height="320">
|
<el-table-column type="index" label="序号" width="100">
|
</el-table-column>
|
<el-table-column prop="name" label="项目" width="212">
|
<template scope="scope">
|
<el-input
|
v-model="scope.row.name"
|
placeholder="请输入项目名称"
|
></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column prop="unit" label="单位" width="148">
|
<template scope="scope">
|
<el-input
|
v-model="scope.row.unit"
|
placeholder="请输入单位"
|
></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column prop="required" label="标准" width="254">
|
<template scope="scope">
|
<el-input
|
v-model="scope.row.required"
|
placeholder="请输入标准值"
|
></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column prop="internal" label="内控值" width="254">
|
<template scope="scope">
|
<el-input
|
v-model="scope.row.internal"
|
placeholder="请输入内控值"
|
></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column prop="testValue" label="检查值" width="254">
|
<template slot-scope="scope">
|
<el-input
|
v-model="scope.row.testValue"
|
@blur="changeState(scope.row)"
|
placeholder="请输入检测值"
|
></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column prop="deviceName" label="试验设备">
|
<el-button type="text">选择</el-button>
|
</el-table-column>
|
<el-table-column prop="testState" label="结论">
|
<template slot-scope="scope">
|
<span
|
v-show="scope.row.testState != null"
|
:style="{
|
color: scope.row.testState === 1 ? '#67C23A' : '#F56C6C'
|
}"
|
>{{ scope.row.testState === 1 ? "合格" : "不合格" }}</span
|
>
|
<span v-show="scope.row.testState == null">暂未结论</span>
|
</template>
|
</el-table-column>
|
<el-table-column v-if="detailId == null" label="操作" fixed="right">
|
<template scope="scope">
|
<el-button type="text" @click="clickDeleteline(scope)"
|
>删除</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="title">
|
<el-row>
|
<el-col :span="12" style="line-height: 32px;">检验结论</el-col>
|
</el-row>
|
</div>
|
<div class="raw-conclusion-table">
|
<el-table :data="conclusionTable" style="100%">
|
<el-table-column prop="code" label="物料编号"> </el-table-column>
|
<el-table-column prop="name" label="物料名称"> </el-table-column>
|
<el-table-column prop="names" label="检验员">
|
<template slot-scope="scope">
|
<span
|
v-for="item in scope.row.names"
|
:key="item && item.userName"
|
:style="{ marginRight: '8px' }"
|
>{{ item }}</span
|
>
|
</template>
|
</el-table-column>
|
<el-table-column prop="testState" label="检验结论">
|
<template slot-scope="scope">
|
<span
|
v-show="scope.row.testState != null"
|
:style="{
|
color: scope.row.testState === 1 ? '#67C23A' : '#F56C6C'
|
}"
|
>{{ scope.row.testState === 1 ? "合格" : "不合格" }}</span
|
>
|
<span v-show="scope.row.testState == null">暂未结论</span>
|
</template>
|
</el-table-column>
|
<el-table-column v-if="detailId !== null" label="操作" width="120">
|
<template>
|
<el-button type="text" size="small" @click.once="submitSave"
|
>上报</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import RawIns from "./raw-ins.vue";
|
export default {
|
components: { RawIns },
|
props: ["goBack", "detailId"],
|
created() {
|
// 清空
|
this.detailInfo = {};
|
if (this.detailId) {
|
this.getDetailInfo();
|
} else {
|
this.getOptions();
|
}
|
},
|
mounted() {},
|
computed: {
|
conclusionTable() {
|
const conclusion = {};
|
conclusion.name = this.detailInfo.name;
|
conclusion.code = this.detailInfo.code;
|
conclusion.names = [
|
...new Set(this.projectTable.map(item => item.userName))
|
];
|
if (
|
this.projectTable.filter(item => item.testState === null).length ===
|
this.projectTable.length
|
) {
|
conclusion.testState = null;
|
return [conclusion];
|
}
|
if (this.projectTable.filter(item => item.testState === 0).length > 0) {
|
conclusion.testState = 0;
|
} else {
|
conclusion.testState = 1;
|
}
|
return [conclusion];
|
}
|
},
|
data() {
|
return {
|
// 详情页就是详情信息
|
detailInfo: {},
|
projectTable: [],
|
// 新建检验单参数对象
|
rawInsParams: {},
|
// 项目名称options
|
materialOptions: [],
|
specificationOptions: []
|
};
|
},
|
methods: {
|
// 获取报检单详情信息
|
async getDetailInfo() {
|
const { data } = await this.$axios.get(
|
this.$api.url.selectRawInspectsListById + `${this.detailId}`,
|
{ params: { id: this.detailId } }
|
);
|
this.detailInfo = data;
|
this.projectTable = data.rawInsProducts;
|
},
|
// 新增检验单
|
async addNewRawInspect() {
|
this.detailInfo.specifications = this.detailInfo.specificationsArr.join(
|
"-"
|
);
|
// const time = this.detailInfo.formTime
|
// this.detailInfo.formTime = `${time.getFullYear()}-${time.getMonth() + 1 < 10 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1}-${time.getDate() < 10 ? '0' + time.getDate() : time.getDate()}`
|
const res = await this.$axios.post(
|
this.$api.url.addRawInspects,
|
{ ...this.detailInfo },
|
{ headers: { "Content-Type": "application/json" } }
|
);
|
this.detailId = res.data;
|
this.getDetailInfo();
|
|
this.$message.success("提交成功");
|
},
|
// 修改项目的检测值改变结论
|
async changeState(row) {
|
const res = await this.$axios.post(
|
this.$api.url.updaterawInsProduct,
|
{ ...row },
|
{ headers: { "Content-Type": "application/json" } }
|
);
|
this.$message.success("提交成功");
|
this.getDetailInfo(); //重新刷新信息数据
|
},
|
async submitSave() {
|
const res = await this.$axios.post(
|
this.$api.url.updateRawInspectsById + `${this.detailId}`
|
);
|
this.$message.success("提交成功");
|
this.getDetailInfo();
|
},
|
async getOptions() {
|
const { data } = await this.$axios.get(this.$api.url.selectDevice);
|
this.materialOptions = data;
|
},
|
checkRawName(data) {
|
this.materialOptions.forEach(item => {
|
if (item.name === data) {
|
this.detailInfo.code = item.code;
|
this.$axios
|
.get(this.$api.url.selectSpBySt, { params: { id: item.id } })
|
.then(res => {
|
this.specificationOptions = res.data;
|
});
|
}
|
});
|
},
|
// 添加行
|
clickAddLine() {
|
let obj = {
|
deviceId: 0,
|
internal: "",
|
name: "",
|
required: "",
|
testValue: "",
|
unit: ""
|
};
|
this.projectTable.push(obj);
|
},
|
// 删除行
|
clickDeleteline(scope) {
|
this.projectTable.splice(scope.$index, 1);
|
}
|
}
|
};
|
</script>
|
|
<style scoped>
|
.rawInsBox {
|
height: 100%;
|
width: 100%;
|
overflow-y: scroll;
|
display: flex;
|
flex-direction: column;
|
}
|
.rawInsBox .title .el-button {
|
height: 32px;
|
border: 1px solid rgba(190, 190, 190, 0.44);
|
box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
|
padding: 0 12px;
|
}
|
.rawInsBox .title {
|
margin-bottom: 10px;
|
padding: 0 20px;
|
}
|
/* 检验详情 */
|
.raw-detail-info {
|
background: #fff;
|
padding: 26px 0px 11px 80px;
|
}
|
.raw-detail-info >>> .el-form-item__label {
|
color: rgb(51, 51, 51);
|
font-family: 微软雅黑;
|
font-size: 16px;
|
font-weight: 400;
|
letter-spacing: 0px;
|
}
|
.raw-detail-info .el-input {
|
width: auto;
|
}
|
.raw-detail-info.raw-detail-info-edit >>> .el-input__inner {
|
background: #fff;
|
}
|
.raw-detail-info >>> .el-input__inner {
|
width: 224px;
|
height: 32px;
|
box-sizing: border-box;
|
background: rgb(238, 238, 238);
|
border: 1px solid rgb(221, 221, 221);
|
border-radius: 4px;
|
}
|
.raw-detail-info .el-form-item {
|
margin-bottom: 24px;
|
}
|
.raw-detail-info .el-form-item .el-button {
|
height: 32px;
|
border: 1px solid rgba(190, 190, 190, 0.44);
|
box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
|
padding: 0 12px;
|
}
|
|
/* 检验项目 */
|
.raw-project-table {
|
padding: 24px 14px;
|
background: #fff;
|
flex: 1;
|
/* max-height: 360px; */
|
/* overflow-y: hidden; */
|
}
|
/* 检验结论 */
|
.raw-conclusion-table {
|
padding: 9px 14px;
|
background: #fff;
|
}
|
</style>
|
