Merge branch 'master' of git.code.tencent.com:xian-ncc-da/xian-ncc-da-client

src/components/alarm/alarmInfoDialog.vue

@@ -1,5 +1,6 @@
 <template>
   <draggable-dialog
+    v-if="showDialog"
     seamless
     title="报警"
     :titleColor="`${bgColor}`"
@@ -17,18 +18,43 @@
             <q-separator />
             <div class="alarm-message-detail">
               <div class="left">
-                <div class="text">时间:{{ alarmInfo.time }}</div>
+                <div class="text">时间：{{ alarmInfo.time }}</div>
-                <div class="text">级别:{{ alarmInfo.level }}</div>
+                <div class="text">级别：{{ alarmInfo.level }}</div>
-                <div class="text">线路:{{ alarmInfo.lineId }}号线</div>
+                <div class="text">线路：{{ alarmInfo.lineId }}号线</div>
               </div>
               <div class="right">
-                <div class="text">设备:{{ alarmInfo.alertObject }}</div>
+                <div class="text">设备：{{ alarmInfo.alertObject }}</div>
-                <div class="text">类型:{{ alarmInfo.alertType }}</div>
+                <div class="text">类型：{{ alarmInfo.alertType }}</div>
               </div>
             </div>
           </q-card>
         </div>
-        <div class="decision-message">
+        <div class="confirm-message" v-if="showConfirmMmessage">
+          <q-card class="box-card">
+            <div class="head">选择故障类型</div>
+            <q-separator />
+            <div class="detail">
+              <q-select
+                style="width: 200px"
+                dense
+                outlined
+                v-model="faultType"
+                :options="faultTypeOptions"
+                label="故障类型"
+              />
+              <q-card-actions align="left">
+                <q-btn
+                  color="primary"
+                  class="q-mr-md"
+                  label="确认"
+                  @click="submitChooseType"
+                />
+                <q-btn color="primary" label="误报" @click="falsePositives" />
+              </q-card-actions>
+            </div>
+          </q-card>
+        </div>
+        <div class="decision-message" v-else>
           <q-card class="box-card">
             <div class="head">行车方面</div>
             <q-separator />
@@ -51,39 +77,28 @@
 
 <script setup lang="ts">
 import DraggableDialog from '../common/DraggableDialog.vue';
-import { useLineNetStore } from 'src/stores/line-net-store';
+import { useLineNetStore, AlarmInfo } from 'src/stores/line-net-store';
-import { onMounted, ref, watch } from 'vue';
+import { onMounted, ref } from 'vue';
 import { queryAlarmInfoById } from 'src/api/DecisionInfo';
 import { useQuasar } from 'quasar';
+import { showAlertTypeData } from './alarmInfoEnum';
+
+const props = defineProps({
+  alarmMeaasge: {
+    type: Object,
+  },
+});
 
 let bgColor = ref('');
 const dialogWidth = window.screen.width * 0.5;
 const lineNetStore = useLineNetStore();
-
+const showConfirmMmessage = ref(true);
-watch(
+const faultType = ref('');
-  () => lineNetStore.alarmInfo,
+const faultTypeOptions = [
-  (val) => {
+  { label: '道岔均失表', value: 'SWITCH_All_LOST' },
-    if (val.length) {
+  { label: '道岔定位失表', value: 'SWITCH_DW_LOST' },
-      search();
+  { label: '道岔反位失表', value: 'SWITCH_FW_LOST' },
-      updata();
+];
-    }
-  },
-  { deep: true }
-);
-
-const mapAlarmMessage = new Map([
-  ['I', 'I类信息'],
-  ['II', 'II类信息'],
-  ['III', 'III类信息'],
-  ['IV', 'IV类信息'],
-  ['0', '未知'],
-  ['1', '蓝显'],
-  ['2', '列车延误2分钟'],
-  ['3', '列车延误10分钟'],
-  ['4', '整侧站台门无关闭锁紧信号'],
-  ['5', '整侧站台门无法打开'],
-  ['6', '整侧站台门无法关闭'],
-]);
 
 const mapColor = new Map([
   ['I', 'rgb(250,61,46)'],
@@ -103,33 +118,43 @@ const alarmInfo = ref({
 });
 const drivingInfo = ref('');
 const submissionInfo = ref('');
+let messageUse: AlarmInfo;
+const showDialog = ref(true);
 
 onMounted(() => {
-  search();
+  if (props.alarmMeaasge == undefined) {
+    messageUse = lineNetStore.alarmInfo[0] as AlarmInfo;
+  } else {
+    messageUse = props.alarmMeaasge as AlarmInfo;
+  }
   updata();
 });
 
+function submitChooseType() {
+  showConfirmMmessage.value = false;
+  search();
+}
+
+function falsePositives() {
+  showDialog.value = false;
+}
+
 function updata() {
-  bgColor.value = mapColor.get(lineNetStore.alarmInfo[0].level) as string;
+  bgColor.value = mapColor.get(messageUse.level) as string;
-  alarmInfo.value.time = lineNetStore.alarmInfo[0].alert_time
+  alarmInfo.value.time = messageUse.alert_time
     .substring(0, 19)
     .replace('T', ' ');
-  alarmInfo.value.level = mapAlarmMessage.get(
+  alarmInfo.value.level = (showAlertTypeData as never)[messageUse.level + ''];
-    lineNetStore.alarmInfo[0].level
+  alarmInfo.value.alertType = (showAlertTypeData as never)[
-  ) as string;
+    messageUse.alert_type + ''
-  alarmInfo.value.alertType = mapAlarmMessage.get(
+  ];
-    lineNetStore.alarmInfo[0].alert_type + ''
+  alarmInfo.value.alertObject = messageUse.alert_object.replace(/\[|]/g, '');
-  ) as string;
+  alarmInfo.value.lineId = messageUse.line_id;
-  alarmInfo.value.alertObject = lineNetStore.alarmInfo[0].alert_object.replace(
-    /\[|]/g,
-    ''
-  );
-  alarmInfo.value.lineId = lineNetStore.alarmInfo[0].line_id;
 }
 
 async function search() {
   try {
-    const id = lineNetStore.alarmInfo[0].alert_tip_id;
+    const id = messageUse.alert_tip_id;
     const response = await queryAlarmInfoById(id);
     drivingInfo.value = JSON.parse(response.data.drivingInfo);
     submissionInfo.value = JSON.parse(response.data.submissionInfo);
@@ -166,6 +191,21 @@ async function search() {
     }
   }
 }
+.confirm-message {
+  margin: 10px 0;
+  .box-card {
+    height: 150px;
+    padding: 0 5px;
+    .head {
+      padding: 5px 5px;
+      font-size: 20px;
+      font-weight: 600;
+    }
+    .detail {
+      margin-top: 10px;
+    }
+  }
+}
 .decision-message {
   display: flex;
   justify-content: space-between;

src/components/alarm/alarmInfoEnum.ts

@@ -0,0 +1,48 @@
+export enum showAlertTypeData {
+  '未知故障',
+  '蓝显',
+  '列车延误2分钟',
+  '列车延误10分钟',
+  '整侧站台门无关闭锁紧信号',
+  '整侧站台门无法打开',
+  '整侧站台门无法关闭',
+  '道岔失表',
+  '道岔均失表',
+  '道岔定位失表',
+  '道岔反位失表',
+  I = 'I类信息',
+  II = 'II类信息',
+  III = 'III类信息',
+  IV = 'IV类信息',
+  TRAIN_DELAY_2 = '列车延误2分钟',
+  TRAIN_DELAY_10 = '列车延误10分钟',
+  BLUE_DISPLAY = '蓝显',
+  PLATFORM_DOOR_WITHOUT_LOCKED_SIGNAL = '整侧站台门无关闭锁紧信号',
+  PLATFORM_DOOR_CANNOT_OPEN = '整侧站台门无法打开',
+  PLATFORM_DOOR_CANNOT_CLOSE = '整侧站台门无法关闭',
+  QX = '全线',
+  YHZ_LSQ = '鱼化寨联锁区',
+  HJM_LSQ = '胡家庙联锁区',
+  BCT_LSQ = '北池头联锁区',
+  BSQ_LSQ = '保税区联锁区',
+  SWITCH_All_LOST = '道岔均失表',
+  SWITCH_DW_LOST = '道岔定位失表',
+  SWITCH_FW_LOST = '道岔反位失表',
+}
+
+export enum saveAlertTypeData {
+  列车延误2分钟 = 'TRAIN_DELAY_2',
+  列车延误10分钟 = 'TRAIN_DELAY_10',
+  蓝显 = 'BLUE_DISPLAY',
+  整侧站台门无关闭锁紧信号 = 'PLATFORM_DOOR_WITHOUT_LOCKED_SIGNAL',
+  整侧站台门无法打开 = 'PLATFORM_DOOR_CANNOT_OPEN',
+  整侧站台门无法关闭 = 'PLATFORM_DOOR_CANNOT_CLOSE',
+  全线 = 'QX',
+  鱼化寨联锁区 = 'YHZ_LSQ',
+  胡家庙联锁区 = 'HJM_LSQ',
+  北池头联锁区 = 'BCT_LSQ',
+  保税区联锁区 = 'BSQ_LSQ',
+  道岔均失表 = 'SWITCH_All_LOST',
+  道岔定位失表 = 'SWITCH_DW_LOST',
+  道岔反位失表 = 'SWITCH_FW_LOST',
+}

src/components/alarm/alarmInfoList.vue

@@ -38,6 +38,17 @@
         ></q-input>
         <q-btn flat round color="primary" icon="search" />
       </template>
+      <template v-slot:body-cell-operations="props">
+        <q-td :props="props">
+          <div class="q-gutter-sm row justify-center">
+            <q-btn
+              color="primary"
+              label="详情"
+              @click="openAlarmDialog(props.row)"
+            />
+          </div>
+        </q-td>
+      </template>
     </q-table>
   </draggable-dialog>
 </template>
@@ -47,6 +58,8 @@ import DraggableDialog from '../common/DraggableDialog.vue';
 import { ref, reactive, onMounted } from 'vue';
 import { useQuasar, type QTableColumn } from 'quasar';
 import { alarmInfoListQuery } from 'src/api/AlertMock';
+import alarmInfoDialog from 'src/components/alarm/alarmInfoDialog.vue';
+import { showAlertTypeData, saveAlertTypeData } from './alarmInfoEnum';
 
 const $q = useQuasar();
 const dialogWidth = window.screen.width * 0.5;
@@ -103,6 +116,7 @@ const columnDefs: QTableColumn[] = [
     },
     align: 'center',
   },
+  { name: 'operations', label: '操作', field: 'operations', align: 'center' },
 ];
 
 const tableRef = ref();
@@ -148,26 +162,17 @@ async function onRequest(props: any) {
   }
 }
 
-enum showAlertTypeData {
+const dialogInstance = ref();
-  ALERT_TYPE_UNKNOWN = '未知故障',
+function openAlarmDialog(row: any) {
-  BLUE_DISPLAY = '蓝显',
+  row.alert_time = row.alertTime;
-  TRAIN_DELAY_2 = '列车延误2分钟',
+  row.alert_type = row.alertType;
-  TRAIN_DELAY_10 = '列车延误10分钟',
+  row.line_id = row.lineId;
-  PLATFORM_DOOR_WITHOUT_LOCKED_SIGNAL = '站台门无关闭且锁紧信号',
+  row.alert_object = row.alertObject;
-  PLATFORM_DOOR_CANNOT_OPEN = '整侧站台门无法打开',
+  dialogInstance.value = $q.dialog({
-  PLATFORM_DOOR_CANNOT_CLOSE = '整侧站台门无法关闭',
+    component: alarmInfoDialog,
-  I = 'I类信息',
+    componentProps: {
-  II = 'II类信息',
+      alarmMeaasge: row,
-  III = 'III类信息',
+    },
-  IV = 'IV类信息',
+  });
-}
-
-enum saveAlertTypeData {
-  列车延误2分钟 = 'TRAIN_DELAY_2',
-  列车延误10分钟 = 'TRAIN_DELAY_10',
-  蓝显 = 'BLUE_DISPLAY',
-  站台门无关闭且锁紧信号 = 'PLATFORM_DOOR_WITHOUT_LOCKED_SIGNAL',
-  整侧站台门无法打开 = 'PLATFORM_DOOR_CANNOT_OPEN',
-  整侧站台门无法关闭 = 'PLATFORM_DOOR_CANNOT_CLOSE',
 }
 </script>

src/components/alarm/commonAlarm.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <audio ref="audio">
-      <source src="../../assets/buzzer.mp3" type="audio/mpeg" />
+      <source src="../../assets/red.mp3" type="audio/mpeg" />
     </audio>
   </div>
 </template>
@@ -17,6 +17,7 @@ const audio = ref();
 const $q = useQuasar();
 const dialogInstance = ref();
 const playAble = ref(false);
+const dialogClose = ref(false);
 const watchInteract = () => {
   playAble.value = true;
   document.removeEventListener('click', watchInteract);
@@ -26,10 +27,8 @@ const watchInteract = () => {
 watch(
   () => lineNetStore.alarmInfo,
   (val) => {
-    if (val.length && audio.value.paused) {
+    if (val.length && audio.value.paused && val[0].level == 'I') {
       playAlarmMusic();
-    }
-    if (val.length && !lineNetStore.alarmDialog) {
       alarm();
     }
   },
@@ -43,11 +42,10 @@ function playAlarmMusic() {
 }
 
 function alarm() {
-  lineNetStore.alarmDialog = true;
   dialogInstance.value = $q
     .dialog({ component: alarmInfoDialog })
     .onCancel(() => {
-      lineNetStore.alarmDialog = false;
+      dialogClose.value = true;
     });
 }
 
@@ -57,7 +55,7 @@ onMounted(() => {
 });
 
 onUnmounted(() => {
-  if (dialogInstance.value && lineNetStore.alarmDialog) {
+  if (dialogInstance.value && !dialogClose.value) {
     dialogInstance.value.hide();
   }
 });

src/layouts/MainLayout.vue

@@ -112,7 +112,7 @@
       </q-form>
     </q-card>
   </q-dialog>
-  <commonAlarm v-show="route.path.includes('monitor')" />
+  <commonAlarm v-if="route.path.includes('monitor')" />
 </template>
 
 <script setup lang="ts">

src/pages/DecisionInfoManage.vue

@@ -129,6 +129,10 @@ import {
   createAlarmInfo,
   updataAlarmInfo,
 } from '../api/DecisionInfo';
+import {
+  showAlertTypeData,
+  saveAlertTypeData,
+} from 'src/components/alarm/alarmInfoEnum';
 
 const $q = useQuasar();
 
@@ -258,12 +262,15 @@ const creatForm = reactive({
 });
 const alertType = ref('');
 const optionsAlertType = [
+  '蓝显',
   '列车延误2分钟',
   '列车延误10分钟',
-  '蓝显',
+  '整侧站台门无关闭锁紧信号',
-  '站台门无关闭且锁紧信号',
   '整侧站台门无法打开',
   '整侧站台门无法关闭',
+  '道岔均失表',
+  '道岔定位失表',
+  '道岔反位失表',
 ];
 const optionsTimeType = ['CLOCK_7_9', 'CLOCK_7_9_AND_19_21', '无'];
 const locationType = ref('');
@@ -276,34 +283,6 @@ const optionsLocationType = [
   '无',
 ];
 
-enum showAlertTypeData {
-  TRAIN_DELAY_2 = '列车延误2分钟',
-  TRAIN_DELAY_10 = '列车延误10分钟',
-  BLUE_DISPLAY = '蓝显',
-  PLATFORM_DOOR_WITHOUT_LOCKED_SIGNAL = '站台门无关闭且锁紧信号',
-  PLATFORM_DOOR_CANNOT_OPEN = '整侧站台门无法打开',
-  PLATFORM_DOOR_CANNOT_CLOSE = '整侧站台门无法关闭',
-  QX = '全线',
-  YHZ_LSQ = '鱼化寨联锁区',
-  HJM_LSQ = '胡家庙联锁区',
-  BCT_LSQ = '北池头联锁区',
-  BSQ_LSQ = '保税区联锁区',
-}
-
-enum saveAlertTypeData {
-  列车延误2分钟 = 'TRAIN_DELAY_2',
-  列车延误10分钟 = 'TRAIN_DELAY_10',
-  蓝显 = 'BLUE_DISPLAY',
-  站台门无关闭且锁紧信号 = 'PLATFORM_DOOR_WITHOUT_LOCKED_SIGNAL',
-  整侧站台门无法打开 = 'PLATFORM_DOOR_CANNOT_OPEN',
-  整侧站台门无法关闭 = 'PLATFORM_DOOR_CANNOT_CLOSE',
-  全线 = 'QX',
-  鱼化寨联锁区 = 'YHZ_LSQ',
-  胡家庙联锁区 = 'HJM_LSQ',
-  北池头联锁区 = 'BCT_LSQ',
-  保税区联锁区 = 'BSQ_LSQ',
-}
-
 function onReset() {
   creatForm.id = '';
   alertType.value = '';

src/pages/LineMonitorPage.vue

@@ -14,8 +14,10 @@
 import { onMounted, ref, watch, onUnmounted } from 'vue';
 import { useLineStore } from 'src/stores/line-store';
 import { useRoute } from 'vue-router';
+import { useLineNetStore } from 'src/stores/line-net-store';
 import { loadLineDatas, getLineApp } from 'src/drawApp/lineApp';
 import StateProperties from 'src/components/state-app/StateProperties.vue';
+import { JlGraphic } from 'src/jl-graphic';
 
 const props = withDefaults(
   defineProps<{
@@ -26,6 +28,7 @@ const props = withDefaults(
 );
 const route = useRoute();
 const lineStore = useLineStore();
+const lineNetStore = useLineNetStore();
 const drawerRight = ref(false);
 
 watch(
@@ -75,6 +78,22 @@ onMounted(() => {
     lineStore.setLineId(null);
   }
   drawerRight.value = false;
+  setTimeout(() => {
+    if (lineNetStore.alarmInfo.length) {
+      try {
+        const lineApp = getLineApp();
+        if (lineApp) {
+          const deviceId = lineNetStore.alarmInfo[0].locator_device_id;
+          const faultDevice = lineApp.queryStore.queryById(
+            deviceId
+          ) as JlGraphic;
+          lineApp.makeGraphicCenterShow(faultDevice);
+        }
+      } catch (error) {
+        console.warn('未找到具体故障设备');
+      }
+    }
+  }, 1000);
 });
 
 onUnmounted(() => {

src/pages/MonitorPage.vue

@@ -48,7 +48,7 @@ watch(
 watch(
   () => lineNetStore.alarmInfo,
   (val) => {
-    if (val.length && !lineNetStore.alarmDialog) {
+    if (val.length) {
       router.replace('/line/monitor/3');
     }
   },

src/stores/line-net-store.ts

@@ -20,7 +20,6 @@ export const useLineNetStore = defineStore('lineNet', {
     selectedGraphics: null as JlGraphic[] | null,
     lineNetName: null as string | null,
     alarmInfo: [] as AlarmInfo[], //报警信息
-    alarmDialog: false,
   }),
   getters: {
     selectedGraphicType: (state) => {
@@ -66,7 +65,7 @@ export const useLineNetStore = defineStore('lineNet', {
       this.lineNetName = name;
     },
     setAlarmInfo(data: []) {
-      this.alarmInfo.unshift(...data);
+      this.alarmInfo = data;
     },
   },
 });