cfc/cfc-frontend/pages/mind-detail/index.vue

<template>
  <view class="container">
    <!-- Tabbar 切换过渡页 -->
    <tab-transition v-if="showTabTransition" dimCode="mind" ref="tabTransition" @close="showTabTransition = false" />

    <!-- 品牌头部 -->
    <PageBanner theme="mind-wisdom"
      tagline="心智成长 · 智慧人生"
      quote="知己知彼，百战不殆" />

    <!-- ===== 家庭天盘模块（今日运势 / 今日心情 / 吉位） ===== -->
    <FamilyTianpanCard
      v-if="isLoggedIn"
      :visible="isLoggedIn"
      :fortune="dailyFortuneSafe"
      :mood="todayMood"
      :dominantElement="dominantElementSafe"
      :weeklyTip="familyWeeklyInsight"
      :traditionalData="traditionalData" />

    <!-- 家庭成员选择条 -->
    <FamilyMemberStrip
      v-if="isLoggedIn"
      :members="familyMembersVisible"
      :selectedMemberId="selectedMemberId"
      @select="onFamilyMemberSelect"
      @removed="loadFamilyMembersVisible" />

    <!-- 游客登录引导卡 -->
    <template v-if="!isLoggedIn">
      <LoginGuideCard
        title="登录后查看心理成长报告"
        :items="[
          '查看EMI心理测评四维分析',
          '查看大五人格分析报告',
          '阅读专属文章、参与情绪打卡'
        ]" />
    </template>

        <!-- 登录后：五维能量条 -->
        <view v-if="hasFamily">
          <FamilyEnergyBar
            v-if="isLoggedIn"
            dimensionCode="mind"
            :sandboxData="sandboxData" />
        </view>
        <view v-else>
          <FamilyEmptyState type="card" />
        </view>

        <!-- 心理报告卡片（登录后可见） -->
        <view v-if="hasFamily">
          <view class="emi-card" v-if="isLoggedIn && emiData">
            <view class="emi-header">
              <text class="emi-title">心理测评报告</text>
              <view class="emi-overall-wrap">
                <text class="emi-overall-label">综合EQ分</text>
                <text class="emi-overall-value">{{ emiData.overallScore || 0 }}</text>
                <text :class="['emi-overall-level', 'level-' + getScoreLevel(emiData.overallScore || 0)]">
                  {{ getScoreLevelText(emiData.overallScore || 0) }}
                </text>
              </view>
            </view>
            <view class="emi-dimensions">
              <view class="emi-dimension" v-for="dim in emiDimensions" :key="dim.key">
                <view class="emi-dim-header">
                  <text class="emi-dim-label">{{ dim.label }}</text>
                  <view class="emi-dim-values">
                    <text class="emi-dim-score">{{ emiData[dim.key] || 0 }}</text>
                    <text :class="['emi-dim-level', 'level-' + getScoreLevel(emiData[dim.key] || 0)]">
                      {{ getScoreLevelText(emiData[dim.key] || 0) }}
                    </text>
                  </view>
                </view>
                <view class="emi-dim-bar">
                  <view class="emi-dim-bar-fill" :style="{ width: (emiData[dim.key] || 0) + '%', background: dim.color }"></view>
                </view>
              </view>
            </view>
            <view class="emi-footer" @click="goEmotionReport">
              <text class="emi-footer-text">查看详情</text>
              <text class="emi-footer-icon">&#x2192;</text>
            </view>
          </view>
        </view>
        <view v-else>
          <FamilyEmptyState type="card" />
        </view>

        <!-- 肠脑轴情绪卡片 -->
        <view v-if="hasFamily">
          <view class="section" v-if="gutIndicators && gutIndicators.length > 0">
            <view class="section-header">
              <text class="section-title">&#x1F9E0; 肠脑情绪关联</text>
            </view>
            <view class="gut-insight-text" v-if="gutInsight">
              <text>{{ gutInsight }}</text>
            </view>
            <view class="gut-indicator-list">
              <view class="gut-indicator-item" v-for="ind in gutIndicators" :key="ind.id">
                <view class="gut-indicator-left">
                  <text class="gut-indicator-name">{{ ind.indicatorName || ind.name }}</text>
                </view>
                <view class="gut-indicator-bar-track">
                  <view class="gut-indicator-bar-fill" :style="{ width: (ind.value || 0) + '%', background: indicatorColor(ind.status) }"></view>
                </view>
                <text class="gut-indicator-value">{{ ind.value }}{{ ind.unit || '%' }}</text>
                <text :class="['gut-indicator-status', 'status-' + (ind.status || 'normal')]">{{ statusLabel(ind.status) }}</text>
              </view>
            </view>
          </view>
        </view>
        <view v-else>
          <FamilyEmptyState type="card" />
        </view>

    

    

    <!-- ===== Phase 1.2: 心理告警横幅 ===== -->
    <PsychCrisisBanner v-if="isLoggedIn" :memberId="currentChildId" source="screening" />

    <!-- ===== 底部：功能入口 Grid（通用，两行） ===== -->
    <view class="func-section" v-if="sectionVisible('func_entries')">
      <view class="func-grid">
        <view class="func-row">
          <view class="func-item" v-for="item in funcListRow1" :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 class="func-row">
          <view class="func-item" v-for="item in funcListRow2" :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 class="bottom-spacer"></view>
    <AIFloatingAvatar />
  </view>
</template>

<script>
import TabTransition from '../../components/tab-transition.vue'
import PageBanner from '../../components/PageBanner.vue'
import LoginGuideCard from '../../components/LoginGuideCard.vue'
import RadarChart from '../../components/RadarChart.vue'
import FamilyEnergyBar from '../../components/FamilyEnergyBar.vue'
import PsychCrisisBanner from '../../components/PsychCrisisBanner.vue'
import AIFloatingAvatar from '../../components/AIFloatingAvatar.vue'
import FamilyTianpanCard from '../../components/FamilyTianpanCard.vue'
import FamilyMemberStrip from '../../components/FamilyMemberStrip.vue'
import { getVisibleSections, getFamilyEnergySandbox, getChildren, getVisibleFamilyMembers, getEnergyOverview, getContactList, getHealthAlerts, getMilestones, getDanReportByChild, getFamilyFortune } from '../../utils/api.js'
import config from '../../config.js'
import { parseDate } from '../../utils/format.js'

export default {
components: { TabTransition, PageBanner, RadarChart, LoginGuideCard, FamilyEnergyBar, PsychCrisisBanner, AIFloatingAvatar, FamilyTianpanCard, FamilyMemberStrip },
  data() {
    return {
      isLoggedIn: false,
      role: null,
      showTabTransition: true,
      currentChildId: null,
      selectedMemberId: null,
      visibleSections: [],
      familyMembersVisible: [],

      // 心理 Tab 数据
      emiData: null,
      emiLoading: true,
      emiDimensions: [
        { key: 'emotionScore', label: '情绪商数', color: '#FF6B35' },
        { key: 'resilienceScore', label: '心理韧性', color: '#F97316' },
        { key: 'stressCopingScore', label: '压力应对', color: '#FB923C' },
        { key: 'selfAwarenessScore', label: '自我认知', color: '#FBBF24' }
      ],
      // 大五维度（用于雷达图）
      personalityDimensions: [
        { key: 'opennessScore', label: '开放性' },
        { key: 'conscientiousnessScore', label: '尽责性' },
        { key: 'extraversionScore', label: '外向性' },
        { key: 'agreeablenessScore', label: '宜人性' },
        { key: 'neuroticismScore', label: '神经质' }
      ],

      // 功能入口
      funcList: [
        { icon: '\u{1F4D6}', label: '阅读', needLogin: false, page: '/pages/mind-extra/articles' },
        { icon: '\u{1F4CA}', label: '测评报告', needLogin: true, page: '/pages/mind/emotion-report' },
        { icon: '\u{1F4DD}', label: '成长档案', needLogin: true, page: '/pages/growth-main/index' },
        { icon: '\u{2728}', label: '情绪打卡', needLogin: true, page: '/pages/mind-detail/emotion-checkin' },
        { icon: '\u{1F4C8}', label: '情绪趋势', needLogin: true, page: '/pages/mind-detail/emotion-trend' },
        { icon: '\u{1F9E9}', label: '心理自评', needLogin: true, page: '/pages/mind-detail/screening' },
        { icon: '\u{1F3E0}', label: '家庭天盘', needLogin: true, page: '/pages/mind-detail/family-dashboard' },
        { icon: '\u{1F9D8}', label: '疏导工具', needLogin: true, page: '/pages/mind-detail/soothe-toolbox' }
      ],
      articles: [],

      // 肠脑轴数据
      gutIndicators: null,
      gutInsight: '',

      // 传统文化数据
      traditionalData: null,
      traditionalLoading: true,
      compatibilityData: null,
      wuxingConfig: {
        wood: { label: '木', color: '#10B981' },
        fire: { label: '火', color: '#FF6B9D' },
        earth: { label: '土', color: '#FF8C42' },
        metal: { label: '金', color: '#6366F1' },
        water: { label: '水', color: '#3B82F6' }
      },
      pillarLabels: { year: '年柱', month: '月柱', day: '日柱', hour: '时柱' },
      familyScore: 0,

      // 五维组件数据
      userName: '',
      children: [],
      sandboxData: null,
      contactList: [],
      healthAlerts: [],
      milestones: [],
      danReports: [],

    // 家庭天盘 - 今日心情（占位数据）
    todayMood: {
        emoji: '\u{1F60A}',
        text: '平静',
        score: 65
    },
    
    // 家庭天盘 - 每日运势数据
    dailyFortuneData: null
    }
  },
  computed: {
    hasFamily: function() {
      // 应急修复（2026-08-07，对齐 body/index.vue）：store.familyId 在 familyId 后端派生改造后
      // 不再被写入，hasFamily 恒为 false 导致内容区被 v-else 空态吞掉。
      // 后端所有登录路径均兜底自动创建家庭（UserService.ensureUserHasFamily），
      // 故登录用户视为有家庭，内容区由内部组件基于接口数据自行渲染。
      return this.isLoggedIn
    },
    personalityScores: function() {
      if (!this.emiData) return []
      return [
        this.emiData.opennessScore || 0,
        this.emiData.conscientiousnessScore || 0,
        this.emiData.extraversionScore || 0,
        this.emiData.agreeablenessScore || 0,
        this.emiData.neuroticismScore || 0
      ]
    },
    emotionArticles: function() {
      if (!this.articles || this.articles.length === 0) return []
      var result = []
      for (var i = 0; i < this.articles.length; i++) {
        var a = this.articles[i]
        if (a.relatedDimensions && a.relatedDimensions.indexOf('mind') !== -1) {
          result.push(a)
        }
      }
      if (result.length === 0) return this.articles.slice(0, 5)
      return result.slice(0, 5)
    },
    wuxingData: function() {
      if (!this.traditionalData || !this.traditionalData.wuxingElements) return []
      var elements = this.traditionalData.wuxingElements
      var keys = ['wood', 'fire', 'earth', 'metal', 'water']
      var result = []
      for (var i = 0; i < keys.length; i++) {
        var k = keys[i]
        if (elements[k] !== undefined) {
          result.push({
            key: k,
            label: this.wuxingConfig[k].label,
            color: this.wuxingConfig[k].color,
            value: elements[k]
          })
        }
      }
      return result.sort(function(a, b) { return b.value - a.value })
    },
    currentDimensionCode: function() {
      return 'mind'
    },
    funcListRow1: function() {
      return this.funcList.slice(0, 4)
    },
    funcListRow2: function() {
      return this.funcList.slice(4)
    },
    // ===== 关键信息 - 家庭 =====
    familyWuxingLabel: function() {
      if (!this.compatibilityData || !this.compatibilityData.familyWuxing || !this.compatibilityData.familyWuxing.aggregatePercentages) return null
      var pcts = this.compatibilityData.familyWuxing.aggregatePercentages
      var keys = ['wood', 'fire', 'earth', 'metal', 'water']
      var maxKey = null
      var maxVal = -1
      for (var i = 0; i < keys.length; i++) {
        if (pcts[keys[i]] !== undefined && pcts[keys[i]] > maxVal) {
          maxVal = pcts[keys[i]]
          maxKey = keys[i]
        }
      }
      if (!maxKey) return null
      return { key: maxKey, label: this.wuxingConfig[maxKey].label, color: this.wuxingConfig[maxKey].color, value: maxVal }
    },
    familyMemberCount: function() {
      if (!this.compatibilityData || !this.compatibilityData.members) return 0
      return this.compatibilityData.members.length
    },
    familyWeeklyInsight: function() {
      if (!this.compatibilityData || !this.compatibilityData.weeklyInsight) return ''
      return this.compatibilityData.weeklyInsight
    },
    // ===== 关键信息 - 个人 =====
    dominantElement: function() {
      if (!this.traditionalData || !this.traditionalData.wuxingElements) return null
      var elements = this.traditionalData.wuxingElements
      var keys = ['wood', 'fire', 'earth', 'metal', 'water']
      var maxKey = null
      var maxVal = -1
      for (var i = 0; i < keys.length; i++) {
        if (elements[keys[i]] !== undefined && elements[keys[i]] > maxVal) {
          maxVal = elements[keys[i]]
          maxKey = keys[i]
        }
      }
      return maxKey
    },
    luckyColorInfo: function() {
      var colorMap = {
        wood: { name: '绿', hex: '#10B981' },
        fire: { name: '红', hex: '#FF6B9D' },
        earth: { name: '黄', hex: '#FF8C42' },
        metal: { name: '白', hex: '#6366F1' },
        water: { name: '蓝', hex: '#3B82F6' }
      }
      var elem = this.dominantElement
      if (!elem) return null
      return colorMap[elem] || null
    },
    luckyNumber: function() {
      if (this.traditionalData && this.traditionalData.lifeNumber) {
        return this.traditionalData.lifeNumber
      }
      var numMap = { wood: 3, fire: 9, earth: 5, metal: 7, water: 1 }
      var elem = this.dominantElement
      return elem ? numMap[elem] : null
    },
    fortuneSeed: function() {
      if (this.traditionalData && this.traditionalData.lifeNumber) {
        return String(this.traditionalData.lifeNumber)
      }
      return '0'
    },
    // WXML 不支持模板内 || {} 字面量，需在 computed 中预先做 fallback
    dailyFortuneSafe: function() {
      return this.dailyFortune || {}
    },
    // WXML 不支持模板内 || '' 字面量，需在 computed 中预先做 fallback
    dominantElementSafe: function() {
      return this.dominantElement || ''
    },
    dailyFortune: function() {
        // 优先使用后端接口数据
        if (this.dailyFortuneData) {
            var levels = ['大吉', '吉', '平', '凶', '大凶']
            return {
                level: this.dailyFortuneData.level,
                text: levels[this.dailyFortuneData.level],
                description: this.dailyFortuneData.description
            }
        }
        // 兼容模式：没有接口数据时使用原算法
        if (!this.dominantElement) return null
        var today = new Date()
        var dateStr = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate()
        var seedStr = dateStr + (this.fortuneSeed || '')
        var hash = 0
        for (var i = 0; i < seedStr.length; i++) {
            hash = ((hash << 5) - hash) + seedStr.charCodeAt(i)
            hash = hash & hash
        }
        var level = Math.abs(hash) % 5
        var levels = ['大吉', '吉', '平', '凶', '大凶']
        var descMap = {
            wood: ['大吉：木气旺盛，宜规划', '吉：行动力强', '平：静心养性', '凶：谨言慎行', '大凶：忌冲动'],
            fire: ['大吉：热情高涨', '吉：精力充沛', '平：适当休息', '凶：注意情绪', '大凶：静心冥想'],
            earth: ['大吉：稳重踏实', '吉：贵人运佳', '平：按部就班', '凶：注意肠胃', '大凶：不宜投资'],
            metal: ['大吉：决策力强', '吉：思维清晰', '平：保持专注', '凶：注意言辞', '大凶：不宜强求'],
            water: ['大吉：灵感丰富', '吉：人际和谐', '平：安静内省', '凶：情绪波动', '大凶：宜藏不宜放']
        }
        var descList = descMap[this.dominantElement] || descMap.wood
        return { level: level, text: levels[level], description: descList[level] }
    }
  },
  onShow() {
    this.showTabTransition = true

    var token = uni.getStorageSync('token')
    this.isLoggedIn = !!token
    if (this.isLoggedIn) {
      this.role = uni.getStorageSync('currentRole') || uni.getStorageSync('role') || null
      // FIX: 从 Vuex store 读取 currentChildId，而非仅从 localStorage
      this.currentChildId = (this.$store.state && this.$store.state.currentChildId) || uni.getStorageSync('currentChildId') || null
      this.userName = uni.getStorageSync('nickname') || uni.getStorageSync('userName') || '家长'
    }
    this.loadSectionConfig()
    if (this.isLoggedIn) {
      this.loadChildren()
      this.loadFamilyMembersVisible()
      this.loadSandboxData()
      this.loadEmiData()
      this.loadGutData()
      this.loadEnergyData()
      this.loadTraditionalCultureData()
      this.loadContacts()
      this.loadHealthAlerts()
      this.loadMilestones()
      this.loadDanReports()
    }
    // 游客也能浏览活动和商品
    this.loadFamilyFortune()
    this._watchPageReady()
  },
  methods: {
    // ===== 区块可见性 =====
    loadSectionConfig: function() {
      var self = this
      var baseSections = ['func_entries', 'daily_tip', 'recommended_reading']
      if (!uni.getStorageSync('token')) {
        self.visibleSections = baseSections
        return
      }
      var role = uni.getStorageSync('currentRole') || uni.getStorageSync('role') || null
      getVisibleSections({ pageKey: 'mind', role: role }).then(function(res) {
        if (res.code === 200 && res.data) {
          var keys = res.data.map(function(s) { return s.sectionKey })
          var merged = baseSections.slice()
          keys.forEach(function(k) { if (merged.indexOf(k) === -1) merged.push(k) })
          self.visibleSections = merged
        }
      }).catch(function() {
        self.visibleSections = ['func_entries', 'daily_tip', 'recommended_reading', 'mind_tasks', 'related_activities', 'purchased_courses']
        })
    },

    // 加载家庭天盘数据
    loadFamilyFortune: function() {
        var self = this
        if (!self.isLoggedIn) return
        
        getFamilyFortune().then(function(res) {
            if (res.code === 200 && res.data) {
                // 更新 todayMood 占位数据为真实接口数据
                self.todayMood = {
                    emoji: res.data.moodEmoji || '\u{1F60A}',
                    text: res.data.moodText || '平静',
                    score: res.data.moodScore || 65
                }
                // 更新 dailyFortune computed 函数依赖的数据
                self.dailyFortuneData = {
                    level: res.data.fortuneLevel,
                    text: res.data.fortuneLevelText,
                    description: res.data.fortuneDescription
                }
                // 更新主导五行
                self.traditionalData = self.traditionalData || {}
                self.traditionalData.wuxingElements = {}
                if (res.data.dominantElement) {
                    self.traditionalData.wuxingElements[res.data.dominantElement] = 100
                }
                // 更新周报提示
                self.compatibilityData = self.compatibilityData || {}
                self.compatibilityData.weeklyInsight = res.data.weeklyTip || self.compatibilityData.weeklyInsight
            }
        }).catch(function(err) {
            console.error('Failed to load family fortune:', err)
        })
    },

    viewReport: function(report) {
      if (report && report.fileUrl) {
        uni.downloadFile({
          url: report.fileUrl,
          success: function(res) {
            if (res.statusCode === 200) {
              uni.openDocument({
                filePath: res.tempFilePath,
                success: function() {
                  console.log('打开报告成功')
                }
              })
            }
          }
        })
      }
    },

    formatDate: function(dateStr) {
      if (!dateStr) return ''
      var d = parseDate(dateStr)
      if (!d) return ''
      var month = d.getMonth() + 1
      var day = d.getDate()
      return month + '月' + day + '日'
    },

    sectionVisible: function(key) {
      return this.visibleSections.length === 0 || this.visibleSections.indexOf(key) !== -1
    },

    // ===== 心理 Tab：EMI 数据 =====
    loadEmiData: function() {
      var self = this
      var memberId = self.currentChildId
      if (!memberId) {
        self.emiLoading = false
        return
      }
      self.emiLoading = true
      getEmiReport(memberId).then(function(res) {
        if (res.code === 200 && res.data) {
          self.emiData = res.data
        }
        self.emiLoading = false
      }).catch(function() {
        self.emiLoading = false
      })
    },

    // ===== 肠脑轴情绪指标 =====
    loadGutData: function() {
      var self = this
      var memberId = self.currentChildId
      if (!memberId) return
      var token = uni.getStorageSync('token')
      // 获取神经递质指标
      uni.request({
        url: config.API_BASE_URL + '/api/mind/neurotransmitters',
        method: 'POST',
        header: { 'Content-Type': 'application/json', 'Authorization': 'Bearer ' + token },
        data: { memberId: memberId },
        success: function(r) {
          if (r.statusCode === 200 && r.data && r.data.code === 200) {
            var list = r.data.data
            if (Array.isArray(list) && list.length > 0) {
              self.gutIndicators = list.slice(0, 4)
            }
          }
        }
      })
      // 获取情绪洞察摘要
      uni.request({
        url: config.API_BASE_URL + '/api/mind/gut-emotion-insight',
        method: 'POST',
        header: { 'Content-Type': 'application/json', 'Authorization': 'Bearer ' + token },
        data: { memberId: memberId },
        success: function(r) {
          if (r.statusCode === 200 && r.data && r.data.code === 200 && r.data.data) {
            self.gutInsight = r.data.data.summary || ''
          }
        }
      })
    },
    indicatorColor: function(status) {
      if (status === 'abnormal' || status === '偏高' || status === '偏低') return '#EF4444'
      if (status === 'warning' || status === '偏高' || status === '偏低') return '#F59E0B'
      return '#10B981'
    },
    statusLabel: function(status) {
      if (status === 'normal') return '正常'
      if (status === 'abnormal') return '异常'
      if (status === 'warning') return '警讯'
      return status || '正常'
    },

    // ===== EMI 分数评级 =====
    getScoreLevel: function(score) {
      if (score >= 85) return 'excellent'
      if (score >= 70) return 'good'
      if (score >= 55) return 'average'
      return 'low'
    },
    getScoreLevelText: function(score) {
      if (score >= 85) return '优秀'
      if (score >= 70) return '良好'
      if (score >= 55) return '一般'
      return '需提升'
    },

    // ===== 导航 =====
    goEmotionReport: function() {
      var memberId = this.currentChildId || ''
      uni.navigateTo({ url: '/pages/mind-detail/emotion-report?memberId=' + memberId })
    },
    goArticles: function() {
      uni.navigateTo({ url: '/pages/article-center/index?dimension=mind' })
    },
    onFuncClick: function(item) {
      if (item.needLogin && !this.isLoggedIn) {
        uni.showModal({
          title: '提示',
          content: '请先登录后使用此功能',
          success: function(res) { if (res.confirm) uni.navigateTo({ url: '/pages/login/login' }) }
        })
        return
      }
      if (item.page) uni.navigateTo({ url: item.page })
    },
    // ===== 孩子列表与维度数据 =====
    loadChildren: function() {
      var self = this
      getChildren().then(function(res) {
        if (res.code === 200 && res.data) {
          self.children = res.data
          var savedChildId = uni.getStorageSync('currentChildId')
          var found = false
          for (var i = 0; i < self.children.length; i++) {
            if (self.children[i].memberId === savedChildId) {
              self.currentChildId = savedChildId
              found = true
              break
            }
          }
          // FIX: 不再自动选择第一个孩子。仅在用户通过 UserQuickEntry 切换时设置 currentChildId
          if (found) {
            self.loadDimensionData()
            self.loadEmiData()
          }
        }
      }).catch(function(e) {
        console.log('获取孩子列表失败', e)
      })
    },
    loadDimensionData: function() {
      if (this.familyMembersVisible.length > 0) {
        this.loadCompatibilityData()
      }
    },
    loadSandboxData: function() {
      var self = this
      getFamilyEnergySandbox().then(function(res) {
        if (res && res.data) {
          self.sandboxData = res.data
        }
      }).catch(function() {})
    },
    loadEnergyData: function() {
      var self = this
      if (!this.currentChildId) return
      getEnergyOverview(this.currentChildId).then(function(res) {
        if (res && res.data) {
          var dims = res.data.dimensions
          if (dims && dims.length > 0) {
            for (var i = 0; i < dims.length; i++) {
              if (dims[i] && dims[i].code === 'mind' && res.data.energyScores) {
                self.familyScore = res.data.energyScores.mindScore || 0
              }
            }
          }
        }
      }).catch(function(e) {
        console.log('获取能量概览失败', e)
      })
    },
    onFamilyMemberSelect: function(member) {
      this.selectedMemberId = member.id
    },
    onChildChanged: function(child) {
      this.currentChildId = child.memberId
      // FIX: 同步提交到 Vuex store
      this.$store.commit('switchToChild', child.memberId)
      this.loadDimensionData()
      this.loadEmiData()
      this.loadTraditionalCultureData()
    },
    loadFamilyMembersVisible: function() {
      var self = this
      getVisibleFamilyMembers().then(function(res) {
        self.familyMembersVisible = res.data || []
      }).catch(function(e) {
        console.log('获取可见家庭成员失败', e)
        self.familyMembersVisible = []
      })
    },
    loadCompatibilityData: function() {
      var self = this
      var token = uni.getStorageSync('token')
      uni.request({
        url: config.API_BASE_URL + '/api/mind/traditional/family-dashboard',
        method: 'POST',
        header: { 'Content-Type': 'application/json', 'Authorization': 'Bearer ' + token },
        data: {},
        success: function(res) {
          if (res.data && res.data.code === 200 && res.data.data) {
            self.compatibilityData = res.data.data
          }
        },
        fail: function() {}
      })
    },
    scrollToSection: function(section) {
      uni.pageScrollTo({ selector: '#' + section, duration: 300 })
    },
    goAssessment: function() { uni.navigateTo({ url: '/pages/assessment/apply' }) },
    goLogin: function() { uni.navigateTo({ url: '/pages/login/login' }) },

    // ===== 传统文化数据 =====
    // ===== 联系人 / 关系健康 =====
    loadContacts: function() {
      var self = this
      getContactList({}).then(function(res) {
        if (res.code === 200) {
          self.contactList = Array.isArray(res.data) ? res.data : []
        } else {
          self.contactList = []
        }
      }).catch(function() {
        self.contactList = []
      })
    },
    loadHealthAlerts: function() {
      var self = this
      getHealthAlerts().then(function(res) {
        if (res.code === 200) {
          self.healthAlerts = Array.isArray(res.data) ? res.data : []
        } else {
          self.healthAlerts = []
        }
      }).catch(function() {
        self.healthAlerts = []
      })
    },
    loadMilestones: function() {
      var self = this
      getMilestones(30).then(function(res) {
        if (res.code === 200) {
          self.milestones = Array.isArray(res.data) ? res.data : []
        } else {
          self.milestones = []
        }
      }).catch(function() {
        self.milestones = []
      })
    },
    loadTraditionalCultureData: function() {
      var self = this
      var memberId = this.currentChildId
      if (!memberId) {
        self.traditionalLoading = false
        return
      }
      self.traditionalLoading = true
      uni.request({
        url: config.API_BASE_URL + '/api/mind/traditional/mirror',
        method: 'POST',
        data: { memberId: memberId, memberType: 'child' },
        success: function(res) {
          self.traditionalLoading = false
          if (res.data && res.data.code === 200 && res.data.data) {
            var d = res.data.data
            if (d.eightCharacters || d.wuxingElements || d.zodiac || d.numSoul) {
              self.traditionalData = d
            } else {
              self.traditionalData = null
            }
          } else {
            self.traditionalData = null
          }
        },
        fail: function() {
          self.traditionalLoading = false
          self.traditionalData = null
        }
      })
    },
    _watchPageReady() {
      var self = this
      var unwatch = this.$watch(function() {
        if (self.isLoggedIn) {
          return !!(self.emiData || self.energyOverview)
        }      }, function(val) {
        if (val) {
          if (unwatch) unwatch()
          if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
        }
      })
    },

    // ===== DAN 报告 =====
    loadDanReports: function() {
      var self = this
      var memberId = self.currentChildId
      if (!memberId) return
      getDanReportByChild(memberId, 'mind').then(function(res) {
        if (res.code === 200 && res.data) {
          self.danReports = res.data
        }
      }).catch(function() {})
    },
    goDanUpload: function(dimension) {
      uni.navigateTo({ url: '/pages/dan-assessment/report-upload' })
    },
    viewDanReport: function(report) {
      uni.navigateTo({ url: '/pages/dan-assessment/report-upload?draftId=' + report.id })
    },
    formatDate: function(dateStr) {
      if (!dateStr) return ''
      var d = parseDate(dateStr)
      if (!d) return ''
      return d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate()
    }
  }
}
</script>

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

/* ===== 心·心理 标题栏 ===== */
.section-title-bar {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: 20rpx 30rpx 10rpx;
  padding: 16rpx 24rpx;
  background: linear-gradient(135deg, #8B5CF6, #A78BFA);
  border-radius: 20rpx;
  box-shadow: 0 4rpx 16rpx rgba(139,92,246,0.25);
}
.section-title-icon {
  font-size: 32rpx;
  color: #fff;
  margin-right: 12rpx;
}
.section-title-text {
  font-size: 32rpx;
  font-weight: bold;
  color: #fff;
}

/* ===== 心理报告上传卡片 ===== */
.mind-report-section {
  margin: 20rpx 30rpx;
}
.mind-report-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  background: linear-gradient(135deg, #F3E8FF, #FCE4EC);
  border-radius: 20rpx;
  padding: 28rpx 24rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
}
.mind-report-left {
  width: 100rpx;
  height: 100rpx;
  background: rgba(255,255,255,0.7);
  border-radius: 20rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 20rpx;
  flex-shrink: 0;
}
.mind-report-icon {
  font-size: 52rpx;
}
.mind-report-right {
  flex: 1;
}
.mind-report-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #7C3AED;
  display: block;
  margin-bottom: 6rpx;
}
.mind-report-desc {
  font-size: 22rpx;
  color: #A855F7;
  line-height: 1.5;
  display: block;
  margin-bottom: 10rpx;
}
.mind-report-tags {
  display: flex;
  flex-direction: row;
  gap: 10rpx;
}
.mind-tag {
  font-size: 20rpx;
  color: #7C3AED;
  background: rgba(255,255,255,0.6);
  padding: 4rpx 14rpx;
  border-radius: 20rpx;
}
.mind-report-arrow {
  font-size: 36rpx;
  color: #C084FC;
  margin-left: 10rpx;
  flex-shrink: 0;
}
.mind-report-card:active {
  opacity: 0.7;
}
.mind-report-list {
  margin-top: 12rpx;
}
.mind-report-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  background: #fff;
  border-radius: 14rpx;
  padding: 20rpx 20rpx;
  margin-bottom: 8rpx;
  box-shadow: 0 1rpx 6rpx rgba(0,0,0,0.05);
}
.mind-report-item:active {
  opacity: 0.7;
}
.mind-report-item-icon {
  font-size: 28rpx;
  margin-right: 14rpx;
}
.mind-report-item-name {
  font-size: 26rpx;
  color: #333;
  flex: 1;
}
.mind-report-item-date {
  font-size: 22rpx;
  color: #999;
  margin-right: 14rpx;
}
.mind-report-item-status {
  font-size: 22rpx;
  padding: 2rpx 12rpx;
  border-radius: 20rpx;
}
.mind-report-item-status.parsed {
  color: #7C3AED;
  background: #F3E8FF;
}
.mind-report-item-status.pending {
  color: #999;
  background: #F5F5F5;
}
.mind-report-empty {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 24rpx;
  margin-top: 8rpx;
}
.mind-report-empty-icon {
  font-size: 32rpx;
  margin-right: 10rpx;
}
.mind-report-empty-text {
  font-size: 24rpx;
  color: #bbb;
}

/* ===== 心理能量概况 ===== */
.energy-overview {
  display: flex;
  flex-direction: row;
  margin: 20rpx 30rpx;
  background: #fff;
  border-radius: 20rpx;
  padding: 24rpx 16rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
  justify-content: space-around;
}
.energy-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
}
.badge-icon {
  font-size: 36rpx;
  margin-bottom: 8rpx;
}
.badge-value {
  font-size: 36rpx;
  font-weight: bold;
  color: #333;
}
.badge-label {
  font-size: 20rpx;
  color: #999;
  margin-top: 4rpx;
}

/* ===== EMI 四维条形图 ===== */
.emi-section {
  margin: 20rpx 30rpx;
}
.emi-card {
  background: #fff;
  border-radius: 24rpx;
  padding: 30rpx;
  box-shadow: 0 4rpx 20rpx rgba(0,0,0,0.06);
}
.emi-card-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
  display: block;
}
.personality-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24rpx;
}
.test-btn {
  background: #8B5CF6;
  padding: 8rpx 28rpx;
  border-radius: 30rpx;
}
.test-btn-text {
  font-size: 24rpx;
  color: #fff;
  font-weight: 500;
}
.emi-bar-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 20rpx;
}
.emi-bar-label {
  font-size: 24rpx;
  color: #666;
  width: 120rpx;
  flex-shrink: 0;
}
.emi-bar-track {
  flex: 1;
  height: 20rpx;
  background: #f0f0f0;
  border-radius: 10rpx;
  overflow: hidden;
  margin: 0 16rpx;
}
.emi-bar-fill {
  height: 100%;
  border-radius: 10rpx;
  transition: width 0.5s;
}
.emi-bar-score {
  font-size: 26rpx;
  font-weight: bold;
  color: #333;
  width: 60rpx;
  text-align: right;
  flex-shrink: 0;
}
.emi-bar-level {
  font-size: 20rpx;
  width: 80rpx;
  text-align: right;
  flex-shrink: 0;
}
.level-excellent { color: #10B981; }
.level-good { color: #3B82F6; }
.level-average { color: #F97316; }
.level-low { color: #EF4444; }
.emi-footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 20rpx;
  padding-top: 20rpx;
  border-top: 1rpx solid #f0f0f0;
}
.emi-overall {
  font-size: 28rpx;
  font-weight: bold;
  color: #FF6B35;
}
.emi-link {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.emi-link-text {
  font-size: 26rpx;
  color: #FF6B35;
  font-weight: 500;
}
.emi-link-arrow {
  font-size: 26rpx;
  color: #FF6B35;
  margin-left: 8rpx;
}

/* ===== EMI 心理报告卡片 ===== */
.emi-card {
  margin: 30rpx;
  background: #fff;
  border-radius: 24rpx;
  padding: 30rpx;
  box-shadow: 0 4rpx 20rpx rgba(0,0,0,0.06);
}
.emi-header {
  margin-bottom: 24rpx;
}
.emi-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
  display: block;
}
.emi-overall-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32rpx 0;
  background: linear-gradient(135deg, #FF6B35, #FFD700);
  border-radius: 16rpx;
  margin: 20rpx 0;
  color: #fff;
}
.emi-overall-label {
  font-size: 26rpx;
  margin-bottom: 6rpx;
}
.emi-overall-value {
  font-size: 64rpx;
  font-weight: bold;
  margin-bottom: 6rpx;
}
.emi-overall-level {
  font-size: 24rpx;
  padding: 4rpx 16rpx;
  border-radius: 12rpx;
  background: rgba(255,255,255,0.2);
}
.emi-dimensions {
  display: flex;
  flex-direction: column;
  gap: 20rpx;
}
.emi-dimension {
  display: flex;
  flex-direction: column;
}
.emi-dim-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8rpx;
}
.emi-dim-label {
  font-size: 26rpx;
  color: #666;
}
.emi-dim-values {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.emi-dim-score {
  font-size: 28rpx;
  font-weight: bold;
  color: #FF6B35;
  margin-right: 12rpx;
}
.emi-dim-level {
  font-size: 20rpx;
  padding: 2rpx 12rpx;
  border-radius: 8rpx;
}
.emi-dim-bar {
  height: 14rpx;
  background: #f0f0f0;
  border-radius: 7rpx;
  overflow: hidden;
}
.emi-dim-bar-fill {
  height: 100%;
  border-radius: 7rpx;
  transition: width 0.5s;
}
.emi-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding-top: 20rpx;
  border-top: 1rpx solid #f0f0f0;
  margin-top: 20rpx;
}
.emi-footer-text {
  font-size: 24rpx;
  color: #F97316;
  font-weight: 500;
}
.emi-footer-icon {
  font-size: 24rpx;
  margin-left: 8rpx;
}
.level-excellent { color: #10B981; background: #ECFDF5; }
.level-good { color: #3B82F6; background: #EFF6FF; }
.level-average { color: #F97316; background: #FFF7ED; }
.level-low { color: #EF4444; background: #FEF2F2; }

/* 雷达图内的空状态 */
.placeholder-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40rpx 20rpx;
}

/* ===== 占位卡 ===== */
.placeholder-card {
  margin: 30rpx;
  background: #fff;
  border-radius: 24rpx;
  padding: 60rpx 40rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 4rpx 20rpx rgba(0,0,0,0.06);
}
.placeholder-icon {
  font-size: 80rpx;
  margin-bottom: 20rpx;
}
.placeholder-title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 16rpx;
}
.placeholder-desc {
  font-size: 26rpx;
  color: #999;
  text-align: center;
  line-height: 1.6;
  margin-bottom: 30rpx;
}
.placeholder-btn {
  background: linear-gradient(135deg, #FF6B35, #FFD700);
  color: #fff;
  font-size: 28rpx;
  font-weight: bold;
  padding: 16rpx 64rpx;
  border-radius: 40rpx;
  box-shadow: 0 4rpx 16rpx rgba(255,107,53,0.3);
}

/* ===== 传统文化卡片 ===== */
.culture-section {
  margin: 20rpx 30rpx;
}
.culture-card {
  background: #fff;
  border-radius: 20rpx;
  padding: 24rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
  margin-bottom: 16rpx;
}
.culture-card-header {
  display: flex;
  align-items: center;
  margin-bottom: 16rpx;
}
.culture-card-icon {
  font-size: 32rpx;
  margin-right: 10rpx;
}
.culture-card-title {
  font-size: 28rpx;
  font-weight: 600;
  color: #333;
}
.culture-card-body {
  font-size: 24rpx;
  color: #666;
  line-height: 1.6;
}
/* 八字四柱 */
.bazi-grid {
  display: flex;
  justify-content: space-around;
  padding: 8rpx 0;
}
.bazi-column {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.bazi-pillar-label {
  font-size: 22rpx;
  color: #999;
  margin-bottom: 6rpx;
}
.bazi-pillar-value {
  font-size: 32rpx;
  font-weight: 700;
  color: #8B5CF6;
  background: #F5F0FF;
  padding: 10rpx 14rpx;
  border-radius: 10rpx;
}
/* 五行能量 */
.wuxing-list {
  display: flex;
  flex-direction: column;
  gap: 12rpx;
}
.wuxing-item {
  display: flex;
  align-items: center;
  gap: 12rpx;
}
.wuxing-label {
  font-size: 26rpx;
  font-weight: 600;
  width: 44rpx;
  text-align: center;
}
.wuxing-bar-track {
  flex: 1;
  height: 20rpx;
  background: #F0F0F0;
  border-radius: 10rpx;
  overflow: hidden;
}
.wuxing-bar-fill {
  height: 100%;
  border-radius: 10rpx;
}
.wuxing-value {
  font-size: 22rpx;
  color: #666;
  width: 56rpx;
  text-align: right;
}
.energy-card {
  margin-top: 20rpx;
  padding: 24rpx 20rpx;
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
  border-radius: 20rpx;
  position: relative;
  overflow: hidden;
}

.energy-card::before {
  content: '';
  position: absolute;
  top: -60rpx;
  right: -60rpx;
  width: 200rpx;
  height: 200rpx;
  background: radial-gradient(circle, rgba(255,215,0,0.15) 0%, transparent 70%);
  border-radius: 50%;
}

.energy-card::after {
  content: '';
  position: absolute;
  bottom: -40rpx;
  left: -40rpx;
  width: 160rpx;
  height: 160rpx;
  background: radial-gradient(circle, rgba(99,102,241,0.12) 0%, transparent 70%);
  border-radius: 50%;
}

.energy-header {
  display: flex;
  align-items: center;
  margin-bottom: 14rpx;
  position: relative;
  z-index: 1;
}

.energy-icon {
  font-size: 32rpx;
  margin-right: 10rpx;
}

.energy-label {
  font-size: 28rpx;
  font-weight: 700;
  background: linear-gradient(135deg, #F59E0B, #FF6B9D);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.energy-divider {
  height: 2rpx;
  background: linear-gradient(90deg, rgba(255,215,0,0.5), rgba(255,107,157,0.3), transparent);
  margin-bottom: 18rpx;
  position: relative;
  z-index: 1;
}

.energy-quote {
  font-size: 26rpx;
  color: #E2E8F0;
  line-height: 1.8;
  display: block;
  margin-bottom: 14rpx;
  position: relative;
  z-index: 1;
  padding-left: 20rpx;
  letter-spacing: 1rpx;
}

.energy-quote::before {
  content: '';
  position: absolute;
  left: 0;
  top: 4rpx;
  bottom: 4rpx;
  width: 4rpx;
  background: linear-gradient(180deg, #F59E0B, #FF6B9D);
  border-radius: 2rpx;
}

.energy-advice {
  font-size: 24rpx;
  color: #94A3B8;
  line-height: 1.7;
  display: block;
  position: relative;
  z-index: 1;
  padding: 14rpx 18rpx;
  background: rgba(255,255,255,0.05);
  border-radius: 12rpx;
  border: 1rpx solid rgba(255,255,255,0.08);
}

.energy-footer {
  display: flex;
  justify-content: center;
  gap: 12rpx;
  margin-top: 18rpx;
  position: relative;
  z-index: 1;
}

.energy-footer-dot {
  width: 8rpx;
  height: 8rpx;
  border-radius: 50%;
  background: rgba(255,255,255,0.3);
}

.energy-footer-dot:nth-child(2) {
  background: rgba(255,215,0,0.6);
  width: 10rpx;
  height: 10rpx;
}
/* 星座+灵数双栏 */
.culture-dual {
  display: flex;
  gap: 16rpx;
}
.culture-dual-item {
  flex: 1;
  background: #fff;
  border-radius: 20rpx;
  padding: 20rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.culture-dual-icon {
  font-size: 36rpx;
  margin-bottom: 8rpx;
}
.culture-dual-label {
  font-size: 22rpx;
  color: #999;
  margin-bottom: 6rpx;
}
.culture-dual-value {
  font-size: 28rpx;
  font-weight: 700;
  color: #8B5CF6;
}
.culture-empty {
  text-align: center;
  padding: 30rpx 0;
  color: #bbb;
  font-size: 24rpx;
}

/* ===== 每日心理 ===== */
.tip-card {
  background: #fff;
  border-radius: 20rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
  display: flex;
  flex-direction: row;
  overflow: hidden;
}
.tip-left-bar {
  width: 6rpx;
  background: linear-gradient(180deg, #5B9BD5, #8FC5E8);
  flex-shrink: 0;
}
.tip-body {
  flex: 1;
  padding: 28rpx 24rpx;
}
.tip-title {
  font-size: 28rpx;
  font-weight: bold;
  color: #5B9BD5;
  display: block;
  margin-bottom: 12rpx;
}
.tip-content {
  font-size: 24rpx;
  color: #666;
  line-height: 1.6;
  display: block;
  margin-bottom: 16rpx;
}
.tip-footer {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.tip-source {
  font-size: 22rpx;
  color: #bbb;
}

/* ===== 通用区块 ===== */
.section {
  margin: 20rpx 30rpx;
}
.section-header {
  margin-bottom: 20rpx;
}
.section-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
}

/* ===== 推荐阅读 ===== */
.article-list {
  display: flex;
  flex-direction: column;
}
.article-card {
  background: #fff;
  border-radius: 20rpx;
  padding: 28rpx 24rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
  margin-bottom: 20rpx;
}
.article-category {
  display: inline-block;
  padding: 4rpx 18rpx;
  border-radius: 20rpx;
  margin-bottom: 14rpx;
}
.article-category-text {
  font-size: 20rpx;
  color: #fff;
  font-weight: 500;
}
.article-title {
  font-size: 28rpx;
  font-weight: bold;
  color: #333;
  display: block;
  margin-bottom: 10rpx;
}
.article-summary {
  font-size: 24rpx;
  color: #888;
  line-height: 1.5;
  display: block;
  margin-bottom: 20rpx;
}
.article-meta {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.meta-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-right: 20rpx;
}
.meta-icon {
  font-size: 22rpx;
  margin-right: 4rpx;
}
.meta-text {
  font-size: 22rpx;
  color: #bbb;
}
.article-date {
  font-size: 22rpx;
  color: #bbb;
  margin-left: auto;
}

/* ===== 功能区入口 ===== */
.func-section {
  margin: 20rpx 30rpx;
}
.func-grid {
  display: flex;
  flex-direction: column;
  gap: 16rpx;
  background: #fff;
  border-radius: 20rpx;
  padding: 24rpx 16rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
}
.func-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.func-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
}
.func-icon-wrap {
  width: 80rpx;
  height: 80rpx;
  border-radius: 40rpx;
  background: linear-gradient(135deg, #D6EAF8, #EBF2FA);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10rpx;
}
.func-icon {
  font-size: 40rpx;
}
.func-label {
  font-size: 22rpx;
  color: #666;
  font-weight: 500;
}
.func-item:active {
  opacity: 0.7;
}

/* ===== 底部 ===== */
.bottom-spacer {
  height: 120rpx;
}

/* ===== 肠脑轴 ===== */
.gut-insight-text {
  font-size: 24rpx;
  color: #666;
  margin-bottom: 16rpx;
  padding: 12rpx 16rpx;
  background: #F0FFF4;
  border-radius: 12rpx;
  line-height: 1.6;
}
.gut-indicator-list {
  display: flex;
  flex-direction: column;
  gap: 12rpx;
}
.gut-indicator-item {
  display: flex;
  align-items: center;
  gap: 12rpx;
}
.gut-indicator-left {
  width: 80rpx;
  flex-shrink: 0;
}
.gut-indicator-name {
  font-size: 22rpx;
  color: #666;
}
.gut-indicator-bar-track {
  flex: 1;
  height: 16rpx;
  background: #F0F0F0;
  border-radius: 8rpx;
  overflow: hidden;
}
.gut-indicator-bar-fill {
  height: 100%;
  border-radius: 8rpx;
  transition: width 0.3s;
}
.gut-indicator-value {
  font-size: 22rpx;
  color: #666;
  width: 60rpx;
  text-align: right;
}
.gut-indicator-status {
  font-size: 20rpx;
  padding: 2rpx 12rpx;
  border-radius: 10rpx;
  width: 60rpx;
  text-align: center;
}
.status-normal {
  background: #D1FAE5;
  color: #059669;
}
.status-abnormal {
  background: #FEE2E2;
  color: #DC2626;
}
.status-warning {
  background: #FEF3C7;
  color: #D97706;
}

/* ===== 关键信息（家庭+个人） ===== */
.key-info-card {
  background: #fff;
  border-radius: 20rpx;
  padding: 24rpx;
  margin-top: 20rpx;
  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
}
.key-info-header {
  display: flex;
  align-items: center;
  margin-bottom: 20rpx;
}
.key-info-icon {
  font-size: 28rpx;
  margin-right: 8rpx;
}
.key-info-title {
  font-size: 28rpx;
  font-weight: 600;
  color: #333;
}
.key-info-body {
  display: flex;
  flex-direction: row;
  gap: 20rpx;
}
.key-info-col {
  flex: 1;
  background: #F8F9FA;
  border-radius: 14rpx;
  padding: 16rpx;
  min-width: 0;
}
.ki-subtitle {
  font-size: 22rpx;
  color: #999;
  margin-bottom: 12rpx;
  font-weight: 500;
}
.ki-row {
  display: flex;
  align-items: center;
  margin-bottom: 10rpx;
  flex-wrap: nowrap;
}
.ki-row:last-child {
  margin-bottom: 0;
}
.ki-label {
  font-size: 22rpx;
  color: #888;
  margin-right: 8rpx;
  white-space: nowrap;
}
.ki-dot {
  width: 16rpx;
  height: 16rpx;
  border-radius: 50%;
  margin-right: 6rpx;
  flex-shrink: 0;
}
.ki-valuel {
  font-size: 24rpx;
  color: #333;
  font-weight: 500;
  white-space: nowrap;
}
.ki-valued {
  font-size: 24rpx;
  color: #333;
  font-weight: 500;
}
.ki-swatch {
  width: 28rpx;
  height: 28rpx;
  border-radius: 50%;
  margin-right: 6rpx;
  border: 2rpx solid rgba(0,0,0,0.06);
  flex-shrink: 0;
}
.ki-num {
  font-size: 30rpx;
  font-weight: 700;
  color: #FF6B9D;
}
.ki-fortune {
  font-size: 24rpx;
  font-weight: 700;
  padding: 2rpx 12rpx;
  border-radius: 10rpx;
}
.ki-fortune-0 {
  color: #D32F2F;
  background: #FFEBEE;
}
.ki-fortune-1 {
  color: #E65100;
  background: #FFF3E0;
}
.ki-fortune-2 {
  color: #F9A825;
  background: #FFFDE7;
}
.ki-fortune-3 {
  color: #7B1FA2;
  background: #F3E5F5;
}
.ki-fortune-4 {
  color: #B71C1C;
  background: #FFCDD2;
}
.ki-insight {
  display: flex;
  align-items: flex-start;
  margin-top: 16rpx;
  padding: 16rpx;
  background: #FFF8F0;
  border-radius: 12rpx;
}
.ki-insight-icon {
  font-size: 24rpx;
  margin-right: 8rpx;
  flex-shrink: 0;
}
.ki-insight-text {
  font-size: 22rpx;
  color: #8B6914;
  line-height: 1.5;
}
.ki-footer {
  margin-top: 16rpx;
  text-align: center;
  padding: 12rpx;
  font-size: 24rpx;
  color: #8B5CF6;
  font-weight: 500;
  background: #F5F3FF;
  border-radius: 12rpx;
}
.ki-footer:active {
  opacity: 0.7;
}

/* DAN 报告卡片 */
.dan-card {
  background: #fff;
  border-radius: 16rpx;
  padding: 24rpx;
  margin-bottom: 16rpx;
  box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
}
.dan-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12rpx;
}
.dan-report-date {
  font-size: 26rpx;
  color: #666;
}
.dan-status {
  font-size: 22rpx;
  padding: 4rpx 16rpx;
  border-radius: 8rpx;
}
.dan-status.confirmed {
  background: #D1FAE5;
  color: #065F46;
}
.dan-status.pending {
  background: #FEF3C7;
  color: #92400E;
}
.dan-report-desc {
  font-size: 28rpx;
  color: #333;
  font-weight: 500;
  margin-bottom: 12rpx;
  display: block;
}
.dan-card-footer {
  text-align: right;
}
.dan-view-link {
  font-size: 26rpx;
  color: #6366F1;
}
.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20rpx;
}
.section-title {
  font-size: 32rpx;
  font-weight: 700;
  color: #333;
}
.section-more {
  font-size: 26rpx;
  color: #6366F1;
  padding: 8rpx 16rpx;
}
</style>