style: 更新图标库为 lucide

src/components/device/device-card/components/current-diag/device-hardware-card.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ClockCircleOutlined, CodeOutlined, FireOutlined, SaveOutlined } from '@vicons/antd';
+import { ClockCheckIcon, CpuIcon, HardDriveIcon, MemoryStickIcon } from 'lucide-vue-next';
 import { NCard, NFlex, NIcon, NProgress, type ProgressStatus } from 'naive-ui';
 import { computed, toRefs } from 'vue';
 
@@ -54,22 +54,22 @@ const getProgressStatus = (percent: number): ProgressStatus => {
     <template #default>
       <NFlex vertical>
         <NFlex v-if="cpuUsage" style="width: 100%" align="center" :wrap="false">
-          <NIcon :component="FireOutlined" />
+          <NIcon :component="CpuIcon" />
           <span style="word-break: keep-all">{{ cpuUsageLabel || 'CPU' }}</span>
           <NProgress :percentage="cpuPercent" :status="getProgressStatus(cpuPercent)">{{ cpuPercent }}%</NProgress>
         </NFlex>
         <NFlex v-if="memUsage" style="width: 100%" align="center" :wrap="false">
-          <NIcon :component="CodeOutlined" />
+          <NIcon :component="MemoryStickIcon" />
           <span style="word-break: keep-all">{{ memUsageLabel || '内存' }}</span>
           <NProgress :percentage="memPercent" :status="getProgressStatus(memPercent)">{{ memPercent }}%</NProgress>
         </NFlex>
         <NFlex v-if="diskUsage" style="width: 100%" align="center" :wrap="false">
-          <NIcon :component="SaveOutlined" />
+          <NIcon :component="HardDriveIcon" />
           <span style="word-break: keep-all">{{ diskUsageLabel || '磁盘' }}</span>
           <NProgress :percentage="diskPercent" :status="getProgressStatus(diskPercent)">{{ diskPercent }}%</NProgress>
         </NFlex>
         <NFlex v-if="runningTime" style="width: 100%" align="center" :wrap="false">
-          <NIcon :component="ClockCircleOutlined" />
+          <NIcon :component="ClockCheckIcon" />
           <span>{{ runningTimeLabel || '运行时间' }}</span>
           <span>{{ formattedRunningTime }}</span>
         </NFlex>

src/components/device/device-card/components/current-diag/device-header-card.vue

@@ -5,9 +5,9 @@ import { DEVICE_TYPE_LITERALS, DEVICE_TYPE_NAMES, tryGetDeviceType } from '@/enu
 import { useDeviceStore } from '@/stores';
 import { parseErrorFeedback } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
-import { ApiOutlined, ReloadOutlined } from '@vicons/antd';
 import { isCancel } from 'axios';
 import destr from 'destr';
+import { LinkIcon, RotateCwIcon } from 'lucide-vue-next';
 import { NButton, NCard, NFlex, NIcon, NTag, NTooltip } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import { computed, inject, onBeforeUnmount, ref, toRefs } from 'vue';
@@ -152,7 +152,7 @@ onBeforeUnmount(() => {
               <template #trigger>
                 <NButton size="small" quaternary circle :loading="probing" @click="() => probeDevice()">
                   <template #icon>
-                    <NIcon :component="ApiOutlined" />
+                    <NIcon :component="LinkIcon" />
                   </template>
                 </NButton>
               </template>
@@ -164,7 +164,7 @@ onBeforeUnmount(() => {
               <template #trigger>
                 <NButton size="small" quaternary circle :loading="loading" @click="() => detailDevice()">
                   <template #icon>
-                    <NIcon :component="ReloadOutlined" />
+                    <NIcon :component="RotateCwIcon" />
                   </template>
                 </NButton>
               </template>

src/components/device/device-card/components/current-diag/nvr-record-card.vue

@@ -4,9 +4,9 @@ import { exportRecordDiagCsv, transformRecordChecks } from '@/helpers';
 import { useStationStore } from '@/stores';
 import { parseErrorFeedback } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
-import { DownloadOutlined, ReloadOutlined } from '@vicons/antd';
 import { isCancel } from 'axios';
 import dayjs from 'dayjs';
+import { DownloadIcon, RotateCwIcon } from 'lucide-vue-next';
 import { NButton, NCard, NFlex, NIcon, NPagination, NPopconfirm, NPopover, NRadioButton, NRadioGroup, NTooltip, useThemeVars } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import { computed, onBeforeUnmount, onMounted, ref, toRefs, watch } from 'vue';
@@ -139,6 +139,7 @@ watch(
   () => ndmDevice.value.id,
   (devieDbId) => {
     if (devieDbId) {
+      recordChecks.value = [];
       getRecordCheckByParentId();
     }
   },
@@ -170,7 +171,7 @@ onBeforeUnmount(() => {
           <template #trigger>
             <NButton size="small" quaternary circle :loading="loading" @click="() => getRecordCheckByParentId()">
               <template #icon>
-                <NIcon :component="ReloadOutlined" />
+                <NIcon :component="RotateCwIcon" />
               </template>
             </NButton>
           </template>
@@ -182,7 +183,7 @@ onBeforeUnmount(() => {
           <template #trigger>
             <NButton size="small" quaternary circle @click="onExportRecordCheck">
               <template #icon>
-                <NIcon :component="DownloadOutlined" />
+                <NIcon :component="DownloadIcon" />
               </template>
             </NButton>
           </template>

src/components/device/device-card/components/current-diag/security-box-circuit-card.vue

@@ -17,11 +17,11 @@ import { SELECT_DEVICE_FN_INJECTION_KEY } from '@/constants';
 import { useDeviceStore, useSettingStore } from '@/stores';
 import { parseErrorFeedback } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
-import { PoweroffOutlined } from '@vicons/antd';
 import { watchImmediate } from '@vueuse/core';
 import { isCancel } from 'axios';
 import destr from 'destr';
 import { cloneDeep, isFunction } from 'es-toolkit';
+import { PowerIcon } from 'lucide-vue-next';
 import { NButton, NCard, NDescriptions, NDescriptionsItem, NDropdown, NFlex, NIcon, NPopconfirm, NPopover, NSwitch, NTag, useThemeVars, type DropdownOption, type TagProps } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import { computed, inject, ref, toRefs } from 'vue';
@@ -313,7 +313,7 @@ const { mutate: unlinkDevice } = useMutation({
                   <NFlex align="center">
                     <NTag class="pointer-cursor" size="small" :type="getCircuitStatusTagType(circuit)">
                       <template #icon>
-                        <NIcon :component="PoweroffOutlined" />
+                        <NIcon :component="PowerIcon" />
                       </template>
                       <template #default>
                         <span>{{ getCircuitStatusText(circuit) }}</span>

src/components/device/device-card/components/current-diag/security-box-env-card.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
-import { ThunderboltOutlined } from '@vicons/antd';
+import { DropletIcon, FanIcon, ShieldIcon, ThermometerIcon, ZapIcon } from 'lucide-vue-next';
-import { ApertureOutline, LockOpenOutline, ThermometerOutline, WaterOutline } from '@vicons/ionicons5';
 import { NCard, NFlex, NIcon, NTag } from 'naive-ui';
 import { computed, toRefs } from 'vue';
 
@@ -52,7 +51,7 @@ const formattedFanSpeeds = computed(() => {
       <NFlex vertical>
         <NTag>
           <template #icon>
-            <NIcon :component="ThermometerOutline" />
+            <NIcon :component="ThermometerIcon" />
           </template>
           <template #default>
             <span>温度: {{ temperature }}℃</span>
@@ -60,7 +59,7 @@ const formattedFanSpeeds = computed(() => {
         </NTag>
         <NTag>
           <template #icon>
-            <NIcon :component="WaterOutline" />
+            <NIcon :component="DropletIcon" />
           </template>
           <template #default>
             <span>湿度: {{ humidity }}%</span>
@@ -68,7 +67,7 @@ const formattedFanSpeeds = computed(() => {
         </NTag>
         <NTag>
           <template #icon>
-            <NIcon :component="ApertureOutline" />
+            <NIcon :component="FanIcon" />
           </template>
           <template #default>
             <span>风扇: {{ formattedFanSpeeds }}</span>
@@ -76,7 +75,7 @@ const formattedFanSpeeds = computed(() => {
         </NTag>
         <NTag :type="getStatusTagType(accessControlStatus)">
           <template #icon>
-            <NIcon :component="LockOpenOutline" />
+            <NIcon :component="ShieldIcon" />
           </template>
           <template #default>
             <span>门禁: {{ accessControlStatus }}</span>
@@ -84,7 +83,7 @@ const formattedFanSpeeds = computed(() => {
         </NTag>
         <NTag :type="getStatusTagType(lightningProtectionStatus)">
           <template #icon>
-            <NIcon :component="ThunderboltOutlined" />
+            <NIcon :component="ZapIcon" />
           </template>
           <template #default>
             <span>防雷: {{ lightningProtectionStatus }}</span>

src/components/global/settings-drawer/settings-drawer.vue

@@ -5,12 +5,12 @@ import { NDM_ALARM_STORE_ID, NDM_DEVICE_STORE_ID, NDM_STATION_STORE_ID } from '@
 import { usePollingStore, useSettingStore } from '@/stores';
 import { downloadByData, getAppEnvConfig, parseErrorFeedback, sleep } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
-import { DeleteOutlined, ExportOutlined, ImportOutlined } from '@vicons/antd';
 import { useEventListener } from '@vueuse/core';
 import axios, { isCancel } from 'axios';
 import destr from 'destr';
 import { isFunction } from 'es-toolkit';
 import localforage from 'localforage';
+import { DownloadIcon, Trash2Icon, UploadIcon } from 'lucide-vue-next';
 import { NButton, NButtonGroup, NDivider, NDrawer, NDrawerContent, NDropdown, NFlex, NFormItem, NIcon, NInput, NInputNumber, NModal, NSwitch, NText, type DropdownOption } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import { ref, watch } from 'vue';
@@ -336,7 +336,7 @@ const onDrawerAfterLeave = () => {
               <NDropdown trigger="click" :options="exportDropdownOptions" @select="onSelectDropdownOption">
                 <NButton secondary size="small">
                   <template #icon>
-                    <NIcon :component="ExportOutlined" />
+                    <NIcon :component="DownloadIcon" />
                   </template>
                   <template #default>导出</template>
                 </NButton>
@@ -344,7 +344,7 @@ const onDrawerAfterLeave = () => {
               <NDropdown trigger="click" :options="importDropdownOptions" @select="onSelectDropdownOption">
                 <NButton secondary size="small">
                   <template #icon>
-                    <NIcon :component="ImportOutlined" />
+                    <NIcon :component="UploadIcon" />
                   </template>
                   <template #default>导入</template>
                 </NButton>
@@ -352,7 +352,7 @@ const onDrawerAfterLeave = () => {
               <NDropdown trigger="click" :options="deleteDropdownOptions" @select="onSelectDropdownOption">
                 <NButton secondary size="small">
                   <template #icon>
-                    <NIcon :component="DeleteOutlined" />
+                    <NIcon :component="Trash2Icon" />
                   </template>
                   <template #default>删除</template>
                 </NButton>

src/components/station/station-card/station-card.vue

@@ -1,10 +1,10 @@
 <script setup lang="ts">
 import type { Station, StationAlarms, StationDevices } from '@/apis';
 import { DEVICE_TYPE_LITERALS } from '@/enums';
-import { EllipsisOutlined, MoreOutlined } from '@vicons/antd';
 import axios from 'axios';
 import dayjs from 'dayjs';
 import { isFunction } from 'es-toolkit';
+import { MoreHorizontalIcon, MoreVerticalIcon } from 'lucide-vue-next';
 import { NButton, NCard, NCheckbox, NDropdown, NFlex, NIcon, NTag, NTooltip, useThemeVars, type DropdownOption } from 'naive-ui';
 import { computed, toRefs } from 'vue';
 
@@ -116,7 +116,7 @@ const onSelectDropdownOption = (key: string, option: DropdownOption) => {
         <NDropdown trigger="click" :options="dropdownOptions" @select="onSelectDropdownOption">
           <NButton quaternary size="tiny" :focusable="false">
             <template #icon>
-              <NIcon :component="MoreOutlined" />
+              <NIcon :component="MoreVerticalIcon" />
             </template>
           </NButton>
         </NDropdown>
@@ -129,7 +129,7 @@ const onSelectDropdownOption = (key: string, option: DropdownOption) => {
             <span>{{ deviceCount }} 台设备</span>
             <NButton quaternary size="tiny" :focusable="false" @click="() => emit('clickDetail', 'device', station)">
               <template #icon>
-                <NIcon :component="EllipsisOutlined" />
+                <NIcon :component="MoreHorizontalIcon" />
               </template>
             </NButton>
           </NFlex>
@@ -143,7 +143,7 @@ const onSelectDropdownOption = (key: string, option: DropdownOption) => {
             <!-- 占位按钮，对齐布局 -->
             <NButton quaternary size="tiny" :focusable="false" style="visibility: hidden">
               <template #icon>
-                <NIcon :component="EllipsisOutlined" />
+                <NIcon :component="MoreHorizontalIcon" />
               </template>
             </NButton>
           </NFlex>
@@ -153,7 +153,7 @@ const onSelectDropdownOption = (key: string, option: DropdownOption) => {
           <span :style="{ color: alarmCount > 0 ? themeVars.warningColor : '' }">今日 {{ alarmCount }} 条告警</span>
           <NButton quaternary size="tiny" :focusable="false" @click="() => emit('clickDetail', 'alarm', station)">
             <template #icon>
-              <NIcon :component="EllipsisOutlined" />
+              <NIcon :component="MoreHorizontalIcon" />
             </template>
           </NButton>
         </NFlex>

src/components/station/sync-camera-result-modal/sync-camera-result-modal.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import { watchDebounced } from '@vueuse/core';
-import { NFlex, NIcon, NList, NListItem, NModal, NScrollbar, NStatistic, NText, NThing } from 'naive-ui';
-import { computed, ref, toRefs } from 'vue';
-import { useStationStore } from '@/stores';
-import { storeToRefs } from 'pinia';
 import type { Station, SyncCameraResult } from '@/apis';
-import { DeleteFilled, EditFilled, PlusCircleFilled } from '@vicons/antd';
+import { useStationStore } from '@/stores';
+import { watchDebounced } from '@vueuse/core';
+import { EditIcon, PlusCircleIcon, Trash2Icon } from 'lucide-vue-next';
+import { NFlex, NIcon, NList, NListItem, NModal, NScrollbar, NStatistic, NText, NThing } from 'naive-ui';
+import { storeToRefs } from 'pinia';
+import { computed, ref, toRefs } from 'vue';
 
 const props = defineProps<{
   syncCameraResult: Record<Station['code'], SyncCameraResult>;
@@ -61,19 +61,19 @@ const syncList = computed(() => {
             <NFlex justify="space-around" :size="24" style="margin-top: 8px">
               <NStatistic label="新增">
                 <template #prefix>
-                  <NIcon :component="PlusCircleFilled" />
+                  <NIcon :component="PlusCircleIcon" />
                 </template>
                 {{ insertList.length }}
               </NStatistic>
               <NStatistic label="更新">
                 <template #prefix>
-                  <NIcon :component="EditFilled" />
+                  <NIcon :component="EditIcon" />
                 </template>
                 {{ updateList.length }}
               </NStatistic>
               <NStatistic label="删除">
                 <template #prefix>
-                  <NIcon :component="DeleteFilled" />
+                  <NIcon :component="Trash2Icon" />
                 </template>
                 {{ deleteList.length }}
               </NStatistic>

src/layouts/app-layout.vue

@@ -5,8 +5,8 @@ import { LINE_ALARMS_QUERY_KEY, LINE_DEVICES_QUERY_KEY, LINE_STATIONS_MUTATION_K
 import { useAlarmStore, useSettingStore, useUserStore } from '@/stores';
 import { parseErrorFeedback } from '@/utils';
 import { useIsFetching, useIsMutating, useMutation } from '@tanstack/vue-query';
-import { AlertFilled, CaretDownFilled, DoubleLeftOutlined, DoubleRightOutlined, EnvironmentFilled, FileTextFilled, HddFilled, LogoutOutlined, SettingOutlined } from '@vicons/antd';
 import { isCancel } from 'axios';
+import { ChevronDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ComputerIcon, LogOutIcon, LogsIcon, MapPinIcon, SettingsIcon, SirenIcon } from 'lucide-vue-next';
 import {
   NBadge,
   NButton,
@@ -69,17 +69,17 @@ const menuOptions: MenuOption[] = [
   {
     label: () => h(RouterLink, { to: '/station' }, { default: () => '车站状态' }),
     key: '/station',
-    icon: renderIcon(EnvironmentFilled),
+    icon: renderIcon(MapPinIcon),
   },
   {
     label: () => h(RouterLink, { to: '/device' }, { default: () => '设备诊断' }),
     key: '/device',
-    icon: renderIcon(HddFilled),
+    icon: renderIcon(ComputerIcon),
   },
   {
     label: '设备告警',
     key: '/alarm',
-    icon: renderIcon(AlertFilled),
+    icon: renderIcon(SirenIcon),
     children: [
       {
         label: () => h(RouterLink, { to: '/alarm/alarm-log' }, { default: () => '设备告警记录' }),
@@ -94,7 +94,7 @@ const menuOptions: MenuOption[] = [
   {
     label: '系统日志',
     key: '/log',
-    icon: renderIcon(FileTextFilled),
+    icon: renderIcon(LogsIcon),
     children: [
       {
         label: () => h(RouterLink, { to: '/log/vimp-log' }, { default: () => '视频平台日志' }),
@@ -112,7 +112,7 @@ const dropdownOptions: DropdownOption[] = [
   {
     label: '退出登录',
     key: 'logout',
-    icon: renderIcon(LogoutOutlined),
+    icon: renderIcon(LogOutIcon),
     onClick: async () => {
       try {
         await userStore.userLogout();
@@ -181,7 +181,7 @@ function renderIcon(icon: Component): () => VNode {
         <NMenu :collapsed="menuCollpased" :collapsed-width="64" :collapsed-icon-size="20" :value="route.path" :options="menuOptions" />
         <NButton block quaternary :focusable="false" @click="onToggleMenuCollapsed">
           <template #icon>
-            <NIcon :component="menuCollpased ? DoubleRightOutlined : DoubleLeftOutlined" />
+            <NIcon :component="menuCollpased ? ChevronsRightIcon : ChevronsLeftIcon" />
           </template>
         </NButton>
       </NFlex>
@@ -201,13 +201,13 @@ function renderIcon(icon: Component): () => VNode {
                   <span>{{ userInfo?.nickName ?? '' }}</span>
                 </template>
                 <template #icon>
-                  <NIcon :component="CaretDownFilled" />
+                  <NIcon :component="ChevronDownIcon" />
                 </template>
               </NButton>
             </NDropdown>
             <NButton quaternary :focusable="false" style="height: 100%" @click="openSettingsDrawer">
               <template #icon>
-                <NIcon :component="SettingOutlined" />
+                <NIcon :component="SettingsIcon" />
               </template>
             </NButton>
           </NFlex>
@@ -221,7 +221,7 @@ function renderIcon(icon: Component): () => VNode {
           <NBadge :value="unreadAlarmCount">
             <NButton secondary strong @click="routeToAlarmPage">
               <template #icon>
-                <NIcon :component="AlertFilled" />
+                <NIcon :component="SirenIcon" />
               </template>
             </NButton>
           </NBadge>