kingecg
/
gohttpdUi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
mock/menu/index.mock.ts
View File

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

36
mock/role/index.mock.ts
View File

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

6
scripts/icon.ts
View File

@ -3,6 +3,7 @@ import fs from 'fs-extra'
import inquirer from 'inquirer'
import chalk from 'chalk'
import pkg from '../package.json'
import { ICON_PREFIX } from '../src/constants'
interface Icon {
name: string
@ -52,11 +53,12 @@ async function generateIcon() {
const data = await fs.readJSON(path.join(dir, 'json', `${info.id}.json`))
if (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(
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类型名称
prefixSet.push(prefix)

2
src/components/Collapse/src/Collapse.vue
View File

@ -26,7 +26,7 @@ const toggleCollapse = () => {
<div :class="prefixCls" @click="toggleCollapse">
<Icon
: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"
class="cursor-pointer"
/>

2
src/components/ContentWrap/src/ContentWrap.vue
View File

@ -22,7 +22,7 @@ defineProps({
<template #content>
<div class="max-w-200px">{{ message }}</div>
</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>
<div class="flex pl-20px flex-grow">
<slot name="header"></slot>

6
src/components/Descriptions/src/Descriptions.vue
View File

@ -97,12 +97,14 @@ export default defineComponent({
{props.title}
{props.message ? (
<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>
) : null}
</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>
) : null}

6
src/components/Dialog/src/Dialog.vue
View File

@ -78,14 +78,16 @@ const dialogStyle = computed(() => {
<Icon
v-if="fullscreen"
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)"
hover-color="var(--el-color-primary)"
@click="toggleFull"
/>
<Icon
class="cursor-pointer is-hover !h-54px"
icon="ep:close"
icon="vi-ep:close"
hover-color="var(--el-color-primary)"
color="var(--el-color-info)"
@click="close"

7
src/components/Icon/src/Icon.vue
View File

@ -4,6 +4,7 @@ import { ElIcon } from 'element-plus'
import { propTypes } from '@/utils/propTypes'
import { useDesign } from '@/hooks/web/useDesign'
import { Icon } from '@iconify/vue'
import { ICON_PREFIX } from '@/constants'
const { getPrefixCls } = useDesign()
@ -37,6 +38,10 @@ const getIconifyStyle = computed(() => {
color
}
})
const getIconName = computed(() => {
return props.icon.startsWith(ICON_PREFIX) ? props.icon.replace(ICON_PREFIX, '') : props.icon
})
</script>
<template>
@ -46,7 +51,7 @@ const getIconifyStyle = computed(() => {
</svg>
<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>
</template>
</ElIcon>

1621
src/components/IconPicker/src/data/icons.ant-design.ts
View File

File diff suppressed because it is too large Load Diff

588
src/components/IconPicker/src/data/icons.ep.ts
View File

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

2408
src/components/IconPicker/src/data/icons.tdesign.ts
View File

File diff suppressed because it is too large Load Diff

16
src/components/ImageCropping/src/ImageCropping.vue
View File

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

2
src/components/Infotip/src/Infotip.vue
View File

@ -35,7 +35,7 @@ const keyClick = (key: string) => {
]"
>
<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>
</div>
<div :class="`${prefixCls}__content`">

2
src/components/LocaleDropdown/src/LocaleDropdown.vue
View File

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

2
src/components/Qrcode/src/Qrcode.vue
View File

@ -230,7 +230,7 @@ const disabledClick = () => {
@click="disabledClick"
>
<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>
</div>

2
src/components/Screenfull/src/Screenfull.vue
View File

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

6
src/components/Search/src/components/ActionButton.vue
View File

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

2
src/components/Setting/src/Setting.vue
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"
@click="drawer = true"
>
<Icon icon="ant-design:setting-outlined" color="#fff" />
<Icon icon="vi-ant-design:setting-outlined" color="#fff" />
</div>
<ElDrawer v-model="drawer" direction="rtl" size="350px" :z-index="4000">

2
src/components/Setting/src/components/ColorRadioPicker.vue
View File

@ -49,7 +49,7 @@ watch(
}"
@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>
</div>
</template>

2
src/components/SizeDropdown/src/SizeDropdown.vue
View File

@ -27,7 +27,7 @@ const setCurrentSize = (size: ComponentSize) => {
<template>
<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>
<ElDropdownMenu>
<ElDropdownItem v-for="item in sizeMap" :key="item" :command="item">

2
src/components/Table/src/Table.vue
View File

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

8
src/components/Table/src/components/ColumnSetting.vue
View File

@ -139,17 +139,17 @@ watch(
<div class="flex items-center">
<ElRadioGroup size="small" v-model="item.fixed">
<ElRadioButton label="left">
<Icon icon="ep:arrow-left" />
<Icon icon="vi-ep:arrow-left" />
</ElRadioButton>
<ElRadioButton :label="undefined">
<Icon icon="ep:close" />
<Icon icon="vi-ep:close" />
</ElRadioButton>
<ElRadioButton label="right">
<Icon icon="ep:arrow-right" />
<Icon icon="vi-ep:arrow-right" />
</ElRadioButton>
</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>
</ElCheckboxGroup>

6
src/components/Table/src/components/TableActions.vue
View File

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

34
src/components/TagsView/src/TagsView.vue
View File

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

4
src/components/ThemeSwitch/src/ThemeSwitch.vue
View File

@ -11,9 +11,9 @@ const emit = defineEmits(['change'])
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()

2
src/components/UserInfo/src/components/LockPage.vue
View File

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

2
src/components/VideoPlayerViewer/src/VideoPlayerViewer.vue
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"
@click="close"
>
<Icon icon="ep:close" :size="24" />
<Icon icon="vi-ep:close" :size="24" />
</div>
<VideoPlayer :url="url" :poster="poster" />
</div>

5
src/constants/index.ts
View File

@ -32,3 +32,8 @@ export const DEFAULT_FILTER_COLUMN = ['expand', 'selection']
* 是否根据headers->content-type自动转换数据格式
*/
export const TRANSFORM_REQUEST_DATA = true
/**
* 全局图标前缀
*/
export const ICON_PREFIX = 'vi-'

20
src/router/index.ts
View File

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

8
src/views/Components/Icon.vue
View File

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

8
src/views/Login/components/LoginForm.vue
View File

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

16
types/env.d.ts vendored
View File

@ -7,22 +7,6 @@ declare module '*.vue' {
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 {
interface ImportMeta {
readonly env: ImportMetaEnv

17
types/global.d.ts vendored
View File

@ -66,4 +66,21 @@ declare global {
topHeaderHoverColor?: 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
}
}

10
uno.config.ts
View File

@ -1,6 +1,7 @@
import { defineConfig, toEscapedSelector as e, presetUno, presetIcons } from 'unocss'
import transformerVariantGroup from '@unocss/transformer-variant-group'
import { loadEnv } from 'vite'
import { ICON_PREFIX } from './src/constants'
const root = process.cwd()
@ -18,13 +19,8 @@ const createPresetIcons = () => {
} else {
return [
presetIcons({
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),
// }
autoInstall: false,
prefix: ICON_PREFIX
})
]
}