‘修改推广标识展示’

pages/subcomponent/promotion.vue

@@ -27,7 +27,7 @@
           <view class="avatar-box">
             <view class="avatar-frame">
               <image class="avatar-img" :src="userInfo.avatar" mode="aspectFill" />
-              <view class="user-type">{{userInfo.type}}</view>
+              <view class="avatar-badge" :class="userTypeBadgeClass">{{ userTypeText }}</view>
             </view>
           </view>
           <view class="user-meta">
@@ -181,7 +181,20 @@ export default {
 			console.log(getApp().globalData.configData,'getApp().globalData.configData')
       const item =  getApp().globalData.configData.find(i => i.keyName === 'index_lvxing')
       return item ? item.keyContent : ''
-    }
+    },
+    userTypeText() {
+      return this.userInfo.isTuiTypeTitle || '用户'
+    },
+    userTypeBadgeClass() {
+      switch (this.userInfo.isTuiTypeTitle) {
+        case '推广达人':
+          return 'avatar-badge-expert'
+        case '推广大使':
+          return 'avatar-badge-ambassador'
+        default:
+          return 'avatar-badge-user'
+      }
+    },
   },
   onLoad() {
     const sysInfo = uni.getSystemInfoSync()
@@ -227,6 +240,7 @@ export default {
           this.userInfo.intentioCode = res.result.intentioCode || ''
           this.userInfo.money = res.result.money || ''
           this.userInfo.integerPrice = res.result.integerPrice || ''
+          this.userInfo.isTuiTypeTitle = res.result.isTuiTypeTitle ||''
           // 你可以根据实际接口补充type、balance、totalWithdraw等字段
         }
       })
@@ -432,20 +446,36 @@ export default {
           object-fit: cover;
           display: block;
         }
-        .user-type {
+        .avatar-badge {
           position: absolute;
           left: 0;
           bottom: 0;
           width: 100%;
           height: 32rpx;
-          background: #e5e5e5;
-          color: #888;
-          font-size: 22rpx;
-          font-weight: 500;
-          text-align: center;
           line-height: 32rpx;
+          background: rgba(238, 238, 238, 0.95);
+          color: #999;
+          font-size: 24rpx;
+          text-align: center;
           border-bottom-left-radius: 10rpx;
           border-bottom-right-radius: 10rpx;
+          font-weight: 400;
+          letter-spacing: 2rpx;
+          z-index: 2;
+        }
+        .avatar-badge-user {
+          background: rgba(238, 238, 238, 0.95);
+          color: #999;
+        }
+        .avatar-badge-expert {
+          background: linear-gradient(90deg, #ff8917, #ffd01e);
+          color: #fff;
+          font-weight: 600;
+        }
+        .avatar-badge-ambassador {
+          background: linear-gradient(90deg, #b2f08d, #39e9d2);
+          color: #fff;
+          font-weight: 600;
         }
       }
     }