写入功能完成

This commit is contained in:
2026-01-02 17:15:26 +08:00
parent fd890611c8
commit ccbf3d4e90
5 changed files with 273 additions and 244 deletions

View File

@@ -21,8 +21,8 @@
<div v-loading="loading" class="card-grid-container">
<el-row :gutter="20">
<el-col
v-for="plan in plans"
:key="plan.id"
v-for="setup in setups"
:key="setup.ID"
:xs="24"
:sm="12"
:md="8"
@@ -30,21 +30,38 @@
>
<el-card class="parameter-card" shadow="hover">
<div slot="header" class="card-header">
<!-- Steel Grade only / 只展示钢种不展示计划 -->
<span class="card-title">Steel Grade: {{ plan.steelGrade || '-' }}</span>
<div class="card-header-content">
<!-- 头部信息参考 setup/panels 卡片表头多字段拼接的风格 -->
<div class="card-title-row">
<span class="card-title">
Plan ID: {{ setup.planid || '-' }}
| Coil ID: {{ setup.coilid || '-' }}
| Steel Grade: {{ setup.steelGrade || setup.grade || '-' }}
</span>
</div>
<div class="card-subtitle">
<span>Entry Thickness: {{ setup.entryThick || '-' }}</span>
<span>Entry Width: {{ setup.entryWidth || '-' }}</span>
<span>Entry Weight: {{ setup.entryWeight || '-' }}</span>
<span>Entry Length: {{ setup.entryLength || '-' }}</span>
</div>
<div class="card-subtitle">
<span>TL Elongation: {{ setup.tlElong || '-' }}</span>
<span>TM Roll Force: {{ setup.tmRollforce || '-' }}</span>
<span>TM Bending Force: {{ setup.tmBendforce || '-' }}</span>
<span v-if="setup.updateTime">Updated: {{ formatTime(setup.updateTime) }}</span>
</div>
</div>
<div class="header-right">
<span v-if="lastSuccess && lastSuccess.lastSendTime" class="last-send-time">
<i class="el-icon-time"></i>
Last Sent: {{ formatTime(lastSuccess.lastSendTime) }}
</span>
<el-button
type="primary"
size="mini"
icon="el-icon-s-promotion"
@click="handleSend(plan)"
:loading="plan.sending"
@click="handleSend(setup)"
:loading="setup.sending"
>
Send
</el-button>
@@ -52,8 +69,8 @@
</div>
<div class="card-body">
<!-- 可编辑表单 + OPC点位点位可先为空后续协商配置 -->
<el-form :model="plan.params" label-position="top" size="mini">
<!-- 可编辑表单 -->
<el-form :model="setup.params" label-position="top" size="mini">
<el-row :gutter="10">
<el-col
v-for="item in driveFields"
@@ -62,17 +79,9 @@
>
<el-form-item :label="item.label">
<el-input
v-model="plan.params[item.key]"
v-model="setup.params[item.key]"
:placeholder="getPlaceholder(item.key)"
/>
<!-- OPC address input / OPC点位输入框可先不填 -->
<el-input
v-model="driveAddress[item.key]"
size="mini"
class="addr-input"
placeholder="OPC address (optional)"
/>
</el-form-item>
</el-col>
</el-row>
@@ -82,8 +91,8 @@
</el-col>
</el-row>
<div v-if="plans.length === 0 && !loading" class="empty-data">
<el-empty description="No Data"></el-empty>
<div v-if="setups.length === 0 && !loading" class="empty-data">
<el-empty description="No Setup History Data"></el-empty>
</div>
</div>
</div>
@@ -91,59 +100,38 @@
<script>
// Import APIs / 引入接口
import { listPlan } from '@/api/l2/plan'
import { listSetup } from '@/api/business/setup'
import { createSendJob, executeSendJob } from '@/api/l2/sendJob'
import { getLastSuccess } from '@/api/l2/sendTemplate'
// Drive fields definition (English UI, Chinese comments) / 传动字段定义(英文界面,中文注释)
// 说明key 必须与 setupForm 字段一致(来自 plan/components/setupForm.vue
// Drive + Plan fields definition (show effect first; OPC address can be edited later)
// 传动 + 计划字段定义先把效果做出来OPC点位后续可协商配置
const DRIVE_FIELDS = [
// ---- Drive tension / 传动张力 ----
{ key: 'porTension', label: 'Pay-off Reel Tension', source: 'setup' },
{ key: 'celTension', label: 'Entry Loop Tension', source: 'setup' },
{ key: 'cleanTension', label: 'Cleaning Section Tension', source: 'setup' },
{ key: 'furTension', label: 'Furnace Zone Tension', source: 'setup' },
{ key: 'towerTension', label: 'Cooling Tower Tension', source: 'setup' },
{ key: 'tmNoneTension', label: 'TM No Tension', source: 'setup' },
{ key: 'tmEntryTension', label: 'TM Entry Tension', source: 'setup' },
{ key: 'tmExitTension', label: 'TM Exit Tension', source: 'setup' },
{ key: 'tlNoneTension', label: 'TL No Tension', source: 'setup' },
{ key: 'tlExitTension', label: 'TL Exit Tension', source: 'setup' },
{ key: 'coatTension', label: 'Post-treatment Tension', source: 'setup' },
{ key: 'cxlTension', label: 'Exit Loop Tension', source: 'setup' },
{ key: 'trTension', label: 'Take-up Reel Tension', source: 'setup' },
{ key: 'porTension', label: 'Pay-off Reel Tension' },
{ key: 'celTension', label: 'Entry Loop Tension' },
{ key: 'cleanTension', label: 'Cleaning Section Tension' },
{ key: 'furTension', label: 'Furnace Zone Tension' },
{ key: 'towerTension', label: 'Cooling Tower Tension' },
{ key: 'tmNoneTension', label: 'TM No Tension' },
{ key: 'tmEntryTension', label: 'TM Entry Tension' },
{ key: 'tmExitTension', label: 'TM Exit Tension' },
{ key: 'tlNoneTension', label: 'TL No Tension' },
{ key: 'tlExitTension', label: 'TL Exit Tension' },
{ key: 'coatTension', label: 'Post-treatment Tension' },
{ key: 'cxlTension', label: 'Exit Loop Tension' },
{ key: 'trTension', label: 'Take-up Reel Tension' },
// ---- TL / TM setup ----
{ key: 'tlElong', label: 'TL Elongation', source: 'setup' },
{ key: 'tlLvlMesh1', label: 'TL Leveling Roll Mesh 1', source: 'setup' },
{ key: 'tlLvlMesh2', label: 'TL Leveling Roll Mesh 2', source: 'setup' },
{ key: 'tlAcbMesh', label: 'TL Anti-crossbow Mesh', source: 'setup' },
{ key: 'tlElong', label: 'TL Elongation' },
{ key: 'tlLvlMesh1', label: 'TL Leveling Roll Mesh 1' },
{ key: 'tlLvlMesh2', label: 'TL Leveling Roll Mesh 2' },
{ key: 'tlAcbMesh', label: 'TL Anti-crossbow Mesh' },
{ key: 'tmBendforce', label: 'TM Bending Force', source: 'setup' },
{ key: 'tmAcrMesh', label: 'TM Anti-crimping Roll Mesh', source: 'setup' },
{ key: 'tmBrMesh', label: 'TM Anti-tremor Roll Mesh', source: 'setup' },
{ key: 'tmRollforce', label: 'TM Roll Force', source: 'setup' },
// ---- Plan (from listPlan response) / 计划参数(来自 listPlan 返回)----
{ key: 'entryWidth', label: 'Entry Width', source: 'plan' },
{ key: 'entryThick', label: 'Entry Thick', source: 'plan' },
{ key: 'entryWeight', label: 'Entry Weight', source: 'plan' },
{ key: 'entryLength', label: 'Entry Length', source: 'plan' },
{ key: 'steelGrade', label: 'Steel Grade', source: 'plan' },
{ key: 'spmElongation', label: 'SPM Elongation', source: 'plan' },
{ key: 'spmRollforce', label: 'SPM Roll Force', source: 'plan' },
{ key: 'spmBendingForce', label: 'SPM Bending Force', source: 'plan' },
{ key: 'yieldPoint', label: 'Yield Point', source: 'plan' }
{ key: 'tmBendforce', label: 'TM Bending Force' },
{ key: 'tmAcrMesh', label: 'TM Anti-crimping Roll Mesh' },
{ key: 'tmBrMesh', label: 'TM Anti-tremor Roll Mesh' },
{ key: 'tmRollforce', label: 'TM Roll Force' }
]
// OPC address mapping / OPC点位映射
// 说明:此处后续可协商配置;当前允许在页面上编辑(默认可为空)
const DRIVE_ADDRESS = {
porTension: 'ns=2;s=ProcessCGL.PLCLine.L2Setup.tensionPorBR1',
celTension: 'ns=2;s=ProcessCGL.PLCLine.L2Setup.tensionBR3',
@@ -176,9 +164,8 @@ export default {
return {
loading: false,
lastSuccess: null,
plans: [],
setups: [], // Changed from 'plans' to 'setups'
driveFields: DRIVE_FIELDS,
// 可编辑的 OPC 点位(默认从常量拷贝;你也可以后续改成从后端/本地存储加载)
driveAddress: { ...DRIVE_ADDRESS }
}
},
@@ -189,59 +176,37 @@ export default {
async reload() {
this.loading = true
try {
// last success for DRIVE / 获取传动上次成功
// 1. Get last success for DRIVE
const lastRes = await getLastSuccess('DRIVE')
this.lastSuccess = lastRes && lastRes.code === 200 ? lastRes.data : null
// plans / 获取计划
const planRes = await listPlan({ status: 'NEW,READY,ONLINE,PRODUCING' })
// 兼容后端返回结构:既可能是 {rows: []} 也可能是 {data: []}
const planList = (planRes && (planRes.rows || planRes.data)) || []
const tasks = planList.map(async (p) => {
let setup = {}
try {
const setupRes = await listSetup({ coilid: p.coilid, planid: p.planid })
setup = (setupRes.rows && setupRes.rows.length > 0) ? setupRes.rows[0] : {}
} catch (e) {
setup = {}
}
// 2. Get setup history list (instead of plans)
const setupRes = await listSetup({ pageNum: 1, pageSize: 20 }) // Fetch latest 20 for example
const setupList = (setupRes && setupRes.rows) || []
// 3. Map setup list to display data
this.setups = setupList.map(s => {
const params = {}
this.driveFields.forEach(f => {
const fromPlan = p ? p[f.key] : undefined
const fromSetup = setup ? setup[f.key] : undefined
const fromSetup = s ? s[f.key] : undefined
const fromLast = this.lastSuccess?.values?.[f.key]
// 优先级setup(如果字段来自setup) / plan(如果字段来自plan) -> lastSuccess -> ''
if (f.source === 'plan') {
if (fromPlan !== undefined && fromPlan !== null && String(fromPlan) !== '') {
params[f.key] = String(fromPlan)
} else if (fromLast !== undefined && fromLast !== null) {
params[f.key] = String(fromLast)
} else {
params[f.key] = ''
}
// Priority: current setup value > last success value > ''
if (fromSetup !== undefined && fromSetup !== null && String(fromSetup) !== '') {
params[f.key] = String(fromSetup)
} else if (fromLast !== undefined && fromLast !== null) {
params[f.key] = String(fromLast)
} else {
if (fromSetup !== undefined && fromSetup !== null && String(fromSetup) !== '') {
params[f.key] = String(fromSetup)
} else if (fromLast !== undefined && fromLast !== null) {
params[f.key] = String(fromLast)
} else {
params[f.key] = ''
}
params[f.key] = ''
}
})
return {
...p,
setup,
...s,
params,
sending: false
}
})
this.plans = await Promise.all(tasks)
} catch (e) {
console.error(e)
this.$message.error('Load failed')
@@ -255,11 +220,11 @@ export default {
this.$message.info('No last success data')
return
}
this.plans.forEach(plan => {
this.setups.forEach(setup => {
this.driveFields.forEach(f => {
const v = this.lastSuccess.values[f.key]
if (v !== undefined) {
this.$set(plan.params, f.key, String(v))
this.$set(setup.params, f.key, String(v))
}
})
})
@@ -277,41 +242,41 @@ export default {
return new Date(t).toLocaleString()
},
handleSend(plan) {
handleSend(setup) {
this.$confirm(
`Confirm to send parameters for Steel Grade [${plan.steelGrade || '-'}]?`,
`Confirm to send parameters for Coil [${setup.coilid || '-'}]?`,
'Warning',
{
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'warning'
}
).then(() => this.doSend(plan)).catch(() => {})
).then(() => this.doSend(setup)).catch(() => {})
},
async doSend(plan) {
plan.sending = true
async doSend(setup) {
setup.sending = true
try {
const items = this.driveFields.map(f => ({
paramCode: f.key,
// OPC点位允许为空为空则本次不发送该字段先做效果后续再配置
address: this.driveAddress[f.key],
valueRaw: String(plan.params[f.key] || ''),
address: this.driveAddress[f.key], // OPC address can be empty
valueRaw: String(setup.params[f.key] || ''),
setTime: new Date()
})).filter(it => !!it.address)
})).filter(it => !!it.address) // Filter out items without an address
if (!items.length) {
this.$message.warning('OPC点位为空:当前没有可发送的字段(请先在输入框里填写点位)')
this.$message.warning('OPC addresses are not configured. Nothing to send.')
return
}
const dto = {
deviceName: 'CGL_LINE_1',
bizKey: setup.coilid, // Use coilid as business key
groups: [
{
groupNo: 1,
groupType: 'DRIVE',
groupName: `Drive/Plan Params for ${plan.steelGrade || ''}`,
groupName: `Drive Params for ${setup.coilid || ''}`,
items
}
]
@@ -329,7 +294,7 @@ export default {
console.error(e)
this.$message.error(e.message || 'Send failed')
} finally {
plan.sending = false
setup.sending = false
}
}
}
@@ -337,13 +302,15 @@ export default {
</script>
<style scoped>
.page-title { margin-bottom: 20px; }
.toolbar { margin-bottom: 20px; display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.card-grid-container { min-height: 300px; }
.card-col { margin-bottom: 20px; }
.parameter-card .card-header { display:flex; justify-content:space-between; align-items:center; }
.card-title { font-weight: 600; }
.header-right { display:flex; align-items:center; }
.card-header-content { flex-grow: 1; }
.card-title-row { margin-bottom: 4px; }
.card-title { font-weight: 600; font-size: 16px; }
.card-subtitle { font-size: 12px; color: #909399; display: flex; gap: 12px; }
.header-right { flex-shrink: 0; margin-left: 16px; }
.last-send-time { font-size: 12px; color:#909399; margin-right:16px; }
.empty-data { margin-top: 20px; }
</style>