244 lines
11 KiB
Vue
244 lines
11 KiB
Vue
<template>
|
||
<div class="app-container acid-op-page">
|
||
<el-row :gutter="16">
|
||
|
||
<!-- 左侧：操作表单 + 历史记录 -->
|
||
<el-col :span="15">
|
||
|
||
<div class="op-card">
|
||
<div class="op-header">
|
||
<span class="op-title">双机架工序录入</span>
|
||
<el-tag size="mini" type="info" style="margin-left:8px">actionType = 504</el-tag>
|
||
</div>
|
||
|
||
<el-form ref="form" :model="form" :rules="rules" label-width="110px" size="small">
|
||
<el-row :gutter="16">
|
||
<el-col :span="12">
|
||
<el-form-item label="入场钢卷号" prop="enterCoilNo">
|
||
<el-input v-model="form.enterCoilNo" placeholder="回车自动查询"
|
||
clearable @keyup.enter.native="onEnterCoilInput" @blur="onEnterCoilInput" @clear="clearCoilInfo" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="出口钢卷号" prop="currentCoilNo">
|
||
<el-input v-model="form.currentCoilNo" placeholder="请输入出口钢卷号" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-divider content-position="left" style="margin:8px 0 12px">出口实绩</el-divider>
|
||
|
||
<el-row :gutter="16">
|
||
<el-col :span="8">
|
||
<el-form-item label="出口厚度(mm)" prop="exitThickness">
|
||
<el-input-number v-model="form.exitThickness" :precision="3" :min="0"
|
||
:controls="false" style="width:100%" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<el-form-item label="出口宽度(mm)" prop="exitWidth">
|
||
<el-input-number v-model="form.exitWidth" :precision="1" :min="0"
|
||
:controls="false" style="width:100%" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<el-form-item label="出口长度(m)">
|
||
<el-input-number v-model="form.exitLength" :precision="1" :min="0"
|
||
:controls="false" style="width:100%" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="16">
|
||
<el-col :span="8">
|
||
<el-form-item label="入口重量(t)">
|
||
<el-input-number v-model="form.entryWeight" :precision="3" :min="0"
|
||
:controls="false" style="width:100%" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<el-form-item label="出口重量(t)">
|
||
<el-input-number v-model="form.exitWeight" :precision="3" :min="0"
|
||
:controls="false" style="width:100%" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<el-form-item label="工艺编码">
|
||
<el-input v-model="form.processCode" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="16">
|
||
<el-col :span="8">
|
||
<el-form-item label="班组">
|
||
<el-select v-model="form.team" placeholder="请选择" style="width:100%" clearable>
|
||
<el-option label="甲班" value="甲" />
|
||
<el-option label="乙班" value="乙" />
|
||
<el-option label="丙班" value="丙" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="16">
|
||
<el-form-item label="备注">
|
||
<el-input v-model="form.remark" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<div style="text-align:right;padding-top:4px">
|
||
<el-button @click="resetForm">重置</el-button>
|
||
<el-button type="primary" :loading="submitting" @click="submitForm">
|
||
新增录入（同步创建计划）
|
||
</el-button>
|
||
</div>
|
||
</el-form>
|
||
</div>
|
||
|
||
<!-- 历史 -->
|
||
<div class="op-card" style="margin-top:12px">
|
||
<div class="op-header">
|
||
<span class="op-title">最近录入记录</span>
|
||
<el-button size="mini" icon="el-icon-refresh" style="margin-left:auto" @click="loadHistory">刷新</el-button>
|
||
</div>
|
||
<el-table v-loading="historyLoading" :data="historyList" size="mini" border style="width:100%">
|
||
<el-table-column prop="enterCoilNo" label="入场钢卷号" min-width="120" show-overflow-tooltip />
|
||
<el-table-column prop="currentCoilNo" label="出口钢卷号" min-width="120" show-overflow-tooltip />
|
||
<el-table-column prop="exitThickness" label="出口厚(mm)" width="90" align="right" />
|
||
<el-table-column prop="exitWidth" label="出口宽(mm)" width="90" align="right" />
|
||
<el-table-column prop="exitLength" label="长度(m)" width="80" align="right" />
|
||
<el-table-column prop="entryWeight" label="入口重(t)" width="80" align="right" />
|
||
<el-table-column prop="team" label="班组" width="60" align="center" />
|
||
<el-table-column prop="createTime" label="录入时间" width="150" />
|
||
</el-table>
|
||
<pagination v-show="historyTotal > 0" :total="historyTotal"
|
||
:page.sync="historyQuery.pageNum" :limit.sync="historyQuery.pageSize"
|
||
@pagination="loadHistory" style="margin-top:6px" />
|
||
</div>
|
||
</el-col>
|
||
|
||
<!-- 右侧：WMS 钢卷信息 -->
|
||
<el-col :span="9">
|
||
<div class="op-card">
|
||
<div class="op-header"><span class="op-title">WMS 钢卷信息</span></div>
|
||
<template v-if="coilInfo">
|
||
<el-descriptions :column="1" size="mini" border style="margin-top:8px">
|
||
<el-descriptions-item label="入场钢卷号">{{ coilInfo.enterCoilNo }}</el-descriptions-item>
|
||
<el-descriptions-item label="当前钢卷号">{{ coilInfo.currentCoilNo }}</el-descriptions-item>
|
||
<el-descriptions-item label="实际厚度">{{ coilInfo.actualThickness }} mm</el-descriptions-item>
|
||
<el-descriptions-item label="实际宽度">{{ coilInfo.actualWidth }} mm</el-descriptions-item>
|
||
<el-descriptions-item label="净重">{{ coilInfo.netWeight }} t</el-descriptions-item>
|
||
<el-descriptions-item label="长度">{{ coilInfo.length }} m</el-descriptions-item>
|
||
<el-descriptions-item label="质量状态">{{ coilInfo.qualityStatus }}</el-descriptions-item>
|
||
<el-descriptions-item label="物料类型">{{ coilInfo.materialType }}</el-descriptions-item>
|
||
</el-descriptions>
|
||
<el-button size="mini" type="primary" style="margin-top:8px" @click="applyCoilFill">
|
||
写入表单
|
||
</el-button>
|
||
</template>
|
||
<div v-else style="text-align:center;color:#aaa;padding:40px 0">
|
||
输入入场钢卷号后自动查询
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
|
||
</el-row>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { addCoilWarehouseOperationLog, listCoilWarehouseOperationLog } from '@/api/wms/coilWarehouseOperationLog'
|
||
import { queryCoilByNo, addDrPlan } from '@/api/wms/drMill'
|
||
|
||
export default {
|
||
name: 'DrNormal',
|
||
data() {
|
||
return {
|
||
form: this.defaultForm(),
|
||
rules: {
|
||
enterCoilNo: [{ required: true, message: '入场钢卷号不能为空', trigger: 'blur' }],
|
||
},
|
||
submitting: false,
|
||
coilInfo: null,
|
||
historyLoading: false,
|
||
historyList: [],
|
||
historyTotal: 0,
|
||
historyQuery: { pageNum: 1, pageSize: 10, actionType: 504 },
|
||
}
|
||
},
|
||
created() { this.loadHistory() },
|
||
methods: {
|
||
defaultForm() {
|
||
return {
|
||
enterCoilNo: '', currentCoilNo: '',
|
||
exitThickness: undefined, exitWidth: undefined, exitLength: undefined,
|
||
entryWeight: undefined, exitWeight: undefined,
|
||
processCode: '', team: undefined, remark: '',
|
||
actionType: 504,
|
||
}
|
||
},
|
||
onEnterCoilInput() {
|
||
const v = (this.form.enterCoilNo || '').trim()
|
||
if (!v) return
|
||
queryCoilByNo(v).then(res => {
|
||
this.coilInfo = res.data || null
|
||
}).catch(() => { this.coilInfo = null })
|
||
},
|
||
clearCoilInfo() { this.coilInfo = null },
|
||
applyCoilFill() {
|
||
if (!this.coilInfo) return
|
||
if (this.coilInfo.actualThickness) this.form.exitThickness = parseFloat(this.coilInfo.actualThickness)
|
||
if (this.coilInfo.actualWidth) this.form.exitWidth = parseFloat(this.coilInfo.actualWidth)
|
||
if (this.coilInfo.netWeight) this.form.entryWeight = parseFloat(this.coilInfo.netWeight)
|
||
if (this.coilInfo.length) this.form.exitLength = parseFloat(this.coilInfo.length)
|
||
this.$message.success('钢卷数据已写入表单')
|
||
},
|
||
submitForm() {
|
||
this.$refs.form.validate(valid => {
|
||
if (!valid) return
|
||
this.submitting = true
|
||
addCoilWarehouseOperationLog({ ...this.form }).then(() => {
|
||
// 同步创建双机架生产计划
|
||
return addDrPlan({
|
||
inMatNo: this.form.enterCoilNo,
|
||
enterCoilNo: this.form.enterCoilNo,
|
||
currentCoilNo: this.form.currentCoilNo,
|
||
inMatThick: this.coilInfo ? this.coilInfo.actualThickness : undefined,
|
||
inMatWidth: this.coilInfo ? this.coilInfo.actualWidth : undefined,
|
||
inMatWeight: this.coilInfo ? this.coilInfo.netWeight : undefined,
|
||
inMatLength: this.coilInfo ? this.coilInfo.length : undefined,
|
||
outThick: this.form.exitThickness,
|
||
remark: this.form.remark,
|
||
})
|
||
}).then(() => {
|
||
this.$modal.msgSuccess('录入成功，已同步创建双机架计划')
|
||
this.resetForm()
|
||
this.loadHistory()
|
||
}).catch(err => {
|
||
this.$modal.msgError('操作失败: ' + (err.message || ''))
|
||
}).finally(() => { this.submitting = false })
|
||
})
|
||
},
|
||
resetForm() {
|
||
this.form = this.defaultForm()
|
||
this.coilInfo = null
|
||
this.$nextTick(() => this.$refs.form && this.$refs.form.clearValidate())
|
||
},
|
||
loadHistory() {
|
||
this.historyLoading = true
|
||
listCoilWarehouseOperationLog(this.historyQuery).then(res => {
|
||
this.historyList = res.rows || []
|
||
this.historyTotal = res.total || 0
|
||
}).finally(() => { this.historyLoading = false })
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.acid-op-page { background: #f5f7fa; }
|
||
.op-card { background: #fff; border: 1px solid #e4e7ed; border-radius: 4px; padding: 16px; }
|
||
.op-header { display: flex; align-items: center; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 2px solid #409eff; }
|
||
.op-title { font-size: 15px; font-weight: 600; color: #303133; }
|
||
</style>
|