From 476a9ca89794a830b8a8279b80d9b446624a0641 Mon Sep 17 00:00:00 2001
From: liding <756868258@qq.com>
Date: 星期二, 02 六月 2026 17:50:39 +0800
Subject: [PATCH] refactor(equipment): 优化设备台账表单结构并更新质管检验选项
---
src/views/qualityManagement/rawMaterial/components/formDia.vue | 443 ++++++++++++++++++++++++++++++++-----------------------
1 files changed, 258 insertions(+), 185 deletions(-)
diff --git a/src/views/qualityManagement/rawMaterial/components/formDia.vue b/src/views/qualityManagement/rawMaterial/components/formDia.vue
index fdbc95c..076e918 100644
--- a/src/views/qualityManagement/rawMaterial/components/formDia.vue
+++ b/src/views/qualityManagement/rawMaterial/components/formDia.vue
@@ -1,41 +1,58 @@
<template>
<div>
<el-dialog
- v-model="dialogFormVisible"
- :title="operationType === 'add' ? '鏂板鍘熸枡' : operationType === 'view' ? '鍘熸枡璇︽儏' : '缂栬緫鍘熸枡'"
- width="70%"
- @close="closeDia"
+ v-model="dialogFormVisible"
+ :title="
+ operationType === 'add'
+ ? '鏂板鍘熸枡'
+ : operationType === 'view'
+ ? '鍘熸枡璇︽儏'
+ : '缂栬緫鍘熸枡'
+ "
+ width="70%"
+ @close="closeDia"
>
<el-form
- v-if="operationType !== 'view'"
- :model="form"
- label-width="140px"
- label-position="top"
- :rules="rules"
- ref="formRef"
+ v-if="operationType !== 'view'"
+ :model="form"
+ label-width="140px"
+ label-position="top"
+ :rules="rules"
+ ref="formRef"
>
<el-row :gutter="30">
<el-col :span="12">
<el-form-item label="浜у搧鍚嶇О锛�" prop="productId">
<el-tree-select
- v-model="form.productId"
- placeholder="璇烽�夋嫨"
- clearable
- check-strictly
- @change="getModels"
- :data="productOptions"
- :render-after-expand="false"
- :disabled="operationType === 'edit' || operationType === 'view'"
- style="width: 100%"
+ v-model="form.productId"
+ placeholder="璇烽�夋嫨"
+ clearable
+ check-strictly
+ @change="getModels"
+ :data="productOptions"
+ :render-after-expand="false"
+ :disabled="operationType === 'edit' || operationType === 'view'"
+ style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="瑙勬牸鍨嬪彿锛�" prop="productModelId">
- <el-select v-model="form.productModelId" placeholder="璇烽�夋嫨" clearable
- :disabled="operationType === 'edit' || operationType === 'view'"
- filterable readonly @change="handleChangeModel">
- <el-option v-for="item in modelOptions" :key="item.id" :label="item.model" :value="item.id"/>
+ <el-select
+ v-model="form.productModelId"
+ placeholder="璇烽�夋嫨"
+ clearable
+ :disabled="operationType === 'edit' || operationType === 'view'"
+ filterable
+ readonly
+ @change="handleChangeModel"
+ >
+ <el-option
+ v-for="item in modelOptions"
+ :key="item.id"
+ :label="item.model"
+ :value="item.id"
+ />
</el-select>
</el-form-item>
</el-col>
@@ -43,17 +60,17 @@
<el-row :gutter="30">
<el-col :span="12">
<el-form-item label="鍗曚綅锛�" prop="unit">
- <el-input v-model="form.unit" disabled/>
+ <el-input v-model="form.unit" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="鎵瑰彿锛�" prop="batchNo">
<el-input
- style="width: 100%"
- v-model="form.batchNo"
- placeholder="璇疯緭鍏�"
- clearable
- :disabled="operationType === 'view'"
+ style="width: 100%"
+ v-model="form.batchNo"
+ placeholder="璇疯緭鍏�"
+ clearable
+ :disabled="operationType === 'view'"
/>
</el-form-item>
</el-col>
@@ -61,18 +78,24 @@
<el-row :gutter="30">
<el-col :span="12">
<el-form-item label="妫�楠岀被鍨嬶細" prop="checkType">
- <el-select v-model="form.checkType" :disabled="operationType === 'view'">
- <el-option label="鍏ュ巶妫�" :value="0"/>
- <el-option label="杞﹂棿妫�" :value="1"/>
- <el-option label="鍑哄巶妫�" :value="2"/>
+ <el-select
+ v-model="form.checkType"
+ :disabled="operationType === 'view'"
+ >
+ <el-option label="鍏ュ巶妫�" :value="0" />
+ <el-option label="杞﹂棿妫�" :value="1" />
+ <el-option label="鍑哄巶妫�" :value="2" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="妫�娴嬬粨鏋滐細" prop="checkResult">
- <el-select v-model="form.checkResult" :disabled="operationType === 'view'">
- <el-option label="鍚堟牸" :value="1"/>
- <el-option label="涓嶅悎鏍�" :value="0"/>
+ <el-select
+ v-model="form.checkResult"
+ :disabled="operationType === 'view'"
+ >
+ <el-option label="宸叉" :value="1" />
+ <el-option label="鏈" :value="0" />
</el-select>
</el-form-item>
</el-col>
@@ -81,103 +104,139 @@
<el-col :span="12">
<el-form-item label="妫�楠屽憳锛�" prop="checkUserName">
<el-select
- v-model="form.checkUserName"
- placeholder="璇烽�夋嫨"
- clearable
- filterable
- style="width: 100%"
- :disabled="operationType === 'view'"
+ v-model="form.checkUserName"
+ placeholder="璇烽�夋嫨"
+ clearable
+ filterable
+ style="width: 100%"
+ :disabled="operationType === 'view'"
>
- <el-option v-for="item in userList" :key="item.nickName" :label="item.nickName"
- :value="item.nickName"/>
+ <el-option
+ v-for="item in userList"
+ :key="item.nickName"
+ :label="item.nickName"
+ :value="item.nickName"
+ />
</el-select>
-
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="妫�娴嬫棩鏈燂細" prop="checkTime">
<el-date-picker
- v-model="form.checkTime"
- type="date"
- placeholder="璇烽�夋嫨鏃ユ湡"
- value-format="YYYY-MM-DD"
- format="YYYY-MM-DD"
- clearable
- style="width: 100%"
- :disabled="operationType === 'view'"
+ v-model="form.checkTime"
+ type="date"
+ placeholder="璇烽�夋嫨鏃ユ湡"
+ value-format="YYYY-MM-DD"
+ format="YYYY-MM-DD"
+ clearable
+ style="width: 100%"
+ :disabled="operationType === 'view'"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-descriptions
- v-else
- :column="2"
- border
- size="small"
- style="margin-bottom: 12px;"
+ v-else
+ :column="2"
+ border
+ size="small"
+ style="margin-bottom: 12px"
>
- <el-descriptions-item label="浜у搧鍚嶇О">{{ viewProductName }}</el-descriptions-item>
- <el-descriptions-item label="瑙勬牸鍨嬪彿">{{ viewProductModel }}</el-descriptions-item>
- <el-descriptions-item label="鍗曚綅">{{ form.unit || '-' }}</el-descriptions-item>
- <el-descriptions-item label="鎵瑰彿">{{ form.batchNo || '-' }}</el-descriptions-item>
- <el-descriptions-item label="妫�楠岀被鍨�">{{ viewCheckType }}</el-descriptions-item>
- <el-descriptions-item label="妫�娴嬬粨鏋�">{{ viewCheckResult }}</el-descriptions-item>
- <el-descriptions-item label="妫�楠屽憳">{{ form.checkUserName || '-' }}</el-descriptions-item>
- <el-descriptions-item label="妫�娴嬫棩鏈�">{{ form.checkTime || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="浜у搧鍚嶇О">{{
+ viewProductName
+ }}</el-descriptions-item>
+ <el-descriptions-item label="瑙勬牸鍨嬪彿">{{
+ viewProductModel
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鍗曚綅">{{
+ form.unit || "-"
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鎵瑰彿">{{
+ form.batchNo || "-"
+ }}</el-descriptions-item>
+ <el-descriptions-item label="妫�楠岀被鍨�">{{
+ viewCheckType
+ }}</el-descriptions-item>
+ <el-descriptions-item label="妫�娴嬬粨鏋�">{{
+ viewCheckResult
+ }}</el-descriptions-item>
+ <el-descriptions-item label="妫�楠屽憳">{{
+ form.checkUserName || "-"
+ }}</el-descriptions-item>
+ <el-descriptions-item label="妫�娴嬫棩鏈�">{{
+ form.checkTime || "-"
+ }}</el-descriptions-item>
</el-descriptions>
<div style="margin-bottom: 10px">
<el-button
- v-if="operationType !== 'view'"
- type="primary"
- @click="isShowItems = true"
- >娣诲姞妫�娴嬮」鐩�</el-button>
+ v-if="operationType !== 'view'"
+ type="primary"
+ @click="isShowItems = true"
+ >娣诲姞妫�娴嬮」鐩�</el-button
+ >
</div>
<PIMTable
- rowKey="id"
- :column="tableColumn"
- :tableData="tableData"
- :tableLoading="tableLoading"
- :is-show-pagination="false"
- height="400"
+ rowKey="id"
+ :column="tableColumn"
+ :tableData="tableData"
+ :tableLoading="tableLoading"
+ :is-show-pagination="false"
+ height="400"
>
<template #slot="{ row }">
<span v-if="operationType === 'view'">{{ row.testValue }}</span>
- <el-input
- v-else
- v-model="row.testValue"
- clearable
- />
+ <el-input v-else v-model="row.testValue" clearable />
</template>
</PIMTable>
<template #footer>
<div class="dialog-footer">
- <el-button v-if="operationType !== 'view'" type="primary" @click="submitForm">纭</el-button>
- <el-button @click="closeDia">{{ operationType === 'view' ? '鍏抽棴' : '鍙栨秷' }}</el-button>
+ <el-button
+ v-if="operationType !== 'view'"
+ type="primary"
+ @click="submitForm"
+ >纭</el-button
+ >
+ <el-button @click="closeDia">{{
+ operationType === "view" ? "鍏抽棴" : "鍙栨秷"
+ }}</el-button>
</div>
</template>
</el-dialog>
- <item-select v-model="isShowItems" @confirm="handleItemSelect"/>
+ <item-select v-model="isShowItems" @confirm="handleItemSelect" />
</div>
</template>
<script setup>
-import {ref, reactive, toRefs, getCurrentInstance, nextTick, computed} from "vue";
-import {modelList, productTreeList} from "@/api/basicData/product.js";
-import {qualityInspectParamInfo} from "@/api/qualityManagement/qualityInspectParam.js";
-import {qualityInspectDetailByProductId} from "@/api/qualityManagement/metricMaintenance.js";
-import {userListNoPage} from "@/api/system/user.js";
-import {createRawMaterial, findRawMaterialDetail, updateRawMaterial} from "@/api/qualityManagement/rawMaterial.js";
+import {
+ ref,
+ reactive,
+ toRefs,
+ getCurrentInstance,
+ nextTick,
+ computed,
+} from "vue";
+import { modelList, productTreeList } from "@/api/basicData/product.js";
+import { qualityInspectParamInfo } from "@/api/qualityManagement/qualityInspectParam.js";
+import { qualityInspectDetailByProductId } from "@/api/qualityManagement/metricMaintenance.js";
+import { userListNoPage } from "@/api/system/user.js";
+import {
+ createRawMaterial,
+ findRawMaterialDetail,
+ updateRawMaterial,
+} from "@/api/qualityManagement/rawMaterial.js";
import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";
-const {proxy} = getCurrentInstance()
-const emit = defineEmits(['close'])
-const ItemSelect = defineAsyncComponent(() => import("@/views/qualityManagement/rawMaterial/components/itemSelect.vue"));
+const { proxy } = getCurrentInstance();
+const emit = defineEmits(["close"]);
+const ItemSelect = defineAsyncComponent(() =>
+ import("@/views/qualityManagement/rawMaterial/components/itemSelect.vue")
+);
const dialogFormVisible = ref(false);
-const operationType = ref('')
-const isShowItems = ref(false)
+const operationType = ref("");
+const isShowItems = ref(false);
const data = reactive({
form: {
checkTime: "",
@@ -193,13 +252,21 @@
checkUserName: "",
},
rules: {
- checkTime: [{required: true, message: "璇疯緭鍏�", trigger: "blur"},],
- checkUserName: [{required: false, message: "璇烽�夋嫨妫�楠屽憳", trigger: "blur"}],
- productId: [{required: true, message: "璇疯緭鍏�", trigger: "blur"}],
- productModelId: [{required: true, message: "璇烽�夋嫨浜у搧鍨嬪彿", trigger: "change"}],
- batchNo: [{required: true, message: "璇疯緭鍏ユ壒娆�", trigger: "blur"}],
- checkType: [{required: true, message: "璇烽�夋嫨妫�楠岀被鍨�", trigger: "change"}],
- checkResult: [{required: true, message: "璇烽�夋嫨妫�娴嬬粨鏋�", trigger: "change"}],
+ checkTime: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+ checkUserName: [
+ { required: false, message: "璇烽�夋嫨妫�楠屽憳", trigger: "blur" },
+ ],
+ productId: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+ productModelId: [
+ { required: true, message: "璇烽�夋嫨浜у搧鍨嬪彿", trigger: "change" },
+ ],
+ batchNo: [{ required: true, message: "璇疯緭鍏ユ壒娆�", trigger: "blur" }],
+ checkType: [
+ { required: true, message: "璇烽�夋嫨妫�楠岀被鍨�", trigger: "change" },
+ ],
+ checkResult: [
+ { required: true, message: "璇烽�夋嫨妫�娴嬬粨鏋�", trigger: "change" },
+ ],
},
});
const tableColumn = ref([
@@ -222,29 +289,29 @@
{
label: "鍖栭獙鍊�",
prop: "testValue",
- dataType: 'slot',
- slot: 'slot',
+ dataType: "slot",
+ slot: "slot",
},
{
- dataType: 'action',
- label: '鎿嶄綔',
- align: 'center',
- fixed: 'right',
+ dataType: "action",
+ label: "鎿嶄綔",
+ align: "center",
+ fixed: "right",
width: 140,
operation: [
{
- name: '鍒犻櫎',
- type: 'text',
+ name: "鍒犻櫎",
+ type: "text",
clickFun: (row) => handleDelete(row.id),
- disabled: () => operationType.value === 'view',
- }
- ]
- }
+ disabled: () => operationType.value === "view",
+ },
+ ],
+ },
]);
const tableData = ref([]);
const tableLoading = ref(false);
-const {form, rules} = toRefs(data);
+const { form, rules } = toRefs(data);
const userList = ref([]);
const productOptions = ref([]);
const currentProductId = ref(0);
@@ -261,9 +328,9 @@
// 鎵撳紑寮规
const openDialog = async (type, row) => {
operationType.value = type;
- userListNoPage().then(res => {
+ userListNoPage().then((res) => {
userList.value = res.data || [];
- })
+ });
// 鍏堥噸缃〃鍗曟暟鎹紙淇濇寔瀛楁瀹屾暣锛岄伩鍏嶅脊绐楅娆℃覆鏌撴椂瑙﹀彂蹇呭～绾㈡鈥滈棯涓�涓嬧�濓級
form.value = {
checkTime: getTodayStr(),
@@ -277,17 +344,17 @@
checkResult: "",
unit: "",
checkUserName: "",
- }
+ };
tableData.value = [];
// 鍏堢‘淇濅骇鍝佹爲宸插姞杞斤紝鍚﹀垯缂栬緫鏃朵骇鍝�/瑙勬牸鍨嬪彿鏃犳硶鍙嶆樉
await getProductOptions();
- if (operationType.value === 'edit') {
+ if (operationType.value === "edit") {
await fetchData(row.id);
- currentProductId.value = row.productId || 0
+ currentProductId.value = row.productId || 0;
// 鍏抽敭锛氱紪杈戞椂鍔犺浇瑙勬牸鍨嬪彿涓嬫媺閫夐」锛屾墠鑳藉弽鏄� productModelId
if (currentProductId.value) {
try {
- const res = await modelList({id: currentProductId.value});
+ const res = await modelList({ id: currentProductId.value });
modelOptions.value = res || [];
// 鍚屾鍥炲～ model / unit锛堟湁浜涙帴鍙ｈ繑鍥炵殑 row 閲屽彲鑳芥病甯﹀叏锛�
if (form.value.productModelId) {
@@ -300,17 +367,16 @@
}
// 缂栬緫妯″紡涓嬶紝鍏堝姞杞芥寚鏍囬�夐」锛岀劧鍚庡姞杞藉弬鏁板垪琛�
if (currentProductId.value) {
-
} else {
getQualityInspectParamList(row.id);
}
}
- if (operationType.value === 'view') {
+ if (operationType.value === "view") {
await fetchData(row.id);
- currentProductId.value = row.productId || 0
+ currentProductId.value = row.productId || 0;
if (currentProductId.value) {
try {
- const res = await modelList({id: currentProductId.value});
+ const res = await modelList({ id: currentProductId.value });
modelOptions.value = res || [];
if (form.value.productModelId) {
handleChangeModel(form.value.productModelId);
@@ -331,7 +397,7 @@
nextTick(() => {
proxy.$refs?.formRef?.clearValidate?.();
});
-}
+};
const getProductOptions = () => {
return productTreeList().then((res) => {
productOptions.value = convertIdToValue(res);
@@ -342,11 +408,11 @@
form.value.productModelId = undefined;
form.value.unit = undefined;
modelOptions.value = [];
- currentProductId.value = value
+ currentProductId.value = value;
form.value.productName = findNodeById(productOptions.value, value);
- modelList({id: value}).then((res) => {
+ modelList({ id: value }).then((res) => {
modelOptions.value = res;
- })
+ });
if (currentProductId.value) {
getList();
}
@@ -354,14 +420,19 @@
const handleItemSelect = (value) => {
// 杩囨护宸插瓨鍦ㄧ殑鎸囨爣
- value = value.filter(item => !tableData.value.some(existingItem => existingItem.id === item.id));
- tableData.value.push(...value)
-}
+ value = value.filter(
+ (item) =>
+ !tableData.value.some((existingItem) => existingItem.id === item.id)
+ );
+ tableData.value.push(...value);
+};
const handleChangeModel = (value) => {
- form.value.model = modelOptions.value.find(item => item.id == value)?.model || '';
- form.value.unit = modelOptions.value.find(item => item.id == value)?.unit || '';
-}
+ form.value.model =
+ modelOptions.value.find((item) => item.id == value)?.model || "";
+ form.value.unit =
+ modelOptions.value.find((item) => item.id == value)?.unit || "";
+};
const findNodeById = (nodes, productId) => {
for (let i = 0; i < nodes.length; i++) {
@@ -380,35 +451,37 @@
// 璇︽儏妯″紡灞曠ず瀛楁锛堜笉浣跨敤琛ㄥ崟鎺т欢锛�
const viewProductName = computed(() => {
- const id = form.value?.productId
- const label = id ? findNodeById(productOptions.value || [], id) : null
- return label || id || '-'
-})
+ const id = form.value?.productId;
+ const label = id ? findNodeById(productOptions.value || [], id) : null;
+ return label || id || "-";
+});
const viewProductModel = computed(() => {
- const modelId = form.value?.productModelId
- const matched = (modelOptions.value || []).find((x) => String(x.id) === String(modelId))
- return matched?.model || modelId || '-'
-})
+ const modelId = form.value?.productModelId;
+ const matched = (modelOptions.value || []).find(
+ (x) => String(x.id) === String(modelId)
+ );
+ return matched?.model || modelId || "-";
+});
const viewCheckType = computed(() => {
- const t = form.value?.checkType
- if (t === 0 || t === '0') return '鍏ュ巶妫�'
- if (t === 1 || t === '1') return '杞﹂棿妫�'
- if (t === 2 || t === '2') return '鍑哄巶妫�'
- return '-'
-})
+ const t = form.value?.checkType;
+ if (t === 0 || t === "0") return "鍏ュ巶妫�";
+ if (t === 1 || t === "1") return "杞﹂棿妫�";
+ if (t === 2 || t === "2") return "鍑哄巶妫�";
+ return "-";
+});
const viewCheckResult = computed(() => {
- const r = form.value?.checkResult
- if (r === 1 || r === '1') return '鍚堟牸'
- if (r === 0 || r === '0') return '涓嶅悎鏍�'
- return '-'
-})
+ const r = form.value?.checkResult;
+ if (r === 1 || r === "1") return "鍚堟牸";
+ if (r === 0 || r === "0") return "涓嶅悎鏍�";
+ return "-";
+});
function convertIdToValue(data) {
return data.map((item) => {
- const {id, children, ...rest} = item;
+ const { id, children, ...rest } = item;
const newItem = {
...rest,
value: id, // 灏� id 鏀逛负 value
@@ -423,24 +496,24 @@
// 鎻愪氦浜у搧琛ㄥ崟
const submitForm = () => {
- if (operationType.value === 'view') return;
- proxy.$refs.formRef.validate(valid => {
+ if (operationType.value === "view") return;
+ proxy.$refs.formRef.validate((valid) => {
if (valid) {
- const data = {...form.value, qualityInspectItem: tableData.value}
+ const data = { ...form.value, qualityInspectItem: tableData.value };
if (operationType.value === "add") {
- createRawMaterial(data).then(res => {
+ createRawMaterial(data).then((res) => {
proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
closeDia();
- })
+ });
} else {
- updateRawMaterial(data).then(res => {
+ updateRawMaterial(data).then((res) => {
proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
closeDia();
- })
+ });
}
}
- })
-}
+ });
+};
const getList = () => {
if (!currentProductId.value) {
@@ -449,45 +522,45 @@
}
let params = {
productId: currentProductId.value,
- }
- qualityInspectDetailByProductId(params).then(res => {
+ };
+ qualityInspectDetailByProductId(params).then((res) => {
// 娓呯┖琛ㄦ牸鏁版嵁锛岀瓑寰呯敤鎴烽�夋嫨鎸囨爣
tableData.value = [];
- })
-}
+ });
+};
const getQualityInspectParamList = (id) => {
- qualityInspectParamInfo(id).then(res => {
+ qualityInspectParamInfo(id).then((res) => {
tableData.value = res.data;
- })
-}
+ });
+};
// 鍏抽棴寮规
const closeDia = () => {
proxy.resetForm("formRef");
tableData.value = [];
dialogFormVisible.value = false;
- emit('close')
+ emit("close");
};
const handleDelete = (id) => {
- if (operationType.value === 'view') return;
- tableData.value = tableData.value.filter(item => item.id !== id);
-}
+ if (operationType.value === "view") return;
+ tableData.value = tableData.value.filter((item) => item.id !== id);
+};
const fetchData = (id) => {
tableLoading.value = true;
- findRawMaterialDetail(id).then(res => {
- form.value = res.data;
- tableData.value = res.data.qualityInspectItem;
- }).finally(() => {
- tableLoading.value = false;
- })
-}
+ findRawMaterialDetail(id)
+ .then((res) => {
+ form.value = res.data;
+ tableData.value = res.data.qualityInspectItem;
+ })
+ .finally(() => {
+ tableLoading.value = false;
+ });
+};
defineExpose({
openDialog,
});
</script>
-<style scoped>
-
-</style>
+<style scoped></style>
--
Gitblit v1.9.3