Parcourir la source

feat(energy): 能量沙盘个人/全家切换移到右上角,单成员时弹提示引导添加

liaoxg il y a 2 semaines
Parent
commit
69692bb89d
1 fichiers modifiés avec 67 ajouts et 16 suppressions
  1. 67 16
      cfc-frontend/pages/energy/index.vue

+ 67 - 16
cfc-frontend/pages/energy/index.vue

@@ -5,16 +5,10 @@
       <view class="nav-back" @click="goBack">
         <text class="nav-back-icon">&#x2190;</text>
       </view>
-      <!-- 我的 / 全家 切换 Tab -->
-      <view class="nav-tabs">
-        <view class="nav-tab" :class="{ active: currentView !== 'family' }" @click="switchView('self')">
-          <text class="nav-tab-icon">{{ currentMemberIcon }}</text>
-          <text class="nav-tab-label">{{ currentTabLabel }}</text>
-        </view>
-        <view class="nav-tab" :class="{ active: currentView === 'family' }" @click="switchView('family')">
-          <text class="nav-tab-icon">🏠</text>
-          <text class="nav-tab-label">全家</text>
-        </view>
+      <view class="nav-right" @click="toggleView">
+        <text class="nav-right-icon">{{ currentView === 'family' ? '🏠' : (currentMemberIcon) }}</text>
+        <text class="nav-right-label">{{ currentView === 'family' ? '全家' : currentTabLabel }}</text>
+        <text class="nav-right-arrow">&#x21C4;</text>
       </view>
     </view>
 
@@ -350,6 +344,31 @@ export default {
       }
       this.showMemberPicker = false
     },
+    toggleView() {
+      if (this.currentView === 'family') {
+        this.switchView('self')
+        return
+      }
+      // 进入全家态前检查成员数
+      var members = this.familySandboxData && this.familySandboxData.members
+        ? this.familySandboxData.members
+        : this.familyMembers
+      if (!members || members.length < 2) {
+        uni.showModal({
+          title: '需要更多家庭成员',
+          content: '至少需要 2 位家庭成员才能查看全家能量,快去添加吧!',
+          confirmText: '去添加',
+          cancelText: '取消',
+          success: (res) => {
+            if (res.confirm) {
+              uni.navigateTo({ url: '/pages/profile-extra/family-members' })
+            }
+          }
+        })
+        return
+      }
+      this.switchView('family')
+    },
     selectMember(member) {
       this.selectedMemberId = member.memberId
       this.currentView = 'self'
@@ -380,19 +399,51 @@ export default {
   background: linear-gradient(180deg, #0F1B2D 0%, #1A2744 100%);
   padding-bottom: 40rpx;
 }
+.nav-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 88rpx;
+  padding-top: env(safe-area-inset-top);
+  position: relative;
+  padding-left: 30rpx;
+  padding-right: 30rpx;
+}
+.nav-back {
+  width: 60rpx;
+  height: 60rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
 .nav-back-icon {
-  font-size: 32rpx;
+  font-size: 36rpx;
   color: #fff;
+  font-weight: bold;
 }
 .nav-right {
-  position: absolute;
-  right: 30rpx;
   display: flex;
   align-items: center;
-  gap: 8rpx;
-  background: rgba(255,255,255,0.1);
+  gap: 6rpx;
+  background: rgba(255,255,255,0.15);
   padding: 10rpx 20rpx;
-  border-radius: 30rpx;
+  border-radius: 32rpx;
+}
+.nav-right:active {
+  background: rgba(255,255,255,0.25);
+}
+.nav-right-icon {
+  font-size: 28rpx;
+  line-height: 1;
+}
+.nav-right-label {
+  font-size: 24rpx;
+  color: #fff;
+  font-weight: 500;
+}
+.nav-right-arrow {
+  font-size: 20rpx;
+  color: rgba(255,255,255,0.5);
 }
 .nav-current-member {
   font-size: 24rpx;