refactor: 重构项目结构

- 优化 `车站-设备-告警`  轮询机制
- 改进设备卡片的布局
- 支持修改设备
- 告警轮询中获取完整告警数据
- 车站告警详情支持导出完整的 `今日告警列表`
- 支持将状态持久化到 `IndexedDB`
- 新增轮询控制 (调试模式)
- 新增离线开发模式 (调试模式)
- 新增 `IndexedDB` 数据控制 (调试模式)

src/components/device/device-card/ndm-decoder/decoder-history-diag.vue

@@ -0,0 +1,100 @@
+<script setup lang="ts">
+import type { NdmDecoderResultVO, Station } from '@/apis';
+import {
+  DeviceAlarmHistoryCard,
+  DeviceIcmpHistoryCard,
+  DeviceUsageHistoryCard,
+  HistoryDiagFilterCard,
+  type DeviceAlarmHistoryCardProps,
+  type DeviceIcmpHistoryCardProps,
+  type DeviceUsageHistoryCardProps,
+} from '@/components';
+import dayjs from 'dayjs';
+import { NFlex, type SelectOption } from 'naive-ui';
+import { onMounted, ref, toRefs, watch } from 'vue';
+
+const props = defineProps<{
+  ndmDevice: NdmDecoderResultVO;
+  station: Station;
+}>();
+
+const { ndmDevice, station } = toRefs(props);
+
+const historyDiagOptions: SelectOption[] = [
+  { label: '设备状态', value: 'icmp' },
+  { label: '设备告警', value: 'alarm' },
+  { label: '硬件占用', value: 'usage' },
+];
+const getWeekRange = (): [number, number] => {
+  const now = dayjs();
+  const todayEnd = now.endOf('date');
+  const weekAgo = now.subtract(1, 'week').startOf('date');
+  return [weekAgo.valueOf(), todayEnd.valueOf()];
+};
+const range = ref<[number, number]>(getWeekRange());
+const selected = ref([...historyDiagOptions.map((option) => `${option.value}`)]);
+const loading = ref<boolean>(false);
+const icmpLoading = ref<boolean>(false);
+const alarmLoading = ref<boolean>(false);
+watch([icmpLoading, alarmLoading], (loadings) => {
+  loading.value = loadings.some((loading) => loading);
+});
+const icmpHistoryQueryFn = ref<() => void>();
+const onExposeIcmpHistoryQueryFn: DeviceIcmpHistoryCardProps['onExposeQueryFn'] = (queryFn) => {
+  icmpHistoryQueryFn.value = queryFn;
+};
+const alarmHistoryQueryFn = ref<() => void>();
+const onExposeAlarmHistoryQueryFn: DeviceAlarmHistoryCardProps['onExposeQueryFn'] = (queryFn) => {
+  alarmHistoryQueryFn.value = queryFn;
+};
+const usageHistoryQueryFn = ref<() => void>();
+const onExposeUsageHistoryQueryFn: DeviceUsageHistoryCardProps['onExposeQueryFn'] = (queryFn) => {
+  usageHistoryQueryFn.value = queryFn;
+};
+const queryData = () => {
+  if (selected.value.includes('icmp')) icmpHistoryQueryFn.value?.();
+  if (selected.value.includes('alarm')) alarmHistoryQueryFn.value?.();
+  if (selected.value.includes('usage')) usageHistoryQueryFn.value?.();
+};
+const onQuery = () => {
+  queryData();
+};
+
+onMounted(() => {
+  queryData();
+});
+</script>
+
+<template>
+  <NFlex vertical>
+    <HistoryDiagFilterCard :options="historyDiagOptions" v-model:loading="loading" v-model:range="range" v-model:selected="selected" @query="onQuery" />
+    <DeviceIcmpHistoryCard
+      v-if="selected.includes('icmp')"
+      :ndm-device="ndmDevice"
+      :station="station"
+      v-model:range="range"
+      v-model:loading="icmpLoading"
+      @expose-query-fn="onExposeIcmpHistoryQueryFn"
+    />
+    <DeviceAlarmHistoryCard
+      v-if="selected.includes('alarm')"
+      :ndm-device="ndmDevice"
+      :station="station"
+      v-model:range="range"
+      v-model:loading="alarmLoading"
+      @expose-query-fn="onExposeAlarmHistoryQueryFn"
+    />
+    <DeviceUsageHistoryCard
+      v-if="selected.includes('usage')"
+      :ndm-device="ndmDevice"
+      :station="station"
+      :cpu-usage-field="'stCommonInfo.CPU使用率'"
+      :mem-usage-field="'stCommonInfo.内存使用率'"
+      v-model:range="range"
+      v-model:loading="alarmLoading"
+      @expose-query-fn="onExposeUsageHistoryQueryFn"
+    />
+  </NFlex>
+</template>
+
+<style scoped lang="scss"></style>