From f44c449c2f5ec5439d7df4145a28bc878018ba2b Mon Sep 17 00:00:00 2001 From: wuyouming666 <2265557248@qq.com> Date: 星期三, 15 五月 2024 15:33:02 +0800 Subject: [PATCH] 前端工位显示 --- UI-Project/src/views/UnLoadGlass/Landingindication.vue | 89 ++++++++++++++++++++++++++------------------ 1 files changed, 52 insertions(+), 37 deletions(-) diff --git a/UI-Project/src/views/UnLoadGlass/Landingindication.vue b/UI-Project/src/views/UnLoadGlass/Landingindication.vue index ca6a564..e9bd3c7 100644 --- a/UI-Project/src/views/UnLoadGlass/Landingindication.vue +++ b/UI-Project/src/views/UnLoadGlass/Landingindication.vue @@ -4,7 +4,7 @@ <svg width="500" height="500" xmlns="http://www.w3.org/2000/svg"> <g stroke="null" id="Layer_1"> <!-- 浣跨敤 v-for 寰幆娓叉煋鏁版嵁 --> - <g v-for="(rack, index) in racks" :key="index"> + <g v-for="(rack, index) in racks" :key="index" :data="tableData"> <rect :x="rack.x" :y="rack.y" @@ -31,17 +31,22 @@ </div> </template> -<script setup> +<script setup> +import { ref, watchEffect } from 'vue'; import Swal from 'sweetalert2' import request from "@/utils/request"; -const racks = [ +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: 30, width: 20, fillColor: 'yellow', content: 'NG12345678' } }, + { 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: 30, width: 100, fillColor: 'yellow', content: 'NG1234561454' } } + { x: 140, y: 420, height: 60, width: 110, fillColor: '#6a6da9', item: { height: 20, width: 100, fillColor: 'yellow', content: 'NG1234561454' } } -]; +]); + +watchEffect(() => { + // 瑙﹀彂鏁版嵁鍙樺寲鏃堕噸鏂版覆鏌� +}); const calculateItemXPosition = (rack, item, index) => { @@ -68,25 +73,35 @@ const fetchFlowCardId = async () => { try { const response = await request.get('unLoadGlass/downWorkStation/getwo'); - console.log(response) + if (response.code === 200) { - console.log(response.data); + console.log(response); // 閬嶅巻鍝嶅簲鏁版嵁骞舵浛鎹acks鏁扮粍涓殑item灞炴�� response.data.forEach((itemData, index) => { - if (index < racks.length) { - const rack = racks[index]; - const newItem = { - content: itemData.item.content, - fillColor: itemData.item.fillColor, - width: itemData.item.width/10000, - height: itemData.item.height/10000 - }; - rack.item == newItem; - - } - }); + if (index < racks.value.length) { + const rack = racks.value[index]; + const newItem = { + content: itemData.item.content, + fillColor: itemData.item.fillColor, + width: itemData.item.width === "" ? "" : 10, + height: itemData.item.height === "" ? "" : 90 + }; + + if (index === 2 && itemData.item.width > 0) { + newItem.width = 100; + newItem.height = 20; + } + + rack.item = newItem; + + console.log(racks.value); // 鎵撳嵃鏇存柊鍚庣殑 racks 鍊� + } +}); + + + - console.log(racks); // 鏌ョ湅鏇存柊鍚庣殑racks鏁扮粍 + } else { ElMessage.error(response.msg); } @@ -97,25 +112,25 @@ fetchFlowCardId() // setTimeout(fetchFlowCardId(),1000); - +//setInterval(fetchFlowCardId, 2000) -const showCustomAlert = (content) => { - var str="鏋跺彿 : 111\n" + - "闀� : 111\n" + - "瀹� : 111\n" + - "鍘� : 111\n"+ - "鐜荤拑ID : 111\n"+ - "鑶滅郴 : 111\n"; +// const showCustomAlert = (content) => { +// var str="鏋跺彿 : 111\n" + +// "闀� : 111\n" + +// "瀹� : 111\n" + +// "鍘� : 111\n"+ +// "鐜荤拑ID : 111\n"+ +// "鑶滅郴 : 111\n"; - Swal.fire({ - title: '鐜荤拑淇℃伅', - html: '<pre>' + str + '</pre>', - customClass: { - popup: 'format-pre' - } - }); -}; +// Swal.fire({ +// title: '鐜荤拑淇℃伅', +// html: '<pre>' + str + '</pre>', +// customClass: { +// popup: 'format-pre' +// } +// }); +// }; const showRectInfo = (rectInfo) => { const content = rectInfo.item.content; -- Gitblit v1.8.0