feat(新工具类): 将默认头像和商品图提炼成一个工具类,并在页面中使用

This commit is contained in:
hzj 2025-12-05 16:04:38 +08:00
parent 7bb0a7eb79
commit 30c4dba81d
38 changed files with 157 additions and 405 deletions

20
src/utils/imageHandler.js Normal file
View File

@ -0,0 +1,20 @@
/**
* 头像图片错误处理专用函数
* @param {Event} e - 图片错误事件
*/
export const handleAvatarImageError = (e) => {
console.log('头像资源出错')
e.target.onerror = null // 防止循环
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
export const handleRewardImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null // 防止循环
if (type == 'GOLD') {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
} else if (type == 'DOLLARS') {
e.target.src = new URL('/src/assets/icon/dollar.png', import.meta.url).href
}
}

View File

@ -29,7 +29,7 @@
alt=""
width="100%"
style="display: block; border-radius: 50%; aspect-ratio: 1/1; object-fit: cover"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
</div>
@ -107,6 +107,8 @@
</template>
<script setup>
import { handleAvatarImageError } from '@/utils/imageHandler.js'
const props = defineProps({
isTopOne: {
type: Boolean,
@ -138,14 +140,6 @@ const props = defineProps({
default: '1',
},
})
import defaultAvatar from '@/assets/icon/defaultAvatar.png'
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = defaultAvatar
}
</script>
<style lang="scss" scoped>

View File

@ -231,7 +231,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称id -->
@ -314,7 +314,7 @@
alt=""
width="70%"
style="display: block; object-fit: cover"
@error="(e) => handleImageError(e, reward.type)"
@error="(e) => handleRewardImageError(e, reward.type)"
/>
</itemCenter>
<div
@ -383,7 +383,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称 -->
@ -456,6 +456,7 @@ import { connectToApp } from '@/utils/appConnector.js'
import { useLangStore } from '@/stores/lang'
import { getPngUrl } from '@/config/imagePaths.js'
import { preloadImages } from '@/utils/imagePreloader.js'
import { handleAvatarImageError, handleRewardImageError } from '@/utils/imageHandler.js'
import { getThisWeekRewardsAndGifts, getRankingListAndMyRanking } from '@/api/activity.js'
@ -510,25 +511,6 @@ const showRanking = computed(() => {
return Ranking.value.filter((_, index) => index >= 3)
})
//
const handleImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null //
if ((type = 'GOLD')) {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
}
if ((type = 'DOLLARS')) {
e.target.src = new URL('/src/assets/icon/dollar.png', import.meta.url).href
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
// 202512150
const getTargetTime = () => {
const targetDate = new Date(2025, 11, 15, 0, 0, 0) // 01112

View File

@ -29,7 +29,7 @@
alt=""
width="100%"
style="display: block; border-radius: 50%; aspect-ratio: 1/1; object-fit: cover"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
</div>
@ -106,6 +106,8 @@
</template>
<script setup>
import { handleAvatarImageError } from '@/utils/imageHandler.js'
const props = defineProps({
isTopOne: {
type: Boolean,
@ -137,14 +139,6 @@ const props = defineProps({
default: '1',
},
})
import defaultAvatar from '@/assets/icon/defaultAvatar.png'
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = defaultAvatar
}
</script>
<style lang="scss" scoped>

View File

@ -188,7 +188,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<div
@ -269,7 +269,7 @@
alt=""
width="70%"
style="display: block; object-fit: cover"
@error="(e) => handleImageError(e, reward.type)"
@error="(e) => handleRewardImageError(e, reward.type)"
/>
</itemCenter>
<div
@ -331,7 +331,7 @@
object-fit: cover;
margin: 0 12px;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称 -->
<div
@ -393,6 +393,7 @@ import TopUser from './components/topUser.vue'
import maskLayer from '@/components/MaskLayer.vue'
import { getThisWeekRewardsAndGifts, getRankingListAndMyRanking } from '@/api/activity.js'
import { connectToApp } from '@/utils/appConnector.js'
import { handleAvatarImageError, handleRewardImageError } from '@/utils/imageHandler.js'
// vite
const imageModules = import.meta.glob(
@ -449,22 +450,6 @@ const showRanking = computed(() => {
// return []
})
//
const handleImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null //
if ((type = 'GOLD')) {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
// 2025112910
const getTargetTime = () => {
const targetDate = new Date(2025, 10, 29, 10, 0, 0) // 01011

View File

@ -62,7 +62,7 @@
aspect-ratio: 1/1;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
</div>
@ -133,6 +133,7 @@ import { ref, onMounted } from 'vue'
import { connectToApp } from '@/utils/appConnector.js'
import { getPngUrl } from '@/config/imagePaths.js'
import { preloadImages } from '@/utils/imagePreloader.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getMemberProfile, getTotalRecharge } from '@/api/wallet'
@ -170,13 +171,6 @@ const getTotalRechargeInfo = async () => {
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const preloadCriticalImages = () => {
const criticalImages = [

View File

@ -29,7 +29,7 @@
alt=""
width="100%"
style="display: block; border-radius: 50%; aspect-ratio: 1/1; object-fit: cover"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
</div>
@ -107,6 +107,8 @@
</template>
<script setup>
import { handleAvatarImageError } from '@/utils/imageHandler.js'
const props = defineProps({
isTopOne: {
type: Boolean,
@ -138,14 +140,6 @@ const props = defineProps({
default: '1',
},
})
import defaultAvatar from '@/assets/icon/defaultAvatar.png'
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = defaultAvatar
}
</script>
<style lang="scss" scoped>

View File

@ -220,7 +220,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称id -->
@ -304,7 +304,7 @@
alt=""
width="70%"
style="display: block; object-fit: cover"
@error="(e) => handleImageError(e, reward.type)"
@error="(e) => handleRewardImageError(e, reward.type)"
/>
</itemCenter>
<div
@ -386,7 +386,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称 -->
@ -445,6 +445,7 @@ import { isInApp, viewUserInfo } from '@/utils/appBridge.js'
import { connectToApp } from '@/utils/appConnector.js'
import { getPngUrl } from '@/config/imagePaths.js'
import { preloadImages } from '@/utils/imagePreloader.js'
import { handleAvatarImageError, handleRewardImageError } from '@/utils/imageHandler.js'
import { getThisWeekRewardsAndGifts, getRankingListAndMyRanking } from '@/api/activity.js'
@ -494,22 +495,6 @@ const showRanking = computed(() => {
return Ranking.value.filter((_, index) => index >= 3)
})
//
const handleImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null //
if ((type = 'GOLD')) {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
// 202512910
const getTargetTime = () => {
const targetDate = new Date(2025, 11, 9, 10, 0, 0) // 01112

View File

@ -217,7 +217,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称id -->
@ -300,7 +300,7 @@
alt=""
width="70%"
style="display: block; object-fit: cover"
@error="(e) => handleImageError(e, reward.type)"
@error="(e) => handleRewardImageError(e, reward.type)"
/>
</itemCenter>
<div class="valueBg" :style="{ '--value-bg-url': `url(${imageUrl('valueBg')})` }">
@ -372,7 +372,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称 -->
@ -431,6 +431,7 @@ import { isInApp, viewUserInfo } from '@/utils/appBridge.js'
import { connectToApp } from '@/utils/appConnector.js'
import { getPngUrl } from '@/config/imagePaths.js'
import { preloadImages } from '@/utils/imagePreloader.js'
import { handleAvatarImageError, handleRewardImageError } from '@/utils/imageHandler.js'
import { getThisWeekRewardsAndGifts, getRankingListAndMyRanking } from '@/api/activity.js'
@ -480,22 +481,6 @@ const showRanking = computed(() => {
return Ranking.value.filter((_, index) => index >= 3)
})
//
const handleImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null //
if ((type = 'GOLD')) {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
// 202512510
const getTargetTime = () => {
const targetDate = new Date(2025, 11, 5, 10, 0, 0) // 01112

View File

@ -101,7 +101,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -317,7 +317,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -374,6 +374,7 @@
import { computed, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import {
apiGetTeamOverview, //BD
@ -426,12 +427,6 @@ const closedPopup = () => {
incomeDetailsItem.value = null
}
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const getTeamOverview = async () => {
let data = {

View File

@ -101,7 +101,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -317,7 +317,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -374,6 +374,7 @@
import { computed, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import {
apiGetTeamOverview, //BD
@ -426,12 +427,6 @@ const closedPopup = () => {
incomeDetailsItem.value = null
}
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const getTeamOverview = async () => {
let data = {

View File

@ -101,7 +101,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -317,7 +317,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -374,6 +374,7 @@
import { computed, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import {
apiGetTeamOverview, //BD
@ -426,12 +427,6 @@ const closedPopup = () => {
incomeDetailsItem.value = null
}
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const getTeamOverview = async () => {
let data = {

View File

@ -60,7 +60,7 @@
object-fit: cover;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -394,6 +394,7 @@ import { setDocumentDirection } from '@/locales/i18n'
import { gotoAppPage } from '@/utils/appBridge.js'
import { getUserId } from '@/utils/userStore.js'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import {
apiTaskList, //
@ -439,12 +440,6 @@ const taskCompletedText = (task) => {
}
}
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
const send = () => {
router.push({ path: '/item-distribution' })
}

View File

@ -38,7 +38,7 @@
alt=""
width="50px"
style="aspect-ratio: 1/1; border-radius: 50%; object-fit: cover"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<div style="flex: 1; margin-left: 12px">
<div style="margin-bottom: 4px; font-weight: 600">
@ -56,21 +56,17 @@
<script setup>
import { reactive } from 'vue'
import { useI18n } from 'vue-i18n'
import GeneralHeader from '@/components/GeneralHeader.vue'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { setDocumentDirection } from '@/locales/i18n'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import GeneralHeader from '@/components/GeneralHeader.vue'
const { t, locale } = useI18n()
//
locale.value && setDocumentDirection(locale.value)
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
const { userInfo } = usePageInitializationWithConfig('AGENCY_CENTER')
</script>

View File

@ -48,7 +48,7 @@
:src="message.avatar || ''"
:alt="message.name"
style="display: block; width: 100%; aspect-ratio: 1/1; object-fit: cover"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<div v-else>{{ message.name?.charAt(0) || 'U' }}</div>
</div>
@ -102,13 +102,15 @@
<script setup>
import { ref, onMounted } from 'vue'
import { useI18n } from 'vue-i18n'
import GeneralHeader from '@/components/GeneralHeader.vue'
import { getApplyRecord } from '@/api/teamBill.js'
import { processUserApply } from '@/api/wallet.js'
import { getTeamId } from '@/utils/userStore.js'
import { showError, showSuccess, showWarning } from '@/utils/toast.js'
import { formatUTCTime } from '@/utils/utcFormat.js'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getApplyRecord } from '@/api/teamBill.js'
import { processUserApply } from '@/api/wallet.js'
import GeneralHeader from '@/components/GeneralHeader.vue'
const { t, locale } = useI18n()
@ -128,13 +130,6 @@ const mockMessages = [
},
]
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const fetchMessages = async () => {
loading.value = true

View File

@ -114,7 +114,7 @@
v-smart-img
:src="member.memberProfile?.userAvatar || ''"
:alt="member.memberProfile?.userNickname"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
style="
display: block;
width: 100%;
@ -232,6 +232,7 @@ import { useLangStore } from '@/stores/lang'
import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { getTeamId } from '@/utils/userStore.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getTeamReleasePolicy } from '@/api/teamBill.js'
@ -393,13 +394,6 @@ const formatDiamondValue = (value) => {
return numValue.toLocaleString()
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const updateTypeShowText = () => {
console.log('更新展示类型')

View File

@ -59,7 +59,7 @@
aspect-ratio: 1/1;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
<div style="min-width: 0; flex: 1">
@ -339,6 +339,7 @@ import { setDocumentDirection } from '@/locales/i18n'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { getTeamId, getUserId } from '@/utils/userStore.js'
import { clearSelectedPayee } from '@/utils/payeeStore.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getTeamMemberCount, getTeamBill, getTeamMemberWork } from '@/api/teamBill.js'
import { getUserIdentity } from '@/api/wallet.js'
@ -399,12 +400,6 @@ const underlineStyle = computed(() => {
}
})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const fetchMemberWorkData = async () => {
try {

View File

@ -134,7 +134,7 @@
aspect-ratio: 1/1;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<div style="width: 70%">
<p
@ -258,17 +258,20 @@
import { ref, onMounted, watch } from 'vue'
import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import GeneralHeader from '@/components/GeneralHeader.vue'
import { showError, showWarning, showInfo, showSuccess } from '@/utils/toast.js'
import { ApiError } from '@/utils/http.js'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import {
sendTeamApplyJoin,
getWaitApplyRecord,
cancelApply,
searchTeamByAccount,
} from '@/api/wallet.js'
import { showError, showWarning, showInfo, showSuccess } from '@/utils/toast.js'
import { ApiError } from '@/utils/http.js'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { setDocumentDirection } from '@/locales/i18n'
import GeneralHeader from '@/components/GeneralHeader.vue'
const { t, locale } = useI18n()
const router = useRouter()
@ -280,12 +283,6 @@ const showHelpModal = ref(false)
const applyRecords = ref([])
const searchedTeamInfo = ref(null) //
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
watch(locale, (newLocale) => {
setDocumentDirection(newLocale)

View File

@ -181,7 +181,7 @@
aspect-ratio: 1/1;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
<!-- 个人信息 -->
@ -743,14 +743,13 @@ import { ref, reactive, onMounted, onUnmounted, computed } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { getSelectedPayee, clearSelectedPayee } from '@/utils/payeeStore.js'
import { showError, showSuccess } from '@/utils/toast.js'
import { getUserId } from '@/utils/userStore.js'
import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { useIdentityStore } from '@/stores/identity.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import {
apiGetBankBalance, //
getBankBalance,
apiExchange, //
apiTransfer, //
getBankCardList, //使
@ -794,12 +793,6 @@ const maskLayerShow = computed(() => {
const usedBankCard = ref(null) //使
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
const closedPopup = () => {
exchangeTipShow.value = false
cashOutTipShow.value = false

View File

@ -67,7 +67,7 @@
<img
:src="record.userInfo?.avatar || ''"
alt=""
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
style="
width: 10vw;
border-radius: 50%;
@ -139,11 +139,14 @@
<script setup>
import { useI18n } from 'vue-i18n'
import GeneralHeader from '@/components/GeneralHeader.vue'
import { ref, onMounted } from 'vue'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { apiGetWithdrawRecords } from '@/api/wallet'
import GeneralHeader from '@/components/GeneralHeader.vue'
const { t, locale } = useI18n()
//
@ -166,12 +169,6 @@ const getStatusText = (status) => {
}
}
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const getCashOutRecords = async () => {
const resCashOutRecords = await apiGetWithdrawRecords()

View File

@ -48,7 +48,7 @@
object-fit: cover;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -218,7 +218,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -474,7 +474,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -544,6 +544,7 @@ import { isInApp } from '@/utils/appBridge.js'
import { clearSelectedPayee } from '@/utils/payeeStore.js'
import { setDocumentDirection } from '@/locales/i18n'
import { useIdentityStore } from '@/stores/identity.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getBdMemberBillList, getBdHistory, getBdHistoryMore } from '@/api/bdCenter.js'
import { apiGetBankBalance } from '@/api/wallet.js'
@ -570,12 +571,6 @@ const BDData = ref({}) //BD成员数据
const salaryInfo = ref({}) //
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
const maskLayerShow = computed(() => {
return showHistory.value || showMore.value
})

View File

@ -48,7 +48,7 @@
object-fit: cover;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -257,7 +257,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -383,7 +383,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -765,7 +765,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -887,7 +887,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -955,6 +955,7 @@ import { isInApp } from '@/utils/appBridge.js'
import { clearSelectedPayee } from '@/utils/payeeStore.js'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { useIdentityStore } from '@/stores/identity.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getBdMemberBillList, getBdHistory, getBdHistoryMore } from '@/api/bdCenter.js'
import { getBdLeaderHistory, getBdLeaderHistoryMore } from '@/api/bdLeaderCenter'
@ -1046,13 +1047,6 @@ const closedPopup = () => {
SalaryMore.value = {}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const gotoPolicy = () => {
router.push({

View File

@ -40,7 +40,7 @@
alt=""
width="50px"
style="aspect-ratio: 1/1; border-radius: 50%; object-fit: cover"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<div style="flex: 1; min-width: 0; margin-left: 12px">
<div
@ -103,6 +103,7 @@ import { useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { getTeamId } from '@/utils/userStore.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getMyAgency, leaveAgency } from '@/api/host'
@ -118,12 +119,6 @@ locale.value && setDocumentDirection(locale.value)
//
const userInfo = ref({})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const confirmLeave = async () => {
console.log('确定离开')

View File

@ -455,7 +455,7 @@
alt=""
width="70%"
style="display: block; object-fit: cover"
@error="(e) => handleImageError(e, reward.type)"
@error="(e) => handleRewardImageError(e, reward.type)"
/>
</div>
<div
@ -496,11 +496,12 @@ import { computed, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { useLangStore } from '@/stores/lang'
import { gotoPrivateChat } from '@/utils/appBridge.js'
import { showError, showWarning, showInfo, showSuccess } from '@/utils/toast.js'
import { showError, showWarning, showSuccess } from '@/utils/toast.js'
import { useClipboard } from '@vueuse/core'
import { connectToApp } from '@/utils/appConnector.js'
import { getPngUrl } from '@/config/imagePaths.js'
import { preloadImages } from '@/utils/imagePreloader.js'
import { handleRewardImageError } from '@/utils/imageHandler.js'
import {
getMyInviteCode, //
@ -508,7 +509,6 @@ import {
getMyInviteIncome, //
getMyInviteUsers, //
apiGetBindingUserRewards, //
getInviteReceiveAward, //
getMyInviter, //
} from '@/api/invitation.js'
@ -577,18 +577,6 @@ const closedPopup = () => {
enterCodeShow.value = false
}
//
const handleImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null //
if (type == 'GOLD') {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
}
if (type == 'DOLLARS') {
e.target.src = new URL('/src/assets/icon/dollar.png', import.meta.url).href
}
}
//
const showDetail = (reward) => {
let showamount = ['GOLD', 'DIAMOND', 'GIFT', 'FRAGMENTS']
@ -621,12 +609,6 @@ const copyCode = (text) => {
}, 2000)
}
//
const showAwardText = (award) => {
if (award.type == 'GOLD') return award.quantity
return award.quantity + t('day_unit')
}
//
const confirmInvitationCode = () => {
if (!invitationCode.value.trim()) {
@ -699,17 +681,6 @@ const getBindingUserRewards = async () => {
}
}
//
const receiveAward = async (awardId) => {
try {
await getInviteReceiveAward(awardId)
} catch (error) {
console.error('Failed to fetch receive award:', error)
} finally {
getBindingUserRewards() //
}
}
//
const preloadCriticalImages = () => {
const criticalImages = [

View File

@ -153,7 +153,7 @@
:src="user.userProfile.userAvatar || ''"
style="width: 100%; aspect-ratio: 1/1; object-fit: cover; border-radius: 50%"
alt=""
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -223,6 +223,7 @@ import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { showError, showSuccess } from '@/utils/toast.js'
import { useDebounce } from '@/utils/useDebounce'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { searchUser } from '@/api/userInfo'
import {
@ -246,12 +247,6 @@ const searchResults = ref([]) //搜索结果
const disInvite = ref(true) //
const selectedUser = ref({}) //
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const showUserList = computed(() => {
if (searchQuery.value) {

View File

@ -153,7 +153,7 @@
:src="user.userProfile.userAvatar || ''"
style="width: 100%; aspect-ratio: 1/1; object-fit: cover; border-radius: 50%"
alt=""
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -222,6 +222,7 @@ import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { showError, showSuccess } from '@/utils/toast.js'
import { useDebounce } from '@/utils/useDebounce'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { searchUser } from '@/api/userInfo'
import {
@ -252,12 +253,6 @@ const showUserList = computed(() => {
}
})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const clearSearch = () => {
searchQuery.value = ''

View File

@ -152,7 +152,7 @@
:src="user.userProfile.userAvatar || ''"
style="width: 100%; aspect-ratio: 1/1; object-fit: cover; border-radius: 50%"
alt=""
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -222,6 +222,7 @@ import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { showError, showSuccess } from '@/utils/toast.js'
import { useDebounce } from '@/utils/useDebounce'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { searchUser } from '@/api/userInfo'
import {
@ -252,12 +253,6 @@ const showUserList = computed(() => {
}
})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const clearSearch = () => {
searchQuery.value = ''

View File

@ -150,7 +150,7 @@
aspect-ratio: 1/1;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
<div style="min-width: 0; flex: 1">
@ -205,6 +205,7 @@ import { computed, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { setDocumentDirection } from '@/locales/i18n'
import { showError, showSuccess } from '@/utils/toast.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import GeneralHeader from '@/components/GeneralHeader.vue'
@ -226,12 +227,6 @@ const searchResults = ref([]) //搜索结果
const disInvite = ref(true) //
const selectedUser = ref({}) //
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const showUserList = computed(() => {
if (searchQuery.value) {

View File

@ -243,7 +243,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -529,7 +529,7 @@
alt=""
width="50%"
style="aspect-ratio: 1/1"
@error="(e) => handleImageError(e, reward.type)"
@error="(e) => handleRewardImageError(e, reward.type)"
/>
</itemCenter>
@ -627,7 +627,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -677,10 +677,11 @@
<script setup>
import { computed, onMounted, onUnmounted, ref } from 'vue'
import { isInApp, viewUserInfo } from '@/utils/appBridge.js'
import { useDebounce, useThrottle } from '@/utils/useDebounce'
import { useThrottle } from '@/utils/useDebounce'
import { connectToApp } from '@/utils/appConnector.js'
import { getPngUrl } from '@/config/imagePaths.js'
import { preloadImages } from '@/utils/imagePreloader.js'
import { handleAvatarImageError, handleRewardImageError } from '@/utils/imageHandler.js'
import {
getWeekTopList,
@ -872,22 +873,6 @@ const showDetail = (type, reward) => {
}
}
//
const handleImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null //
if ((type = 'GOLD')) {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const getTopList = async (params) => {
const resWeekTopList = await getWeekTopList(params)

View File

@ -216,7 +216,7 @@
object-fit: cover;
"
:style="{ borderRadius: rankingType === 'Room' ? '10%' : '50%' }"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<div
style="
@ -296,7 +296,7 @@
alt=""
style="display: block; width: 15%; aspect-ratio: 1/1"
:style="{ borderRadius: rankingType === 'Room' ? '10%' : '50%' }"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称 -->
<div
@ -337,6 +337,7 @@ import { isInApp, closePage, viewUserInfo, gotoRoom } from '@/utils/appBridge.js
import { connectToApp } from '@/utils/appConnector.js'
import { preloadImages } from '@/utils/imagePreloader'
import { getPngUrl } from '@/config/imagePaths.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getWealthRanking, getCharmRanking, getRoomRanking, getMyRanking } from '@/api/ranking'
@ -521,12 +522,6 @@ watchEffect(() => {
}
})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
const observer = new IntersectionObserver((entries) => {
entries.forEach((entry) => {
//

View File

@ -32,7 +32,7 @@
width="100%"
style="display: block; aspect-ratio: 1/1; object-fit: cover"
:style="{ borderRadius: Type == 'Room' ? '0' : '50%' }"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
</div>
@ -100,6 +100,7 @@
<script setup>
import { computed, watch } from 'vue'
import { getPngUrl } from '@/config/imagePaths.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
// OSSURL
const coinNumBgUrl = getPngUrl('Ranking/Overall/', 'coinNumBg')
@ -188,12 +189,6 @@ const InfoBoxHeight = computed(() => {
}
}
})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
</script>
<style lang="scss" scoped>

View File

@ -194,7 +194,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称id -->
@ -285,7 +285,7 @@
:src="gift.cover || ''"
alt=""
style="width: 50%; display: block"
@error="(e) => handleImageError(e, gift.type)"
@error="(e) => handleRewardImageError(e, gift.type)"
/>
</itemCenter>
@ -441,7 +441,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
<!-- 名称 -->
<div
@ -550,7 +550,7 @@
aspect-ratio: 1/1;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
</div>
@ -729,6 +729,7 @@ import { useThrottle } from '@/utils/useDebounce'
import { showWarning } from '@/utils/toast.js'
import { getPngUrl } from '@/config/imagePaths.js'
import { preloadImages } from '@/utils/imagePreloader.js'
import { handleAvatarImageError, handleRewardImageError } from '@/utils/imageHandler.js'
import { getMemberProfile } from '@/api/wallet'
import {
@ -838,22 +839,6 @@ const showRanking = computed(() => {
return Ranking.value.filter((_, index) => index >= 3)
})
//
const handleImageError = (e, type) => {
console.log('图片资源出错')
e.target.onerror = null //
if ((type = 'GOLD')) {
e.target.src = new URL('/src/assets/icon/coin.png', import.meta.url).href
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const selectGood = (good) => {
exchargeGoodsShow.value = true

View File

@ -30,7 +30,7 @@
alt=""
width="100%"
style="border-radius: 50%; aspect-ratio: 1/1; object-fit: cover"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
</div>
@ -75,6 +75,8 @@
</template>
<script setup>
import { handleAvatarImageError } from '@/utils/imageHandler.js'
const props = defineProps({
isTopOne: {
type: Boolean,
@ -101,12 +103,6 @@ const props = defineProps({
default: '',
},
})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
</script>
<style lang="scss" scoped>

View File

@ -77,7 +77,7 @@
aspect-ratio: 1/1;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -325,6 +325,9 @@
</template>
<script setup>
import { onMounted, ref } from 'vue'
import { useClipboard } from '@vueuse/core'
import { showError, showWarning, showInfo, showSuccess } from '@/utils/toast.js'
import {
connectApplication,
parseAccessOrigin,
@ -338,12 +341,12 @@ import {
isAppConnected,
getAppHeaderInfo,
} from '@/utils/appConnectionManager.js'
import { onMounted, ref } from 'vue'
import { useClipboard } from '@vueuse/core'
import maskLayer from '@/components/MaskLayer.vue'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { getFreightAgencys } from '@/api/userInfo.js'
import { follow } from '@/api/recruit.js'
import { showError, showWarning, showInfo, showSuccess } from '@/utils/toast.js'
import maskLayer from '@/components/MaskLayer.vue'
//vite
const imageModules = import.meta.glob('@/assets/images/RechargeAgency/*.{png,jpg,svg}', {
@ -367,12 +370,6 @@ const FreightAgencyList = ref([]) //充值代理列表
const maskLayerShow = ref(false) //
const tipShow = ref(false) //
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const getAgencyList = async () => {
const resAgencyList = await getFreightAgencys()

View File

@ -79,7 +79,7 @@
aspect-ratio: 1/1;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
<div style="min-width: 0; flex: 1">
@ -138,10 +138,14 @@
import { ref, computed } from 'vue'
import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import GeneralHeader from '@/components/GeneralHeader.vue'
import { setSelectedUser } from '@/utils/coinSellerStore.js'
import { searchFreightUser } from '@/api/wallet.js'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { searchFreightUser } from '@/api/wallet.js'
import GeneralHeader from '@/components/GeneralHeader.vue'
const { t, locale } = useI18n()
const router = useRouter()
@ -155,12 +159,6 @@ const isSearching = ref(false)
const hasSearched = ref(false)
const selectedUser = ref(null)
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
// Computed properties
const hasValidSelection = computed(() => {
return selectedUser.value !== null

View File

@ -61,7 +61,7 @@
aspect-ratio: 1/1;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
<div class="user-details">
@ -156,7 +156,7 @@
aspect-ratio: 1/1;
border-radius: 50%;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
<div class="user-details">
@ -326,6 +326,7 @@ import { setDocumentDirection } from '@/locales/i18n'
import { getSelectedUser } from '@/utils/coinSellerStore.js'
import { showError, showSuccess } from '@/utils/toast.js'
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { checkFreightDealer, getFreightBalance, freightRecharge } from '@/api/wallet.js'
@ -478,13 +479,6 @@ const fetchFreightBalance = async () => {
}
}
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const initializeUser = () => {
const savedUser = getSelectedUser()

View File

@ -106,7 +106,7 @@
object-fit: cover;
display: block;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
<div class="user-details" style="flex: 1; min-width: 0">
@ -208,12 +208,15 @@
import { ref, computed, onMounted, watch, nextTick } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n'
import GeneralHeader from '@/components/GeneralHeader.vue'
import { userBankSearchUserProfile } from '@/api/wallet.js'
import { setSelectedPayee } from '@/utils/payeeStore.js'
import { showError } from '@/utils/toast.js'
import maskLayer from '@/components/MaskLayer.vue'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
import { userBankSearchUserProfile } from '@/api/wallet.js'
import GeneralHeader from '@/components/GeneralHeader.vue'
import maskLayer from '@/components/MaskLayer.vue'
const { t, locale } = useI18n()
const router = useRouter()
@ -233,12 +236,6 @@ const isLoadingRole = ref(false)
const maskLayerShow = ref(false)
const selectedUser = ref({})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const performSearch = async () => {
console.log('searchQuery.value:', searchQuery.value)

View File

@ -95,7 +95,7 @@
border-radius: 50%;
object-fit: cover;
"
@error="defaultAvatarUrl"
@error="handleAvatarImageError"
/>
</div>
@ -212,6 +212,7 @@ import { getBankBalance, userBankTransfer } from '@/api/wallet.js'
import { getSelectedPayee, clearSelectedPayee } from '@/utils/payeeStore.js'
import { showError, showSuccess } from '@/utils/toast.js'
import { setDocumentDirection } from '@/locales/i18n'
import { handleAvatarImageError } from '@/utils/imageHandler.js'
const { t, locale } = useI18n()
const router = useRouter()
@ -235,12 +236,6 @@ const selectedPayee = reactive({
hasSalary: false,
})
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
}
//
const initializePayee = () => {
const savedPayee = getSelectedPayee()