From 4040afa2a2b5af32e022c8c62aef57de06dd3c06 Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期三, 25 三月 2026 11:41:46 +0800
Subject: [PATCH] 原材料检验详情页面
---
src/views/qualityManagement/rawMaterialInspection/index.vue | 29 +++++
src/views/qualityManagement/rawMaterialInspection/components/detailDialog.vue | 250 ++++++++++++++++++++++++++++++++++++++++++++++++++
2 files changed, 279 insertions(+), 0 deletions(-)
diff --git a/src/views/qualityManagement/rawMaterialInspection/components/detailDialog.vue b/src/views/qualityManagement/rawMaterialInspection/components/detailDialog.vue
new file mode 100644
index 0000000..963bf1a
--- /dev/null
+++ b/src/views/qualityManagement/rawMaterialInspection/components/detailDialog.vue
@@ -0,0 +1,250 @@
+<template>
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="800px"
+ :close-on-click-modal="false"
+ custom-class="custom-dialog">
+ <div class="detail-container">
+ <!-- 鍩虹淇℃伅 -->
+ <div class="detail-section">
+ <h3 class="section-title">鍩虹淇℃伅</h3>
+ <el-descriptions :column="3"
+ border>
+ <el-descriptions-item label="妫�娴嬫棩鏈�">{{ formatTime(detailData.checkTime) }}</el-descriptions-item>
+ <el-descriptions-item label="渚涘簲鍟�">{{ detailData.supplier || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="妫�楠屽憳"><span style="color: #eb9113;">{{ detailData.checkName || '-' }}</span></el-descriptions-item>
+ <el-descriptions-item label="浜у搧鍚嶇О"><span style="color: hsl(210, 100%, 63%);">{{ detailData.productName || '-' }}</span></el-descriptions-item>
+ <el-descriptions-item label="瑙勬牸鍨嬪彿"><span style="">{{ detailData.model || '-' }}</span></el-descriptions-item>
+ <el-descriptions-item label="鍗曚綅"><span style="">{{ detailData.unit || '-' }}</span></el-descriptions-item>
+ <el-descriptions-item label="鏁伴噺">{{ detailData.quantity || 0 }}</el-descriptions-item>
+ <el-descriptions-item label="璇曟牱缂栧彿">{{ detailData.sampleCode || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="杞︾墝鍙�">{{ detailData.licensePlateNumber || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="璇曟牱鐘舵��"><el-tag>{{ detailData.sampleState || '-' }}</el-tag></el-descriptions-item>
+ <el-descriptions-item label="妫�娴嬫�ц川"><el-tag type="info">{{ detailData.inspectNature || '-' }}</el-tag></el-descriptions-item>
+ <el-descriptions-item label="鎸囨爣閫夋嫨"><el-tag type="warning">{{ detailData.testStandardName || detailData.testStandardId || '-' }}</el-tag></el-descriptions-item>
+ <el-descriptions-item label="鍙栨牱鏃ユ湡">{{ formatTime(detailData.sampleTime) }}</el-descriptions-item>
+ <el-descriptions-item label="妫�娴嬪崟浣�">{{ detailData.checkCompany || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="妫�娴嬬粨鏋�"><el-tag :type="detailData.checkResult == '鍚堟牸' ? 'success' : 'danger'">{{ detailData.checkResult || '-' }}</el-tag></el-descriptions-item>
+ <el-descriptions-item label="鎻愪氦鐘舵��"><el-tag :type="detailData.inspectState ? 'success' : 'danger'">{{ detailData.inspectState ? '宸叉彁浜�' : '鏈彁浜�' }}</el-tag></el-descriptions-item>
+ </el-descriptions>
+ </div>
+ <!-- 鎸囨爣淇℃伅 -->
+ <div class="detail-section"
+ v-if="detailData.qualityInspectParams && detailData.qualityInspectParams.length > 0">
+ <h3 class="section-title">鎸囨爣淇℃伅</h3>
+ <el-table :data="detailData.qualityInspectParams"
+ style="width: 100%"
+ border>
+ <el-table-column prop="parameterItem"
+ label="鎸囨爣"
+ min-width="150"></el-table-column>
+ <el-table-column prop="unit"
+ label="鍗曚綅"
+ width="100"></el-table-column>
+ <el-table-column prop="standardValue"
+ label="鏍囧噯鍊�"
+ width="120"></el-table-column>
+ <el-table-column prop="controlValue"
+ label="鍐呮帶鍊�"
+ width="120"></el-table-column>
+ <el-table-column prop="testValue"
+ label="妫�楠屽��"
+ width="120">
+ <template #default="scope">
+ <span style="color: hsl(210, 100%, 63%);">{{ scope.row.testValue || '-' }}</span>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </div>
+ <template #footer>
+ <div class="dialog-footer">
+ <el-button @click="dialogVisible = false">鍏抽棴</el-button>
+ </div>
+ </template>
+ </el-dialog>
+</template>
+
+<script setup>
+ import { ref, computed, watch } from "vue";
+ import dayjs from "dayjs";
+ import {
+ qualityInspectDetailByProductId,
+ getQualityTestStandardParamByTestStandardId,
+ } from "@/api/qualityManagement/metricMaintenance.js";
+ import { qualityInspectParamInfo } from "@/api/qualityManagement/qualityInspectParam.js";
+
+ const props = defineProps({
+ visible: {
+ type: Boolean,
+ default: false,
+ },
+ data: {
+ type: Object,
+ default: () => ({}),
+ },
+ });
+
+ const emit = defineEmits(["update:visible"]);
+
+ const dialogVisible = computed({
+ get: () => props.visible,
+ set: value => emit("update:visible", value),
+ });
+
+ const dialogTitle = computed(() => "鍘熸潗鏂欐楠岃鎯�");
+ const detailData = ref(props.data);
+ const loading = ref(false);
+
+ // 鏍煎紡鍖栨椂闂�
+ const formatTime = time => {
+ return time ? dayjs(time).format("YYYY-MM-DD HH:mm:ss") : "-";
+ };
+
+ // 鍔犺浇鎸囨爣閫夋嫨鍜岃〃鏍兼暟鎹�
+ const loadIndicatorData = async () => {
+ if (!detailData.value.productId) return;
+
+ loading.value = true;
+ try {
+ // 鍔犺浇鎸囨爣閫夋嫨鍒楄〃
+ const params = {
+ productId: detailData.value.productId,
+ inspectType: 0,
+ };
+ const standardRes = await qualityInspectDetailByProductId(params);
+ if (standardRes.data && standardRes.data.length > 0) {
+ // 鏌ユ壘褰撳墠閫夋嫨鐨勬寚鏍囧悕绉�
+ const selectedStandard = standardRes.data.find(
+ item => item.id == detailData.value.testStandardId
+ );
+ if (selectedStandard) {
+ detailData.value.testStandardName =
+ selectedStandard.standardName || selectedStandard.standardNo;
+ }
+ }
+
+ // 鍔犺浇鍙傛暟鏁版嵁锛堜笌缂栬緫椤甸潰淇濇寔涓�鑷达級
+ if (detailData.value.id) {
+ getQualityInspectParamList(detailData.value.id);
+ }
+ } catch (error) {
+ console.error("鍔犺浇鎸囨爣鏁版嵁澶辫触:", error);
+ } finally {
+ loading.value = false;
+ }
+ };
+ const getQualityInspectParamList = id => {
+ qualityInspectParamInfo(id).then(res => {
+ detailData.value.qualityInspectParams = res.data;
+ });
+ };
+ // 鐩戝惉鏁版嵁鍙樺寲
+ watch(
+ () => props.data,
+ newData => {
+ detailData.value = newData;
+ },
+ { deep: true }
+ );
+
+ // 鏆撮湶鏂规硶缁欑埗缁勪欢
+ defineExpose({
+ loadIndicatorData,
+ });
+</script>
+
+<style scoped>
+ .detail-container {
+ max-height: 600px;
+ overflow-y: auto;
+ padding: 0 16px;
+ }
+
+ .detail-section {
+ margin-bottom: 28px;
+ background-color: #ffffff;
+ border-radius: 8px;
+ padding: 20px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+ }
+
+ .section-title {
+ font-size: 16px;
+ font-weight: 600;
+ margin-bottom: 16px;
+ color: #1a1a1a;
+ border-bottom: 2px solid #409eff;
+ padding-bottom: 10px;
+ }
+
+ .dialog-footer {
+ text-align: center;
+ padding: 20px;
+ border-top: 1px solid #ebeef5;
+ }
+
+ .dialog-footer .el-button {
+ min-width: 100px;
+ padding: 8px 20px;
+ }
+
+ /* 鑷畾涔夊璇濇鏍峰紡 */
+ :deep(.custom-dialog) {
+ border-radius: 12px;
+ overflow: hidden;
+ }
+
+ :deep(.custom-dialog .el-dialog__header) {
+ background-color: #f5f7fa;
+ padding: 20px;
+ border-bottom: 1px solid #ebeef5;
+ }
+
+ :deep(.custom-dialog .el-dialog__title) {
+ font-size: 18px;
+ font-weight: 600;
+ color: #1a1a1a;
+ }
+
+ :deep(.custom-dialog .el-dialog__body) {
+ padding: 20px;
+ }
+
+ /* 鎻忚堪鍒楄〃鏍峰紡浼樺寲 */
+ :deep(.el-descriptions) {
+ border-radius: 6px;
+ overflow: hidden;
+ }
+
+ :deep(.el-descriptions__label) {
+ font-weight: 500;
+ color: #606266;
+ }
+
+ :deep(.el-descriptions__content) {
+ color: #1a1a1a;
+ font-weight: 500;
+ }
+
+ /* 琛ㄦ牸鏍峰紡浼樺寲 */
+ :deep(.el-table) {
+ border-radius: 6px;
+ overflow: hidden;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+ }
+
+ :deep(.el-table th) {
+ background-color: #f5f7fa;
+ font-weight: 600;
+ color: #303133;
+ }
+
+ :deep(.el-table tr:hover > td) {
+ background-color: #ecf5ff !important;
+ }
+
+ :deep(.el-table td) {
+ color: #303133;
+ }
+</style>
\ No newline at end of file
diff --git a/src/views/qualityManagement/rawMaterialInspection/index.vue b/src/views/qualityManagement/rawMaterialInspection/index.vue
index a673c15..ff6662e 100644
--- a/src/views/qualityManagement/rawMaterialInspection/index.vue
+++ b/src/views/qualityManagement/rawMaterialInspection/index.vue
@@ -49,6 +49,10 @@
@close="handleQuery"></FormDia>
<files-dia ref="filesDia"
@close="handleQuery"></files-dia>
+ <DetailDialog ref="detailDialog"
+ v-model:visible="detailDialogVisible"
+ :data="detailDialogData"
+ @close="handleQuery"></DetailDialog>
<el-dialog v-model="dialogFormVisible"
title="缂栬緫妫�楠屽憳"
width="30%"
@@ -93,6 +97,7 @@
} from "vue";
import InspectionFormDia from "@/views/qualityManagement/rawMaterialInspection/components/inspectionFormDia.vue";
import FormDia from "@/views/qualityManagement/rawMaterialInspection/components/formDia.vue";
+ import DetailDialog from "@/views/qualityManagement/rawMaterialInspection/components/detailDialog.vue";
import { ElMessageBox } from "element-plus";
import {
downloadQualityInspect,
@@ -255,6 +260,13 @@
},
},
{
+ name: "璇︽儏",
+ type: "text",
+ clickFun: row => {
+ openDetailDialog(row);
+ },
+ },
+ {
name: "闄勪欢",
type: "text",
clickFun: row => {
@@ -318,6 +330,9 @@
const formDia = ref();
const filesDia = ref();
const inspectionFormDia = ref();
+ const detailDialog = ref();
+ const detailDialogVisible = ref(false);
+ const detailDialogData = ref({});
const { proxy } = getCurrentInstance();
const userStore = useUserStore();
const changeDaterange = value => {
@@ -372,6 +387,20 @@
});
};
+ // 鎵撳紑璇︽儏寮规
+ const openDetailDialog = row => {
+ // 纭繚qualityInspectParams瀛楁瀛樺湪
+ if (!row.qualityInspectParams) {
+ row.qualityInspectParams = [];
+ }
+ detailDialogData.value = row;
+ detailDialogVisible.value = true;
+ // 鎵撳紑寮圭獥鍚庡姞杞芥寚鏍囨暟鎹�
+ setTimeout(() => {
+ detailDialog.value?.loadIndicatorData();
+ }, 100);
+ };
+
// 鍒犻櫎
const handleDelete = () => {
let ids = [];
--
Gitblit v1.9.3