166 lines
6.8 KiB
Vue
166 lines
6.8 KiB
Vue
<template>
|
||
<view class="p-[24rpx_28rpx] flex flex-col align-center gap-3 overflow-y-auto pb-[140rpx]">
|
||
<!-- ========== 标题 ========== -->
|
||
<view class="text-center pb-[24rpx] border-b-2 border-[#f0f2f5]">
|
||
<!-- 标题文字 -->
|
||
<wd-text
|
||
:text="report.title"
|
||
type="primary"
|
||
size="40rpx"
|
||
bold
|
||
custom-class="block"
|
||
/>
|
||
<!-- 副标题/日期 -->
|
||
<view class="mt-[8rpx]">
|
||
<wd-text text="—— 月度健康报告 · 为你定制 ——" size="24rpx" color="#999" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="p-[24rpx_28rpx] bg-gradient-to-r from-[#f0f6ff] to-[#f8faff] rounded-[16rpx] border-l-4 border-[#4A90D9] shadow-[0_2rpx_12rpx_rgba(74,144,217,0.12)]">
|
||
<wd-text
|
||
:text="report.greeting"
|
||
size="28rpx"
|
||
line-height="48rpx"
|
||
color="#2c3e50"
|
||
/>
|
||
</view>
|
||
|
||
<!-- ========== 各指标卡片 ========== -->
|
||
<view
|
||
v-for="section in report.sections"
|
||
:key="section.type"
|
||
class="p-[24rpx_28rpx] rounded-[16rpx] border-l-4 flex flex-col gap-3"
|
||
:class="[section.hasAbnormal ? 'bg-[#fdf8f7] border-[#e74c3c]' : 'bg-[#fafbfc] border-[#4A90D9]']"
|
||
>
|
||
<!-- 标题行：图标 + 标题 + 状态标签 -->
|
||
<view class="flex items-center justify-between">
|
||
<view class="flex items-center gap-1">
|
||
<wd-text :text="section.emoji" size="36rpx" custom-class="mr-[12rpx]" />
|
||
<wd-text :text="section.title" size="32rpx" bold color="#1a2a3a" />
|
||
</view>
|
||
<wd-tag :type="section.hasAbnormal ? 'danger' : 'primary'" round>
|
||
{{ section.hasAbnormal ? '需关注' : '正常' }}
|
||
</wd-tag>
|
||
</view>
|
||
|
||
<!-- 数据内容 -->
|
||
<wd-text :text="section.data" size="28rpx" line-height="44rpx" color="#34495e" custom-class="block"/>
|
||
|
||
<!-- 建议 -->
|
||
<view class="p-[14rpx_18rpx] rounded-[10rpx]" :class="[section.hasAbnormal ? 'bg-[#fef0ef]' : 'bg-[#eef5ff]']">
|
||
<wd-text
|
||
:text="(section.hasAbnormal ? '⚠️ ' : '💡 ') + section.suggestion"
|
||
:type="section.hasAbnormal ? 'error' : 'primary'"
|
||
size="26rpx"
|
||
line-height="44rpx"
|
||
/>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- ========== 下月健康建议 ========== -->
|
||
<view class="flex flex-col gap-3 p-[28rpx_24rpx] bg-gradient-to-r from-[#fafffe] to-[#f5fcf9] rounded-[16rpx] border-2 border-[#e8f5ee]">
|
||
<wd-text text="📋 健康建议" type="success" size="32rpx" bold />
|
||
|
||
<!-- 建议列表 -->
|
||
<view
|
||
v-for="(tip, index) in report.tips"
|
||
:key="index"
|
||
class="flex items-start py-[14rpx] border-b border-[#f0f5f2] last:border-none"
|
||
>
|
||
<!-- 序号圆点 -->
|
||
<view class="shrink-0 w-[40rpx] h-[40rpx] mr-[16rpx] mt-[4rpx] bg-[#4A90D9] rounded-full text-center leading-[40rpx]">
|
||
<wd-text :text="String(index + 1)" size="22rpx" bold color="#ffffff" />
|
||
</view>
|
||
<!-- 建议内容 -->
|
||
<wd-text
|
||
:text="tip"
|
||
size="26rpx"
|
||
line-height="44rpx"
|
||
color="#2c3e50"
|
||
custom-class="flex-1"
|
||
/>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- ========== 结束语 ========== -->
|
||
<view class="p-[28rpx_32rpx] bg-gradient-to-r from-[#f0f7ff] to-[#e8f0fe] rounded-[16rpx] text-center border border-[#dce8f5]">
|
||
<wd-text
|
||
:text="report.ending"
|
||
size="28rpx"
|
||
line-height="48rpx"
|
||
color="#2c3e50"
|
||
custom-class="block"
|
||
/>
|
||
</view>
|
||
|
||
<view class="fixed bottom-0 left-0 right-0 p-[32rpx] bg-white border-t border-[#f0f2f5]">
|
||
<wd-button type="primary" block @click="goHome">
|
||
返回主页
|
||
</wd-button>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref } from 'vue'
|
||
import type { IAiReport } from "@/type/report";
|
||
|
||
const report = ref<IAiReport>({
|
||
title: "Cxx的健康月报 · 2026年9月",
|
||
greeting: "Cxx你好！这个月你完成了3天的健康数据记录，虽然覆盖还不算全面，但坚持记录就是好的开始。当前体重约69.9kg，BMI约24.2，略高于标准上限，结合你的均衡饮食目标，可以先从调整饮食和增加活动入手。本月亮点是睡眠达标且空腹血糖正常，但血压呈现升高趋势，需要多加留意。",
|
||
sections: [
|
||
{
|
||
type: "weight",
|
||
emoji: "⚖️",
|
||
title: "体重",
|
||
hasAbnormal: false,
|
||
data: "体重从70kg降至69.7kg，整体平稳，平均69.9kg，波动幅度仅0.3kg。根据身高170cm计算，BMI约24.2，略超标准范围上限。",
|
||
suggestion: "结合均衡饮食目标，继续保持清淡饮食，减少高油高糖食物，并配合适量运动。"
|
||
},
|
||
{
|
||
type: "sleep",
|
||
emoji: "😴",
|
||
title: "睡眠",
|
||
hasAbnormal: false,
|
||
data: "本月记录1次睡眠，时长8小时，达标率100%，睡眠质量表现很好。",
|
||
suggestion: "保持规律的作息时间，尽量在固定时间就寝和起床，让好习惯延续下去。"
|
||
},
|
||
{
|
||
type: "sport",
|
||
emoji: "🏃",
|
||
title: "运动",
|
||
hasAbnormal: true,
|
||
data: "运动记录7次，实际运动1天，总时长30分钟，运动频率14.3%，最长连续不运动2天。考虑到你久坐少动的状态，运动量还需要提升。",
|
||
suggestion: "建议每周累计至少150分钟中等强度运动，可以从快走、跑步等开始，每小时起身活动5分钟。"
|
||
},
|
||
{
|
||
type: "bloodPressure",
|
||
emoji: "❤️",
|
||
title: "血压",
|
||
hasAbnormal: true,
|
||
data: "收缩压从120升至145mmHg，舒张压从70升至97mmHg，平均血压约132.5/83.5mmHg，异常率50%；心率平均80次/分。血压升高明显，需要重视。",
|
||
suggestion: "请尽快复测血压并咨询医生，同时注意低盐饮食、避免熬夜、减轻压力，并坚持每日监测。"
|
||
},
|
||
{
|
||
type: "bloodSugar",
|
||
emoji: "🩸",
|
||
title: "血糖",
|
||
hasAbnormal: false,
|
||
data: "空腹血糖5.4mmol/L，处于正常范围，餐前、餐后及睡前血糖暂无记录。",
|
||
suggestion: "继续保持均衡饮食，控制精制糖和甜食摄入，后续可完善餐后血糖记录。"
|
||
}
|
||
],
|
||
tips: [
|
||
"血压是本月的重点预警项：高压和低压均有明显上升，建议尽快就医复测，并在医生指导下规律监测。",
|
||
"结合久坐少动的工作特点，每坐1小时就起身活动几分钟，下班后安排30分钟快走或慢跑，逐渐增加运动频率。",
|
||
"把均衡饮食落到实处：减少盐和油，多吃蔬菜水果，少吃腌制食品和外卖，帮助体重和血压一起改善。"
|
||
],
|
||
ending: "健康管理是一场长跑，不必追求完美，只要持续用心就好。下个月继续一起关注血压和运动，期待你更好的状态！"
|
||
})
|
||
|
||
function goHome() {
|
||
uni.switchTab({ url: '/pages/index/index' })
|
||
}
|
||
</script>
|
||
|