1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
import { IPSSysImage } from '@ibiz-template/model';
import { useNamespace } from '@ibiz-template/vue-util';
import { defineComponent, PropType, VNode, computed } from 'vue';
import '@ibiz-template/theme/style/components/common/app-icon/app-icon.scss';
export const AppIcon = defineComponent({
name: 'AppIcon',
props: {
icon: {
type: Object as PropType<IPSSysImage>,
},
size: {
type: String as PropType<'small' | 'medium' | 'large'>,
},
},
setup(props) {
const ns = useNamespace('icon');
const BaseUrl = `${ibiz.env.assetsUrl}/img/`;
function getContent(icon?: IPSSysImage): VNode | null {
if (icon) {
if (icon.cssClass) {
if (icon.cssClass.indexOf('fa-') !== -1) {
return <i class={[ns.b(), icon.cssClass]} />;
}
return <ion-icon class={ns.b()} name={icon.cssClass}></ion-icon>;
}
if (icon.imagePath) {
if (icon.imagePath.endsWith('svg')) {
if (icon.imagePath.startsWith('http')) {
return <ion-icon class={ns.b()} src={icon.imagePath}></ion-icon>;
}
return (
<ion-icon
src={BaseUrl + icon.imagePath}
class={ns.b()}
></ion-icon>
);
}
if (icon.imagePath.startsWith('http')) {
return <img class={ns.b()} src={icon.imagePath} />;
}
return <img class={ns.b()} src={BaseUrl + icon.imagePath} />;
}
}
return null;
}
const content = computed<VNode | null>(() => {
return getContent(props.icon);
});
return () => content.value;
},
});
export default AppIcon;