cfc/cfc-frontend/components/member-detail-sections/wisdom-section.vue

<template>
  <view class="wisdom-section">
    <!-- 最新测评结果 -->
    <view class="section-card" v-if="latestResult">
      <view class="section-header">
        <text class="section-title">🧠 最新测评结果</text>
      </view>
      <view class="result-overview" @click="goResultDetail">
        <text class="result-score">{{ latestResult.score || '--' }}</text>
        <text class="result-dimension">{{ latestResult.dimensionName || latestResult.title || '综合测评' }}</text>
      </view>
      <view class="result-date">测评日期：{{ formatDate(latestResult.createTime || latestResult.testDate) }}</view>
    </view>
    <view class="section-card" v-else-if="!loading && memberId">
      <view class="empty-state">
        <text class="empty-text">暂无测评记录</text>
        <text class="empty-sub">完成测评后结果将显示在这里</text>
      </view>
    </view>

    <!-- 测评历史 -->
    <view class="section-card" v-if="historyList.length > 0">
      <view class="section-header">
        <text class="section-title">📋 测评历史</text>
      </view>
      <view class="history-item" v-for="item in historyList" :key="item.id" @click="goResultDetail">
        <text class="history-title">{{ item.title || item.dimensionName || '测评' }}</text>
        <text class="history-score">{{ item.score || '--' }}</text>
        <text class="history-date">{{ formatDate(item.createTime || item.testDate) }}</text>
      </view>
    </view>

    <!-- 非孩子成员提示 -->
    <view class="section-card" v-if="!memberId && !loading">
      <view class="empty-state">
        <text class="empty-text">该成员暂无测评数据</text>
      </view>
    </view>

    <!-- 加载中 -->
    <view class="loading" v-if="loading">加载中...</view>
  </view>
</template>

<script>
import { getAssessmentLatestResult, getAssessmentHistory } from '../../utils/api.js'
import { parseDate } from '../../utils/format.js'

export default {
  props: {
    memberId: {
      type: [Number, String],
      default: null
    },
    memberType: {
      type: String,
      default: ''
    },
    memberInfo: {
      type: Object,
      default: null
    },
    sandboxData: {
      type: Object,
      default: null
    },
    energyMap: {
      type: Object,
      default: null
    }
  },
  data: function() {
    return {
      loading: true,
      latestResult: null,
      historyList: []
    }
  },
  mounted: function() {
    if (this.memberId) {
      this.loadData()
    } else {
      this.loading = false
    }
  },
  methods: {
    loadData: function() {
      var self = this
      getAssessmentLatestResult(this.memberId).then(function(res) {
        if (res.code === 200 && res.data) {
          self.latestResult = res.data
        }
      }).catch(function(e) {
        console.log('加载测评结果失败', e)
      })
      
      getAssessmentHistory(this.memberId, 5).then(function(res) {
        if (res.code === 200 && res.data) {
          self.historyList = Array.isArray(res.data) ? res.data : (res.data.records || [])
        }
      }).catch(function(e) {
        console.log('加载测评历史失败', e)
      })
      
      this.loading = false
    },
    formatDate: function(dateStr) {
      if (!dateStr) return ''
      var d = parseDate(dateStr)
      if (!d) return ''
      return d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate()
    },
    goResultDetail: function() {
      uni.navigateTo({
        url: '/pages/wisdom/assessment-detail?memberId=' + this.memberId
      })
    }
  }
}
</script>

<style scoped>
.wisdom-section {}
.section-card {
  background: #fff;
  border-radius: 24rpx;
  padding: 24rpx;
  margin-bottom: 20rpx;
  box-shadow: 0 4rpx 20rpx rgba(0,0,0,0.06);
}
.section-header {
  margin-bottom: 16rpx;
}
.section-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
}
.result-overview {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20rpx 0;
}
.result-score {
  font-size: 72rpx;
  font-weight: bold;
  color: #6366F1;
}
.result-dimension {
  font-size: 28rpx;
  color: #555;
  margin-top: 8rpx;
}
.result-date {
  font-size: 24rpx;
  color: #999;
  padding-top: 12rpx;
  border-top: 1rpx solid #f0f0f0;
  margin-top: 8rpx;
}
.history-item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 14rpx 0;
  border-bottom: 1rpx solid #f5f5f5;
}
.history-title {
  font-size: 26rpx;
  color: #333;
  flex: 1;
}
.history-score {
  font-size: 26rpx;
  color: #6366F1;
  width: 80rpx;
  text-align: center;
}
.history-date {
  font-size: 22rpx;
  color: #999;
  width: 140rpx;
  text-align: right;
}
.empty-state {
  padding: 30rpx 0;
  text-align: center;
}
.empty-text {
  font-size: 28rpx;
  color: #999;
}
.empty-sub {
  font-size: 24rpx;
  color: #ccc;
  margin-top: 8rpx;
}
.loading {
  text-align: center;
  padding: 40rpx;
  color: #999;
}
</style>