diff --git a/.env.production b/.env.production index dabb73f..2ba4fa1 100644 --- a/.env.production +++ b/.env.production @@ -1,5 +1,5 @@ # 页面标题 -VUE_APP_TITLE = 镀锌机组及生产工艺管理系统 +VUE_APP_TITLE = 'Galvanizing Line & Production Process Management System' # 生产环境配置 ENV = 'production' @@ -17,6 +17,6 @@ VUE_APP_MONITRO_ADMIN = '/admin/login' VUE_APP_XXL_JOB_ADMIN = '/xxl-job-admin' # L2业务后端地址 -VUE_APP_SERVICE_BASE_API = 'http://localhost:8089' +VUE_APP_SERVICE_BASE_API = 'http://192.168.5.209:8080' diff --git a/.env.staging b/.env.staging index e209927..d75bb34 100644 --- a/.env.staging +++ b/.env.staging @@ -11,4 +11,4 @@ ENV = 'staging' # 若依管理系统/测试环境 VUE_APP_BASE_API = '/stage-api' -VUE_APP_SERVICE_BASE_API = 'http://140.143.206.120:10082/prod-api' +VUE_APP_SERVICE_BASE_API = 'http://49.232.87.108:12081' diff --git a/src/api/business/dashboard.js b/src/api/business/dashboard.js new file mode 100644 index 0000000..4f3f643 --- /dev/null +++ b/src/api/business/dashboard.js @@ -0,0 +1,18 @@ +import request from '@/utils/request' + +// 获取当前生产中的计划信息 +export function getCurrentProducingPlan() { + return request({ + url: '/api/business/dashboard/currentPlan', + method: 'get' + }) +} + +// 获取当前生产卷的关键工艺参数 +export function getCurrentProcessParams() { + return request({ + url: '/api/business/dashboard/currentProcess', + method: 'get' + }) +} + diff --git a/src/utils/websocketManager.js b/src/utils/websocketManager.js index fae18fc..f6d4729 100644 --- a/src/utils/websocketManager.js +++ b/src/utils/websocketManager.js @@ -6,7 +6,7 @@ class WebSocketManager { constructor() { this.connections = new Map() - this.baseUrl = 'ws://140.143.206.120:18081/websocket' + this.baseUrl = 'ws://49.232.87.108:12081/websocket' } /** diff --git a/src/views/index.vue b/src/views/index.vue index fc696fc..152ecbf 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -1,64 +1,197 @@ @@ -66,99 +199,185 @@ import CurrentTime from "./components/CurrentTime.vue"; import HomeMain from "./components/HomeMain.vue"; import MiniTable from "./components/MiniTable.vue"; -// 引入日志API +// 引入日志API / 生产相关API import { getLogDataPage } from "@/api/l2/log"; import { getRollHistorytList } from '@/api/l2/roller' import { listPlan } from "@/api/l2/plan"; import TrackMeasure from "@/components/TrackMeasure/index.vue"; +import { getCurrentProducingPlan, getCurrentProcessParams } from "@/api/business/dashboard"; export default { name: "Index", components: { CurrentTime, HomeMain, MiniTable, TrackMeasure }, data() { return { - featureCards: [ - { title: "生产计划", desc: "生产计划管理...", icon: "table", path: "/plan" }, - { title: "日志记录", desc: "日志记录管理...", icon: "log", path: "/log" }, - { title: "轧辊管理", desc: "轧辊管理...", icon: "redis", path: "/roller" }, - { title: "停机管理", desc: "停机管理...", icon: "bug", path: "/stop" }, + // KPI indicator data / KPI指标数据 + kpiData: [ + { + label: 'Daily Production', + labelCn: '日产量', + value: '0', + unit: 't', + icon: 'el-icon-data-line', + trend: 'up', + change: '+5.2%' + }, + { + label: 'Yield Rate', + labelCn: '成材率', + value: '0', + unit: '%', + icon: 'el-icon-pie-chart', + trend: 'up', + change: '+1.8%' + }, + { + label: 'Finished Coils', + labelCn: '成品卷数', + value: '0', + unit: 'Coils', + icon: 'el-icon-box', + trend: 'up', + change: '+12' + }, + { + label: 'Line Efficiency', + labelCn: '产线效率', + value: '0', + unit: '%', + icon: 'el-icon-cpu', + trend: 'down', + change: '-2.1%' + } ], - // 表格列配置（与日志字段对应） + // Production status / 生产状态 + productionStatus: { + type: 'success', + text: 'Running', + textCn: '运行中', + currentCoilId: '', + stripSpeed: '0', + efficiency: '0' + }, + // Equipment status / 设备状态 + equipmentStatus: [ + { name: 'Entry Section', nameCn: '入口段', status: 'running', statusText: 'Running' }, + { name: 'Furnace', nameCn: '炉区', status: 'running', statusText: 'Running' }, + { name: 'Coating Section', nameCn: '镀层段', status: 'running', statusText: 'Running' }, + { name: 'Exit Section', nameCn: '出口段', status: 'running', statusText: 'Running' }, + { name: 'Tension Control', nameCn: '张力控制', status: 'running', statusText: 'Running' }, + { name: 'Temperature Control', nameCn: '温度控制', status: 'running', statusText: 'Running' } + ], + // Feature cards for quick access / 快速访问功能卡片 + featureCards: [ + { title: "Production Plan", titleCn: "生产计划", desc: "Manage production plans and schedules", descCn: "生产计划管理", icon: "s-order", path: "/plan" }, + { title: "Log Records", titleCn: "日志记录", desc: "View system logs and alarms", descCn: "日志记录管理", icon: "document", path: "/log" }, + { title: "Roller Management", titleCn: "轧辊管理", desc: "Manage rollers and change history", descCn: "轧辊管理", icon: "setting", path: "/roller" }, + { title: "Stoppage Management", titleCn: "停机管理", desc: "Track and manage production stoppages", descCn: "停机管理", icon: "warning", path: "/stop" }, + { title: "Process Tracking", titleCn: "过程跟踪", desc: "Real-time process monitoring", descCn: "实时过程监控", icon: "monitor", path: "/track" }, + { title: "Performance Data", titleCn: "实绩数据", desc: "View production performance data", descCn: "查看生产实绩数据", icon: "data-analysis", path: "/pdo" } + ], + // Table column configuration (matching log fields) / 表格列配置（与日志字段对应） alarmColumns: [ - { label: "发生时间", prop: "timestamp", width: "200px" }, - { label: "报警模块", prop: "module", width: "60px" }, - { label: "报警类型", prop: "logtype" }, + { label: "Occurrence Time", labelCn: "发生时间", prop: "timestamp", width: "200px" }, + { label: "Alarm Module", labelCn: "报警模块", prop: "module", width: "120px" }, + { label: "Alarm Type", labelCn: "报警类型", prop: "logtype", width: "120px" }, + { label: "Alarm Content", labelCn: "警报内容", prop: "logtext" }, ], rollHistoryColumns: [ - { label: "换辊号", prop: "changeid" }, - { label: "轧辊号", prop: "rollid" }, - { label: "机组", prop: "seton", width: "80px" }, - { label: "班次", prop: "shift", width: "60px" }, - { label: "班组", prop: "crew", width: "60px" }, - { label: "机架号", prop: "standid", width: "80px" }, - { label: "位置", prop: "position", width: "50px" }, - { label: '直径', prop: 'diameter', width: '100px' }, - { label: '粗糙度', prop: 'rough', width: '100px' }, - { label: '凸度', prop: 'crown', width: '100px' }, - { label: '成分', prop: 'composition', width: '100px' }, + { label: "Change ID", labelCn: "换辊号", prop: "changeid", width: "120px" }, + { label: "Roll ID", labelCn: "轧辊号", prop: "rollid", width: "120px" }, + { label: "Unit", labelCn: "机组", prop: "seton", width: "80px" }, + { label: "Shift", labelCn: "班次", prop: "shift", width: "80px" }, + { label: "Crew", labelCn: "班组", prop: "crew", width: "80px" }, + { label: "Stand ID", labelCn: "机架号", prop: "standid", width: "100px" }, + { label: "Position", labelCn: "位置", prop: "position", width: "80px" }, + { label: 'Diameter', labelCn: '直径', prop: 'diameter', width: '100px' }, + { label: 'Roughness', labelCn: '粗糙度', prop: 'rough', width: '100px' }, + { label: 'Crown', labelCn: '凸度', prop: 'crown', width: '100px' }, + { label: 'Composition', labelCn: '成分', prop: 'composition', width: '100px' }, ], planColumns: [ - { label: '顺序号', prop: 'seqid', width: '80px' }, - { label: '钢卷号', prop: 'coilid', width: '120px' }, - { label: '机组号', prop: 'unitCode', width: '100px' }, - { label: '计划号', prop: 'planid', width: '120px' }, - { label: '计划类型', prop: 'planType', width: '80px' }, - { label: '钢种', prop: 'steelGrade', width: '120px' }, - { label: '出口卷号', prop: 'exitCoilid', width: '100px' }, - { label: '订单号', prop: 'orderNo', width: '100px' }, - { label: '客户代码', prop: 'custommerCode', width: '100px' }, - { label: '上线时间', prop: 'onlineDate' }, - { label: '开始时间', prop: 'startDate' }, - { label: '结束时间', prop: 'endDate' }, - { label: '进炉时间', prop: 'furInDate' }, - { label: '出炉时间', prop: 'furOutDate' }, + { label: 'Seq. No.', labelCn: '顺序号', prop: 'seqid', width: '80px' }, + { label: 'Coil ID', labelCn: '钢卷号', prop: 'coilid', width: '120px' }, + { label: 'Unit Code', labelCn: '机组号', prop: 'unitCode', width: '100px' }, + { label: 'Plan ID', labelCn: '计划号', prop: 'planid', width: '120px' }, + { label: 'Plan Type', labelCn: '计划类型', prop: 'planType', width: '100px' }, + { label: 'Steel Grade', labelCn: '钢种', prop: 'steelGrade', width: '120px' }, + { label: 'Exit Coil ID', labelCn: '出口卷号', prop: 'exitCoilid', width: '120px' }, + { label: 'Order No.', labelCn: '订单号', prop: 'orderNo', width: '120px' }, + { label: 'Customer Code', labelCn: '客户代码', prop: 'custommerCode', width: '120px' }, + { label: 'Online Time', labelCn: '上线时间', prop: 'onlineDate', width: '160px' }, + { label: 'Start Time', labelCn: '开始时间', prop: 'startDate', width: '160px' }, + { label: 'End Time', labelCn: '结束时间', prop: 'endDate', width: '160px' }, ], - alarmData: [], // 表格数据（从API获取） - queryForm: { pageNum: 1, pageSize: 10 }, // 分页参数 - tableLoading: false, // 加载状态 - rollHistoryData: [], // 轧辊历史数据 - rollHistoryLoading: false, // 轧辊历史数据加载状态 - planData: [], // 生产计划数据 - planLoading: false, // 生产计划数据加载状态 + alarmData: [], // Table data (from API) / 表格数据（从API获取） + queryForm: { pageNum: 1, pageSize: 10 }, // Pagination parameters / 分页参数 + tableLoading: false, // Loading state / 加载状态 + rollHistoryData: [], // Roll history data / 轧辊历史数据 + rollHistoryLoading: false, // Roll history loading state / 轧辊历史数据加载状态 + planData: [], // Production plan data / 生产计划数据 + planLoading: false, // Production plan loading state / 生产计划数据加载状态 + measureData: [], // Process tracking data / 过程跟踪数据 + measureLoading: false, // Process tracking loading state / 过程跟踪加载状态 + measureColumns: [] // Process tracking columns / 过程跟踪列配置 }; }, created() { - // 页面加载时调用API获取数据 + // Call API to fetch data when page loads / 页面加载时调用API获取数据 this.getLogData(); this.getRollHistorytList(); this.getPlanList(); + this.refreshDashboard(); + // Refresh data periodically / 定期刷新数据 + this.refreshTimer = setInterval(() => { + this.getLogData(); + this.getRollHistorytList(); + this.getPlanList(); + this.refreshDashboard(); + }, 30000); // Refresh every 30 seconds / 每30秒刷新一次 + }, + beforeDestroy() { + // Clear timer when component is destroyed / 组件销毁时清除定时器 + if (this.refreshTimer) { + clearInterval(this.refreshTimer); + } }, methods: { + // Get log data / 获取日志数据 getLogData() { this.tableLoading = true; getLogDataPage(this.queryForm) .then((response) => { this.tableLoading = false; - this.alarmData = response.data.list; // 赋值表格数据 + this.alarmData = response.data.list || []; // Assign table data / 赋值表格数据 }) .catch((error) => { this.tableLoading = false; - console.error("获取日志数据失败:", error); - this.$message.error("获取日志数据失败，请稍后重试"); + console.error("Failed to fetch log data:", error); // 获取日志数据失败 + this.$message.error("Failed to fetch log data, please retry later"); // 获取日志数据失败，请稍后重试 }); }, + // Get roll history list / 获取轧辊历史列表 getRollHistorytList() { + this.rollHistoryLoading = true; getRollHistorytList(this.queryForm) .then((response) => { this.rollHistoryLoading = false; - this.rollHistoryData = response.data.list; // 赋值表格数据 + this.rollHistoryData = response.data.list || []; // Assign table data / 赋值表格数据 }) + .catch((error) => { + this.rollHistoryLoading = false; + console.error("Failed to fetch roll history data:", error); // 获取轧辊历史数据失败 + }); }, + // Get production plan list / 获取生产计划列表 getPlanList() { + this.planLoading = true; listPlan(this.queryForm) .then((response) => { this.planLoading = false; - this.planData = response.data.map(item => { + this.planData = (response.data || []).map(item => { return { ...item, onlineDate: item.onlineDate?.replace('T', ' '), @@ -167,15 +386,57 @@ export default { furInDate: item.furInDate?.replace('T', ' '), furOutDate: item.furOutDate?.replace('T', ' '), } - }); // 赋值表格数据 + }); // Assign table data / 赋值表格数据 }) + .catch((error) => { + this.planLoading = false; + console.error("Failed to fetch plan data:", error); // 获取计划数据失败 + }); + }, + // Refresh dashboard data from backend / 从后端刷新首页仪表板数据 + refreshDashboard() { + // 1) 当前生产计划 + getCurrentProducingPlan().then(res => { + const data = res.data || {}; + // 更新生产状态中的卷号等信息 + this.productionStatus.currentCoilId = data.coilid || ''; + // 这里可以根据需要扩展更多字段，例如钢种、入口规格等 + }); + + // 2) 当前生产卷的工艺参数 + getCurrentProcessParams().then(res => { + const data = res.data || {}; + // 带钢速度示例：优先取出口段TR的speedExitSection，其次取入口段POR1/POR2的stripSpeed + let stripSpeed = 0; + const exit = data.exitSection || {}; + const entry = data.entrySection || {}; + + if (exit.TR && (exit.TR.speedExitSection || exit.TR.stripSpeed)) { + stripSpeed = exit.TR.speedExitSection || exit.TR.stripSpeed; + } else if (entry.POR1 && entry.POR1.stripSpeed) { + stripSpeed = entry.POR1.stripSpeed; + } else if (entry.POR2 && entry.POR2.stripSpeed) { + stripSpeed = entry.POR2.stripSpeed; + } + + this.productionStatus.stripSpeed = stripSpeed || 0; + + // 产线效率目前后端没有直接指标，可根据需要后续扩展，这里先保持0或从其他接口获取 + // this.productionStatus.efficiency = ...; + + // KPI 区域暂时用真实卷号和速度填充一部分，其他可根据后端需要扩展 + this.kpiData[0].value = (stripSpeed || 0).toFixed(1); // 用带钢速度临时占位，后续可改为产量 + this.kpiData[1].value = '0'; + this.kpiData[2].value = '0'; + this.kpiData[3].value = this.productionStatus.efficiency || '0'; + }); } }, }; \ No newline at end of file diff --git a/src/views/l2/log/index.vue b/src/views/l2/log/index.vue index 846e440..f1998ee 100644 --- a/src/views/l2/log/index.vue +++ b/src/views/l2/log/index.vue @@ -1,76 +1,106 @@ + + + diff --git a/src/views/l2/pdo/components/line.vue b/src/views/l2/pdo/components/line.vue index f254e17..339e9cd 100644 --- a/src/views/l2/pdo/components/line.vue +++ b/src/views/l2/pdo/components/line.vue @@ -1,12 +1,12 @@