cfc/cfc-frontend/pages/profile/profile.vue

<template>
  <view class="container">
    <!-- Tabbar 切换过渡页 -->
    <tab-transition v-if="showTabTransition" dimCode="wealth" />

    <!-- ===== 未登录状态 ===== -->
    <view v-if="!isLoggedIn" class="login-prompt">
      <view class="prompt-icon">👤</view>
      <text class="prompt-title">登录浠艾福</text>
      <text class="prompt-desc">登录后可查看个人资料、积分记录等</text>
      <button class="login-btn" @click="goLogin">登录 / 注册</button>
    </view>

    <!-- ===== 已登录状态 ===== -->
    <template v-else>
      <!-- 品牌头部 -->
      <PageBanner theme="wealth" tagline="丰盈内心，富足生活，厚德载物" quote="" />

      <!-- 用户卡片 + 富沛能量 + 切换 -->
      <ProfileHeader />

      <!-- 行动数据 + 财富数据 -->
      <ProfileStats />

      <!-- 成就徽章 -->
      <ProfileBadges />

      <!-- 成长报告 -->
      <ProfileGrowth />

      <!-- 菜单列表 -->
      <ProfileMenu :role="role" @invite-generate="onInviteGenerate" />
    </template>
  </view>
</template>

<script>
import TabTransition from '../../components/tab-transition.vue'
import PageBanner from '../../components/PageBanner.vue'
import ProfileHeader from './components/ProfileHeader.vue'
import ProfileStats from './components/ProfileStats.vue'
import ProfileBadges from './components/ProfileBadges.vue'
import ProfileGrowth from './components/ProfileGrowth.vue'
import ProfileMenu from './components/ProfileMenu.vue'

export default {
  components: {
    TabTransition,
    PageBanner,
    ProfileHeader,
    ProfileStats,
    ProfileBadges,
    ProfileGrowth,
    ProfileMenu
  },
  data() {
    return {
      shareData: null,
      showTabTransition: false
    }
  },
  computed: {
    isLoggedIn() {
      return !!uni.getStorageSync('token')
    },
    role() {
      return uni.getStorageSync('currentRole') || uni.getStorageSync('role') || 'parent'
    }
  },
  onShareAppMessage() {
    if (this.shareData) {
      return {
        title: this.shareData.title,
        path: this.shareData.path,
        imageUrl: '/static/invite-card.png'
      }
    }
  },
  onShow() {
    // Tabbar 切换过渡动画（最少停留 1 秒）
    this.showTabTransition = true
    var self = this
    setTimeout(function() {
      self.showTabTransition = false
    }, 1100)

    if (!uni.getStorageSync('token')) return
    const currentRole = uni.getStorageSync('currentRole') || uni.getStorageSync('role') || 'parent'
    if (currentRole === 'teacher') {
      uni.redirectTo({ url: '/pages/teacher/teacher-profile' })
    }
  },
  methods: {
    goLogin() {
      uni.navigateTo({ url: '/pages/login/login' })
    },
    onInviteGenerate(shareData) {
      this.shareData = shareData
    }
  }
}
</script>

<style scoped>
.container {
  min-height: 100vh;
  background: #f5f7fa;
  padding-bottom: 120rpx;
}

.login-prompt {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 200rpx 60rpx;
}
.prompt-icon { font-size: 100rpx; margin-bottom: 30rpx; }
.prompt-title { font-size: 40rpx; font-weight: bold; color: #333; margin-bottom: 16rpx; }
.prompt-desc { font-size: 26rpx; color: #999; margin-bottom: 60rpx; }
.login-btn {
  width: 80%;
  background: linear-gradient(135deg, #667eea, #764ba2);
  color: #fff;
  border-radius: 50rpx;
  font-size: 30rpx;
  padding: 24rpx;
  line-height: 1.5;
}
</style>