刘光辉
5 小时以前 cf11e63b659afcc9792ab3e395f1b45d844431a8
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>