<template name="index">
	<view class="index" >
		
	<!-- 	<swiper class="screen-swiper " :indicator-dots="false" :circular="false" :autoplay="true" interval="4000"
		 duration="800">
			<swiper-item v-for="(item,index) in swiperList" :key="index" @click="viewDetail(item)">
				<image :src="item.url" mode="aspectFill" v-if="item.type=='image'"></image>
			</swiper-item>
		</swiper> -->
		<view class="text-center" style="font-size: 46rpx;font-weight:bold">
			上海市松江中心医院消化内科
		</view>
		<view class="text-center" style="font-size: 40rpx;font-weight:bold;margin-top:20rpx">
			消化道慢病全流程管理系统
		</view>
		<view class="cu-list grid " :class="['col-' + gridCol,gridBorder?'':'no-border']" >
			<view class="cu-item quick-item text-center" v-for="(item,index) in cuIconList" :key="index" v-if="index<gridCol*3" @click="clickQuick(item)"
			 hover-class="cell-hover" :hover-stay-time="50">
				<view :class="['text-' + item.color]" style="display: inline-block;margin:0 auto; 
				margin-top:70upx;width: 370upx;padding-left: 20upx; text-align: left;background-color: #59A0F0;color:#fff;
				height: 130upx;line-height: 130upx;border-radius: 15upx;">
					<image v-if="item.img == 'stomach'" src="../../static/stomach.png" mode="" style="width: 55upx; height: 90upx;color:#fff;vertical-align: sub;
					padding-top: 35upx;"></image>
					<image v-else src="../../static/intestine.png" mode="" style="width: 55upx; height: 90upx;color:#fff;vertical-align: sub;
					padding-top: 35upx;"></image>
					<text style="display: inline-block;font-size: 40upx;margin-left:20upx;color: #FFFFFF;">{{item.name}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import listCell from '@/components/mix-list-cell';
	import WXBizDataCrypt from '@/utils/WXBizDataCrypt';
	import {
		getSessionKey
	} from '@/utils/index';

	export default {
		components: {
			listCell
		},
		name: "home",
		data() {
			return {
				gridCol: 1,
				gridBorder: false,
				swiperList: [
					{
						id: 1,
						type: 'image',
						url: '../../static/1.png'
					},
				],
				cuIconList: [
					{
						cuIcon: 'friend',
						color: '#fff',
						badge: 0,
						img:'stomach',
						name: '| 胃 病 筛 查', 
						navUrl: "/pages/index/stomach"
					},
					{
						cuIcon: 'friend',
						color: '#fff',
						badge: 0,
						img:'stomach',
						name: '| 消化道慢病', 
						navUrl: "/pages/index/digestive"
					},
					{
						cuIcon: 'peoplelist',
						color: '#fff',
						img:'intestine',
						badge: 0,
						name: '| 肠 道 疾 病',
						navUrl: 'none'
					},
				],
			};
		},

		onLoad: function(option) {
			if(option && option.hospitalId){
				this.$store.dispatch('user/setInfo', {hospitalId:option.hospitalId,accessWay:1})
			}else{
				this.$store.dispatch('user/setInfo', {hospitalId:"5f475e56ec2e2bf7756a77a8",accessWay:2})
			}
			// #ifdef MP-WEIXIN  
			wx.setBackgroundFetchToken({
			  token: 'sjf'
			})
			// #endif	
			let list = [{}];
			for (let i = 0; i < 26; i++) {
				list[i] = {};
				list[i].name = String.fromCharCode(65 + i);
			}
			this.list = list;
			this.listCur = list[0];
			
			let that = this
			// #ifdef MP-WEIXIN 
			wx.login({
				success(res) {
					if (res.code) {
						let code = res.code
						that.getUserInfo(code)
					} else {
						console.log('登录失败！' + res.errMsg)
					}
				}
			})
			wx.showShareMenu({
				withShareTicket: true
			})
			// #endif 
			
			
		},
		onShow() {
			uni.setNavigationBarTitle({
				title: '上海市松江中心医院'
			});
			// #ifdef MP-WEIXIN  
			wx.showShareMenu({
				withShareTicket: true
			})
			// #endif 
			
			// #ifdef H5
			if(this.$route.query.openId){
				 this.getUserInfoH5(this.$route.query.openId)
			}
			// #endif 
			
			
		},
		methods: {
			
			// 查看轮播图详情
			viewDetail(obj) {
				if (obj.id == 4) {
					// uni.navigateTo({
					// 	url: "/personModule/notice/detail?item=" + encodeURIComponent(JSON.stringify(obj))
					// })
				} else {
					// let data = {
					// 	id: 6631,
					// 	title: '胃癌的高危人群是指什么？',
					// 	author: "上海市计算技术研究所",
					// 	time: "2小时前"
					// }
					// uni.navigateTo({
					// 	url: `/educationViews/details/index?data=${JSON.stringify(data)}`
					// })
				}
			},
			getUserInfoH5(openId){
				this.$http.post(`/gastric-cancer-user/wechat/user/login/${openId}`).then(res => {
					const d = res.data
					if (d.code == 1) {
						let userInfo = d.object
						userInfo = Object.assign(userInfo,userInfo.patient) 
						userInfo.idCard = userInfo.idCard || userInfo.idcard
						if(d.object.hospitals && d.object.hospitals.length>0){
							this.$store.dispatch('user/setInfo', { hospitalId:d.object.hospitals[0].hospitalId ,hospitalName:d.object.hospitals[0].hospitalName})
						}
						let obj = Object.assign({}, this.$store.getters.userInfo)
						if (obj.avatarUrl) {
							userInfo.avatarUrl = obj.avatarUrl
						}
						this.$store.dispatch('user/setInfo', Object.assign(obj, userInfo))
						this.$store.dispatch('user/setToken', d.result)
						this.getFamilyRelation()
						this.getHospital()
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 获取用户信息
			getUserInfo(code) {
				this.$http.post(`/gastric-cancer-user/wechat/user/auth/api?code=${code}`).then(res => {
					const d = res.data
					if (d.code == 1) {
						let userInfo = d.object
						userInfo = Object.assign(userInfo,userInfo.patient) 
						userInfo.idCard = userInfo.idCard || userInfo.idcard
						if(d.object.hospitals && d.object.hospitals.length>0){
							this.$store.dispatch('user/setInfo', { hospitalId:d.object.hospitals[0].hospitalId ,hospitalName:d.object.hospitals[0].hospitalName})
						}
						let obj = Object.assign({}, this.$store.getters.userInfo)
						if (obj.avatarUrl) {
							userInfo.avatarUrl = obj.avatarUrl
						}
						this.$store.dispatch('user/setInfo', Object.assign(obj, userInfo))
						this.$store.dispatch('user/setToken', d.result)
						this.getFamilyRelation()
						this.getHospital()
					}
				}).catch(err => {
					console.log(err)
				})
			},
			
			getHospital() {
				const data = {
					params: {
						pageNum: 1,
						pageSize: 500,
						isUse: 1
					}
				}
				this.$http.get(`/gastric-cancer-user/hospital/page`, data).then(res => {
					const d = res.data
					if (d.code == 1) {
						let obj = Object.assign({}, this.$store.getters.userInfo)
						obj.hospitalList = d.object.list
						obj.hospitals = d.object.list
						this.$store.dispatch('user/setInfo', obj)
						console.log(this.$store.getters.userInfo)
					}
				}).catch(err => {
					console.log(err)
				})
			},

			// 获取家庭成员关系
			getFamilyRelation() {
				this.$http.get(`/gastric-cancer-data/enumerate/familyRelation`).then(res => {
					const d = res.data
					if (d.code == 1) {
						let arr = []
						if (d.object.items.length > 0) {
							d.object.items.forEach(item => {
								arr.push({
									label: item.itemName,
									value: item.itemCode
								})
							})
						}
						this.$store.dispatch('enumerate/setFamilyRelation', arr)
					}
				}).catch(err => {
					console.log(err)
				})
			},
			
			// 点击快捷方式
			clickQuick(obj) {
					if (obj.navUrl == 'none') {
						uni.showToast({
							icon: 'none',
							title: "此功能尚未开放,敬请期待！"
						})
					}else{
						let userInfo = Object.assign({}, this.$store.getters.userInfo)
						userInfo.modeUrl = obj.navUrl
						this.$store.dispatch('user/setInfo', userInfo)
						uni.navigateTo({
							url: obj.navUrl
						})
					}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.cu-list.grid {
		background-color: #fafafa;
	}
	.uni-column {
		height: 100%;
	}

	.index {
		background-color: #fafafa;
		height: 100%;
		padding-top:60px;
		.quick-item {
			&.cell-hover {
				background: #fafafa;
			}
		}

		.cu-tag {
			padding: 0px 12upx;
			height: 42upx;
			line-height: 43upx;
			font-size: 20upx;
		}

		.cu-list.grid>.cu-item,
		.cu-list.grid.no-border>.cu-item {
			padding: 0;
		}
	}

	.sict-step {
		padding-bottom: 30upx;
		// #ifndef MP-WEIXIN
		padding-bottom: 120upx;

		// #endif
		.step-title {
			position: absolute;
			text-align: right;
			top: 20upx;
			font-size: 30upx;
			left: 34upx;
		}

		.notice-item {
			padding: 10upx 20upx;
		}

		ul {
			margin: 0 auto;
			padding-left: 36upx;
		}

		li {
			position: relative;
			margin: 0 40upx;
			padding-top: 20upx;
			padding-left: 70upx;
			list-style: none;
			border-left: 2upx solid #ccc;
		}

		li:before {
			content: "";
			display: block;
			position: absolute;
			margin-left: -12upx;
			top: 16upx;
			left: -10upx;
			width: 38upx;
			height: 38upx;
			line-height: 50upx;
			text-align: center;
			// border:2upx solid #ccc;
			font-size: 28upx;
			border-radius: 50%;
		}

		.step {
			position: absolute;
			left: -20upx;
			height: 40upx;
			width: 40upx;
			line-height: 40upx;
			color: #409eff;
			text-align: center;
			background-color: rgb(242, 242, 242);
			border: 2upx solid #409eff;
			border-radius: 50%;
		}

		.step~.step-title {
			color: #409eff;
		}

		li {
			.notice {
				margin: 0;
				margin-top: 30upx;
				padding: 20upx;

				.notice-item {
					padding: 16upx 20upx;
					padding-bottom: 8upx;
				}
			}
		}

		.step-none {
			color: #ccc;
			border: 2upx solid #ccc;
		}

		.step-none~.step-title {
			color: #ccc;
		}
	}
	
</style>
