ncc应急处置

src/api/faultQuery.ts

@@ -75,3 +75,20 @@ export async function faultQueryType(): Promise<Array<FaultTypeItem>> {
   const response = await api.get(`${faultQueryUriBase}/type`);
   return response.data;
 }
+
+export interface NccFaultQueryListItem {
+  nccTypeName: string;
+  nccData: { action: string; datas: string[] }[];
+}
+
+/**
+ * 分页查询ncc故障查询
+ * @param params
+ * @returns
+ */
+export async function nccFaultQueryPageQuery(): Promise<
+  NccFaultQueryListItem[]
+> {
+  const response = await api.post(`${faultQueryUriBase}/ncc`);
+  return response.data;
+}

src/pages/EmergencyResponseManage.vue

@@ -16,7 +16,7 @@
   </q-tabs>
   <q-separator />
   <q-tab-panel name="info">
-    <div class="dialogContainer">
+    <div class="occContainer" v-if="roleType == 'OCC'">
       <q-table
         ref="tableRef"
         row-key="id"
@@ -32,19 +32,6 @@
         <template v-slot:top-right>
           <q-form ref="myForm" style="width: 100%">
             <div class="q-gutter-md q-mt-none row justify-center items-start">
-              <q-select
-                dense
-                v-model="filter.lineId"
-                :options="searchOptionsLineId"
-                emit-value
-                map-options
-                options-dense
-                label="线路ID"
-                style="width: 75px"
-                no-error-icon
-                lazy-rules
-                :rules="[(val) => val >= 0 || '请选择线路ID！']"
-              />
               <q-select
                 dense
                 label="故障类型"
@@ -123,6 +110,26 @@
         </div>
       </q-scroll-area>
     </div>
+    <div v-else class="nccContainer">
+      <q-btn-toggle
+        v-model="selectMenuName"
+        toggle-color="primary"
+        :options="menuOption"
+        @update:model-value="selectedMenu"
+        class="q-btn-toggle"
+      />
+      <q-card
+        class="box-card"
+        v-for="nccData in showNccData"
+        :key="nccData.action"
+      >
+        <div class="head">{{ nccData.action }}</div>
+        <q-separator />
+        <div class="detail">
+          <div v-for="data in nccData.datas" :key="data">{{ data }}</div>
+        </div>
+      </q-card>
+    </div>
   </q-tab-panel>
 </template>
 
@@ -134,9 +141,11 @@ import {
   faultQueryPageQuery,
   faultQueryType,
   FaultTypeItem,
+  NccFaultQueryListItem,
+  nccFaultQueryPageQuery,
 } from 'src/api/faultQuery';
-import { pageQuery } from 'src/api/LineInfoApi';
-import { ApiError } from 'src/boot/axios';
+import { getMonitorPath } from 'src/router/routes';
+import { useUserStore } from 'src/stores/user-store';
 
 const props = withDefaults(
   defineProps<{
@@ -164,18 +173,8 @@ watch(tab, (tabVal) => {
     tableTitle.faultDriverShower = '故障现象';
   }
   handleSelectFaultType();
-  searchTable();
 });
-const tabList = ref([
-  {
-    label: '故障指导',
-    value: 'GUIDE',
-  },
-  {
-    label: '退出服务',
-    value: 'SERVICE',
-  },
-]);
+const tabList = ref();
 
 const tableRef = ref<QTable>();
 const columns = computed(() => [
@@ -362,31 +361,46 @@ function handleSelectFaultType() {
   searchOptionsFaultType.value[0].value = allType;
 }
 
-const searchOptionsLineId = ref<{ label: string; value: number }[]>([
-  { label: '全部', value: 0 },
-]);
-async function queryLineInfo() {
-  try {
-    let response = await pageQuery({
-      current: 1,
-      size: 50,
-    });
-    response.records.forEach((info) => {
-      searchOptionsLineId.value.push({ label: info.name, value: info.lineId });
-    });
-  } catch (err) {
-    const error = err as ApiError;
-    $q.notify({
-      type: 'negative',
-      message: error.title,
-    });
-  }
-}
-
 function searchTable() {
   tableRef.value?.requestServerInteraction();
 }
 
+//ncc相关
+const nccDatas = ref<NccFaultQueryListItem[]>();
+const selectMenuName = ref('');
+const menuOption = ref<
+  {
+    label: string;
+    value: string;
+  }[]
+>([]);
+const showNccData = ref<{ action: string; datas: string[] }[]>();
+
+function selectedMenu(name: string) {
+  showNccData.value = nccDatas.value?.find(
+    (nccData) => nccData.nccTypeName == name
+  )?.nccData;
+}
+
+async function nccFaultQueryPageQueryFn() {
+  try {
+    nccDatas.value = await nccFaultQueryPageQuery();
+    nccDatas.value.forEach((nccDta) =>
+      menuOption.value.push({
+        label: nccDta.nccTypeName,
+        value: nccDta.nccTypeName,
+      })
+    );
+    selectMenuName.value = nccDatas.value[0].nccTypeName;
+    showNccData.value = nccDatas.value[0].nccData;
+  } catch (err) {
+    $q.notify({
+      type: 'negative',
+      message: '无法获取ncc故障查询',
+    });
+  }
+}
+
 const showTooltip = ref(false);
 function onMouseOver(e: MouseEvent) {
   const target = e.target as HTMLElement;
@@ -395,12 +409,35 @@ function onMouseOver(e: MouseEvent) {
   }
 }
 
+const userStore = useUserStore();
+const roleType = ref('');
 onMounted(() => {
-  queryLineInfo();
-  queryAllFaultType();
-  setTimeout(() => {
-    searchTable();
-  }, 1000);
+  const config = getMonitorPath(userStore.roles);
+  if (config.lineType == 'NCC') {
+    roleType.value = 'NCC';
+    tabList.value = [
+      {
+        label: 'ncc应急处置流程',
+        value: 'NCC',
+      },
+    ];
+    tab.value = 'NCC';
+    nccFaultQueryPageQueryFn();
+  } else {
+    roleType.value = 'OCC';
+    tabList.value = [
+      {
+        label: '故障指导',
+        value: 'GUIDE',
+      },
+      {
+        label: '退出服务',
+        value: 'SERVICE',
+      },
+    ];
+    filter.lineId = config.lineIds[0];
+    queryAllFaultType();
+  }
 });
 </script>
 
@@ -426,7 +463,7 @@ onMounted(() => {
   justify-content: center;
   margin-top: 10px;
 }
-.dialogContainer {
+.occContainer {
   display: flex;
   height: calc(100vh - 120px);
   .left {
@@ -467,4 +504,27 @@ onMounted(() => {
     }
   }
 }
+.nccContainer {
+  .q-btn-toggle {
+    margin-bottom: 15px;
+  }
+  .box-card {
+    width: 98%;
+    min-height: 150px;
+    margin-bottom: 15px;
+    padding: 0 5px;
+    .head {
+      padding: 5px 5px;
+      font-size: 20px;
+      font-weight: 600;
+    }
+    .detail {
+      margin-bottom: 10px;
+      padding: 5px 5px;
+      line-height: 28px;
+      white-space: pre-wrap;
+      font-size: 20px;
+    }
+  }
+}
 </style>