普兆健康管家前端代码仓库
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

295 lines
6.6 KiB

<template>
<view class="page__view">
<navbar bgColor="#FFFFFF" >
<image class="nav-icon" src="@/static/image/icon-nav.png" mode="widthFix"></image>
</navbar>
<view class="content">
<productSwiper :list="productSwiperList"></productSwiper>
<view class="section">
<sectionHeader title="个性推荐" desc="Personal Recommendation"></sectionHeader>
<recommend-swiper :list="recommendList"></recommend-swiper>
<health-records-intro :list="detectionStepList"></health-records-intro>
</view>
<view class="section">
<achievement-intro :list="achievementList"></achievement-intro>
</view>
<view class="section">
<sectionHeader title="团队成员背景" desc="Background of Team Members"></sectionHeader>
<team-bg-intro :list="medicineList"></team-bg-intro>
</view>
<view class="section">
<sectionHeader desc="Background of Team Members">
<template #title>
关注我们<br/>参与更多健康活动
</template>
</sectionHeader>
<follow-us-intro :articleList="followReasonList" :wayList="followWayList"></follow-us-intro>
</view>
</view>
<tabber select="home" />
</view>
</template>
<script>
import tabber from '@/components/base/tabbar.vue'
import sectionHeader from '@/components/home/sectionHeader.vue'
import productSwiper from '@/components/home/productSwiper.vue'
import recommendSwiper from '@/pages_order/home/recommendSwiper.vue'
import healthRecordsIntro from '@/pages_order/home/healthRecordsIntro.vue'
import achievementIntro from '@/pages_order/home/achievementIntro.vue'
import teamBgIntro from '@/pages_order/home/teamBgIntro.vue'
import followUsIntro from '@/pages_order/home/followUsIntro.vue'
export default {
components: {
productSwiper,
sectionHeader,
recommendSwiper,
healthRecordsIntro,
achievementIntro,
teamBgIntro,
followUsIntro,
tabber,
},
data() {
return {
productSwiperList: [],
recommendList: [],
detectionStepList: [],
achievementList: [],
medicineList: [],
followReasonList: [],
followWayList: [],
}
},
onLoad() {
this.productSwiperList = [
{
id: '001',
url: '',
arr: [
{ text: '你是独一无二的', class: 'font1' },
{ text: '你的健康数据也是', class: 'font2' },
{ text: '普兆,即精准', class: 'font3' },
],
btns: [
{ text: '全部产品', path: '/pages_order/auth/wxLogin' },
{ text: '定制健康档案', path: '/pages_order/auth/wxLogin' },
],
},
{
id: '002',
url: '',
arr: [
{ text: '你是独一无二的', class: 'font1' },
{ text: '你的健康数据也是', class: 'font2' },
{ text: '普兆,即精准', class: 'font3' },
],
btns: [
{ text: '全部产品', path: '/pages_order/auth/wxLogin' },
{ text: '定制健康档案', path: '/pages_order/auth/wxLogin' },
],
},
{
id: '003',
url: '',
arr: [
{ text: '你是独一无二的', class: 'font1' },
{ text: '你的健康数据也是', class: 'font2' },
{ text: '普兆,即精准', class: 'font3' },
],
btns: [
{ text: '全部产品', path: '/pages_order/auth/wxLogin' },
{ text: '定制健康档案', path: '/pages_order/auth/wxLogin' },
],
},
]
this.recommendList = [
{
id: '001',
url: '',
arr: [
{ text: '你的身体在“说话”', class: 'font1' },
{ text: '你听懂了吗?', class: 'font2' },
{ text: '5分钟问卷', class: 'font3' },
],
btn: { text: 'Al定制方案', path: '/pages_order/auth/wxLogin' },
},
{
id: '002',
url: '',
arr: [
{ text: '你的健康', class: 'font1' },
{ text: '需要“管理员”', class: 'font2' },
{ text: '私人营养师全程跟进', class: 'font3' },
],
btn: { text: '领取管家', path: '/pages_order/auth/wxLogin' },
},
{
id: '003',
url: '',
arr: [
{ text: '你的身体在“说话”', class: 'font1' },
{ text: '你听懂了吗?', class: 'font2' },
{ text: '5分钟问卷', class: 'font3' },
],
btn: { text: 'Al定制方案', path: '/pages_order/auth/wxLogin' },
},
]
this.detectionStepList = [
{
id: '001',
title: '定制检测',
url: '',
desc: '测评读懂你的身体语言,完成定制化检测。',
},
{
id: '002',
title: '定制检测',
url: '',
desc: '用数据精准跟踪你的健康档案。',
},
{
id: '003',
title: '定制检测',
url: '',
desc: '测评读懂你的身体语言,完成定制化检测。',
},
]
this.achievementList = [
{
id: '001',
url: '',
},
{
id: '002',
url: '',
},
{
id: '003',
url: '',
},
]
this.medicineList = [
{
id: '001',
url: '',
zh: '维生素D',
en: 'Vitamin D',
},
{
id: '002',
url: '',
zh: '维生素B2',
en: 'Vitamin B2',
},
{
id: '003',
url: '',
zh: '维生素P',
en: 'Vitamin P',
},
{
id: '004',
url: '',
zh: '维生素M',
en: 'Vitamin M',
},
{
id: '005',
url: '',
zh: '维生素B1',
en: 'Vitamin B1',
},
{
id: '006',
url: '',
zh: '维生素C',
en: 'Vitamin C',
},
]
this.followReasonList = [
{
id: '001',
url: '',
path: '/pages_order/auth/wxLogin',
},
{
id: '002',
url: '',
path: '/pages_order/auth/wxLogin',
},
{
id: '003',
url: '',
path: '/pages_order/auth/wxLogin',
},
]
this.followWayList = [
{
id: '001',
title: '公众号',
desc: 'PETUAL MEDICAL',
url: '/pages_order/static/index/wx.png',
path: '/pages_order/auth/wxLogin',
},
{
id: '002',
title: '健康伙伴',
desc: 'PETUAL MEDICAL',
url: '/pages_order/static/index/group.png',
path: '/pages_order/auth/wxLogin',
},
{
id: '003',
title: '官方号',
desc: 'PETUAL MEDICAL',
url: '/pages_order/static/index/xhs.png',
path: '/pages_order/auth/wxLogin',
},
]
},
methods: {
},
}
</script>
<style scoped lang="scss">
.page__view {
width: 100vw;
min-height: 100vh;
background-color: $uni-bg-color;
position: relative;
}
.nav-icon {
width: 200rpx;
height: auto;
vertical-align: top;
}
.content {
// padding: 80rpx 32rpx 182rpx 32rpx;
padding: 70rpx 0 182rpx 0;
}
.section {
margin-top: 80rpx;
}
</style>