DeXun/klp-oa
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(wms): 添加酸连轧最近记录展示功能

Browse Source 
- 在钢卷录入界面添加酸连轧最近10条记录表格展示
- 实现酸连轧数据回填到表单的功能
- 支持数组格式和单个对象格式的数据兼容处理
- 添加毛重、净重、长度和班组信息的自动填充
- 优化界面布局增加卡片间距提升用户体验
- 修复多个表单项的代码格式缩进问题
This commit is contained in:
Joshi
2026-02-07 16:59:28 +08:00
parent afd5b0479d
commit 64b4d6e5e4
1 changed files with 95 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
klp-ui/src/views/wms/coil/typing.vue
View File

@@ -108,7 +108,7 @@
<el-form-item label="班组" prop="team">
<el-select v-model="updateForm.team" placeholder="请选择班组" style="width: 100%"
:disabled="readonly">
:disabled="readonly">
<el-option key="甲" label="甲" value="甲" />
<el-option key="乙" label="乙" value="乙" />
</el-select>
@@ -116,33 +116,33 @@
<el-form-item label="材料类型" prop="materialType">
<el-select v-model="updateForm.materialType" placeholder="请选择材料类型" style="width: 100%"
:disabled="readonly" @change="handleMaterialTypeChange">
:disabled="readonly" @change="handleMaterialTypeChange">
<el-option label="原料" value="原料" />
<el-option label="成品" value="成品" />
</el-select>
</el-form-item>
<el-form-item :label="getItemLabel" prop="itemId"
:rules="rules.itemId">
:rules="rules.itemId">
<RawMaterialSelect v-if="updateForm.materialType === '原料'" v-model="updateForm.itemId"
placeholder="请选择原料" style="width: 100%" clearable
:disabled="readonly || !updateForm.materialType" />
placeholder="请选择原料" style="width: 100%" clearable
:disabled="readonly || !updateForm.materialType" />
<ProductSelect v-else-if="updateForm.materialType === '成品'" v-model="updateForm.itemId"
placeholder="请选择成品" style="width: 100%" clearable
:disabled="readonly || !updateForm.materialType" />
placeholder="请选择成品" style="width: 100%" clearable
:disabled="readonly || !updateForm.materialType" />
<div v-else>请先选择物料类型</div>
</el-form-item>
<el-form-item label="质量状态" prop="qualityStatus">
<el-form-item label="质量状态" prop="qualityStatus">
<el-select v-model="updateForm.qualityStatus" placeholder="请选择质量状态" style="width: 100%"
:disabled="readonly">
:disabled="readonly">
<el-option v-for="item in dict.type.coil_quality_status" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="切边要求" prop="trimmingRequirement">
<el-select v-model="updateForm.trimmingRequirement" placeholder="请选择切边要求" style="width: 100%"
:disabled="readonly">
:disabled="readonly">
<el-option label="净边料" value="净边料" />
<el-option label="毛边料" value="毛边料" />
</el-select>
@@ -150,13 +150,13 @@
<el-form-item label="打包状态" prop="packingStatus">
<el-input v-model="updateForm.packingStatus" placeholder="请输入打包状态"
:disabled="readonly">
:disabled="readonly">
</el-input>
</el-form-item>
<el-form-item label="包装要求" prop="packagingRequirement">
<el-select v-model="updateForm.packagingRequirement" placeholder="请选择包装要求" style="width: 100%"
:disabled="readonly">
:disabled="readonly">
<el-option label="裸包" value="裸包" />
<el-option label="普包" value="普包" />
<el-option label="简包" value="简包" />
@@ -165,20 +165,20 @@
<el-form-item label="毛重(t)" prop="grossWeight">
<el-input-number precision="3" :controls="false" v-model="updateForm.grossWeight" placeholder="请输入毛重" type="number" :step="0.01"
:disabled="readonly">
:disabled="readonly">
</el-input-number>
</el-form-item>
<el-form-item label="净重(t)" prop="netWeight">
<el-input-number precision="3" :controls="false" v-model="updateForm.netWeight" placeholder="请输入净重" type="number" :step="0.01"
:disabled="readonly">
:disabled="readonly">
<template slot="append">吨</template>
</el-input-number>
</el-form-item>
<el-form-item label="长度(m)" prop="length">
<el-input-number :controls="false" v-model="updateForm.length" placeholder="请输入长度" type="number" :step="0.01"
:disabled="readonly">
:disabled="readonly">
<template slot="append">米</template>
</el-input-number>
</el-form-item>
@@ -210,10 +210,33 @@
<el-form-item label="备注" prop="remark">
<el-input v-model="updateForm.remark" type="textarea" :rows="4" placeholder="请输入备注信息（非必填）" maxlength="500"
show-word-limit :disabled="readonly" />
show-word-limit :disabled="readonly" />
</el-form-item>
</el-form>
</el-card>
<!-- 酸连轧最近10条记录展示 -->
<el-card class="recent-records-card" v-if="acidRecentRecords && acidRecentRecords.length > 0">
<div slot="header" class="card-header">
<span><i class="el-icon-time"></i> 酸连轧最近记录</span>
</div>
<el-table :data="acidRecentRecords" stripe size="small">
<el-table-column prop="currentCoilNo" label="当前钢卷号" width="150" show-overflow-tooltip></el-table-column>
<el-table-column prop="excoilId" label="出口卷号" width="150" show-overflow-tooltip></el-table-column>
<el-table-column prop="exitWeight" label="出口重量(t)" width="100">
<template slot-scope="scope">
{{ scope.row.exitWeight ? scope.row.exitWeight + ' t' : '—' }}
</template>
</el-table-column>
<el-table-column prop="exitLength" label="出口长度(m)" width="120">
<template slot-scope="scope">
{{ scope.row.exitLength ? scope.row.exitLength + ' m' : '—' }}
</template>
</el-table-column>
<el-table-column prop="team" label="班组" width="80"></el-table-column>
</el-table>
</el-card>
</div>
</div>
@@ -229,8 +252,8 @@
<el-timeline v-if="historySteps.length > 0">
<el-timeline-item v-for="(step, index) in historySteps" :key="index"
:timestamp="`步骤 ${step.display_step || step.step}`" placement="top"
:type="step.operation === '新增' ? 'success' : 'primary'">
:timestamp="`步骤 ${step.display_step || step.step}`" placement="top"
:type="step.operation === '新增' ? 'success' : 'primary'">
<div class="history-item">
<div class="history-title">{{ step.operation || step.action }}</div>
<div class="history-detail" v-if="step.operator">
@@ -325,7 +348,7 @@ export default {
rules: {
currentCoilNo: [
{ required: true, message: '请输入当前钢卷号', trigger: 'blur' },
// 仅在新增的时候校验
// 仅在新增的时候校验
{
validator: (rule, value, callback) => {
// 没有coilId则为新增 触发校验
@@ -379,7 +402,9 @@ export default {
productList: [],
itemSearchLoading: false,
// 只读模式
readonly: false
readonly: false,
// 酸连轧最近记录
acidRecentRecords: []
};
},
computed: {
@@ -457,28 +482,56 @@ export default {
this.acidPrefill.type = 'info'
this.acidPrefill.title = '未在二级系统中查找到对应信息，请自行填写'
} else {
if (prefill.exitWeight != null && prefill.exitWeight !== '') {
const w = Number(prefill.exitWeight)
if (!Number.isNaN(w)) {
this.$set(this.updateForm, 'grossWeight', w)
this.$set(this.updateForm, 'netWeight', w)
}
}
// 处理返回的列表数据
if (Array.isArray(prefill)) {
this.acidRecentRecords = prefill;
if (prefill.exitLength != null && prefill.exitLength !== '') {
const len = Number(prefill.exitLength)
if (!Number.isNaN(len)) {
this.$set(this.updateForm, 'length', len)
}
}
// 使用第一条记录填充表单（保持原有逻辑）
const firstRecord = prefill[0];
if (firstRecord) {
if (firstRecord.exitWeight != null && firstRecord.exitWeight !== '') {
const w = Number(firstRecord.exitWeight)
if (!Number.isNaN(w)) {
this.$set(this.updateForm, 'grossWeight', w)
this.$set(this.updateForm, 'netWeight', w)
}
}
if (prefill.team) {
this.$set(this.updateForm, 'team', prefill.team)
if (firstRecord.exitLength != null && firstRecord.exitLength !== '') {
const len = Number(firstRecord.exitLength)
if (!Number.isNaN(len)) {
this.$set(this.updateForm, 'length', len)
}
}
if (firstRecord.team) {
this.$set(this.updateForm, 'team', firstRecord.team)
}
}
} else {
// 为了兼容旧版本的单个对象返回格式
if (prefill.exitWeight != null && prefill.exitWeight !== '') {
const w = Number(prefill.exitWeight)
if (!Number.isNaN(w)) {
this.$set(this.updateForm, 'grossWeight', w)
this.$set(this.updateForm, 'netWeight', w)
}
}
if (prefill.exitLength != null && prefill.exitLength !== '') {
const len = Number(prefill.exitLength)
if (!Number.isNaN(len)) {
this.$set(this.updateForm, 'length', len)
}
}
if (prefill.team) {
this.$set(this.updateForm, 'team', prefill.team)
}
}
this.acidPrefill.type = 'success'
this.acidPrefill.title = '已结合酸轧二级系统完成部分信息填写'
console.log('[typing] acid rolling prefill applied:', prefill)
}
} catch (e) {
@@ -833,6 +886,7 @@ export default {
min-width: 0;
display: flex;
flex-direction: column;
gap: 20px; // 添加间距
}
/* 确保两侧卡片高度一致 */
@@ -849,6 +903,11 @@ export default {
}
}
// 新增：最近记录卡片样式
.recent-records-card {
flex: none; // 不伸缩，只占据内容所需空间
}
/* 变更历史区域（占满整行） */
.history-section {
margin-top: 20px;