DeXun/klp-mono
9
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

二级后端添加数据快照修正。前端添加数字孪生

Browse Source
This commit is contained in:
86156
2026-01-15 17:37:57 +08:00
parent 166afcb959
commit 3c4e60bc49
20 changed files with 2445 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/l2/package.json
View File

@@ -54,6 +54,7 @@
"screenfull": "5.0.2",
"sortablejs": "1.10.2",
"splitpanes": "2.4.1",
"three": "^0.158.0",
"vue": "2.6.12",
"vue-count-to": "1.0.13",
"vue-cropper": "0.5.5",

BIN
apps/l2/public/models/光整机.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/剪切机.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/卷取机.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/夹送矫直机.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/开卷机.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/拉轿机.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/清洗段.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/炉火段.glb Normal file
View File

Binary file not shown.

BIN
apps/l2/public/models/锌锅.glb Normal file
View File

Binary file not shown.

278
apps/l2/src/config/productionLine.js Normal file
View File

@@ -0,0 +1,278 @@
// 产线配置数据（替代后端 API）
// 轨道节点配置说明：
// trackNodes: 轨道节点数组，按顺序连接
// 每个节点包含：
// id: 节点唯一标识
// name: 节点名称（可选，用于显示）
// position: { x, y, z } 节点位置坐标
// width: 轨道宽度（可选，默认1.2）
// waypoints: 中间路径点数组（可选），用于定义从该节点到下一个节点的中间转弯点
// 每个waypoint包含：{ x, y, z } 位置坐标
// 示例：waypoints: [{ x: 10, y: 0.5, z: 5 }, { x: 15, y: 0.5, z: 5 }]
// 轨道会依次经过：节点 -> waypoint1 -> waypoint2 -> ... -> 下一个节点
export const productionLineConfig = {
name: "产线展示",
description: "基于节点的轨道系统，可手动调节每个节点的位置和高度。",
// 运动扁钢（压钢带）参数
steelFlow: {
count: 4, // 扁钢数量（同时在轨道上运动的条数）
length: 8, // 每条扁钢长度（沿轨道方向）
widthRatio: 0.85, // 扁钢宽度=轨道宽度*比例
thickness: 0.10, // 扁钢厚度
speed: 6 // 运动速度（数值越大越快）
},
// 轨道节点配置 - 按顺序连接，轨道会平滑通过这些节点
// 可以在节点之间添加 waypoints 来定义中间转弯点
trackNodes: [
{ id: "node_1", name: "起点", position: { x: 5.0, y: 5.0, z: 0.0 }, width: 1.8 },
{ id: "node_2", name: "1#开卷机后", position: { x: 23.0, y: 5.2, z: 0.0 }, width: 1.2 },
{ id: "node_3", name: "2#开卷机前", position: { x: 28.0, y: 5.2, z: 0.0 }, width: 1.2 },
{ id: "node_4", name: "2#开卷机后", position: { x: 42.0, y: 5.2, z: 0.0 }, width: 1.2 },
{
id: "node_5",
name: "夹送矫直前",
position: { x: 46, y: 6.0, z: 0.0 },
width: 1.2,
// 示例：从上一个节点到当前节点，经过多个转弯点
// waypoints: [
// { x: -13.0, y: 3.0, z: 0.0 }, // 第一个转弯点
// { x: -12.5, y: 4.5, z: 0.0 } // 第二个转弯点
// ]
},
{ id: "node_6", name: "夹送矫直后", position: { x:55.0, y: 5.5, z: 0.0 }, width: 1.2 },
{
id: "node_7",
name: "清洗段前",
position: { x: 64, y: 2, z: 1.6 },
width: 1.2,
// 从清洗段前到清洗段后的中间转弯点
// 轨道会依次经过：node_7 -> waypoint1 -> waypoint2 -> ... -> node_8
waypoints: [
// 在这里添加转弯点，例如：
{ x: 70, y: 2.0, z: 0.0 }, // 转弯点1
{ x: 72, y: 2.0, z: 13.0 }, // 转弯点2
// { x: 90, y: 0.6, z: 12.0 } // 转弯点3
]
},
{
id: "node_8",
name: "清洗段后",
position: { x: 92, y: 0.6, z: 13.6 },
width: 1.2,
// 示例：清洗段内部可能有多次转弯
waypoints: [
// { x: -2.0, y: 0.6, z: 5.0 }, // 转弯点1
// { x: 0.0, y: 0.6, z: 9.0 }, // 转弯点2
// { x: 1.0, y: 0.6, z: 11.5 } // 转弯点3
]
},
{ id: "node_9", name: "炉火段前", position: { x:92, y:3, z: 2.2 }, width: 1.2 },
{ id: "node_10", name: "炉火段后", position: { x: 92, y: 3, z: 2.2 }, width: 1.2,
waypoints: [
{ x: 92.0, y:5, z: 0.0 }, // 转弯点1
{ x: 92.0, y: 5, z: -10.0 }, // 转弯点2
// { x: 1.0, y: 0.6, z: 11.5 } // 转弯点3
]
},
{ id: "node_11", name: "锌锅前", position: { x: 109, y: 3, z: -10.0 }, width: 1.2 },
{ id: "node_12", name: "锌锅后", position: { x: 109, y:7, z: 4.0 }, width: 1.2,
waypoints: [
{ x: 109.0, y: 5, z: 13.0 }, // 转弯点1
]
},
{ id: "node_13", name: "光整机前",position: { x: 127.0, y: 5, z: 15.0 }, width: 1.2 },
{ id: "node_14", name: "光整机后", position: { x: 130.0, y: 5, z: 15.0 }, width: 1.2 },
{ id: "node_15", name: "拉矫机前", position: { x: 134.0, y: 7, z: 15.0 }, width: 1.2 },
{ id: "node_16", name: "拉矫机后", position: { x: 142.0, y: 7, z: 15.0 }, width: 1.2 },
{ id: "node_17", name: "剪切机前", position: { x:148.0, y: 5, z: 15.0 }, width: 1.2 },
{ id: "node_18", name: "剪切机后", position: { x: 158.0, y: 5, z: 15.0 }, width: 1.2 },
{ id: "node_19", name: "卷取机前", position: { x: 160.0, y: 7, z: 15.0 }, width: 1.2 },
{ id: "node_20", name: "终点", position: { x: 165.0, y: 7, z: 15.0 }, width: 1.2 },
{ id: "node_21", name: "结束", position: { x: 170.0, y: 2, z: 15.0 }, width: 1.2 },
],
// 设备配置（独立于轨道）
models: [
// 入口段（示例：开卷机可复用两次）
{
id: "unjcoiler_1",
name: "1#开卷机",
deviceCode: "POR1",
file: "/models/开卷机.glb",
position: { x: -24.0, y: 0.0, z: 0.0 },
io: {
entryDir: "-x",
exitDir: "+x",
leadOut:2,
leadIn: 0,
entryOffset: { y: 0 },
exitOffset: { y: 1.2 },
conveyor: { enabled: true, yOffset: 5.5, width: 1.2 }
}
},
{
id: "unjcoiler_2",
name: "2#开卷机",
deviceCode: "POR2",
file: "/models/开卷机.glb",
position: { x: -18.0, y: 0.0, z: 0.0 },
io: {
entryDir: "-x",
exitDir: "+x",
leadOut: 6,
leadIn: 1,
entryOffset: { y: 0.2 },
exitOffset: { y: 0.2 },
conveyor: { enabled: true, yOffset: 5.5, width: 1.2 }
}
},
// 夹送矫直
{
id: "pinch_leveler",
name: "夹送矫直机",
// 暂无对应的实时设备编码，可后续按需补充
file: "/models/夹送矫直机.glb",
position: { x: -12.0, y: 0.0, z: 0.0 },
rotation: { x: 0.0, y: 3.1415926, z: 0.0 },
io: {
entryDir: "-x",
exitDir: "+x",
leadOut: 0,
leadIn: 2.0,
entryOffset: { y: 0.25 },
exitOffset: { y: 0.25 },
rampLength: 0,
conveyor: { enabled: true, yOffset: 6, width: 1.2 }
}
},
// 清洗/炉火
{
id: "clean",
name: "清洗段",
deviceCode: "CLEAN",
file: "/models/清洗段.glb",
position: { x: -6, y: 0.0, z: 5.6 },
io: {
entryDir: "-x",
exitDir: "+x",
leadOut: 8.0,
leadIn: 0,
entryOffset: { y: 0, z:-4},
exitOffset: { y: 0, z: 8 },
rampLength: 4.0,
conveyor: { enabled: false, yOffset: 0.6, zOffset: 0, width: 1.2 }
}
},
{
id: "furnace",
name: "炉火段",
deviceCode: "FUR1",
file: "/models/炉火段.glb",
position: { x: 0.0, y: 0.0, z: 2.2 },
io: {
entryDir: "-x",
exitDir: "+x",
leadOut: 2.0,
leadIn: 2.0,
entryOffset: { y: 0.25 },
exitOffset: { y: 0.25 },
rampLength: 3.5,
conveyor: { enabled: true, yOffset: 0.25, width: 1.2 }
}
},
// 锌锅/后处理
{
id: "pot",
name: "锌锅",
deviceCode: "POT",
file: "/models/锌锅.glb",
position: { x: 6.0, y: 0.0, z: 0.0 },
io: {
entryDir: "-x",
exitDir: "+z",
leadOut: 1.8,
leadIn: 2.2,
entryOffset: { y: 0.35 },
exitOffset: { y: 0.35, x: -0.6 },
rampLength: 3.0,
conveyor: { enabled: true, yOffset: 0.35, width: 1.2 }
}
},
{
id: "skinpass",
name: "光整机",
deviceCode: "TM",
file: "/models/光整机.glb",
position: { x: 6.0, y: 0.0, z: 18.0 },
rotation: { x: 0.0, y: Math.PI / 2, z: 0.0 },
io: {
entryDir: "-z",
exitDir: "+z",
leadOut: 2.2,
leadIn: 2.2,
entryOffset: { y: 0.25 },
exitOffset: { y: 0.25 },
rampLength: 3.5,
conveyor: { enabled: true, yOffset: 0.25, width: 1.2 }
}
},
{
id: "bridle",
name: "拉矫机",
deviceCode: "TL",
file: "/models/拉轿机.glb",
rotation: { x: 0.0, y: Math.PI / 2, z: 0.0 },
position: { x: 8.0, y: 0.0, z: 15.0 },
io: {
entryDir: "-z",
exitDir: "+x",
leadOut: 2.0,
leadIn: 2.0,
entryOffset: { y: 0.25 },
exitOffset: { y: 0.25 },
rampLength: 3.0,
conveyor: { enabled: true, yOffset: 0.25, width: 1.2 }
}
},
// 剪切/卷取
{
id: "shear",
name: "剪切机",
deviceCode: "EXC",
file: "/models/剪切机.glb",
position: { x: 16.0, y: 0.0, z: 15.0 },
rotation: { x: 0.0, y: Math.PI / 2, z: 0.0 },
io: {
entryDir: "-x",
exitDir: "+x",
leadOut: 2.0,
leadIn: 2.0,
entryOffset: { y: 0.3 },
exitOffset: { y: 0.3 },
rampLength: 3.0,
conveyor: { enabled: true, yOffset: 0.3, width: 1.2 }
}
},
{
id: "coiler",
name: "卷取机",
deviceCode: "TR",
file: "/models/卷取机.glb",
position: { x: 24.0, y: 0.0, z: 22.0 },
rotation: { x: 0.0, y: Math.PI / 2, z: 0.0 },
io: {
entryDir: "-x",
exitDir: "+x",
leadOut: 2.0,
leadIn: 2.0,
entryOffset: { y: 0.3 },
exitOffset: { y: 0.3 },
conveyor: { enabled: true, yOffset: 0.3, width: 1.2 }
}
},
]
}

4
apps/l2/src/views/components/CurrentTime.vue
View File

@@ -57,7 +57,7 @@ $theme-text-gray: #a1a6af;
// 仅维护组件自身样式，无定位属性
.current-time {
padding: 1.2vw 1.8vw;
background: white;
background: rgba(255, 255, 255, 0.4);
backdrop-filter: blur(8px);
border: 1px solid rgba(167, 172, 180, 0.3);
border-radius: 8px;
@@ -91,4 +91,4 @@ $theme-text-gray: #a1a6af;
}
}
}
</style>
</style>

68
apps/l2/src/views/index.vue
View File

@@ -1,13 +1,9 @@
<template>
<div class="industrial-dashboard">
<!-- Header: 系统标题和当前时间 -->
<div class="dashboard-header">
<div class="header-left">
<h1 class="system-title">生产监控大屏</h1>
<p class="system-subtitle">实时生产数据与设备状态</p>
</div>
<div class="header-right">
<CurrentTime />
<!-- 顶部：产线三维展示（时间显示放入3D组件内部） -->
<div class="production-line-section">
<div class="production-line-view">
<ProductionLine />
</div>
</div>
@@ -82,9 +78,9 @@
<span>系统告警信息</span>
<el-badge :value="alarmData.length" class="alarm-badge" v-if="alarmData.length > 0"></el-badge>
</div>
<MiniTable
<MiniTable
v-loading="tableLoading"
:columns="alarmColumns"
:columns="alarmColumns"
:data="alarmData"
:highlightOnRowClick="true"
tableHeight="280px"
@@ -96,7 +92,7 @@
<div slot="header" class="card-header">
<span>换辊信息</span>
</div>
<MiniTable
<MiniTable
v-loading="rollHistoryLoading"
:columns="rollHistoryColumns"
:data="rollHistoryData"
@@ -116,7 +112,7 @@
<i class="el-icon-arrow-right"></i>
</el-button>
</div>
<MiniTable
<MiniTable
v-loading="planLoading"
:columns="planColumns"
:data="planData"
@@ -137,7 +133,7 @@
<i class="el-icon-arrow-right"></i>
</el-button>
</div>
<TrackMeasure
<TrackMeasure
v-loading="measureLoading"
:columns="measureColumns"
:data="measureData"
@@ -155,9 +151,9 @@
<span>快速访问</span>
</div>
<div class="quick-access-grid">
<div
class="access-item"
v-for="(card, index) in featureCards"
<div
class="access-item"
v-for="(card, index) in featureCards"
:key="index"
@click="$router.push(card.path)"
>
@@ -177,14 +173,14 @@
</el-col>
</el-row>
</div>
</template>
</template>
<script>
import CurrentTime from "./components/CurrentTime.vue";
import HomeMain from "./components/HomeMain.vue";
import MiniTable from "./components/MiniTable.vue";
import ProductionLine from "./l2/productLine/ProductLine.vue";
// 引入日志API / 生产相关API
import { getLogDataPage } from "@/api/l2/log";
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";
@@ -192,7 +188,7 @@ import { getCurrentProducingPlan, getCurrentProcessParams } from "@/api/business
export default {
name: "Index",
components: { CurrentTime, HomeMain, MiniTable, TrackMeasure },
components: { HomeMain, MiniTable, TrackMeasure, ProductionLine },
data() {
return {
// KPI指标数据
@@ -431,30 +427,16 @@ $theme-text-gray: #c9cdcf;
min-height: calc(100vh - 60px);
}
/* 仪表板头部 */
.dashboard-header {
display: flex;
justify-content: space-between;
align-items: center;
/* 顶部产线展示区 */
.production-line-section {
margin-bottom: 20px;
padding: 20px;
background: #ffffff; // 简洁白色背景，避免低级渐变色
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
.header-left {
.system-title {
color: #000;
font-size: 28px;
font-weight: 600;
margin: 0 0 8px 0;
}
.system-subtitle {
color: #000;
font-size: 14px;
margin: 0;
}
.production-line-view {
background: #ffffff;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
padding: 0;
overflow: hidden;
}
}
@@ -707,4 +689,4 @@ $theme-text-gray: #c9cdcf;
}
}
}
</style>
</style>

1390
apps/l2/src/views/l2/productLine/ProductLine.vue Normal file
View File

File diff suppressed because it is too large Load Diff