cfc/cfc-frontend/pages/health/report-confirm.vue

<template>
  <view class="confirm-container">
    <view class="nav-bar">
      <text class="nav-back" @click="goBack">‹ 返回</text>
      <text class="nav-title">确认健康报告</text>
      <view class="nav-placeholder"></view>
    </view>

    <view class="tip-banner">
      <text class="tip-icon">✅</text>
      <text class="tip-text">请核对以下解析内容，可修改后确认入库</text>
    </view>

    <!-- 匹配可信度 -->
    <view class="confidence-card" v-if="confidenceLevelClass">
      <view class="confidence-header">
        <text class="confidence-label">匹配可信度</text>
        <text class="confidence-badge" :class="'badge-' + confidenceLevelClass">{{ confidenceLevelText }}</text>
      </view>
      <view class="confidence-bar-track">
        <view class="confidence-bar-fill" :class="'fill-' + confidenceLevelClass" :style="'width:' + confidencePercent + '%'"></view>
      </view>
      <text class="confidence-desc">{{ confidenceDesc }}</text>
    </view>

    <view class="form-section">
      <!-- 基本信息 -->
      <view class="card">
        <view class="card-title">基本信息</view>
        <view class="field-row">
          <text class="field-label">被检测人</text>
          <text class="field-value" v-if="!needBind">{{ extractedName || '未识别' }}</text>
          <text class="field-value binding-required" v-else>需手动绑定</text>
        </view>
        <view class="field-row" v-if="extractedGender">
          <text class="field-label">性别</text>
          <text class="field-value">{{ extractedGender === 'male' ? '男' : extractedGender === 'female' ? '女' : extractedGender }}</text>
        </view>
        <view class="field-row" v-if="extractedAge">
          <text class="field-label">年龄</text>
          <text class="field-value">{{ extractedAge }}</text>
        </view>
        <view class="field-row" v-if="payload.summary && payload.type !== 'tongue'">
          <text class="field-label">综合评分</text>
          <input class="field-input" type="number" v-model="payload.summary.overallScore" />
        </view>
        <view class="field-row" v-if="payload.summary && payload.type !== 'tongue'">
          <text class="field-label">报告日期</text>
          <input class="field-input" type="text" v-model="payload.summary.reportDate" placeholder="如: 2025-06-15" />
        </view>
        <view class="field-row" v-if="payload.summary && payload.type !== 'tongue'">
          <text class="field-label">报告摘要</text>
          <textarea class="field-textarea" v-model="payload.summary.summary" maxlength="500" />
        </view>
      </view>

      <!-- 家庭成员绑定（含候选推荐） -->
      <view class="card" v-if="needBind">
        <view class="card-title">选择家庭成员</view>

        <!-- 候选匹配列表（按置信度排序） -->
        <view class="candidate-section" v-if="candidates.length > 0">
          <text class="candidate-section-hint">以下成员与报告信息匹配，请选择：</text>
          <view
            class="candidate-item"
            v-for="(cand, idx) in candidates"
            :key="idx"
            :class="{ 'candidate-selected': selectedMemberId === (cand.id || cand.userId) }"
            @click="selectCandidate(cand)"
          >
            <view class="candidate-left">
              <text class="candidate-avatar">{{ (cand.nickname || cand.name || '?').substring(0, 1) }}</text>
              <view class="candidate-info">
                <text class="candidate-name">{{ cand.nickname || cand.name || '未知' }}</text>
                <text class="candidate-detail" v-if="cand.gender || cand.age">{{ genderText(cand.gender) }}{{ cand.age ? ' · ' + cand.age + '岁' : '' }}</text>
                <text class="candidate-fields" v-if="cand.matchFields">匹配: {{ cand.matchFields }}</text>
              </view>
            </view>
            <view class="candidate-right">
              <view class="score-bar-track">
                <view class="score-bar-fill" :style="'width:' + (cand.similarityScore * 100) + '%'"></view>
              </view>
              <text class="score-text">{{ Math.round(cand.similarityScore * 100) }}%</text>
            </view>
          </view>
        </view>

        <!-- 全量家庭成员列表（后备） -->
        <view class="member-list" v-if="familyMembers.length > 0 && (candidates.length === 0 || !showCandidatesOnly)">
          <view
            class="member-item"
            v-for="(member, mIdx) in familyMembers"
            :key="mIdx"
            :class="{ 'member-selected': selectedMemberId === (member.userId || member.id) }"
            @click="selectMember(member)"
          >
            <text class="member-avatar">{{ (member.nickname || '?').substring(0, 1) }}</text>
            <text class="member-name">{{ member.nickname || '未知' }}</text>
          </view>
        </view>

        <!-- 新建成员入口 -->
        <view class="create-member-entry" @click="toggleAutoCreate">
          <text class="create-member-icon">＋</text>
          <text class="create-member-text">{{ showAutoCreateForm ? '收起新建表单' : '不在列表中？新建家庭成员' }}</text>
        </view>
      </view>

      <!-- 新建家庭成员表单 -->
      <view class="card auto-create-card" v-if="showAutoCreateForm">
        <view class="card-title">新建家庭成员</view>
        <view class="form-item">
          <text class="form-item-label">姓名</text>
          <input class="form-item-input" v-model="newMember.name" placeholder="请输入姓名" />
        </view>
        <view class="form-item">
          <text class="form-item-label">性别</text>
          <view class="gender-selector">
            <text class="gender-option" :class="{ 'gender-selected': newMember.gender === 'male' }" @click="newMember.gender = 'male'">男</text>
            <text class="gender-option" :class="{ 'gender-selected': newMember.gender === 'female' }" @click="newMember.gender = 'female'">女</text>
          </view>
        </view>
        <view class="form-item">
          <text class="form-item-label">年龄</text>
          <input class="form-item-input" type="number" v-model="newMember.age" placeholder="请输入年龄" />
        </view>
        <view class="btn-create-submit" :class="{ 'btn-disabled': creatingMember }" @click="doAutoCreate">
          <text v-if="creatingMember">创建中...</text>
          <text v-else>确认创建</text>
        </view>
      </view>

      <!-- 舌诊指标（只读展示） -->
      <view class="card" v-if="payload.type === 'tongue' && payload.indicators && payload.indicators.length">
        <view class="card-title">舌象指标</view>
        <view class="tongue-indicator-grid">
          <view class="tongue-ind-item" v-for="(ind, idx) in payload.indicators" :key="idx">
            <text class="tongue-ind-label">{{ indicatorLabel(ind.code) }}</text>
            <text class="tongue-ind-value">{{ ind.value }}</text>
          </view>
        </view>
        <view class="tongue-summary" v-if="payload.summary && payload.summary.overallAssessment">
          <text class="tongue-summary-title">综合评估</text>
          <text class="tongue-summary-text">{{ payload.summary.overallAssessment }}</text>
        </view>
      </view>

      <!-- 健康指标（舌诊时隐藏，使用上方舌象指标卡片） -->
      <view class="card" v-if="payload.type !== 'tongue' && payload.indicators && payload.indicators.length">
        <view class="card-title">健康指标 ({{ payload.indicators.length }})</view>
        <view class="indicator-item" v-for="(ind, idx) in payload.indicators" :key="idx">
          <view class="ind-header">
            <input class="ind-name" v-model="payload.indicators[idx].name" />
            <input class="ind-value" v-model="payload.indicators[idx].value" />
          </view>
          <view class="ind-detail" v-if="payload.indicators[idx].unit || payload.indicators[idx].referenceRange">
            <text class="ind-ref" v-if="payload.indicators[idx].referenceRange">参考: {{ payload.indicators[idx].referenceRange }}</text>
            <text class="ind-unit" v-if="payload.indicators[idx].unit">{{ payload.indicators[idx].unit }}</text>
          </view>
          <view class="ind-symptoms" v-if="payload.indicators[idx].symptoms">
            <text class="ind-symptom-label">症状:</text>
            <input class="ind-symptom-input" v-model="payload.indicators[idx].symptoms" />
          </view>
          <view class="ind-status-row">
            <view class="status-tag" :class="'status-' + (payload.indicators[idx].status || 'normal')">
              {{ statusText(payload.indicators[idx].status) }}
            </view>
          </view>
        </view>
      </view>

      <!-- 肠道菌群 -->
      <view class="card" v-if="payload.gutFlora && payload.gutFlora.length">
        <view class="card-title">肠道菌群 ({{ payload.gutFlora.length }})</view>
        <view class="flora-item" v-for="(flora, idx) in payload.gutFlora" :key="idx">
          <input class="flora-name" v-model="payload.gutFlora[idx].name" />
          <input class="flora-abundance" type="digit" v-model="payload.gutFlora[idx].abundance" />
          <view class="status-tag" :class="'status-' + (flora.status || 'normal')">
            {{ statusText(flora.status) }}
          </view>
        </view>
      </view>

      <!-- 疾病风险 -->
      <view class="card" v-if="payload.diseaseRisks && payload.diseaseRisks.length">
        <view class="card-title">疾病风险 ({{ payload.diseaseRisks.length }})</view>
        <view class="risk-item" v-for="(risk, idx) in payload.diseaseRisks" :key="idx">
          <input class="risk-name" v-model="payload.diseaseRisks[idx].diseaseName" />
          <view class="risk-level" :class="'risk-' + (risk.riskLevel || 'low')">
            {{ riskLevelText(risk.riskLevel) }}
          </view>
        </view>
      </view>

      <!-- 饮食推荐 -->
      <view class="card" v-if="payload.foods && payload.foods.length">
        <view class="card-title">饮食推荐 ({{ payload.foods.length }})</view>
        <view class="food-item" v-for="(food, idx) in payload.foods" :key="idx">
          <input class="food-name" v-model="payload.foods[idx].foodName" />
          <input class="food-category" v-model="payload.foods[idx].category" />
        </view>
      </view>

      <!-- 操作按钮 -->
      <view class="action-row">
        <view class="btn-discard" @click="doDiscard">
          <text>放弃</text>
        </view>
        <view class="btn-confirm" :class="{ 'btn-disabled': !canConfirm }" @click="doConfirm">
          <text v-if="confirming">确认中...</text>
          <text v-else>确认入库</text>
        </view>
      </view>
    </view>

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

<script>
import { confirmReportPreview, discardReportDraft, confirmTongue, discardTongue } from '../../utils/api.js'
import { addFamilyMember, getFamilyMembers } from '../../utils/api.js'

export default {
  data() {
    return {
      draftId: null,
      childId: null,
      familyId: null,
      payload: {
        summary: {},
        indicators: [],
        gutFlora: [],
        probioticSpecies: [],
        foods: [],
        diseaseRisks: []
      },
      extractedName: '',
      extractedGender: '',
      extractedAge: '',
      matchedMemberId: null,
      needBind: false,
      selectedMemberId: null,
      familyMembers: [],
      confirming: false,
      // Phase 2: 匹配可信度与候选
      matchConfidence: null,
      matchLabel: '',
      candidates: [],
      showCandidatesOnly: false,
      // 新建成员
      showAutoCreateForm: false,
      newMember: {
        name: '',
        gender: '',
        age: ''
      },
      creatingMember: false,
      createdMemberId: null
    }
  },
  computed: {
    canConfirm() {
      if (this.needBind && !this.selectedMemberId && !this.createdMemberId) return false
      return this.draftId && !this.confirming
    },
    confidenceLevelClass() {
      if (!this.matchConfidence && this.matchConfidence !== 0) return ''
      var val = parseFloat(this.matchConfidence)
      if (this.matchLabel === 'exact' || val >= 0.8) return 'high'
      if (this.matchLabel === 'fuzzy' || val >= 0.5) return 'medium'
      if (this.matchLabel === 'profile_match' || val >= 0.2) return 'low'
      return 'none'
    },
    confidenceLevelText() {
      var map = { high: '高', medium: '中', low: '低', none: '未匹配' }
      return map[this.confidenceLevelClass] || ''
    },
    confidencePercent() {
      if (!this.matchConfidence && this.matchConfidence !== 0) return 0
      return Math.round(parseFloat(this.matchConfidence) * 100)
    },
    confidenceDesc() {
      if (this.matchLabel === 'exact') return '根据姓名、性别、年龄自动精确匹配到家庭成员'
      if (this.matchLabel === 'fuzzy') return '部分字段匹配，请确认是否为以下家庭成员'
      if (this.matchLabel === 'profile_match') return '根据档案信息推测匹配，请手动确认'
      if (this.matchLabel === 'no_match') return '无法匹配到现有家庭成员，可新建成员'
      return ''
    }
  },
  onLoad: function(options) {
    this.draftId = options.draftId ? parseInt(options.draftId) : null
    this.childId = options.childId ? parseInt(options.childId) : null
    this.familyId = options.familyId ? parseInt(options.familyId) : null

    var payloadStr = decodeURIComponent(options.payload || '{}')
    try {
      var parsed = typeof payloadStr === 'string' ? JSON.parse(payloadStr) : payloadStr
      this.payload = Object.assign({
        summary: {},
        indicators: [],
        gutFlora: [],
        probioticSpecies: [],
        foods: [],
        diseaseRisks: []
      }, parsed)
    } catch (e) {
      console.log('解析payload失败', e)
    }

    this.extractedName = options.extractedName || ''
    this.extractedGender = options.extractedGender || ''
    this.extractedAge = options.extractedAge || ''
    this.matchedMemberId = options.matchedMemberId ? parseInt(options.matchedMemberId) : null

    // 从解析结果填充报告日期
    var extractedReportDate = options.extractedReportDate || ''
    if (extractedReportDate && this.payload.summary) {
      this.payload.summary.reportDate = extractedReportDate
    }
    this.needBind = options.needBind === 'true' || options.needBind === '1'
    this.matchConfidence = options.matchConfidence ? parseFloat(options.matchConfidence) : null
    this.matchLabel = decodeURIComponent(options.matchLabel || '')

    // 解析候选成员列表
    var candidatesStr = decodeURIComponent(options.candidates || '')
    if (candidatesStr) {
      try {
        this.candidates = JSON.parse(candidatesStr)
      } catch (e) {
        this.candidates = []
      }
    }

    // 有候选时优先展示候选列表
    if (this.candidates.length > 0) {
      this.showCandidatesOnly = true
    }

    if (this.needBind) {
      this.loadFamilyMembers()
      // 高置信度且已匹配 → 直接选中
      if (this.matchedMemberId && this.matchConfidence >= 0.8) {
        this.selectedMemberId = this.matchedMemberId
      }
    }
  },
  methods: {
    loadFamilyMembers() {
      var self = this
      // 从后端获取真实家庭成员（家长 + 孩子），storage 中并无该数据
      getFamilyMembers().then(function(res) {
        var data = (res && res.data) || {}
        var parents = (data.parents || []).map(function(p) {
          return { id: p.id, nickname: p.realName || p.nickname, gender: p.gender, role: 'parent' }
        })
        var children = (data.children || []).map(function(c) {
          return { id: c.id, nickname: c.nickname, gender: c.gender, age: c.age, role: 'child' }
        })
        self.familyMembers = parents.concat(children)
      }).catch(function(e) {
        console.log('加载家庭成员失败', e)
        self.familyMembers = []
      })
    },
    selectMember(member) {
      this.selectedMemberId = member.userId || member.id
    },
    // === Phase 2: 候选匹配与新建成员 ===
    genderText(gender) {
      if (gender === 'male') return '男'
      if (gender === 'female') return '女'
      return gender || ''
    },
    selectCandidate(candidate) {
      this.selectedMemberId = candidate.id || candidate.userId
      this.showAutoCreateForm = false
    },
    toggleAutoCreate() {
      this.showAutoCreateForm = !this.showAutoCreateForm
      if (this.showAutoCreateForm) {
        this.newMember.name = this.extractedName || ''
        this.newMember.gender = this.extractedGender || ''
        this.newMember.age = this.extractedAge || ''
        this.selectedMemberId = null
      }
    },
    doAutoCreate() {
      var self = this
      if (!this.newMember.name) {
        uni.showToast({ title: '请输入成员姓名', icon: 'none' })
        return
      }
      self.creatingMember = true
      uni.showLoading({ title: '创建成员...' })

      addFamilyMember({
        nickname: self.newMember.name,
        gender: self.newMember.gender || '',
        age: self.newMember.age ? parseInt(self.newMember.age) : null
      }).then(function(res) {
        uni.hideLoading()
        if (res.code === 200) {
          var memberId = res.data && (res.data.userId || res.data.id)
          if (memberId) {
            self.createdMemberId = memberId
            self.selectedMemberId = memberId
            self.showAutoCreateForm = false
            uni.showToast({ title: '创建成功', icon: 'success' })
          }
        } else {
          uni.showToast({ title: res.message || '创建失败', icon: 'none' })
        }
      }).catch(function(e) {
        uni.hideLoading()
        uni.showToast({ title: '创建失败', icon: 'none' })
      }).finally(function() {
        self.creatingMember = false
      })
    },
    statusText(status) {
      if (status === 'high') return '偏高'
      if (status === 'low') return '偏低'
      if (status === 'abnormal') return '异常'
      return '正常'
    },
    riskLevelText(level) {
      if (level === 'high') return '高风险'
      if (level === 'medium' || level === 'moderate') return '中风险'
      return '低风险'
    },
    doConfirm() {
      if (!this.canConfirm) return
      var self = this
      self.confirming = true
      uni.showLoading({ title: '确认入库...' })

      var postData = {
        draftId: self.draftId,
        payload: self.payload
      }
      // 优先级: 已选成员 > 新建成员 > 自动匹配(高置信度) > 子ID
      if (self.selectedMemberId) {
        postData.subjectId = self.selectedMemberId
      } else if (self.createdMemberId) {
        postData.subjectId = self.createdMemberId
      } else if (self.matchedMemberId) {
        postData.subjectId = self.matchedMemberId
      } else if (self.childId) {
        postData.subjectId = self.childId
      }

      var confirmFn = self.payload.type === 'tongue' ? confirmTongue : confirmReportPreview
      confirmFn(postData).then(function(res) {
        uni.hideLoading()
        if (res.code === 200) {
          uni.showToast({ title: '入库成功', icon: 'success' })
          var reportId = res.data && res.data.reportId
          var reportType = res.data && res.data.reportType || ''
          setTimeout(function() {
            if (reportId) {
              if (reportType === 'gut_flora') {
                uni.redirectTo({ url: '/pages/health/report-survey?reportId=' + reportId + '&childId=' + (postData.subjectId || '') })
              } else {
                uni.redirectTo({ url: '/pages/body/health-report?reportId=' + reportId })
              }
            } else {
              uni.navigateBack()
            }
          }, 500)
        } else {
          uni.showToast({ title: res.message || '确认失败', icon: 'none' })
        }
      }).catch(function(e) {
        uni.hideLoading()
        uni.showToast({ title: '确认失败，请重试', icon: 'none' })
        console.log('确认入库失败', e)
      }).finally(function() {
        self.confirming = false
      })
    },
    doDiscard() {
      var self = this
      uni.showModal({
        title: '确认放弃',
        content: '放弃后解析数据将被删除，需要重新上传',
        success: function(res) {
          if (res.confirm) {
            var discardFn = self.payload.type === 'tongue' ? discardTongue : discardReportDraft
            discardFn({ draftId: self.draftId }).then(function() {
              uni.showToast({ title: '已放弃', icon: 'none' })
              setTimeout(function() { uni.navigateBack() }, 500)
            }).catch(function() {
              uni.showToast({ title: '操作失败', icon: 'none' })
            })
          }
        }
      })
    },
    goBack() {
      uni.navigateBack()
    },
    // 舌诊指标标签映射
    indicatorLabel(code) {
      var map = {
        'tongue_color': '舌色',
        'coating_color': '苔色',
        'coating_texture': '苔质',
        'fissure': '裂纹',
        'teeth_mark': '齿痕',
        'sublingual_vein': '舌下静脉',
        'constitution': '体质'
      }
      return map[code] || code
    }
  }
}
</script>

<style scoped>
.confirm-container {
  min-height: 100vh;
  background: #F5F7FA;
}
.nav-bar {
  position: sticky;
  top: 0;
  background: #fff;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 20rpx 30rpx;
  box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
  z-index: 100;
}
.nav-back { font-size: 32rpx; color: #5B9BD5; }
.nav-title { font-size: 32rpx; font-weight: bold; color: #333; }
.nav-placeholder { width: 80rpx; }

.tip-banner {
  display: flex;
  flex-direction: row;
  align-items: center;
  background: #E8F5E9;
  margin: 20rpx 30rpx;
  padding: 20rpx 24rpx;
  border-radius: 16rpx;
}
.tip-icon { font-size: 32rpx; margin-right: 16rpx; flex-shrink: 0; }
.tip-text { font-size: 24rpx; color: #2E7D32; line-height: 1.5; }

.form-section { margin: 0 30rpx; }

.card {
  background: #fff;
  border-radius: 16rpx;
  padding: 24rpx;
  margin-bottom: 20rpx;
  box-shadow: 0 2rpx 6rpx rgba(0,0,0,0.04);
}
.card-title {
  font-size: 28rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 20rpx;
  padding-bottom: 12rpx;
  border-bottom: 2rpx solid #F0F0F0;
}

.field-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 16rpx;
}
.field-label {
  font-size: 26rpx;
  color: #666;
  width: 160rpx;
  flex-shrink: 0;
}
.field-value {
  font-size: 26rpx;
  color: #333;
  font-weight: 500;
  flex: 1;
}
.field-value.binding-required {
  color: #E65100;
}
.field-input {
  flex: 1;
  font-size: 26rpx;
  color: #333;
  padding: 8rpx 16rpx;
  background: #F5F7FA;
  border-radius: 8rpx;
}
.field-textarea {
  width: 100%;
  min-height: 120rpx;
  font-size: 26rpx;
  color: #333;
  padding: 16rpx;
  background: #F5F7FA;
  border-radius: 12rpx;
  box-sizing: border-box;
  margin-top: 8rpx;
}

.member-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16rpx;
}
.member-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20rpx 24rpx;
  background: #F5F7FA;
  border-radius: 16rpx;
  border: 2rpx solid transparent;
  min-width: 120rpx;
}
.member-selected {
  background: #E3F2FD;
  border-color: #5B9BD5;
}
.member-avatar {
  width: 64rpx;
  height: 64rpx;
  border-radius: 50%;
  background: #5B9BD5;
  color: #fff;
  font-size: 28rpx;
  font-weight: bold;
  text-align: center;
  line-height: 64rpx;
  margin-bottom: 8rpx;
}
.member-name { font-size: 24rpx; color: #333; }

.indicator-item {
  background: #F8FAFB;
  border-radius: 12rpx;
  padding: 16rpx;
  margin-bottom: 12rpx;
}
.ind-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12rpx;
}
.ind-name {
  flex: 1;
  font-size: 26rpx;
  color: #333;
  font-weight: 500;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}
.ind-value {
  width: 160rpx;
  font-size: 26rpx;
  color: #1565C0;
  font-weight: bold;
  text-align: right;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}
.ind-detail {
  display: flex;
  flex-direction: row;
  margin-top: 8rpx;
  gap: 16rpx;
}
.ind-ref { font-size: 22rpx; color: #94A3B8; }
.ind-unit { font-size: 22rpx; color: #64748B; }
.ind-symptoms {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 8rpx;
  gap: 8rpx;
}
.ind-symptom-label { font-size: 22rpx; color: #94A3B8; flex-shrink: 0; }
.ind-symptom-input {
  flex: 1;
  font-size: 22rpx;
  color: #333;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}
.ind-status-row { margin-top: 8rpx; }
.status-tag {
  display: inline-block;
  font-size: 20rpx;
  padding: 4rpx 12rpx;
  border-radius: 8rpx;
  font-weight: 500;
}
.status-normal { background: #E8F5E9; color: #2E7D32; }
.status-high { background: #FFF3E0; color: #E65100; }
.status-low { background: #E3F2FD; color: #1565C0; }
.status-abnormal { background: #FFEBEE; color: #C62828; }

.flora-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12rpx;
  padding: 12rpx 16rpx;
  background: #F8FAFB;
  border-radius: 10rpx;
  margin-bottom: 8rpx;
}
.flora-name {
  flex: 1;
  font-size: 26rpx;
  color: #333;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}
.flora-abundance {
  width: 140rpx;
  font-size: 26rpx;
  color: #1565C0;
  text-align: right;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}

.risk-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12rpx;
  padding: 12rpx 16rpx;
  background: #F8FAFB;
  border-radius: 10rpx;
  margin-bottom: 8rpx;
}
.risk-name {
  flex: 1;
  font-size: 26rpx;
  color: #333;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}
.risk-level {
  font-size: 22rpx;
  font-weight: 500;
  padding: 4rpx 12rpx;
  border-radius: 8rpx;
}
.risk-low { background: #E8F5E9; color: #2E7D32; }
.risk-medium, .risk-moderate { background: #FFF3E0; color: #E65100; }
.risk-high { background: #FFEBEE; color: #C62828; }

.food-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12rpx;
  padding: 12rpx 16rpx;
  background: #F8FAFB;
  border-radius: 10rpx;
  margin-bottom: 8rpx;
}
.food-name {
  flex: 1;
  font-size: 26rpx;
  color: #333;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}
.food-category {
  width: 160rpx;
  font-size: 24rpx;
  color: #64748B;
  text-align: right;
  padding: 4rpx 8rpx;
  background: #fff;
  border-radius: 6rpx;
}

.action-row {
  display: flex;
  flex-direction: row;
  gap: 20rpx;
  margin-top: 10rpx;
  margin-bottom: 20rpx;
}
.btn-discard {
  flex: 1;
  background: #fff;
  border: 2rpx solid #EF4444;
  color: #EF4444;
  font-size: 28rpx;
  font-weight: bold;
  text-align: center;
  padding: 24rpx;
  border-radius: 16rpx;
}
.btn-discard:active { opacity: 0.7; }
.btn-confirm {
  flex: 2;
  background: linear-gradient(135deg, #5B9BD5, #3A7CC4);
  color: #fff;
  font-size: 28rpx;
  font-weight: bold;
  text-align: center;
  padding: 24rpx;
  border-radius: 16rpx;
}
.btn-confirm:active { opacity: 0.85; }
.btn-disabled { opacity: 0.5; }

.bottom-spacer { height: 80rpx; }

/* ===== Phase 2: 匹配可信度 ===== */
.confidence-card {
  margin: 0 30rpx 20rpx;
  background: #fff;
  border-radius: 16rpx;
  padding: 24rpx;
  box-shadow: 0 2rpx 6rpx rgba(0,0,0,0.04);
}
.confidence-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16rpx;
}
.confidence-label {
  font-size: 26rpx;
  color: #333;
  font-weight: 500;
}
.confidence-badge {
  font-size: 22rpx;
  font-weight: bold;
  padding: 4rpx 16rpx;
  border-radius: 20rpx;
}
.badge-high { background: #E8F5E9; color: #2E7D32; }
.badge-medium { background: #FFF8E1; color: #F57F17; }
.badge-low { background: #FFF3E0; color: #E65100; }
.badge-none { background: #FFEBEE; color: #C62828; }

.confidence-bar-track {
  height: 12rpx;
  background: #E2E8F0;
  border-radius: 6rpx;
  overflow: hidden;
  margin-bottom: 12rpx;
}
.confidence-bar-fill {
  height: 100%;
  border-radius: 6rpx;
  transition: width 0.3s ease;
}
.fill-high { background: linear-gradient(90deg, #66BB6A, #43A047); }
.fill-medium { background: linear-gradient(90deg, #FFD54F, #FFC107); }
.fill-low { background: linear-gradient(90deg, #FF8A65, #FF5722); }
.fill-none { background: linear-gradient(90deg, #EF9A9A, #E53935); }

.confidence-desc {
  font-size: 22rpx;
  color: #94A3B8;
  line-height: 1.4;
}

/* ===== Phase 2: 候选成员列表 ===== */
.candidate-section {
  margin-bottom: 16rpx;
}
.candidate-section-hint {
  display: block;
  font-size: 24rpx;
  color: #64748B;
  margin-bottom: 12rpx;
}
.candidate-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 16rpx;
  background: #F8FAFB;
  border-radius: 12rpx;
  margin-bottom: 10rpx;
  border: 2rpx solid transparent;
}
.candidate-item:active { opacity: 0.8; }
.candidate-selected {
  background: #E3F2FD;
  border-color: #5B9BD5;
}
.candidate-left {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex: 1;
  min-width: 0;
}
.candidate-avatar {
  width: 56rpx;
  height: 56rpx;
  border-radius: 50%;
  background: #5B9BD5;
  color: #fff;
  font-size: 24rpx;
  font-weight: bold;
  text-align: center;
  line-height: 56rpx;
  margin-right: 16rpx;
  flex-shrink: 0;
}
.candidate-info {
  flex: 1;
  min-width: 0;
}
.candidate-name {
  font-size: 26rpx;
  color: #333;
  font-weight: 500;
  display: block;
}
.candidate-detail {
  font-size: 22rpx;
  color: #94A3B8;
  display: block;
}
.candidate-fields {
  font-size: 20rpx;
  color: #5B9BD5;
  display: block;
  margin-top: 2rpx;
}
.candidate-right {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12rpx;
  flex-shrink: 0;
  margin-left: 16rpx;
}
.score-bar-track {
  width: 80rpx;
  height: 10rpx;
  background: #E2E8F0;
  border-radius: 5rpx;
  overflow: hidden;
}
.score-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #5B9BD5, #3A7CC4);
  border-radius: 5rpx;
}
.score-text {
  font-size: 24rpx;
  color: #1565C0;
  font-weight: bold;
  min-width: 48rpx;
  text-align: right;
}

/* ===== Phase 2: 新建成员入口 ===== */
.create-member-entry {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 20rpx;
  border: 2rpx dashed #CBD5E1;
  border-radius: 12rpx;
  margin-top: 8rpx;
}
.create-member-entry:active { background: #F1F5F9; }
.create-member-icon {
  font-size: 28rpx;
  color: #5B9BD5;
  font-weight: bold;
  margin-right: 8rpx;
}
.create-member-text {
  font-size: 24rpx;
  color: #5B9BD5;
}

/* ===== Phase 2: 新建成员表单 ===== */
.auto-create-card {
  border: 2rpx solid #E3F2FD;
}
.form-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 20rpx;
}
.form-item-label {
  font-size: 26rpx;
  color: #333;
  width: 100rpx;
  flex-shrink: 0;
}
.form-item-input {
  flex: 1;
  font-size: 26rpx;
  color: #333;
  padding: 12rpx 16rpx;
  background: #F5F7FA;
  border-radius: 10rpx;
}
.gender-selector {
  display: flex;
  flex-direction: row;
  gap: 16rpx;
}
.gender-option {
  font-size: 26rpx;
  color: #333;
  padding: 12rpx 32rpx;
  background: #F5F7FA;
  border-radius: 10rpx;
  border: 2rpx solid transparent;
}
.gender-option:active { opacity: 0.7; }
.gender-selected {
  background: #E3F2FD;
  border-color: #5B9BD5;
  color: #1565C0;
}
.btn-create-submit {
  background: linear-gradient(135deg, #5B9BD5, #3A7CC4);
  color: #fff;
  font-size: 28rpx;
  font-weight: bold;
  text-align: center;
  padding: 22rpx;
  border-radius: 14rpx;
  margin-top: 10rpx;
}
.btn-create-submit:active { opacity: 0.85; }

/* ===== 舌诊指标 ===== */
.tongue-indicator-grid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 12rpx;
}
.tongue-ind-item {
  width: calc(50% - 6rpx);
  background: #F8FAFC;
  border-radius: 16rpx;
  padding: 20rpx 24rpx;
  box-sizing: border-box;
}
.tongue-ind-label {
  display: block;
  font-size: 24rpx;
  color: #94A3B8;
  margin-bottom: 8rpx;
}
.tongue-ind-value {
  display: block;
  font-size: 28rpx;
  color: #1E293B;
  font-weight: 500;
}
.tongue-summary {
  margin-top: 20rpx;
  padding: 20rpx 24rpx;
  background: #FFF8E1;
  border-radius: 16rpx;
}
.tongue-summary-title {
  font-size: 24rpx;
  color: #F59E0B;
  font-weight: 600;
  display: block;
  margin-bottom: 8rpx;
}
.tongue-summary-text {
  font-size: 26rpx;
  color: #333;
  line-height: 1.6;
}
</style>