Sfoglia il codice sorgente

feat(health): 优化家庭挑战创建流程,增加成员数量前置校验和友好提示

- openCreateModal 新增前置校验:家庭成员 < 2 时弹出引导弹窗而非直接报错
- submitForm 新增客户端校验:选择成员 < 2 时阻止提交并提示友好信息
- 新增 goToAddMember 方法:引导用户前往家庭成员页添加成员
- 避免后端 500 错误'家庭挑战至少需要2名成员参与'直接暴露给用户
liaoxg 3 settimane fa
parent
commit
f812fcc244
1 ha cambiato i file con 61 aggiunte e 0 eliminazioni
  1. 61 0
      cfc-frontend/pages/health/challenge-manage.vue

+ 61 - 0
cfc-frontend/pages/health/challenge-manage.vue

@@ -176,6 +176,25 @@
         </view>
       </view>
     </view>
+
+    <!-- 家庭成员不足提示弹窗 -->
+    <view class="overlay" v-if="showMemberPrompt" @click="showMemberPrompt = false">
+      <view class="modal prompt-modal" @click.stop>
+        <view class="modal-header">
+          <text class="modal-title">无法创建挑战</text>
+          <text class="modal-close" @click="showMemberPrompt = false">×</text>
+        </view>
+        <view class="prompt-content">
+          <text class="prompt-icon">👨‍👩‍👧‍👦</text>
+          <text class="prompt-title">家庭成员不足</text>
+          <text class="prompt-desc">家庭挑战至少需要 2 名成员参与,请先添加家庭成员</text>
+        </view>
+        <view class="modal-footer">
+          <button class="btn-cancel" @click="showMemberPrompt = false">暂不添加</button>
+          <button class="btn-submit" @click="goToAddMember">去添加成员</button>
+        </view>
+      </view>
+    </view>
   </view>
 </template>
 
@@ -192,6 +211,7 @@ export default {
       familyMembers: [],
       selectedMemberIds: [],
       showModal: false,
+      showMemberPrompt: false,
       editMode: false,
       editingId: null,
       form: {
@@ -292,12 +312,17 @@ export default {
       }
     },
     openCreateModal() {
+      if (this.familyMembers.length < 2) {
+        this.showMemberPrompt = true
+        return
+      }
       this.editMode = false
       this.editingId = null
       this.form = {
         title: '', description: '', challengeType: 'custom',
         targetMode: 'all_members', targetValue: '7', durationDays: '7', rewardPoints: '50'
       }
+      this.selectedMemberIds = this.familyMembers.map(m => m.id)
       this.showModal = true
     },
     openEditModal(ch) {
@@ -327,6 +352,10 @@ export default {
         uni.showToast({ title: '目标值必须大于0', icon: 'none' })
         return
       }
+      if (!this.editMode && this.selectedMemberIds.length < 2) {
+        uni.showToast({ title: '家庭挑战至少需要选择2名成员参与', icon: 'none' })
+        return
+      }
       var data = {
         title: this.form.title.trim(),
         description: this.form.description.trim(),
@@ -381,6 +410,10 @@ export default {
     viewChallenge(ch) {
       // 跳转到挑战详情
       uni.navigateTo({ url: '/pages/activity/index' })
+    },
+    goToAddMember() {
+      this.showMemberPrompt = false
+      uni.navigateTo({ url: '/pages/profile-extra/family-members' })
     }
   }
 }
@@ -763,4 +796,32 @@ export default {
   background: linear-gradient(135deg, #10B981, #34D399);
   color: #fff;
 }
+
+/* 家庭成员不足提示弹窗 */
+.prompt-modal {
+  max-height: 60vh;
+  padding: 32rpx 28rpx 40rpx;
+}
+.prompt-content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 24rpx 0 16rpx;
+}
+.prompt-icon {
+  font-size: 80rpx;
+  margin-bottom: 16rpx;
+}
+.prompt-title {
+  font-size: 32rpx;
+  font-weight: 700;
+  color: #1E293B;
+  margin-bottom: 12rpx;
+}
+.prompt-desc {
+  font-size: 26rpx;
+  color: #64748B;
+  text-align: center;
+  line-height: 1.6;
+}
 </style>