feat: 设备告警板块的交互权限

src/composables/alarm/use-alarm-action-column.ts

@@ -1,11 +1,14 @@
+import { usePermission } from '../permission';
 import { deleteCameraIgnoreApi, pageCameraIgnoreApi, saveCameraIgnoreApi, updateDeviceAlarmLogApi, type NdmDeviceAlarmLogResultVO } from '@/apis';
-import { DEVICE_TYPE_LITERALS, tryGetDeviceType } from '@/enums';
+import { DEVICE_TYPE_LITERALS, PERMISSION_TYPE_LITERALS, tryGetDeviceType } from '@/enums';
 import { parseErrorFeedback } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
 import { NButton, NFlex, NPopconfirm, type DataTableColumn, type DataTableRowData } from 'naive-ui';
 import { h, type Ref } from 'vue';
 
 export const useAlarmActionColumn = (tableData: Ref<DataTableRowData[]>) => {
+  const { hasPermission } = usePermission();
+
   const { mutate: confirmAlarm } = useMutation({
     mutationFn: async (params: { id: string | null }) => {
       const { id } = params;
@@ -115,28 +118,30 @@ export const useAlarmActionColumn = (tableData: Ref<DataTableRowData[]>) => {
                     default: () => '确认告警？',
                   },
                 ),
-            tryGetDeviceType(rowData.deviceType) === DEVICE_TYPE_LITERALS.ndmCamera && [
+            tryGetDeviceType(rowData.deviceType) === DEVICE_TYPE_LITERALS.ndmCamera &&
-              h(
+              rowData.stationCode &&
-                NPopconfirm,
+              hasPermission(rowData.stationCode, PERMISSION_TYPE_LITERALS.OPERATION) && [
-                {
+                h(
-                  onPositiveClick: () => ignoreCamera({ id }),
+                  NPopconfirm,
-                },
+                  {
-                {
+                    onPositiveClick: () => ignoreCamera({ id }),
-                  trigger: () => h(NButton, { tertiary: true, type: 'info', size: 'tiny' }, { default: () => '忽略' }),
+                  },
-                  default: () => '忽略设备？',
+                  {
-                },
+                    trigger: () => h(NButton, { tertiary: true, type: 'info', size: 'tiny' }, { default: () => '忽略' }),
-              ),
+                    default: () => '忽略设备？',
-              // h(
+                  },
-              //   NPopconfirm,
+                ),
-              //   {
+                // h(
-              //     onPositiveClick: () => noticeCamera({ id }),
+                //   NPopconfirm,
-              //   },
+                //   {
-              //   {
+                //     onPositiveClick: () => noticeCamera({ id }),
-              //     trigger: () => h(NButton, { text: true, type: 'info', size: 'small' }, { icon: () => h(EyeOutlined) }),
+                //   },
-              //     default: () => '取消忽略设备？',
+                //   {
-              //   },
+                //     trigger: () => h(NButton, { text: true, type: 'info', size: 'small' }, { icon: () => h(EyeOutlined) }),
-              // ),
+                //     default: () => '取消忽略设备？',
-            ],
+                //   },
+                // ),
+              ],
           ],
         },
       );

src/pages/alarm-ignore-page.vue

@@ -16,8 +16,9 @@ const NDM_TYPES: Record<string, DeviceType> = {
 
 <script setup lang="ts">
 import { deleteCameraIgnoreApi, pageCameraIgnoreApi, type NdmCameraIgnore, type NdmCameraIgnoreResultVO, type PageQueryExtra, type Station } from '@/apis';
-import { DEVICE_TYPE_LITERALS, DEVICE_TYPE_NAMES, type DeviceType } from '@/enums';
+import { usePermission } from '@/composables';
-import { useDeviceStore, useStationStore } from '@/stores';
+import { DEVICE_TYPE_LITERALS, DEVICE_TYPE_NAMES, PERMISSION_TYPE_LITERALS, type DeviceType } from '@/enums';
+import { useDeviceStore, usePermissionStore } from '@/stores';
 import { useMutation } from '@tanstack/vue-query';
 import { isCancel } from 'axios';
 import {
@@ -45,11 +46,14 @@ interface SearchFields extends PageQueryExtra<NdmCameraIgnore> {
   stationCode?: Station['code'];
   // deviceId_like?: string;
 }
-
-const stationStore = useStationStore();
-const { stations } = storeToRefs(stationStore);
 const deviceStore = useDeviceStore();
 const { lineDevices } = storeToRefs(deviceStore);
+const permissionStore = usePermissionStore();
+const { permissions } = storeToRefs(permissionStore);
+
+const { hasPermission } = usePermission();
+
+const stations = computed(() => permissionStore.stations.VIEW ?? []);
 
 const stationSelectOptions = computed<SelectOption[]>(() => {
   return stations.value.map((station) => ({
@@ -64,6 +68,14 @@ const stationSelectOptions = computed<SelectOption[]>(() => {
 //   }));
 // });
 
+// 权限变化时，需要刷新表格数据
+watch(permissions, (newPermissions, oldPermissions) => {
+  const oldPermissionsJson = JSON.stringify(oldPermissions);
+  const newPermissionsJson = JSON.stringify(newPermissions);
+  if (oldPermissionsJson === newPermissionsJson) return;
+  onClickReset();
+});
+
 const searchFields = ref<SearchFields>({});
 const resetSearchFields = () => {
   searchFields.value = {};
@@ -84,7 +96,7 @@ watch(searchFields, () => {
   searchFieldsChanged.value = true;
 });
 
-const tableColumns: DataTableColumns<NdmCameraIgnoreResultVO> = [
+const tableColumns = computed<DataTableColumns<NdmCameraIgnoreResultVO>>(() => [
   { title: '忽略时间', key: 'createdTime', align: 'center' },
   // { title: '更新时间', key: 'updatedTime' },
   {
@@ -142,6 +154,11 @@ const tableColumns: DataTableColumns<NdmCameraIgnoreResultVO> = [
     align: 'center',
     width: 120,
     render: (rowData) => {
+      const { deviceId } = rowData;
+      if (!deviceId) return null;
+      const stationCode = deviceId.slice(0, 4);
+      if (!stationCode) return null;
+      if (!hasPermission(stationCode, PERMISSION_TYPE_LITERALS.OPERATION)) return null;
       return h(
         NPopconfirm,
         {
@@ -167,7 +184,7 @@ const tableColumns: DataTableColumns<NdmCameraIgnoreResultVO> = [
       );
     },
   },
-];
+]);
 
 const { mutate: cancelIgnore } = useMutation({
   mutationFn: async (params: { id?: string; signal?: AbortSignal }) => {

src/pages/alarm-log-page.vue

@@ -3,7 +3,7 @@ import { exportDeviceAlarmLogApi, pageDeviceAlarmLogApi, type NdmDeviceAlarmLog,
 import { useAlarmActionColumn, useCameraSnapColumn } from '@/composables';
 import { ALARM_TYPES, DEVICE_TYPE_CODES, DEVICE_TYPE_LITERALS, DEVICE_TYPE_NAMES, FAULT_LEVELS, tryGetDeviceType, type DeviceType } from '@/enums';
 import { renderAlarmDateCell, renderAlarmTypeCell, renderDeviceTypeCell, renderFaultLevelCell } from '@/helpers';
-import { useAlarmStore, useDeviceStore, useStationStore } from '@/stores';
+import { useAlarmStore, useDeviceStore, usePermissionStore } from '@/stores';
 import { downloadByData, parseErrorFeedback } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
 import { watchDebounced } from '@vueuse/core';
@@ -42,12 +42,14 @@ interface SearchFields extends PageQueryExtra<NdmDeviceAlarmLog> {
 const route = useRoute();
 const router = useRouter();
 
-const stationStore = useStationStore();
-const { stations } = storeToRefs(stationStore);
 const deviceStore = useDeviceStore();
 const { lineDevices } = storeToRefs(deviceStore);
 const alarmStore = useAlarmStore();
 const { unreadAlarmCount } = storeToRefs(alarmStore);
+const permissionStore = usePermissionStore();
+const { permissions } = storeToRefs(permissionStore);
+
+const stations = computed(() => permissionStore.stations.VIEW ?? []);
 
 const stationSelectOptions = computed<SelectOption[]>(() => {
   return stations.value.map((station) => ({
@@ -74,6 +76,14 @@ const faultLevelSelectOptions = computed<SelectOption[]>(() => {
   }));
 });
 
+// 权限变化时，需要刷新表格数据
+watch(permissions, (newPermissions, oldPermissions) => {
+  const oldPermissionsJson = JSON.stringify(oldPermissions);
+  const newPermissionsJson = JSON.stringify(newPermissions);
+  if (oldPermissionsJson === newPermissionsJson) return;
+  onClickReset();
+});
+
 // 未读告警数量被清零时，代表从别的页面跳转过来，需要刷新告警表格数据
 const unreadCountCleared = computed(() => unreadAlarmCount.value === 0);
 watch(unreadCountCleared, (newValue, oldValue) => {
@@ -117,14 +127,17 @@ const resetSearchFields = () => {
 const getExtraFields = (): PageQueryExtra<NdmDeviceAlarmLog> => {
   const stationCodeIn = searchFields.value.stationCode_in;
   const deviceTypeIn = searchFields.value.deviceType_in.flatMap((deviceType) => DEVICE_TYPE_CODES[deviceType as DeviceType]);
+  const deviceNameLike = searchFields.value.deviceName_like;
+  const alarmTypeIn = searchFields.value.alarmType_in;
+  const faultLevelIn = searchFields.value.faultLevel_in;
   const alarmDateGe = searchFields.value.alarmDate[0];
   const alarmDateLe = searchFields.value.alarmDate[1];
   return {
-    stationCode_in: stationCodeIn ? (stationCodeIn.length > 0 ? [...stationCodeIn] : undefined) : undefined,
+    stationCode_in: stationCodeIn.length > 0 ? [...stationCodeIn] : stations.value.map((station) => station.code),
-    deviceType_in: deviceTypeIn ? (deviceTypeIn.length > 0 ? [...deviceTypeIn] : undefined) : undefined,
+    deviceType_in: deviceTypeIn.length > 0 ? [...deviceTypeIn] : undefined,
-    deviceName_like: !!searchFields.value.deviceName_like ? searchFields.value.deviceName_like : undefined,
+    deviceName_like: deviceNameLike.length > 0 ? deviceNameLike : undefined,
-    alarmType_in: searchFields.value.alarmType_in.length > 0 ? [...searchFields.value.alarmType_in] : undefined,
+    alarmType_in: alarmTypeIn.length > 0 ? [...alarmTypeIn] : undefined,
-    faultLevel_in: searchFields.value.faultLevel_in.length > 0 ? [...searchFields.value.faultLevel_in] : undefined,
+    faultLevel_in: faultLevelIn.length > 0 ? [...faultLevelIn] : undefined,
     alarmDate_ge: alarmDateGe,
     alarmDate_le: alarmDateLe,
   };