feat: 20250623 添加完整数据,动画相关
This commit is contained in:
parent
aed3a0b724
commit
a4268e6f05
3
components.d.ts
vendored
3
components.d.ts
vendored
@ -9,11 +9,14 @@ export {}
|
|||||||
declare module 'vue' {
|
declare module 'vue' {
|
||||||
export interface GlobalComponents {
|
export interface GlobalComponents {
|
||||||
ElButton: typeof import('element-plus/es')['ElButton']
|
ElButton: typeof import('element-plus/es')['ElButton']
|
||||||
|
ElCard: typeof import('element-plus/es')['ElCard']
|
||||||
|
ElCol: typeof import('element-plus/es')['ElCol']
|
||||||
ElForm: typeof import('element-plus/es')['ElForm']
|
ElForm: typeof import('element-plus/es')['ElForm']
|
||||||
ElFormItem: typeof import('element-plus/es')['ElFormItem']
|
ElFormItem: typeof import('element-plus/es')['ElFormItem']
|
||||||
ElInput: typeof import('element-plus/es')['ElInput']
|
ElInput: typeof import('element-plus/es')['ElInput']
|
||||||
ElOption: typeof import('element-plus/es')['ElOption']
|
ElOption: typeof import('element-plus/es')['ElOption']
|
||||||
ElPagination: typeof import('element-plus/es')['ElPagination']
|
ElPagination: typeof import('element-plus/es')['ElPagination']
|
||||||
|
ElRow: typeof import('element-plus/es')['ElRow']
|
||||||
ElSelect: typeof import('element-plus/es')['ElSelect']
|
ElSelect: typeof import('element-plus/es')['ElSelect']
|
||||||
ElTabPane: typeof import('element-plus/es')['ElTabPane']
|
ElTabPane: typeof import('element-plus/es')['ElTabPane']
|
||||||
ElTabs: typeof import('element-plus/es')['ElTabs']
|
ElTabs: typeof import('element-plus/es')['ElTabs']
|
||||||
|
|||||||
59
src/utils/navigation.ts
Normal file
59
src/utils/navigation.ts
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
// src/utils/navigation.ts
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 内部路由跳转(简化版)
|
||||||
|
* @param to - 路由路径或名称
|
||||||
|
* @param replace - 是否替换当前历史记录
|
||||||
|
*/
|
||||||
|
export const navigateTo = (to: string | { name: string }, replace = false) => {
|
||||||
|
const router = useRouter()
|
||||||
|
replace ? router.replace(to) : router.push(to)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 外部链接跳转(带安全防护)
|
||||||
|
* @param url - 目标URL
|
||||||
|
* @param target - 打开方式
|
||||||
|
*/
|
||||||
|
export const openExternalLink = (url: string, target: '_blank' | '_self' = '_blank') => {
|
||||||
|
if (target === '_blank') {
|
||||||
|
window.open(url, '_blank', 'noopener,noreferrer')
|
||||||
|
} else {
|
||||||
|
window.location.href = url
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 返回上一页
|
||||||
|
*/
|
||||||
|
// export const goBack = () => {
|
||||||
|
// useRouter().back()
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// <template>
|
||||||
|
// <div>
|
||||||
|
// <button @click="goToProduct(123)">查看产品</button>
|
||||||
|
// <button @click="openWebsite">访问官网</button>
|
||||||
|
// <button @click="back">返回</button>
|
||||||
|
// </div>
|
||||||
|
// </template>
|
||||||
|
//
|
||||||
|
// <script setup lang="ts">
|
||||||
|
// import { navigateTo, openExternalLink, goBack } from '@/utils/navigation';
|
||||||
|
//
|
||||||
|
// // 跳转到命名路由
|
||||||
|
// const goToProduct = (id: number) => {
|
||||||
|
// navigateTo({ name: 'product', params: { id } });
|
||||||
|
// };
|
||||||
|
//
|
||||||
|
// // 打开外部链接
|
||||||
|
// const openWebsite = () => {
|
||||||
|
// openExternalLink('https://ufutx.com');
|
||||||
|
// };
|
||||||
|
//
|
||||||
|
// // 返回上一页
|
||||||
|
// const back = () => {
|
||||||
|
// goBack();
|
||||||
|
// };
|
||||||
|
// </script>
|
||||||
@ -6,7 +6,7 @@
|
|||||||
<CompanyTimeline />
|
<CompanyTimeline />
|
||||||
<!-- 我们重新定义健康未来-->
|
<!-- 我们重新定义健康未来-->
|
||||||
<RedefineHealth />
|
<RedefineHealth />
|
||||||
<!-- 企业价值观-->
|
<!-- 应用场景-->
|
||||||
<CompanyValues />
|
<CompanyValues />
|
||||||
<!-- 资质认证-->
|
<!-- 资质认证-->
|
||||||
<QualificationCarousel />
|
<QualificationCarousel />
|
||||||
|
|||||||
@ -5,13 +5,8 @@
|
|||||||
<p class="partner-subtitle">正与众多客户一起创造更多价值</p>
|
<p class="partner-subtitle">正与众多客户一起创造更多价值</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="partner-logos">
|
<div class="partner-logos">
|
||||||
<div v-for="index in 21" :key="index" class="partner-logo-item">
|
<div v-for="(item, index) in partnerLogos" :key="index" class="partner-logo-item">
|
||||||
<!-- <img :src="logo.src" :alt="logo.alt" class="partner-logo" />-->
|
<img :src="item.src" :alt="item.alt" class="partner-logo" />
|
||||||
<img
|
|
||||||
src="https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png"
|
|
||||||
alt="新浪健康"
|
|
||||||
class="partner-logo"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@ -19,40 +14,48 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
// 使用提供的图片链接作为所有合作伙伴Logo
|
// 使用提供的图片链接作为所有合作伙伴Logo
|
||||||
// const partnerLogos = [
|
const partnerLogos = [
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/9e8adafbca3355fb37a63ddc2ce5573b.png',
|
||||||
// alt: '新浪健康'
|
alt: '安源玻璃'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/1aa6d57409ae8557e0fae47d20f2eefd.png',
|
||||||
// alt: '新浪健康'
|
alt: '蟹尊享'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/56649b69b738d04d9a99cf386b88d61b.png',
|
||||||
// alt: '新浪健康'
|
alt: '大连海洋大学'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/6be17a225cf2539354cbb396f314b86c.png',
|
||||||
// alt: '新浪健康'
|
alt: '青柠檬教育'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/ffd7b2db7143e2d8796fd5ac145a95a6.png',
|
||||||
// alt: '新浪健康'
|
alt: '骏德酒业'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/6c83747d195f69fcfc56aa1d2c20b16c.png',
|
||||||
// alt: '新浪健康'
|
alt: '磐石投资集团'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/28c9c8eefbeb1968950539a2ad98ae28.png',
|
||||||
// alt: '新浪健康'
|
alt: '华进(ACIP)'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/b12ce669ae4f2d1ff6ca839234723fda.png',
|
||||||
// alt: '新浪健康'
|
alt: '纽斯葆广赛(NPGS)'
|
||||||
// }
|
},
|
||||||
// ]
|
{
|
||||||
|
src: 'https://images.health.ufutx.com/202506/23/abc344decb1d3208dbce771f05e7cf19.png',
|
||||||
|
alt: '格林汇能(GLHN)'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: 'https://images.health.ufutx.com/202506/23/12b7a6e0a42da15a7e82532d03cb9e8a.png',
|
||||||
|
alt: '友宏科技'
|
||||||
|
}
|
||||||
|
]
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
@ -61,9 +64,10 @@
|
|||||||
.partner-section {
|
.partner-section {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
background: #f5f7fe;
|
||||||
|
.pt(50px);
|
||||||
.partner-header {
|
.partner-header {
|
||||||
.my(50px);
|
.mb(50px);
|
||||||
.partner-title {
|
.partner-title {
|
||||||
font-size: @font-size-xxl;
|
font-size: @font-size-xxl;
|
||||||
font-weight: @font-weight-bold;
|
font-weight: @font-weight-bold;
|
||||||
@ -80,24 +84,27 @@
|
|||||||
|
|
||||||
.partner-logos {
|
.partner-logos {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
grid-template-columns: repeat(auto-fill, minmax(286px, 1fr));
|
||||||
gap: @space-xl;
|
gap: 27.5px;
|
||||||
justify-items: center;
|
justify-items: center;
|
||||||
.px(160px);
|
.px(190px);
|
||||||
.pb(50px);
|
.pb(50px);
|
||||||
.partner-logo-item {
|
.partner-logo-item {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 80px;
|
//height: 80px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
.partner-logo {
|
.partner-logo {
|
||||||
width: 230px;
|
|
||||||
//max-height: 60px;
|
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
transition: transform 0.3s ease;
|
transition: transform 0.3s ease;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
width: 286px;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
<div class="section-divider">全方位健康生活方式的引领者</div>
|
<div class="section-divider">全方位健康生活方式的引领者</div>
|
||||||
<FeatureNav />
|
<FeatureNav />
|
||||||
<!-- // 健康设备-->
|
<!-- // 健康设备-->
|
||||||
<HealthDevice :device="healthBand" />
|
<!-- <HealthDevice :device="healthBand" />-->
|
||||||
<!-- //一分钟演讲-->
|
<!-- //一分钟演讲-->
|
||||||
<SpeechModule />
|
<SpeechModule />
|
||||||
<!-- 应用场景-->
|
<!-- 应用场景-->
|
||||||
|
|||||||
@ -8,48 +8,27 @@
|
|||||||
<!-- </div>-->
|
<!-- </div>-->
|
||||||
|
|
||||||
<!-- 标签切换(友福动态 / 媒体报道) -->
|
<!-- 标签切换(友福动态 / 媒体报道) -->
|
||||||
<el-tabs v-model="activeTab" class="news-tabs" @tab-click="resetPage">
|
<el-tabs v-model="activeTab" class="news-tabs">
|
||||||
<el-tab-pane label="友福健康生态" name="dynamic"></el-tab-pane>
|
<el-tab-pane v-for="scene in scenes" :key="scene.name" :label="scene.title" :name="scene.name">
|
||||||
<el-tab-pane label="幸福婚恋" name="report"></el-tab-pane>
|
<div class="scenes-content">
|
||||||
<el-tab-pane label="个人成长" name="growth"></el-tab-pane>
|
<!-- 文字描述区 -->
|
||||||
</el-tabs>
|
<div class="scene-desc">
|
||||||
|
<div class="speech-title">
|
||||||
<div v-show="currentTab === 0" class="scenes-content">
|
<img class="icon" src="https://images.health.ufutx.com/202506/18/2874b7295fd3fd2490838369b17affd3.png" />
|
||||||
<div class="scene-desc">
|
<p>{{ scene.title }}</p>
|
||||||
<div class="speech-title">
|
</div>
|
||||||
<img class="icon" src="https://images.health.ufutx.com/202506/18/2874b7295fd3fd2490838369b17affd3.png" />
|
<ul class="speech-content">
|
||||||
<p>友福健康生态</p>
|
<li v-for="(line, i) in scene.content" :key="i">{{ line }}</li>
|
||||||
|
</ul>
|
||||||
|
<!-- <p class="speech-subtitle" v-html="scene.desc"></p>-->
|
||||||
|
</div>
|
||||||
|
<!-- 图片展示区 -->
|
||||||
|
<div class="scene-img">
|
||||||
|
<img :src="scene.image" :alt="scene.title" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="speech-subtitle">
|
</el-tab-pane>
|
||||||
AI精准个性化健康方案服务:透过友福七维AI健康修复系统分析多维度身心健康数据,量身打造专属的精准健康管理方案。<br />
|
</el-tabs>
|
||||||
智能穿戴设备数据监测:搭载AI模型算法的智能穿戴设备,医用级精度实时监测您的体温、睡眠、心率、血氧、血压等多项生理参数,时刻守护您的身心健康。<br />
|
|
||||||
友福商城:精选高品质、值得信赖的健康生活好物,为您的健康生活严格把关。
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div class="scene-img">
|
|
||||||
<img src="https://images.health.ufutx.com/202506/18/d2b5ca33bd970f64a6301fa75ae2eb22.png" alt="健康生态" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-show="currentTab === 1" class="scenes-content">
|
|
||||||
<div class="scene-desc">
|
|
||||||
<p class="speech-title">
|
|
||||||
幸福婚恋板块专注为单身用户打造高效、真实的交友环境,通过AI精准匹配、身份验证体系、以及个性化社交标签,
|
|
||||||
</p>
|
|
||||||
<p>帮助用户快速找到契合的伴侣,同时提供恋爱指导、关系维护等延伸服务,让爱情更长久。</p>
|
|
||||||
</div>
|
|
||||||
<div class="scene-img">
|
|
||||||
<!-- <img src="@/assets/scene-dating.png" alt="幸福婚恋" />-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-show="currentTab === 2" class="scenes-content">
|
|
||||||
<div class="scene-desc">
|
|
||||||
<p>个人成长模块聚焦用户的职业与个人能力提升,提供AI驱动的演讲训练、知识学习、以及社交技巧课程,</p>
|
|
||||||
<p>帮助用户突破社交瓶颈,提升自信,在职业与生活中实现全面成长。</p>
|
|
||||||
</div>
|
|
||||||
<div class="scene-img">
|
|
||||||
<!-- <img src="@/assets/scene-growth.png" alt="个人成长" />-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -58,9 +37,49 @@ import { ref } from 'vue'
|
|||||||
|
|
||||||
const tabs = ['友福健康生态', '幸福婚恋', '个人成长']
|
const tabs = ['友福健康生态', '幸福婚恋', '个人成长']
|
||||||
|
|
||||||
const activeTab = ref('dynamic') // 默认显示“友福动态”
|
// 默认选中第一个场景
|
||||||
const currentTab = ref(0)
|
const currentTab = ref(0)
|
||||||
|
// 结构化场景数据(单数据源管理)
|
||||||
|
const scenes = ref([
|
||||||
|
{
|
||||||
|
name: 'dynamic',
|
||||||
|
title: '友福健康生态',
|
||||||
|
content: [
|
||||||
|
'AI精准个性化健康方案服务:透过友福七维AI健康修复系统分析多维度身心健康数据,量身打造专属的精准健康管理方案。',
|
||||||
|
'智能穿戴设备数据监测:搭载AI模型算法的智能穿戴设备,医用级精度实时监测您的体温、睡眠、心率、血氧、血压等多项生理参数,时刻守护您的身心健康。'
|
||||||
|
],
|
||||||
|
desc:
|
||||||
|
'AI精准个性化健康方案服务:透过友福七维AI健康修复系统分析多维度身心健康数据,量身打造专属的精准健康管理方案。\n' +
|
||||||
|
'智能穿戴设备数据监测:搭载AI模型算法的智能穿戴设备,医用级精度实时监测您的体温、睡眠、心率、血氧、血压等多项生理参数,时刻守护您的身心健康。',
|
||||||
|
image: 'https://images.health.ufutx.com/202506/18/d2b5ca33bd970f64a6301fa75ae2eb22.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'report',
|
||||||
|
title: '幸福婚恋',
|
||||||
|
content: [
|
||||||
|
'婚恋单身标签:透过清晰的“单身标签”功能,帮助您快速找到与您有共同话题和兴趣的潜在伴侣。',
|
||||||
|
'AI婚恋算法配对服务:AI精准匹配个性与偏好,为您推荐最合适的灵魂伴侣,提供高效且真诚的交友体验。'
|
||||||
|
],
|
||||||
|
desc:
|
||||||
|
'婚恋单身标签:透过清晰的“单身标签”功能,帮助您快速找到与您有共同话题和兴趣的潜在伴侣。\n' +
|
||||||
|
'AI婚恋算法配对服务:AI精准匹配个性与偏好,为您推荐最合适的灵魂伴侣,提供高效且真诚的交友体验。',
|
||||||
|
image: 'https://images.health.ufutx.com/202506/23/b01c2ce25e34f80d499f0488d034b00b.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'growth',
|
||||||
|
title: '个人成长',
|
||||||
|
content: [
|
||||||
|
'一分钟演讲成长记录:提供展现真实自我的平台,记录您每一次的表达与成长,分享您的精彩故事。\n' +
|
||||||
|
'(每个模块对应相关的APP画面UI设计)'
|
||||||
|
],
|
||||||
|
desc:
|
||||||
|
'一分钟演讲成长记录:提供展现真实自我的平台,记录您每一次的表达与成长,分享您的精彩故事。\n' +
|
||||||
|
'(每个模块对应相关的APP画面UI设计)',
|
||||||
|
image: 'https://images.health.ufutx.com/202506/23/b07f55c7fd136392763729b9782f7776.png'
|
||||||
|
}
|
||||||
|
])
|
||||||
|
|
||||||
|
const activeTab = ref(scenes.value[0].name)
|
||||||
const resetPage = () => {
|
const resetPage = () => {
|
||||||
// currentPage.value = 1 // 切换标签时重置页码
|
// currentPage.value = 1 // 切换标签时重置页码
|
||||||
}
|
}
|
||||||
@ -188,6 +207,7 @@ const resetPage = () => {
|
|||||||
.speech-subtitle {
|
.speech-subtitle {
|
||||||
color: @text-color;
|
color: @text-color;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
white-space: pre-wrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -209,4 +229,24 @@ const resetPage = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.speech-content {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 18px;
|
||||||
|
li {
|
||||||
|
font-size: 14px;
|
||||||
|
color: @text-color-secondary;
|
||||||
|
line-height: 25px;
|
||||||
|
position: relative;
|
||||||
|
padding-left: 12px;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
&::before {
|
||||||
|
// 还原设计图的·符号
|
||||||
|
content: '·';
|
||||||
|
font-size: 18px;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,50 +1,103 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="feature-nav">
|
<section>
|
||||||
<div
|
<div class="feature-nav">
|
||||||
v-for="(item, index) in navList"
|
<div
|
||||||
:key="index"
|
v-for="(item, index) in navList"
|
||||||
class="nav-item"
|
:key="index"
|
||||||
:class="{ active: item.active }"
|
class="nav-item"
|
||||||
@click="handleSelect(index)"
|
:class="{ active: item.active }"
|
||||||
>
|
@click="handleSelect(index)"
|
||||||
<div class="nav-icon" :style="{ backgroundImage: `url(${item.icon})` }"></div>
|
@mouseenter="handleSelect(index)"
|
||||||
<span class="nav-text">{{ item.text }}</span>
|
>
|
||||||
|
<div class="nav-icon" :style="{ backgroundImage: `url(${item.icon})` }"></div>
|
||||||
|
<span class="nav-text">{{ item.text }}</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="health-device">
|
||||||
|
<div class="device-content">
|
||||||
|
<div class="device-img">
|
||||||
|
<img :src="navList[activeIndex].center.deviceImg" alt="设备界面" />
|
||||||
|
</div>
|
||||||
|
<div class="device-info">
|
||||||
|
<h3 class="device-title">{{ navList[activeIndex].center.title }}</h3>
|
||||||
|
<h3 class="device-subtitle">{{ navList[activeIndex].center.subtitle }}</h3>
|
||||||
|
<p class="device-desc" v-html="navList[activeIndex].center.description"></p>
|
||||||
|
<div class="download-btn" @click="openReport">立即下载</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
|
import { openExternalLink } from '@/utils/navigation.ts'
|
||||||
|
|
||||||
|
const activeIndex = ref(0)
|
||||||
const navList = ref([
|
const navList = ref([
|
||||||
{
|
{
|
||||||
text: '健康手环',
|
text: '健康手环',
|
||||||
active: true,
|
active: true,
|
||||||
icon: 'https://images.health.ufutx.com/202506/18/4aae244f94bbf8bf352e8ab8e2270a81.png'
|
icon: 'https://images.health.ufutx.com/202506/18/4aae244f94bbf8bf352e8ab8e2270a81.png',
|
||||||
|
center: {
|
||||||
|
navLabel: '健康手环', // 导航栏显示文字
|
||||||
|
title: '健康手环', // 页面主标题
|
||||||
|
subtitle: 'AI精准个性化健康方案服务', // 副标题
|
||||||
|
description: '智能穿戴设备数据监测<br>健康手环 你的专属健康管家,智能体脂秤、精准计算身体状态', // 支持<br>换行
|
||||||
|
deviceImg: 'https://images.health.ufutx.com/202506/23/c14a55da8a21ec3712d768cd052b7220.png' // 左侧设备图
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '智能体脂秤',
|
text: '智能体脂秤',
|
||||||
active: false,
|
active: false,
|
||||||
icon: 'https://images.health.ufutx.com/202506/18/4aae244f94bbf8bf352e8ab8e2270a81.png'
|
icon: 'https://images.health.ufutx.com/202506/23/0ed7ffaa2eb0116dd46b6f1597795766.png',
|
||||||
|
center: {
|
||||||
|
title: '智能体脂秤', // 页面主标题
|
||||||
|
subtitle: 'AI精准计算身体状态', // 副标题
|
||||||
|
description: '智能穿戴设备数据监测<br>健康手环 你的专属健康管家,智能体脂秤、精准计算身体状态', // 支持<br>换行
|
||||||
|
deviceImg: 'https://images.health.ufutx.com/202506/23/13d992813c70c5674658581144a4c17f.png' // 左侧设备图
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '商城',
|
text: '商城',
|
||||||
active: false,
|
active: false,
|
||||||
icon: 'https://images.health.ufutx.com/202506/18/4aae244f94bbf8bf352e8ab8e2270a81.png'
|
icon: 'https://images.health.ufutx.com/202506/23/0fcdeadda0440375eab9c27e67de79f7.png',
|
||||||
|
center: {
|
||||||
|
title: '自用商城', // 页面主标题
|
||||||
|
subtitle: '品质生活 触手可得', // 副标题
|
||||||
|
description: '拒绝虚假营销|确保抄底入手<br>质量管控|商家严选|实物鉴别|售后无忧', // 支持<br>换行
|
||||||
|
deviceImg: 'https://images.health.ufutx.com/202506/23/4b87bf45e69411e4377929d38deb2d3f.png' // 左侧设备图
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '个人成长',
|
text: '个人成长',
|
||||||
active: false,
|
active: false,
|
||||||
icon: 'https://images.health.ufutx.com/202506/18/4aae244f94bbf8bf352e8ab8e2270a81.png'
|
icon: 'https://images.health.ufutx.com/202506/23/3c527e6e644a46edc4164616d0b4dc3e.png',
|
||||||
|
center: {
|
||||||
|
title: '个人成长|1分钟演讲', // 页面主标题
|
||||||
|
subtitle: '提升自我 开口就是100分', // 副标题
|
||||||
|
description: '模拟真实演讲场景<br>每日数据同步更行,你的努力时间都看得见!', // 支持<br>换行
|
||||||
|
deviceImg: 'https://images.health.ufutx.com/202506/23/79605e4b83e27dfa3c701df8d1f3baa0.png' // 左侧设备图
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '单身标签',
|
text: '单身标签',
|
||||||
active: false,
|
active: false,
|
||||||
icon: 'https://images.health.ufutx.com/202506/18/4aae244f94bbf8bf352e8ab8e2270a81.png'
|
icon: 'https://images.health.ufutx.com/202506/23/b42d943c5454dc8abfcbd098a7a07e92.png',
|
||||||
|
center: {
|
||||||
|
title: '单身标签', // 页面主标题
|
||||||
|
subtitle: '爱的序幕由此拉开', // 副标题
|
||||||
|
description: '单身徽章,单身身份之耀,社交吸睛磁石,引同频邂逅。', // 支持<br>换行
|
||||||
|
deviceImg: 'https://images.health.ufutx.com/202506/23/1ac061f59d86088b7233b7b7d03de3a0.png' // 左侧设备图
|
||||||
|
}
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
|
// 外部链接跳转(新标签)
|
||||||
|
const openReport = () => {
|
||||||
|
openExternalLink('https://sj.qq.com/appdetail/com.ufutx.lovehealth', '_blank')
|
||||||
|
}
|
||||||
const handleSelect = (index: number) => {
|
const handleSelect = (index: number) => {
|
||||||
|
activeIndex.value = index
|
||||||
navList.value.forEach((item, i) => {
|
navList.value.forEach((item, i) => {
|
||||||
item.active = i === index
|
item.active = i === index
|
||||||
})
|
})
|
||||||
@ -80,8 +133,8 @@ const handleSelect = (index: number) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.nav-icon {
|
.nav-icon {
|
||||||
width: 12px;
|
width: 22px;
|
||||||
height: 20px;
|
height: 22px;
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
@ -116,6 +169,94 @@ const handleSelect = (index: number) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.health-device {
|
||||||
|
padding: 50px 192px 80px 192px;
|
||||||
|
background: #fff;
|
||||||
|
|
||||||
|
.section-divider {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 50px;
|
||||||
|
color: @text-color;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.device-content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
//justify-content: space-between;
|
||||||
|
gap: 132px;
|
||||||
|
|
||||||
|
.device-img {
|
||||||
|
//flex: 1;
|
||||||
|
//text-align: center;
|
||||||
|
width: 900px;
|
||||||
|
height: 716px;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 10px;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
background: #f6fffa;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-info {
|
||||||
|
flex: 1;
|
||||||
|
text-align: left;
|
||||||
|
|
||||||
|
.device-title {
|
||||||
|
color: #18ca6e;
|
||||||
|
font-size: 36px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
|
.device-subtitle {
|
||||||
|
color: #0e0e0e;
|
||||||
|
font-size: 36px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
|
.device-desc {
|
||||||
|
color: var(--66676-c, #66676c);
|
||||||
|
font-size: 20px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 36px; /* 180% */
|
||||||
|
text-transform: capitalize;
|
||||||
|
.my(30px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.download-btn {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 16px 30px;
|
||||||
|
align-items: center;
|
||||||
|
gap: 20px;
|
||||||
|
border-radius: 100px;
|
||||||
|
border: 1px solid var(--18-ca-6-e, #18ca6e);
|
||||||
|
background: #18ca6e;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: @tablet-breakpoint) {
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 40px 20px;
|
||||||
|
|
||||||
|
.device-content {
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
.device-info {
|
||||||
|
.device-desc {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
/* 响应式适配 */
|
/* 响应式适配 */
|
||||||
@media (max-width: @tablet-breakpoint) {
|
@media (max-width: @tablet-breakpoint) {
|
||||||
.feature-nav {
|
.feature-nav {
|
||||||
|
|||||||
@ -8,7 +8,7 @@
|
|||||||
<h3 class="device-title">{{ device.title }}</h3>
|
<h3 class="device-title">{{ device.title }}</h3>
|
||||||
<h3 class="device-subtitle">AI精准个性化健康方案服务</h3>
|
<h3 class="device-subtitle">AI精准个性化健康方案服务</h3>
|
||||||
<p class="device-desc" v-html="device.desc"></p>
|
<p class="device-desc" v-html="device.desc"></p>
|
||||||
<div class="download-btn">立即下载</div>
|
<div class="download-btn" @click="openReport">立即下载</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@ -16,6 +16,7 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ElButton } from 'element-plus'
|
import { ElButton } from 'element-plus'
|
||||||
|
import { openExternalLink } from '@/utils/navigation.ts'
|
||||||
// import FeatureNav from '@/views/App/sections/FeatureNav.vue'
|
// import FeatureNav from '@/views/App/sections/FeatureNav.vue'
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
@ -28,7 +29,10 @@ const props = defineProps({
|
|||||||
img: 'https://images.health.ufutx.com/202506/18/2e9c9d64bdcf03fbe5041720f03033ca.png'
|
img: 'https://images.health.ufutx.com/202506/18/2e9c9d64bdcf03fbe5041720f03033ca.png'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
}) // 外部链接跳转(新标签)
|
||||||
|
const openReport = () => {
|
||||||
|
openExternalLink('https://sj.qq.com/appdetail/com.ufutx.lovehealth', '_blank')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
|
|||||||
@ -8,7 +8,7 @@
|
|||||||
跨出社交圈,“一分钟演讲”<br />
|
跨出社交圈,“一分钟演讲”<br />
|
||||||
立即让未来的灵魂伴侣更了解你,轻松打开话题
|
立即让未来的灵魂伴侣更了解你,轻松打开话题
|
||||||
</p>
|
</p>
|
||||||
<div class="download-btn">立即下载</div>
|
<div class="download-btn" @click="openReport">立即下载</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="speech-img">
|
<div class="speech-img">
|
||||||
<!-- <img src="@/assets/speech-app.png" alt="演讲界面" />-->
|
<!-- <img src="@/assets/speech-app.png" alt="演讲界面" />-->
|
||||||
@ -18,7 +18,11 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ElButton } from 'element-plus'
|
import { openExternalLink } from '@/utils/navigation.ts'
|
||||||
|
// 外部链接跳转(新标签)
|
||||||
|
const openReport = () => {
|
||||||
|
openExternalLink('https://sj.qq.com/appdetail/com.ufutx.lovehealth', '_blank')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
|
|||||||
@ -1,15 +1,24 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="ecosystem-page">
|
<div class="ecosystem-page">
|
||||||
|
<!-- // 轮播图-->
|
||||||
<Banner />
|
<Banner />
|
||||||
|
<!-- // 核心优势-->
|
||||||
<CoreAdvantages />
|
<CoreAdvantages />
|
||||||
|
<!-- // 区域合作-->
|
||||||
<RegionCooperation />
|
<RegionCooperation />
|
||||||
|
<!-- // 健康管理-->
|
||||||
<HealthManagement />
|
<HealthManagement />
|
||||||
|
<!-- // 医疗合作-->
|
||||||
<MedicalCooperation />
|
<MedicalCooperation />
|
||||||
|
<!-- // 企业合作-->
|
||||||
<EnterpriseCooperation />
|
<EnterpriseCooperation />
|
||||||
|
<!-- // 合作咨询-->
|
||||||
<CooperationConsult :device="cooperateData" />
|
<CooperationConsult :device="cooperateData" />
|
||||||
|
<!-- // 人才培训-->
|
||||||
<TalentTraining />
|
<TalentTraining />
|
||||||
|
<!-- // 城市合伙人-->
|
||||||
<CooperationConsult :device="cooperateDataV2" />
|
<CooperationConsult :device="cooperateDataV2" />
|
||||||
|
<!-- // 城市合伙人-->
|
||||||
<CityPartner />
|
<CityPartner />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@ -32,12 +32,11 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 主体内容区 -->
|
<!-- 主体内容区 -->
|
||||||
<div class="content">
|
<div class="content" :style="{ backgroundImage: `url(${navItems[currentIdx].illustration})` }">
|
||||||
<div class="text">
|
<div class="text">
|
||||||
<h2 class="main-title">{{ navItems[currentIdx].title }}</h2>
|
<h2 class="main-title">{{ navItems[currentIdx].title }}</h2>
|
||||||
<p class="desc">{{ navItems[currentIdx].desc }}</p>
|
<p class="desc">{{ navItems[currentIdx].desc }}</p>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="illustration" :style="{ backgroundImage: `url(${navItems[currentIdx].illustration})` }"></div>-->
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
@ -54,21 +53,23 @@ const navItems = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '总部直营培训体系',
|
title: '总部直营培训体系',
|
||||||
desc: '构建完善的直营培训体系,涵盖产品、运营、营销等多维度专业培训。',
|
desc: '我们提供完善的总部直营培训服务,确保您的团队能够熟练掌握我们的产品和服务,为用户提供高品质的体验。',
|
||||||
icon: 'https://images.health.ufutx.com/202506/20/0e6cc1c38e5e5256860cb2cb6761c085.png',
|
icon: 'https://images.health.ufutx.com/202506/20/0e6cc1c38e5e5256860cb2cb6761c085.png',
|
||||||
illustration: 'https://images.health.ufutx.com/202506/20/84b3dbef5488efa0b793acb28d2a732f.png'
|
illustration: 'https://images.health.ufutx.com/202506/23/1d755208e31271f84983d1d8f46f70a9.png'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '独家解决方案输出',
|
title: '独家解决方案输出',
|
||||||
desc: '依托核心技术,定制独家AI健康管理解决方案,满足差异化需求。',
|
desc: '获得领先的友福七维AI健康修复系统的完整输出,包括服务培训和运营模式。',
|
||||||
icon: 'https://images.health.ufutx.com/202506/20/662d5203d956719006cd477a63e6476b.png',
|
icon: 'https://images.health.ufutx.com/202506/20/662d5203d956719006cd477a63e6476b.png',
|
||||||
illustration: 'https://images.health.ufutx.com/202506/20/84b3dbef5488efa0b793acb28d2a732f.png'
|
illustration: 'https://images.health.ufutx.com/202506/23/e8819411e2fdd656216e3fb30e64db8a.png'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '共享万亿市场机遇',
|
title: '共享万亿市场机遇',
|
||||||
desc: '携手合作伙伴,共享AI大健康万亿级市场红利,实现互利共赢。',
|
desc:
|
||||||
|
'携手友福同享,共同分享AI智能健康产业的巨大红利,实现区域市场的快速增长。\n' +
|
||||||
|
'我们期待与您携手,将AI智能健康理念带到更多城市,共同提升人类生命质量,成为健康生活方式的引领者。',
|
||||||
icon: 'https://images.health.ufutx.com/202506/20/d780da8996bc4a771e70300456e4eb5d.png',
|
icon: 'https://images.health.ufutx.com/202506/20/d780da8996bc4a771e70300456e4eb5d.png',
|
||||||
illustration: 'https://images.health.ufutx.com/202506/20/84b3dbef5488efa0b793acb28d2a732f.png'
|
illustration: 'https://images.health.ufutx.com/202506/23/152ab9d119dbab87bbfc8bc496cc3e98.png'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
@ -153,6 +154,7 @@ const currentIdx = ref(0)
|
|||||||
.item-desc {
|
.item-desc {
|
||||||
font-size: @font-size-sm;
|
font-size: @font-size-sm;
|
||||||
color: @text-color-light;
|
color: @text-color-light;
|
||||||
|
white-space: pre-wrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -194,7 +196,7 @@ const currentIdx = ref(0)
|
|||||||
//justify-content: space-between;
|
//justify-content: space-between;
|
||||||
//gap: 80px;
|
//gap: 80px;
|
||||||
height: 558px;
|
height: 558px;
|
||||||
background-image: url('https://images.health.ufutx.com/202506/20/84b3dbef5488efa0b793acb28d2a732f.png');
|
//background-image: url('https://images.health.ufutx.com/202506/20/84b3dbef5488efa0b793acb28d2a732f.png');
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
.text {
|
.text {
|
||||||
margin-top: 221px;
|
margin-top: 221px;
|
||||||
@ -210,6 +212,7 @@ const currentIdx = ref(0)
|
|||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: @text-color-secondary;
|
color: @text-color-secondary;
|
||||||
line-height: 34px;
|
line-height: 34px;
|
||||||
|
white-space: pre-wrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -5,13 +5,8 @@
|
|||||||
<p class="partner-subtitle">正与众多客户一起创造更多价值</p>
|
<p class="partner-subtitle">正与众多客户一起创造更多价值</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="partner-logos">
|
<div class="partner-logos">
|
||||||
<div v-for="index in 21" :key="index" class="partner-logo-item">
|
<div v-for="(item, index) in partnerLogos" :key="index" class="partner-logo-item">
|
||||||
<!-- <img :src="logo.src" :alt="logo.alt" class="partner-logo" />-->
|
<img :src="item.src" :alt="item.alt" class="partner-logo" />
|
||||||
<img
|
|
||||||
src="https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png"
|
|
||||||
alt="新浪健康"
|
|
||||||
class="partner-logo"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@ -19,40 +14,48 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
// 使用提供的图片链接作为所有合作伙伴Logo
|
// 使用提供的图片链接作为所有合作伙伴Logo
|
||||||
// const partnerLogos = [
|
const partnerLogos = [
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/9e8adafbca3355fb37a63ddc2ce5573b.png',
|
||||||
// alt: '新浪健康'
|
alt: '安源玻璃'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/1aa6d57409ae8557e0fae47d20f2eefd.png',
|
||||||
// alt: '新浪健康'
|
alt: '蟹尊享'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/56649b69b738d04d9a99cf386b88d61b.png',
|
||||||
// alt: '新浪健康'
|
alt: '大连海洋大学'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/6be17a225cf2539354cbb396f314b86c.png',
|
||||||
// alt: '新浪健康'
|
alt: '青柠檬教育'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/ffd7b2db7143e2d8796fd5ac145a95a6.png',
|
||||||
// alt: '新浪健康'
|
alt: '骏德酒业'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/6c83747d195f69fcfc56aa1d2c20b16c.png',
|
||||||
// alt: '新浪健康'
|
alt: '磐石投资集团'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/28c9c8eefbeb1968950539a2ad98ae28.png',
|
||||||
// alt: '新浪健康'
|
alt: '华进(ACIP)'
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// src: 'https://images.health.ufutx.com/202506/12/10fb15c77258a991b0028080a64fb42d.png',
|
src: 'https://images.health.ufutx.com/202506/23/b12ce669ae4f2d1ff6ca839234723fda.png',
|
||||||
// alt: '新浪健康'
|
alt: '纽斯葆广赛(NPGS)'
|
||||||
// }
|
},
|
||||||
// ]
|
{
|
||||||
|
src: 'https://images.health.ufutx.com/202506/23/abc344decb1d3208dbce771f05e7cf19.png',
|
||||||
|
alt: '格林汇能(GLHN)'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: 'https://images.health.ufutx.com/202506/23/12b7a6e0a42da15a7e82532d03cb9e8a.png',
|
||||||
|
alt: '友宏科技'
|
||||||
|
}
|
||||||
|
]
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
@ -61,9 +64,10 @@
|
|||||||
.partner-section {
|
.partner-section {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
background: #ffffff;
|
||||||
|
.pt(50px);
|
||||||
.partner-header {
|
.partner-header {
|
||||||
.my(50px);
|
.mb(50px);
|
||||||
.partner-title {
|
.partner-title {
|
||||||
font-size: @font-size-xxl;
|
font-size: @font-size-xxl;
|
||||||
font-weight: @font-weight-bold;
|
font-weight: @font-weight-bold;
|
||||||
@ -80,24 +84,27 @@
|
|||||||
|
|
||||||
.partner-logos {
|
.partner-logos {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
grid-template-columns: repeat(auto-fill, minmax(286px, 1fr));
|
||||||
gap: @space-xl;
|
gap: 27.5px;
|
||||||
justify-items: center;
|
justify-items: center;
|
||||||
.px(160px);
|
.px(190px);
|
||||||
.pb(50px);
|
.pb(50px);
|
||||||
.partner-logo-item {
|
.partner-logo-item {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 80px;
|
//height: 80px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
.partner-logo {
|
.partner-logo {
|
||||||
width: 230px;
|
|
||||||
//max-height: 60px;
|
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
transition: transform 0.3s ease;
|
transition: transform 0.3s ease;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
width: 286px;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
<section class="app-promotion">
|
<section class="app-promotion">
|
||||||
<div class="section-bg">
|
<div class="section-bg">
|
||||||
<h2 class="section-title">提供专属健康服务和服务方案</h2>
|
<h2 class="section-title">提供专属健康服务和服务方案</h2>
|
||||||
<el-button type="primary" class="consult-btn"> 领取您的AI健康解决方案 </el-button>
|
<el-button type="primary" class="consult-btn" @click="openReport"> 领取您的AI健康解决方案 </el-button>
|
||||||
</div>
|
</div>
|
||||||
<div class="app-download">
|
<div class="app-download">
|
||||||
<div class="app-item">
|
<div class="app-item">
|
||||||
@ -20,20 +20,17 @@
|
|||||||
<span>版本号:1.1.1</span>
|
<span>版本号:1.1.1</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="contact-info">-->
|
|
||||||
<!-- <p>联系我们:181-4852-2763</p>-->
|
|
||||||
<!-- <p>合作邮箱:tfhux2023.com</p>-->
|
|
||||||
<!-- <div class="qrcode-group">-->
|
|
||||||
<!-- <img src="@/assets/qr-code-1.png" alt="公众号" />-->
|
|
||||||
<!-- <img src="@/assets/qr-code-2.png" alt="小程序" />-->
|
|
||||||
<!-- <img src="@/assets/qr-code-3.png" alt="官网" />-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ElButton } from 'element-plus' // 确保按需导入
|
import { ElButton } from 'element-plus'
|
||||||
|
import { openExternalLink } from '@/utils/navigation.ts' // 确保按需导入
|
||||||
|
|
||||||
|
// 外部链接跳转(新标签)
|
||||||
|
const openReport = () => {
|
||||||
|
openExternalLink('https://sj.qq.com/appdetail/com.ufutx.lovehealth', '_blank')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user