cfc/cfc-frontend/pages/dan-assessment/report-result.vue

<template>
  <view class="container">
    <!-- 报告头部 -->
    <view class="report-head" v-if="headInfo">
      <text class="head-name">{{ headInfo.personName || headInfo.childName || 'DAN 测评报告' }}</text>
      <text class="head-date">{{ headInfo.dateText }}</text>
      <text class="head-dim" v-if="dimensionLabel">{{ dimensionLabel }}</text>
    </view>

    <view class="loading-wrap" v-if="loading">
      <text class="loading-text">加载中...</text>
    </view>

    <template v-else-if="blocks && blocks.length > 0">
      <!-- 报告内容块（后端按类型组装，前端通用渲染） -->
      <report-blocks-renderer :blocks="blocks" />
    </template>

    <view class="empty-wrap" v-else>
      <text class="empty-text">暂无数据</text>
    </view>

    <view class="bottom-spacer"></view>
  </view>
</template>

<script>
import ReportBlocksRenderer from '../../components/report-blocks-renderer.vue'
import { getDanReportDetail } from '../../utils/api.js'

export default {
  components: { ReportBlocksRenderer },
  data() {
    return {
      reportId: null,
      loading: true,
      headInfo: null,
      blocks: []
    }
  },
  computed: {
    dimensionLabel() {
      if (!this.headInfo || !this.headInfo.dimension) return ''
      var map = {
        mind: '心维度 (A2)',
        wisdom: '智维度 (B4)',
        cognition: '认知维度 (A1)',
        learning: '学习能力 (B3)',
        behavior: '行为教养 (B2)',
        career: '职业发展 (B6)',
        campus: '校园标准 (C1)',
        adolescent: '青春期挑战 (B5)'
      }
      return map[this.headInfo.dimension] || ''
    }
  },
  onLoad(options) {
    this.reportId = options.reportId ? parseInt(options.reportId) : null
    if (this.reportId) this.loadData()
  },
  methods: {
    loadData() {
      var self = this
      this.loading = true
      getDanReportDetail(this.reportId).then(function(res) {
        self.loading = false
        if (res.code !== 200 || !res.data) {
          uni.showToast({ title: res.message || '加载失败', icon: 'none' })
          return
        }
        var data = res.data
        self.headInfo = {
          personName: (data.result && data.result.childName) || data.childName || '',
          dateText: data.confirmedAt ? data.confirmedAt.substring(0, 10) : '',
          dimension: data.dimension
        }
        self.blocks = (data.blocks || []).filter(function(b) { return b && (b.items && b.items.length || b.content) })
      }).catch(function(e) {
        self.loading = false
        uni.showToast({ title: '加载异常', icon: 'none' })
      })
    }
  }
}
</script>

<style scoped>
.container { min-height: 100vh; background: #F8F8F8; padding-bottom: 40rpx; }
.loading-wrap { display: flex; justify-content: center; padding: 120rpx 0; }
.loading-text { font-size: 28rpx; color: #999; }
.empty-wrap { display: flex; justify-content: center; padding: 120rpx 0; }
.empty-text { font-size: 28rpx; color: #999; }

.report-head { background: linear-gradient(135deg, #6366F1, #8B5CF6); padding: 32rpx 28rpx 28rpx; color: #fff; }
.head-name { font-size: 36rpx; font-weight: bold; display: block; }
.head-date { font-size: 24rpx; opacity: 0.85; display: block; margin-top: 8rpx; }
.head-dim { font-size: 22rpx; background: rgba(255,255,255,0.2); border-radius: 20rpx; padding: 4rpx 16rpx; margin-top: 12rpx; display: inline-block; }

.bottom-spacer { height: 40rpx; }
</style>