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
| <script lang="ts" setup>
| import { computed, ref, watch } from 'vue';
|
| import { useGlobSetting } from '@jnpf/hooks';
|
| import { useBaseStore } from '#/store';
| import { resolveBrandAssetUrl } from '#/utils/systemBrand';
|
| type BrandImageType = 'login' | 'logo';
|
| defineOptions({ inheritAttrs: false, name: 'SystemBrandImage' });
|
| const props = withDefaults(
| defineProps<{
| alt?: string;
| type?: BrandImageType;
| }>(),
| {
| alt: '',
| type: 'logo',
| },
| );
|
| const baseStore = useBaseStore();
| const globSetting = useGlobSetting();
| const loadFailed = ref(false);
| const fieldMap: Record<BrandImageType, 'loginIcon' | 'logoIcon'> = {
| login: 'loginIcon',
| logo: 'logoIcon',
| };
|
| const src = computed(() => resolveBrandAssetUrl(baseStore.sysConfigInfo[fieldMap[props.type]], globSetting.apiURL));
|
| watch(src, () => {
| loadFailed.value = false;
| });
| </script>
|
| <template>
| <img v-if="src && !loadFailed" v-bind="$attrs" :alt="alt" :src="src" @error="loadFailed = true" />
| </template>
|
|