From f2ea663c986c5309a6b1d3f283c13bd312ecbed7 Mon Sep 17 00:00:00 2001
From: wangfei <3597712270@qq.com>
Date: 星期三, 17 七月 2024 13:52:17 +0800
Subject: [PATCH] 图片测试
---
UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue | 73 +++++++++++++++++++++++-------------
1 files changed, 46 insertions(+), 27 deletions(-)
diff --git a/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue b/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
index cf75a2e..c42fbe5 100644
--- a/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
+++ b/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
@@ -1,7 +1,7 @@
<template>
<div class="glass-rack">
<div >
- <svg width="500" height="500" xmlns="http://www.w3.org/2000/svg">
+ <svg width="500" height="370" xmlns="http://www.w3.org/2000/svg">
<g stroke="null" id="Layer_1">
<!-- 浣跨敤 v-for 寰幆娓叉煋鏁版嵁 -->
<g v-for="(rack, index) in racks" :key="index">
@@ -22,7 +22,7 @@
:height="rack.item.height"
:fill="rack.item.fillColor"
/>
- <text :x="rack.x + rack.width / 2" :y="rack.y - 10" text-anchor="middle">{{ index + 4 }}鍙峰伐浣�</text>
+ <text :x="rack.x + rack.width / 2" :y="rack.y - 10" text-anchor="middle">{{ index + 4 }}{{ $t('reportWork.workstation') }}</text>
<text :x="rack.x + rack.width / 2" :y="rack.y + rack.height + 20" text-anchor="middle">{{ rack.item.content }}</text>
</g>
</g>
@@ -34,16 +34,19 @@
<script setup>
import { ref, watchEffect ,onMounted} from 'vue';
+import { useI18n } from 'vue-i18n'
+ const { t } = useI18n()
+ let language = ref(localStorage.getItem('lang') || 'zh')
import Swal from 'sweetalert2'
import request from "@/utils/request";
import { initializeWebSocket } from '@/utils/WebSocketService';
- import { WebSocketHost } from '@/utils/constants';
+import { WebSocketHost ,host} from '@/utils/constants'
const racks = ref([
{ x: 50, y: 100, height: 100, width: 60, fillColor: '#6a6da9', item: { height: 90, width: 10, fillColor: 'yellow', content: 'NG123456' } },
{ x: 280, y: 100, height: 100, width: 60, fillColor: '#6a6da9', item: { height: 90, width: 10, fillColor: 'yellow', content: 'NG12345678' } },
- { x: 140, y: 420, height: 60, width: 110, fillColor: '#6a6da9', item: { height: 20, width: 100, fillColor: 'yellow', content: 'NG1234561454' } }
+ { x: 140, y: 280, height: 60, width: 110, fillColor: '#6a6da9', item: { height: 20, width: 100, fillColor: 'yellow', content: 'NG1234561454' } }
]);
@@ -112,7 +115,7 @@
}
};
-const socketUrl = `ws://${WebSocketHost}:8085/api/talk/unloadglass3`;
+const socketUrl = `ws://${WebSocketHost}:${host}/api/unLoadGlass/api/talk/unloadglass3`;
// 瀹氫箟娑堟伅澶勭悊鍑芥暟锛屾洿鏂� receivedData 鍙橀噺
const handleMessage = (data) => {
@@ -125,7 +128,8 @@
content: itemData.item.content,
fillColor: itemData.item.fillColor,
width: itemData.item.width === 0 ? "" : 10,
- height: itemData.item.height === 0 ? "" : 90
+ height: itemData.item.height === 0 ? "" : 90,
+ downGlassInfoList:itemData.item.downGlassInfoList
};
if (index === 2 && itemData.item.width > 0) {
@@ -146,37 +150,52 @@
fetchFlowCardId(); // 鑾峰彇鏁版嵁
initializeWebSocket(socketUrl, handleMessage);
});
+const showCustomAlert = (downGlassInfoList) => {
+ let tableContent = '<table border="1" style="border-collapse: collapse; width: 100%;">';
+ tableContent += '<tr><th style="background-color: #f2f2f2;">鐜荤拑ID</th><th style="background-color: #f2f2f2;">鑶滅郴</th><th style="background-color: #f2f2f2;">鍘氬害</th><th style="background-color: #f2f2f2;">瀹藉害</th><th style="background-color: #f2f2f2;">楂樺害</th></tr>';
+ downGlassInfoList.forEach(info => {
+ tableContent += `<tr>
+ <td>${info.glassId}</td>
+ <td>${info.Filmsid}</td>
+ <td>${info.thickness}</td>
+ <td>${info.width}</td>
+ <td>${info.height}</td>
+ </tr>`;
+ });
-// const showCustomAlert = (content) => {
-// var str="鏋跺彿 : 111\n" +
-// "闀� : 111\n" +
-// "瀹� : 111\n" +
-// "鍘� : 111\n"+
-// "鐜荤拑ID : 111\n"+
-// "鑶滅郴 : 111\n";
+ tableContent += '</table>';
-// Swal.fire({
-// title: '鐜荤拑淇℃伅',
-// html: '<pre>' + str + '</pre>',
-// customClass: {
-// popup: 'format-pre'
-// }
-// });
-// };
-
-const showRectInfo = (rectInfo) => {
- const content = rectInfo.item.content;
- showCustomAlert(content);
+ Swal.fire({
+ title: t('reportWork.glassinformation'),
+ // title: '鐜荤拑淇℃伅',
+ html: tableContent,
+ customClass: {
+ popup: 'format-pre'
+ }
+ });
};
+
+ const showRectInfo = (rack) => {
+ const content = rack.item.content;
+ console.log(rack.item.downGlassInfoList[0].flowCardId)
+ console.log(content)
+ if(content==rack.item.downGlassInfoList[0].flowCardId){
+ const downGlassInfoList = rack.item.downGlassInfoList;
+ console.log(downGlassInfoList)
+ showCustomAlert(downGlassInfoList);
+
+ }
+
+ };
</script>
<style scoped>
.glass-rack {
- margin-left: 20px;
+ /* margin-left: 20px; */
width: 500px;
- margin-top: 10px;
+ margin-top: 5px;
}
.rack-rect:hover {
cursor: pointer;
--
Gitblit v1.8.0