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

<template>
  <view class="container">
    <!-- ===== 未登录状态 ===== -->
    <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="" />

    <!-- 富沛能量值 -->
    <view class="wealth-energy-header" v-if="isLoggedIn && wealthEnergy > 0">
      <text class="energy-header-icon">💧</text>
      <text class="energy-header-value">{{ wealthEnergy }}</text>
      <text class="energy-header-label">富沛能量</text>
      <text class="energy-header-trend" v-if="energyTrend > 0">↑较上周+{{ energyTrend }}</text>
    </view>

    <!-- 退出切换按钮（仅家长切换到孩子状态时显示） -->
    <view class="exit-switch" v-if="isSwitchedChild" @click="exitSwitch">
      <text>🔄 退出切换</text>
    </view>
    
    <view class="user-card">
      <view class="avatar">👤</view>
      <view class="user-info">
        <view class="nickname">{{ nickname || '未设置昵称' }}</view>
        <view class="role">{{ role === 'parent' ? '家长模式' : (role === 'child' ? '孩子模式' : '成长规划师模式') }}</view>
        <view class="system-points" v-if="role === 'parent' && children.length > 0">🏅 系统积分: {{ children[0].systemPoints || 0 }}</view>
        <view class="wealth-energy-row" v-if="wealthEnergy > 0">
          <text class="wealth-energy-icon">💧</text>
          <text class="wealth-energy-value">富沛能量: {{ wealthEnergy }}</text>
          <text class="wealth-energy-trend" v-if="energyTrend > 0"> ↑较上周+{{ energyTrend }}</text>
        </view>
      </view>
      <!-- 切换按钮仅在非切换状态下显示 -->
      <button class="btn-switch" v-if="!isSwitchedChild" @click="switchMode">切换</button>
    </view>

    <!-- 行动数据 -->
    <view class="section">
      <view class="section-header">
        <text class="section-title">🎯 行动数据</text>
      </view>
      <view class="wealth-card">
        <view class="wealth-item">
          <text class="wealth-value">{{ actionData.taskCount }}</text>
          <text class="wealth-label">完成任务</text>
        </view>
        <view class="wealth-divider"></view>
        <view class="wealth-item">
          <text class="wealth-value">{{ actionData.purchaseCount }}</text>
          <text class="wealth-label">购买商品</text>
        </view>
        <view class="wealth-divider"></view>
        <view class="wealth-item">
          <text class="wealth-value">{{ actionData.activityCount }}</text>
          <text class="wealth-label">参加活动</text>
        </view>
        <view class="wealth-divider"></view>
        <view class="wealth-item">
          <text class="wealth-value">{{ actionData.courseCount }}</text>
          <text class="wealth-label">学习课程</text>
        </view>
      </view>
    </view>

    <!-- 财富数据（推广收益） -->
    <view class="section">
      <view class="section-header">
        <text class="section-title">💰 财富数据</text>
        <text class="section-more" @click="goToPromotion">全部 ›</text>
      </view>
      <view class="wealth-card">
        <view class="wealth-item">
          <text class="wealth-value">{{ formatPriceWithSymbol(wealthData.totalEarnings) }}</text>
          <text class="wealth-label">累计收益</text>
        </view>
        <view class="wealth-divider"></view>
        <view class="wealth-item">
          <text class="wealth-value">{{ formatPriceWithSymbol(wealthData.availableAmount) }}</text>
          <text class="wealth-label">可提现</text>
        </view>
        <view class="wealth-divider"></view>
        <view class="wealth-item">
          <text class="wealth-value">{{ wealthData.referralCount }}</text>
          <text class="wealth-label">邀请人数</text>
        </view>
      </view>
      <view class="referral-code-bar" @click="copyReferralCode" v-if="wealthData.referralCode">
        <text class="referral-code-label">邀请码</text>
        <text class="referral-code-value">{{ wealthData.referralCode }}</text>
        <text class="referral-code-copy">复制</text>
      </view>
    </view>

    <!-- 成就徽章 -->
    <view class="section">
      <view class="section-header">
        <text class="section-title">🏅 成就徽章</text>
        <text class="section-more" @click="goAllBadges">全部 ›</text>
      </view>
      <view class="badge-grid">
        <view class="badge-item" v-for="badge in badges" :key="badge.id">
          <view :class="['badge-icon-wrap', badge.unlocked ? 'unlocked' : 'locked']">
            <text class="badge-icon">{{ badge.icon }}</text>
          </view>
          <text class="badge-name">{{ badge.name }}</text>
        </view>
      </view>
    </view>

    <!-- 成长报告 -->
    <view class="section">
      <view class="section-header">
        <text class="section-title">📈 成长报告</text>
        <text class="section-more" @click="goGrowthReport">查看 ›</text>
      </view>
      <view class="report-card" @click="goGrowthReport">
        <view class="report-stat-item">
          <text class="report-stat">{{ growthReport.monthActiveDays || 0 }}天</text>
          <text class="report-label">本月活跃</text>
        </view>
        <view class="report-divider"></view>
        <view class="report-stat-item">
          <text class="report-stat">{{ growthReport.totalTasks || 0 }}</text>
          <text class="report-label">累计任务</text>
        </view>
        <view class="report-divider"></view>
        <view class="report-stat-item">
          <text class="report-stat">{{ growthReport.completionRate || 0 }}%</text>
          <text class="report-label">完成率</text>
        </view>
      </view>
    </view>

    <view class="menu-list">
      <!-- ===== 个人 ===== -->
      <view class="menu-group">
        <view class="menu-group-title">── 个人 ──</view>
        <view class="menu-item" @click="goToEditInfo">
          <text>📝 修改个人资料</text>
          <text class="arrow">›</text>
        </view>
        <view class="menu-item" v-if="role === 'parent'" @click="goToChildren">
          <text>👶 我的孩子</text>
          <text class="arrow">›</text>
        </view>
        <view class="menu-item" v-if="role === 'parent'" @click="goToFamilyMembers">
          <text>👨‍👩‍👧‍👦 家庭成员</text>
          <text class="arrow">›</text>
        </view>
      </view>

      <!-- ===== 财富 ===== -->
      <view class="menu-group">
        <view class="menu-group-title">── 财富 ──</view>
        <view class="menu-item" @click="goToPromotion">
          <text>📢 推广中心</text>
          <text class="arrow">›</text>
        </view>
        <view class="menu-item" @click="goToPointsLogs">
          <text>📊 积分记录</text>
          <text class="arrow">›</text>
        </view>
      </view>

      <!-- ===== 服务 ===== -->
      <view class="menu-group">
        <view class="menu-group-title">── 服务 ──</view>
        <view class="menu-item" @click="goToMembership">
          <text>👑 会员中心</text>
          <text class="arrow">›</text>
        </view>
        <view class="menu-item" v-if="isVendor" @click="goToVendorCenter">
          <text>🏪 服务商中心</text>
          <text class="arrow">›</text>
        </view>
        <view class="menu-item" @click="goToOrders">
          <text>🛒 订单管理</text>
          <text class="arrow">›</text>
        </view>
      </view>

      <!-- ===== 设置 ===== -->
      <view class="menu-group">
        <view class="menu-group-title">── 设置 ──</view>
        <view class="menu-item" v-if="role === 'parent'" @click="showPasswordModal = true">
          <text>🔐 {{ hasPassword ? '重置密码' : '设置密码' }}</text>
          <text class="arrow">›</text>
        </view>
        <view class="menu-item menu-item-switch" v-if="role === 'parent'">
          <text>👁 对家庭成员可见</text>
          <switch :checked="showToFamily === 1" @change="onShowToFamilyChange" color="#5B9BD5" />
        </view>
        <view class="menu-item" @click="showInviteActionSheet">
          <text>📨 邀请加入</text>
          <text class="arrow">›</text>
        </view>
        <view class="menu-item" @click="logout">
          <text>🚪 退出登录</text>
          <text class="arrow">›</text>
        </view>
      </view>
    </view>

    <!-- 设置/重置密码弹窗 -->
    <view class="modal-mask" v-if="showPasswordModal" @click="showPasswordModal = false">
      <view class="modal" @click.stop>
        <view class="modal-title">{{ hasPassword ? '重置密码' : '设置密码' }}</view>
        <view class="form-item" v-if="hasPassword">
          <input v-model="oldPassword" type="number" password placeholder="输入旧密码" maxlength="6" />
        </view>
        <view class="form-item">
          <input v-model="newPassword" type="number" password placeholder="输入新密码" maxlength="6" />
        </view>
        <view class="form-item">
          <input v-model="confirmPassword" type="number" password placeholder="确认新密码" maxlength="6" />
        </view>
        <view class="modal-btns">
          <button @click="showPasswordModal = false">取消</button>
          <button class="btn-primary" @click="savePassword">确定</button>
        </view>
      </view>
    </view>
    </template>
  </view>
</template>

<script>
import PageBanner from '../../components/PageBanner.vue'
import { setPassword, verifyPassword, getChildren, vendorStatus, getEnergyOverview, getUserActionStats, getReferralCode, getReferralSummary, getCommissionSummary, updateMemberVisibility, getVisibleFamilyMembers, getUserBadges, getGrowthReport } from '../../utils/api.js'

export default {
  components: { PageBanner },
  data() {
    return {
      nickname: '',
      role: 'parent',
      hasPassword: false,
      showPasswordModal: false,
      oldPassword: '',
      newPassword: '',
      confirmPassword: '',
      children: [],
      isSwitchedChild: false,
      shareData: null,
      isVendor: false,
      showToFamily: 1,
      totalEnergy: null,
      wealthEnergy: 0,
      energyTrend: 0,
      badgesLoaded: false,
      badges: [
        { id: 1, icon: '\u{1F3C6}', name: '连续7天', unlocked: false },
        { id: 2, icon: '\u{2B50}', name: '积分达人', unlocked: false },
        { id: 3, icon: '\u{1F525}', name: '执行之星', unlocked: false },
        { id: 4, icon: '\u{1F31F}', name: '学习先锋', unlocked: false }
      ],
      actionData: {
        purchaseCount: 0,
        activityCount: 0,
        taskCount: 0,
        courseCount: 0
      },
      wealthData: {
        totalEarnings: '0.00',
        availableAmount: '0.00',
        referralCount: 0,
        referralCode: ''
      },
      growthReport: {
        monthActiveDays: 0,
        totalTasks: 0,
        completionRate: 0
      }
    }
  },
  computed: {
    isLoggedIn() {
      return !!uni.getStorageSync('token')
    }
  },
  onShareAppMessage() {
    if (this.shareData) {
      return {
        title: this.shareData.title,
        path: this.shareData.path,
        imageUrl: '/static/invite-card.png'
      }
    }
  },
  onShow() {
    if (!uni.getStorageSync('token')) return
    const currentRole = uni.getStorageSync('currentRole') || uni.getStorageSync('role') || 'parent'
    if (currentRole === 'teacher') {
      uni.redirectTo({ url: '/pages/teacher/teacher-profile' })
      return
    }
    var userInfo = uni.getStorageSync('userInfo')
    this.nickname = this.$store.state.nickname || (userInfo && userInfo.nickname) || ''
    // 使用 currentRole（视图角色），而非 role（实际角色）
    this.role = currentRole
    this.hasPassword = !!uni.getStorageSync('passwordSet')
    // 获取切换标记
    this.isSwitchedChild = uni.getStorageSync('isSwitchedChild') || false
    this.loadChildren()
    this.loadShowToFamily()
    this.checkVendorStatus()
    this.loadEnergyData()
    this.loadBadges()
    this.loadGrowthReport()
    this.loadActionData()
    this.loadWealthData()
  },
  methods: {
    goLogin() {
      uni.navigateTo({ url: '/pages/login/login' })
    },
    async loadChildren() {
      try {
        const res = await getChildren()
        this.children = res.data || []
      } catch (e) {
        console.error('获取孩子列表失败', e)
      }
    },
    async loadShowToFamily() {
      try {
        var uid = this.$store.state.userId || uni.getStorageSync('userId')
        var res = await getVisibleFamilyMembers()
        var members = res.data || []
        var self = members.find(function(m) { return m.id == uid })
        if (self) {
          this.showToFamily = self.showToFamily !== 0 ? 1 : 0
        }
      } catch (e) {
        console.error('获取可见性设置失败', e)
      }
    },
    goToEditInfo() {
      uni.navigateTo({ url: '/pages/user-edit/user-edit' })
    },
    goToChildren() {
      uni.navigateTo({ url: '/pages/profile/children' })
    },
    goToFamilyMembers() {
      uni.navigateTo({ url: '/pages/profile/family-members' })
    },
    goToPointsLogs() {
      uni.navigateTo({ url: '/pages/points/points' })
    },
    async onShowToFamilyChange(e) {
      var val = e.detail.value ? 1 : 0
      var uid = this.$store.state.userId || uni.getStorageSync('userId')
      try {
        await updateMemberVisibility(uid, 'parent', val)
        this.showToFamily = val
        uni.showToast({ title: val ? '已对家庭成员可见' : '已对家庭成员隐藏', icon: 'none' })
      } catch (e) {
        console.error('更新可见性失败', e)
        uni.showToast({ title: '操作失败', icon: 'none' })
      }
    },
    switchMode() {
      if (this.role === 'child') {
        this.verifyPasswordForSwitch(() => {
          this.doSwitchMode()
        })
      } else {
        this.doSwitchMode()
      }
    },
    doSwitchMode() {
      const newRole = this.role === 'parent' ? 'child' : 'parent'
      if (newRole === 'child') {
        if (this.children.length === 0) {
          this.loadChildren()
        }
        if (this.children.length === 0) {
          uni.showModal({
            title: '提示',
            content: '您还没有添加孩子，是否现在去添加？',
            success: (res) => {
              if (res.confirm) {
                uni.navigateTo({ url: '/pages/profile/create-child' })
              }
            }
          })
          return
        }
        if (this.children.length === 1) {
          this.$store.commit('switchToChild', this.children[0].id)
          this.role = newRole
          uni.showToast({ title: '已切换为孩子模式', icon: 'success' })
          return
        }
        uni.showActionSheet({
          itemList: this.children.map(c => c.nickname),
          success: (res) => {
            const selectedChild = this.children[res.tapIndex]
            this.$store.commit('switchToChild', selectedChild.id)
            this.role = newRole
            uni.showToast({ title: `已切换为${selectedChild.nickname}模式`, icon: 'success' })
          }
        })
        return
      }
      this.$store.commit('switchBackToParent')
      this.role = newRole
      uni.showToast({ title: `已切换为${newRole === 'parent' ? '家长' : '孩子'}模式`, icon: 'success' })
    },
    verifyPasswordForSwitch(callback) {
      uni.showModal({
        title: '验证密码',
        content: '请输入家长密码',
        editable: true,
        success: async (res) => {
          if (res.confirm && res.content) {
            try {
              const result = await verifyPassword(res.content)
              if (result.code === 200) {
                callback && callback()
              } else {
                uni.showToast({ title: '密码错误', icon: 'none' })
              }
            } catch (e) {
              uni.showToast({ title: '验证失败', icon: 'none' })
            }
          }
        }
      })
    },
    async savePassword() {
      if (this.newPassword.length !== 6) {
        uni.showToast({ title: '请输入6位密码', icon: 'none' })
        return
      }
      if (this.newPassword !== this.confirmPassword) {
        uni.showToast({ title: '两次密码不一致', icon: 'none' })
        return
      }
      if (this.hasPassword && this.oldPassword.length !== 6) {
        uni.showToast({ title: '请输入旧密码', icon: 'none' })
        return
      }
      try {
        if (this.hasPassword) {
          const verifyRes = await verifyPassword(this.oldPassword)
          if (verifyRes.code !== 200) {
            uni.showToast({ title: '旧密码错误', icon: 'none' })
            return
          }
        }
        await setPassword(this.newPassword)
        uni.setStorageSync('passwordSet', true)
        this.hasPassword = true
        uni.showToast({ title: '密码设置成功', icon: 'success' })
        this.showPasswordModal = false
        this.oldPassword = ''
        this.newPassword = ''
        this.confirmPassword = ''
      } catch (e) {
        console.error('设置密码失败', e)
      }
    },
    logout() {
      uni.showModal({
        title: '确认退出',
        content: '确定要退出登录吗？',
        success: (res) => {
          if (res.confirm) {
            this.$store.commit('logout')
            // 退出后返回首页 Tab（预登录状态，5 个底签可见）
            uni.reLaunch({ url: '/pages/index/index' })
          }
        }
      })
    },
    showInviteActionSheet: function() {
      var familyId = uni.getStorageSync('familyId')
      var userInfo = uni.getStorageSync('userInfo')
      if (!familyId) {
        uni.showToast({ title: '您暂未加入家庭', icon: 'none' })
        return
      }
      var items = ['👨‍👩‍👧‍👦 邀请家人', '👨‍🏫 邀请成长规划师']
      var types = ['family', 'guide']
      uni.showActionSheet({
        itemList: items,
        success: function(res) {
          this.inviteGenerate(types[res.tapIndex], familyId, userInfo)
        }.bind(this),
        fail: function() {}
      })
    },
    inviteGenerate: function(type, familyId, userInfo) {
      try {
        var inviteTypes = {
          family: { title: (userInfo && userInfo.nickname ? userInfo.nickname : '家人') + ' 邀请你加入家庭', path: '/pages/login/login?invite_type=family' },
          guide: { title: (userInfo && userInfo.nickname ? userInfo.nickname : '家长') + ' 邀请你成为家庭成长规划师', path: '/pages/login/login?invite_type=guide' }
        }
        var config = inviteTypes[type] || inviteTypes.family
        this.shareData = {
          title: config.title,
          path: config.path + '&invite_code=',
          imageUrl: '/static/invite-card.png'
        }
        uni.showToast({ title: '点击右上角转发给TA', icon: 'none' })
      } catch (e) {
        uni.showToast({ title: e.message || '邀请失败', icon: 'none' })
      }
    },
    goToMembership() {
      uni.showToast({ title: '即将上线', icon: 'none' })
    },
    goToVendorCenter() {
      uni.navigateTo({ url: '/pages/vendor/center' })
    },
    goToOrders() {
      uni.showToast({ title: '即将上线', icon: 'none' })
    },
    goToPromotion() {
      uni.navigateTo({ url: '/pages/promotion/index' })
    },
    loadEnergyData: function() {
      var childId = uni.getStorageSync('currentChildId') || null
      if (!childId) {
        if (this.children.length > 0) {
          childId = this.children[0].id
        }
      }
      if (!childId) return
      try {
        getEnergyOverview(childId).then(function(res) {
          if (res && res.data) {
            this.totalEnergy = res.data.totalEnergy || 0
            var dims = res.data.dimensions
            if (dims && dims.length > 0) {
              for (var i = 0; i < dims.length; i++) {
                if (dims[i].code === 'wealth') {
                  this.wealthEnergy = dims[i].score || 0
                  break
                }
              }
            }
          }
        }.bind(this))
      } catch (e) { console.log('获取能量概览失败', e) }
    },
    loadBadges: function() {
      var childId = uni.getStorageSync('currentChildId') || null
      if (!childId && this.children.length > 0) {
        childId = this.children[0].id
      }

      var defaultBadges = [
        { id: 1, icon: '\u{1F3C6}', name: '连续7天', unlocked: false },
        { id: 2, icon: '\u{2B50}', name: '积分达人', unlocked: false },
        { id: 3, icon: '\u{1F525}', name: '执行之星', unlocked: false },
        { id: 4, icon: '\u{1F31F}', name: '学习先锋', unlocked: false },
        { id: 5, icon: '\u{1F4AA}', name: '体能达人', unlocked: false },
        { id: 6, icon: '\u{1F9E0}', name: '心智成长', unlocked: false },
        { id: 7, icon: '\u{1F468}\u{200D}\u{1F469}\u{200D}\u{1F467}\u{200D}\u{1F466}', name: '家庭之星', unlocked: false },
        { id: 8, icon: '\u{1F4DA}', name: '阅读达人', unlocked: false },
        { id: 9, icon: '\u{1F3AF}', name: '全能冠军', unlocked: false }
      ]

      if (childId) {
        try {
          getUserBadges(childId).then(function(res) {
            if (res.code === 200 && res.data && res.data.length > 0) {
              var list = []
              for (var i = 0; i < res.data.length; i++) {
                var item = res.data[i]
                var b = item.badge || {}
                list.push({
                  id: b.id || i + 1,
                  icon: b.icon || '\u{2B50}',
                  name: b.name || '未知勋章',
                  unlocked: true
                })
              }
              while (list.length < 9) {
                var idx = list.length
                list.push({
                  id: defaultBadges[idx].id,
                  icon: defaultBadges[idx].icon,
                  name: defaultBadges[idx].name,
                  unlocked: false
                })
              }
              this.badges = list.slice(0, 9)
              this.badgesLoaded = true
              return
            }
            this.loadBadgesLocal(defaultBadges)
          }.bind(this)).catch(function() {
            this.loadBadgesLocal(defaultBadges)
          }.bind(this))
        } catch (e) {
          this.loadBadgesLocal(defaultBadges)
        }
      } else {
        this.loadBadgesLocal(defaultBadges)
      }
    },
    loadBadgesLocal: function(defaultBadges) {
      var streakDays = parseInt(uni.getStorageSync('streakDays') || 0)
      var totalPoints = parseInt(uni.getStorageSync('totalPoints') || 0)
      var completedTasks = parseInt(uni.getStorageSync('completedTasks') || 0)
      var badges = JSON.parse(JSON.stringify(defaultBadges))
      if (streakDays >= 7) badges[0].unlocked = true
      if (totalPoints >= 1000) badges[1].unlocked = true
      if (completedTasks >= 50) badges[2].unlocked = true
      if (totalPoints >= 500) badges[3].unlocked = true
      if (streakDays >= 30) badges[4].unlocked = true
      if (completedTasks >= 100) badges[8].unlocked = true
      this.badges = badges
      this.badgesLoaded = true
    },
    loadGrowthReport: function() {
      var childId = uni.getStorageSync('currentChildId') || null
      if (!childId && this.children.length > 0) {
        childId = this.children[0].id
      }
      if (!childId) {
        this.loadGrowthReportLocal()
        return
      }
      try {
        getGrowthReport(childId).then(function(res) {
          if (res.code === 200 && res.data) {
            var d = res.data
            this.growthReport.monthActiveDays = d.monthActiveDays || d.activeDays || 0
            this.growthReport.totalTasks = (d.taskStats && d.taskStats.total) || d.totalTasks || 0
            this.growthReport.completionRate = (d.taskStats && d.taskStats.completionRate) || d.completionRate || 0
          } else {
            this.loadGrowthReportLocal()
          }
        }.bind(this)).catch(function() {
          this.loadGrowthReportLocal()
        }.bind(this))
      } catch (e) {
        this.loadGrowthReportLocal()
      }
    },
    loadGrowthReportLocal: function() {
      var streakDays = parseInt(uni.getStorageSync('streakDays') || 0)
      var completedTasks = parseInt(uni.getStorageSync('completedTasks') || 0)
      this.growthReport.monthActiveDays = streakDays > 0 ? Math.min(streakDays, 30) : 0
      this.growthReport.totalTasks = completedTasks || 0
      this.growthReport.completionRate = 85
    },
    async loadActionData() {
      try {
        const res = await getUserActionStats()
        if (res.code === 200 && res.data) {
          this.actionData.purchaseCount = res.data.purchaseCount || 0
          this.actionData.activityCount = res.data.activityCount || 0
          this.actionData.taskCount = res.data.taskCount || 0
          this.actionData.courseCount = res.data.courseCount || 0
        }
      } catch (e) {
        // Fallback to local computed stats
        this.actionData.taskCount = parseInt(uni.getStorageSync('completedTasks') || 0)
        console.log('获取行动统计失败，使用本地数据', e)
      }
    },
    async loadWealthData() {
      try {
        const codeRes = await getReferralCode()
        if (codeRes.data) {
          this.wealthData.referralCode = codeRes.data.referralCode || codeRes.data.code || ''
        }
      } catch (e) { console.log('获取邀请码失败', e) }
      try {
        const summaryRes = await getReferralSummary()
        if (summaryRes.data) {
          this.wealthData.totalEarnings = summaryRes.data.totalEarnings || '0.00'
          this.wealthData.referralCount = summaryRes.data.referredCount || summaryRes.data.totalCount || 0
        }
      } catch (e) { console.log('获取邀请统计失败', e) }
      try {
        const comRes = await getCommissionSummary()
        if (comRes.data) {
          this.wealthData.availableAmount = comRes.data.availableAmount || '0.00'
        }
      } catch (e) { console.log('获取佣金总览失败', e) }
    },
    copyReferralCode() {
      if (!this.wealthData.referralCode) return
      uni.setClipboardData({
        data: this.wealthData.referralCode,
        success: () => { uni.showToast({ title: '邀请码已复制', icon: 'success' }) }
      })
    },
    goAllBadges() {
      uni.showToast({ title: '即将上线', icon: 'none' })
    },
    goGrowthReport() {
      var childId = uni.getStorageSync('currentChildId') || ''
      uni.navigateTo({ url: '/pages/growth/report?childId=' + childId })
    },
    async checkVendorStatus() {
      try {
        const res = await vendorStatus()
        this.isVendor = res.data && res.data.vendorStatus === 'approved'
      } catch (e) {
        this.isVendor = false
      }
    },
    exitSwitch() {
      if (!this.isSwitchedChild) return
      uni.showModal({
        title: '退出切换',
        content: '请输入家长密码以确认退出',
        editable: true,
        success: async (res) => {
          if (res.confirm && res.content) {
            try {
              const verifyResult = await verifyPassword(res.content)
              if (verifyResult.code === 200) {
                this.$store.commit('switchBackToParent')
                this.isSwitchedChild = false
                this.role = 'parent'
                uni.showToast({ title: '已退出切换', icon: 'success' })
                // 刷新首页
                uni.reLaunch({ url: '/pages/index/index' })
              } else {
                uni.showToast({ title: '密码错误', icon: 'none' })
              }
            } catch (e) {
              uni.showToast({ title: '验证失败', icon: 'none' })
            }
          }
        }
      })
    }
  }
}
</script>

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

/* ===== 通用区块 ===== */
.section {
  margin: 20rpx 30rpx;
}
.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20rpx;
}
.section-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
}
.section-more {
  font-size: 24rpx;
  color: #999;
}

/* ===== 推广邀请码 ===== */
.referral-code-bar {
  display: flex;
  align-items: center;
  background: #fff;
  border-radius: 16rpx;
  padding: 20rpx 24rpx;
  margin-top: 16rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
}
.referral-code-label {
  font-size: 26rpx;
  color: #999;
  margin-right: 16rpx;
}
.referral-code-value {
  flex: 1;
  font-size: 28rpx;
  font-weight: bold;
  color: #F97316;
  letter-spacing: 4rpx;
}
.referral-code-copy {
  font-size: 24rpx;
  color: #5B9BD5;
  padding: 4rpx 16rpx;
  border: 1rpx solid #5B9BD5;
  border-radius: 8rpx;
}

/* ===== 行动数据（推广收益） ===== */
.wealth-card {
  background: #fff;
  border-radius: 20rpx;
  padding: 30rpx 20rpx;
  display: flex;
  align-items: center;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
}
.wealth-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.wealth-value {
  font-size: 40rpx;
  font-weight: bold;
  color: #F97316;
}
.wealth-label {
  font-size: 24rpx;
  color: #999;
  margin-top: 8rpx;
}
.wealth-divider {
  width: 1rpx;
  height: 60rpx;
  background: #f0f0f0;
}

/* ===== 成就徽章 ===== */
.badge-grid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  background: #fff;
  border-radius: 20rpx;
  padding: 24rpx 16rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
  justify-content: flex-start;
}
.badge-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 33.33%;
  margin-bottom: 20rpx;
}
.badge-icon-wrap {
  width: 72rpx;
  height: 72rpx;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8rpx;
}
.badge-icon-wrap.unlocked {
  background: linear-gradient(135deg, #FBBF24, #F97316);
}
.badge-icon-wrap.locked {
  background: #f0f0f0;
  opacity: 0.5;
}
.badge-icon {
  font-size: 36rpx;
}
.badge-name {
  font-size: 22rpx;
  color: #666;
}

/* ===== 成长报告 ===== */
.report-card {
  background: #fff;
  border-radius: 20rpx;
  padding: 30rpx 20rpx;
  display: flex;
  align-items: center;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
}
.report-stat-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.report-stat {
  font-size: 36rpx;
  font-weight: bold;
  color: #5B9BD5;
}
.report-label {
  font-size: 22rpx;
  color: #999;
  margin-top: 6rpx;
}
.report-divider {
  width: 1rpx;
  height: 50rpx;
  background: #f0f0f0;
}
/* ===== 富沛能量值条 ===== */
.wealth-energy-header {
  background: linear-gradient(135deg, #42A5F5, #64B5F6);
  padding: 16rpx 30rpx;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.energy-header-icon {
  font-size: 36rpx;
  margin-right: 12rpx;
}
.energy-header-value {
  font-size: 40rpx;
  font-weight: bold;
  color: #fff;
  margin-right: 12rpx;
}
.energy-header-label {
  font-size: 26rpx;
  color: #D6EAF8;
  margin-right: auto;
}
.energy-header-trend {
  font-size: 24rpx;
  color: #4ADE80;
  font-weight: 500;
}

.user-card {
  background: linear-gradient(135deg, #5B9BD5 0%, #3A7CC4 100%);
  border-radius: 20rpx;
  padding: 40rpx;
  display: flex;
  align-items: center;
  color: #fff;
}
.avatar {
  font-size: 80rpx;
  margin-right: 30rpx;
}
.user-info {
  flex: 1;
}
.nickname {
  font-size: 36rpx;
  font-weight: bold;
}
.role {
  font-size: 24rpx;
  opacity: 0.8;
}
.system-points {
  font-size: 22rpx;
  color: #D6EAF8;
  margin-top: 8rpx;
  font-weight: 500;
}
.wealth-energy-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 8rpx;
}
.wealth-energy-icon {
  font-size: 24rpx;
  margin-right: 8rpx;
}
.wealth-energy-value {
  font-size: 24rpx;
  color: #D6EAF8;
  font-weight: 500;
}
.wealth-energy-row .wealth-energy-trend {
  font-size: 22rpx;
  color: #4ADE80;
  margin-left: 8rpx;
}
.btn-switch {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 24rpx;
  padding: 10rpx 20rpx;
  border-radius: 20rpx;
}
/* ===== 功能菜单分组 ===== */
.menu-group {
  margin-top: 20rpx;
}
.menu-group-title {
  font-size: 24rpx;
  color: #ccc;
  text-align: center;
  padding: 12rpx 0;
  letter-spacing: 4rpx;
}

.menu-list {
  margin-top: 30rpx;
  background: #fff;
  border-radius: 16rpx;
}
.menu-item {
  padding: 30rpx;
  border-bottom: 1rpx solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  font-size: 28rpx;
}
.menu-item:last-child {
  border-bottom: none;
}
.arrow {
  color: #ccc;
  font-size: 32rpx;
}
.menu-item-btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 28rpx 24rpx;
  border: none;
  background: transparent;
  font-size: 28rpx;
  color: #333;
}
.menu-item-btn::after { border: none; }
.menu-item-switch {
  align-items: center;
}
.modal-mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal {
  background: #fff;
  border-radius: 20rpx;
  padding: 40rpx;
  width: 80%;
}
.modal-title {
  font-size: 32rpx;
  font-weight: bold;
  margin-bottom: 30rpx;
  text-align: center;
}
.form-item {
  margin-bottom: 20rpx;
}
.form-item input {
  border: 1rpx solid #ddd;
  border-radius: 10rpx;
  padding: 20rpx;
  font-size: 28rpx;
}
.modal-btns {
  display: flex;
  gap: 20rpx;
  margin-top: 30rpx;
}
.modal-btns button {
  flex: 1;
}

/* ===== 未登录提示 ===== */
.login-prompt {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 80vh;
  padding: 60rpx;
}
.prompt-icon {
  font-size: 120rpx;
  margin-bottom: 30rpx;
  width: 160rpx;
  height: 160rpx;
  line-height: 160rpx;
  text-align: center;
  background: #f5f5f5;
  border-radius: 50%;
}
.prompt-title {
  font-size: 36rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 16rpx;
}
.prompt-desc {
  font-size: 26rpx;
  color: #999;
  text-align: center;
  margin-bottom: 40rpx;
}
.login-prompt .login-btn {
  width: 60%;
  height: 80rpx;
  line-height: 80rpx;
  background: linear-gradient(135deg, #5B9BD5, #3A7CC4);
  color: #fff;
  font-size: 30rpx;
  font-weight: bold;
  border-radius: 40rpx;
  text-align: center;
  border: none;
}
.login-prompt .login-btn::after {
  border: none;
}
</style>