报警列表增加查询

src/pages/AlarmInfoList.vue

@@ -10,12 +10,17 @@
       v-model:pagination="pagination"
       :rows-per-page-options="[10, 20, 50, 100]"
       :loading="loading"
-      :filter="filter"
       binary-state-sort
       @request="onRequest"
     >
       <template v-slot:top-right>
         <div class="q-gutter-sm row justify-center">
+          <q-btn
+            class="q-mr-md"
+            color="primary"
+            label="查询"
+            @click="searchDialog = true"
+          />
           <q-btn color="primary" label="报警统计" @click="showStatistics" />
         </div>
       </template>
@@ -31,6 +36,39 @@
         </q-td>
       </template>
     </q-table>
+    <q-dialog
+      v-model="searchDialog"
+      persistent
+      transition-show="scale"
+      transition-hide="scale"
+    >
+      <q-card style="width: 300px">
+        <q-card-section>
+          <div class="text-h6">查询报警信息</div>
+        </q-card-section>
+        <q-card-section>
+          <q-input
+            outlined
+            v-model.number="filter.lineId"
+            label="线路ID"
+            type="number"
+            class="q-mb-md"
+            lazy-rules
+          />
+          <q-select
+            outlined
+            label="故障类型"
+            v-model="filter.alertType"
+            :options="optionsAlertType"
+          />
+        </q-card-section>
+
+        <q-card-actions align="right">
+          <q-btn color="primary" label="确定" @click="searchDecisionInfo()" />
+          <q-btn label="取消" v-close-popup />
+        </q-card-actions>
+      </q-card>
+    </q-dialog>
   </div>
 </template>
 
@@ -130,10 +168,6 @@ const columnDefs: QTableColumn[] = [
 
 const tableRef = ref();
 const rows = reactive([]);
-const filter = reactive({
-  alertType: '',
-  lineId: '',
-});
 const loading = ref(false);
 const pagination = ref({
   sortBy: 'desc',
@@ -145,14 +179,13 @@ const pagination = ref({
 
 async function onRequest(props: any) {
   const { page, rowsPerPage, sortBy, descending } = props.pagination;
-  const filter = props.filter;
   loading.value = true;
   try {
     let response = await alarmInfoListQuery({
       current: page,
       size: rowsPerPage,
-      alertType: (saveAlertTypeData as never)[filter.alertType],
-      lineId: filter.lineId,
+      alertType: (saveAlertTypeData as never)[filter.value.alertType],
+      lineId: +filter.value.lineId,
     });
     const pageData = response;
     pagination.value.rowsNumber = pageData.total;
@@ -178,6 +211,40 @@ onMounted(() => {
   });
 });
 
+const searchDialog = ref(false);
+const filter = ref({
+  alertType: '',
+  lineId: '',
+});
+const optionsAlertType = [
+  '蓝显',
+  '全线蓝显',
+  '列车延误2分钟',
+  '列车延误10分钟',
+  '整侧站台门无关闭锁紧信号',
+  '整侧站台门无法打开',
+  '整侧站台门无法关闭',
+  '道岔均失表',
+  '道岔定位失表',
+  '道岔反位失表',
+  '计轴红光带',
+  '计轴大面积红光带',
+  '计轴橙光带',
+  '计轴大面积橙光带',
+  '道岔大面积失表',
+  '列车信号故障',
+];
+function searchDecisionInfo() {
+  searchDialog.value = false;
+  try {
+    tableRef.value.requestServerInteraction();
+  } finally {
+    setTimeout(() => {
+      filter.value = { alertType: '', lineId: '' };
+    });
+  }
+}
+
 const dialogInstance = ref();
 function openAlarmDialog(row: any) {
   row.alert_time = row.alertTime;

src/pages/DecisionInfoManage.vue

@@ -237,10 +237,6 @@ const columnDefs: QTableColumn[] = [
 const operateDisabled = ref(false);
 const tableRef = ref();
 const rows = reactive([]);
-const filter = ref({
-  alertType: '',
-  areaConfigName: '',
-});
 const loading = ref(false);
 const pagination = ref({
   sortBy: 'desc',
@@ -284,13 +280,17 @@ onMounted(() => {
 });
 
 const searchDialog = ref(false);
+const filter = ref({
+  alertType: '',
+  areaConfigName: '',
+});
 function searchDecisionInfo() {
   searchDialog.value = false;
   try {
     tableRef.value.requestServerInteraction();
   } finally {
     setTimeout(() => {
-      filter.value = { alertType: '', areaConfigId: '' };
+      filter.value = { alertType: '', areaConfigName: '' };
     });
   }
 }