|
@@ -3,6 +3,22 @@
|
|
|
<template #header>
|
|
<template #header>
|
|
|
<div class="inline">
|
|
<div class="inline">
|
|
|
<span class="font-bold">{{ props.sn }}</span>
|
|
<span class="font-bold">{{ props.sn }}</span>
|
|
|
|
|
+ <NPopover placement="right-start" trigger="click">
|
|
|
|
|
+ <template #trigger>
|
|
|
|
|
+ <NButton v-show="showAlarmIcon"
|
|
|
|
|
+ class="i-ph:warning-circle-fill text-red-500 hover:text-red-600 transition-colors duration-200"
|
|
|
|
|
+ size="small" text />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <NTimeline :icon-size="20">
|
|
|
|
|
+ <n-timeline-item v-for="alarmItem in aLarmList" :key="alarmItem.alarmCode" color="grey"
|
|
|
|
|
+ :content="alarmItem.logName">
|
|
|
|
|
+ <template #icon>
|
|
|
|
|
+ <i v-if="alarmItem.level === 2" class="i-ph:warning-circle-fill text-red-500" />
|
|
|
|
|
+ <i v-else class="i-ph:warning-fill text-yellow-500" />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </n-timeline-item>
|
|
|
|
|
+ </NTimeline>
|
|
|
|
|
+ </NPopover>
|
|
|
<NDivider vertical v-show="aPowerEnable" />
|
|
<NDivider vertical v-show="aPowerEnable" />
|
|
|
<span v-show="aPowerEnable">
|
|
<span v-show="aPowerEnable">
|
|
|
<NPerformantEllipsis class="text-gray-500">
|
|
<NPerformantEllipsis class="text-gray-500">
|
|
@@ -38,7 +54,8 @@ import { useSitesMonitorConfigStore } from '@/stores/modules/views/sitesMonitorC
|
|
|
import { useSiteInfoDataStore } from '@/stores/modules/data/siteInfoData';
|
|
import { useSiteInfoDataStore } from '@/stores/modules/data/siteInfoData';
|
|
|
import { useSiteModeDataStore } from '@/stores/modules/data/siteModeData';
|
|
import { useSiteModeDataStore } from '@/stores/modules/data/siteModeData';
|
|
|
import { useSitePowerFlowDataStore } from '@/stores/modules/data/sitePowerFlowData';
|
|
import { useSitePowerFlowDataStore } from '@/stores/modules/data/sitePowerFlowData';
|
|
|
-import type { SiteInfo } from '../interface';
|
|
|
|
|
|
|
+import type { SiteAlarmList, SiteInfo } from '../interface';
|
|
|
|
|
+import { useSiteAlarmListDataStore } from '@/stores/modules/data/siteAlarmList';
|
|
|
|
|
|
|
|
const props = defineProps<{
|
|
const props = defineProps<{
|
|
|
monitorName: string
|
|
monitorName: string
|
|
@@ -51,6 +68,7 @@ const powerFlowChartRef = useTemplateRef<InstanceType<typeof PowerFlowChart>>('p
|
|
|
const sitesMonitorStateStore = useSitesMonitorStateStore()
|
|
const sitesMonitorStateStore = useSitesMonitorStateStore()
|
|
|
const siteInfoDataStore = useSiteInfoDataStore()
|
|
const siteInfoDataStore = useSiteInfoDataStore()
|
|
|
const siteModeDataStore = useSiteModeDataStore()
|
|
const siteModeDataStore = useSiteModeDataStore()
|
|
|
|
|
+const siteAlarmListStore = useSiteAlarmListDataStore()
|
|
|
const sitePowerFlowDataStore = useSitePowerFlowDataStore()
|
|
const sitePowerFlowDataStore = useSitePowerFlowDataStore()
|
|
|
const sitesMonitorConfigStore = useSitesMonitorConfigStore()
|
|
const sitesMonitorConfigStore = useSitesMonitorConfigStore()
|
|
|
|
|
|
|
@@ -62,6 +80,14 @@ const versionConfig = sitesMonitorConfigStore.getVersionConfigState(props.monito
|
|
|
const tariffsConfig = sitesMonitorConfigStore.getTariffsConfigState(props.monitorName)
|
|
const tariffsConfig = sitesMonitorConfigStore.getTariffsConfigState(props.monitorName)
|
|
|
const othersConfig = sitesMonitorConfigStore.getOthersConfigState(props.monitorName)
|
|
const othersConfig = sitesMonitorConfigStore.getOthersConfigState(props.monitorName)
|
|
|
|
|
|
|
|
|
|
+const showAlarmIcon = computed<boolean>(() => {
|
|
|
|
|
+ if (alarmConfig.value.enable) {
|
|
|
|
|
+ return aLarmList.value.length > 0
|
|
|
|
|
+ }
|
|
|
|
|
+ return false
|
|
|
|
|
+})
|
|
|
|
|
+const aLarmList = ref<SiteAlarmList[]>([])
|
|
|
|
|
+
|
|
|
const aPowerEnable = computed(() => {
|
|
const aPowerEnable = computed(() => {
|
|
|
return aPowerConfig.value.enable
|
|
return aPowerConfig.value.enable
|
|
|
})
|
|
})
|
|
@@ -150,6 +176,16 @@ const loadingSiteInfoData = async (sn: string): Promise<SiteInfo | undefined> =>
|
|
|
return siteInfo
|
|
return siteInfo
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+// 加载设备告警信息
|
|
|
|
|
+const loadingSiteAlarmList = async (sn: string): Promise<SiteAlarmList[] | undefined> => {
|
|
|
|
|
+ if (sn === "") return
|
|
|
|
|
+ let siteAlarmList = siteAlarmListStore.siteAlarmListGet(sn)
|
|
|
|
|
+ if (siteAlarmList === undefined) {
|
|
|
|
|
+ siteAlarmList = await siteAlarmListStore.querySiteAlarmList(sn)
|
|
|
|
|
+ }
|
|
|
|
|
+ return siteAlarmList
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
const switchItemLoading = <T extends Ref<{ enable: boolean }>>(config: T, loadingFn: (enable: boolean) => void) => {
|
|
const switchItemLoading = <T extends Ref<{ enable: boolean }>>(config: T, loadingFn: (enable: boolean) => void) => {
|
|
|
loadingFn(config.value.enable)
|
|
loadingFn(config.value.enable)
|
|
|
|
|
|
|
@@ -210,6 +246,15 @@ onMounted(() => {
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|
|
|
|
|
+
|
|
|
|
|
+ switchItemLoading(alarmConfig, async (enable: boolean) => {
|
|
|
|
|
+ if (enable) {
|
|
|
|
|
+ const siteAlarmList = await loadingSiteAlarmList(props.sn)
|
|
|
|
|
+ if (siteAlarmList !== undefined) {
|
|
|
|
|
+ aLarmList.value = [...siteAlarmList]
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
}, 1000) // 延时 1 秒
|
|
}, 1000) // 延时 1 秒
|
|
|
})
|
|
})
|
|
|
</script>
|
|
</script>
|