From f2bc826bab59608999281d15924d61b9c4adfd97 Mon Sep 17 00:00:00 2001
From: guoapeng <GuoAnPeng@163.com>
Date: Sun, 11 May 2025 21:57:34 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=B7=A5=E8=89=BA=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.prod                          |  2 +-
 src/components/home/Tube/index.vue | 72 ++++++++++++++++++++++++++++++++++----
 src/stores/systemStore.ts          | 59 ++++++++++++++++++++++++++++---
 src/types/system.d.ts              |  9 +++++
 4 files changed, 130 insertions(+), 12 deletions(-)

diff --git a/.env.prod b/.env.prod
index c1d9016..0a20bef 100644
--- a/.env.prod
+++ b/.env.prod
@@ -3,5 +3,5 @@
 FT_NODE_ENV=prod
 
 FT_WS_URL=ws://192.168.8.168:8080/ws
-FT_PROXY=http://192.168.8.88:8080
+FT_PROXY=http://192.168.8.168:8080
 FT_API_BASE=/api
\ No newline at end of file
diff --git a/src/components/home/Tube/index.vue b/src/components/home/Tube/index.vue
index e6c3d9d..b245e03 100644
--- a/src/components/home/Tube/index.vue
+++ b/src/components/home/Tube/index.vue
@@ -1,5 +1,10 @@
 <script setup lang="ts">
+import errorIcon from 'assets/images/error.svg'
+import ingIcon from 'assets/images/ing.svg'
+import successIcon from 'assets/images/success.svg'
+import waitIcon from 'assets/images/wait.svg'
 import { useHomeStore } from 'stores/homeStore'
+import { useSystemStore } from 'stores/systemStore'
 import { computed, ref } from 'vue'
 
 const props = withDefaults(defineProps<{ data: System.HeatArea }>(), {
@@ -7,14 +12,16 @@ const props = withDefaults(defineProps<{ data: System.HeatArea }>(), {
     moduleCode: 'heat_module_01',
     trayStatus: 0,
     heating: false,
-    capStatus: false,
+    capExist: false,
     temperature: 0,
+    targetTemperature: 0,
   }),
 })
 
 const emits = defineEmits(['selectChange', 'setTemperature'])
 
 const homeStore = useHomeStore()
+const systemStore = useSystemStore()
 const mousedownHandle = (e: Event) => {
   let event
   if ('touches' in e) {
@@ -39,6 +46,10 @@ const hearInfo = computed(() => {
   return homeStore.heatAreaList.find(item => item.value === props.data.moduleCode)
 })
 
+const craft = computed(() => {
+  return systemStore.systemStatus.tray.find(item => item.heatModuleId === props.data.moduleCode)?.crafts
+})
+
 const setTemperature = () => {
   emits('setTemperature', props.data.moduleCode)
 }
@@ -50,12 +61,26 @@ defineExpose({
 
 <template>
   <div class="tube" :class="{ 'tube-active': hearInfo?.selected, 'tube-shadow': data.trayStatus === 2 }">
-    <!--    <div -->
-    <!--      class="status" :class="{ 'status-success': false, 'status-wait': false, 'status-error': false, 'status-ing': false, -->
-    <!--      }" -->
-    <!--    > -->
-    <!--      <span>工艺执行中</span> -->
-    <!--    </div> -->
+    <div
+      v-if="data.trayStatus !== 0 && craft?.state"
+      class="status" :class="{
+        'status-success': false,
+        'status-wait': craft?.state === 'READY',
+        'status-error': craft?.state === 'ERROR',
+        'status-ing': craft?.state === 'RUNNING',
+      }"
+    >
+      <img v-if="craft?.state === 'FINISHED'" :src="successIcon" alt="">
+      <img v-if="craft?.state === 'RUNNING'" :src="ingIcon" alt="">
+      <img v-if="craft?.state === 'READY'" :src="waitIcon" alt="">
+      <img v-if="craft?.state === 'ERROR'" :src="errorIcon" alt="">
+
+      <span class="status-name">{{ craft?.craft?.name || ' ' }}</span>
+      <span v-if="craft?.state === 'RUNNING'" class="status-text">工艺执行中</span>
+      <span v-if="craft?.state === 'READY'" class="status-text">工艺等待执行</span>
+      <span v-if="craft?.state === 'ERROR'" class="status-text">工艺执行错误</span>
+      <span v-if="craft?.state === 'FINISHED'" class="status-text">工艺执行成功</span>
+    </div>
     <div class="header">
       <span>{{ hearInfo?.label }}</span>
       <span v-show="data.trayStatus === 0">空置</span>
@@ -117,6 +142,39 @@ defineExpose({
     height: 100%;
     background: rgba(255,255,255,0.9);
     z-index: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    border-radius: 10px;
+    img {
+      width: 50px;
+      margin: 30px 0 10px;
+    }
+    .status-name {
+      font-size: 14px;
+      margin: 10px 0 10px;
+    }
+    .status-text {
+      font-size: 16px;
+      font-weight: 700;
+    }
+  }
+  .status-wait {
+    background: rgba(242,235,231, 0.9);
+    border: 1px solid #EE8223;
+    color: #EE8223;
+
+  }
+  .status-error {
+    background: rgba(232,212,222, 0.9);
+    border: 1px solid #DF1515;
+    color: #DF1515;
+  }
+  .status-ing  {
+    background: rgba(205,223,255, 0.9);
+    border: 1px solid #3E3A39;
+    color: #3E3A39;
   }
   .header {
     display: flex;
diff --git a/src/stores/systemStore.ts b/src/stores/systemStore.ts
index 9c09748..d923ecc 100644
--- a/src/stores/systemStore.ts
+++ b/src/stores/systemStore.ts
@@ -77,7 +77,7 @@ export const useSystemStore = defineStore('system', {
       heatModule: [
         {
           moduleCode: 'heat_module_01',
-          trayStatus: 0,
+          trayStatus: 1,
           heating: false,
           capExist: false,
           temperature: 0,
@@ -101,7 +101,7 @@ export const useSystemStore = defineStore('system', {
         },
         {
           moduleCode: 'heat_module_04',
-          trayStatus: 0,
+          trayStatus: 2,
           heating: false,
           capExist: false,
           temperature: 0,
@@ -109,7 +109,7 @@ export const useSystemStore = defineStore('system', {
         },
         {
           moduleCode: 'heat_module_05',
-          trayStatus: 0,
+          trayStatus: 1,
           heating: false,
           capExist: false,
           temperature: 0,
@@ -124,7 +124,58 @@ export const useSystemStore = defineStore('system', {
           targetTemperature: 0,
         },
       ],
-      tray: [],
+      tray: [
+        {
+          uuid: '',
+          heatModuleId: 'heat_module_01',
+          inSolutionArea: false,
+          inHeatModule: true,
+          tubes: [
+            {
+              addSolution: true,
+              exists: true,
+            },
+          ],
+          crafts: {
+            state: 'READY',
+          },
+        },
+        {
+          uuid: '',
+          heatModuleId: 'heat_module_02',
+          inSolutionArea: false,
+          inHeatModule: true,
+          tubes: [
+            {
+              addSolution: true,
+              exists: true,
+            },
+          ],
+          crafts: {
+            state: 'RUNNING',
+            craft: {
+              id: 1,
+              name: '菱锌矿硫酸溶解法',
+              steps: '',
+            },
+          },
+        },
+        {
+          uuid: '',
+          heatModuleId: 'heat_module_03',
+          inSolutionArea: false,
+          inHeatModule: true,
+          tubes: [
+            {
+              addSolution: true,
+              exists: true,
+            },
+          ],
+          crafts: {
+            state: 'ERROR',
+          },
+        },
+      ],
     },
     systemUser: {
       username: '',
diff --git a/src/types/system.d.ts b/src/types/system.d.ts
index 2a6b3f7..46096cb 100644
--- a/src/types/system.d.ts
+++ b/src/types/system.d.ts
@@ -1,4 +1,6 @@
 declare namespace System {
+  import Craft = CraftTypes.Craft
+
   interface SystemStore {
     systemStatus: SystemStatus
     systemList: Socket.NotificationData[]
@@ -29,14 +31,21 @@ declare namespace System {
     tray: Tray[]
   }
   interface Tray {
+    uuid: string
     heatModuleId: 'heat_module_01' | 'heat_module_02' | 'heat_module_03' | 'heat_module_04' | 'heat_module_05' | 'heat_module_06'
     inSolutionArea: boolean
+    inHeatModule: boolean
     tubes: [
       {
         addSolution: boolean
         exists: boolean
       },
     ]
+    crafts: {
+      state: 'READY' | 'RUNNING' | 'PAUSED' | 'STOPPED' | 'ERROR' | 'FINISHED'
+      craft?: CraftTypes.Craft
+      currentIndex?: number
+    }
   }
   interface HeatArea {
     moduleCode: 'heat_module_01' | 'heat_module_02' | 'heat_module_03' | 'heat_module_04' | 'heat_module_05' | 'heat_module_06'