代码调整

src/drawApp/graphics/PlatformInteraction.ts

@@ -207,6 +207,12 @@ export class PlatformState extends GraphicStateBase implements IPlatformState {
   set rtuId(value: number) {
     this.states.rtuId = value;
   }
+  get bizWaitTimeSec(): number {
+    return this.states.bizWaitStartTimeSec;
+  }
+  set bizWaitTimeSec(value: number) {
+    this.states.bizWaitStartTimeSec = value;
+  }
   get states(): state.Platform {
     return this.getState<state.Platform>();
   }

src/graphics/platform/Platform.ts

@@ -11,6 +11,7 @@ import {
 } from 'jl-graphic';
 import { Station } from '../station/Station';
 import { Section } from '../section/Section';
+import { useLineStore } from 'src/stores/line-store';
 
 export interface IPlatformData extends GraphicData {
   get code(): string; // 编号
@@ -66,6 +67,8 @@ export interface IPlatformState extends GraphicState {
   set stopTime(v: number);
   get rtuId(): number; // 集中站站号
   set rtuId(v: number);
+  get bizWaitTimeSec(): number; //乘客等待秒数
+  set bizWaitTimeSec(v: number);
 }
 
 //站台颜色
@@ -189,6 +192,8 @@ class codeGraph extends Container {
   runLevel: VectorText = new VectorText(''); //运行等级
   runTime: VectorText = new VectorText(''); //运行时间
   stopTime: VectorText = new VectorText(''); //停站时间
+  waitSec: VectorText = new VectorText(); //VectorText
+
   circle: Graphics = new Graphics();
   constructor() {
     super();
@@ -197,12 +202,14 @@ class codeGraph extends Container {
     this.addChild(this.circle);
     this.addChild(this.stopTime);
     this.addChild(this.runTime);
+    this.addChild(this.waitSec);
     this.character.setVectorFontSize(platformConsts.besideFontSize);
     this.runLevel.setVectorFontSize(platformConsts.besideFontSize);
     this.stopTime.setVectorFontSize(platformConsts.besideFontSize);
     this.runTime.setVectorFontSize(platformConsts.besideFontSize);
+    this.waitSec.setVectorFontSize(platformConsts.besideFontSize);
   }
-  draw(): void {
+  draw(datas: IPlatformData): void {
     //扣车
     const character = this.character;
     character.text = 'H';
@@ -254,11 +261,25 @@ class codeGraph extends Container {
       platformConsts.besideSpacing
     );
     stopTime.style.fill = PlatformColorEnum.whiteNumbers;
+    //乘客等待时间
+    const waitSec = this.waitSec;
+
+    waitSec.anchor.set(0.5);
+    let yPos = platformConsts.height / 2 + platformConsts.doorPlatformSpacing;
+
+    if (datas.direction == 'down') {
+      yPos = -platformConsts.height / 2 - platformConsts.doorPlatformSpacing;
+    }
+    waitSec.position.set(0, yPos);
+
+    waitSec.style.fill = PlatformColorEnum.whiteNumbers;
+
     character.visible = false;
     circle.visible = false;
     runLevel.visible = false;
     stopTime.visible = false;
     runTime.visible = false;
+    waitSec.visible = false;
   }
   clear(): void {
     this.character.destroy();
@@ -309,6 +330,21 @@ class codeGraph extends Container {
       this.stopTime.visible = true;
       this.stopTime.text = stateData.stopTime;
     }
+    if (stateData.bizWaitTimeSec && useLineStore().faultStatistics) {
+      const minutes = Math.floor(stateData.bizWaitTimeSec / 60);
+      const seconds = stateData.bizWaitTimeSec % 60;
+      let minutesString = '' + minutes;
+      let secondsString = '' + seconds;
+      if (minutes < 10) {
+        minutesString = `0${minutes}`;
+      }
+      if (seconds < 10) {
+        secondsString = `0${seconds}`;
+      }
+
+      this.waitSec.visible = true;
+      this.waitSec.text = `乘客已经等待了${minutesString}:${secondsString}`;
+    }
   }
 }
 //子元素--站台旁菱形图标
@@ -388,7 +424,7 @@ export class Platform extends JlGraphic {
     }
     this.platformGraphic.draw(this.states);
     this.besideGraphic.draw();
-    this.codeGraph.draw();
+    this.codeGraph.draw(this.datas);
 
     this.doorGraphic.position.set(
       0,

src/layouts/MainLayout.vue

@@ -52,7 +52,7 @@
             @click="backConfirm"
           />
           <q-toggle
-            v-model="faultStatistics"
+            v-model="lineStore.faultStatistics"
             checked-icon="check"
             color="red"
             label="故障信息统计"
@@ -156,7 +156,6 @@ const router = useRouter();
 const route = useRoute();
 const lineStore = useLineStore();
 const lineNetStore = useLineNetStore();
-const faultStatistics = ref(false);
 
 watch(
   () => route.path,

src/pages/LineMonitorPage.vue

@@ -3,14 +3,40 @@
     <q-page-container style="padding: 0; overflow: hidden">
       <div id="line-app-container"></div>
     </q-page-container>
+    <div
+      v-if="faultInfo"
+      style="position: fixed; right: 0; top: 10%; background: white"
+    >
+      <div style="width: 100%; text-align: right" class="bg-primary q-pa-ms">
+        <q-icon
+          name="close"
+          size="xs"
+          style="cursor: pointer"
+          @click="() => (faultInfo = false)"
+        />
+      </div>
+      <div class="q-pa-ms column" style="background: white">
+        <template v-for="(item, index) in timeInfoLabel" :key="index">
+          <q-chip
+            removable
+            @remove="handleRemoveInfo(index)"
+            color="primary"
+            text-color="white"
+            square
+            :label="item"
+          />
+        </template>
+      </div>
+    </div>
   </q-page>
 </template>
 
 <script setup lang="ts">
-import { onMounted, onUnmounted, watch } from 'vue';
+import { onMounted, onUnmounted, watch, ref, reactive } from 'vue';
 import { useLineStore } from 'src/stores/line-store';
 import { useRoute } from 'vue-router';
-import { useLineNetStore } from 'src/stores/line-net-store';
+import { AlarmInfo, useLineNetStore } from 'src/stores/line-net-store';
+import { showAlertTypeData } from 'src/components/alarm/alarmInfoEnum';
 
 const props = withDefaults(
   defineProps<{
@@ -22,6 +48,10 @@ const props = withDefaults(
 const route = useRoute();
 const lineStore = useLineStore();
 const lineNetStore = useLineNetStore();
+const faultInfo = ref(false);
+const alarmInfoList: AlarmInfo[] = reactive([]);
+let timeInterval = null;
+let timeInfoLabel: string[] = reactive([]);
 
 watch(
   () => props.sizeHeight,
@@ -36,11 +66,40 @@ watch(
   }
 );
 
+watch(
+  () => faultInfo.value,
+  () => {
+    if (!faultInfo.value) {
+      alarmInfoList.splice(0, 1);
+      timeInfoLabel.splice(0);
+      timeInterval = null;
+    } else {
+      timeInterval = setInterval(() => {
+        const now = Date.now();
+        // const labels: string[] = [];
+        timeInfoLabel.splice(0);
+        alarmInfoList.forEach((info) => {
+          const date = info.alert_time.substring(0, 19).replace('T', ' ');
+          let infoTime = new Date(date).getTime();
+          console.log(date, new Date(date), infoTime, now, 'now');
+          const distance = formatTime((now - infoTime) / 1000);
+          const label = handleShowLabel(info);
+          timeInfoLabel.push(label + '--' + distance);
+        });
+      }, 1000);
+    }
+  }
+);
+
 watch(
   () => lineNetStore.alarmInfo,
   (val) => {
     if (val.length) {
       centerFaultDevice();
+      val.forEach((info) => {
+        alarmInfoList.push(info);
+      });
+      faultInfo.value = true;
     }
   }
 );
@@ -80,7 +139,41 @@ function centerFaultDevice() {
   }
 }
 
+function handleShowLabel(alarmInfo: AlarmInfo) {
+  const type = (showAlertTypeData as never)[alarmInfo.alert_type + ''];
+  const device = alarmInfo.alert_object.replace(/\[|]/g, '');
+  return device + '[' + type + ']';
+}
+
+function handleRemoveInfo(index: number) {
+  alarmInfoList.splice(index, 1);
+  timeInfoLabel.splice(index, 1);
+  if (!alarmInfoList.length) {
+    faultInfo.value = false;
+  }
+  console.log(alarmInfoList, faultInfo.value);
+}
+
+function formatTime(seconds: number) {
+  // 确保输入是整数
+  seconds = Math.floor(seconds);
+
+  // 计算小时、分钟和秒
+  const hours = Math.floor(seconds / 3600);
+  const minutes = Math.floor((seconds % 3600) / 60);
+  const secs = (seconds % 3600) % 60;
+  console.log(hours, minutes, secs, seconds, 'sec');
+  // 确保小时、分钟和秒都是两位数
+  const hours1 = String(hours).padStart(2, '0');
+  const minutes1 = String(minutes).padStart(2, '0');
+  const secs1 = String(secs).padStart(2, '0');
+
+  // 返回格式化的时间字符串
+  return `${hours1}:${minutes1}:${secs1}`;
+}
+
 onUnmounted(() => {
   lineStore.cancelSubscribe();
+  timeInterval = null;
 });
 </script>

src/stores/line-store.ts

@@ -13,6 +13,7 @@ export const useLineStore = defineStore('line', {
     selectedGraphics: null as JlGraphic[] | null,
     lineId: null as number | null,
     lineName: null as string | null,
+    faultStatistics: false,
   }),
   getters: {
     selectedGraphicType: (state) => {

xian-ncc-da-message

@@ -1 +1 @@
-Subproject commit c1bd5beb501ab675459a5ef58d823c0f86be9000
+Subproject commit 0f95f00449d14672b382f03727b34e339131786b