style: use images for community topic icons

uniapp/src/pages/community/community.vue

@@ -33,8 +33,8 @@
                 <view class="community-topics__list">
                     <view v-for="tag in displayTags" :key="tag.id" class="community-topic"
                         :class="{ 'community-topic--active': activeTagId === tag.id }" @tap="selectTag(tag)">
-                        <image v-if="tag.icon" class="community-topic__icon-image" :src="tag.icon" mode="aspectFit" />
-                        <text v-else class="community-topic__icon" :style="{ color: tag.theme.color }">{{ tag.theme.icon }}</text>
+                        <image class="community-topic__icon-image" :src="tag.icon || DEFAULT_TOPIC_ICON" mode="aspectFill"
+                            @error="handleTopicIconError(tag)" />
                         <text>{{ tag.name }}</text>
                     </view>
                 </view>
@@ -106,6 +106,7 @@ const page = ref(1)
 const needRefresh = ref(false)
 const fetchRequestId = ref(0)
 const pageSize = 15
+const DEFAULT_TOPIC_ICON = '/static/images/tabbar/community.png'
 
 const feedTabs: Array<{ key: FeedKey; label: string }> = [
     { key: 'recommend', label: '推荐' },
@@ -119,22 +120,17 @@ const userPointsText = computed(() => (isLogin.value ? String(userPoints.value ?
 const feedTitle = computed(() => ({ recommend: '精选讨论', follow: '关注动态', hot: '热门话题', topic: '话题广场' }[activeFeed.value]))
 const activeTagName = computed(() => tagList.value.find((tag) => tag.id === activeTagId.value)?.name || '')
 
-const TOPIC_THEMES = [
-    { icon: '⚽', color: '#1468f5' },
-    { icon: '🏀', color: '#ff7518' },
-    { icon: '📈', color: '#21b573' },
-    { icon: '↔', color: '#8b5cf6' },
-    { icon: '🎮', color: '#596bff' }
-]
-
 const displayTags = computed(() => {
-    return tagList.value.map((tag, index) => ({
+    return tagList.value.map((tag) => ({
         ...tag,
-        icon: typeof tag.icon === 'string' ? tag.icon.trim() : '',
-        theme: TOPIC_THEMES[index % TOPIC_THEMES.length]
+        icon: typeof tag.icon === 'string' ? tag.icon.trim() : ''
     }))
 })
 
+const handleTopicIconError = (tag: any) => {
+    tag.icon = DEFAULT_TOPIC_ICON
+}
+
 const getSavedActiveTag = () => {
     const tagId = Number(uni.getStorageSync(COMMUNITY_ACTIVE_TAG_KEY))
     return Number.isFinite(tagId) && tagId > 0 ? tagId : 0
@@ -539,15 +535,12 @@ onShow(() => {
         word-break: keep-all;
     }
 
-    &__icon {
-        font-size: 31rpx !important;
-        line-height: 1;
-    }
-
     &__icon-image {
-        width: 32rpx;
-        height: 32rpx;
+        width: 34rpx;
+        height: 34rpx;
         flex-shrink: 0;
+        border-radius: 50%;
+        background: #edf3ff;
     }
 
     &--active {