<template name="person">
	<view>
		<view class="person">
			<view class="cu-list ">
				<view class="cu-item">
					<view class="cu-avatar round xl" :style="'background-image:url('+ (userInfo.avatarUrl?userInfo.avatarUrl:avatarUrl)+');'"></view>
					<view class="content">
						<view class="text-white margin-top-sm user-name" >
							<template v-if="userInfo.name || userInfo.nickName">
								{{ userInfo.name || userInfo.nickName }}
							</template>
							<template v-else>
								<!-- #ifdef MP-WEIXIN -->
									<view class="no-border">
										<button open-type='getUserInfo' class="user-btn"
										@getuserinfo ="getuserinfo" withCredentials ="true"
										 size="small">请点击并授权</button>
									</view>
								<!-- #endif -->
								<!-- #ifndef MP-WEIXIN -->
									<view class="no-border">
										<button  class="user-btn" @click="setUserInfo"
										 size="small">完善信息</button>
									</view>
								<!-- #endif -->
							</template>
						</view>
					</view>
					<view class="action">
						<!-- <text class="text-white cuIcon-right" style="font-size:36upx"></text> -->
					</view>
				</view>
			</view>
		</view>
		
		<view style="background-color: #FFFFFF;">
			<list-cell cuIcon="people" color="#59A0F0" @eventClick="navTo('/person/personInfo/index')" :title="personFlag?'个人信息':'完善信息'"></list-cell>
			<!-- <list-cell cuIcon="refresh" color="#59A0F0" title="切换医院" border="" @eventClick="navTo('/pages/index/selectHos')"></list-cell> -->
			<!-- <list-cell cuIcon="refresh" color="#59A0F0" title="切换模式" border="" @eventClick="navTo('/pages/index/index')"></list-cell> -->
			<list-cell  cuIcon="friend" color="#59A0F0" title="成员管理" border="" @eventClick="navTo('/person/memberManage/index')"></list-cell>
			
			<list-cell  cuIcon="activity" color="#59A0F0" title="问卷调查" border="" @eventClick="navTo('/personModule/signUp/questionnaire/questionnaire')"></list-cell>
			<!-- <list-cell v-if="glFlag" cuIcon="activity" color="#59A0F0" iconColor="#54b4ef"  @eventClick="navTo('/person/appointment/index')" title="我的预约"></list-cell> -->
		</view>
		
		<view style="background-color: #FFFFFF;margin-top:20upx;">
			<list-cell cuIcon="settings" color="#59A0F0" @eventClick="showNotice()" title="通知设置"></list-cell>
			<!-- <list-cell cuIcon="favor" color="#59A0F0"  @eventClick="navTo('/person/collection/index')"  title="我的收藏" ></list-cell> -->
		</view>
		
		<view class="cu-modal cu-modal-person" :class="modalName=='ChooseModal'?'show':''" @tap="modalName=''">
			<view class="cu-dialog  cu-notice" @tap.stop="">
				<view class="sm-border">
					<view class="cu-form-group">
						<view class="title text-df">通知方式</view>
						<switch @change="SwitchAA($event,'receiveAll')" :class="form.receiveAll?'checked':''" :checked="form.receiveAll?true:false"></switch>
					</view>
					<view class="text-left text-gray ">
						说明：接受短信、小程序、电话等多种通知方式
					</view>
				</view>
				<view class="sm-border margin-top" style="border-top:2upx solid rgba(153, 153, 153, 0.4)">
					<view class="cu-form-group">
						<view class="title text-df">多人通知</view>
						<switch @change="SwitchAA($event,'receiveMultiple')" :class="form.receiveMultiple?'checked':''" :checked="form.receiveMultiple?true:false"></switch>
					</view>
					<view class="text-left text-gray">
						说明：接受其他成员的相关筛查通知
					</view>
				</view>
				<view class="sm-border margin-top margin-bottom" style="border-top:2upx solid rgba(153, 153, 153, 0.4)">
					<view class="cu-form-group">
						<view class="title text-df">多次通知</view>
						<switch @change="SwitchAA($event,'receiveOthers')" :class="form.receiveOthers?'checked':''" :checked="form.receiveOthers?true:false"></switch>
					</view>
					<view class="text-left text-gray">
						说明：多次指随访提醒，提前一周、提前三天以及当天给与三次提醒。
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import lineChart from "../../js_sdk/u-charts/components/u-charts/component.vue"
	import listCell from '@/components/mix-list-cell';
	import { getSessionKey } from '@/utils/index';
	export default {
		name: "components",
		components: {
			lineChart,
			listCell
		},
		data() {
			return {
				avatarUrl:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1576831072264&di=657ba0999c36ea0cc506607d0f94a1de&imgtype=0&src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01786557e4a6fa0000018c1bf080ca.png%401280w_1l_2o_100sh.png',
				personFlag:false,
				modalName1:'',
				form:{
					receiveAll:1,
					receiveMultiple:1,
					receiveOthers:1,
				},
				modalName:'',
				glFlag:false, 
				userInfo:{},
				opts:{
				},
				modeList:[],
				StatusBar: this.StatusBar,
				CustomBar: this.CustomBar,
				list: []
			};
		},
		mounted() {
		
		},
		onShow() {
			this.userInfo  = {}
			// this.glFlag = this.$store.getters.userInfo.diseaseType == 'gc_gl'
			this.modeList = this.$store.getters.userInfo.modeList
			this.userInfo = this.$store.getters.userInfo
			this.personFlag = Boolean(this.$store.getters.userInfo.name)
		},
		onLoad() {
		},
		methods: {
			showNotice(){
				this.modalName = 'ChooseModal'
				this.form = this.$store.state.user.userInfo.noticeSetting
			},
			SwitchAA(e,val) {
				this.form[val] = e.detail.value ? 1 : 0
				this.setNotice()
			},
			setUserInfo(){
			},
			
			// 获取用户信息
			setNotice() {
				const data = this.form
				this.$http.post(`/gastric-cancer-user/wechat/user/notice/properties`,data).then(res => {
					const d = res.data
					if (d.code == 1) {
						this.$store.dispatch('user/setNoticeSetting', this.form)
					}
				}).catch(err => {
					console.log(err)
				})
			},
			
			ChooseCheckbox(e) {
				let items = this.checkbox;
				let values = e.currentTarget.dataset.value;
				for (let i = 0, lenI = items.length; i < lenI; ++i) {
					if (items[i].value == values) {
						items[i].checked = !items[i].checked;
						break
					}
				}
			},
			
			getuserinfo(){
				let that = this
				wx.getUserInfo({
				   // 已同意获取信息
					success: function(res) {
						const data = {
							nickName:JSON.parse(res.rawData).nickName,
							hospitalId: that.$store.getters.userInfo.hospitalId,
							avatarUrl:JSON.parse(res.rawData).avatarUrl,
							openid:that.$store.getters.userInfo.openid || that.$store.getters.userInfo.openId || that.$store.getters.userInfo.userId
						}
						that.$http.post(
							`/gastric-cancer-user/wechat/user/register`,data
						).then(
							res => {
								const d = res.data
								if (d.code == 1) {
									uni.showToast({
										icon: 'none',
										title: "保存成功！"
									})
									// 更新store信息
									that.$store.dispatch('user/setInfo', {
										nickName: data.nickName,
										avatarUrl: data.avatarUrl
									})
									this.$set(this.userInfo,'nickName',data.nickName)
									this.$set(this.userInfo,'name',data.nickName)
									this.$set(this.userInfo,'avatarUrl',data.avatarUrl)
								} else {
									uni.showToast({
										icon: 'none',
										title: d.message
									});
								}
							}).catch(err => {
							console.log(err)
						})
						
					},	
					// 未/不同意获取信息
				   fail: function(res) {
					   console.log(res)
				   }
				})
			},
			
			navTo(url){
				console.log(url)
				if(url == '/personModule/signUp/questionnaire/questionnaire'){
					const data = {
						params: {
							pageNum: 1,
							pageSize: 10000
						}
					}
					this.$http.get(`/gastric-cancer-data/wechat/report/member/page`, data).then(res => {
						const d = res.data
						if (d.code == 1) {
							if(d.object.list.length == 0){
								uni.showToast({
									icon: 'none',
									title: "请先进行筛查报名！"
								})
								return
							}else{
								uni.navigateTo({
									url
								})
							}
						}
					}).catch(err => {
						console.log(err)
					})
				}else{
					uni.navigateTo({
						url
					})
				}
			}, 
		},
	}
</script>

<style lang="scss" scoped>
	.person {
		margin-top: -3upx;
		background-color: #59A0F0;
		padding:60upx 0 40upx 0;
		.cu-list.menu-avatar>.cu-item{
			font-size: 20upx;
			margin-bottom: -3upx;
			background-color: #59A0F0 !important;
		}
		.cu-list.menu-avatar>.cu-item .content>uni-view:first-child,.content>.user-name{
			font-size:34upx !important;
		}
		.cu-list>.cu-item{
			text-align: center;
		}
		.no-border uni-button:after{
			border: 0;
		}
		.no-border uni-button{
			width:280upx;
		}
	}
	.cu-notice{
		background-color: #ffffff;
		padding:30upx 40upx;
		.cu-form-group{
			padding: 1upx 0;
			min-height: 80upx;
			padding-top: 20upx;
		}
		.text-gray{
			padding-top:10upx;
		}
		.margin-bottom{
			margin-bottom: 20upx;
		}
	}
	
	button .cu-tag {
		position: absolute;
		top: 8upx;
		right: 8upx;
	}
</style>
<style lang="scss">
	.user-btn{
		background-color: #59A0F0;
		color: #FFFFFF;
		width: 280upx;
		border:0;
	}
	
	.user-btn:after{
		border: 0;
	}
	
	.cu-modal,.cu-modal.show{
		-webkit-overflow-scrolling: touch;
	}
	
	.cu-modal-person {
		-webkit-overflow-scrolling: touch;
		uni-switch .uni-switch-input:after,uni-switch::after,uni-switch::before{
			content: none;
		}
	}
</style>
