Просмотр исходного кода

fix: 去掉行TabBar页的redirectTo,登录态内容内联渲染,保持底签可见

liaoxg 1 месяц назад
Родитель
Сommit
250947301c
1 измененных файлов с 179 добавлено и 14 удалено
  1. 179 14
      cfc-frontend/pages/index-home/index.vue

+ 179 - 14
cfc-frontend/pages/index-home/index.vue

@@ -47,8 +47,65 @@
   <!-- Tabbar 切换过渡页 -->
   <tab-transition v-if="showTabTransition" dimCode="action" />
 
+  <!-- 登录态 — 直接内嵌,保持底签可见 -->
+  <view v-if="currentRole" class="logged-in-container">
+    <!-- 品牌头部 -->
+    <PageBanner theme="action"
+      tagline="知行合一 · 快乐成长"
+      quote="千里之行,始于足下" />
+
+    <!-- 家庭成员选择条 -->
+    <FamilyMemberStrip
+      :members="familyMembersVisible"
+      :selectedMemberId="selectedMemberId"
+      @select="onFamilyMemberSelect" />
+
+    <!-- 五维能量条 -->
+    <FamilyEnergyBar
+      v-if="sandboxData"
+      dimensionCode="action"
+      :sandboxData="sandboxData"
+      :dualDimension="dualDimension" />
+
+    <!-- 能量沙盘 — Canvas 五行星图 -->
+    <WuxingSandbox
+      v-if="sandboxData"
+      mode="live"
+      :scores="{
+        body: sandboxData.bodyScore || 0,
+        mind: sandboxData.mindScore || 0,
+        wisdom: sandboxData.wisdomScore || 0,
+        action: sandboxData.actionScore || 0,
+        wealth: sandboxData.wealthScore || 0
+      }"
+      :overallScore="sandboxData.overallScore || 0"
+      :members="sandboxData.members || []"
+      showDimensionBar
+      starHeight="480rpx" />
+
+    <!-- 今日行动任务 -->
+    <DimensionTasks
+      v-if="dimensionTasks.length > 0"
+      dimensionCode="action"
+      :tasks="dimensionTasks"
+      @taskClick="onTaskClick"
+      @moreTasks="goTasks" />
+
+    <!-- 功能入口 -->
+    <view class="func-section">
+      <view class="func-grid">
+        <view class="func-item" v-for="item in funcList" :key="item.label" @click="onFuncClick(item)">
+          <view class="func-icon-wrap">
+            <text class="func-icon">{{ item.icon }}</text>
+          </view>
+          <text class="func-label">{{ item.label }}</text>
+        </view>
+      </view>
+    </view>
+  </view>
+
   <!-- 未登录态 — 发现页/引流内容,直接内嵌,不跳转 -->
-  <view v-if="!currentRole" class="discover-container">
+  <view v-else class="discover-container">
     <!-- 品牌头部 -->
     <PageBanner theme="home"
       tagline="家庭健康成长俱乐部"
@@ -211,7 +268,6 @@
     <view style="height: 120rpx;"></view>
   </view>
 
-  <!-- 登录态 — 已迁移到 home 分包,通过 redirectTo 跳转,不再静态渲染 -->
 </view>
 </template>
 
@@ -219,7 +275,10 @@
 import PageBanner from '../../components/PageBanner.vue'
 import WuxingSandbox from '../../components/wuxing-sandbox.vue'
 import TabTransition from '../../components/tab-transition.vue'
-import { acceptParentInvite, productList, getActivityList, getFeaturedArticles } from '../../utils/api.js'
+import FamilyMemberStrip from '../../components/FamilyMemberStrip.vue'
+import FamilyEnergyBar from '../../components/FamilyEnergyBar.vue'
+import DimensionTasks from '../../components/DimensionTasks.vue'
+import { acceptParentInvite, productList, getActivityList, getFeaturedArticles, getFamilyEnergySandbox, getVisibleFamilyMembers, getTodayTasksByCategory } from '../../utils/api.js'
 
 var DIMENSIONS = [
   { code: 'body', name: '身', icon: '🌏', color: '#8D6E63', bgColor: 'rgba(141,110,99,0.15)', title: '主动健康', desc: '用最适合的方法,从根源调理家人体质,畅享高质量长寿生活' },
@@ -233,7 +292,10 @@ export default {
   components: {
     PageBanner,
     WuxingSandbox,
-    TabTransition
+    TabTransition,
+    FamilyMemberStrip,
+    FamilyEnergyBar,
+    DimensionTasks
   },
   data() {
     // 从 storage 预取登录态/角色,确保首次渲染即正确(WeChat 渲染层/逻辑层分离架构下 onLoad 执行前已渲染)
@@ -274,7 +336,21 @@ export default {
         'linear-gradient(135deg, #8B5CF6, #C084FC)',
         'linear-gradient(135deg, #F97316, #FB923C)',
         'linear-gradient(135deg, #6366F1, #818CF8)'
-      ]
+      ],
+
+      // 登录态数据
+      familyMembersVisible: [],
+      selectedMemberId: null,
+      sandboxData: null,
+      dualDimension: null,
+      dimensionTasks: [],
+      funcList: [
+        { icon: '\u{1F3CB}', label: '任务', page: '/pages/tasks/tasks' },
+        { icon: '\u{1F3C0}', label: '活动', page: '/pages/discover/index?type=activity' },
+        { icon: '\u{1F6CD}', label: '商城', page: '/pages/discover/index?type=product' },
+        { icon: '\u{1F3EB}', label: '课程', page: '/pages/discover/index?type=course' }
+      ],
+      loggedInInitDone: false
     }
   },
   onLoad(options) {
@@ -335,8 +411,53 @@ export default {
       }, 400)
     },
 
-    onChildReady() {
-      // 已废弃:登录用户不再通过此页面渲染子组件
+    // ===== 登录态数据加载 =====
+    loadLoggedInData: function() {
+      var self = this
+      this.loadFamilyMembers()
+      this.loadEnergySandbox()
+      this.loadDimensionTasks()
+    },
+    loadFamilyMembers: function() {
+      var self = this
+      getVisibleFamilyMembers().then(function(res) {
+        if (res.code === 200 && res.data) {
+          self.familyMembersVisible = Array.isArray(res.data) ? res.data : (res.data.list || [])
+          if (self.familyMembersVisible.length > 0) {
+            self.selectedMemberId = self.familyMembersVisible[0].memberId || self.familyMembersVisible[0].id
+          }
+        }
+      }).catch(function() {})
+    },
+    loadEnergySandbox: function() {
+      var self = this
+      getFamilyEnergySandbox().then(function(res) {
+        if (res.code === 200 && res.data) {
+          self.sandboxData = res.data
+          self._splashReady = true
+          self._tryHideSplash()
+        }
+      }).catch(function() {})
+    },
+    loadDimensionTasks: function() {
+      var self = this
+      getTodayTasksByCategory({ category: 'action' }).then(function(res) {
+        if (res.code === 200 && res.data) {
+          self.dimensionTasks = Array.isArray(res.data) ? res.data : (res.data.list || [])
+        }
+      }).catch(function() {})
+    },
+    onFamilyMemberSelect: function(member) {
+      this.selectedMemberId = member.memberId || member.id
+    },
+    onTaskClick: function(task) {
+      uni.navigateTo({ url: '/pages/tasks/task-detail?taskId=' + (task.id || task.taskId) })
+    },
+    goTasks: function() {
+      uni.navigateTo({ url: '/pages/tasks/tasks' })
+    },
+    onFuncClick: function(item) {
+      uni.navigateTo({ url: item.page })
     },
 
     // 首页 TabTransition 动态关闭:检测关键内容是否就绪
@@ -348,8 +469,8 @@ export default {
                  !!(self.dimensionActivities && self.dimensionActivities.length > 0) ||
                  !!(self.indexArticles && self.indexArticles.length > 0)
         }
-        // 登录用户:currentRole 存在代表子组件已渲染
-        return !!self.currentRole
+        // 登录用户:等待关键数据加载完成
+        return !!(self.currentRole && self.sandboxData)
       }, function(val) {
         if (val) {
           if (unwatch) unwatch()
@@ -385,11 +506,12 @@ export default {
         uni.removeStorageSync('inviteType')
         return
       }
-      // 登录用户:跳转到 home 分包页面,不再静态渲染组件
-      var targetUrl = this.currentRole === 'child'
-        ? '/pages/home-pages/child-index'
-        : '/pages/home-pages/parent-index'
-      uni.redirectTo({ url: targetUrl })
+      // 登录用户:直接在 TabBar 页面内联渲染,保持底签可见
+      if (!this.loggedInInitDone) {
+        this.loggedInInitDone = true
+        this.loadLoggedInData()
+      }
+      this._watchPageReady()
     },
     isLoggedIn() {
       return !!uni.getStorageSync('token')
@@ -1131,4 +1253,47 @@ export default {
   0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
   40%           { transform: scale(1);   opacity: 1; }
 }
+
+/* ---- 登录态内容布局 ---- */
+.logged-in-container {
+  padding-bottom: 40rpx;
+}
+
+.func-section {
+  padding: 30rpx 32rpx;
+}
+.func-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 20rpx;
+}
+.func-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12rpx;
+  width: calc(25% - 15rpx);
+  padding: 24rpx 0;
+  background: #ffffff;
+  border-radius: 16rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
+}
+.func-icon-wrap {
+  width: 80rpx;
+  height: 80rpx;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #10B981, #34D399);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.func-icon {
+  font-size: 36rpx;
+  line-height: 1;
+}
+.func-label {
+  font-size: 24rpx;
+  color: #333;
+  font-weight: 500;
+}
 </style>