fix 设备数据试试更新

pom.xml

@@ -18,7 +18,7 @@
         <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
         <maven.test.skip>true</maven.test.skip>
         <resource.delimiter>@</resource.delimiter>
-        <maven.build.timestamp.format>yyyyMMddHHmmss</maven.build.timestamp.format>
+        <maven.build.timestamp.format>yyyyMMdd</maven.build.timestamp.format>
         <!-- 依赖 -->
         <hutool.version>5.8.16</hutool.version>
         <spring-boot.version>3.1.5</spring-boot.version>
@@ -213,6 +213,7 @@
                     <version>3.3.0</version>
                     <configuration>
                         <appendAssemblyId>false</appendAssemblyId>
+                        <finalName>${project.build.finalName}-${maven.build.timestamp}</finalName>
                         <descriptors>
                             <descriptor>src/assembly/assembly.xml</descriptor>
                         </descriptors>

train-web/src/pages/device/DeviceAfc.vue

@@ -4,8 +4,7 @@
 <script setup lang="ts">
 import imageUrl from '@/assets/images/backage-afc.png'
 import { DeviceIcon, DeviceItem, AFC_GATE_MACHINE, AFC_TICKETING_AUTO } from "@/types/device";
-import { deviceAll } from "@/api/device";
-
+import { StoreDevices } from '@/store/modules/devices.ts'
 const devices = reactive<DeviceIcon[]>([
   { icon: "客服中心", name: "", size: 30, statusColor: "#000", style: "left: 216px;top: 276px;" },
   { icon: "客服中心", name: "", size: 30, statusColor: "#000", style: "left: 216px;top: 310px;" },
@@ -25,8 +24,8 @@ const devices = reactive<DeviceIcon[]>([
   { command: AFC_GATE_MACHINE, icon: "闸机", code: "AGM0208", size: 30, statusColor: "#00FF00", style: "left: 798px;top:362px" },
 ]);
 
-const getDevice = async function () {
-  const deviceList = (await deviceAll()).data as DeviceItem[];
+const getDevice = function () {
+  const deviceList: DeviceItem[] = StoreDevices().getDeviceArray;
   for (let i = 0; i < devices.length; i++) {
     const deviceItem = devices[i];
     const matchedDevice = deviceList.find(item => item.code === deviceItem.code);
@@ -44,4 +43,5 @@ const getDevice = async function () {
   }
 }
 onMounted(getDevice);
+watch(() => StoreDevices().getDeviceArray, () => { getDevice(); })
 </script>

train-web/src/pages/device/DeviceElevator.vue

@@ -4,7 +4,7 @@
 <script setup lang="ts">
 import imageUrl from '@/assets/images/backage-elevator.png'
 import { DeviceIcon, DeviceItem, ELEVATOR_HAND_COMMAND } from "@/types/device";
-import { deviceAll } from "@/api/device";
+import { StoreDevices } from '@/store/modules/devices.ts'
 
 const devices = reactive<DeviceIcon[]>([
   { command: ELEVATOR_HAND_COMMAND, icon: "电梯", size: 90, code: "FT-02A1", statusColor: "#000", style: "left: 622px;top: 400px;" },
@@ -17,7 +17,7 @@ const devices = reactive<DeviceIcon[]>([
 ]);
 
 const getDevice = async function () {
-  const deviceList = (await deviceAll()).data as DeviceItem[];
+  const deviceList: DeviceItem[] = StoreDevices().getDeviceArray;
   for (let i = 0; i < devices.length; i++) {
     const deviceItem = devices[i];
     const matchedDevice = deviceList.find(item => item.code === deviceItem.code);
@@ -35,4 +35,5 @@ const getDevice = async function () {
   }
 }
 onMounted(getDevice);
+watch(() => StoreDevices().getDeviceArray, () => { getDevice(); })
 </script>

train-web/src/pages/device/DeviceTest.vue

@@ -1,4 +1,5 @@
 <template>
+  <div style="text-align: center;">{{ '单机测试' }}</div>
   <div class="box">
     <el-tabs tab-position="left" style="height: 500px" class="demo-tabs">
       <el-tab-pane v-for="(device, deviceIndex) in deviceList" :key="deviceIndex" :label="device.aliasName">
@@ -27,7 +28,7 @@ onMounted(async () => {
 </script>
 <style scoped lang="scss">
 .box {
-  width: 1200px;
+  width: 90%;
   height: 650px;
   border: 1px solid #A7C0DF;
   overflow: hidden;
@@ -35,7 +36,7 @@ onMounted(async () => {
   overflow: auto;
 
   .device-table {
-    width: 900px;
+    min-width: 900px;
     margin-left: 20px;
   }
 }

train-web/src/pages/device/index.vue

@@ -12,9 +12,6 @@
     <el-tab-pane label="电扶梯设备仿真" name="elevator">
       <device-elevator />
     </el-tab-pane>
-    <el-tab-pane label="测试设备" name="deviceTest">
-      <device-test></device-test>
-    </el-tab-pane>
   </el-tabs>
 </template>
 <script lang="ts" setup>
@@ -22,7 +19,12 @@ import DeviceAfc from "./DeviceAfc.vue";
 import DeviceWater from "./DeviceWater.vue";
 import DeviceDoor from "./DeviceDoor.vue";
 import DeviceElevator from "./DeviceElevator.vue";
-import DeviceTest from "./DeviceTest.vue"
+import { StoreDevices } from '@/store/modules/devices.ts'
 
+// 默认的选项卡
 const activeName = ref('afcDevice')
+
+// 初始化加载设备
+const storeDevices = StoreDevices();
+storeDevices.loadDeviceAll();
 </script>

train-web/src/router/index.ts

@@ -25,6 +25,10 @@ const routes = [
         component: () => import("@/pages/situation/index.vue")
       }
     ],
+  }, {
+    path: "/test",
+    name: "测试界面",
+    component: () => import("@/pages/device/DeviceTest.vue"),
   }, {
     path: "/:pathMatch(.*)*",
     component: () => import("@/pages/404.vue"),

train-web/src/store/modules/devices.ts

@@ -1,10 +1,35 @@
 import { defineStore } from "pinia";
+import { DeviceItem } from "@/types/device";
+import { deviceAll } from "@/api/device";
 
 export const StoreDevices = defineStore("devices", {
   state: () => {
-    return {};
+    return {
+      deviceArray: [] as Array<DeviceItem>,
+    };
+  },
+  getters: {
+    getDeviceArray(): DeviceItem[] {
+      return this.deviceArray;
+    },
+  },
+  actions: {
+    async loadDeviceAll() {
+      const { data } = await deviceAll();
+      this.deviceArray = (data || []).sort((a, b) => {
+        if (a.command < b.command) return -1;
+        if (a.command > b.command) return 1;
+        return 0;
+      });
+    },
+    updateDevice(device: DeviceItem) {
+      const devices = this.deviceArray.filter((item) => item.id !== device.id);
+      this.deviceArray = [...devices, device].sort((a, b) => {
+        if (a.command < b.command) return -1;
+        if (a.command > b.command) return 1;
+        return 0;
+      });
+    },
   },
-  getters: {},
-  actions: {},
   persist: true,
 });

train-web/src/store/socket.ts

@@ -1,6 +1,8 @@
 import { defineStore } from "pinia";
 import SocketClient from "@/types/WebSocketClient";
 import { CommandEnum, RouteItem, TrainItem } from '@/types/train-travel'
+import { deviceCammandList } from '@/types/device';
+import { StoreDevices } from '@/store/modules/devices.ts'
 
 interface WebSocketState {
   client: SocketClient<string> | null;
@@ -45,7 +47,11 @@ export const useStoreSocket = defineStore("websocket", {
               this.routeList = [...routeList];
               break;
             default:
-              console.log("未知的消息类型：" + result.cmd + ", message: " + JSON.stringify(result));
+              if (deviceCammandList.indexOf(result.cmd) !== -1) {
+                StoreDevices().loadDeviceAll();
+              } else {
+                console.log("未知的消息类型：" + result.cmd + ", message: " + JSON.stringify(result));
+              }
           }
         } catch (error) {
           console.log("websoeckt消息解析失败, massgae: " + data, ", error:" + error);

train-web/src/types/auto-imports.d.ts

@@ -309,7 +309,6 @@ import { UnwrapRef } from 'vue'
 declare module 'vue' {
   interface ComponentCustomProperties {
     readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
-    readonly ElNotification: UnwrapRef<typeof import('element-plus/es')['ElNotification']>
     readonly acceptHMRUpdate: UnwrapRef<typeof import('pinia')['acceptHMRUpdate']>
     readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>
     readonly autoResetRef: UnwrapRef<typeof import('@vueuse/core')['autoResetRef']>
@@ -605,7 +604,6 @@ declare module 'vue' {
 declare module '@vue/runtime-core' {
   interface ComponentCustomProperties {
     readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
-    readonly ElNotification: UnwrapRef<typeof import('element-plus/es')['ElNotification']>
     readonly acceptHMRUpdate: UnwrapRef<typeof import('pinia')['acceptHMRUpdate']>
     readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>
     readonly autoResetRef: UnwrapRef<typeof import('@vueuse/core')['autoResetRef']>

train-web/src/types/components.d.ts

@@ -22,7 +22,6 @@ declare module 'vue' {
     ElRadio: typeof import('element-plus/es')['ElRadio']
     ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElSelect: typeof import('element-plus/es')['ElSelect']
-    ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
     ElTabPane: typeof import('element-plus/es')['ElTabPane']

train-web/src/types/device.ts

@@ -320,7 +320,7 @@ export const ELEVATOR_HAND_COMMAND: DeviceType = {
   ]
 };
 
-const deviceTypeArray: DeviceType[] = [
+export const deviceTypeArray: DeviceType[] = [
   TRAIN_OPEN_DOOR,
   PLATFORM_PRESSING_STOP,
   AFC_GATE_MACHINE,
@@ -346,6 +346,8 @@ const deviceTypeArray: DeviceType[] = [
   ELEVATOR_HAND_COMMAND,
 ];
 
+export const deviceCammandList = deviceTypeArray.map((item) => item.command);
+
 export const deviceTypeSocket = deviceTypeArray.filter((item) => item.command.toString().startsWith("2"));