skycurtain/ndm-web-platform
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 更新图标库为 lucide

Browse Source
This commit is contained in:
yangsy
2026-01-13 11:10:12 +08:00
parent b392328f37
commit bd6ad9b932
11 changed files with 62 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/device/device-card/components/current-diag/device-hardware-card.vue
View File

@@ -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>

6
src/components/device/device-card/components/current-diag/device-header-card.vue
View File

@@ -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>

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

@@ -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>

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

@@ -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>

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

@@ -1,6 +1,5 @@
<script setup lang="ts">
import { ThunderboltOutlined } from '@vicons/antd';
import { ApertureOutline, LockOpenOutline, ThermometerOutline, WaterOutline } from '@vicons/ionicons5';
import { DropletIcon, FanIcon, ShieldIcon, ThermometerIcon, ZapIcon } from 'lucide-vue-next';
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>