perf: 优化使用离线图标后运行慢问题

This commit is contained in:
kailong321200875 2024-06-05 16:26:46 +08:00
parent 4b43c87949
commit 7e9c4a6109
39 changed files with 2466 additions and 2412 deletions

View File

@ -26,7 +26,7 @@ export default [
title: '首页', title: '首页',
meta: { meta: {
title: '首页', title: '首页',
icon: 'ant-design:dashboard-filled', icon: 'vi-ant-design:dashboard-filled',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -90,7 +90,7 @@ export default [
component: '#', component: '#',
meta: { meta: {
title: '文档', title: '文档',
icon: 'clarity:document-solid' icon: 'vi-clarity:document-solid'
}, },
name: 'ExternalLink', name: 'ExternalLink',
status: Mock.Random.integer(0, 1), status: Mock.Random.integer(0, 1),
@ -125,7 +125,7 @@ export default [
title: '菜单', title: '菜单',
meta: { meta: {
title: '菜单', title: '菜单',
icon: 'carbon:skill-level-advanced' icon: 'vi-carbon:skill-level-advanced'
}, },
children: [ children: [
{ {
@ -214,7 +214,7 @@ export default [
title: '综合示例', title: '综合示例',
meta: { meta: {
title: '综合示例', title: '综合示例',
icon: 'ep:management', icon: 'vi-ep:management',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [

View File

@ -12,7 +12,7 @@ const adminList = [
name: 'Dashboard', name: 'Dashboard',
meta: { meta: {
title: 'router.dashboard', title: 'router.dashboard',
icon: 'ant-design:dashboard-filled', icon: 'vi-ant-design:dashboard-filled',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -49,7 +49,7 @@ const adminList = [
name: 'DocumentLink', name: 'DocumentLink',
meta: { meta: {
title: 'router.document', title: 'router.document',
icon: 'clarity:document-solid' icon: 'vi-clarity:document-solid'
} }
} }
] ]
@ -66,7 +66,7 @@ const adminList = [
name: 'GuideDemo', name: 'GuideDemo',
meta: { meta: {
title: 'router.guide', title: 'router.guide',
icon: 'cib:telegram-plane' icon: 'vi-cib:telegram-plane'
} }
} }
] ]
@ -78,7 +78,7 @@ const adminList = [
name: 'ComponentsDemo', name: 'ComponentsDemo',
meta: { meta: {
title: 'router.component', title: 'router.component',
icon: 'bx:bxs-component', icon: 'vi-bx:bxs-component',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -358,7 +358,7 @@ const adminList = [
name: 'Function', name: 'Function',
meta: { meta: {
title: 'router.function', title: 'router.function',
icon: 'ri:function-fill', icon: 'vi-ri:function-fill',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -406,7 +406,7 @@ const adminList = [
name: 'Hooks', name: 'Hooks',
meta: { meta: {
title: 'hooks', title: 'hooks',
icon: 'ic:outline-webhook', icon: 'vi-ic:outline-webhook',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -467,7 +467,7 @@ const adminList = [
name: 'Level', name: 'Level',
meta: { meta: {
title: 'router.level', title: 'router.level',
icon: 'carbon:skill-level-advanced' icon: 'vi-carbon:skill-level-advanced'
}, },
children: [ children: [
{ {
@ -526,7 +526,7 @@ const adminList = [
name: 'Example', name: 'Example',
meta: { meta: {
title: 'router.example', title: 'router.example',
icon: 'ep:management', icon: 'vi-ep:management',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -594,7 +594,7 @@ const adminList = [
name: 'Error', name: 'Error',
meta: { meta: {
title: 'router.errorPage', title: 'router.errorPage',
icon: 'ci:error', icon: 'vi-ci:error',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -631,7 +631,7 @@ const adminList = [
name: 'Authorization', name: 'Authorization',
meta: { meta: {
title: 'router.authorization', title: 'router.authorization',
icon: 'eos-icons:role-binding', icon: 'vi-eos-icons:role-binding',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -762,7 +762,7 @@ const menus = [
id: 1, id: 1,
meta: { meta: {
title: '首页', title: '首页',
icon: 'ant-design:dashboard-filled', icon: 'vi-ant-design:dashboard-filled',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -795,7 +795,7 @@ const menus = [
component: '#', component: '#',
meta: { meta: {
title: '文档', title: '文档',
icon: 'clarity:document-solid' icon: 'vi-clarity:document-solid'
}, },
name: 'ExternalLink', name: 'ExternalLink',
status: Mock.Random.integer(0, 1), status: Mock.Random.integer(0, 1),
@ -821,7 +821,7 @@ const menus = [
id: 6, id: 6,
meta: { meta: {
title: '菜单', title: '菜单',
icon: 'carbon:skill-level-advanced' icon: 'vi-carbon:skill-level-advanced'
}, },
children: [ children: [
{ {
@ -898,7 +898,7 @@ const menus = [
id: 12, id: 12,
meta: { meta: {
title: '综合示例', title: '综合示例',
icon: 'ep:management', icon: 'vi-ep:management',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -990,7 +990,7 @@ const menus = [
id: 1, id: 1,
meta: { meta: {
title: '首页', title: '首页',
icon: 'ant-design:dashboard-filled', icon: 'vi-ant-design:dashboard-filled',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -1025,7 +1025,7 @@ const menus = [
component: '#', component: '#',
meta: { meta: {
title: '文档', title: '文档',
icon: 'clarity:document-solid' icon: 'vi-clarity:document-solid'
}, },
name: 'ExternalLink', name: 'ExternalLink',
status: Mock.Random.integer(0, 1), status: Mock.Random.integer(0, 1),
@ -1051,7 +1051,7 @@ const menus = [
id: 6, id: 6,
meta: { meta: {
title: '菜单', title: '菜单',
icon: 'carbon:skill-level-advanced' icon: 'vi-carbon:skill-level-advanced'
}, },
children: [ children: [
{ {
@ -1130,7 +1130,7 @@ const menus = [
id: 12, id: 12,
meta: { meta: {
title: '综合示例', title: '综合示例',
icon: 'ep:management', icon: 'vi-ep:management',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [

View File

@ -3,6 +3,7 @@ import fs from 'fs-extra'
import inquirer from 'inquirer' import inquirer from 'inquirer'
import chalk from 'chalk' import chalk from 'chalk'
import pkg from '../package.json' import pkg from '../package.json'
import { ICON_PREFIX } from '../src/constants'
interface Icon { interface Icon {
name: string name: string
@ -52,11 +53,12 @@ async function generateIcon() {
const data = await fs.readJSON(path.join(dir, 'json', `${info.id}.json`)) const data = await fs.readJSON(path.join(dir, 'json', `${info.id}.json`))
if (data) { if (data) {
const { prefix } = data const { prefix } = data
const icons = Object.keys(data.icons).map((item) => `${prefix}:${item}`) const prefixName = `${ICON_PREFIX}${prefix}`
const icons = Object.keys(data.icons).map((item) => `${prefixName}:${item}`)
await fs.writeFileSync( await fs.writeFileSync(
path.join('src/components/IconPicker/src/data', `icons.${prefix}.ts`), path.join('src/components/IconPicker/src/data', `icons.${prefix}.ts`),
`export default ${JSON.stringify({ name: info.name, prefix, icons })}` `export default ${JSON.stringify({ name: info.name, prefix: prefixName, icons })}`
) )
// ↓分类处理完成push类型名称 // ↓分类处理完成push类型名称
prefixSet.push(prefix) prefixSet.push(prefix)

View File

@ -26,7 +26,7 @@ const toggleCollapse = () => {
<div :class="prefixCls" @click="toggleCollapse"> <div :class="prefixCls" @click="toggleCollapse">
<Icon <Icon
:size="18" :size="18"
:icon="collapse ? 'ant-design:menu-unfold-outlined' : 'ant-design:menu-fold-outlined'" :icon="collapse ? 'vi-ant-design:menu-unfold-outlined' : 'vi-ant-design:menu-fold-outlined'"
:color="color" :color="color"
class="cursor-pointer" class="cursor-pointer"
/> />

View File

@ -22,7 +22,7 @@ defineProps({
<template #content> <template #content>
<div class="max-w-200px">{{ message }}</div> <div class="max-w-200px">{{ message }}</div>
</template> </template>
<Icon class="ml-5px" icon="bi:question-circle-fill" :size="14" /> <Icon class="ml-5px" icon="vi-bi:question-circle-fill" :size="14" />
</ElTooltip> </ElTooltip>
<div class="flex pl-20px flex-grow"> <div class="flex pl-20px flex-grow">
<slot name="header"></slot> <slot name="header"></slot>

View File

@ -97,12 +97,14 @@ export default defineComponent({
{props.title} {props.title}
{props.message ? ( {props.message ? (
<ElTooltip content={props.message} placement="right"> <ElTooltip content={props.message} placement="right">
<Icon icon="bi:question-circle-fill" class="ml-5px" size={14} /> <Icon icon="vi-bi:question-circle-fill" class="ml-5px" size={14} />
</ElTooltip> </ElTooltip>
) : null} ) : null}
</div> </div>
</div> </div>
{props.collapse ? <Icon icon={show.value ? 'ep:arrow-down' : 'ep:arrow-up'} /> : null} {props.collapse ? (
<Icon icon={show.value ? 'vi-ep:arrow-down' : 'vi-ep:arrow-up'} />
) : null}
</div> </div>
) : null} ) : null}

View File

@ -78,14 +78,16 @@ const dialogStyle = computed(() => {
<Icon <Icon
v-if="fullscreen" v-if="fullscreen"
class="cursor-pointer is-hover !h-54px mr-10px" class="cursor-pointer is-hover !h-54px mr-10px"
:icon="isFullscreen ? 'radix-icons:exit-full-screen' : 'radix-icons:enter-full-screen'" :icon="
isFullscreen ? 'vi-radix-icons:exit-full-screen' : 'vi-radix-icons:enter-full-screen'
"
color="var(--el-color-info)" color="var(--el-color-info)"
hover-color="var(--el-color-primary)" hover-color="var(--el-color-primary)"
@click="toggleFull" @click="toggleFull"
/> />
<Icon <Icon
class="cursor-pointer is-hover !h-54px" class="cursor-pointer is-hover !h-54px"
icon="ep:close" icon="vi-ep:close"
hover-color="var(--el-color-primary)" hover-color="var(--el-color-primary)"
color="var(--el-color-info)" color="var(--el-color-info)"
@click="close" @click="close"

View File

@ -4,6 +4,7 @@ import { ElIcon } from 'element-plus'
import { propTypes } from '@/utils/propTypes' import { propTypes } from '@/utils/propTypes'
import { useDesign } from '@/hooks/web/useDesign' import { useDesign } from '@/hooks/web/useDesign'
import { Icon } from '@iconify/vue' import { Icon } from '@iconify/vue'
import { ICON_PREFIX } from '@/constants'
const { getPrefixCls } = useDesign() const { getPrefixCls } = useDesign()
@ -37,6 +38,10 @@ const getIconifyStyle = computed(() => {
color color
} }
}) })
const getIconName = computed(() => {
return props.icon.startsWith(ICON_PREFIX) ? props.icon.replace(ICON_PREFIX, '') : props.icon
})
</script> </script>
<template> <template>
@ -46,7 +51,7 @@ const getIconifyStyle = computed(() => {
</svg> </svg>
<template v-else> <template v-else>
<Icon v-if="isUseOnline" :icon="icon" :style="getIconifyStyle" /> <Icon v-if="isUseOnline" :icon="getIconName" :style="getIconifyStyle" />
<div v-else :class="`${icon} iconify`" :style="getIconifyStyle"></div> <div v-else :class="`${icon} iconify`" :style="getIconifyStyle"></div>
</template> </template>
</ElIcon> </ElIcon>

File diff suppressed because it is too large Load Diff

View File

@ -1,299 +1,299 @@
export default { export default {
name: 'Element Plus', name: 'Element Plus',
prefix: 'ep', prefix: 'vi-ep',
icons: [ icons: [
'ep:add-location', 'vi-ep:add-location',
'ep:aim', 'vi-ep:aim',
'ep:alarm-clock', 'vi-ep:alarm-clock',
'ep:apple', 'vi-ep:apple',
'ep:arrow-down', 'vi-ep:arrow-down',
'ep:arrow-down-bold', 'vi-ep:arrow-down-bold',
'ep:arrow-left', 'vi-ep:arrow-left',
'ep:arrow-left-bold', 'vi-ep:arrow-left-bold',
'ep:arrow-right', 'vi-ep:arrow-right',
'ep:arrow-right-bold', 'vi-ep:arrow-right-bold',
'ep:arrow-up', 'vi-ep:arrow-up',
'ep:arrow-up-bold', 'vi-ep:arrow-up-bold',
'ep:avatar', 'vi-ep:avatar',
'ep:back', 'vi-ep:back',
'ep:baseball', 'vi-ep:baseball',
'ep:basketball', 'vi-ep:basketball',
'ep:bell', 'vi-ep:bell',
'ep:bell-filled', 'vi-ep:bell-filled',
'ep:bicycle', 'vi-ep:bicycle',
'ep:bottom', 'vi-ep:bottom',
'ep:bottom-left', 'vi-ep:bottom-left',
'ep:bottom-right', 'vi-ep:bottom-right',
'ep:bowl', 'vi-ep:bowl',
'ep:box', 'vi-ep:box',
'ep:briefcase', 'vi-ep:briefcase',
'ep:brush', 'vi-ep:brush',
'ep:brush-filled', 'vi-ep:brush-filled',
'ep:burger', 'vi-ep:burger',
'ep:calendar', 'vi-ep:calendar',
'ep:camera', 'vi-ep:camera',
'ep:camera-filled', 'vi-ep:camera-filled',
'ep:caret-bottom', 'vi-ep:caret-bottom',
'ep:caret-left', 'vi-ep:caret-left',
'ep:caret-right', 'vi-ep:caret-right',
'ep:caret-top', 'vi-ep:caret-top',
'ep:cellphone', 'vi-ep:cellphone',
'ep:chat-dot-round', 'vi-ep:chat-dot-round',
'ep:chat-dot-square', 'vi-ep:chat-dot-square',
'ep:chat-line-round', 'vi-ep:chat-line-round',
'ep:chat-line-square', 'vi-ep:chat-line-square',
'ep:chat-round', 'vi-ep:chat-round',
'ep:chat-square', 'vi-ep:chat-square',
'ep:check', 'vi-ep:check',
'ep:checked', 'vi-ep:checked',
'ep:cherry', 'vi-ep:cherry',
'ep:chicken', 'vi-ep:chicken',
'ep:chrome-filled', 'vi-ep:chrome-filled',
'ep:circle-check', 'vi-ep:circle-check',
'ep:circle-check-filled', 'vi-ep:circle-check-filled',
'ep:circle-close', 'vi-ep:circle-close',
'ep:circle-close-filled', 'vi-ep:circle-close-filled',
'ep:circle-plus', 'vi-ep:circle-plus',
'ep:circle-plus-filled', 'vi-ep:circle-plus-filled',
'ep:clock', 'vi-ep:clock',
'ep:close', 'vi-ep:close',
'ep:close-bold', 'vi-ep:close-bold',
'ep:cloudy', 'vi-ep:cloudy',
'ep:coffee', 'vi-ep:coffee',
'ep:coffee-cup', 'vi-ep:coffee-cup',
'ep:coin', 'vi-ep:coin',
'ep:cold-drink', 'vi-ep:cold-drink',
'ep:collection', 'vi-ep:collection',
'ep:collection-tag', 'vi-ep:collection-tag',
'ep:comment', 'vi-ep:comment',
'ep:compass', 'vi-ep:compass',
'ep:connection', 'vi-ep:connection',
'ep:coordinate', 'vi-ep:coordinate',
'ep:copy-document', 'vi-ep:copy-document',
'ep:cpu', 'vi-ep:cpu',
'ep:credit-card', 'vi-ep:credit-card',
'ep:crop', 'vi-ep:crop',
'ep:d-arrow-left', 'vi-ep:d-arrow-left',
'ep:d-arrow-right', 'vi-ep:d-arrow-right',
'ep:d-caret', 'vi-ep:d-caret',
'ep:data-analysis', 'vi-ep:data-analysis',
'ep:data-board', 'vi-ep:data-board',
'ep:data-line', 'vi-ep:data-line',
'ep:delete', 'vi-ep:delete',
'ep:delete-filled', 'vi-ep:delete-filled',
'ep:delete-location', 'vi-ep:delete-location',
'ep:dessert', 'vi-ep:dessert',
'ep:discount', 'vi-ep:discount',
'ep:dish', 'vi-ep:dish',
'ep:dish-dot', 'vi-ep:dish-dot',
'ep:document', 'vi-ep:document',
'ep:document-add', 'vi-ep:document-add',
'ep:document-checked', 'vi-ep:document-checked',
'ep:document-copy', 'vi-ep:document-copy',
'ep:document-delete', 'vi-ep:document-delete',
'ep:document-remove', 'vi-ep:document-remove',
'ep:download', 'vi-ep:download',
'ep:drizzling', 'vi-ep:drizzling',
'ep:edit', 'vi-ep:edit',
'ep:edit-pen', 'vi-ep:edit-pen',
'ep:eleme', 'vi-ep:eleme',
'ep:eleme-filled', 'vi-ep:eleme-filled',
'ep:element-plus', 'vi-ep:element-plus',
'ep:expand', 'vi-ep:expand',
'ep:failed', 'vi-ep:failed',
'ep:female', 'vi-ep:female',
'ep:files', 'vi-ep:files',
'ep:film', 'vi-ep:film',
'ep:filter', 'vi-ep:filter',
'ep:finished', 'vi-ep:finished',
'ep:first-aid-kit', 'vi-ep:first-aid-kit',
'ep:flag', 'vi-ep:flag',
'ep:fold', 'vi-ep:fold',
'ep:folder', 'vi-ep:folder',
'ep:folder-add', 'vi-ep:folder-add',
'ep:folder-checked', 'vi-ep:folder-checked',
'ep:folder-delete', 'vi-ep:folder-delete',
'ep:folder-opened', 'vi-ep:folder-opened',
'ep:folder-remove', 'vi-ep:folder-remove',
'ep:food', 'vi-ep:food',
'ep:football', 'vi-ep:football',
'ep:fork-spoon', 'vi-ep:fork-spoon',
'ep:fries', 'vi-ep:fries',
'ep:full-screen', 'vi-ep:full-screen',
'ep:goblet', 'vi-ep:goblet',
'ep:goblet-full', 'vi-ep:goblet-full',
'ep:goblet-square', 'vi-ep:goblet-square',
'ep:goblet-square-full', 'vi-ep:goblet-square-full',
'ep:gold-medal', 'vi-ep:gold-medal',
'ep:goods', 'vi-ep:goods',
'ep:goods-filled', 'vi-ep:goods-filled',
'ep:grape', 'vi-ep:grape',
'ep:grid', 'vi-ep:grid',
'ep:guide', 'vi-ep:guide',
'ep:handbag', 'vi-ep:handbag',
'ep:headset', 'vi-ep:headset',
'ep:help', 'vi-ep:help',
'ep:help-filled', 'vi-ep:help-filled',
'ep:hide', 'vi-ep:hide',
'ep:histogram', 'vi-ep:histogram',
'ep:home-filled', 'vi-ep:home-filled',
'ep:hot-water', 'vi-ep:hot-water',
'ep:house', 'vi-ep:house',
'ep:ice-cream', 'vi-ep:ice-cream',
'ep:ice-cream-round', 'vi-ep:ice-cream-round',
'ep:ice-cream-square', 'vi-ep:ice-cream-square',
'ep:ice-drink', 'vi-ep:ice-drink',
'ep:ice-tea', 'vi-ep:ice-tea',
'ep:info-filled', 'vi-ep:info-filled',
'ep:iphone', 'vi-ep:iphone',
'ep:key', 'vi-ep:key',
'ep:knife-fork', 'vi-ep:knife-fork',
'ep:lightning', 'vi-ep:lightning',
'ep:link', 'vi-ep:link',
'ep:list', 'vi-ep:list',
'ep:loading', 'vi-ep:loading',
'ep:location', 'vi-ep:location',
'ep:location-filled', 'vi-ep:location-filled',
'ep:location-information', 'vi-ep:location-information',
'ep:lock', 'vi-ep:lock',
'ep:lollipop', 'vi-ep:lollipop',
'ep:magic-stick', 'vi-ep:magic-stick',
'ep:magnet', 'vi-ep:magnet',
'ep:male', 'vi-ep:male',
'ep:management', 'vi-ep:management',
'ep:map-location', 'vi-ep:map-location',
'ep:medal', 'vi-ep:medal',
'ep:memo', 'vi-ep:memo',
'ep:menu', 'vi-ep:menu',
'ep:message', 'vi-ep:message',
'ep:message-box', 'vi-ep:message-box',
'ep:mic', 'vi-ep:mic',
'ep:microphone', 'vi-ep:microphone',
'ep:milk-tea', 'vi-ep:milk-tea',
'ep:minus', 'vi-ep:minus',
'ep:money', 'vi-ep:money',
'ep:monitor', 'vi-ep:monitor',
'ep:moon', 'vi-ep:moon',
'ep:moon-night', 'vi-ep:moon-night',
'ep:more', 'vi-ep:more',
'ep:more-filled', 'vi-ep:more-filled',
'ep:mostly-cloudy', 'vi-ep:mostly-cloudy',
'ep:mouse', 'vi-ep:mouse',
'ep:mug', 'vi-ep:mug',
'ep:mute', 'vi-ep:mute',
'ep:mute-notification', 'vi-ep:mute-notification',
'ep:no-smoking', 'vi-ep:no-smoking',
'ep:notebook', 'vi-ep:notebook',
'ep:notification', 'vi-ep:notification',
'ep:odometer', 'vi-ep:odometer',
'ep:office-building', 'vi-ep:office-building',
'ep:open', 'vi-ep:open',
'ep:operation', 'vi-ep:operation',
'ep:opportunity', 'vi-ep:opportunity',
'ep:orange', 'vi-ep:orange',
'ep:paperclip', 'vi-ep:paperclip',
'ep:partly-cloudy', 'vi-ep:partly-cloudy',
'ep:pear', 'vi-ep:pear',
'ep:phone', 'vi-ep:phone',
'ep:phone-filled', 'vi-ep:phone-filled',
'ep:picture', 'vi-ep:picture',
'ep:picture-filled', 'vi-ep:picture-filled',
'ep:picture-rounded', 'vi-ep:picture-rounded',
'ep:pie-chart', 'vi-ep:pie-chart',
'ep:place', 'vi-ep:place',
'ep:platform', 'vi-ep:platform',
'ep:plus', 'vi-ep:plus',
'ep:pointer', 'vi-ep:pointer',
'ep:position', 'vi-ep:position',
'ep:postcard', 'vi-ep:postcard',
'ep:pouring', 'vi-ep:pouring',
'ep:present', 'vi-ep:present',
'ep:price-tag', 'vi-ep:price-tag',
'ep:printer', 'vi-ep:printer',
'ep:promotion', 'vi-ep:promotion',
'ep:quartz-watch', 'vi-ep:quartz-watch',
'ep:question-filled', 'vi-ep:question-filled',
'ep:rank', 'vi-ep:rank',
'ep:reading', 'vi-ep:reading',
'ep:reading-lamp', 'vi-ep:reading-lamp',
'ep:refresh', 'vi-ep:refresh',
'ep:refresh-left', 'vi-ep:refresh-left',
'ep:refresh-right', 'vi-ep:refresh-right',
'ep:refrigerator', 'vi-ep:refrigerator',
'ep:remove', 'vi-ep:remove',
'ep:remove-filled', 'vi-ep:remove-filled',
'ep:right', 'vi-ep:right',
'ep:scale-to-original', 'vi-ep:scale-to-original',
'ep:school', 'vi-ep:school',
'ep:scissor', 'vi-ep:scissor',
'ep:search', 'vi-ep:search',
'ep:select', 'vi-ep:select',
'ep:sell', 'vi-ep:sell',
'ep:semi-select', 'vi-ep:semi-select',
'ep:service', 'vi-ep:service',
'ep:set-up', 'vi-ep:set-up',
'ep:setting', 'vi-ep:setting',
'ep:share', 'vi-ep:share',
'ep:ship', 'vi-ep:ship',
'ep:shop', 'vi-ep:shop',
'ep:shopping-bag', 'vi-ep:shopping-bag',
'ep:shopping-cart', 'vi-ep:shopping-cart',
'ep:shopping-cart-full', 'vi-ep:shopping-cart-full',
'ep:shopping-trolley', 'vi-ep:shopping-trolley',
'ep:smoking', 'vi-ep:smoking',
'ep:soccer', 'vi-ep:soccer',
'ep:sold-out', 'vi-ep:sold-out',
'ep:sort', 'vi-ep:sort',
'ep:sort-down', 'vi-ep:sort-down',
'ep:sort-up', 'vi-ep:sort-up',
'ep:stamp', 'vi-ep:stamp',
'ep:star', 'vi-ep:star',
'ep:star-filled', 'vi-ep:star-filled',
'ep:stopwatch', 'vi-ep:stopwatch',
'ep:success-filled', 'vi-ep:success-filled',
'ep:sugar', 'vi-ep:sugar',
'ep:suitcase', 'vi-ep:suitcase',
'ep:suitcase-line', 'vi-ep:suitcase-line',
'ep:sunny', 'vi-ep:sunny',
'ep:sunrise', 'vi-ep:sunrise',
'ep:sunset', 'vi-ep:sunset',
'ep:switch', 'vi-ep:switch',
'ep:switch-button', 'vi-ep:switch-button',
'ep:switch-filled', 'vi-ep:switch-filled',
'ep:takeaway-box', 'vi-ep:takeaway-box',
'ep:ticket', 'vi-ep:ticket',
'ep:tickets', 'vi-ep:tickets',
'ep:timer', 'vi-ep:timer',
'ep:toilet-paper', 'vi-ep:toilet-paper',
'ep:tools', 'vi-ep:tools',
'ep:top', 'vi-ep:top',
'ep:top-left', 'vi-ep:top-left',
'ep:top-right', 'vi-ep:top-right',
'ep:trend-charts', 'vi-ep:trend-charts',
'ep:trophy', 'vi-ep:trophy',
'ep:trophy-base', 'vi-ep:trophy-base',
'ep:turn-off', 'vi-ep:turn-off',
'ep:umbrella', 'vi-ep:umbrella',
'ep:unlock', 'vi-ep:unlock',
'ep:upload', 'vi-ep:upload',
'ep:upload-filled', 'vi-ep:upload-filled',
'ep:user', 'vi-ep:user',
'ep:user-filled', 'vi-ep:user-filled',
'ep:van', 'vi-ep:van',
'ep:video-camera', 'vi-ep:video-camera',
'ep:video-camera-filled', 'vi-ep:video-camera-filled',
'ep:video-pause', 'vi-ep:video-pause',
'ep:video-play', 'vi-ep:video-play',
'ep:view', 'vi-ep:view',
'ep:wallet', 'vi-ep:wallet',
'ep:wallet-filled', 'vi-ep:wallet-filled',
'ep:warn-triangle-filled', 'vi-ep:warn-triangle-filled',
'ep:warning', 'vi-ep:warning',
'ep:warning-filled', 'vi-ep:warning-filled',
'ep:watch', 'vi-ep:watch',
'ep:watermelon', 'vi-ep:watermelon',
'ep:wind-power', 'vi-ep:wind-power',
'ep:zoom-in', 'vi-ep:zoom-in',
'ep:zoom-out' 'vi-ep:zoom-out'
] ]
} }

File diff suppressed because it is too large Load Diff

View File

@ -199,7 +199,7 @@ defineExpose({
:on-change="uploadChange" :on-change="uploadChange"
> >
<BaseButton size="small" type="primary" class="mt-2px" <BaseButton size="small" type="primary" class="mt-2px"
><Icon icon="ep:upload-filled" ><Icon icon="vi-ep:upload-filled"
/></BaseButton> /></BaseButton>
</ElUpload> </ElUpload>
</ElTooltip> </ElTooltip>
@ -207,37 +207,37 @@ defineExpose({
<div class="flex items-center justify-end flex-1"> <div class="flex items-center justify-end flex-1">
<ElTooltip content="重置" placement="bottom"> <ElTooltip content="重置" placement="bottom">
<BaseButton size="small" type="primary" @click="reset" <BaseButton size="small" type="primary" @click="reset"
><Icon icon="ep:refresh" ><Icon icon="vi-ep:refresh"
/></BaseButton> /></BaseButton>
</ElTooltip> </ElTooltip>
<ElTooltip content="逆时针旋转" placement="bottom"> <ElTooltip content="逆时针旋转" placement="bottom">
<BaseButton size="small" type="primary" @click="rotate(-45)" <BaseButton size="small" type="primary" @click="rotate(-45)"
><Icon icon="ant-design:rotate-left-outlined" ><Icon icon="vi-ant-design:rotate-left-outlined"
/></BaseButton> /></BaseButton>
</ElTooltip> </ElTooltip>
<ElTooltip content="顺时针旋转" placement="bottom"> <ElTooltip content="顺时针旋转" placement="bottom">
<BaseButton size="small" type="primary" @click="rotate(45)" <BaseButton size="small" type="primary" @click="rotate(45)"
><Icon icon="ant-design:rotate-right-outlined" ><Icon icon="vi-ant-design:rotate-right-outlined"
/></BaseButton> /></BaseButton>
</ElTooltip> </ElTooltip>
<ElTooltip content="水平翻转" placement="bottom"> <ElTooltip content="水平翻转" placement="bottom">
<BaseButton size="small" type="primary" @click="scale('scaleX')" <BaseButton size="small" type="primary" @click="scale('scaleX')"
><Icon icon="vaadin:arrows-long-h" ><Icon icon="vi-vaadin:arrows-long-h"
/></BaseButton> /></BaseButton>
</ElTooltip> </ElTooltip>
<ElTooltip content="垂直翻转" placement="bottom"> <ElTooltip content="垂直翻转" placement="bottom">
<BaseButton size="small" type="primary" @click="scale('scaleY')" <BaseButton size="small" type="primary" @click="scale('scaleY')"
><Icon icon="vaadin:arrows-long-v" ><Icon icon="vi-vaadin:arrows-long-v"
/></BaseButton> /></BaseButton>
</ElTooltip> </ElTooltip>
<ElTooltip content="放大" placement="bottom"> <ElTooltip content="放大" placement="bottom">
<BaseButton size="small" type="primary" @click="zoom(0.1)" <BaseButton size="small" type="primary" @click="zoom(0.1)"
><Icon icon="ant-design:zoom-in-outlined" ><Icon icon="vi-ant-design:zoom-in-outlined"
/></BaseButton> /></BaseButton>
</ElTooltip> </ElTooltip>
<ElTooltip content="缩小" placement="bottom"> <ElTooltip content="缩小" placement="bottom">
<BaseButton size="small" type="primary" @click="zoom(-0.1)" <BaseButton size="small" type="primary" @click="zoom(-0.1)"
><Icon icon="ant-design:zoom-out-outlined" ><Icon icon="vi-ant-design:zoom-out-outlined"
/></BaseButton> /></BaseButton>
</ElTooltip> </ElTooltip>
</div> </div>

View File

@ -35,7 +35,7 @@ const keyClick = (key: string) => {
]" ]"
> >
<div v-if="title" :class="[`${prefixCls}__header`, 'flex items-center']"> <div v-if="title" :class="[`${prefixCls}__header`, 'flex items-center']">
<Icon icon="bi:exclamation-circle-fill" :size="22" color="var(--el-color-primary)" /> <Icon icon="vi-bi:exclamation-circle-fill" :size="22" color="var(--el-color-primary)" />
<span :class="[`${prefixCls}__title`, 'pl-5px text-16px font-bold']">{{ title }}</span> <span :class="[`${prefixCls}__title`, 'pl-5px text-16px font-bold']">{{ title }}</span>
</div> </div>
<div :class="`${prefixCls}__content`"> <div :class="`${prefixCls}__content`">

View File

@ -36,7 +36,7 @@ const setLang = (lang: LocaleType) => {
<ElDropdown :class="prefixCls" trigger="click" @command="setLang"> <ElDropdown :class="prefixCls" trigger="click" @command="setLang">
<Icon <Icon
:size="18" :size="18"
icon="ion:language-sharp" icon="vi-ion:language-sharp"
class="cursor-pointer !p-0" class="cursor-pointer !p-0"
:class="$attrs.class" :class="$attrs.class"
:color="color" :color="color"

View File

@ -230,7 +230,7 @@ const disabledClick = () => {
@click="disabledClick" @click="disabledClick"
> >
<div class="absolute top-[50%] left-[50%] font-bold"> <div class="absolute top-[50%] left-[50%] font-bold">
<Icon icon="ep:refresh-right" :size="30" color="var(--el-color-primary)" /> <Icon icon="vi-ep:refresh-right" :size="30" color="var(--el-color-primary)" />
<div>{{ disabledText }}</div> <div>{{ disabledText }}</div>
</div> </div>
</div> </div>

View File

@ -23,7 +23,7 @@ const toggleFullscreen = () => {
<div :class="prefixCls" @click="toggleFullscreen"> <div :class="prefixCls" @click="toggleFullscreen">
<Icon <Icon
:size="18" :size="18"
:icon="isFullscreen ? 'zmdi:fullscreen-exit' : 'zmdi:fullscreen'" :icon="isFullscreen ? 'vi-zmdi:fullscreen-exit' : 'vi-zmdi:fullscreen'"
:color="color" :color="color"
/> />
</div> </div>

View File

@ -34,7 +34,7 @@ const onExpand = () => {
v-if="showSearch" v-if="showSearch"
type="primary" type="primary"
:loading="searchLoading" :loading="searchLoading"
:icon="useIcon({ icon: 'ep:search' })" :icon="useIcon({ icon: 'vi-ep:search' })"
@click="onSearch" @click="onSearch"
> >
{{ t('common.query') }} {{ t('common.query') }}
@ -43,14 +43,14 @@ const onExpand = () => {
v-if="showReset" v-if="showReset"
:loading="resetLoading" :loading="resetLoading"
plain plain
:icon="useIcon({ icon: 'ep:refresh-right' })" :icon="useIcon({ icon: 'vi-ep:refresh-right' })"
@click="onReset" @click="onReset"
> >
{{ t('common.reset') }} {{ t('common.reset') }}
</BaseButton> </BaseButton>
<BaseButton <BaseButton
v-if="showExpand" v-if="showExpand"
:icon="useIcon({ icon: visible ? 'ep:arrow-up' : 'ep:arrow-down' })" :icon="useIcon({ icon: visible ? 'vi-ep:arrow-up' : 'vi-ep:arrow-down' })"
text text
@click="onExpand" @click="onExpand"
> >

View File

@ -161,7 +161,7 @@ const themeChange = () => {
class="fixed top-[45%] right-0 w-40px h-40px flex items-center justify-center bg-[var(--el-color-primary)] cursor-pointer z-10" class="fixed top-[45%] right-0 w-40px h-40px flex items-center justify-center bg-[var(--el-color-primary)] cursor-pointer z-10"
@click="drawer = true" @click="drawer = true"
> >
<Icon icon="ant-design:setting-outlined" color="#fff" /> <Icon icon="vi-ant-design:setting-outlined" color="#fff" />
</div> </div>
<ElDrawer v-model="drawer" direction="rtl" size="350px" :z-index="4000"> <ElDrawer v-model="drawer" direction="rtl" size="350px" :z-index="4000">

View File

@ -49,7 +49,7 @@ watch(
}" }"
@click="colorVal = item" @click="colorVal = item"
> >
<Icon v-if="colorVal === item" color="#fff" icon="ep:check" :size="16" /> <Icon v-if="colorVal === item" color="#fff" icon="vi-ep:check" :size="16" />
</span> </span>
</div> </div>
</template> </template>

View File

@ -27,7 +27,7 @@ const setCurrentSize = (size: ComponentSize) => {
<template> <template>
<ElDropdown :class="prefixCls" trigger="click" @command="setCurrentSize"> <ElDropdown :class="prefixCls" trigger="click" @command="setCurrentSize">
<Icon :size="18" icon="mdi:format-size" :color="color" class="cursor-pointer" /> <Icon :size="18" icon="vi-mdi:format-size" :color="color" class="cursor-pointer" />
<template #dropdown> <template #dropdown>
<ElDropdownMenu> <ElDropdownMenu>
<ElDropdownItem v-for="item in sizeMap" :key="item" :command="item"> <ElDropdownItem v-for="item in sizeMap" :key="item" :command="item">

View File

@ -406,7 +406,7 @@ export default defineComponent({
) : videoPreview.includes(field) ? ( ) : videoPreview.includes(field) ? (
<BaseButton <BaseButton
type="primary" type="primary"
icon={<Icon icon="ep:video-play" />} icon={<Icon icon="vi-ep:video-play" />}
onClick={() => { onClick={() => {
createVideoViewer({ createVideoViewer({
url url

View File

@ -139,17 +139,17 @@ watch(
<div class="flex items-center"> <div class="flex items-center">
<ElRadioGroup size="small" v-model="item.fixed"> <ElRadioGroup size="small" v-model="item.fixed">
<ElRadioButton label="left"> <ElRadioButton label="left">
<Icon icon="ep:arrow-left" /> <Icon icon="vi-ep:arrow-left" />
</ElRadioButton> </ElRadioButton>
<ElRadioButton :label="undefined"> <ElRadioButton :label="undefined">
<Icon icon="ep:close" /> <Icon icon="vi-ep:close" />
</ElRadioButton> </ElRadioButton>
<ElRadioButton label="right"> <ElRadioButton label="right">
<Icon icon="ep:arrow-right" /> <Icon icon="vi-ep:arrow-right" />
</ElRadioButton> </ElRadioButton>
</ElRadioGroup> </ElRadioGroup>
<div class="ml-12px cursor-move handle"><Icon icon="ep:rank" /></div> <div class="ml-12px cursor-move handle"><Icon icon="vi-ep:rank" /></div>
</div> </div>
</div> </div>
</ElCheckboxGroup> </ElCheckboxGroup>

View File

@ -46,7 +46,7 @@ export default defineComponent({
<div class="text-right h-28px flex items-center justify-end"> <div class="text-right h-28px flex items-center justify-end">
<div title="刷新" class="w-30px h-20px flex items-center justify-end" onClick={refresh}> <div title="刷新" class="w-30px h-20px flex items-center justify-end" onClick={refresh}>
<Icon <Icon
icon="ant-design:sync-outlined" icon="vi-ant-design:sync-outlined"
class="cursor-pointer" class="cursor-pointer"
hover-color="var(--el-color-primary)" hover-color="var(--el-color-primary)"
/> />
@ -58,7 +58,7 @@ export default defineComponent({
return ( return (
<div title="尺寸" class="w-30px h-20px flex items-center justify-end"> <div title="尺寸" class="w-30px h-20px flex items-center justify-end">
<Icon <Icon
icon="ant-design:column-height-outlined" icon="vi-ant-design:column-height-outlined"
class="cursor-pointer" class="cursor-pointer"
hover-color="var(--el-color-primary)" hover-color="var(--el-color-primary)"
/> />
@ -91,7 +91,7 @@ export default defineComponent({
onClick={showColumnSetting} onClick={showColumnSetting}
> >
<Icon <Icon
icon="ant-design:setting-outlined" icon="vi-ant-design:setting-outlined"
class="cursor-pointer" class="cursor-pointer"
hover-color="var(--el-color-primary)" hover-color="var(--el-color-primary)"
/> />

View File

@ -281,7 +281,7 @@ watch(
@click="move(-200)" @click="move(-200)"
> >
<Icon <Icon
icon="ep:d-arrow-left" icon="vi-ep:d-arrow-left"
color="var(--el-text-color-placeholder)" color="var(--el-text-color-placeholder)"
:hover-color="isDark ? '#fff' : 'var(--el-color-black)'" :hover-color="isDark ? '#fff' : 'var(--el-color-black)'"
/> />
@ -293,7 +293,7 @@ watch(
:ref="itemRefs.set" :ref="itemRefs.set"
:schema="[ :schema="[
{ {
icon: 'ant-design:sync-outlined', icon: 'vi-ant-design:sync-outlined',
label: t('common.reload'), label: t('common.reload'),
disabled: selectedTag?.fullPath !== item.fullPath, disabled: selectedTag?.fullPath !== item.fullPath,
command: () => { command: () => {
@ -301,7 +301,7 @@ watch(
} }
}, },
{ {
icon: 'ant-design:close-outlined', icon: 'vi-ant-design:close-outlined',
label: t('common.closeTab'), label: t('common.closeTab'),
disabled: !!visitedViews?.length && selectedTag?.meta.affix, disabled: !!visitedViews?.length && selectedTag?.meta.affix,
command: () => { command: () => {
@ -310,7 +310,7 @@ watch(
}, },
{ {
divided: true, divided: true,
icon: 'ant-design:vertical-right-outlined', icon: 'vi-ant-design:vertical-right-outlined',
label: t('common.closeTheLeftTab'), label: t('common.closeTheLeftTab'),
disabled: disabled:
!!visitedViews?.length && !!visitedViews?.length &&
@ -321,7 +321,7 @@ watch(
} }
}, },
{ {
icon: 'ant-design:vertical-left-outlined', icon: 'vi-ant-design:vertical-left-outlined',
label: t('common.closeTheRightTab'), label: t('common.closeTheRightTab'),
disabled: disabled:
!!visitedViews?.length && !!visitedViews?.length &&
@ -333,7 +333,7 @@ watch(
}, },
{ {
divided: true, divided: true,
icon: 'ant-design:tag-outlined', icon: 'vi-ant-design:tag-outlined',
label: t('common.closeOther'), label: t('common.closeOther'),
disabled: selectedTag?.fullPath !== item.fullPath, disabled: selectedTag?.fullPath !== item.fullPath,
command: () => { command: () => {
@ -341,7 +341,7 @@ watch(
} }
}, },
{ {
icon: 'ant-design:line-outlined', icon: 'vi-ant-design:line-outlined',
label: t('common.closeAll'), label: t('common.closeAll'),
command: () => { command: () => {
closeAllTags() closeAllTags()
@ -376,7 +376,7 @@ watch(
<Icon <Icon
:class="`${prefixCls}__item--close`" :class="`${prefixCls}__item--close`"
color="#333" color="#333"
icon="ant-design:close-outlined" icon="vi-ant-design:close-outlined"
:size="12" :size="12"
@click.prevent.stop="closeSelectedTag(item)" @click.prevent.stop="closeSelectedTag(item)"
/> />
@ -393,7 +393,7 @@ watch(
@click="move(200)" @click="move(200)"
> >
<Icon <Icon
icon="ep:d-arrow-right" icon="vi-ep:d-arrow-right"
color="var(--el-text-color-placeholder)" color="var(--el-text-color-placeholder)"
:hover-color="isDark ? '#fff' : 'var(--el-color-black)'" :hover-color="isDark ? '#fff' : 'var(--el-color-black)'"
/> />
@ -404,7 +404,7 @@ watch(
@click="refreshSelectedTag(selectedTag)" @click="refreshSelectedTag(selectedTag)"
> >
<Icon <Icon
icon="ant-design:reload-outlined" icon="vi-ant-design:reload-outlined"
color="var(--el-text-color-placeholder)" color="var(--el-text-color-placeholder)"
:hover-color="isDark ? '#fff' : 'var(--el-color-black)'" :hover-color="isDark ? '#fff' : 'var(--el-color-black)'"
/> />
@ -413,14 +413,14 @@ watch(
trigger="click" trigger="click"
:schema="[ :schema="[
{ {
icon: 'ant-design:sync-outlined', icon: 'vi-ant-design:sync-outlined',
label: t('common.reload'), label: t('common.reload'),
command: () => { command: () => {
refreshSelectedTag(selectedTag) refreshSelectedTag(selectedTag)
} }
}, },
{ {
icon: 'ant-design:close-outlined', icon: 'vi-ant-design:close-outlined',
label: t('common.closeTab'), label: t('common.closeTab'),
disabled: !!visitedViews?.length && selectedTag?.meta.affix, disabled: !!visitedViews?.length && selectedTag?.meta.affix,
command: () => { command: () => {
@ -429,7 +429,7 @@ watch(
}, },
{ {
divided: true, divided: true,
icon: 'ant-design:vertical-right-outlined', icon: 'vi-ant-design:vertical-right-outlined',
label: t('common.closeTheLeftTab'), label: t('common.closeTheLeftTab'),
disabled: !!visitedViews?.length && selectedTag?.fullPath === visitedViews[0].fullPath, disabled: !!visitedViews?.length && selectedTag?.fullPath === visitedViews[0].fullPath,
command: () => { command: () => {
@ -437,7 +437,7 @@ watch(
} }
}, },
{ {
icon: 'ant-design:vertical-left-outlined', icon: 'vi-ant-design:vertical-left-outlined',
label: t('common.closeTheRightTab'), label: t('common.closeTheRightTab'),
disabled: disabled:
!!visitedViews?.length && !!visitedViews?.length &&
@ -448,14 +448,14 @@ watch(
}, },
{ {
divided: true, divided: true,
icon: 'ant-design:tag-outlined', icon: 'vi-ant-design:tag-outlined',
label: t('common.closeOther'), label: t('common.closeOther'),
command: () => { command: () => {
closeOthersTags() closeOthersTags()
} }
}, },
{ {
icon: 'ant-design:line-outlined', icon: 'vi-ant-design:line-outlined',
label: t('common.closeAll'), label: t('common.closeAll'),
command: () => { command: () => {
closeAllTags() closeAllTags()
@ -468,7 +468,7 @@ watch(
class="w-[var(--tags-view-height)] h-[var(--tags-view-height)] flex items-center justify-center cursor-pointer block" class="w-[var(--tags-view-height)] h-[var(--tags-view-height)] flex items-center justify-center cursor-pointer block"
> >
<Icon <Icon
icon="ant-design:setting-outlined" icon="vi-ant-design:setting-outlined"
color="var(--el-text-color-placeholder)" color="var(--el-text-color-placeholder)"
:hover-color="isDark ? '#fff' : 'var(--el-color-black)'" :hover-color="isDark ? '#fff' : 'var(--el-color-black)'"
/> />

View File

@ -11,9 +11,9 @@ const emit = defineEmits(['change'])
const prefixCls = getPrefixCls('theme-switch') const prefixCls = getPrefixCls('theme-switch')
const Sun = useIcon({ icon: 'emojione-monotone:sun', color: '#fde047' }) const Sun = useIcon({ icon: 'vi-emojione-monotone:sun', color: '#fde047' })
const CrescentMoon = useIcon({ icon: 'emojione-monotone:crescent-moon', color: '#fde047' }) const CrescentMoon = useIcon({ icon: 'vi-emojione-monotone:crescent-moon', color: '#fde047' })
const appStore = useAppStore() const appStore = useAppStore()

View File

@ -75,7 +75,7 @@ function handleShowForm(show = false) {
@click="handleShowForm(false)" @click="handleShowForm(false)"
v-show="showDate" v-show="showDate"
> >
<Icon icon="ep:lock" /> <Icon icon="vi-ep:lock" />
<span>{{ t('lock.unlock') }}</span> <span>{{ t('lock.unlock') }}</span>
</div> </div>

View File

@ -41,7 +41,7 @@ const close = async () => {
class="w-44px h-44px color-[#fff] bg-[var(--el-text-color-regular)] rounded-full border-[#fff] flex justify-center items-center cursor-pointer absolute top-40px right-40px" class="w-44px h-44px color-[#fff] bg-[var(--el-text-color-regular)] rounded-full border-[#fff] flex justify-center items-center cursor-pointer absolute top-40px right-40px"
@click="close" @click="close"
> >
<Icon icon="ep:close" :size="24" /> <Icon icon="vi-ep:close" :size="24" />
</div> </div>
<VideoPlayer :url="url" :poster="poster" /> <VideoPlayer :url="url" :poster="poster" />
</div> </div>

View File

@ -32,3 +32,8 @@ export const DEFAULT_FILTER_COLUMN = ['expand', 'selection']
* headers->content-type自动转换数据格式 * headers->content-type自动转换数据格式
*/ */
export const TRANSFORM_REQUEST_DATA = true export const TRANSFORM_REQUEST_DATA = true
/**
*
*/
export const ICON_PREFIX = 'vi-'

View File

@ -87,7 +87,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'Dashboard', name: 'Dashboard',
meta: { meta: {
title: t('router.dashboard'), title: t('router.dashboard'),
icon: 'ant-design:dashboard-filled', icon: 'vi-ant-design:dashboard-filled',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -123,7 +123,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'DocumentLink', name: 'DocumentLink',
meta: { meta: {
title: t('router.document'), title: t('router.document'),
icon: 'clarity:document-solid' icon: 'vi-clarity:document-solid'
} }
} }
] ]
@ -140,7 +140,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'GuideDemo', name: 'GuideDemo',
meta: { meta: {
title: t('router.guide'), title: t('router.guide'),
icon: 'cib:telegram-plane' icon: 'vi-cib:telegram-plane'
} }
} }
] ]
@ -151,7 +151,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'ComponentsDemo', name: 'ComponentsDemo',
meta: { meta: {
title: t('router.component'), title: t('router.component'),
icon: 'bx:bxs-component', icon: 'vi-bx:bxs-component',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -416,7 +416,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'Function', name: 'Function',
meta: { meta: {
title: t('router.function'), title: t('router.function'),
icon: 'ri:function-fill', icon: 'vi-ri:function-fill',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -465,7 +465,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'Hooks', name: 'Hooks',
meta: { meta: {
title: 'hooks', title: 'hooks',
icon: 'ic:outline-webhook', icon: 'vi-ic:outline-webhook',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -526,7 +526,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'Level', name: 'Level',
meta: { meta: {
title: t('router.level'), title: t('router.level'),
icon: 'carbon:skill-level-advanced' icon: 'vi-carbon:skill-level-advanced'
}, },
children: [ children: [
{ {
@ -585,7 +585,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'Example', name: 'Example',
meta: { meta: {
title: t('router.example'), title: t('router.example'),
icon: 'ep:management', icon: 'vi-ep:management',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -653,7 +653,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'Error', name: 'Error',
meta: { meta: {
title: t('router.errorPage'), title: t('router.errorPage'),
icon: 'ci:error', icon: 'vi-ci:error',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [
@ -690,7 +690,7 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
name: 'Authorization', name: 'Authorization',
meta: { meta: {
title: t('router.authorization'), title: t('router.authorization'),
icon: 'eos-icons:role-binding', icon: 'vi-eos-icons:role-binding',
alwaysShow: true alwaysShow: true
}, },
children: [ children: [

View File

@ -44,10 +44,10 @@ const alarmClock = useIcon({ icon: 'ep:alarm-clock' })
</ContentWrap> </ContentWrap>
<ContentWrap :title="t('iconDemo.iconify')"> <ContentWrap :title="t('iconDemo.iconify')">
<div class="flex justify-between"> <div class="flex justify-between">
<Icon icon="ep:aim" /> <Icon icon="vi-ep:aim" />
<Icon icon="ep:alarm-clock" /> <Icon icon="vi-ep:alarm-clock" />
<Icon icon="ep:baseball" /> <Icon icon="vi-ep:baseball" />
<Icon icon="ep:chat-line-round" /> <Icon icon="vi-ep:chat-line-round" />
</div> </div>
</ContentWrap> </ContentWrap>
<ContentWrap title="useIcon"> <ContentWrap title="useIcon">

View File

@ -148,28 +148,28 @@ const schema = reactive<FormSchema[]>([
<> <>
<div class="flex justify-between w-[100%]"> <div class="flex justify-between w-[100%]">
<Icon <Icon
icon="ant-design:github-filled" icon="vi-ant-design:github-filled"
size={iconSize} size={iconSize}
class="cursor-pointer ant-icon" class="cursor-pointer ant-icon"
color={iconColor} color={iconColor}
hoverColor={hoverColor} hoverColor={hoverColor}
/> />
<Icon <Icon
icon="ant-design:wechat-filled" icon="vi-ant-design:wechat-filled"
size={iconSize} size={iconSize}
class="cursor-pointer ant-icon" class="cursor-pointer ant-icon"
color={iconColor} color={iconColor}
hoverColor={hoverColor} hoverColor={hoverColor}
/> />
<Icon <Icon
icon="ant-design:alipay-circle-filled" icon="vi-ant-design:alipay-circle-filled"
size={iconSize} size={iconSize}
color={iconColor} color={iconColor}
hoverColor={hoverColor} hoverColor={hoverColor}
class="cursor-pointer ant-icon" class="cursor-pointer ant-icon"
/> />
<Icon <Icon
icon="ant-design:weibo-circle-filled" icon="vi-ant-design:weibo-circle-filled"
size={iconSize} size={iconSize}
color={iconColor} color={iconColor}
hoverColor={hoverColor} hoverColor={hoverColor}

16
types/env.d.ts vendored
View File

@ -7,22 +7,6 @@ declare module '*.vue' {
export default component export default component
} }
interface ImportMetaEnv {
readonly VITE_NODE_ENV: string
readonly VITE_APP_TITLE: string
readonly VITE_API_BASE_PATH: string
readonly VITE_BASE_PATH: string
readonly VITE_DROP_DEBUGGER: string
readonly VITE_DROP_CONSOLE: string
readonly VITE_SOURCEMAP: string
readonly VITE_OUT_DIR: string
readonly VITE_USE_BUNDLE_ANALYZER: string
readonly VITE_USE_ALL_ELEMENT_PLUS_STYLE: string
readonly VITE_USE_MOCK: string
readonly VITE_USE_CSS_SPLIT: string
readonly VITE_USE_ONLINE_ICON: string
}
declare global { declare global {
interface ImportMeta { interface ImportMeta {
readonly env: ImportMetaEnv readonly env: ImportMetaEnv

17
types/global.d.ts vendored
View File

@ -66,4 +66,21 @@ declare global {
topHeaderHoverColor?: string topHeaderHoverColor?: string
topToolBorderColor?: string topToolBorderColor?: string
} }
declare interface ImportMetaEnv {
readonly VITE_NODE_ENV: string
readonly VITE_APP_TITLE: string
readonly VITE_API_BASE_PATH: string
readonly VITE_BASE_PATH: string
readonly VITE_DROP_DEBUGGER: string
readonly VITE_DROP_CONSOLE: string
readonly VITE_SOURCEMAP: string
readonly VITE_OUT_DIR: string
readonly VITE_USE_BUNDLE_ANALYZER: string
readonly VITE_USE_ALL_ELEMENT_PLUS_STYLE: string
readonly VITE_USE_MOCK: string
readonly VITE_USE_CSS_SPLIT: string
readonly VITE_USE_ONLINE_ICON: string
readonly VITE_ICON_PREFIX: string
}
} }

View File

@ -1,6 +1,7 @@
import { defineConfig, toEscapedSelector as e, presetUno, presetIcons } from 'unocss' import { defineConfig, toEscapedSelector as e, presetUno, presetIcons } from 'unocss'
import transformerVariantGroup from '@unocss/transformer-variant-group' import transformerVariantGroup from '@unocss/transformer-variant-group'
import { loadEnv } from 'vite' import { loadEnv } from 'vite'
import { ICON_PREFIX } from './src/constants'
const root = process.cwd() const root = process.cwd()
@ -18,13 +19,8 @@ const createPresetIcons = () => {
} else { } else {
return [ return [
presetIcons({ presetIcons({
prefix: '' autoInstall: false,
// 由于默认加载的是所有的图标,启动会非常慢,可以在这里去加载需要的图标,确保启动速度 prefix: ICON_PREFIX
// collections: {
// carbon: () => import('@iconify-json/carbon/icons.json').then(i => i.default),
// mdi: () => import('@iconify-json/mdi/icons.json').then(i => i.default),
// logos: () => import('@iconify-json/logos/icons.json').then(i => i.default),
// }
}) })
] ]
} }