fix(entry): 恢复入口跟踪全部设备工位,修复鞍座联动状态竞争
- 还原入口跟踪原有设备网格(2行):上卷小车/称重位/地辊/倒卷小车,仅上卷鞍座保留一个 - 移动可在所有入口设备间进行,仅「上卷鞍座」进入生产环节 - 修复 ensure_online 误将鞍座暂存计划回退导致卡死:移动到鞍座直接置生产中, ensure_online 排除 on_saddle 计划 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="entry-page">
|
||||
|
||||
<!-- ─── 上卷鞍座(单个生产工位)─── -->
|
||||
<!-- ─── 上卷鞍座(唯一进入生产的工位)─── -->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
上卷鞍座
|
||||
@@ -11,7 +11,6 @@
|
||||
<button class="btn btn-outline" @click="refreshAll">刷新</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="card-body">
|
||||
<div v-if="saddle" class="saddle-station">
|
||||
<div class="saddle-info">
|
||||
@@ -22,7 +21,6 @@
|
||||
<div class="si-row"><span class="si-k">来料重量[t]</span><span class="si-v">{{ fmt(saddle.incoming_weight, 3) }}</span></div>
|
||||
<div class="si-row"><span class="si-k">轧制模式</span><span class="si-v">{{ saddle.rolling_mode || '—' }}</span></div>
|
||||
</div>
|
||||
|
||||
<div class="saddle-run">
|
||||
<div class="metric-box">
|
||||
<span class="mb-label">线速度</span>
|
||||
@@ -42,38 +40,42 @@
|
||||
<div class="prog-bar-wrap" style="height:10px;">
|
||||
<div class="prog-bar-fill" :style="{ width: progPct(saddle) + '%', background: progColor(saddle) }"></div>
|
||||
</div>
|
||||
<div class="rp-tip">
|
||||
<template v-if="saddle.status === 'producing'">带头到达 {{ TARGET }} m 后自动产出实绩并完成</template>
|
||||
<template v-else>已在鞍座,等待速度信号;可点「投入生产」手动开始</template>
|
||||
</div>
|
||||
<div class="rp-tip">带头到达 {{ TARGET }} m 后自动产出实绩并完成;下一卷需从队列再次「移动」到鞍座</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-else class="saddle-empty">
|
||||
上卷鞍座空闲 — 从队列点击「移动」,在弹窗中选择「上卷鞍座」即可开始生产
|
||||
上卷鞍座空闲 — 点击计划「移动」并选择「上卷鞍座」即可上卷生产
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ─── 入口位置图 ─── -->
|
||||
<!-- ─── 入口跟踪设备位置 ─── -->
|
||||
<div class="card">
|
||||
<div class="card-header">入口位置 <span class="ch-badge">{{ positions.length }} 个工位</span></div>
|
||||
<div class="card-body">
|
||||
<div class="pos-grid">
|
||||
<div class="card-header">入口跟踪 <span class="ch-badge">{{ equipCols.length }} × 2 工位</span></div>
|
||||
<div class="entry-grid">
|
||||
<div v-for="(row, ri) in equipRows" :key="ri" class="entry-row">
|
||||
<div
|
||||
v-for="pos in positions"
|
||||
v-for="pos in row"
|
||||
:key="pos"
|
||||
:class="['pos-cell', { saddle: pos === SADDLE, filled: !!occupantOf(pos) }]"
|
||||
:class="['pos-cell', { filled: !!occupantOf(pos) }]"
|
||||
>
|
||||
<div class="pos-title">{{ pos }}<span v-if="pos === SADDLE" class="pos-tag">生产</span></div>
|
||||
<div v-if="occupantOf(pos)" class="pos-occ">
|
||||
<div class="po-coil">{{ occupantOf(pos).cold_coil_no || occupantOf(pos).plan_no }}</div>
|
||||
<div class="po-sub">{{ occupantOf(pos).steel_grade || '—' }}</div>
|
||||
<div class="po-sub">{{ fmt(occupantOf(pos).product_thickness, 2) }}×{{ fmt(occupantOf(pos).product_width, 0) }}</div>
|
||||
<span :class="['badge', badgeOf(occupantOf(pos).status)]" style="margin-top:3px;">{{ statusLabel(occupantOf(pos).status) }}</span>
|
||||
<div class="pos-title">{{ pos }}</div>
|
||||
<table class="pos-table">
|
||||
<tbody>
|
||||
<tr><td class="k">冷卷号</td><td class="v">{{ occ(pos,'cold_coil_no') }}</td></tr>
|
||||
<tr><td class="k">热卷号</td><td class="v">{{ occ(pos,'hot_coil_no') }}</td></tr>
|
||||
<tr><td class="k">钢种</td><td class="v">{{ occ(pos,'steel_grade') }}</td></tr>
|
||||
<tr><td class="k">来料厚[mm]</td><td class="v">{{ occNum(pos,'incoming_thickness',2) }}</td></tr>
|
||||
<tr><td class="k">成品厚[mm]</td><td class="v">{{ occNum(pos,'product_thickness',2) }}</td></tr>
|
||||
<tr><td class="k">成品宽[mm]</td><td class="v">{{ occNum(pos,'product_width',0) }}</td></tr>
|
||||
<tr><td class="k">来料重[t]</td><td class="v">{{ occNum(pos,'incoming_weight',3) }}</td></tr>
|
||||
<tr><td class="k">轧制模式</td><td class="v">{{ occ(pos,'rolling_mode') }}</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div v-if="occupantOf(pos)" class="pos-act">
|
||||
<span class="action-link" @click="openMove(occupantOf(pos))">移动</span>
|
||||
</div>
|
||||
<div v-else class="pos-empty">空</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -116,13 +118,13 @@
|
||||
|
||||
<!-- ─── 移动-位置选择弹窗 ─── -->
|
||||
<div v-if="moveDialog.visible" class="modal-mask" @click.self="moveDialog.visible=false">
|
||||
<div class="modal-box" style="width:480px;">
|
||||
<div class="modal-box" style="width:520px;">
|
||||
<div class="modal-header">
|
||||
移动计划 — {{ moveDialog.plan && (moveDialog.plan.cold_coil_no || moveDialog.plan.plan_no) }}
|
||||
<span class="modal-close" @click="moveDialog.visible=false">✕</span>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="kv-label" style="margin-bottom:8px;">选择目标位置(只有「上卷鞍座」会触发生产)</div>
|
||||
<div class="kv-label" style="margin-bottom:8px;">选择目标位置(只有「上卷鞍座」会进入生产环节)</div>
|
||||
<div class="pos-pick">
|
||||
<span
|
||||
v-for="pos in positions"
|
||||
@@ -147,20 +149,19 @@ import { getPlans, getSaddle, movePlan, commitProducing } from '@/api'
|
||||
const STATUS_LABEL = { ready: '准备好', online: '在线', producing: '生产中', produced: '生产完成' }
|
||||
const STATUS_BADGE = { ready: 'badge-gray', online: 'badge-green', producing: 'badge-yellow', produced: 'badge-blue' }
|
||||
const SADDLE = '上卷鞍座'
|
||||
const POSITIONS = [
|
||||
'1#上卷小车', '2#上卷小车',
|
||||
'1#称重位', '2#称重位',
|
||||
'1#地辊', '2#地辊',
|
||||
'1#倒卷小车', '2#倒卷小车',
|
||||
SADDLE,
|
||||
const EQUIP_ROWS = [
|
||||
['1#上卷小车', '1#称重位', '1#地辊', '1#倒卷小车'],
|
||||
['2#上卷小车', '2#称重位', '2#地辊', '2#倒卷小车'],
|
||||
]
|
||||
const POSITIONS = [...EQUIP_ROWS[0], ...EQUIP_ROWS[1], SADDLE]
|
||||
const TARGET = 2000
|
||||
|
||||
export default {
|
||||
name: 'EntryTracking',
|
||||
data() {
|
||||
return {
|
||||
plans: [], saddle: null, TARGET, SADDLE, positions: POSITIONS,
|
||||
plans: [], saddle: null, TARGET, SADDLE,
|
||||
positions: POSITIONS, equipRows: EQUIP_ROWS, equipCols: EQUIP_ROWS[0],
|
||||
timer: null, fastTimer: null, moving: false,
|
||||
moveDialog: { visible: false, plan: null, target: '' },
|
||||
}
|
||||
@@ -198,12 +199,11 @@ export default {
|
||||
progPct(p) { return Math.max(0, Math.min(100, (p.run_length_m || 0) / TARGET * 100)) },
|
||||
progColor(p) { return this.progPct(p) >= 100 ? 'var(--accent-green)' : 'var(--sms-teal)' },
|
||||
occupantOf(pos) {
|
||||
if (pos === SADDLE) return this.saddle || this.plans.find(p => p.on_saddle === 1) || null
|
||||
return this.plans.find(p => p.position === pos && p.on_saddle !== 1) || null
|
||||
},
|
||||
openMove(plan) {
|
||||
this.moveDialog = { visible: true, plan, target: plan.position || '' }
|
||||
},
|
||||
occ(pos, key) { const p = this.occupantOf(pos); return p ? (p[key] || '—') : '' },
|
||||
occNum(pos, key, n) { const p = this.occupantOf(pos); return p && p[key] != null ? Number(p[key]).toFixed(n) : '' },
|
||||
openMove(plan) { this.moveDialog = { visible: true, plan, target: plan.position || '' } },
|
||||
async confirmMove() {
|
||||
const { plan, target } = this.moveDialog
|
||||
if (!target) return
|
||||
@@ -244,7 +244,6 @@ export default {
|
||||
.si-row { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; padding: 3px 0; }
|
||||
.si-k { color: $text-muted; }
|
||||
.si-v { color: $text-primary; font-family: $font-mono; font-weight: 600; &.hl { color: $sms-teal; } }
|
||||
|
||||
.saddle-run { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-content: start; }
|
||||
.saddle-run .metric-box { min-width: 0; }
|
||||
.run-prog { grid-column: 1 / -1; }
|
||||
@@ -253,20 +252,25 @@ export default {
|
||||
.rp-tip { font-size: 11px; color: $text-muted; margin-top: 6px; }
|
||||
.saddle-empty { text-align: center; padding: 30px; color: $text-muted; font-size: 13px; }
|
||||
|
||||
// ── 位置图 ──
|
||||
.pos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
|
||||
// ── 入口设备网格(恢复原布局,2 行)──
|
||||
.entry-grid { padding: 10px; display: flex; flex-direction: column; gap: 8px; overflow-x: auto; }
|
||||
.entry-row { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 8px; }
|
||||
.pos-cell {
|
||||
background: $bg-panel; border: 1px solid $border; border-radius: 6px; padding: 8px; min-height: 110px;
|
||||
background: $bg-panel; border: 1px solid $border; border-radius: 4px; padding: 4px 6px 6px; min-height: 200px;
|
||||
display: flex; flex-direction: column;
|
||||
&.filled { border-color: $sms-teal; background: rgba($sms-teal, .04); }
|
||||
&.saddle { border-style: dashed; border-color: $accent-yellow;
|
||||
&.filled { border-style: solid; border-color: $accent-yellow; background: rgba($accent-yellow, .06); } }
|
||||
}
|
||||
.pos-title { font-size: 11.5px; font-weight: 700; color: $text-primary; padding-bottom: 5px; border-bottom: 1px dashed $border; margin-bottom: 6px; display: flex; justify-content: space-between; }
|
||||
.pos-tag { font-size: 9px; color: $accent-yellow; border: 1px solid rgba($accent-yellow, .5); border-radius: 2px; padding: 0 4px; }
|
||||
.pos-occ { display: flex; flex-direction: column; gap: 2px; }
|
||||
.po-coil { font-family: $font-mono; font-weight: 700; color: $sms-teal; font-size: 12.5px; }
|
||||
.po-sub { font-size: 11px; color: $text-secondary; }
|
||||
.pos-empty { color: $text-muted; font-size: 12px; text-align: center; padding-top: 16px; }
|
||||
.pos-title {
|
||||
text-align: center; font-size: 11.5px; font-weight: 700; color: $text-primary;
|
||||
padding: 3px 0 5px; border-bottom: 1px dashed $border; margin-bottom: 4px; letter-spacing: .3px;
|
||||
}
|
||||
.pos-table {
|
||||
width: 100%; border-collapse: collapse; font-size: 10.5px; line-height: 1.5; flex: 1;
|
||||
td { padding: 1px 2px; vertical-align: top; white-space: nowrap; }
|
||||
td.k { color: $text-muted; text-align: right; width: 52%; font-size: 10px; }
|
||||
td.v { color: $sms-teal; text-align: right; font-family: $font-mono; font-weight: 600; }
|
||||
}
|
||||
.pos-act { text-align: center; padding-top: 4px; border-top: 1px dashed $border; }
|
||||
|
||||
.action-link { color: $accent-green; cursor: pointer; font-size: 12px; &:hover { text-decoration: underline; } }
|
||||
|
||||
@@ -280,7 +284,6 @@ export default {
|
||||
&.saddle { grid-column: 1 / -1; border-style: dashed; border-color: $accent-yellow; color: $accent-yellow;
|
||||
&.active { color: #fff; background: $accent-yellow; border-style: solid; } }
|
||||
}
|
||||
|
||||
.modal-mask { position: fixed; inset: 0; background: rgba(0,0,0,.6); display: flex; align-items: center; justify-content: center; z-index: 9999; }
|
||||
.modal-box { background: $bg-card; border: 1px solid $border; border-radius: 6px; max-width: 95vw; max-height: 90vh; display: flex; flex-direction: column; }
|
||||
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: $bg-panel; border-bottom: 1px solid $border; font-size: 13px; font-weight: 600; color: $sms-highlight; .modal-close { cursor: pointer; color: $text-muted; &:hover { color: $text-primary; } } }
|
||||
|
||||
Reference in New Issue
Block a user