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

- 在钢卷录入界面添加酸连轧最近10条记录表格展示
- 实现酸连轧数据回填到表单的功能
- 支持数组格式和单个对象格式的数据兼容处理
- 添加毛重、净重、长度和班组信息的自动填充
- 优化界面布局增加卡片间距提升用户体验
- 修复多个表单项的代码格式缩进问题

klp-ui/src/views/wms/coil/typing.vue

@@ -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
+                                 placeholder="请选择原料" style="width: 100%" clearable
-                :disabled="readonly || !updateForm.materialType" />
+                                 :disabled="readonly || !updateForm.materialType" />
               <ProductSelect v-else-if="updateForm.materialType === '成品'" v-model="updateForm.itemId"
-                placeholder="请选择成品" style="width: 100%" clearable
+                             placeholder="请选择成品" style="width: 100%" clearable
-                :disabled="readonly || !updateForm.materialType" />
+                             :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"
+                            :timestamp="`步骤 ${step.display_step || step.step}`" placement="top"
-            :type="step.operation === '新增' ? 'success' : 'primary'">
+                            :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 (Array.isArray(prefill)) {
-                if (!Number.isNaN(w)) {
+                this.acidRecentRecords = prefill;
-                  this.$set(this.updateForm, 'grossWeight', w)
-                  this.$set(this.updateForm, 'netWeight', w)
-                }
-              }
 
-              if (prefill.exitLength != null && prefill.exitLength !== '') {
+                // 使用第一条记录填充表单（保持原有逻辑）
-                const len = Number(prefill.exitLength)
+                const firstRecord = prefill[0];
-                if (!Number.isNaN(len)) {
+                if (firstRecord) {
-                  this.$set(this.updateForm, 'length', len)
+                  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) {
+                  if (firstRecord.exitLength != null && firstRecord.exitLength !== '') {
-                this.$set(this.updateForm, 'team', prefill.team)
+                    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;