comclib
c02029a5f3
- Spring Boot 后端服务 (hss-home-service) - delivery-miniapp 配送小程序 - website 官网 (Nuxt) - docs 架构设计文档 - Docker 容器化部署配置 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
100 lines
3.7 KiB
Vue
100 lines
3.7 KiB
Vue
<script setup lang="ts">
|
||
import { useSeo } from '~/composables/useSeo'
|
||
import { painPoints, capabilities, scenarios } from '~/data/siteContent'
|
||
|
||
useSeo({ title: '首页', description: '智慧医养居家上门服务闭环管理平台，覆盖申请、评估、方案、派单、执行、监管、验收、结算全流程。' })
|
||
</script>
|
||
|
||
<template>
|
||
<HeroSection />
|
||
|
||
<section class="py-20 bg-surface">
|
||
<div class="section-container">
|
||
<h2 class="section-title">居家上门服务，为什么这么难管？</h2>
|
||
<p class="section-subtitle">申请流程乱、评估标准不一、派单靠经验、上门难监管、质量难追溯、结算不规范</p>
|
||
<div class="grid md:grid-cols-3 gap-8 mt-12">
|
||
<PainPointCard v-for="p in painPoints" :key="p.title" v-bind="p" />
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-white">
|
||
<div class="section-container">
|
||
<h2 class="section-title">一套平台，打通居家服务全流程</h2>
|
||
<p class="section-subtitle">从服务申请到结算归档，每个环节都可监管、可追溯、可评价</p>
|
||
<img src="https://loremflickr.com/1024/400/technology" alt="平台概览示意图（示意素材，待替换）"
|
||
class="mt-12 rounded-2xl shadow-lg w-full" width="1024" height="400" loading="lazy" />
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-surface">
|
||
<div class="section-container">
|
||
<h2 class="section-title">完整服务闭环</h2>
|
||
<p class="section-subtitle">8 个阶段无缝衔接，每个节点都可监管、可追溯</p>
|
||
<ServiceLoopFlow class="mt-12" />
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-white">
|
||
<div class="section-container">
|
||
<h2 class="section-title">八大核心能力</h2>
|
||
<p class="section-subtitle">覆盖居家上门服务完整业务链路</p>
|
||
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mt-12">
|
||
<CapabilityCard v-for="c in capabilities" :key="c.title" v-bind="c" />
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-surface">
|
||
<div class="section-container">
|
||
<h2 class="section-title">三端协同，角色分明</h2>
|
||
<p class="section-subtitle">家属端、服务端、管理端各司其职</p>
|
||
<TriEndDisplay class="mt-12" />
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-white">
|
||
<div class="section-container">
|
||
<h2 class="section-title">覆盖五大应用场景</h2>
|
||
<p class="section-subtitle">适配不同机构类型的业务需求</p>
|
||
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mt-12">
|
||
<ScenarioCard v-for="s in scenarios" :key="s.title" v-bind="s" />
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-surface">
|
||
<div class="section-container">
|
||
<h2 class="section-title">实时监管，数据驱动</h2>
|
||
<p class="section-subtitle">运营数据一目了然，异常预警即时通知</p>
|
||
<DataDashboard class="mt-12" />
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-white">
|
||
<div class="section-container">
|
||
<h2 class="section-title">医疗级安全合规</h2>
|
||
<p class="section-subtitle">数据安全与合规体系，满足政企医疗行业标准</p>
|
||
<SecurityGrid class="mt-12" />
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-surface">
|
||
<div class="section-container">
|
||
<h2 class="section-title">平台建设价值</h2>
|
||
<ValueMetrics class="mt-12" />
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 bg-white">
|
||
<div class="section-container text-center">
|
||
<h2 class="section-title">获取完整方案</h2>
|
||
<p class="section-subtitle">下载解决方案 PDF、白皮书和产品介绍资料</p>
|
||
<DownloadForm class="mt-8" />
|
||
</div>
|
||
</section>
|
||
|
||
<CtaSection />
|
||
<MobileBottomCTA />
|
||
</template>
|