<template>
|
<scroll-view class="material-page" scroll-y>
|
<view v-if="materialReady" class="page-content">
|
<view class="hero-card">
|
<view class="hero-top">
|
<wd-tag :type="materialType === '单丝' ? 'primary' : 'success'" size="small">
|
{{ materialType }}
|
</wd-tag>
|
<view class="iron-plate">铁盘号 {{ material.ironPlateNo ?? "-" }}</view>
|
</view>
|
<text class="material-code">{{ materialCode || "-" }}</text>
|
<text class="material-model">{{ material.model || "规格型号未填写" }}</text>
|
</view>
|
|
<view class="detail-card">
|
<view class="section-heading">物料信息</view>
|
<view class="detail-row">
|
<text class="detail-label">规格型号</text>
|
<text class="detail-value">{{ material.model || "-" }}</text>
|
</view>
|
<view v-if="materialType === '单丝'" class="detail-row">
|
<text class="detail-label">铝杆型号</text>
|
<text class="detail-value">{{ material.poleModel || material.rodModel || "-" }}</text>
|
</view>
|
<view v-if="materialType === '单丝'" class="detail-row">
|
<text class="detail-label">铝杆号</text>
|
<text class="detail-value">{{ material.rodNo || material.poleNumber || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">流转码/批次号</text>
|
<text class="detail-value">{{ materialCode || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">{{ materialType === "单丝" ? "重量(kg)" : "生产重量" }}</text>
|
<text class="detail-value">{{ materialWeight }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">单位</text>
|
<text class="detail-value">kg</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">厂家</text>
|
<text class="detail-value">{{ material.supplier || "-" }}</text>
|
</view>
|
</view>
|
|
<view class="detail-card">
|
<view class="section-heading">质检信息</view>
|
<view class="quality-grid">
|
<view class="quality-item">
|
<text class="quality-label">质检温度</text>
|
<text class="quality-value">{{ qualityTemperature }}</text>
|
</view>
|
<view class="quality-item">
|
<text class="quality-label">质检时长</text>
|
<text class="quality-value">{{ qualityDuration }}</text>
|
</view>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">状态</text>
|
<wd-tag :type="statusType" size="small">{{ materialStatus }}</wd-tag>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">确认时效时间</text>
|
<text class="detail-value">{{ confirmTime }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">确认人</text>
|
<text class="detail-value">{{ confirmUser }}</text>
|
</view>
|
</view>
|
|
<view class="detail-card">
|
<view class="section-heading">生产信息</view>
|
<view class="detail-row">
|
<text class="detail-label">销售合同号</text>
|
<text class="detail-value">{{ material.ledgerNo || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">排产明细号</text>
|
<text class="detail-value">{{ material.schedulingDetailNo || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">设备编号</text>
|
<text class="detail-value">{{ material.deviceCode || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">客户名称</text>
|
<text class="detail-value">{{ material.clientName || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">生产日期</text>
|
<text class="detail-value">{{ material.productionDate || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">班次</text>
|
<text class="detail-value">{{ material.groupTeam || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">班组长</text>
|
<text class="detail-value">{{ material.groupTeamLeader || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">生产数量</text>
|
<text class="detail-value">{{ material.productionNumber ?? "-" }}</text>
|
</view>
|
</view>
|
</view>
|
|
<view v-else class="empty-state">
|
<wd-status-tip image="content" tip="未获取到物料详情" />
|
</view>
|
</scroll-view>
|
</template>
|
|
<script setup lang="ts">
|
import { onLoad } from "@dcloudio/uni-app";
|
import type { TagType } from "wot-design-uni/components/wd-tag/types";
|
|
const material = ref<any>({});
|
const materialReady = computed(() => Object.keys(material.value).length > 0);
|
const materialType = computed(() => {
|
const value = String(material.value.materialType || "");
|
return value.includes("绞") || value === "成品" ? "绞线" : "单丝";
|
});
|
const materialCode = computed(() =>
|
String(
|
material.value.flowCode ||
|
material.value.batchCode ||
|
material.value.monofilamentNumber ||
|
material.value.monofilamentnumber ||
|
material.value.materialCode ||
|
material.value.systemNo ||
|
material.value.systemno ||
|
""
|
).trim()
|
);
|
const materialWeight = computed(
|
() => material.value.weight ?? material.value.productionWeight ?? material.value.weightSum ?? "-"
|
);
|
const qualityTemperature = computed(() => {
|
const value =
|
material.value.qualitySetTemperature ??
|
material.value.qualityTemperature ??
|
material.value.inspectionTemperature ??
|
material.value.temperature;
|
return value === undefined || value === null || value === "" ? "-" : `${value}℃`;
|
});
|
const qualityDuration = computed(
|
() =>
|
material.value.qualitySetDuration ||
|
material.value.qualityDuration ||
|
material.value.inspectionDuration ||
|
material.value.duration ||
|
"-"
|
);
|
const confirmTime = computed(
|
() =>
|
material.value.confirmTime ||
|
material.value.confirmTimelinessTime ||
|
material.value.createTime ||
|
"-"
|
);
|
const confirmUser = computed(
|
() =>
|
material.value.confirmUserName ||
|
material.value.confirmPerson ||
|
material.value.createUserName ||
|
material.value.userName ||
|
"-"
|
);
|
const materialStatus = computed(() => {
|
const value = material.value.status ?? material.value.timelinessStatus;
|
if (value === 1 || value === "1" || value === "PROCESSING") return "时效中";
|
if (value === 2 || value === "2" || value === "FINISHED") return "时效结束";
|
return "待时效";
|
});
|
const statusType = computed<TagType>(() => {
|
if (materialStatus.value === "时效中") return "primary";
|
if (materialStatus.value === "时效结束") return "success";
|
return "warning";
|
});
|
|
onLoad(() => {
|
const pages = getCurrentPages();
|
const currentPage = pages[pages.length - 1] as any;
|
const eventChannel = currentPage?.getOpenerEventChannel?.();
|
eventChannel?.on("materialDetail", (data: any) => {
|
material.value = data || {};
|
});
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
.material-page {
|
min-height: 100vh;
|
background: #f3f9f8;
|
}
|
|
.page-content {
|
padding: 12px 12px calc(12px + env(safe-area-inset-bottom));
|
}
|
|
.hero-card,
|
.detail-card {
|
overflow: hidden;
|
margin-bottom: 12px;
|
background: #ffffff;
|
border: 1px solid rgba(13, 134, 127, 0.08);
|
border-radius: 14px;
|
box-shadow: 0 5px 18px rgba(35, 91, 82, 0.06);
|
}
|
|
.hero-card {
|
display: flex;
|
flex-direction: column;
|
gap: 8px;
|
padding: 16px;
|
background: linear-gradient(135deg, #ffffff 0%, #ecf8f5 100%);
|
}
|
|
.hero-top {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
}
|
|
.iron-plate {
|
padding: 5px 9px;
|
font-size: 12px;
|
font-weight: 600;
|
color: #087d72;
|
background: rgba(13, 134, 127, 0.1);
|
border-radius: 999px;
|
}
|
|
.material-code {
|
overflow-wrap: anywhere;
|
font-size: 20px;
|
font-weight: 700;
|
color: #20322e;
|
}
|
|
.material-model {
|
font-size: 14px;
|
color: #697a76;
|
}
|
|
.section-heading {
|
padding: 14px 15px 10px;
|
font-size: 15px;
|
font-weight: 700;
|
color: #263a35;
|
border-bottom: 1px solid #edf2f0;
|
}
|
|
.detail-row {
|
display: flex;
|
gap: 18px;
|
align-items: flex-start;
|
justify-content: space-between;
|
padding: 12px 15px;
|
font-size: 14px;
|
border-bottom: 1px solid #f1f4f3;
|
}
|
|
.detail-row:last-child {
|
border-bottom: 0;
|
}
|
|
.detail-label {
|
flex: none;
|
color: #7e8d89;
|
}
|
|
.detail-value {
|
min-width: 0;
|
color: #293a36;
|
text-align: right;
|
overflow-wrap: anywhere;
|
}
|
|
.quality-grid {
|
display: grid;
|
grid-template-columns: 1fr 1fr;
|
gap: 10px;
|
padding: 12px 15px;
|
background: #fbfdfc;
|
border-bottom: 1px solid #f1f4f3;
|
}
|
|
.quality-item {
|
display: flex;
|
flex-direction: column;
|
gap: 5px;
|
padding: 12px;
|
background: #f0f8f6;
|
border-radius: 10px;
|
}
|
|
.quality-label {
|
font-size: 12px;
|
color: #788984;
|
}
|
|
.quality-value {
|
font-size: 17px;
|
font-weight: 700;
|
color: #0d867f;
|
}
|
|
.empty-state {
|
padding-top: 80px;
|
}
|
</style>
|
