index.vue 40 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774
  1. <template>
  2. <view class="container">
  3. <block v-if="!isLoggedIn">
  4. <!-- 品牌定位语 -->
  5. <view class="brand-strap"><text class="brand-strap-text">科学管理全家健康数据</text></view>
  6. <!-- 痛点卡 -->
  7. <view class="pain-card">
  8. <text class="pain-quote">指标正常 ≠ 健康</text>
  9. <text class="pain-desc">孩子反复生病,你扛了多少次了?</text>
  10. </view>
  11. <!-- 自测入口 -->
  12. <view class="self-test-card" @click="goSelfTest">
  13. <view class="self-test-head">
  14. <text class="self-test-icon">⚡</text>
  15. <view class="self-test-info">
  16. <text class="self-test-title">15题五维健康自检</text>
  17. <text class="self-test-sub">约20秒,了解家人健康概况</text>
  18. </view>
  19. <text class="self-test-arrow">›</text>
  20. </view>
  21. </view>
  22. <!-- 本期待填调研(按周期计算,服务端返回 pending 列表) -->
  23. <view v-for="item in pendingSurveys" :key="surveyKey(item)" class="self-test-card" @click="goSurveyFill(item)">
  24. <view class="self-test-head">
  25. <text class="self-test-icon">📋</text>
  26. <view class="self-test-info">
  27. <text class="self-test-title">{{ item.title }}</text>
  28. <text class="self-test-sub">{{ cycleLabel(item.cycleType) }} · {{ item.periodStart }} 至 {{ item.periodEnd }}</text>
  29. </view>
  30. <text class="survey-pending-tag">待填写</text>
  31. </view>
  32. </view>
  33. <RadarChart :dimensions="demoBodyDims" :scores="demoBodyScores" fillColor="#FF8C42" childName="示例" width="560" height="460" />
  34. <view class="demo-chart-title-row">
  35. <text class="demo-chart-name">🧠 认知雷达</text>
  36. <text class="demo-chart-tag">示例</text>
  37. </view>
  38. <RadarChart :dimensions="demoCogDims" :scores="demoCogScores" fillColor="#6366F1" childName="示例" width="560" height="460" />
  39. <!-- 五维健康体系 -->
  40. <view class="wuxing-section">
  41. <view class="wuxing-title">身·心·智·行·富 · 看得见的健康闭环</view>
  42. <view class="wuxing-desc">五行相生相克,从报告和测评里,真正读懂家人的身体</view>
  43. <view class="wuxing-relations">
  44. <view class="rel-group">
  45. <text class="rel-title">相生 → 系统前进</text>
  46. <view class="rel-chain">
  47. <text class="rel-item">🌏 身</text>
  48. <text class="rel-arrow">→</text>
  49. <text class="rel-item">⚡ 智</text>
  50. <text class="rel-arrow">→</text>
  51. <text class="rel-item">💧 富</text>
  52. <text class="rel-arrow">→</text>
  53. <text class="rel-item">🌿 行</text>
  54. <text class="rel-arrow">→</text>
  55. <text class="rel-item">🔥 心</text>
  56. <text class="rel-arrow">→</text>
  57. <text class="rel-item">🌏 身</text>
  58. </view>
  59. <text class="rel-hint">健康孕育智慧,智慧创造价值,价值滋养关系,关系反哺心灵,心灵守护健康</text>
  60. </view>
  61. <view class="rel-group">
  62. <text class="rel-title">相克 → 系统平衡</text>
  63. <view class="rel-chain">
  64. <text class="rel-item">🌏 身</text>
  65. <text class="rel-op">克</text>
  66. <text class="rel-item">💧 富</text>
  67. <text class="rel-dot">·</text>
  68. <text class="rel-item">⚡ 智</text>
  69. <text class="rel-op">克</text>
  70. <text class="rel-item">🌿 行</text>
  71. <text class="rel-dot">·</text>
  72. <text class="rel-item">💧 富</text>
  73. <text class="rel-op">克</text>
  74. <text class="rel-item">🔥 心</text>
  75. <text class="rel-dot">·</text>
  76. <text class="rel-item">🌿 行</text>
  77. <text class="rel-op">克</text>
  78. <text class="rel-item">🌏 身</text>
  79. <text class="rel-dot">·</text>
  80. <text class="rel-item">🔥 心</text>
  81. <text class="rel-op">克</text>
  82. <text class="rel-item">⚡ 智</text>
  83. </view>
  84. <text class="rel-hint">莫以健康换金钱,真诚胜过算计,财富服务家庭,关爱有度、大爱留白</text>
  85. </view>
  86. </view>
  87. <view class="wuxing-cards">
  88. <view class="wc-card wc-body" @click="goPage('/pages/body-detail/index')">
  89. <text class="wc-icon">🌏</text>
  90. <view class="wc-info">
  91. <text class="wc-name">身 · 主动健康</text>
  92. <text class="wc-text">读懂每一份报告,看见全家体质的变化</text>
  93. </view>
  94. </view>
  95. <view class="wc-card wc-wisdom" @click="goPage('/pages/wisdom-detail/index')">
  96. <text class="wc-icon">⚡</text>
  97. <view class="wc-info">
  98. <text class="wc-name">智 · 赋能未来</text>
  99. <text class="wc-text">一次测评,看见孩子真实的专注与潜能</text>
  100. </view>
  101. </view>
  102. <view class="wc-card wc-wealth" @click="goPage('/pages/wealth/index')">
  103. <text class="wc-icon">💧</text>
  104. <view class="wc-info">
  105. <text class="wc-name">富 · 利他创富</text>
  106. <text class="wc-text">看懂健康与财富的关系,明白身体是最大的本钱</text>
  107. </view>
  108. </view>
  109. <view class="wc-card wc-action" @click="goPage('/pages/action-detail/member-action-detail')">
  110. <text class="wc-icon">🌿</text>
  111. <view class="wc-info">
  112. <text class="wc-name">行 · 人际和谐</text>
  113. <text class="wc-text">看懂关系里的情绪,看见家人真实的需求</text>
  114. </view>
  115. </view>
  116. <view class="wc-card wc-mind" @click="goPage('/pages/mind-detail/index')">
  117. <text class="wc-icon">🔥</text>
  118. <view class="wc-info">
  119. <text class="wc-name">心 · 大爱相随</text>
  120. <text class="wc-text">读懂情绪的信号,听懂家人没说出口的话</text>
  121. </view>
  122. </view>
  123. </view>
  124. </view>
  125. <!-- 登录引导 -->
  126. <view class="login-guide-section">
  127. <LoginGuideCard
  128. title="解锁全家健康数据"
  129. :items="[
  130. '查看七维雷达图与健康报告解读',
  131. '完成测评获取个性化健康方案',
  132. '每日打卡追踪身体/情绪/认知趋势'
  133. ]" />
  134. </view>
  135. </block>
  136. <block v-else>
  137. <view class="tab-bar">
  138. <view v-for="tab in tabs" :key="tab.code" class="tab-item" :class="{ active: currentTab === tab.code }" @click="switchTab(tab.code)">
  139. <text class="tab-icon">{{ tab.icon }}</text>
  140. <text class="tab-label">{{ tab.label }}</text>
  141. <view v-if="currentTab === tab.code" class="tab-underline" :style="{ background: tab.color }"></view>
  142. </view>
  143. </view>
  144. <view class="section section-chart">
  145. <RadarChart :dimensions="currentDimensions" :scores="currentScores || []" :fillColor="currentColor" :childName="selectedMemberName" :avgScores="currentAvgScores || []" width="640" height="520" />
  146. <view class="chart-empty" v-if="chartIsEmpty">
  147. <text class="empty-text">{{ currentTabLabel }}数据待采集</text>
  148. <text class="empty-sub">完成测评或上传报告即可解锁{{ currentTabLabel }}数据</text>
  149. </view>
  150. </view>
  151. <view class="section section-dc-header">
  152. <view class="dc-title-row">
  153. <text class="dc-icon">🔍</text>
  154. <text class="dc-title">看见 · 健康数据中心</text>
  155. </view>
  156. </view>
  157. <view class="section section-data-collect">
  158. <ReportUploadCard
  159. title="上传报告"
  160. desc="体检报告 · 菌群检测 · 认知测评 · 心理测评 · 情绪打卡"
  161. :tags="['体检报告', '菌群检测', '认知测评', '心理测评', '情绪打卡']"
  162. @click="goPage('/pages/health/report-upload')" />
  163. <view class="data-card data-card-assessment">
  164. <view class="data-card-head">
  165. <text class="data-card-title">在线测评</text>
  166. <text class="data-card-subtitle">多维度自测评估</text>
  167. </view>
  168. <view v-for="quiz in quizzes" :key="quiz.code" class="quiz-item">
  169. <view class="quiz-info">
  170. <text class="quiz-icon">{{ quiz.icon }}</text>
  171. <text class="quiz-label">{{ quiz.label }}</text>
  172. </view>
  173. <view v-if="quiz.score" class="quiz-score">
  174. <text class="score-value">{{ quiz.score }}</text>
  175. <text class="score-unit">分</text>
  176. </view>
  177. <button v-else class="quiz-btn" @click.stop="goQuiz(quiz.code)">开始</button>
  178. </view>
  179. </view>
  180. </view>
  181. <view class="section section-data-view">
  182. <view class="section-header">
  183. <text class="section-title">最近记录</text>
  184. <text class="section-more" @click="goPage('/pages/health/report-list')">查看全部 ›</text>
  185. </view>
  186. <view v-if="reports.length > 0">
  187. <view class="report-card" v-for="(report, idx) in reports.slice(0, 3)" :key="idx" @click="goReportDetail(report)">
  188. <view class="report-type-badge" :class="'badge-' + _reportTypeClass(report.reportType)">{{ _reportTypeLabel(report.reportType) }}</view>
  189. <view class="report-info">
  190. <text class="report-name">{{ report.childName || report.personName || '健康报告' }}</text>
  191. <text class="report-meta">{{ _formatReportDate(report.reportDate) }}{{ report.gutType ? ' · ' + report.gutType : '' }}</text>
  192. </view>
  193. <view class="report-score-wrap">
  194. <text v-if="report.overallScore != null" class="report-score">{{ report.overallScore }}</text>
  195. <text class="report-status" :class="'status-' + _statusClass(report.status)">{{ report.status === 'resolved' ? '已解析' : '待确认' }}</text>
  196. </view>
  197. <text class="report-arrow">›</text>
  198. </view>
  199. </view>
  200. <view v-else class="empty-hint">
  201. <text class="empty-text">暂无报告和测评结果</text>
  202. <text class="empty-sub">上传报告或完成测评开启健康之旅</text>
  203. </view>
  204. </view>
  205. <view class="section section-plan">
  206. <view class="plan-card">
  207. <view class="plan-head">
  208. <text class="plan-title">📋 健康方案</text>
  209. <button class="plan-btn" @click="goPlanSummary">{{ lastPlan ? '查看方案' : '生成新方案' }}</button>
  210. </view>
  211. <text v-if="lastPlan" class="plan-goal">{{ lastPlan }}</text>
  212. <text v-else class="plan-hint">选维度 + 选成员 + 设定目标 → 生成</text>
  213. </view>
  214. </view>
  215. <ArticleBookshelf :articles="healthArticles" :isLoggedIn="true" @articleClick="goArticleDetail" @moreArticles="goMoreArticles" />
  216. </block>
  217. </view>
  218. </template>
  219. <script>
  220. import LoginGuideCard from '../../components/LoginGuideCard.vue'
  221. import RadarChart from '../../components/RadarChart.vue'
  222. import ArticleBookshelf from '../../components/ArticleBookshelf.vue'
  223. import ReportUploadCard from '../../components/report-upload-card.vue'
  224. import { parseDate } from '../../utils/format.js'
  225. export default {
  226. components: { LoginGuideCard, RadarChart, ArticleBookshelf, ReportUploadCard },
  227. data() {
  228. return {
  229. isLoggedIn: !!uni.getStorageSync('token'),
  230. currentTab: 'body',
  231. selectedMemberName: '',
  232. selectedMemberId: '',
  233. reports: [],
  234. lastPlan: '',
  235. lastPlanId: null,
  236. healthArticles: [],
  237. hasAiQHistory: false,
  238. pendingSurveys: [],
  239. tabs: [
  240. { code: 'body', label: '健康', icon: '🟠', color: '#FF8C42' },
  241. { code: 'cognitive', label: '认知', icon: '🧠', color: '#6366F1' },
  242. { code: 'mental', label: '心理', icon: '💖', color: '#FF6B9D' },
  243. { code: 'relationship', label: '社会性', icon: '🤝', color: '#10B981' },
  244. { code: 'wealth', label: '财富', icon: '💧', color: '#F59E0B' }
  245. ],
  246. quizzes: [
  247. { code: 'cognitive', label: '认知能力测评', icon: '🧠', score: null },
  248. { code: 'mental', label: '心理健康测评', icon: '💖', score: null },
  249. { code: 'relationship', label: '关系质量测评', icon: '🤝', score: null }
  250. ],
  251. demoBodyDims: [
  252. { label: '生长发育', key: 'growth' },
  253. { label: '睡眠质量', key: 'sleep' },
  254. { label: '视力健康', key: 'vision' },
  255. { label: '免疫力', key: 'immunity' },
  256. { label: '营养均衡', key: 'nutrition' },
  257. { label: '肠胃健康', key: 'gut' },
  258. { label: '运动活力', key: 'exercise' }
  259. ],
  260. demoCogDims: [
  261. { label: '记忆力', key: 'memory' },
  262. { label: '注意力', key: 'attention' },
  263. { label: '逻辑推理', key: 'logic' },
  264. { label: '空间想象', key: 'spatial' },
  265. { label: '语言表达', key: 'language' }
  266. ],
  267. demoBodyScores: [72, 68, 75, 80, 70, 78, 82],
  268. demoCogScores: [78, 72, 85, 68, 80],
  269. // 真实数据缓存
  270. bodyData: null,
  271. cognitiveData: null,
  272. cognitiveFamilyData: [],
  273. emiData: null,
  274. emiFamilyData: [],
  275. relationshipData: [],
  276. energySandbox: null,
  277. wealthDetail: null,
  278. childrenList: [],
  279. relationshipEmpty: false
  280. }
  281. },
  282. computed: {
  283. currentTabLabel: function() {
  284. var tab = this.tabs.filter(function(t) { return t.code === this.currentTab }.bind(this))[0]
  285. return tab ? tab.label : ''
  286. },
  287. currentColor: function() {
  288. var tab = this.tabs.filter(function(t) { return t.code === this.currentTab }.bind(this))[0]
  289. return tab ? tab.color : '#FF8C42'
  290. },
  291. currentDimensions: function() {
  292. if (this.currentTab === 'cognitive') {
  293. return [{ label:'记忆力',key:'memory'},{ label:'注意力',key:'attention'},{ label:'逻辑推理',key:'logic'},{ label:'空间想象',key:'spatial'},{ label:'感知能力',key:'perception'},{ label:'专注力',key:'focus'},{ label:'加工速度',key:'processingSpeed' }]
  294. }
  295. if (this.currentTab === 'mental') {
  296. return [{ label:'开放性',key:'openness'},{ label:'尽责性',key:'conscientiousness'},{ label:'外向性',key:'extraversion'},{ label:'宜人性',key:'agreeableness'},{ label:'神经质',key:'neuroticism'},{ label:'自主性',key:'driveAutonomy'},{ label:'胜任感',key:'driveCompetence'},{ label:'归属感',key:'driveRelatedness'},{ label:'情绪稳定性',key:'emotionStability'},{ label:'自我概念',key:'selfConceptOverall' }]
  297. }
  298. if (this.currentTab === 'relationship') {
  299. return [{ label:'亲子信任',key:'parentTrust'},{ label:'亲子亲密度',key:'parentIntimacy'},{ label:'沟通质量',key:'communication'},{ label:'关系健康度',key:'healthStatus'},{ label:'最近互动',key:'lastInteraction' }]
  300. }
  301. if (this.currentTab === 'wealth') {
  302. var isChild = !!uni.getStorageSync('currentChildId')
  303. if (isChild) {
  304. return [{ label:'学业能力',key:'skill'},{ label:'利他贡献',key:'altruism'},{ label:'积分积累',key:'income'},{ label:'财务素养',key:'fx' }]
  305. }
  306. return [{ label:'个人能力',key:'skill'},{ label:'利他贡献',key:'altruism'},{ label:'CF值积累',key:'income'},{ label:'财务素养',key:'fx' }]
  307. }
  308. return [{ label:'生长发育',key:'growth'},{ label:'睡眠质量',key:'sleep'},{ label:'视力健康',key:'vision'},{ label:'免疫力',key:'immunity'},{ label:'营养均衡',key:'nutrition'},{ label:'肠胃健康',key:'gut'},{ label:'运动活力',key:'exercise' }]
  309. },
  310. currentScores: function() {
  311. if (this.chartIsEmpty) {
  312. var dims = this.currentDimensions, scores = []
  313. for (var i = 0; i < dims.length; i++) scores.push(0)
  314. return scores
  315. }
  316. if (this.currentTab === 'cognitive') {
  317. return [
  318. this._cognitiveScore('memoryScore'),
  319. this._cognitiveScore('attentionScore'),
  320. this._cognitiveScore('logicScore'),
  321. this._cognitiveScore('spatialScore'),
  322. this._cognitiveScore('perceptionScore'),
  323. this._cognitiveScore('focusScore'),
  324. this._cognitiveScore('processingSpeedScore')
  325. ]
  326. }
  327. if (this.currentTab === 'mental') {
  328. return [
  329. this._emiScore('opennessScore'),
  330. this._emiScore('conscientiousnessScore'),
  331. this._emiScore('extraversionScore'),
  332. this._emiScore('agreeablenessScore'),
  333. this._emiScore('neuroticismScore'),
  334. this._emiScore('driveAutonomy'),
  335. this._emiScore('driveCompetence'),
  336. this._emiScore('driveRelatedness'),
  337. this._emiScore('emotionStability'),
  338. this._emiScore('selfConceptOverall')
  339. ]
  340. }
  341. if (this.currentTab === 'relationship') {
  342. return [
  343. this._relScore('trustScore'),
  344. this._relScore('intimacyScore'),
  345. this._relScore('communicationScore'),
  346. this._relScore('totalScore'),
  347. 0
  348. ]
  349. }
  350. if (this.currentTab === 'wealth') {
  351. var d = this.wealthDetail
  352. if (!d) return [0, 0, 0, 0]
  353. return [d.wealthSkill || 0, d.wealthAltruism || 0, d.wealthIncome || 0, d.wealthFx || 0]
  354. }
  355. // body: 从 API 真实维度数据取分
  356. if (this.bodyData && this.bodyData.dimensions && this.bodyData.dimensions.length > 0) {
  357. return this.bodyData.dimensions.map(function(d) { return Number(d.score) || 0 })
  358. }
  359. // body: fallback to demo
  360. if (this.reports.length > 0) {
  361. var latest = this.reports[0]
  362. if (latest.overallScore) return [72, 68, 75, 80, 70, 78, 82]
  363. }
  364. return [72, 68, 75, 80, 70, 78, 82]
  365. },
  366. currentAvgScores: function() {
  367. if (this.chartIsEmpty) return []
  368. if (this.currentTab === 'cognitive' && this.cognitiveFamilyData.length > 0) {
  369. var keys = ['memoryScore','attentionScore','logicScore','spatialScore','perceptionScore','focusScore','processingSpeedScore']
  370. var avgs = []
  371. for (var k = 0; k < keys.length; k++) {
  372. var sum = 0
  373. for (var i = 0; i < this.cognitiveFamilyData.length; i++) {
  374. var v = this.cognitiveFamilyData[i][keys[k]]
  375. if (typeof v === 'number' && v > 0) sum += v
  376. }
  377. avgs.push(Math.round(sum / this.cognitiveFamilyData.length))
  378. }
  379. return avgs
  380. }
  381. if (this.currentTab === 'mental' && this.emiFamilyData.length > 0) {
  382. var keys2 = ['opennessScore','conscientiousnessScore','extraversionScore','agreeablenessScore','neuroticismScore','driveAutonomy','driveCompetence','driveRelatedness','emotionStability','selfConceptOverall']
  383. var avgs2 = []
  384. for (var k2 = 0; k2 < keys2.length; k2++) {
  385. var sum2 = 0
  386. for (var i2 = 0; i2 < this.emiFamilyData.length; i2++) {
  387. var v2 = this.emiFamilyData[i2][keys2[k2]]
  388. if (typeof v2 === 'number' && v2 > 0) sum2 += v2
  389. }
  390. avgs2.push(Math.round(sum2 / this.emiFamilyData.length))
  391. }
  392. return avgs2
  393. }
  394. if (this.currentTab === 'relationship' && this.relationshipData.length > 0) {
  395. return [this._relScore('trustScore'), this._relScore('intimacyScore'), this._relScore('communicationScore'), this._relScore('totalScore'), 0]
  396. }
  397. if (this.currentTab === 'wealth' && this.wealthDetail) {
  398. var d = this.wealthDetail
  399. return [d.wealthSkill || 0, d.wealthAltruism || 0, d.wealthIncome || 0, d.wealthFx || 0]
  400. }
  401. return []
  402. },
  403. chartIsEmpty: function() {
  404. if (this.currentTab === 'body') return !this.bodyData || !this.bodyData.dimensions || this.bodyData.dimensions.length === 0
  405. if (this.currentTab === 'cognitive') return !this.cognitiveData || !this.cognitiveData.overallScore
  406. if (this.currentTab === 'mental') return !this.emiData || !this.emiData.overallScore
  407. if (this.currentTab === 'relationship') return !this.relationshipData || this.relationshipData.length === 0
  408. if (this.currentTab === 'wealth') return !this.wealthDetail
  409. var quiz = this.quizzes.filter(function(q) { return q.code === this.currentTab }.bind(this))[0]
  410. return !(quiz && quiz.score)
  411. }
  412. },
  413. onShow() {
  414. this.isLoggedIn = !!uni.getStorageSync('token')
  415. if (this.isLoggedIn) {
  416. var stored = uni.getStorageSync('currentChildId') || uni.getStorageSync('currentMemberId') || ''
  417. if (stored) {
  418. var n = parseInt(stored, 10)
  419. this.selectedMemberId = isNaN(n) ? stored : n
  420. this.selectedMemberName = uni.getStorageSync('currentChildName') || '成员'
  421. }
  422. this.loadHealthData()
  423. this.loadPlanList()
  424. this.loadPendingSurveys()
  425. } else {
  426. this.pendingSurveys = []
  427. }
  428. },
  429. methods: {
  430. _cognitiveScore: function(key) {
  431. if (!this.cognitiveData) return 0
  432. var v = this.cognitiveData[key]
  433. return (typeof v === 'number' && v > 0) ? v : 0
  434. },
  435. _emiScore: function(key) {
  436. if (!this.emiData) return 0
  437. var v = this.emiData[key]
  438. return (typeof v === 'number' && v > 0) ? v : 0
  439. },
  440. _relScore: function(key) {
  441. if (!this.relationshipData || this.relationshipData.length === 0) return 0
  442. var total = 0, count = 0
  443. for (var i = 0; i < this.relationshipData.length; i++) {
  444. var item = this.relationshipData[i]
  445. if (item[key] != null) { total += Number(item[key]); count++ }
  446. }
  447. return count > 0 ? Math.round(total / count) : 0
  448. },
  449. _wealthScore: function(key) {
  450. if (!this.energySandbox) return 0
  451. var v = this.energySandbox[key]
  452. return (typeof v === 'number' && v > 0) ? v : 0
  453. },
  454. switchTab: function(code) { this.currentTab = code },
  455. goPage: function(url) { uni.navigateTo({ url: url }) },
  456. goQuiz: function(code) {
  457. var url = '/pages/body-detail/dimension-questionnaire?dim=' + code
  458. if (this.selectedMemberId) url += '&memberId=' + this.selectedMemberId
  459. uni.navigateTo({ url: url })
  460. },
  461. goReportDetail: function(report) {
  462. if (!report || !report.id) return
  463. var type = report.reportType || 'gut_flora'
  464. var url
  465. if (type === 'dan') {
  466. url = '/pages/dan-assessment/report-result?reportId=' + report.id
  467. } else if (type === 'gut_flora') {
  468. url = '/pages/health/gut-flora-detail?reportId=' + report.id
  469. } else {
  470. url = '/pages/health/report-detail?reportType=' + type + '&reportId=' + report.id
  471. }
  472. uni.navigateTo({ url: url })
  473. },
  474. _reportTypeLabel: function(type) {
  475. var map = { gut_flora: '肠道', physical_exam: '体检', tongue: '舌诊', blood: '血液' }
  476. return map[type] || '健康报告'
  477. },
  478. _reportTypeClass: function(type) {
  479. var map = { gut_flora: 'gut', physical_exam: 'exam', tongue: 'tongue', blood: 'blood' }
  480. return map[type] || 'default'
  481. },
  482. _statusClass: function(status) {
  483. return status === 'resolved' ? 'resolved' : 'pending'
  484. },
  485. goSelfTest: function() { uni.navigateTo({ url: '/pages/family/self-check' }) },
  486. // 拉取本期待填调研(服务端按 cycle_type 计算当前周期)
  487. loadPendingSurveys: function() {
  488. var self = this
  489. var api = require('../../utils/api.js')
  490. api.getSurveyStatus({}).then(function(res) {
  491. var list = (res && res.code === 200 && res.data) ? res.data : []
  492. var pending = []
  493. for (var i = 0; i < list.length; i++) {
  494. if (list[i] && list[i].status === 'pending') pending.push(list[i])
  495. }
  496. self.pendingSurveys = pending
  497. }).catch(function() { self.pendingSurveys = [] })
  498. },
  499. surveyKey: function(item) { return item && item.templateId ? item.templateId : Math.random() },
  500. cycleLabel: function(cycleType) {
  501. var map = { weekly: '每周调研', biweekly: '双周调研', monthly: '每月调研' }
  502. return map[cycleType] || '定期调研'
  503. },
  504. goSurveyFill: function(item) {
  505. if (!item || !item.templateId) return
  506. var url = '/pages/health/survey-questionnaire?templateId=' + item.templateId +
  507. '&templateTitle=' + encodeURIComponent(item.title || '定期调研') +
  508. '&templateDimension=' + encodeURIComponent(item.dimension || '') +
  509. '&periodStart=' + (item.periodStart || '') +
  510. '&periodEnd=' + (item.periodEnd || '')
  511. uni.navigateTo({ url: url })
  512. },
  513. goPlanSummary: function() {
  514. var url = '/pages/health/health-plan-summary'
  515. if (this.lastPlanId) {
  516. url += '?planId=' + this.lastPlanId
  517. }
  518. var mid = this.selectedMemberId
  519. if (mid) {
  520. url += (url.indexOf('?') >= 0 ? '&' : '?') + 'memberId=' + mid
  521. }
  522. uni.navigateTo({ url: url })
  523. },
  524. loadHealthData: function() {
  525. var self = this
  526. try {
  527. var api = require('../../utils/api.js')
  528. var memberId = uni.getStorageSync('currentChildId') || uni.getStorageSync('currentMemberId') || uni.getStorageSync('userId') || ''
  529. // 健康报告:不传 memberId,由后端返回当前家庭的全部报告(size=3 仅返回最近 3 条)
  530. api.getReportList(null, 3).then(function(res) {
  531. if (res.code === 200 && res.data) {
  532. var list = Array.isArray(res.data) ? res.data : (res.data.list || [])
  533. self.reports = list
  534. }
  535. }).catch(function() {})
  536. // 身体七维概览
  537. if (memberId) {
  538. api.getDimensionOverview({ memberId: memberId }).then(function(res) {
  539. if (res.code === 200 && res.data) self.bodyData = res.data
  540. }).catch(function() {})
  541. }
  542. // 文章
  543. api.getFeaturedArticles({ size: 3, dimensionCode: 'body' }).then(function(res) {
  544. if (res.code === 200 && res.data) {
  545. var list = Array.isArray(res.data) ? res.data : (res.data.records || [])
  546. self.healthArticles = list.slice(0, 3) || []
  547. }
  548. }).catch(function() {})
  549. // 认知测评得分
  550. if (memberId) {
  551. api.getCognitiveChildScores(memberId).then(function(res) {
  552. if (res.code === 200) self.cognitiveData = res.data || null
  553. }).catch(function() {})
  554. api.getCognitiveFamilyScores().then(function(res) {
  555. if (res.code === 200 && Array.isArray(res.data)) self.cognitiveFamilyData = res.data
  556. }).catch(function() {})
  557. }
  558. // EMI心理报告
  559. if (memberId) {
  560. api.getEmiReport(memberId).then(function(res) {
  561. if (res.code === 200) self.emiData = res.data || null
  562. }).catch(function() {})
  563. }
  564. // 关系质量评分
  565. api.getRelationshipScores().then(function(res) {
  566. if (res.code === 200 && Array.isArray(res.data) && res.data.length > 0) {
  567. self.relationshipData = res.data
  568. self.relationshipEmpty = false
  569. } else {
  570. self.relationshipEmpty = true
  571. }
  572. }).catch(function() { self.relationshipEmpty = true })
  573. // 财富子维度:沙盘里家长用 userId,孩子用 family_members.id,不能混用 currentMemberId
  574. var childId = uni.getStorageSync('currentChildId')
  575. var wealthMemberId = childId || uni.getStorageSync('userId')
  576. var wealthMemberType = childId ? 'child' : 'parent'
  577. if (wealthMemberId) {
  578. api.getWealthDetail(wealthMemberId, wealthMemberType).then(function(res) {
  579. if (res.code === 200 && res.data) {
  580. self.wealthDetail = res.data
  581. }
  582. }).catch(function() {})
  583. }
  584. } catch (e) { console.error('加载健康数据失败', e) }
  585. },
  586. loadPlanList: function() {
  587. var self = this
  588. var api = require('../../utils/api.js')
  589. api.getHealthPlanList({}).then(function(res) {
  590. if (res && res.code === 200 && res.data) {
  591. var list = res.data.list || res.data
  592. var plans = Array.isArray(list) ? list : []
  593. if (plans.length > 0) {
  594. self.lastPlan = plans[0].goal || plans[0].memberName || '已有健康方案'
  595. self.lastPlanId = plans[0].id || null
  596. } else {
  597. self.lastPlan = ''
  598. self.lastPlanId = null
  599. }
  600. } else {
  601. self.lastPlan = ''
  602. self.lastPlanId = null
  603. }
  604. }).catch(function() {
  605. self.lastPlan = ''
  606. self.lastPlanId = null
  607. })
  608. },
  609. goArticleDetail: function(article) {
  610. var id = article && article.id || article
  611. uni.navigateTo({ url: '/pages/article-center/article-detail?id=' + id })
  612. },
  613. goMoreArticles: function() {
  614. uni.navigateTo({ url: '/pages/article-center/index?dimension=body' })
  615. },
  616. _formatReportDate: function(dateStr) {
  617. if (!dateStr) return ''
  618. // 后端返回 ISO 8601 (2026-08-15T14:30:00) 或 yyyy-MM-dd,统一截取前10位
  619. var s = String(dateStr)
  620. return s.length >= 10 ? s.substring(0, 10) : s
  621. },
  622. }
  623. }
  624. </script>
  625. <style scoped>
  626. .container { background: #F8F8F8; min-height: 100vh; padding-bottom: calc(160rpx + env(safe-area-inset-bottom)); }
  627. .section { margin: 16rpx 24rpx; }
  628. .tab-bar { display: flex; background: #fff; margin: 0 24rpx 16rpx; border-radius: 16rpx; padding: 8rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06); }
  629. .tab-item { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 12rpx 0; position: relative; border-radius: 12rpx; }
  630. .tab-item.active { background: #FFF7ED; }
  631. .tab-icon { font-size: 32rpx; margin-bottom: 4rpx; }
  632. .tab-label { font-size: 26rpx; color: #666; font-weight: 500; }
  633. .tab-item.active .tab-label { color: #333; font-weight: bold; }
  634. .tab-underline { width: 40rpx; height: 4rpx; border-radius: 2rpx; margin-top: 6rpx; }
  635. .section-chart { position: relative; margin: 0 24rpx 16rpx; }
  636. .chart-empty { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 3; background: rgba(255,255,255,0.85); border-radius: 12rpx; padding: 20rpx 30rpx; }
  637. .chart-empty .empty-text { font-size: 28rpx; color: #333; font-weight: 500; display: block; }
  638. .chart-empty .empty-sub { font-size: 22rpx; color: #999; display: block; margin-top: 4rpx; }
  639. .section-dc-header { margin: 20rpx 24rpx 8rpx; }
  640. .dc-title-row { display: flex; align-items: center; }
  641. .dc-icon { font-size: 32rpx; margin-right: 8rpx; }
  642. .dc-title { font-size: 32rpx; font-weight: bold; color: #333; }
  643. .section-data-collect { margin: 8rpx 24rpx; }
  644. .data-card { display: flex; align-items: center; background: #fff; border-radius: 20rpx; padding: 24rpx; margin-bottom: 12rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06); }
  645. .data-card-icon { width: 88rpx; height: 88rpx; border-radius: 20rpx; display: flex; align-items: center; justify-content: center; margin-right: 20rpx; font-size: 40rpx; }
  646. .data-card-info { flex: 1; }
  647. .data-card-title { font-size: 28rpx; font-weight: bold; color: #333; display: block; margin-bottom: 6rpx; }
  648. .data-card-desc { font-size: 22rpx; color: #999; }
  649. .data-card-arrow { font-size: 36rpx; color: #ccc; }
  650. .data-card-assessment { flex-direction: column; align-items: stretch; padding: 24rpx; }
  651. .data-card-head { display: flex; align-items: center; margin-bottom: 16rpx; }
  652. .data-card-subtitle { font-size: 22rpx; color: #999; margin-left: 12rpx; }
  653. .quiz-item { display: flex; align-items: center; padding: 16rpx 0; border-top: 1rpx solid #f0f0f0; }
  654. .quiz-item:first-of-type { border-top: none; }
  655. .quiz-info { display: flex; align-items: center; flex: 1; }
  656. .quiz-icon { font-size: 36rpx; margin-right: 16rpx; }
  657. .quiz-label { font-size: 28rpx; color: #333; }
  658. .quiz-score { display: flex; align-items: baseline; margin-right: 16rpx; }
  659. .score-value { font-size: 36rpx; font-weight: bold; color: #F97316; }
  660. .score-unit { font-size: 22rpx; color: #999; margin-left: 4rpx; }
  661. .quiz-btn { background: #F97316; color: #fff; font-size: 24rpx; border: none; border-radius: 20rpx; padding: 10rpx 30rpx; height: 56rpx; line-height: 36rpx; margin: 0; }
  662. .section-data-view { margin: 16rpx 24rpx; }
  663. .section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12rpx; }
  664. .section-title { font-size: 28rpx; font-weight: bold; color: #333; }
  665. .section-more { font-size: 24rpx; color: #F97316; }
  666. .report-card { display: flex; align-items: center; background: #fff; border-radius: 16rpx; padding: 16rpx 20rpx; margin-bottom: 10rpx; }
  667. .report-type-badge { font-size: 20rpx; padding: 4rpx 12rpx; border-radius: 8rpx; margin-right: 12rpx; flex-shrink: 0; font-weight: 600; }
  668. .report-type-badge.badge-gut { background: rgba(249,115,22,0.12); color: #F97316; }
  669. .report-type-badge.badge-exam { background: rgba(99,102,241,0.12); color: #6366F1; }
  670. .report-type-badge.badge-tongue { background: rgba(16,185,129,0.12); color: #10B981; }
  671. .report-type-badge.badge-blood { background: rgba(239,68,68,0.12); color: #EF4444; }
  672. .report-type-badge.badge-default { background: rgba(107,114,128,0.12); color: #6B7280; }
  673. .report-info { flex: 1; min-width: 0; }
  674. .report-name { font-size: 26rpx; color: #333; font-weight: 600; display: block; margin-bottom: 4rpx; }
  675. .report-meta { font-size: 20rpx; color: #999; display: block; }
  676. .report-score-wrap { display: flex; flex-direction: column; align-items: flex-end; margin-right: 8rpx; flex-shrink: 0; }
  677. .report-score { font-size: 32rpx; font-weight: bold; color: #F97316; line-height: 1; }
  678. .report-status { font-size: 20rpx; margin-top: 4rpx; }
  679. .report-status.status-resolved { color: #10B981; }
  680. .report-status.status-pending { color: #F59E0B; }
  681. .report-arrow { font-size: 28rpx; color: #ccc; }
  682. .empty-hint { text-align: center; padding: 30rpx 0; background: #fff; border-radius: 16rpx; }
  683. .empty-hint .empty-text { font-size: 26rpx; color: #999; display: block; }
  684. .empty-hint .empty-sub { font-size: 22rpx; color: #ccc; display: block; margin-top: 6rpx; }
  685. .section-plan { margin: 8rpx 24rpx 16rpx; }
  686. .plan-card { background: #fff; border-radius: 20rpx; padding: 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06); }
  687. .plan-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12rpx; }
  688. .plan-title { font-size: 28rpx; font-weight: bold; color: #333; }
  689. .plan-btn { background: linear-gradient(135deg, #F97316, #FB923C); color: #fff; font-size: 24rpx; border: none; border-radius: 20rpx; padding: 10rpx 28rpx; height: 56rpx; line-height: 36rpx; margin: 0; }
  690. .plan-goal { font-size: 24rpx; color: #666; line-height: 1.5; display: block; margin-top: 12rpx; }
  691. .plan-hint { font-size: 22rpx; color: #999; display: block; margin-top: 12rpx; }
  692. /* ===== 游客态样式 ===== */
  693. .brand-strap { margin: 0 24rpx 16rpx; background: linear-gradient(135deg, #FFF7ED, rgba(249,115,22,0.08)); border-radius: 16rpx; padding: 20rpx 24rpx; }
  694. .brand-strap-text { font-size: 26rpx; color: #F97316; font-weight: 600; }
  695. .pain-card { margin: 0 24rpx 16rpx; background: #fff; border-radius: 20rpx; padding: 28rpx; border-left: 6rpx solid #F97316; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06); }
  696. .pain-quote { font-size: 32rpx; font-weight: bold; color: #333; display: block; margin-bottom: 8rpx; }
  697. .pain-desc { font-size: 26rpx; color: #888; display: block; }
  698. .guest-features { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 24rpx 16rpx; }
  699. .feat-card { width: 48.5%; box-sizing: border-box; background: #fff; border-radius: 20rpx; padding: 24rpx 20rpx; margin-bottom: 16rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06); }
  700. .feat-icon { font-size: 44rpx; display: block; margin-bottom: 10rpx; }
  701. .feat-title { font-size: 26rpx; font-weight: 600; color: #333; display: block; margin-bottom: 4rpx; }
  702. .feat-desc { font-size: 22rpx; color: #999; display: block; }
  703. .self-test-card { margin: 0 24rpx 16rpx; background: linear-gradient(135deg, #667eea, #764ba2); border-radius: 20rpx; padding: 24rpx 28rpx; }
  704. .self-test-head { display: flex; align-items: center; }
  705. .self-test-icon { font-size: 40rpx; margin-right: 16rpx; }
  706. .self-test-info { flex: 1; }
  707. .self-test-title { font-size: 28rpx; font-weight: bold; color: #fff; display: block; }
  708. .self-test-sub { font-size: 22rpx; color: rgba(255,255,255,0.8); display: block; margin-top: 4rpx; }
  709. .ai-q-entry { margin: 0 24rpx 16rpx; background: linear-gradient(135deg, #F97316, #F59E0B); border-radius: 20rpx; padding: 24rpx 28rpx; }
  710. .reminder-icon { font-size: 40rpx; margin-right: 16rpx; flex-shrink: 0; }
  711. .reminder-body { flex: 1; min-width: 0; }
  712. .reminder-text { font-size: 26rpx; font-weight: 600; color: #333; display: block; }
  713. .reminder-sub { font-size: 22rpx; color: #999; margin-top: 4rpx; display: block; line-height: 1.4; }
  714. .reminder-arrow { font-size: 28rpx; color: #F97316; flex-shrink: 0; }
  715. .ai-q-head { display: flex; align-items: center; }
  716. .ai-q-icon { font-size: 40rpx; margin-right: 16rpx; }
  717. .ai-q-info { flex: 1; }
  718. .q-title { font-size: 28rpx; font-weight: bold; color: #fff; display: block; }
  719. .ai-q-sub { font-size: 22rpx; color: rgba(255,255,255,0.85); display: block; margin-top: 4rpx; }
  720. .self-test-arrow { font-size: 36rpx; color: rgba(255,255,255,0.7); }
  721. .demo-section { margin: 0 24rpx 16rpx; }
  722. .demo-section-head { margin-bottom: 8rpx; }
  723. .demo-section-title { font-size: 30rpx; font-weight: bold; color: #333; display: block; }
  724. .demo-section-sub { font-size: 22rpx; color: #999; display: block; margin-top: 4rpx; }
  725. .demo-chart-title-row { display: flex; align-items: center; justify-content: space-between; margin: 8rpx 8rpx 0; padding: 0 8rpx; }
  726. .demo-chart-name { font-size: 26rpx; font-weight: 600; color: #333; }
  727. .demo-chart-tag { font-size: 20rpx; color: #F97316; background: rgba(249,115,22,0.1); border-radius: 8rpx; padding: 4rpx 12rpx; }
  728. .login-guide-section { margin: 0 24rpx 24rpx; }
  729. /* ===== 五维闭环体系样式 ===== */
  730. .wuxing-section { margin: 0 24rpx 16rpx; background: #fff; border-radius: 20rpx; padding: 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06); }
  731. .wuxing-title { font-size: 30rpx; font-weight: bold; color: #333; text-align: center; margin-bottom: 6rpx; }
  732. .wuxing-desc { font-size: 22rpx; color: #999; text-align: center; margin-bottom: 20rpx; }
  733. .wuxing-diagram { position: relative; height: 320rpx; margin: 0 auto 20rpx; }
  734. .wuxing-relations { margin-top: 8rpx; }
  735. .rel-group { margin-bottom: 16rpx; }
  736. .rel-title { font-size: 24rpx; font-weight: bold; color: #333; margin-bottom: 8rpx; display: block; }
  737. .rel-chain { display: flex; flex-wrap: wrap; align-items: center; gap: 4rpx; margin-bottom: 6rpx; }
  738. .rel-item { font-size: 22rpx; padding: 4rpx 10rpx; border-radius: 8rpx; background: #f7f7f7; color: #555; }
  739. .rel-arrow { font-size: 20rpx; color: #F97316; font-weight: bold; }
  740. .rel-dot { font-size: 20rpx; color: #ccc; }
  741. .rel-hint { font-size: 20rpx; color: #999; line-height: 1.5; display: block; }
  742. .wuxing-cards { display: flex; flex-direction: column; gap: 10rpx; margin-top: 16rpx; }
  743. .wc-card { display: flex; align-items: center; padding: 16rpx 20rpx; border-radius: 16rpx; border: 2rpx solid #f0f0f0; }
  744. .wc-card:active { opacity: 0.85; }
  745. .wc-icon { font-size: 36rpx; margin-right: 16rpx; flex-shrink: 0; }
  746. .wc-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
  747. .wc-name { font-size: 24rpx; font-weight: 600; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  748. .wc-text { font-size: 20rpx; color: #999; display: block; margin-top: 4rpx; white-space: normal; }
  749. .wc-body { border-color: rgba(255,140,66,0.3); background: rgba(255,140,66,0.04); border-left: 8rpx solid #FF8C42; }
  750. .wc-body .wc-name { color: #FF8C42; }
  751. .wc-wisdom { border-color: rgba(99,102,241,0.3); background: rgba(99,102,241,0.04); border-left: 8rpx solid #6366F1; }
  752. .wc-wisdom .wc-name { color: #6366F1; }
  753. .wc-wealth { border-color: rgba(245,158,11,0.3); background: rgba(245,158,11,0.04); border-left: 8rpx solid #F59E0B; }
  754. .wc-wealth .wc-name { color: #F59E0B; }
  755. .wc-action { border-color: rgba(16,185,129,0.3); background: rgba(16,185,129,0.04); border-left: 8rpx solid #10B981; }
  756. .wc-action .wc-name { color: #10B981; }
  757. .wc-mind { border-color: rgba(255,107,157,0.3); background: rgba(255,107,157,0.04); border-left: 8rpx solid #FF6B9D; }
  758. .wc-mind .wc-name { color: #FF6B9D; }
  759. .survey-pending-tag { flex-shrink: 0; font-size: 20rpx; color: #fff; background: #F97316; padding: 6rpx 16rpx; border-radius: 999rpx; }
  760. </style>