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

src/utils/imageHandler.js

@@ -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
+  }
+}

src/views/Activities/Game/components/topUser.vue

@@ -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>

src/views/Activities/Game/index.vue

@@ -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
-}
-
 // 获取2025年12月15日上午0点的时间戳（北京时间）
 const getTargetTime = () => {
   const targetDate = new Date(2025, 11, 15, 0, 0, 0) // 月份从0开始，11代表12月

src/views/Activities/Lebanon/IndependenceDay/components/topUser.vue

@@ -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>

src/views/Activities/Lebanon/IndependenceDay/index.vue

@@ -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
-}
-
 // 获取2025年11月29日上午10点的时间戳（北京时间）
 const getTargetTime = () => {
   const targetDate = new Date(2025, 10, 29, 10, 0, 0) // 月份从0开始，10代表11月

src/views/Activities/Reward/RechargeReward.vue

@@ -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 = [

src/views/Activities/UAE/IndependenceDay/components/topUser.vue

@@ -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>

src/views/Activities/UAE/IndependenceDay/index.vue

@@ -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
-}
-
 // 获取2025年12月9日上午10点的时间戳（北京时间）
 const getTargetTime = () => {
   const targetDate = new Date(2025, 11, 9, 10, 0, 0) // 月份从0开始，11代表12月

src/views/Activities/Yemen/IndependenceDay/index.vue

@@ -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
-}
-
 // 获取2025年12月5日上午10点的时间戳（北京时间）
 const getTargetTime = () => {
   const targetDate = new Date(2025, 11, 5, 10, 0, 0) // 月份从0开始，11代表12月

src/views/AdminCenter/MyAgencyTeams.vue

@@ -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 = {

src/views/AdminCenter/MyBDLeaderTeams.vue

@@ -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 = {

src/views/AdminCenter/MyBDTeams.vue

@@ -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 = {

src/views/AdminCenter/index.vue

@@ -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' })
 }

src/views/AgencyCenter/AgencySetting.vue

@@ -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>
 

src/views/AgencyCenter/Message.vue

@@ -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

src/views/AgencyCenter/components/TeamBillMore.vue

@@ -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('更新展示类型')

src/views/AgencyCenter/index.vue

@@ -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 {

src/views/ApplyHost/ApplyView.vue

@@ -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 GeneralHeader from '@/components/GeneralHeader.vue'
-import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
-import { setDocumentDirection } from '@/locales/i18n'
 
 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)

src/views/BDCenter/availableIncome.vue

@@ -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

src/views/BDCenter/incomeDetails.vue

@@ -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()

src/views/BDCenter/index.vue

@@ -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
 })

src/views/BDLeaderCenter/index.vue

@@ -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({

src/views/HostCenter/HostSetting.vue

@@ -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('确定离开')

src/views/Invitation/InviteToRegister.vue

@@ -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 = [

src/views/Invitation/inviteAgency.vue

@@ -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) {

src/views/Invitation/inviteBD.vue

@@ -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 = ''

src/views/Invitation/inviteBDLeader.vue

@@ -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 = ''

src/views/Invitation/inviteRechargeAgency.vue

@@ -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) {

src/views/Ranking/KingAndQueen/TopList.vue

@@ -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)

src/views/Ranking/Overall/Ranking.vue

@@ -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) => {
     // 哨兵元素离开视口

src/views/Ranking/Overall/components/topUser.vue

@@ -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'
 
 // 获取OSS图片URL的函数
 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>

src/views/Ranking/WeeklyStar/WeeklyStar.vue

@@ -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

src/views/Ranking/WeeklyStar/components/topUser.vue

@@ -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>

src/views/RechargeAgency/Recruit.vue

@@ -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 { handleAvatarImageError } from '@/utils/imageHandler.js'
-import { useClipboard } from '@vueuse/core'
+
-import maskLayer from '@/components/MaskLayer.vue'
 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()

src/views/RechargeAgency/SearchUser.vue

@@ -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

src/views/RechargeAgency/index.vue

@@ -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()

src/views/Wallet/Transfer/SearchPayee.vue

@@ -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)

src/views/Wallet/Transfer/Transfer.vue

@@ -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()