Yangwl
/
lanju-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2025-01-07 MES-自检互检记录表

Browse Source
master
元气满满(jgy) 6 months ago
parent 18114bbc46
commit cbe4394c3c
2 changed files with 475 additions and 84 deletions
Show Stats Download Patch File Download Diff File

29
src/api/mes/selfMutualInspection.js
Unescape Escape View File

@ -28,6 +28,35 @@ export function getLineCodeList(query) {
});
}
// 查询组线列表
export function getProductList(query) {
return request({
url: '/mes/inspectionReport/getProductList',
method: 'get',
params: query
});
}
// 修改表头表尾部记录
export function updateTable(data) {
return request({
url: '/mes/inspectionReport/updateTable',
method: 'put',
data: data
});
}
// 查询组线列表
export function getWorkList(query) {
return request({
url: '/mes/inspectionReport/getWorkList',
method: 'get',
params: query
});
}
// 查询首检左侧
export function listFirstInspectionLeft(query) {
return request({

530
src/views/mes/selfMutualInspection/index.vue
Unescape Escape View File

@ -16,21 +16,13 @@
<span>自检互检记录表</span>
</el-col>
</el-row>
<br>
<br />
<el-row>
<el-col :span="10">
<el-col :span="8">
<div>生产车间:黑蚊香车间</div>
<br />
</el-col>
<el-col :span="9">
<div>产品名称: {{ headerParameters.productName }}</div>
<br />
</el-col>
<el-col :span="5">
<div>检查人: {{ headerParameters.checkPeople }}</div>
<br />
</el-col>
<el-col :span="10">
<el-col :span="8">
<div>
生产产线:
<el-select
@ -38,6 +30,7 @@
filterable
placeholder="请选择产线"
style="width: 160px"
@change="handleSelectLineChange"
>
<el-option
v-for="item in lineCodeOption"
@ -50,11 +43,12 @@
</div>
<br />
</el-col>
<el-col :span="9">
<el-col :span="8">
<div>
检查日期:
<el-date-picker
clearable
style="width: 160px"
v-model="headerParameters.checkDate"
type="date"
value-format="yyyy-MM-dd"
@ -62,8 +56,59 @@
>
</el-date-picker>
</div>
<br />
</el-col>
<el-col :span="5">
<el-col :span="8">
<div>
产品名称:
<el-select
v-model="headerParameters.id"
filterable
placeholder="请选择产品"
style="width: 250px"
@change="handleSelectProductChange"
>
<el-option
v-for="item in productCodeOption"
:key="item.id"
:label="'【' + item.productName + '】表id：' + item.id"
:value="item.id"
>
</el-option>
</el-select>
</div>
<br />
</el-col>
<!-- <el-col :span="7">
<div>工单号:
<el-select
v-model="headerParameters.workorderId"
filterable
placeholder="请选择工单"
style="width: 250px"
@change="handleSelectWorkChange"
>
<el-option
v-for="item in workCodeOption"
:key="item.workorderId"
:label="item.workorderName"
:value="item.workorderId"
>
</el-option>
</el-select>
</div>
<br />
</el-col> -->
<el-col :span="8">
<div>
检 查 人 :
<el-input
v-model="headerParameters.createBy"
style="width: 160px"
/>
</div>
</el-col>
<el-col :span="8">
<el-button
type="primary"
icon="el-icon-search"
@ -82,6 +127,22 @@
@click="handlePrintPre"
>打印
</el-button>
<el-button
type="primary"
plain
icon="el-icon-check"
size="mini"
@click="handleSubmit"
>提交
</el-button>
<el-button
type="primary"
plain
icon="el-icon-check"
size="mini"
@click="AddNewColumn"
>新增一列
</el-button>
</el-col>
</el-row>
</el-form>
@ -89,40 +150,112 @@
<div>
<table class="bordered-table">
<tr>
<th v-for="item in tableTittle0" style="width:300px" :key="item.key">
<th
v-for="item in tableTittle0"
style="width: 300px"
:key="item.key"
>
{{ item.label }}
</th>
<!-- 动态渲染列名 -->
<th v-for="item in tableTittle" :key="item.key" :width = tableTittleWidth >
<th
v-for="item in tableTittle"
:key="item.key"
:width="tableTittleWidth"
>
{{ item.label }}
</th>
</tr>
<tr>
<!-- 动态渲染列名 -->
<th v-for="(index, key) in tableData[0]" :key="key">{{ key }}</th>
<th v-for="(item, key, index) in tableData[0]" :key="key">
<template v-if="key === '开始-结束'">{{ key }}</template>
<template v-else>
<el-time-select
v-model="item.checkTimeS"
style="width: 100px"
:picker-options="{
start: '00:00',
step: '00:30',
end: '23:30',
}"
format="HH:mm"
@change="handleStartTimeChange(key, $event)"
>
</el-time-select
>-
<el-time-select
v-model="item.checkTimeE"
style="width: 100px"
:picker-options="{
start: '00:00',
step: '00:30',
end: '23:30',
}"
format="HH:mm"
@change="handleEndTimeChange(key, $event)"
>
</el-time-select>
</template>
</th>
</tr>
<tr v-for="item in tableData" :key="item.id">
<!-- 动态渲染列值 -->
<td columnspan="1" v-for="(value, key) in item" :key="key">
{{ value }}
<template v-if="key === '开始-结束'">{{ value.data }}</template>
<template
v-if="key != '开始-结束' && value.type === 'rightWrong'"
>
<el-select v-model="value.data">
<el-option label="√" value="√"></el-option>
<el-option label="×" value="×"></el-option>
</el-select>
</template>
<template v-if="key != '开始-结束' && value.type === 'dataCode'">
<el-select
v-model="value.data"
filterable
placeholder="请选择日期码"
>
<el-option
v-for="item in dataCodeOption"
:key="item.batchCode"
:label="item.batchCode"
:value="item.batchCode"
/>
</el-select>
</template>
<template
v-if="key != '开始-结束' && value.type === 'sprayAmount'"
>
<el-input v-model="value.data" placeholder="请输入"> </el-input>
</template>
</td>
</tr>
<tr>
<td colspan = "1">异常处理</td>
<td :colspan = propertyNum>{{ headerParameters.bz }}</td>
<td colspan="1">异常处理</td>
<td :colspan="propertyNum">
<el-input
type="text"
style="width: 1000px"
v-model="headerParameters.bz"
placeholder="请输入异常处理内容"
/>
</td>
</tr>
<!-- <tr>
<td colspan = "1">备注</td>
<td :colspan = propertyNum>{{ headerParameters.remark }}</td>
</tr> -->
</table>
</div>
<br />
<div>
备注:{{ headerParameters.remark }}
备注:
<el-input
type="text"
style="width: 1250px"
v-model="headerParameters.remark"
placeholder="请输入备注"
/>
</div>
</div>
@ -159,9 +292,7 @@
<br />
</el-col>
<el-col :span="4">
<div class="text-print">
检查人: {{ headerParameters.checkPeople }}
</div>
<div class="text-print">检查人: {{ headerParameters.createBy }}</div>
<br />
</el-col>
<el-col :span="20">
@ -177,18 +308,26 @@
<br />
</el-col>
</el-row>
<row>
<el-row>
<el-col :span="24">
<table class="bordered-table-print" border="1">
<tr>
<th v-for="item in tableTittle0" style="width:300px" :key="item.key">
{{ item.label }}
</th>
<!-- 动态渲染列名 -->
<th v-for="item in tableTittle" :key="item.key" :width = tableTittleWidth >
{{ item.label }}
</th>
</tr>
<th
v-for="item in tableTittle0"
style="width: 300px"
:key="item.key"
>
{{ item.label }}
</th>
<!-- 动态渲染列名 -->
<th
v-for="item in tableTittle"
:key="item.key"
:width="tableTittleWidth"
>
{{ item.label }}
</th>
</tr>
<tr>
<th v-for="(index, key) in tableData[0]" :key="key">
@ -197,12 +336,12 @@
</tr>
<tr v-for="item in tableData" :key="item.id">
<td v-for="(value, key) in item" :key="key">{{ value }}</td>
<td v-for="(value, key) in item" :key="key">{{ value.data }}</td>
</tr>
<tr>
<td colspan = "1">异常处理</td>
<td :colspan = propertyNum>{{ headerParameters.bz }}</td>
<td colspan="1">异常处理</td>
<td :colspan="propertyNum">{{ headerParameters.bz }}</td>
</tr>
<!-- <tr>
<td colspan = "1">备注</td>
@ -210,10 +349,8 @@
</tr> -->
</table>
</el-col>
</row>
<div class="bottom-remark">
备注:{{ headerParameters.remark }}
</div>
</el-row>
<div class="bottom-remark">备注:{{ headerParameters.remark }}</div>
</div>
<!-- <el-table :data="tableData">
@ -233,6 +370,9 @@ import {
listSelfMutualInspection,
getSelfMutualInspectionData,
getLineCodeList,
getProductList,
updateTable,
getWorkList,
} from "@/api/mes/selfMutualInspection";
export default {
@ -247,6 +387,10 @@ export default {
showPrintPage: false,
showTable: false,
lineCodeOption: [],
dataCodeOption: [],
productCodeOption: [],
workCodeOption: [],
processedTableData: [],
propertyNum: null,
tableTittle0: [],
tableTittle: [],
@ -272,15 +416,19 @@ export default {
queryParams: {},
//表头参数
headerParameters: {
id: null, //主表ID
workorderId: null, //工单的id
reportName: "ConversionReport", //表类型
productionWorkshop: null, //生产车间
lineCode: null, //生产产线编码
lineName: null, //生产产线名称
checkPeople: null, //检查人
createBy: null, //检查人
productName: null, //产品名称
dateCode: null, //日期码
checkDate: null, //检查日期
bz: null, //异常处理
remark: null, //备注
belongTo: null, //主表id
},
// 表单参数
form: {},
@ -289,22 +437,78 @@ export default {
};
},
created() {
// this.getDate();
this.getLineCode();
this.getList();
},
watch: {
// 监听lineCode和checkDate的变化
headerParameters: {
handler(newVal) {
if (newVal.lineCode && newVal.checkDate) {
this.getProductList(); //监听产品和检查日期
}
},
deep: true,
},
},
methods: {
dynamicWidthStyle(){
return { width: `${1000 / this.propertyNum }px`}
//在选择产线时候，存产线名称
handleSelectLineChange(value) {
const selectedOption = this.lineCodeOption.find(
(option) => option.equipmentCode === value
);
if (selectedOption) {
this.headerParameters.lineName = selectedOption.equipmentName;
}
},
//在选择设备时候，存设备名称
handleSelectProductChange(value) {
const selectedOption = this.productCodeOption.find(
(option) => option.id === value
);
if (selectedOption) {
this.headerParameters.productName = selectedOption.productName;
this.headerParameters.productCode = selectedOption.productCode;
this.headerParameters.workorderId = selectedOption.workorderId;
}
},
handleSelectWorkChange(value) {
const selectedOption = this.workCodeOption.find(
(option) => option.id === value
);
if (selectedOption) {
this.headerParameters.workorderId = selectedOption.workorderId;
}
},
dynamicWidthStyle() {
return { width: `${1000 / this.propertyNum}px` };
},
//预处理
handlePrintPre() {
this.showTable = false; //页面上的表格不显示
this.showPrintPage = true; //打印的表格显示
this.$nextTick(() => {
this.handlePrint();
});
this.$confirm("是否确定提交当前页面信息并进行打印操作？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
// 用户点击确定后执行的逻辑
this.showTable = false;
this.showPrintPage = true;
this.$nextTick(() => {
this.handleSubmit(); //提交
this.handlePrint(); //打印
});
})
.catch(() => {
// 用户点击取消后执行的逻辑，这里简单打印提示信息，可按需调整
console.log("用户取消了打印预处理操作");
});
},
//真正打印
@ -339,6 +543,8 @@ export default {
this.$modal.msg("您没有选择生产产线，请选择！");
} else if (this.headerParameters.checkDate == null) {
this.$modal.msg("您没有选择检查时间，请选择！");
} else if (this.headerParameters.id == null) {
this.$modal.msg("您没有选择检查产品，请选择！");
} else {
this.getList();
}
@ -350,55 +556,50 @@ export default {
});
},
/**获取默认查询时间段**/
// getDate() {
// let start = this.Fungetdate (0)
// this.headerParameters.checkDate = start;
// },
// Fungetdate (num) {
// var dd = new Date();
// dd.setDate(dd.getDate() + num);
// var y = dd.getFullYear();
// var m = dd.getMonth() + 1;//获取当前月份的日期
// var d = dd.getDate();
// return y + "-" + m +"-"+d;
// },
getProductList() {
getProductList(this.headerParameters).then((response) => {
this.productCodeOption = response;
});
},
getWorkList() {
getWorkList(this.headerParameters).then((response) => {
this.workCodeOption = response;
});
},
/** 重置按钮操作 */
resetQuery() {
(this.headerParameters.productionWorkshop = null), //生产车间
(this.headerParameters.lineCode = null), //生产产线
(this.headerParameters.lineName = null), //生产产线
(this.headerParameters.checkPeople = null), //检查人
(this.headerParameters.createBy = null), //检查人
(this.headerParameters.productName = null), //产品名称
(this.headerParameters.checkDate = null), //检查日期
(this.headerParameters.bz = null), //异常处理
(this.headerParameters.remark = null), //备注
// this.getDate();
this.getList();
},
/** 查询检查项维护列表 */
getList() {
this.showTable = true;//页面上的表格显示
this.showPrintPage = false;//打印的表格不显示
this.showTable = true; //页面上的表格显示
this.showPrintPage = false; //打印的表格不显示
this.tableData = [];
this.tableTittle = [];
this.tableTittle0 = [];
this.propertyNum = null;
this.loading = true;
getSelfMutualInspectionData(this.headerParameters).then((response) => {
this.headerParameters.checkPeople = response.createBy; //检查人
this.headerParameters.productName = response.productName; //产品名称
this.headerParameters.createBy = response.createBy; //检查人
this.headerParameters.remark = response.remark; //备注
this.headerParameters.bz = response.bz; //异常处理
this.headerParameters.lineName = response.lineName;
//this.headerParameters.checkDate = response.checkDate 检查日期
//生产产线
this.dataCodeOption = response.dateCodeList;
});
listSelfMutualInspection(this.headerParameters).then((response) => {
this.tableData = response;
console.log("this.tableData", this.tableData);
this.propertyNum = Object.keys(this.tableData[0]).length - 1; //属性个数
this.tableTittle0.push({
label: "项目",
@ -410,8 +611,165 @@ export default {
key: i + 1,
});
}
this.tableTittleWidth = 1000 / this.propertyNum + "px";
});
},
this.tableTittleWidth = (1000 / (this.propertyNum)) + 'px';
AddNewColumn() {
//表头增加
this.tableTittle.push({
label: "检查时间",
key: this.propertyNum + 1,
});
this.propertyNum = this.propertyNum + 1;
this.tableTittleWidth = 1000 / this.propertyNum + "px";
//前端直接构建
this.tableData.forEach((item) => {
Object.keys(item).forEach((key) => {
if (key == "开始-结束") {
// 提取所有时间区间的结束时间
let endTimes = [];
Object.keys(item).forEach((key) => {
if (key != "开始-结束") {
let [start, end] = key.split("-");
endTimes.push(end);
}
});
// 将时间字符串转换为分钟数
let timesInMinutes = endTimes.map((time) => {
let [hour, minute] = time.split(":").map(Number);
return hour * 60 + minute;
});
// 找到最大的分钟数
let maxEndTimeInMinutes = Math.max(...timesInMinutes);
let newEndTime = null;
let maxEndTime = null;
if (Number.isNaN(maxEndTimeInMinutes)) {
maxEndTime = "00:00";
newEndTime = "00:30";
console.log("maxEndTimeInMinutes", maxEndTimeInMinutes);
} else {
// 将最大分钟数转换回时间字符串
let maxHour = Math.floor(maxEndTimeInMinutes / 60);
let maxMinute = maxEndTimeInMinutes % 60;
maxEndTime =
maxHour.toString().padStart(2, "0") +
":" +
maxMinute.toString().padStart(2, "0");
// 在最大结束时间基础上加半小时
maxMinute += 30;
if (maxMinute >= 60) {
maxHour += 1;
maxMinute -= 60;
}
// 格式化结果
newEndTime =
maxHour.toString().padStart(2, "0") +
":" +
maxMinute.toString().padStart(2, "0");
}
var dynamicPropertyName = maxEndTime + "-" + newEndTime;
let newProperty = {};
newProperty.productCode = this.headerParameters.productCode;
newProperty.productName = this.headerParameters.productName;
newProperty.tableLine = this.propertyNum;
newProperty.infoName = item[key].projectName;
newProperty.timeArray = maxEndTime + "-" + newEndTime;
newProperty.checkTimeS = maxEndTime;
newProperty.checkTimeE = newEndTime;
if (
item[key].projectName == "日期码" ||
item[key].projectName == "生产批号"
) {
newProperty.checkResult = "";
newProperty.data = "";
newProperty.type = "dataCode";
} else if (item[key].projectName == "灌装量/净含量/喷药量") {
newProperty.checkResult = "";
newProperty.data = "";
newProperty.type = "sprayAmount";
} else {
newProperty.checkResult = "√";
newProperty.data = "√";
newProperty.type = "rightWrong";
}
this.$set(item, dynamicPropertyName, newProperty);
}
});
});
console.log("this.tableData", this.tableData);
},
handleSubmit() {
//需要加个逻辑 开始时间不能为空
if (this.tableData && this.tableData[0]) {
const firstObject = this.tableData[0];
for (let key in firstObject) {
if (
firstObject.hasOwnProperty(key) &&
firstObject[key].hasOwnProperty("checkTimeS")
) {
const checkTimeS = firstObject[key].checkTimeS;
if (
typeof checkTimeS === "undefined" ||
checkTimeS === null ||
checkTimeS === ""
) {
this.$modal.msg("您填入的检查时间存在开始时间为空的情况，请再次进行填写！");
return;
}
}
}
}
this.headerParameters.tableData = this.tableData;
updateTable(this.headerParameters).then((response) => {
this.$modal.msgSuccess("提交成功");
if (response.code == 200) {
this.headerParameters.tableData = null;
this.getList();
}
});
},
handleStartTimeChange(transKey, newTime) {
// 遍历表格数据，更新该列所有对象的checkTime属性
this.tableData.forEach((item) => {
Object.keys(item).forEach((key) => {
if (key == transKey) {
const originalTime = item[key].checkTimeS;
item[key].checkTimeS = newTime;
console.log(
key + "原来的结束时间：",
originalTime + "现在的结束时间：",
item[key].checkTimeS
);
}
});
});
},
handleEndTimeChange(transKey, newTime) {
// 遍历表格数据，更新该列所有对象的checkTime属性
this.tableData.forEach((item) => {
Object.keys(item).forEach((key) => {
if (key == transKey) {
const originalTime = item[key].checkTimeE;
item[key].checkTimeE = newTime;
console.log(
key + "原来的结束时间：",
originalTime + "现在的结束时间：",
item[key].checkTimeE
);
}
});
});
},
},
@ -438,7 +796,6 @@ export default {
}
.bordered-table th,
.bordered-table td {
border: 1px solid #ddd; /* 边框样式 */
padding: 8px; /* 单元格内边距 */
@ -446,9 +803,9 @@ export default {
}
.bordered-table tr {
word-break:break-all;
word-wrap:break-word;
border-collapse:collapse
word-break: break-all;
word-wrap: break-word;
border-collapse: collapse;
}
.bordered-table-bottom {
@ -508,8 +865,13 @@ export default {
}
.bordered-table-print tr {
word-break:break-all;
word-wrap:break-word;
border-collapse:collapse
word-break: break-all;
word-wrap: break-word;
border-collapse: collapse;
}
.time-range {
border: 1px solid black;
padding: 2px;
}
</style>
Write Preview
Loading…
Cancel
Save