refactor(PdiList): 重构表单布局并优化字段组织
- 重新组织表单字段为更合理的分组结构 - 调整标签宽度和输入框样式 - 移除不必要的化学元素字段 - 更新表单验证规则 - 添加新的字段如钢卷状态、分卷模式等
This commit is contained in:
@@ -72,156 +72,139 @@
|
|||||||
<div style="display:flex;gap:20px;">
|
<div style="display:flex;gap:20px;">
|
||||||
<!-- 左侧表单 -->
|
<!-- 左侧表单 -->
|
||||||
<div style="flex:1;">
|
<div style="flex:1;">
|
||||||
<el-form :model="form" :rules="rules" ref="pdiForm" label-width="100px" size="small">
|
<el-form :model="form" :rules="rules" ref="pdiForm" label-width="120px" size="small">
|
||||||
|
|
||||||
<div class="section-title">基本信息</div>
|
<div class="section-title">基本数据</div>
|
||||||
<el-row :gutter="14">
|
<el-row :gutter="14">
|
||||||
<el-col :span="12"><el-form-item label="卷号" prop="coilid">
|
<el-col :span="12"><el-form-item label="批次编号" prop="rollprogramnb">
|
||||||
<el-input v-model="form.coilid" :disabled="isEdit" />
|
<el-input-number v-model="form.rollprogramnb" :controls="false" style="width:200px" />
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="12"><el-form-item label="计划号">
|
<el-col :span="12"><el-form-item label="顺序" prop="sequencenb">
|
||||||
<el-input v-model="form.schedule_code" />
|
<el-input-number v-model="form.sequencenb" :controls="false" style="width:200px" />
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="12"><el-form-item label="轧制程序号">
|
<el-col :span="12"><el-form-item label="计划编号">
|
||||||
<el-input-number v-model="form.rollprogramnb" :controls="false" style="width:100%" />
|
<el-input v-model="form.schedule_code" style="width:200px" />
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="12"><el-form-item label="顺序号">
|
<el-col :span="12"><el-form-item label="下道机组">
|
||||||
<el-input-number v-model="form.sequencenb" :controls="false" style="width:100%" />
|
<el-input v-model="form.next_process_code" style="width:200px" />
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="12"><el-form-item label="来料钢种">
|
</el-row>
|
||||||
<el-select v-model="form.steel_grade" placeholder="请选择来料钢种" clearable filterable style="width:100%">
|
|
||||||
|
<div class="section-title">来料数据基本信息</div>
|
||||||
|
<el-row :gutter="14">
|
||||||
|
<!-- 左列：来料物理参数 -->
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="来料卷号">
|
||||||
|
<el-input v-model="form.coilid" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="来料厚度[mm]">
|
||||||
|
<el-input-number v-model="form.entry_coil_thickness" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="来料宽度[mm]">
|
||||||
|
<el-input-number v-model="form.entry_coil_width" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="来料内径[mm]">
|
||||||
|
<el-input-number v-model="form.entry_of_coil_inner_diameter" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="来料外径[mm]">
|
||||||
|
<el-input-number v-model="form.entry_of_coil_outer_diameter" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="来料长度[mm]">
|
||||||
|
<el-input-number v-model="form.entry_of_coil_length" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="来料重量[kg]">
|
||||||
|
<el-input-number v-model="form.entry_coil_weight" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="来料凸度">
|
||||||
|
<el-input-number v-model="form.crown_average" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<!-- 右列：钢种和订单信息 -->
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="来料钢种">
|
||||||
|
<el-select v-model="form.steel_grade" placeholder="请选择来料钢种" clearable filterable style="width:200px">
|
||||||
<el-option v-for="g in entryGrades" :key="g" :label="g" :value="g" />
|
<el-option v-for="g in entryGrades" :key="g" :label="g" :value="g" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item></el-col>
|
</el-form-item>
|
||||||
|
<el-form-item label="钢卷状态">
|
||||||
|
<el-select v-model="form.status" placeholder="请选择钢卷状态" style="width:200px">
|
||||||
|
<el-option label="计划" :value="0" />
|
||||||
|
<el-option label="鞍座" :value="1" />
|
||||||
|
<el-option label="开卷" :value="2" />
|
||||||
|
<el-option label="完成" :value="3" />
|
||||||
|
<el-option label="焊接" :value="4" />
|
||||||
|
<el-option label="待轧" :value="5" />
|
||||||
|
<el-option label="轧制" :value="6" />
|
||||||
|
<el-option label="拒绝" :value="9" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="成品钢种">
|
||||||
|
<el-select v-model="form.sg_sign" placeholder="请选择成品钢种" clearable filterable style="width:200px">
|
||||||
|
<el-option v-for="g in productGrades" :key="g" :label="g" :value="g" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="订单厚度[mm]">
|
||||||
|
<el-input-number v-model="form.order_thickness" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="订单宽度[mm]">
|
||||||
|
<el-input-number v-model="form.order_width" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="屈服强度[MPa]">
|
||||||
|
<el-input-number v-model="form.material_yield_point" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="焊接代码">
|
||||||
|
<el-input v-model="form.welding_code" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="是否切边">
|
||||||
|
<el-select v-model="form.trimming" placeholder="请选择" style="width:200px">
|
||||||
|
<el-option label="切边" :value="1" />
|
||||||
|
<el-option label="不切边" :value="0" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="切边后宽度[mm]">
|
||||||
|
<el-input-number v-model="form.trimming_width" :precision="3" :controls="false" style="width:200px" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<div class="section-title">主数据</div>
|
||||||
|
<el-row :gutter="14">
|
||||||
<el-col :span="12"><el-form-item label="二级模型钢种">
|
<el-col :span="12"><el-form-item label="二级模型钢种">
|
||||||
<el-select v-model="form.l2_grade" placeholder="请选择二级模型钢种" clearable filterable style="width:100%">
|
<el-select v-model="form.l2_grade" placeholder="请选择二级模型钢种" clearable filterable style="width:200px">
|
||||||
<el-option v-for="g in l2ModelGrades" :key="g" :label="g" :value="g" />
|
<el-option v-for="g in l2ModelGrades" :key="g" :label="g" :value="g" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="12"><el-form-item label="合同号">
|
<el-col :span="12"><el-form-item label="分卷模式">
|
||||||
<el-input v-model="form.work_order_no" />
|
<el-select v-model="form.slitting_mode" placeholder="请选择分卷模式" style="width:200px">
|
||||||
</el-form-item></el-col>
|
<el-option label="不分卷" :value="0" />
|
||||||
<el-col :span="12"><el-form-item label="成品钢种">
|
<el-option label="分卷" :value="1" />
|
||||||
<el-select v-model="form.sg_sign" placeholder="请选择成品钢种" clearable filterable style="width:100%">
|
|
||||||
<el-option v-for="g in productGrades" :key="g" :label="g" :value="g" />
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12"><el-form-item label="成品重量">
|
||||||
<el-form-item label="包装类型">
|
<el-input-number v-model="form.exit_coil_weight" :precision="3" :controls="false" style="width:200px" />
|
||||||
<el-input v-model="form.packing_type_code" />
|
<span style="margin-left:8px;color:#666;">千克</span>
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="卷筒直径">
|
|
||||||
<el-input-number v-model="form.coiler_diameter" :controls="false" style="width:100%" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="重量模式">
|
|
||||||
<el-input v-model="form.weight_mode" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="订单质量">
|
|
||||||
<el-input v-model="form.order_quality" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
|
|
||||||
<div class="section-title">入口参数</div>
|
|
||||||
<el-row :gutter="14">
|
|
||||||
<el-col :span="8"><el-form-item label="厚度(mm)">
|
|
||||||
<el-input-number v-model="form.entry_coil_thickness" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="8"><el-form-item label="厚度最大">
|
<el-col :span="12"><el-form-item label="成品卷号">
|
||||||
<el-input-number v-model="form.entry_coil_thickness_max" :precision="3" :controls="false"
|
<el-input v-model="form.exit_coil_no" style="width:200px" />
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="8"><el-form-item label="厚度最小">
|
<el-col :span="12"><el-form-item label="成品厚度">
|
||||||
<el-input-number v-model="form.entry_coil_thickness_min" :precision="3" :controls="false"
|
<el-input-number v-model="form.exit_coil_thickness" :precision="3" :controls="false" style="width:200px" />
|
||||||
style="width:100%" />
|
<span style="margin-left:8px;color:#666;">毫米</span>
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="8"><el-form-item label="宽度(mm)">
|
<el-col :span="12"><el-form-item label="成品宽度">
|
||||||
<el-input-number v-model="form.entry_coil_width" :precision="3" :controls="false"
|
<el-input-number v-model="form.exit_coil_width" :precision="3" :controls="false" style="width:200px" />
|
||||||
style="width:100%" />
|
<span style="margin-left:8px;color:#666;">毫米</span>
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="8"><el-form-item label="宽度最大">
|
<el-col :span="12"><el-form-item label="成品套筒">
|
||||||
<el-input-number v-model="form.entry_coil_width_max" :precision="3" :controls="false"
|
<el-input v-model="form.sleeve_code_of_cold_coil" placeholder="例如：无套筒" style="width:200px" />
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="8"><el-form-item label="宽度最小">
|
<el-col :span="12"><el-form-item label="成品卷芯">
|
||||||
<el-input-number v-model="form.entry_coil_width_min" :precision="3" :controls="false"
|
<el-input-number v-model="form.coiler_diameter" :precision="3" :controls="false" style="width:200px" />
|
||||||
style="width:100%" />
|
<span style="margin-left:8px;color:#666;">毫米</span>
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="8"><el-form-item label="重量(kg)">
|
<el-col :span="12"><el-form-item label="包装类型">
|
||||||
<el-input-number v-model="form.entry_coil_weight" :precision="3" :controls="false"
|
<el-input v-model="form.packing_type_code" placeholder="例如：裸包A01" style="width:200px" />
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
</el-form-item></el-col>
|
||||||
<el-col :span="8"><el-form-item label="长度(m)">
|
|
||||||
<el-input-number v-model="form.entry_of_coil_length" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="外径(mm)">
|
|
||||||
<el-input-number v-model="form.entry_of_coil_outer_diameter" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
</el-row>
|
|
||||||
|
|
||||||
<div class="section-title">出口 / 订单参数</div>
|
|
||||||
<el-row :gutter="14">
|
|
||||||
<el-col :span="8"><el-form-item label="出口卷号">
|
|
||||||
<el-input v-model="form.exit_coil_no" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="出口厚度(mm)">
|
|
||||||
<el-input-number v-model="form.exit_coil_thickness" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="出口宽度(mm)">
|
|
||||||
<el-input-number v-model="form.exit_coil_width" :precision="3" :controls="false" style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="出口重量(kg)">
|
|
||||||
<el-input-number v-model="form.exit_coil_weight" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="订单厚度(mm)">
|
|
||||||
<el-input-number v-model="form.order_thickness" :precision="3" :controls="false" style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="订单宽度(mm)">
|
|
||||||
<el-input-number v-model="form.order_width" :precision="3" :controls="false" style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
</el-row>
|
|
||||||
|
|
||||||
<div class="section-title">张力参数</div>
|
|
||||||
<el-row :gutter="14">
|
|
||||||
<el-col :span="8"><el-form-item label="开卷张力(kN)">
|
|
||||||
<el-input-number v-model="form.uncoiler_tension" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="活套1张力(kN)">
|
|
||||||
<el-input-number v-model="form.looper_tension_1" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="平整张力(kN)">
|
|
||||||
<el-input-number v-model="form.pl_tension" :precision="3" :controls="false" style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="活套2张力(kN)">
|
|
||||||
<el-input-number v-model="form.looper_tension_2" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
<el-col :span="8"><el-form-item label="活套3张力(kN)">
|
|
||||||
<el-input-number v-model="form.looper_tension_3" :precision="3" :controls="false"
|
|
||||||
style="width:100%" />
|
|
||||||
</el-form-item></el-col>
|
|
||||||
</el-row>
|
|
||||||
|
|
||||||
<div class="section-title">化学成分 (%)</div>
|
|
||||||
<el-row :gutter="14">
|
|
||||||
<el-col :span="6" v-for="el in chemElements" :key="el">
|
|
||||||
<el-form-item :label="el.toUpperCase()" label-width="60px">
|
|
||||||
<el-input-number v-model="form[el]" :precision="3" :controls="false" style="width:100%" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
</el-form>
|
</el-form>
|
||||||
@@ -258,20 +241,17 @@
|
|||||||
import { pdiApi, syncApi, gradeApi } from '../api/index'
|
import { pdiApi, syncApi, gradeApi } from '../api/index'
|
||||||
|
|
||||||
const EMPTY = () => ({
|
const EMPTY = () => ({
|
||||||
coilid: '', rollprogramnb: null, sequencenb: null,
|
rollprogramnb: null, sequencenb: null,
|
||||||
schedule_code: '', steel_grade: '', l2_grade: '',
|
status: 0, schedule_code: '', coilid: '', next_process_code: '', steel_grade: '', l2_grade: '',
|
||||||
work_order_no: '', order_quality: '', sg_sign: '',
|
sg_sign: '', packing_type_code: '', coiler_diameter: null,
|
||||||
packing_type_code: '', coiler_diameter: null, weight_mode: '',
|
entry_coil_thickness: null, entry_coil_width: null,
|
||||||
entry_coil_thickness: null, entry_coil_thickness_max: null, entry_coil_thickness_min: null,
|
entry_of_coil_inner_diameter: null, entry_of_coil_outer_diameter: null,
|
||||||
entry_coil_width: null, entry_coil_width_max: null, entry_coil_width_min: null,
|
entry_of_coil_length: null, entry_coil_weight: null, crown_average: null,
|
||||||
entry_coil_weight: null, entry_of_coil_length: null, entry_of_coil_outer_diameter: null,
|
order_thickness: null, order_width: null, material_yield_point: null,
|
||||||
exit_coil_no: '', exit_coil_thickness: null, exit_coil_width: null, exit_coil_weight: null,
|
welding_code: '', trimming: 0, trimming_width: null,
|
||||||
order_thickness: null, order_width: null,
|
exit_coil_weight: null, exit_coil_no: '',
|
||||||
uncoiler_tension: null, looper_tension_1: null, pl_tension: null,
|
exit_coil_thickness: null, exit_coil_width: null,
|
||||||
looper_tension_2: null, looper_tension_3: null,
|
sleeve_code_of_cold_coil: '', work_order_no: '', order_quality: ''
|
||||||
c: null, si: null, mn: null, p: null, s: null, cu: null,
|
|
||||||
ni: null, cr: null, mo: null, v: null, ti: null, sol_al: null,
|
|
||||||
nb: null, n: null, b: null, fe: null
|
|
||||||
})
|
})
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@@ -295,9 +275,11 @@ export default {
|
|||||||
autoRefreshTimer: null, // 定时器句柄
|
autoRefreshTimer: null, // 定时器句柄
|
||||||
autoRefreshCountdown: 0, // 倒计时秒数
|
autoRefreshCountdown: 0, // 倒计时秒数
|
||||||
rules: {
|
rules: {
|
||||||
coilid: [
|
rollprogramnb: [
|
||||||
{ required: true, message: '卷号不能为空', trigger: 'blur' },
|
{ required: true, message: '批次编号不能为空', trigger: 'blur' }
|
||||||
{ min: 12, max: 12, message: '卷号必须为12位', trigger: 'blur' }
|
],
|
||||||
|
sequencenb: [
|
||||||
|
{ required: true, message: '顺序不能为空', trigger: 'blur' }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
chemElements: ['c', 'si', 'mn', 'p', 's', 'cu', 'ni', 'cr', 'mo', 'v', 'ti', 'sol_al', 'nb', 'n', 'b', 'fe'],
|
chemElements: ['c', 'si', 'mn', 'p', 's', 'cu', 'ni', 'cr', 'mo', 'v', 'ti', 'sol_al', 'nb', 'n', 'b', 'fe'],
|
||||||
@@ -555,5 +537,12 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
.section-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
margin: 20px 0 15px 0;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
border-bottom: 2px solid #409EFF;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in New Issue
Block a user