fix: 🐛 同步部分页面的图标方案至 @unocss/preset-icons

closed #IBKZ2I
This commit is contained in:
Ray.Hao
2025-02-08 20:15:24 +08:00
parent dc85bb0afe
commit 3b3a2cf1c9
4 changed files with 5 additions and 9 deletions

View File

@@ -453,7 +453,6 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import SvgIcon from "@/components/SvgIcon/index.vue";
import { hasAuth } from "@/plugins/permission"; import { hasAuth } from "@/plugins/permission";
import { useDateFormat, useThrottleFn } from "@vueuse/core"; import { useDateFormat, useThrottleFn } from "@vueuse/core";
import { import {

View File

@@ -59,14 +59,14 @@
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> <template #label>
<SvgIcon icon-class="tree" /> <div class="i-svg:tree" />
部门 部门
</template> </template>
{{ userProfile.deptName }} {{ userProfile.deptName }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> <template #label>
<SvgIcon icon-class="role" /> <div class="i-svg:role" />
角色 角色
</template> </template>
{{ userProfile.roleNames }} {{ userProfile.roleNames }}

View File

@@ -13,8 +13,7 @@
<div class="dialog-toolbar"> <div class="dialog-toolbar">
<!-- 全屏/退出全屏按钮 --> <!-- 全屏/退出全屏按钮 -->
<el-button circle @click="toggleFullscreen"> <el-button circle @click="toggleFullscreen">
<SvgIcon v-if="isFullscreen" icon-class="fullscreen-exit" /> <div :class="`i-svg:${isFullscreen ? 'fullscreen-exit' : 'fullscreen'}`" />
<SvgIcon v-else icon-class="fullscreen" />
</el-button> </el-button>
<!-- 关闭按钮 --> <!-- 关闭按钮 -->
<el-button circle @click="handleClose"> <el-button circle @click="handleClose">

View File

@@ -60,12 +60,10 @@ export default defineConfig({
}, },
// 图表集合 // 图表集合
collections: { collections: {
// svg 是图标集合名称,使用 `i-svg:图标名` 调用
svg: FileSystemIconLoader(iconsDir, (svg) => { svg: FileSystemIconLoader(iconsDir, (svg) => {
// 如果 `fill` 没有定义,则添加 `fill="currentColor"` // 如果 `fill` 没有定义,则添加 `fill="currentColor"`
if (!svg.includes('fill="')) { return svg.includes('fill="') ? svg : svg.replace(/^<svg /, '<svg fill="currentColor" ');
return svg.replace(/^<svg /, '<svg fill="currentColor" ');
}
return svg;
}), }),
}, },
}), }),