<template>
|
<el-dialog
|
v-model="dialogFormVisible"
|
:title="operationType === 'add' ? '新增巡检记录' : '编辑巡检记录'"
|
width="700px"
|
@close="closeDia"
|
>
|
<el-form :model="form" label-width="140px" label-position="top" :rules="rules" ref="formRef">
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="工序：" prop="processId">
|
<el-select v-model="form.processId" placeholder="请选择工序" clearable @change="handleProcessChange" style="width: 100%">
|
<el-option
|
v-for="item in processList"
|
:key="item.id"
|
:label="item.processName || item.name"
|
:value="item.id"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="巡检时间：" prop="inspectionTime">
|
<el-date-picker
|
v-model="form.inspectionTime"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
format="YYYY-MM-DD HH:mm:ss"
|
type="datetime"
|
placeholder="请选择巡检时间"
|
style="width: 100%"
|
/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="巡检员：" prop="inspector">
|
<el-input v-model="form.inspector" placeholder="请输入巡检员" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="检测项：" prop="inspectionItem">
|
<el-select v-model="form.inspectionItem" placeholder="请选择检测项" clearable @change="handleInspectionItemChange" style="width: 100%">
|
<el-option v-for="item in inspectionItemList" :key="item.parameterItem" :label="item.parameterItem" :value="item.parameterItem" />
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="标准要求：" prop="standardRequirement">
|
<el-input v-model="form.standardRequirement" placeholder="标准要求" readonly />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="实测值：" prop="actualValue">
|
<el-input v-model="form.actualValue" placeholder="请输入实测值" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="判定：" prop="judgement">
|
<el-select v-model="form.judgement" placeholder="请选择" clearable style="width: 100%">
|
<el-option label="合格" value="yes" />
|
<el-option label="不合格" value="no" />
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="不合格订单：" prop="unqualifiedOrder">
|
<el-input v-model="form.unqualifiedOrder" placeholder="请输入不合格订单" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="24">
|
<el-form-item label="备注：" prop="remark">
|
<el-input v-model="form.remark" type="textarea" :rows="3" placeholder="请输入备注" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button type="primary" @click="submitForm">确认</el-button>
|
<el-button @click="closeDia">取消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script setup>
|
import { ref, reactive } from "vue";
|
import { ElMessage } from "element-plus";
|
import { addProductInspectionRecord, updProductInspectionRecord, getParameterItemByProcessOrCategory } from "@/api/qualityManagement/productInspectionRecord.js";
|
import { processList as getProcessList } from "@/api/productionManagement/productionProcess.js";
|
import useUserStore from "@/store/modules/user";
|
|
const userStore = useUserStore();
|
const dialogFormVisible = ref(false);
|
const operationType = ref("add");
|
const formRef = ref(null);
|
|
const form = reactive({
|
id: undefined,
|
processId: undefined,
|
process: "",
|
checkDate: undefined,
|
inspector: "",
|
inspectionTime: undefined,
|
inspectionItem: "",
|
standardRequirement: "",
|
actualValue: "",
|
judgement: "",
|
unqualifiedOrder: "",
|
remark: "",
|
createUser: "",
|
createTime: undefined,
|
});
|
|
const processList = ref([]);
|
const inspectionItemList = ref([]);
|
|
/** 工序 id 与后端可能为 number/string，统一比较 */
|
const sameProcessId = (a, b) => a != null && b != null && String(a) === String(b);
|
|
/** 从工序列表取与 row 匹配的 id（保证与 el-option 的 value 类型一致，避免回显成纯数字） */
|
const resolveProcessIdFromRow = (row) => {
|
let pid = row.processId ?? row.process_id;
|
if (pid != null && pid !== "") {
|
const hit = processList.value.find((item) => sameProcessId(item.id, pid));
|
return hit ? hit.id : pid;
|
}
|
// 部分接口把工序 id 存在 process 字段里
|
const p = row.process;
|
if (p != null && p !== "" && /^\d+$/.test(String(p).trim())) {
|
const hit = processList.value.find((item) => sameProcessId(item.id, p));
|
return hit ? hit.id : p;
|
}
|
return undefined;
|
};
|
|
const getProcessLabel = (item) => item?.processName || item?.name || "";
|
|
const rules = {
|
processId: [{ required: true, message: "请选择工序", trigger: "change" }],
|
checkDate: [{ required: true, message: "请选择巡检日期", trigger: "change" }],
|
};
|
|
const loadProcessList = async () => {
|
try {
|
const res = await getProcessList({ current: 1, size: 1000 });
|
processList.value = res.data || [];
|
} catch (error) {
|
console.error("加载工序列表失败", error);
|
}
|
};
|
|
/**
|
* @param processId 工序 id
|
* @param options.preserveInspection 为 true 时保留已有检测项/标准（编辑回显）
|
*/
|
const handleProcessChange = async (processId, options = {}) => {
|
const { preserveInspection = false } = options;
|
|
if (!preserveInspection) {
|
form.process = "";
|
form.inspectionItem = "";
|
form.standardRequirement = "";
|
}
|
inspectionItemList.value = [];
|
|
if (!processId) {
|
return;
|
}
|
const process = processList.value.find((item) => sameProcessId(item.id, processId));
|
if (process) {
|
form.process = getProcessLabel(process);
|
}
|
|
try {
|
const { data } = await getParameterItemByProcessOrCategory({
|
id: processId,
|
inspectType: 3,
|
});
|
if (data && data.length > 0) {
|
inspectionItemList.value = data;
|
if (preserveInspection && form.inspectionItem) {
|
const cur = data.find((i) => i.parameterItem === form.inspectionItem);
|
form.standardRequirement = cur?.standardValue ?? form.standardRequirement ?? "";
|
} else {
|
const firstItem = data[0];
|
form.inspectionItem = firstItem.parameterItem;
|
form.standardRequirement = firstItem.standardValue || "";
|
}
|
}
|
} catch (error) {
|
console.error("加载检测项目失败", error);
|
}
|
};
|
|
const handleInspectionItemChange = (val) => {
|
if (!val) {
|
form.standardRequirement = "";
|
return;
|
}
|
const item = inspectionItemList.value.find(i => i.parameterItem === val);
|
if (item) {
|
form.standardRequirement = item.standardValue || "";
|
}
|
};
|
|
const open = async (type, row) => {
|
operationType.value = type;
|
await loadProcessList();
|
if (type === "edit" && row) {
|
Object.assign(form, row);
|
const resolvedId = resolveProcessIdFromRow(row);
|
if (resolvedId != null && resolvedId !== "") {
|
form.processId = resolvedId;
|
const processItem = processList.value.find((item) => sameProcessId(item.id, resolvedId));
|
if (processItem) {
|
form.process = getProcessLabel(processItem);
|
} else if (row.process && !/^\d+$/.test(String(row.process).trim())) {
|
form.process = row.process;
|
}
|
}
|
if (form.processId != null && form.processId !== "") {
|
await handleProcessChange(form.processId, { preserveInspection: true });
|
}
|
} else {
|
resetForm();
|
}
|
dialogFormVisible.value = true;
|
};
|
|
const formatDateTime = () => {
|
const now = new Date();
|
const year = now.getFullYear();
|
const month = String(now.getMonth() + 1).padStart(2, '0');
|
const day = String(now.getDate()).padStart(2, '0');
|
const hours = String(now.getHours()).padStart(2, '0');
|
const minutes = String(now.getMinutes()).padStart(2, '0');
|
const seconds = String(now.getSeconds()).padStart(2, '0');
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
};
|
|
const resetForm = () => {
|
form.id = undefined;
|
form.processId = undefined;
|
form.process = "";
|
form.checkDate = undefined;
|
form.inspector = "";
|
form.inspectionTime = formatDateTime();
|
form.inspectionItem = "";
|
form.standardRequirement = "";
|
form.actualValue = "";
|
form.judgement = "";
|
form.unqualifiedOrder = "";
|
form.remark = "";
|
form.createUser = "";
|
form.createTime = undefined;
|
inspectionItemList.value = [];
|
};
|
|
const closeDia = () => {
|
dialogFormVisible.value = false;
|
resetForm();
|
};
|
|
const submitForm = async () => {
|
const valid = await formRef.value.validate().catch(() => false);
|
if (!valid) return;
|
const p = processList.value.find((item) => sameProcessId(item.id, form.processId));
|
form.process = getProcessLabel(p);
|
|
try {
|
if (operationType.value === "add") {
|
await addProductInspectionRecord(form);
|
ElMessage.success("新增成功");
|
} else {
|
await updProductInspectionRecord(form);
|
ElMessage.success("修改成功");
|
}
|
closeDia();
|
emit("close");
|
} catch (error) {
|
console.error(error);
|
}
|
};
|
|
const emit = defineEmits(["close"]);
|
|
defineExpose({
|
open,
|
});
|
</script>
|
|
<style scoped>
|
</style>
|
