<template>
	<!-- <custom-navigation-bar class="bar">
		{{$t('navigationBarTitleText')}}
	</custom-navigation-bar> -->
	<!-- <page-meta>
		<navigation-bar
		  :title="$t('navigationBarTitleText')"
		  front-color="#fff"
		  background-color="#648EB8"
		  title-align="center"
		/>
	</page-meta> --> 
	<uv-toast ref="toast"></uv-toast>
	<view class="page">
		<view class="bar">
			<uv-text :text="$t('navigationBarTitleText')" align="center" color="#fff" size="20"></uv-text>
		</view>
		<view class="bottomarc"></view>
		<view>
			<uv-row justify="space-between" customStyle="margin-top: 6%">
				<uv-col span="10" offset="1" class="box1">
					<view class='hometitle'>
					  {{$t('index_text_1')}}
					</view>
					<view class="userlist">
						<uv-row>
							<uv-col span="10" class="scroll_div">
								<uv-scroll-list :indicator="false">
									<view v-for="(item, index) in userlist" :key="index" class="item">	
										<uv-image class="img" :src="item.photourl" mode="aspectFill" 
											shape="circle" :lazy-load="true" width="60" height="60"
											:class="{ memberphoto_select: item.selected }"
											@click="selected(index)">
										</uv-image>
										<uv-text :text="item.membername" align="center" customStyle="margin-top:0.3rem"></uv-text>
									</view>
								</uv-scroll-list>
							</uv-col>
							<uv-col span="2">
								<view class="addmember">
									<uv-image class="img" src="/static/image/fabu1.png" mode="aspectFill"
										shape="circle" :lazy-load="true" width="50" height="50"
										@click="insertmembe">
									</uv-image>
									<uv-text :text="$t('new_member')" align="center" customStyle="margin-top:0.3rem"></uv-text>
								</view>
								
							</uv-col>
						</uv-row>
					</view>
				</uv-col>
			</uv-row>
			<view class="">
				<uv-row justify="space-between" customStyle="margin-top: 2rem">
					<uv-col span="10" offset="1">
						<view class="box2">
							<view class="scalename">
								{{$t('index_text_2')}}
							</view>
							<view class="div1">
								<uv-row>
									<uv-col span="6">
										 <image class="img" src="http://qiniusave.chienxutech.com/sdzyy/img/xgng3.png" ></image>
									</uv-col>
									<uv-col span="6">
										<view class="">
												<uv-text :text="$t('index_text_3')"></uv-text>
												<uv-text :text="$t('index_text_4')" align="center" customStyle="margin-top:30px;margin-bottom:40px"></uv-text>
												<uv-text :text="$t('index_text_5')" align="center" size="12" color="#1a1a1a"></uv-text>
										</view>
									</uv-col>
								</uv-row>
							</view>
							<view class='scalename'>{{$t('index_text_6')}}</view>
							<view v-if="selectuser" class="btns">
								<!-- <view v-show="1!=selectuser.fmemberid"> -->
								<view>
									<uv-row v-show="0==reportinfo.comstatus">
										<uv-col span="6"  offset="3">
											 <view class='mybtn' @click="tostem">
											 	  {{$t('index_btn_1')}}
											 </view>
										</uv-col>
									</uv-row>
									<uv-row gutter="20" v-show="1==reportinfo.comstatus">
										<uv-col span="6" >
											<view class='mybtn' @click="showreport">
												 {{$t('index_btn_2')}}
											</view>
										</uv-col>
										<uv-col span="6" >
											<view class='mybtn'  @click="restem">
												  {{$t('index_btn_3')}}
											</view>
										</uv-col>
									</uv-row>
								</view>
							</view>
							<view v-else>
								<p>{{$t('not_selected')}}</p>
							</view>
							<!-- mergerscale.comstatus -->
						</view>
					</uv-col>
				</uv-row>
				<!-- <uv-row justify="space-between" customStyle="margin-top: 6%">
					<uv-col span="10" offset="1" >
						<share @dosharewechat="share"></share>
					</uv-col>
				</uv-row> -->
			</view>
		</view>
	</view>
</template>

<script>
	import {getlist} from "@/common/api/fmember.js"
	import {querymergescalebyuserid} from "@/common/api/scale.js"
	import {tostemlistnext} from "@/common/js/common.js"
	import share from "@/components/share/share.vue"
	import {addlog} from "@/common/api/system.js"
	export default {
		data() {
			return {
				userinfo:{},
				userlist:[], 
				reportinfo:{},
				selectuser:false
			}
		},
		components:{
			share
		},
		methods: {
			getlist(){
				let data ={userid:this.userinfo.id}
				getlist(data).then(res=>{
					res = res.data
					if(0==res.code){
						this.$refs.toast.show({
							type: 'error',
							message: res.errmsg
						})
					}
					if(200==res.code){
						let userlist = res.resultData
						let fmemberid = this.selectuser?this.selectuser.fmemberid:this.userinfo.fmemberid
						if(this.selectuser){
							userlist.map((item,index)=>{
								item.selected=0
								if(item.fmemberid==fmemberid){
									item.selected=1
									return 
								}
							})
						}else{
							userlist[0].selected=1
							uni.setStorage({
								key: 'selectuser',
								data: userlist[0],
							});
							this.selectuser = userlist[0]
							uni.setStorage({
								key: 'selectuser',
								data: this.selectuser,
							});
						}
						userlist.map((item,index)=>{
							if(!item.gender){
								item.photourl="/static/image/member.svg"
							}else{
								switch(item.gender){
									case '1':
										item.photourl="/static/image/selecttype/man.png"
									break;
									case '2':
										item.photourl="/static/image/selecttype/woman.png"
									break;
								}
							}
						})
						this.userlist = userlist
						uni.setStorage({
							key: 'memberlist',
							data: this.userlist,
						});
					}
				})
			},
			selected(index){
				let that = this
				this.userlist.map((item,index1)=>{
					if(index1==index){
						item.selected=1
						that.selectuser  = item
					}else{
						item.selected=0
					}
				})
				uni.setStorage({
					key: 'selectuser',
					data: this.selectuser,
				});
				this.querymergescalebyuserid()
			},
			insertmembe(){
				let count = this.userlist.length-1
				if(count>=this.userinfo.fmembercount){
					this.$refs.toast.show({
						type: 'error',
						message: this.$t('member_num_than_max')
					})
				}else{
					uni.navigateTo({
						url: '/pages/member/add'
					});
				}
			},
			querymergescalebyuserid(){
				let userid = this.userinfo.id
				let fmemberid=this.selectuser.fmemberid?this.selectuser.fmemberid:0
				let data={userid:userid,fmemberid:fmemberid}
				querymergescalebyuserid(data).then(res=>{
					res =res.data
					if(0==res.code){
						this.$refs.toast.show({
							type: 'error',
							message: res.errmsg
						})
						return false
					}
					if(200==res.code){
						this.reportinfo = res.resultData
					}
				})
				
			},
			showreport(){
				uni.navigateTo({
					url: '/pages/report/report'
				});
			},
			init(){
				this.userinfo = uni.getStorageSync("userinfo")
				this.selectuser = uni.getStorageSync("selectuser")
				this.getlist()
				this.querymergescalebyuserid()
				// uni.$on('dosharewechat',function(data){
				// 	uni.share({
				// 		provider: "weixin",
				// 		scene: "WXSceneSession",
				// 		type: 0,
				// 		href:"testapp://",
				// 		title: "uni-app分享",
				// 		summary: "我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！",
				// 		imageUrl: data.shareimg,
				// 		success: function (res) {
				// 			addlog({
				// 				json: JSON.stringify(res),
				// 				type: 'uniapp信息'
				// 			})
				// 			console.log("success:" + JSON.stringify(res));
				// 		},
				// 		fail: function (err) {
				// 			addlog({
				// 				json: JSON.stringify(res),
				// 				type: 'uniapp错误'
				// 			})
				// 			console.log("fail:" + JSON.stringify(err));
				// 		}
				// 	})
				// })
			},
			tostem(){
				if(this.reportinfo.stemlist == undefined){
					return
				}
				uni.setStorage({
					key: 'stemlist',
					data: this.reportinfo.stemlist,
				});
				
				if(this.reportinfo.srid == undefined){
					this.reportinfo.srid =0
				}
				let stemlist = this.reportinfo.stemlist
				let srid =this.reportinfo.srid
				uni.setStorage({
					key: 'srid',
					data: srid,
				});
				let stepprogress = this.reportinfo.stepprogress
				tostemlistnext(stepprogress)
				// let item = stemlist[stepprogress]
				// if(item.stemtype<101){
				// 	//标准答题
				// 	uni.navigateTo({
				// 		url: '/pages/topic/common'
				// 	});
				// }else{
				// 	//特殊答题
				// 	let scaleid=4
				// 	let url = "/pages/topic/"+item.stemdefinepage+"?scaleid="+scaleid + "&srid=" + srid + `&sindex=` + stepprogress
				// 	uni.navigateTo({
				// 		url: url
				// 	});
				// }
			},
			restem(){
				uni.setStorage({
					key: 'stemlist',
					data: this.reportinfo.stemlist,
				});
				if(this.reportinfo.srid == undefined){
					this.reportinfo.srid =0
				}
				let stemlist = this.reportinfo.stemlist
				let srid = 0
				uni.setStorage({
					key: 'srid',
					data: srid,
				});
				//let stepprogress = this.reportinfo.stepprogress
				let stepprogress = 0
				var scaleid = 4
				tostemlistnext(stepprogress,0,scaleid,srid)
			},
			share(data){
				// this.$refs.toast.show({
				// 	type: 'error',
				// 	message: data.shareimg
				// })
				// console.log(data)
				uni.share({
					provider: "weixin",
					scene: "WXSceneSession",
					type: 0,
					href:"testapp://",
					//title: this.$t('navigationBarTitleText')+"分享",
					title: this.$t('share'),
					summary: this.$t('share_text'),
					imageUrl: data.shareimg,
					success: function (res) {
						addlog({
							json: JSON.stringify(res),
							type: 'uniapp信息'
						})
						console.log("success:" + JSON.stringify(res));
					},
					fail: function (err) {
						addlog({
							json: JSON.stringify(err),
							type: 'uniapp错误'
						})
						console.log("fail:" + JSON.stringify(err));
					}
				})
			}
		},
		mounted() { 
			// uni.setNavigationBarTitle({
			// 	title: this.$t('navigationBarTitleText')
			// });
			this.init()
		},
		onPullDownRefresh(){
			this.init()
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		}
	}
</script>
<style scoped>
	.box1{
		background-color: #fff;
		border-radius:20rpx;
		box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.3);
		display:flex;
		flex-direction:column;
		align-items:center;
		width: 80%;
	}
	.box1 .userlist{
		width: 100%;
	}
	.box1 .userlist .item{
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		width: 60px;
	}
	.box1 .userlist .scroll_div{
		max-width: 80%;
	}
	.addmember{
		width: 50px;
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
	.addmember{
		padding-bottom: 10px;
	}
	.box2{
		background-color: #fff;
		border-radius:20rpx;
		box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.3);
		display:flex;
		flex-direction:column;
		align-items:center;
		width: 100%;
		padding: 0.5em;
		box-sizing: border-box;
	}
	.box1 .hometitle{
	    height:80rpx;
	    display:flex;
	    align-items:center; 
	    justify-content:center; 
	    font-weight:700;
	    color:#47689D;
	}
	.box1 .userlist .item .memberphoto_select{
	  overflow: hidden;
	  box-shadow:1px 3px 3px 1px rgba(0, 0, 0, 0.3);
	}
	.box1 .userlist{
		padding-left: 10px;
		padding-right: 10px;
	}
	.box2 .scalename{
		font-size:36rpx;
		display:flex;
		justify-content:center;
		align-items:center;
		color:#648EB8;
		margin-top:5rpx;
		font-weight:700;
	}
	.box2 .img{
		width: 100%; 
		object-fit: contain;
		height: 350rpx;  
	}
	.box2 .div1{
		width: 100%;
	}
	.box2 .btns{
		width: 100%;
		margin-top: 30rpx;
		margin-bottom: 30rpx;
	}
</style>
