chore: 更新离线图标方案
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { type Component, computed } from 'vue';
|
||||
|
||||
import { IconDefault, IconifyIcon, IconifyOfflineIcon } from '@vben-core/icons';
|
||||
import { IconDefault, IconifyIcon } from '@vben-core/icons';
|
||||
import {
|
||||
isFunction,
|
||||
isHttpUrl,
|
||||
@@ -23,37 +23,11 @@ const isComponent = computed(() => {
|
||||
const { icon } = props;
|
||||
return !isString(icon) && (isObject(icon) || isFunction(icon));
|
||||
});
|
||||
|
||||
/**
|
||||
* 判断图标是否为离线图标
|
||||
* 主要是判断后缀是否为 |offline
|
||||
*/
|
||||
const offlineIcon = computed(() => {
|
||||
if (
|
||||
isString(props.icon) &&
|
||||
!isHttpUrl(props.icon) &&
|
||||
props.icon.endsWith('|offline')
|
||||
) {
|
||||
return {
|
||||
confirm: true,
|
||||
icon: props.icon.replace('|offline', ''),
|
||||
};
|
||||
}
|
||||
return {
|
||||
confirm: false,
|
||||
icon: '',
|
||||
};
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<component :is="icon as Component" v-if="isComponent" v-bind="$attrs" />
|
||||
<img v-else-if="isRemoteIcon" :src="icon as string" v-bind="$attrs" />
|
||||
<IconifyOfflineIcon
|
||||
v-else-if="offlineIcon.confirm"
|
||||
v-bind="$attrs"
|
||||
:icon="offlineIcon.icon"
|
||||
/>
|
||||
<IconifyIcon v-else-if="icon" v-bind="$attrs" :icon="icon as string" />
|
||||
<IconDefault v-else-if="fallback" v-bind="$attrs" />
|
||||
</template>
|
||||
|
Reference in New Issue
Block a user