‘优化我的页面推广显示逻辑’

pages/component/my.vue

@@ -55,10 +55,15 @@
         </view>
 
         <!-- 分享赚佣金模块 -->
-        <view class="share-commission-card" @tap="onShareCommission" v-if="login_status">
+        <view class="share-commission-card" @tap="onShareCommission" v-if="login_status && userInfo.isUser === 'Y'">
             <text class="share-commission-text">分享赚佣金</text>
         </view>
 
+        <view class="share-commission-card" @tap="onShareCommission" v-if="login_status && userInfo.isUser === 'N'">
+            <text class="share-commission-text">申请成为推广官</text>
+        </view>
+
+
         <!-- 订单区域 -->
         <view class="order-section" v-if="login_status" @tap="viewAllOrders">
             <view class="section-header">

pages/subcomponent/promotion.vue

@@ -100,7 +100,22 @@
     <!-- 申请进度弹窗 -->
     <view v-if="showProgressModal" class="progress-modal-mask">
       <view class="progress-modal-box">
-        <view class="progress-modal-title">联系运营商\n升级解锁更多权益</view>
+        <view class="progress-modal-title">申请进度</view>
+        <!-- 步骤条 -->
+        <view class="progress-steps">
+          <view :class="['step', promotionStatus >= 0 ? 'active' : '']">
+            <text :class="{'active': promotionStatus >= 0}">1</text>
+            <span>已提交</span>
+          </view>
+          <view class="step-line"></view>
+          <view :class="['step', promotionStatus == 0 ? 'active' : (promotionStatus == 1 ? 'active' : (promotionStatus == 2 ? 'active' : ''))]">
+            <text :class="{'active': promotionStatus == 0 || promotionStatus == 1 || promotionStatus == 2}">2</text>
+            <span v-if="promotionStatus == 0">审核中</span>
+            <span v-else-if="promotionStatus == 1">审核通过</span>
+            <span v-else-if="promotionStatus == 2">已驳回</span>
+          </view>
+        </view>
+        <!-- 底部按钮区 -->
         <view class="progress-modal-list">
           <view class="progress-modal-item" @tap="goToFaq">
             <text>在线客服</text>
@@ -168,7 +183,9 @@ export default {
       ],
       status: 0,
       showProgressModal: false,
-      showQrcodeModal: false
+      showQrcodeModal: false,
+      promotionStatus: null, // 0审核中 1已通过 2已驳回
+      rejectReason: '',      // 驳回原因
     }
   },
   computed: {
@@ -267,12 +284,13 @@ export default {
     getMyPromotionInfo(){
       this.$api('getMyPromotionInfo', {}, (res) => {
         if (res && res.success && res.result) {
-          if (res.result.status == 0) {
           this.status = res.result.status
+          this.promotionStatus = res.result.status
+          this.rejectReason = res.result.rejectReason || ''
           console.log(this.status,'this.status')
-          }
         }else{
           this.status = 3
+          this.promotionStatus = 3
           console.log(this.status,'this.status')
         }
       })
@@ -801,6 +819,46 @@ export default {
   margin-bottom: 48rpx;
   white-space: pre-line;
 }
+.progress-steps {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 32rpx 0 24rpx 0;
+  .step {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    color: #bbb;
+    &.active {
+      color: #13ac47;
+      font-weight: bold;
+    }
+    text {
+      width: 40rpx;
+      height: 40rpx;
+      border-radius: 50%;
+      background: #eee;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-bottom: 8rpx;
+      font-size: 26rpx;
+      &.active {
+        background: #13ac47;
+        color: #fff;
+      }
+    }
+    span {
+      font-size: 24rpx;
+    }
+  }
+  .step-line {
+    width: 60rpx;
+    height: 4rpx;
+    background: #eee;
+    margin: 0 12rpx;
+  }
+}
 .progress-modal-list {
   width: 88%;
   display: flex;
@@ -809,7 +867,6 @@ export default {
   margin-bottom: 48rpx;
 }
 .progress-modal-item {
-  // background: #fff;
   border-radius: 18rpx;
   height: 80rpx;
   display: flex;

pages/subcomponent/upgrad.vue

@@ -52,7 +52,7 @@
     </view>
     <!-- 底部按钮区 -->
     <view class="bottom-btns">
-      <button class="btn gray">升级推广官</button>
+      <button class="btn gray" @tap="showUpgradeModal = true">升级推广官</button>
       <button class="btn green" @tap="submitForm">提交</button>
     </view>
     <!-- 选择器弹窗 -->
@@ -71,6 +71,23 @@
         <button class="confirm-btn" @tap="confirmPicker">确认</button>
       </view>
     </view>
+    <!-- 升级推广官弹窗 -->
+    <view v-if="showUpgradeModal" class="progress-modal-mask">
+      <view class="progress-modal-box">
+        <view class="progress-modal-title">联系运营商\n升级解锁更多权益</view>
+        <view class="progress-modal-list">
+          <view class="progress-modal-item" @tap="contactService">
+            <text>在线客服</text>
+            <uni-icons type="right" size="22" color="#bbb" />
+          </view>
+          <view class="progress-modal-item" @tap="contactService">
+            <text>客服电话</text>
+            <uni-icons type="right" size="22" color="#bbb" />
+          </view>
+        </view>
+        <button class="progress-modal-btn" @tap="showUpgradeModal = false">我知道了</button>
+      </view>
+    </view>
   </view>
 </template>
 
@@ -93,7 +110,8 @@ export default {
       showPickerPopup: false,
       currentPickerIndex: 0,
       indicatorStyle: 'height: 88rpx; border: none;',
-      pickerOptions: ['2小时', '3小时', '4小时', '5小时', '6小时']
+      pickerOptions: ['2小时', '3小时', '4小时', '5小时', '6小时'],
+      showUpgradeModal: false
     }
   },
   onLoad() {
@@ -133,6 +151,16 @@ export default {
       this.currentPickerIndex = 0
     },
     submitForm() {
+      // 手机号校验
+      const phone = this.formData.phone
+      if (!phone) {
+        uni.showToast({ title: '请输入手机号', icon: 'none' })
+        return
+      }
+      if (!/^1[3-9]\d{9}$/.test(phone)) {
+        uni.showToast({ title: '手机号格式不正确', icon: 'none' })
+        return
+      }
       this.$api('apply', this.formData, (res) => {
         if (res && res.success) {
           uni.showToast({ title: '提交成功', icon: 'success' })
@@ -357,7 +385,7 @@ export default {
     border: none;
     box-shadow: none;
     &.gray {
-      background: linear-gradient(180deg, #f8f8f8 0%, #f2f4f6 100%);
+      background: linear-gradient(90deg, #b2f08d, #39e9d2);
       color: #222;
       border: 2rpx solid #e5e5e5;
     }
@@ -436,4 +464,66 @@ export default {
     }
   }
 }
+
+.progress-modal-mask {
+  position: fixed;
+  left: 0; right: 0; top: 0; bottom: 0;
+  background: rgba(0,0,0,0.25);
+  z-index: 2000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.progress-modal-box {
+  width: 80vw;
+  max-width: 420px;
+  background: linear-gradient(180deg, #f3fff2 0%, #eafff6 100%);
+  border-radius: 32rpx;
+  box-shadow: 0 8rpx 32rpx rgba(60, 167, 250, 0.10);
+  padding: 56rpx 0 32rpx 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.progress-modal-title {
+  font-size: 34rpx;
+  color: #222;
+  font-weight: bold;
+  text-align: center;
+  margin-bottom: 48rpx;
+  white-space: pre-line;
+}
+.progress-modal-list {
+  width: 88%;
+  display: flex;
+  flex-direction: column;
+  gap: 18rpx;
+  margin-bottom: 48rpx;
+}
+.progress-modal-item {
+  border-radius: 18rpx;
+  height: 80rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 30rpx;
+  color: #222;
+  padding: 0 32rpx;
+  box-shadow: 0 2rpx 8rpx rgba(60, 167, 250, 0.04);
+}
+.progress-modal-btn {
+  width: 88%;
+  height: 88rpx;
+  background: linear-gradient(90deg, #b2f08d, #39e9d2);
+  color: #222;
+  font-size: 32rpx;
+  font-weight: bold;
+  border-radius: 44rpx;
+  margin-top: 8rpx;
+  box-shadow: 0 4rpx 16rpx rgba(60, 167, 250, 0.08);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: none;
+}
 </style>