heshanApp/pages/index/components/homeIndex.vue

<template>

	<view :class="source=='course'?'home-content home-contentTop':'home-content'">
		<mescroll-body ref="mescrollRef" @init="mescrollInit" top="0" bottom="20" :down="downOption" :up="upOption"
			@down="downCallback" @up="upCallback">
			<!-- 搜索 -->
			<view class="search-box" v-if="false">
				<view class="left">
					<image src="@/static/image/home1/search_icon.png" mode=""></image>
					<input class="input-text" disabled="true" type="text" placeholder-class="place-hold"
						value="输入疾病 | 科室 | 医生 | 知识" placeholder="" />
				</view>
				<view class="right">
					<button class="button" @click="showQidai()">搜索</button>
				</view>
			</view>

			<!-- banner -->
			<view class="swiper-box" :style="{paddingTop:source=='course'?'0':'22rpx'}">
				<swiper class="swiper" style="height: 233rpx;" circular :indicator-dots="true" :autoplay="true"
					:interval="3000" :duration="1000">
					<swiper-item v-for="(url,index) in advImgs" :key="index" class="swiper-item"
						@click="handleAdvClick(index)">
						<image style="width: 100%;height: 100%;" :src="url" mode="aspectFill"></image>
					</swiper-item>
				</swiper>
			</view>

			<!-- 医生智能体 -->
			<!-- <view class="box-nav es-mt-32">
				<view class="u-f">
					<view class="title es-mr-10">医生智能体</view>
					<view class="es-fs-22 u-f-ajc doctorAgentTip">
						7x24小时咨询
					</view>
				</view>
				<view class="box-nav-right" @tap="navTo('/pages/agent/doctorList')">
					<text>全部医生</text>
					<image class="right-arrow" src="@/static/image/home1/my_right_arrow.png" mode="aspectFill"></image>
				</view>
			</view>
			<scroll-view scroll-x="true" class="scroll-X">
				<view class="doctorIntelligentAgent" v-for="(item,index) in dataList" :key="index"
					@tap="navTo('/pages/agent/doctorDetail?doctorId='+item.doctorId)"
					:style="{ backgroundImage: 'url(/static/image/agent/ai_doctor_bg' + (index+1) + '.png)' }">
					<view class="es-mt-40 u-f-ajc u-f-fc">
						<image class="doctorIntelligentAgent-image"
							:src="item.avatar || '/static/image/hall/my_heads_icon.png'" mode=""></image>
						<view class="es-c-22 es-mt-10 es-fs-32 es-fw-600">
							{{item.doctorName}}
						</view>
						<view class="es-c-99 es-fs-22 es-mt-8 u-f">
							<view class="es-mr-14 textOne es-w-106 es-tc">{{item.introduction}}</view>
							<view class="line es-mr-14"></view>
							<view class="textOne">{{item.position}}</view>
						</view>
						<view class="es-fs-24 es-c-white es-mt-14 doctorIntelligentAgent-btn u-f-ajc">
							<text class="es-mr-10">去问诊</text>
							<u-icon name="arrow-right" size="24rpx" color="#FFFFFF"></u-icon>
						</view>
					</view>
				</view>
			</scroll-view> -->
			
			<!-- 菜单(ai舌诊) -->
			<view class="nav" id="indexguide1">
				<view class="grid-item" v-for="(item ,index) in navList" :key="index">
					<view class="grid-item-box" @tap="topNavTo(item.pageUrl,index)">
						<image class="image" :src="item.img" mode="aspectFill" />
						<text class="text">{{item.name}}</text>
					</view>
				</view>
			</view>
			<!-- 横向banner 生活馆 -->
			<scroll-view scroll-x="true" class="scroll-X">
				<view class="scroll-item zyss_bg" v-for="(item,index) in midAdvs" :key="index"
					@tap="midAvTap(item,index)">
					<image class="bg_img" :src="item.imageUrl" mode="widthFix"></image>
				</view>
			</scroll-view>

			<!-- 快速问诊 -->
			<view class="banner-nav" id="indexguide2">
				<view class="banner-nav-item kswz-bg" @tap="loginNavTo('/pages/doctor/doctorList')">
					<view class="title">快速问诊</view>
					<view>专业医师快速</view>
				</view>
				<view class="banner-nav-item jkhz-bg" @tap="loginNavTo('/pages/store/inquirySelectType?isShare=1')">
					<view class="title">健康会诊</view>
					<view>权威专家为您</view>
					<view class="jkhz">答疑解惑</view>
				</view>
				<view class="banner-nav-item yyzx-bg"
					@click="loginNavTo('/pages/store/inquirySelect?inquiryType=3&isShare=1')">
					<view class="title">用药咨询</view>
					<view>执业药师提供</view>
					<view class="yyzx">用药指导</view>
				</view>
				<view class="banner-nav-item zjyz-bg" @tap="loginNavTo('/pages/doctor/doctorList')">
					<view class="title">专家约诊</view>
					<view>在线预约专家</view>
					<view class="zjyz">诊疗服务</view>
				</view>
			</view>

			<!-- 河山恒康百事通 -->
			<template v-if='ailist&&ailist.length>0'>
				<view class="box-nav">
					<view class="title">河山恒康百事通</view>
					<view class="box-nav-right" v-if="!$isIos()" @click="loginNavTo('/pages/ai/list')">
						<text>更多</text>
						<image class="right-arrow" src="@/static/image/home1/my_right_arrow.png" mode="aspectFill">
						</image>
					</view>
				</view>
				<view class="ai-banner">
					<swiper class="ai-banner-swiper" :current="current" :style="{height: swHeight + 'rpx'}"
						:autoplay="true" circular interval="3000" duration="1000" @animationfinish="animationfinish">
						<swiper-item class="ai-banner-swiper-item" v-for="(group, index) in ailist" :key="index">
							<image class="ai-banner-img" v-for="(item,idx) in group" :key="idx"
								:src="item.recommendImgUrl" mode="aspectFill"
								@click="loginNavTo('/pages/ai/chat?roleId='+item.roleId+'&roleName='+item.roleName+'&sessionId='+item.sessionId || '')">
							</image>
						</swiper-item>
					</swiper>
				</view>
			</template>

			<!-- 健康自测 -->
			<view id="indexguide3">
						 <view class="box-nav">
								<view class="title">健康自测</view>
								<view class="box-nav-right" @click="navTo('/pages/article/testList')">
									<text>更多自测</text>
									<image class="right-arrow" src="@/static/image/home1/my_right_arrow.png" mode="aspectFill"></image>
								</view>
						 </view>
				 
						 <view class="selfrated-health">
									<view class="selfrated-health-item" @click="navTo('/pages/article/testDetails?tempId=5')">
										<image src="@/static/image/home1/icon/zytz_icon.png" mode="aspectFill"></image>
										<view>中医体质</view>
									</view>
									<view class="selfrated-health-item" @click="navTo('/pages/article/testDetails?tempId=8')">
										<image src="@/static/image/home1/icon/xnxg_icon.png" mode="aspectFill"></image>
										<view>心脑血管</view>
									</view>
									<view class="selfrated-health-item" @click="navTo('/pages/article/testDetails?tempId=14')">
										<image src="@/static/image/home1/icon/nxjk_icon.png" mode="aspectFill"></image>
										<view>男性健康</view>
									</view>
									<view class="selfrated-health-item" @click="navTo('/pages/article/testDetails?tempId=18')">
										<image src="@/static/image/home1/icon/nvxjk_icon.png" mode="aspectFill"></image>
										<view>女性健康</view>
									</view>
						  </view>
				 </view>
				
			<!-- 推荐医生 -->
			<view class="box-nav">
				<view class="title">推荐医生</view>
				<view class="box-nav-right" @tap="navTo('/pages/doctor/doctorList')">
					<text>更多医生</text>
					<image class="right-arrow" src="@/static/image/home1/my_right_arrow.png" mode="aspectFill"></image>
				</view>
			</view>

			<!-- <scroll-view class="scroll-container " scroll-x="true" scroll-with-animation="true" overflow-anchor="none">
					<view class="box-doctor" v-for="(item,index) in doctors"  :key="index">
						  <docterItem class="gapitem"  :item="item" @tap.native="navTo('/pages/doctor/doctorDetails?doctorId='+item.doctorId)"></docterItem>
					</view>
				</scroll-view> -->

			<swiper class="swiper-doctor" circular :autoplay="true" interval="3000" duration="1000"
				display-multiple-items='2' next-margin="20px">
				<swiper-item v-for="(item,index) in doctors" :key="index">
					<docterItem class="gapitem" :item="item"
						@click.native="navTo('/pages/doctor/doctorDetails?doctorId='+item.doctorId)"></docterItem>
				</swiper-item>
			</swiper>

			<!-- 养生干货 -->
			<!-- <template v-if="articles.length>0">
				<view class="box-nav">
					<view class="title">养生干货</view>
					<view class="box-nav-right" @click="navTo('/pages/article/articleList')">
						<text>更多</text>
						<image class="right-arrow" src="@/static/image/home1/my_right_arrow.png" mode="aspectFill">
						</image>
					</view>
				</view>
				<view style="padding: 0 24rpx;">
					<view class="article-box">
						<view class="item" @click="navTo('/pages/article/articleDetails?articleId='+item.articleId)"
							v-for="(item,index) in articles" :key="index">
							<view class="left">
								<view class="title textTwo">
									{{item.title}}
								</view>
								<view class="views">
									浏览量 {{item.views}}
								</view>
							</view>
							<view class="right">
								<image :src="item.imageUrl"></image>
							</view>
						</view>
					</view>
				</view>
			</template> -->

			<!-- 健康疗法 -->
			<view class="box-nav" id="indexguide4">
				<view class="title">健康疗法</view>
				<view class="box-nav-right" @click="navTo('/pages/store/packageList')">
					<text>更多疗法</text>
					<image class="right-arrow" src="@/static/image/home1/my_right_arrow.png" mode="aspectFill"></image>
				</view>
			</view>
			<view class="box-goods">
				<goodsItem v-if="packages.length>0" class="gapitem indexguide4-child" v-for="(item,index) in packages"
					:key="index" :item=item
					@click.native="navTo('/pages/store/packageDetails?packageId='+item.packageId)"></goodsItem>
				<view v-else class="es  x-c es-h-200 indexguide4-child" style="width: 100%;">
					<view class="y-bc flex">
						<image src="../../../static/image/nodata.png" class="es-w-148 es-h-96 es-mt-20"></image>
						<view class="es-c-33 es-fs-26 x-c es-mt-20 es-mb-40">暂无疗法</view>
					</view>
				</view>
			</view>
			<!-- 签到弹窗 -->
			<signPop ref="signPop" :userSign="userSign" />

			<!-- <healthButlerPop :show="showMask"  @close="closeAct" /> -->


		</mescroll-body>

	</view>
</template>

<script>
	import {getAiDoctorList} from '@/api/agent.js'
	import {
		getArticleList
	} from "@/api/article.js"
	import {
		getDoctorList
	} from '@/api/doctor.js'
	import {
		getPackageList
	} from '@/api/package.js'

	import docterItem from "../components/docterItem.vue";
	import goodsItem from "../components/goodsItem.vue"

	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import mescrollBody from "@/uni_modules/mescroll-uni/components/mescroll-body/mescroll-body.vue";
	// import permision from "@/js_sdk/wa-permission/permission.js" 
	import {
		getAdvList,
		getAppAdvList
	} from '@/api/adv.js'
	import {
		getUserSign
	} from '@/api/integral';
	import {
		getLocation
	} from '@/api/index.js'
	import {
		getRecommendRoleList
	} from "@/api/ai.js"
	// #ifdef APP-PLUS
	const idCode = uni.requireNativePlugin('Ba-IdCode')
	// #endif
	// const idCode = uni.requireNativePlugin('Ba-IdCode')
	export default {
		mixins: [MescrollMixin], // 使用mixin
		components: {
			mescrollBody,
			docterItem,
			goodsItem
		},
		props: ['source'],
		data() {
			return {
				keyword: "",
				advImgs: [],
				advs: [],
				midAdvs: [],
				doctors: [],
				packages: [],
				company: null,
				newCustomerCounts: 0,
				fullCustomerCounts: 0,
				myCustomerCounts: 0,
				dayOrderCounts: 0,
				doBuyOrderCounts: 0,
				mescroll: null,
				downOption: { //下拉刷新
					use: true,
					auto: false // 不自动加载 (mixin已处理第一个tab触发downCallback)
				},
				upOption: { //上拉加载
					auto: false, // 不自动加载
					page: {
						num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
						size: 10 // 每页数据的数量
					},
					noMoreSize: 5, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
					empty: {
						tip: '~ 暂无疗法 ~' // 提示
						// btnText: '去看看'
					},
					use: false
				},
				tdlist: [],
				show: false,
				user: {
					avatar: "",
					userName: this.$qconfig.appName,
					mobile: ""
				},
				userScrollTop: 0,
				fixedTop: false, // 是否固定头部
				connectStatus: '未链接',
				deviceToken: '',
				udid: '',
				registrationID: '',
				appkey: '',
				imageList: ["../../../static/image/home/banner.png"],
				userBenefits: {},
				userSign: {},
				navList: [{
						img: "/static/image/home1/icon/yssl_icon.png",
						// img: "/static/newYear/yssl_icon52.png",
						name: "药膳食疗",
						pageUrl: "/pages/article/medicatedFoodList"
					},
					{
						img: "/static/image/home1/icon/jlxw_icon.png",
						// img: "/static/newYear/jlxw_icon52.png",
						name: "经络穴位",
						pageUrl: "/pages/article/vesselList"
					},
					// {
					// 	img: "/static/image/home1/icon/wdzq_icon.png",
					// 	name: "问答专区",
					// 	pageUrl:"/pages/article/questionsList"
					// },
					// {
					// 	img: "/static/image/home1/icon/jkzc_icon.png",
					// 	name: "健康自测",
					// 	pageUrl:"/pages/article/testList"
					// }, 
					{
						img: "/static/image/home1/icon/jb_icon.png",
						// img: "/static/newYear/jb_icon52.png",
						name: "疾病",
						pageUrl: "/pages/article/diseaseList"
					}, {
						img: "/static/image/home1/icon/zytj_icon1.png",
						// img: "/static/newYear/zytj_icon52.png",
						name: "中药图解",
						pageUrl: "/pages/article/chineseMedicineList"
					},
					{
						img: "/static/image/home1/icon/mfjy_icon.png",
						// img: "/static/newYear/mfjy_icon52.png",
						name: "名方今用",
						pageUrl: "/pages/article/famousPrescribeList"
					}, {
						img: "/static/image/home1/icon/yssp_icon.png",
						// img: "/static/newYear/ysjt_icon52.png",
						name: "养生讲堂",
						pageUrl: "/pages/doctor/doctorArticleList"
					}
					// , {
					// 	img:"/static/image/home1/icon/ys_icon.png",
					// 	name: "医书",
					// 	pageUrl:"/pages/doctor/doctorArticleList"
					// }
				],
				step: {
					name: 'indexguide',
					guideList: [{
						el: '',
						tips: '上下滑动，了解河山恒康',
						next: '',
					}, {
						el: '#indexguide1',
						tips: '药膳、经络、疾病医学百科知识快速查询',
						next: '下一步',
					}, {
						el: '#indexguide2',
						tips: '权威医生、药师实时在线咨询',
						next: '下一步',
					}, {
						el: '#indexguide3',
						tips: '免费健康自测，了解自身健康情况',
						next: '下一步',
					}, {
						el: '#indexguide4',
						childEl: ".indexguide4-child",
						tips: '购买健康疗法享健康',
						next: '完成',
					}]
				},
				guideIndex: null,
				showMask: true,
				ailist: [],
				current: 0,
				swHeight: 0,
				articles: [],
				dataList: [], //智能体医生
			}
		},
		// onShow() {
		// 	this.getAdvList();
		// 	this.getAppAdvList();
		// 	this.getDoctorList();
		// 	this.getPackageList(1);
		// },
		// onLoad() {
		// 	 // #ifdef APP-PLUS
		// 	   if(plus.runtime.isAgreePrivacy()) {
		// 			// 用户同意隐私政策，可以调用限制API
		// 			//this.doGetLocation();
		// 			//uni.showToast({icon:'none',title: "已同意隐私政策"});
		// 			this.registerIdCode();

		// 	   }else{
		// 	        //uni.showToast({icon:'none',title: "未同意隐私政策"});
		// 	   }
		// 	// #endif

		// 	let that=this;
		// 	uni.setNavigationBarTitle({
		// 		title: that.$qconfig.appName
		// 	});
		// 	this.guideIndex=uni.getStorageSync("indexguide");
		// 	if(this.$isLogin()){
		// 		this.getUserSign();
		// 	}else{
		// 		let signStr="[{\"signNum\":10,\"sort\":1,\"day\":\"第1天\"},{\"signNum\":20,\"sort\":2,\"day\":\"第2天\"},{\"signNum\":30,\"sort\":3,\"day\":\"第3天\"},{\"signNum\":40,\"sort\":4,\"day\":\"第4天\"},{\"signNum\":50,\"sort\":5,\"day\":\"第5天\"},{\"signNum\":50,\"sort\":6,\"day\":\"第6天\"},{\"signNum\":50,\"sort\":7,\"day\":\"第7天\"}]";
		// 		this.$nextTick(()=>{
		// 			this.userSign={"signNum":0,"isDaySign":0,"integral":0,"sign":JSON.parse(signStr)  };
		// 			if(this.guideIndex){
		// 				this.$refs.signPop.open();
		// 			}
		// 		});
		// 	}
		// },
		created() {
			this.guideIndex = uni.getStorageSync("indexguide");
			if (this.$isLogin() && this.source != 'course') {
				this.getUserSign();
			} else {
				let signStr =
					"[{\"signNum\":10,\"sort\":1,\"day\":\"第1天\"},{\"signNum\":20,\"sort\":2,\"day\":\"第2天\"},{\"signNum\":30,\"sort\":3,\"day\":\"第3天\"},{\"signNum\":40,\"sort\":4,\"day\":\"第4天\"},{\"signNum\":50,\"sort\":5,\"day\":\"第5天\"},{\"signNum\":50,\"sort\":6,\"day\":\"第6天\"},{\"signNum\":50,\"sort\":7,\"day\":\"第7天\"}]";
				this.$nextTick(() => {
					this.userSign = {
						"signNum": 0,
						"isDaySign": 0,
						"integral": 0,
						"sign": JSON.parse(signStr)
					};
					if (this.guideIndex && this.source != 'course') {
						this.$refs.signPop.open();
					}
				});
			}
			uni.$on('getIndexScanCode', (data) => {
				this.$handleBindCompanyFsUser(data)
			});
			if(!this.$isIos()){
				let item= {
					 img: "/static/image/home1/icon/aiTongue.png",
					 name: "AI舌诊",
					 pageUrl:"/pages/user/tongue/index"
				};
				
				let item1= {
					 img: "/static/image/home1/icon/jkzc_icon.png",
					 name: "健康自测",
					 pageUrl:"/pages/article/testList"
				};
				this.navList.splice(2, 0, item1);
				this.navList.unshift(item);

			}
			this.getData()
		},
		beforeDestroy() {
			uni.$off("getIndexScanCode")
		},
		methods: {
			getData() {
				let that = this;
				let data = {
					pageNum: 1,
					pageSize: 5
				};
				getAiDoctorList(data).then(res => {
					if (res.code == 200) {
						that.dataList = res.data.list;
					} else {
						uni.showToast({
							icon: 'none',
							title: "请求失败",
						});
						that.dataList = [];
					}
				});
			},
			closeAct() {
				this.showMask = false;
			},
			initReady() {

			},
			initShow() {
				this.getAdvList();
				this.getAppAdvList();
				this.getDoctorList();
				this.getArticleList();
				this.getPackageList(1);
				this.getAiTui()
			},
			mescrollInit(mescroll) {
				this.mescroll = mescroll;
			},
			/*下拉刷新的回调 */
			downCallback(mescroll) {
				this.getAiTui()
				setTimeout(() => {
					this.mescroll.endSuccess();
				}, 500)
			},
			getAiTui() {
				getRecommendRoleList().then((res => {
					if (res.code == 200) {
						const result = [];
						while (res.list && res.list.length) {
							result.push(res.list.splice(0, 4)); // 提取前 groupSize 个元素并存储
						}
						this.ailist = result
						this.updateSwiperHeight()
					}
				}))
			},
			animationfinish(event) {
				this.current = event.detail.current
				this.updateSwiperHeight()
			},
			updateSwiperHeight() {
				if (this.ailist[this.current].length > 2) {
					this.swHeight = 340;
				} else {
					this.swHeight = 160;
				}
			},
			groupArray(arr, groupSize) {
				const result = [];
				for (let i = 0; i < arr.length; i += groupSize) {
					const group = arr.slice(i, i + groupSize);
					const groupName = `arry${Math.floor(i / groupSize) + 1}`; // 生成动态键名
					const groupObject = {};
					groupObject[groupName] = group;
					result.push(groupObject);
				}
				return result;
			},
			getAdvList() {
				//联网加载数据
				var that = this;
				var data = {
					advType: 1
				};
				getAdvList(data).then(res => {
					if (res.code == 200) {
						that.advImgs = [];
						that.advs = [];
						res.data.forEach(function(element) {
							if (element.imageUrl != null && element.imageUrl != "") {
								that.advs.push(element);
								that.advImgs.push(element.imageUrl);
							}
						});

					} else {
						uni.showToast({
							icon: 'none',
							title: "请求失败",
						});
					}
				});
			},
			getAppAdvList() {
				getAppAdvList().then(res => {
					if (res.code == 200) {
						this.midAdvs = res.data;

					} else {
						uni.showToast({
							icon: 'none',
							title: "请求失败"
						});
					}
				});
			},
			getDoctorList() {
				//联网加载数据
				var that = this;
				var data = {
					isTui: 1,
					pageNum: 1,
					pageSize: 10,
				};
				getDoctorList(data).then(res => {
					if (res.code == 200) {
						this.doctors = res.data.list;
						this.doctors.forEach(function(value, index, array) {
							value.prices = JSON.parse(value.priceJson)
						});
					} else {
						uni.showToast({
							icon: 'none',
							title: "请求失败",
						});
					}
				});
			},
			getArticleList() {
				let param = {
					isTui: 1,
					pageNum: 1,
					pageSize: 10,
				};
				getArticleList(param).then(res => {
					if (res.code == 200) {
						this.articles = res.data.list;
					} else {
						uni.showToast({
							icon: 'none',
							title: "请求失败",
						});
					}
				});
			},
			getPackageList(pageNum) {
				//联网加载数据
				var that = this;
				var data = {
					isShow: 1,
					pageNum: pageNum,
					pageSize: 10
				};
				getPackageList(data).then(res => {
					if (res.code == 200) {
						this.packages = res.data.list;
					} else {
						uni.showToast({
							icon: 'none',
							title: "请求失败"
						});
					}
				});
			},
			getUserSign() {
				getUserSign().then(res => {
						if (res.code == 200) {
							this.userSign = {
								"signNum": res.signNum,
								"isDaySign": res.isDaySign,
								"integral": res.integral,
								"sign": JSON.parse(res.sign)
							};
							this.$nextTick(() => {
								if (this.guideIndex && !res.isDaySign) {
									this.$refs.signPop.open();
								}
							});
						}
					},
					rej => {}
				);
			},
			midAvTap(item, index) {
				if (index == 0) {
					this.navToMinProgram();
					return;
				}
				// #ifndef MP-WEIXIN
				if (!this.$isEmpty(item.appAdvUrl)) {
					this.navTo(item.appAdvUrl);
				}
				// #endif
				// #ifdef MP-WEIXIN
				if (!this.$isEmpty(item.advUrl)) {
					this.navTo(item.advUrl);
				}
				// #endif
			},
			// 页面跳转
			navTo(url) {
				console.log("qxj navTo url:" + url);
				uni.navigateTo({
					url: url
				})
			},
			loginNavTo(url) {
				if (!this.$isLogin()) {
					this.$showLoginPage();
					return;
				}
				uni.navigateTo({
					url: url
				});
			},
			navVideo() {
				console.log("navVideo");
				uni.navigateTo({
					url: "/pages/course/video/living-app"
				});
			},
			showQidai() {
				//uni.showToast({title: "功能完善中,敬请期待...",icon:"none"});
			},
			handleAdvClick(index) {
				var ad = this.advs[index];
				console.log(ad.appAdvUrl);
				if (ad.showType == 1) {
					uni.setStorageSync('url', ad.appAdvUrl);
					uni.navigateTo({
						url: "h5"
					})
				} else if (ad.showType == 3) {
					uni.setStorageSync('content', ad.content);
					uni.navigateTo({
						url: "content"
					})
				} else {
					uni.navigateTo({
						url: ad.appAdvUrl
					})
				}
			},
			search() {

			},
			topNavTo(url, index) {
				if (index == 0) {
					//this.navTo(url);
					this.loginNavTo(url);
				} else {
					this.navTo(url);
				}
			},
			navToMinProgram() {
				// #ifdef APP-PLUS
				plus.share.getServices(res => {
					let sweixin = null;
					sweixin = res.find(i => i.id === 'weixin')
					if (sweixin) { // 分享跳转到微信小程序
						sweixin.launchMiniProgram({
							id: "gh_fd0ff58d3f4d", //河山恒康甄选生活馆小程序原生id
							path: "", //    打开小程序的页面路径，不传默认跳转首页
							type: 0 //微信小程序版本类型，可取值： 0-正式版； 1-测试版； 2-体验版。 默认值为0。
						});
					} else {
						uni.showToast({
							title: '请安装微信',
							icon: 'none'
						})
					}
				}, err => {
					console.log("分享失败"); // 获取分享服务列表失败
				});
				// #endif
			}
		}
	}
</script>

<style scoped lang="scss">
	@mixin u-flex($flexD, $alignI, $justifyC) {
		display: flex;
		flex-direction: $flexD;
		align-items: $alignI;
		justify-content: $justifyC;
	}

	.bg-img {
		position: fixed;
		width: 100%;
		height: 524rpx;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 0;
	}

	.bgConent {
		background-image: url("@/static/image/home/home_top_bg.png");
		background-repeat: no-repeat;
		background-size: 100%;
		background-color: #F4F7FA;
		position: absolute;
		width: 100%;
		height: 524rpx;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 0;
	}

	.grace-page-header {
		position: fixed;
		width: 100%;
		left: 0;
		top: 0;
		z-index: 98;
		border-bottom: 0px solid #FFFFFF;

		.grace-page-status-bar {
			width: 100%;
			height: var(--status-bar-height);
		}

		.grace-page-header-nav {
			width: 100%;
			display: flex;
			flex-direction: row;
			flex-wrap: nowrap;
			align-items: center;
			justify-content: space-between;
		}
	}

	.nav_box {
		width: 100%;

		.status_bar {
			height: var(--status-bar-height);
			width: 100%;
		}

		.nav_bar {
			height: 44px;
			width: 100%;
		}
	}

	.title {
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #222222;
		line-height: 44rpx;
	}

	.home-contentTop {
		padding-top: 0 !important;
	}

	.home-content {
		width: 100%;
		box-sizing: border-box;
		// overflow: hidden;
		// margin-top: var(--status-bar-height);
		// padding-top: 24rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #999999;
		// background-image: url("@/static/image/home/home_top_bg.png");
		background-repeat: no-repeat;
		background-size: 100%;

		// box-sizing: border-box;
		padding-top: calc(var(--status-bar-height) + 44px);
		// padding-bottom: var(--window-bottom);
		// font-family: PingFang SC, PingFang SC;
		// font-weight: 400;
		// font-size: 24rpx;
		// color: #999999;
		position: relative;
		// z-index: 2;
	}

	.content-header {
		height: 80rpx;
		padding: 0 24rpx;
		@include u-flex(row, center, space-between);

		&-l {
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			color: #FFFFFF;
			line-height: 28rpx;
			@include u-flex(row, center, flex-start);

			.address {
				width: 38rpx;
				height: 38rpx;
				margin-right: 6rpx;
			}

			.arrow_down {
				width: 24rpx;
				height: 24rpx;
				margin-left: 8rpx;
			}
		}

		&-r {
			@include u-flex(row, center, flex-start);

			view {
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 22rpx;
				color: #FFFFFF;
				line-height: 24rpx;
				@include u-flex(column, center, space-between);
				width: 80rpx;
				height: 80rpx;
				padding-top: 2rpx;
				padding-bottom: 6rpx;

			}

			image {
				width: 40rpx;
				height: 40rpx;
			}
		}
	}

	.search-box {
		width: calc(100% - 60rpx);
		height: 70rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		background: rgba(255, 255, 255, 0.3);
		border-radius: 34rpx;
		border: 2rpx solid #FFFFFF;
		border-right: none;
		margin: 30rpx;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		padding-left: 30rpx;
		position: relative;
		z-index: 10;

		.left {
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: flex-start;
			flex: 1;
		}

		image {
			width: 28upx;
			height: 28upx;
			margin-right: 16upx;
		}

		.input-text {
			color: #fff;
			font-size: 24rpx;
			height: 70rpx;
			line-height: 70rpx;
			width: 100%;
		}

		.button {
			background: #FF5030;
			border-radius: 29rpx;
			width: 108rpx;
			height: 54rpx;
			line-height: 54rpx;
			color: #fff;
			font-size: 26rpx;
			margin-right: 10rpx;
		}
	}


	::v-deep .uni-searchbar__text-placeholder,
	.uni-input-placeholder {
		color: #fff;
		font-weight: 400;
		font-size: 24rpx;
	}

	.place-hold {
		color: #ffffff;
		font-weight: 400;
		font-size: 24rpx;
	}


	.search-box1 {
		height: 68rpx;
		margin: 26rpx 24rpx 10rpx 24rpx;
		background: rgba(255, 255, 255, 0.3);
		border-radius: 34rpx;
		border: 2rpx solid #FFFFFF;
		border-right: none;
		background-color: blue;
		overflow: hidden;
		@include u-flex(row, center, space-between);

		.search {
			flex: 1;
			padding: 0 0 0 12rpx;
			background-color: transparent;
			font-weight: 400;
			font-size: 24rpx;
		}

		image {
			width: 24rpx;
			height: 24rpx;
		}

		::v-deep .uni-searchbar__text-placeholder,
		.uni-input-placeholder {
			color: #fff;
			font-weight: 400;
			font-size: 24rpx;
		}

		.search-text {
			flex-shrink: 0;
			width: 144rpx;
			height: 68rpx;
			background: #FFFFFF;
			border-radius: 34rpx 34rpx 34rpx 34rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 600;
			font-size: 24rpx;
			color: #FF5030;
			line-height: 68rpx;
			text-align: center;
		}
	}


	.swiper-box {
		padding: 22rpx 0;
		padding-bottom: 0;

		.swiper {
			width: 702rpx;
			height: 228rpx;
			margin: 0 auto;
			// background: #E75848;
			border-radius: 20rpx;

			.swiper-item {
				width: 702rpx;
				height: 228rpx;

				image {
					border-radius: 20rpx;
				}
			}
		}

		::v-deep {
			.uni-swiper-dot {
				width: 10rpx;
				height: 10rpx;
				background: rgba(255, 255, 255, 0.5);
			}

			.uni-swiper-dot-active {
				width: 24rpx;
				height: 10rpx;
				background-color: #FFFFFF;
				border-radius: 5rpx 5rpx 5rpx 5rpx;
			}
		}
	}

	.nav {
		background: #FFFFFF;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		padding-top: 24rpx;
		margin: 24rpx 24rpx 0 24rpx;
		position: relative;
		z-index: 2;
		@include u-flex(row, center, flex-start);
		flex-wrap: wrap;

		.grid-item {
			width: 25%;
		}

		.grid-item-box {
			@include u-flex(column, center, flex-start);
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 24rpx;
			color: #222222;
			line-height: 28rpx;
			margin-bottom: 24rpx;

			.image {
				height: 104rpx;
				width: 104rpx;
			}

			.image1 {
				height: 85rpx;
				width: 85rpx;
				margin-top: 6rpx;
				margin-bottom: 12rpx;
			}
		}
	}

	.scroll-X {
		white-space: nowrap;
		width: 100%;
		padding-left: 24rpx;
		box-sizing: border-box;
		margin-top: 24rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #757575;
		line-height: 28rpx;

		.scroll-item {
			display: inline-block;
			width: 216rpx;
			height: 132rpx;
			padding: 20rpx 24rpx 20rpx 20rpx;
			box-sizing: border-box;
			margin-right: 16rpx;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			border: 2rpx solid #FFFFFF;
			position: relative;

			.bg_img {
				position: absolute;
				width: calc(100% - 2rpx);
				height: 132rpx;
				left: 0;
				right: 0;
				top: 0;
				bottom: 0;
				z-index: 0;
			}

			&-title {
				margin-bottom: 6rpx;
			}

			&-desc {
				width: 100%;
				@include u-flex(row, center, space-between)
			}

			.arrow_icon {
				height: 24rpx;
				width: 24rpx;
			}
		}

		.zyss_bg {
			background: url("@/static/image/home1/index_zyss_bg.png") no-repeat right top / 132rpx 132rpx, linear-gradient(270deg, #FFF9F8 0%, #FFF3EF 100%);
		}

		.gjmz_bg {
			background: url("@/static/image/home1/index_gjmz_bg.png") no-repeat right top / 132rpx 132rpx, linear-gradient(270deg, #FFFCF3 0%, #FFF9E8 100%);
		}

		.pfgl_bg {
			background: url("@/static/image/home1/index_pfgl_bg.png") no-repeat right top / 132rpx 132rpx, linear-gradient(270deg, #F0F7FF 0%, #E0EEFF 100%);
		}

		.zytl_bg {
			background: url("@/static/image/home1/index_zytl_bg.png") no-repeat right top / 132rpx 132rpx, linear-gradient(270deg, #EFFAF9 0%, #E7FFFD 100%);
		}
	}

	.banner-nav {
		padding: 20rpx 24rpx;
		display: flex;
		flex-wrap: wrap;
		margin-right: -16rpx;
		margin-bottom: -16rpx;

		&-item {
			width: 343rpx;
			height: 200rpx;
			box-sizing: border-box;
			background: #fff;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			padding: 26rpx 0 0 24rpx;
			margin-right: 16rpx;
			margin-bottom: 16rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 24rpx;
			color: #757575;
			line-height: 32rpx;
			background-repeat: no-repeat;
			background-size: 208rpx 148rpx;
			background-position: right bottom;

			.kswz {
				color: #4FA59C;
			}

			.jkhz {
				color: #FF5030;
			}

			.yyzx {
				color: #E69A22;
			}

			.zjyz {
				color: #3A76D0;
			}
		}

		.kswz-bg {
			background-image: url("@/static/image/home1/index_kswz_bg.png");
		}

		.jkhz-bg {
			background-image: url("@/static/image/home1/index_jkhz_bg.png");
		}

		.yyzx-bg {
			background-image: url("@/static/image/home1/index_yyzx_bg.png");
		}

		.zjyz-bg {
			background-image: url("@/static/image/home1/index_zjyz_bg.png");
		}
	}

	.box-nav {
		width: 100%;
		padding: 16rpx 24rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;

		&-right {
			@include u-flex(row, center, flex-start);
		}

		.right-arrow {
			height: 48rpx;
			width: 48rpx;
		}
	}

	.selfrated-health {
		@include u-flex(row, center, space-around);
		padding: 34rpx 0;
		background-color: #fff;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin: 0 24rpx 20rpx 24rpx;

		&-item {
			width: 144rpx;
			height: 144rpx;
			@include u-flex(column, center, center);
			flex-wrap: wrap;

			image {
				width: 72rpx;
				height: 72rpx;
				margin-bottom: 28rpx;
			}
		}
	}


	.scroll-container {
		white-space: nowrap;
		/* 确保子元素不换行 */
		display: flex;
		/* 使用flex布局 */
		padding-left: 24rpx;
	}

	.box-goods {
		@include u-flex(row, center, flex-start);
		flex-wrap: wrap;
		margin-right: -18rpx;
		margin-bottom: -18rpx;
		padding: 8rpx 24rpx 20rpx 24rpx;
	}

	.box-doctor {
		@include u-flex(row, center, flex-start);
		flex-wrap: wrap;
		margin-right: -18rpx;
		margin-bottom: -18rpx;
		padding: 8rpx 24rpx 20rpx 0rpx;
		display: inline-flex;
		/* 确保子元素水平排列 */
	}

	.gapitem {
		margin: 0 18rpx 18rpx 0;

	}

	.swiper-doctor {
		min-height: 410rpx;
		padding-left: 24rpx;
	}

	.ai-banner {

		// box-sizing: border-box;
		// padding: 12rpx 17rpx;
		&-swiper-item {
			@include u-flex(row, flex-start, flex-start);
			flex-wrap: wrap;
			margin: 0 22rpx;
			margin-right: -20rpx;
			margin-bottom: -20rpx;
		}

		.ai-banner-img {
			width: 343rpx;
			height: 160rpx;
			overflow: hidden;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			margin-right: 20rpx;
			margin-bottom: 20rpx;
		}
	}

	.article-box {
		background-color: #fff;
		padding: 24rpx;
		margin-bottom: 20rpx;
		border-radius: 16rpx;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;

		.item {
			width: 100%;
			margin-bottom: 20rpx;
			display: flex;
			align-items: flex-start;
			justify-content: flex-start;

			&:last-child {
				margin-bottom: 0rpx;
			}

			.left {
				flex: 1;
				height: 160rpx;
				margin-right: 15rpx;
				display: flex;
				flex-direction: column;
				align-items: flex-start;
				justify-content: space-between;

				.title {
					font-size: 28upx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #111111;
				}

				.views {
					font-size: 24upx;
					font-family: PingFang SC;
					color: #9a9a9c;
				}
			}

			.right {
				image {
					border-radius: 10rpx;
					width: 220rpx;
					height: 160rpx;
					border: 1px solid #eeeeee;
				}
			}
		}
	}

	// 医生智能体
	.doctorAgentTip {
		border-radius: 48rpx 48rpx 48rpx 4rpx;
		border: 1rpx solid #FFA599;
		color: #FF5030;
		padding: 2rpx 12rpx;
	}

	.doctorIntelligentAgent {
		display: inline-block;
		width: 268rpx;
		height: 444rpx;
		margin-right: 18rpx;
		box-sizing: border-box;
		background-size: 100% 100%;
		background-repeat: no-repeat;

		.doctorIntelligentAgent-image {
			width: 268rpx;
			height: 234rpx;
		}

		.line {
			display: inline-block;
			width: 2rpx;
			height: 22rpx;
			background: #999999;
			border-radius: 1rpx;
		}

		.doctorIntelligentAgent-btn {
			width: 132rpx;
			height: 48rpx;
			background: linear-gradient(136deg, #EE7D4E 0%, #E86235 100%);
			border-radius: 86rpx;
		}
	}
</style>