forked from dengzhifeng/ufutx-pc-website
87 lines
2.3 KiB
Vue
87 lines
2.3 KiB
Vue
<template>
|
|
<section class="ai-health-process">
|
|
<h2 class="section-title">友福AI健康方案流程</h2>
|
|
<div class="process-steps">
|
|
<img
|
|
clas="section-icon"
|
|
src="https://images.health.ufutx.com/202506/17/4a36942f896903dbd195e31026483b4a.png"
|
|
alt=""
|
|
/>
|
|
<!-- <div class="step">-->
|
|
<!-- <div class="step-number">01</div>-->
|
|
<!-- <h3 class="step-title">体检报告</h3>-->
|
|
<!-- <p>全方位解析身体的健康数据</p>-->
|
|
<!-- </div>-->
|
|
<!-- <div class="step">-->
|
|
<!-- <div class="step-number">02</div>-->
|
|
<!-- <h3 class="step-title">健康信息采集</h3>-->
|
|
<!-- <p>个性化健康信息录入</p>-->
|
|
<!-- </div>-->
|
|
<!-- <div class="step">-->
|
|
<!-- <div class="step-number">03</div>-->
|
|
<!-- <h3 class="step-title">人工智能分析</h3>-->
|
|
<!-- <p>多维度数据智能解读</p>-->
|
|
<!-- </div>-->
|
|
<!-- <div class="step">-->
|
|
<!-- <div class="step-number">04</div>-->
|
|
<!-- <h3 class="step-title">定制健康方案</h3>-->
|
|
<!-- <p>生成专属健康管理方案</p>-->
|
|
<!-- </div>-->
|
|
<!-- <div class="step">-->
|
|
<!-- <div class="step-number">05</div>-->
|
|
<!-- <h3 class="step-title">APP跟踪服务</h3>-->
|
|
<!-- <p>实时跟踪健康状态</p>-->
|
|
<!-- </div>-->
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
// 无额外逻辑，纯展示
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.ai-health-process {
|
|
padding: 50px 190px;
|
|
text-align: center;
|
|
background: #f6f8fe;
|
|
.mt(20px);
|
|
}
|
|
.section-title {
|
|
font-size: @font-size-xxl;
|
|
color: @text-color;
|
|
font-weight: bold;
|
|
}
|
|
.process-steps {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
flex-wrap: wrap;
|
|
margin-top: 40px;
|
|
}
|
|
.step {
|
|
width: 160px;
|
|
margin: 20px;
|
|
}
|
|
.step-number {
|
|
width: 60px;
|
|
height: 60px;
|
|
border: 2px solid #409eff;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-size: 24px;
|
|
color: #409eff;
|
|
margin: 0 auto 16px;
|
|
}
|
|
.step-title {
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
margin-bottom: 8px;
|
|
}
|
|
.step p {
|
|
font-size: 14px;
|
|
color: #666;
|
|
}
|
|
</style>
|