From a7441d24458b8b6ab34928743478c831fb348c06 Mon Sep 17 00:00:00 2001
From: Junjie <DELL@qq.com>
Date: 星期二, 02 十二月 2025 15:16:09 +0800
Subject: [PATCH] #
---
src/main/webapp/views/watch/console2.html | 275 ++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 221 insertions(+), 54 deletions(-)
diff --git a/src/main/webapp/views/watch/console2.html b/src/main/webapp/views/watch/console2.html
index dc5b25a..536102d 100644
--- a/src/main/webapp/views/watch/console2.html
+++ b/src/main/webapp/views/watch/console2.html
@@ -86,6 +86,7 @@
let pixiCrnMap = new Map();
let pixiShelfMap = new Map();
let pixiTrackMap = new Map();
+ let crnList = [];
let objectsContainer;
let objectsContainer2;
let graphicsShelf;
@@ -148,13 +149,9 @@
that.getMap(this.currentLev)
}, 1000);
- // this.consoleInterval = setInterval(() => {
- // this.getMap(this.currentLev) //鑾峰彇瀹炴椂鍦板浘鏁版嵁
- // this.getShuttleStateInfo() //鑾峰彇鍥涘悜绌挎杞︿俊鎭�
- // this.getLiftStateInfo() //鑾峰彇鎻愬崌鏈轰俊鎭�
- // this.getSiteInfo() //鑾峰彇杈撻�佺珯鐐规暟鎹�
- // // this.getCodeData()//鑾峰彇鏉＄爜
- // }, 1000)
+ this.consoleInterval = setInterval(() => {
+ this.getCrnInfo() //鑾峰彇鍫嗗灈鏈烘暟鎹�
+ }, 1000)
},
initLev() {
@@ -226,7 +223,7 @@
// 浠嶨raphics瀵硅薄鍒涘缓涓�涓汗鐞�
// graphicsShelf = pixiApp.renderer.generateTexture(getContainer('shelf'));
// graphicsDevp = pixiApp.renderer.generateTexture(getContainer('devp'));
- graphicsCrn = createCrnTexture(25,25);
+ // graphicsCrn = createCrnTexture(40,40);
graphicsCrnTrack = createTrackTexture(25,25);
// 鍒涘缓涓�涓鍣ㄦ潵绠＄悊澶ф壒閲忕殑鏄剧ず瀵硅薄
@@ -291,29 +288,16 @@
pixiApp.view.addEventListener('wheel', (event) => {
event.stopPropagation();
event.preventDefault();
- // 鍥犱负鐢诲竷鏄厖婊¤绐楃殑锛屾墍浠lientX绛変簬mouse point鍦╮enderer涓婄殑x鍧愭爣
- const globalPos = [event.clientX, event.clientY];
- const delta = event.deltaY;
+ const sx = event.clientX;
+ const sy = event.clientY;
const oldZoom = pixiApp.stage.scale.x;
+ const delta = event.deltaY;
let newZoom = oldZoom * 0.999 ** delta;
-
- // const oldStageMatrix = app.stage.localTransform.clone();
- // const oldStagePos = oldStageMatrix.applyInverse(pointerGlobalPos);
- const oldStagePos = globalPos;
- const dx = oldStagePos[0] * oldZoom - oldStagePos[0] * newZoom;
- const dy = oldStagePos[1] * oldZoom - oldStagePos[1] * newZoom;
-
- pixiApp.stage.setTransform(
- pixiApp.stage.position.x + dx,
- pixiApp.stage.position.y + dy,
- newZoom,
- newZoom,
- 0,
- 0,
- 0,
- 0,
- 0
- );
+ const worldX = (sx - pixiApp.stage.position.x) / oldZoom;
+ const worldY = (sy - pixiApp.stage.position.y) / oldZoom;
+ const newPosX = sx - worldX * newZoom;
+ const newPosY = sy - worldY * newZoom;
+ pixiApp.stage.setTransform(newPosX, newPosY, newZoom, newZoom, 0, 0, 0, 0, 0);
});
//*******************缂╂斁鐢诲竷*******************
@@ -351,7 +335,7 @@
map.forEach((item, index) => {
for(let idx = 0;idx < item.length;idx++){
- let val = item[idx];
+ let val = item[idx]
let cellWidth = val.cellWidth / 40;
let cellHeight = val.cellHeight / 8;
@@ -377,12 +361,11 @@
if(val.colSpan > 1) {
for(let i = 1;i < val.colSpan;i++){
let nextMerge = map[index][idx + i];
- if(nextMerge.type != 'merge'){
- continue;
- }
+ if (!nextMerge) { continue; }
let mergeCellWidth = nextMerge.cellWidth / 40;
mergeWidth += mergeCellWidth;
+ nextMerge.isMergedPart = true;
}
val.width = mergeWidth;
@@ -400,13 +383,31 @@
map.forEach((row, rowIndex) => {
let xCursor = 0;
+ let anchorX = 0;
for (let colIndex = 0; colIndex < row.length; colIndex++) {
let val = row[colIndex];
+
let cellWidth = val.width;
let cellHeight = val.height;
+ if (val.isMergedPart) {
+ val.posX = anchorX;
+ val.posY = yOffsets[rowIndex];
+ continue;
+ }
+
val.posX = xCursor;
val.posY = yOffsets[rowIndex];
+ anchorX = xCursor;
+
+ if (val.colSpan > 1) {
+ for (let i = 1; i < val.colSpan; i++) {
+ const next = row[colIndex + i];
+ if (!next) { break; }
+ next.posX = anchorX;
+ next.posY = yOffsets[rowIndex];
+ }
+ }
xCursor += cellWidth;
}
@@ -446,12 +447,58 @@
}
});
+ crnList.forEach((item) => {
+ if(graphicsCrn == null) {
+ graphicsCrn = createCrnTexture(item.width * 0.9,item.height * 0.9);
+ }
+ let sprite = new PIXI.Sprite(graphicsCrn);
+ const deviceNo = getDeviceNo(item.value);
+ const taskNo = getTaskNo(item.value);
+ const style = new PIXI.TextStyle({ fontFamily: 'Arial', fontSize: 12, fill: '#ffffff', stroke: '#000000', strokeThickness: 2 });
+ const txt = taskNo > 0 ? (deviceNo + "(" + taskNo + ")") : String(deviceNo);
+ const text = new PIXI.Text(txt, style);
+ text.anchor.set(0.5);
+ text.position.set(sprite.width / 2, sprite.height / 2);
+ sprite.addChild(text);
+ sprite.textObj = text;
+ sprite.zIndex = 1;
+
+ sprite.position.set(item.posX, item.posY);
+ sprite.interactive = true; // 蹇呴』瑕佽缃墠鑳芥帴鏀朵簨浠�
+ sprite.buttonMode = true; // 璁╁厜鏍囧湪hover鏃跺彉涓烘墜鍨嬫寚閽�
+
+ let rowIndexForCrn = 0;
+ for (let r = 0; r < map.length; r++) {
+ if (map[r].length > 0) {
+ const rowY = map[r][0].posY;
+ if (Math.abs(rowY - item.posY) < 0.5) {
+ rowIndexForCrn = r;
+ break;
+ }
+ }
+ }
+ sprite.rowIndex = rowIndexForCrn;
+
+ pixiCrnMap.set(parseInt(deviceNo), sprite);
+ objectsContainer2.addChild(sprite);
+ })
- //瑙嗚灞呬腑
- let containerWidth = (pixiApp.view.width - objectsContainer.width) / 2;
- let containerHeight = (pixiApp.view.height - objectsContainer.height) / 2;
- pixiApp.stage.position.set(containerWidth, containerHeight);
+ const b1 = objectsContainer.getLocalBounds();
+ const b2 = objectsContainer2.getLocalBounds();
+ const minX = Math.min(b1.x, b2.x);
+ const minY = Math.min(b1.y, b2.y);
+ const maxX = Math.max(b1.x + b1.width, b2.x + b2.width);
+ const maxY = Math.max(b1.y + b1.height, b2.y + b2.height);
+ const contentW = Math.max(0, maxX - minX);
+ const contentH = Math.max(0, maxY - minY);
+ const vw = pixiApp.view.width;
+ const vh = pixiApp.view.height;
+ let scale = Math.min(vw / contentW, vh / contentH) * 0.95;
+ if (!isFinite(scale) || scale <= 0) { scale = 1; }
+ const posX = (vw - contentW * scale) / 2 - minX * scale;
+ const posY = (vh - contentH * scale) / 2 - minY * scale;
+ pixiApp.stage.setTransform(posX, posY, scale, scale, 0, 0, 0, 0, 0);
this.map = map;
},
@@ -692,6 +739,87 @@
}
})
},
+ getCrnInfo() {
+ let that = this
+ //鑾峰彇鍫嗗灈鏈烘暟鎹�
+ $.ajax({
+ url: baseUrl + "/console/latest/data/crn",
+ headers: {'token': localStorage.getItem('token')},
+ method: 'POST',
+ success: function (res) {
+ if (res.code === 200) {
+ var crns = res.data;
+ for (var i = 0; i < crns.length; i++) {
+ const id = parseInt(crns[i].crnId);
+ const sprite = pixiCrnMap.get(id);
+ if (!sprite) { continue; }
+
+ const taskNo = crns[i].taskNo;
+ if (taskNo != null && taskNo > 0) {
+ sprite.textObj.text = id + "(" + taskNo + ")";
+ } else {
+ sprite.textObj.text = String(id);
+ }
+
+ const status = crns[i].crnStatus;
+ const statusColor = getCrnStatusColor(status);
+ updateCrnTextureColor(sprite, statusColor);
+
+ let bay = parseInt(crns[i].bay, 10);
+ if (isNaN(bay) || bay < 1 || bay === -2) {
+ bay = 1;
+ }
+
+ let rowIndex = (sprite.rowIndex != null) ? sprite.rowIndex : -1;
+ if (rowIndex === -1) {
+ for (let r = 0; r < that.map.length; r++) {
+ if (that.map[r].length > 0) {
+ const rowY = that.map[r][0].posY;
+ if (Math.abs(rowY - sprite.y) < 0.5) {
+ rowIndex = r;
+ break;
+ }
+ }
+ }
+ if (rowIndex === -1) { rowIndex = 0; }
+ }
+
+ let targetCell = null;
+ let crnCount = 0;
+ for (let c = 0; c < that.map[rowIndex].length; c++) {
+ const cell = that.map[rowIndex][c];
+ if (cell && cell.type === 'crn') {
+ crnCount++;
+ if (crnCount === bay) {
+ targetCell = cell;
+ break;
+ }
+ }
+ }
+ if (!targetCell) {
+ for (let c = that.map[rowIndex].length - 1; c >= 0; c--) {
+ const cell = that.map[rowIndex][c];
+ if (cell && cell.type === 'crn') {
+ targetCell = cell;
+ break;
+ }
+ }
+ }
+ if (!targetCell) { continue; }
+
+ const targetX = targetCell.posX + (targetCell.width - sprite.width) / 2;
+
+ gsap.killTweensOf(sprite);
+ gsap.to(sprite, { x: targetX, duration: 0.5, ease: "power1.inOut" });
+ }
+ } else if (res.code === 403) {
+ parent.location.href = baseUrl + "/login";
+ } else {
+ console.log(res.msg);
+ }
+ }
+ });
+ },
}
})
@@ -720,7 +848,7 @@
let graphics = new PIXI.Graphics();
let drawBorder = true;
if (type == 'shelf') {
- graphics.beginFill(0x55aaff);
+ graphics.beginFill(0xb6e2e2);
} else if (type == 'devp') {
graphics.beginFill(0x00ff7f);
graphics.visible = true;
@@ -801,6 +929,56 @@
return rt;
}
+ function createCrnTextureColoredDevice(deviceWidth, height, color) {
+ const g = new PIXI.Graphics();
+ const yTop = Math.round(height * 0.1);
+ g.beginFill(0x999999);
+ g.drawRect(2, yTop, 3, height - yTop - 2);
+ g.drawRect(deviceWidth - 5, yTop, 3, height - yTop - 2);
+ g.endFill();
+ g.beginFill(0x999999);
+ g.drawRect(0, yTop, deviceWidth, 3);
+ g.endFill();
+ const cabW = Math.round(deviceWidth * 0.68);
+ const cabH = Math.round(height * 0.38);
+ const cabX = Math.round((deviceWidth - cabW) / 2);
+ const cabY = Math.round(height * 0.52 - cabH / 2);
+ g.beginFill(color);
+ g.drawRect(cabX, cabY, cabW, cabH);
+ g.endFill();
+ const winW = Math.round(cabW * 0.6);
+ const winH = Math.round(cabH * 0.45);
+ const winX = cabX + Math.round((cabW - winW) / 2);
+ const winY = cabY + Math.round((cabH - winH) / 2);
+ g.beginFill(0xd0e8ff);
+ g.drawRect(winX, winY, winW, winH);
+ g.endFill();
+ const forkW = Math.round(deviceWidth * 0.8);
+ const forkH = Math.max(2, Math.round(height * 0.08));
+ const forkX = Math.round((deviceWidth - forkW) / 2);
+ const forkY = cabY + cabH;
+ g.beginFill(0x666666);
+ g.drawRect(forkX, forkY, forkW, forkH);
+ g.endFill();
+ const rt = PIXI.RenderTexture.create({ width: deviceWidth, height: height });
+ pixiApp.renderer.render(g, rt);
+ return rt;
+ }
+
+ function updateCrnTextureColor(sprite, color) {
+ const tex = createCrnTextureColoredDevice(sprite.width, sprite.height, color);
+ sprite.texture = tex;
+ }
+
+ function getCrnStatusColor(status) {
+ if (status === "machine-auto") { return 0x21BA45; }
+ if (status === "machine-un-auto") { return 0xBBBBBB; }
+ if (status === "machine-error") { return 0xDB2828; }
+ if (status === "machine-pakin") { return 0x30bffc; }
+ if (status === "machine-pakout") { return 0x97b400; }
+ return 0xBBBBBB;
+ }
+
function getGraphics(color, width, height, x, y) {
let graphics = new PIXI.Graphics();
graphics.beginFill(color);
@@ -834,22 +1012,11 @@
pixiStaMap.set(parseInt(siteId), sprite);
}
} else if (item.type == 'crn') {
- if (getDeviceNo(value) == -1) {
- sprite = createTrackSprite(item.width, item.height);
- sprite.zIndex = 0;
- } else {
- sprite = new PIXI.Sprite(graphicsCrn);
- const deviceNo = getDeviceNo(value);
- const taskNo = getTaskNo(value);
- const style = new PIXI.TextStyle({ fontFamily: 'Arial', fontSize: 12, fill: '#ffffff', stroke: '#000000', strokeThickness: 2 });
- const txt = taskNo > 0 ? (deviceNo + "(" + taskNo + ")") : String(deviceNo);
- const text = new PIXI.Text(txt, style);
- text.anchor.set(0.5);
- text.position.set(sprite.width / 2, sprite.height / 2);
- sprite.addChild(text);
- sprite.textObj = text;
- pixiCrnMap.set(parseInt(deviceNo), sprite);
- sprite.zIndex = 1;
+ sprite = createTrackSprite(item.width, item.height);
+ sprite.zIndex = 0;
+
+ if(getDeviceNo(value) > 0){
+ crnList.push(item);
}
} else {
return null;
--
Gitblit v1.9.1