63 lines
1.5 KiB
Vue
63 lines
1.5 KiB
Vue
|
<template>
|
|||
|
|
<section class="medical-cooperation">
|
|||
|
|
<h2 class="section-title">医疗健康合作</h2>
|
|||
|
|
<p class="section-subtitle">赋能医疗健康产业升级，重新定义数字健康服务标准</p>
|
|||
|
|
<div class="cooperation-funnel">
|
|||
|
|
<img src="https://images.health.ufutx.com/202506/18/eco-funnel.png" alt="漏斗模型" class="funnel-img" />
|
|||
|
|
<!-- 标签可动态配置，此处简化 -->
|
|||
|
|
<div class="funnel-labels">
|
|||
|
|
<span>健康管理中心</span>
|
|||
|
|
<span>专科指导</span>
|
|||
|
|
<span>轻量化AI赋能</span>
|
|||
|
|
<span>数据反哺价值提升</span>
|
|||
|
|
<span>全链提效</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup lang="ts">
|
|||
|
|
/* 无业务逻辑 */
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped lang="less">
|
|||
|
|
.medical-cooperation {
|
|||
|
|
text-align: center;
|
|||
|
|
padding: 80px 20px;
|
|||
|
|
|
|||
|
|
.section-title {
|
|||
|
|
font-size: @font-size-xxl;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: @text-color-primary;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
}
|
|||
|
|
.section-subtitle {
|
|||
|
|
font-size: @font-size-md;
|
|||
|
|
color: @text-color-secondary;
|
|||
|
|
margin-bottom: 40px;
|
|||
|
|
}
|
|||
|
|
.cooperation-funnel {
|
|||
|
|
position: relative;
|
|||
|
|
.funnel-img {
|
|||
|
|
width: 60%;
|
|||
|
|
height: auto;
|
|||
|
|
}
|
|||
|
|
.funnel-labels {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
align-items: center;
|
|||
|
|
span {
|
|||
|
|
font-size: @font-size-sm;
|
|||
|
|
color: @text-color-primary;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|