From 0035662c59462653bd4c1c58eac6ccbe9fc7d1c6 Mon Sep 17 00:00:00 2001
From: wangfei <3597712270@qq.com>
Date: 星期二, 11 三月 2025 09:26:35 +0800
Subject: [PATCH] 大理片笼、上片模块根据现场进行样式更改，大理片笼非钢化按钮中添加笼内详情按钮
---
UI-Project/src/views/largescreendisplay/screendisplay.vue | 62 +++++++-----------------------
1 files changed, 15 insertions(+), 47 deletions(-)
diff --git a/UI-Project/src/views/largescreendisplay/screendisplay.vue b/UI-Project/src/views/largescreendisplay/screendisplay.vue
index 9785f41..147e107 100644
--- a/UI-Project/src/views/largescreendisplay/screendisplay.vue
+++ b/UI-Project/src/views/largescreendisplay/screendisplay.vue
@@ -12,7 +12,6 @@
const blindb = ref(false)
const { t } = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
-
let socket = null;
const rawGlassStorageDetailList = ref([])
const orderDTOS = ref([])
@@ -21,7 +20,6 @@
rawGlassStorageDetailList.value = data.rawGlassStorageDetailList[0]
orderDTOS.value = data.orderDTOS[0]
};
-
let socket1 = null;
const edgOneTasks = ref([])
const edgTwoTasks = ref([])
@@ -43,7 +41,6 @@
}
};
-
let socket2 = null;
const temperingTaskType = ref([])
const temperingGlassInfoList = ref([])
@@ -55,10 +52,7 @@
numBoxes3.value =temperingTaskType.value;
boxStart3();
}
-
};
-
-
const tableDatad = ref([]);
const patternUsage = async () => {
try {
@@ -80,7 +74,6 @@
thickness: '',
films: ''
})
-
// const tableDatac = ref([]);
// const patternUsage = async () => {
// try {
@@ -96,8 +89,6 @@
// console.error(error);
// }
// }
-
-
// 鐐瑰嚮涓嬫柟寮圭獥
const handlehistorical = (row) => {
blindb.value = true;
@@ -131,7 +122,6 @@
console.log("鍏抽棴浜�")
closeWebSocket();
});
-
const numBoxes = ref(5);
const numBoxes2 = ref(5);
const numBoxes3 = ref(5); // 鍙姩鎬佷慨鏀圭殑 div 鏁伴噺
@@ -143,11 +133,9 @@
const maxX3 = 100; // 缁堢偣X鍧愭爣
const maxY3 = -55; // 缁堢偣Y鍧愭爣
const delayFrames = 600; // 姣忎釜 div 鐨勫欢杩熷抚鏁�
-
const boxes = ref([]);
const boxes2 = ref([]);
const boxes3 = ref([]);
-
// 鍒濆鍖� div 鏁版嵁
const boxStart = () => {
boxes.value = [];
@@ -160,7 +148,7 @@
style: {
width: '15px',
height: '15px',
- backgroundColor: i % 2 === 0 ? 'red' : 'blue',
+ backgroundColor: i % 2 === 0 ? '#911005' : 'blue',
position: 'absolute',
transform: `translate(0px, 0px)`
}
@@ -178,14 +166,13 @@
style: {
width: '15px',
height: '15px',
- backgroundColor: i % 2 === 0 ? 'red' : 'blue',
+ backgroundColor: i % 2 === 0 ? '#911005' : 'blue',
position: 'absolute',
transform: `translate(0px, 0px)`
}
});
}
}
-
const boxStart3 = () => {
boxes3.value = [];
for (let i = 0; i < numBoxes3.value; i++) {
@@ -197,23 +184,19 @@
style: {
width: '15px',
height: '15px',
- backgroundColor: i % 2 === 0 ? 'red' : 'blue',
+ backgroundColor: i % 2 === 0 ? '#911005' : 'blue',
position: 'absolute',
transform: `translate(0px, 0px)`
}
});
}
}
-
-
-
const animate = () => {
boxes.value.forEach((box) => {
if (box.delay > 0) {
box.delay--;
return;
}
-
if (box.direction === 'up') {
box.y -= speed;
if (box.y <= maxY) {
@@ -228,19 +211,16 @@
box.direction = 'up';
}
}
-
box.style = {
...box.style,
transform: `translate(${box.x}px, ${box.y}px)`
};
});
-
boxes2.value.forEach((box) => {
if (box.delay > 0) {
box.delay--;
return;
}
-
if (box.direction === 'up') {
box.y -= speed;
if (box.y <= maxY2) {
@@ -260,13 +240,11 @@
transform: `translate(${box.x}px, ${box.y}px)`
};
});
-
boxes3.value.forEach((box) => {
if (box.delay > 0) {
box.delay--;
return;
}
-
if (box.direction === 'up') {
box.y -= speed;
if (box.y <= maxY3) {
@@ -289,37 +267,35 @@
});
requestAnimationFrame(animate);
};
-
</script>
<template>
<div style="height: 500px;">
-
<div class="awatch">
<div class="img-screen" alt="Screen">
<!-- 閽㈠寲鑹插潡 -->
- <div v-if="temperingGlassInfoList>0" class="tempering" style="width: 50px;height: 22px;top: 354px;left: 228px;position: absolute;background-color: red;"></div>
- <div v-if="temperingGlassInfoList>1" class="tempering" style="width: 50px;height: 22px;top: 354px;left: 284px;position: absolute;background-color: red;"></div>
+ <div v-if="temperingGlassInfoList>0" class="tempering" style="width: 50px;height: 22px;top: 354px;left: 228px;position: absolute;background-color: #911005;"></div>
+ <div v-if="temperingGlassInfoList>1" class="tempering" style="width: 50px;height: 22px;top: 354px;left: 284px;position: absolute;background-color: #911005;"></div>
<!-- 鍒囧壊鍙拌壊鍧� -->
- <div v-if="engineeringOne.length>1" class="slicing" style="width: 50px;height: 22px;top: 575px;left: 453px;position: absolute;background-color: red;"></div>
- <div v-if="engineeringTwo.length>1" class="slicing" style="width: 50px;height: 22px;top: 625px;left: 453px;position: absolute;background-color: red;"></div>
+ <div v-if="engineeringOne.length>1" class="slicing" style="width: 50px;height: 22px;top: 575px;left: 453px;position: absolute;background-color: #911005;"></div>
+ <div v-if="engineeringTwo.length>1" class="slicing" style="width: 50px;height: 22px;top: 625px;left: 453px;position: absolute;background-color: #911005;"></div>
<!-- 鍘熺墖浠撳偍鑹插潡 -->
<div class="raw" style="width: 31px;height: 32px;top: 571px;left: 300px;position: absolute;">
- <div v-for="(item,index) in rawGlassStorageDetailList.slice(0,7)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: red;"'></div>
+ <div v-for="(item,index) in rawGlassStorageDetailList.slice(0,7)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: #911005;"'></div>
</div>
<div class="raw" style="width: 31px;height: 47px;top: 610px;left: 300px;position: absolute;">
- <div v-for="(item,index) in rawGlassStorageDetailList.slice(8,17)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: red;"'></div>
+ <div v-for="(item,index) in rawGlassStorageDetailList.slice(8,17)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: #911005;"'></div>
</div>
<div class="raw" style="width: 31px;height: 13px;top: 675px;left: 300px;position: absolute;">
- <div v-for="(item,index) in rawGlassStorageDetailList.slice(18,20)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: red;"'></div>
+ <div v-for="(item,index) in rawGlassStorageDetailList.slice(18,20)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: #911005;"'></div>
</div>
<div class="raw" style="width: 31px;height: 22px;top: 657px;left: 370px;position: absolute;">
- <div v-for="(item,index) in rawGlassStorageDetailList.slice(21,25)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: red;"'></div>
+ <div v-for="(item,index) in rawGlassStorageDetailList.slice(21,25)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: #911005;"'></div>
</div>
<div class="raw" style="width: 31px;height: 9px;top: 561px;left: 370px;position: absolute;">
- <div v-for="(item,index) in rawGlassStorageDetailList.slice(26,27)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: red;"'></div>
+ <div v-for="(item,index) in rawGlassStorageDetailList.slice(26,27)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: #911005;"'></div>
</div>
<div class="raw" style="width: 31px;height: 9px;top: 612px;left: 370px;position: absolute;">
- <div v-for="(item,index) in rawGlassStorageDetailList.slice(28,29)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: red;"'></div>
+ <div v-for="(item,index) in rawGlassStorageDetailList.slice(28,29)" :key="index" :style='"width: "+(item.remainQuantity / 5)+"px;height: 5px;background-color: #911005;"'></div>
</div>
<!-- 纾ㄨ竟鑹插潡 -->
<div class="container" style="position: relative;width: 20px;height: 20px;top: 572px;left: 645px;border: 1px solid #000;position: absolute;">
@@ -332,8 +308,8 @@
<div class="container" style="position: relative;width: 20px;height: 20px;top: 438px;left: 196px;border: 1px solid #000;position: absolute;">
<div v-for="(box, index) in boxes3" :key="index" class="box1" :style="box.style"></div>
</div>
- <!-- <div class="raw" style="width: 31px;height: 32px;top: 571px;left: 300px;position: absolute;background-color: red;">
- <div v-for="(item,index) in rawGlassStorageDetailList.slice(0,7)" :key="index" :style='"width: "+item.remainQuantity+"px;height: 5px;background-color: red;"'></div>
+ <!-- <div class="raw" style="width: 31px;height: 32px;top: 571px;left: 300px;position: absolute;background-color: #911005;">
+ <div v-for="(item,index) in rawGlassStorageDetailList.slice(0,7)" :key="index" :style='"width: "+item.remainQuantity+"px;height: 5px;background-color: #911005;"'></div>
</div> -->
</div>
<div class="clickable-area" @click="handlehistorical"
@@ -445,19 +421,16 @@
line-height: 20px;
margin-left: 100px;
}
-
#dta {
display: block;
float: left;
line-height: 20px;
margin-left: 80%;
}
-
#dialog-footer {
text-align: center;
margin-top: -15px;
}
-
#message {
text-align: center;
align-items: center;
@@ -467,11 +440,9 @@
background-color: #337ecc;
margin-left: 28%;
}
-
#awatch {
height: 460px;
}
-
.img-screen {
max-width: 48%;
max-height: 100%;
@@ -488,7 +459,6 @@
height: 0;
padding-bottom: 50%; */
}
-
.clickable-area {
cursor: pointer;
/* 鎸囩ず杩欐槸涓�涓彲鐐瑰嚮鐨勫尯鍩� */
@@ -497,11 +467,9 @@
line-height: 95px;
/* 濡傛灉闇�瑕侊紝浣挎枃鏈瀭鐩村眳涓� */
}
-
/* .awatch{
height: 460px;
/* max-width: 100%; */
-
.box {
transition: transform 0.016s linear;
}
--
Gitblit v1.8.0