<template>
	<view class="com-school-user-header" v-if="info">
		<view class="header">
			
			<button class="avatarBtn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
				<image class="avatar" :src="info.avatar" mode="scaleToFill"></image> 
			</button> 
		</view>
		<view class="user">
			<view class="name">{{info.nickname}}</view>
			<view class="icon">
				<image src="/static/images/gl.png" mode="widthFix" class="img"></image>
				<image src="/static/images/coffeecup.png" mode="widthFix" class="img"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		name:"SchoolUserHeader",
		props:{
			info:{
				type:Object,
				default:()=>{
					return null
				}
			}
		},
		watch:{
			'info':{
				handler(val){
				
				
				console.log(this.userInfo);
				console.log("val",val);	
				},
				deep:true,
				immediate:true,
				
			}
		},
		computed: {
			...mapState(['systemInfo', 'store_id', 'userInfo']), 
		}, 
		data() {
			return {
				
			};
		},
		methods:{
			
			
			onChooseAvatar(e) { 
				let _this=this;
				const { avatarUrl } = e.detail;
				this.avatar = avatarUrl;
				
				uni.uploadFile({
					url: siteinfo.siteroot + '/index.php?s=/api/upload/upload',
					filePath: avatarUrl,
					name: 'file',
					formData: {
						'openId': _this.userInfo.openid,
						'token': uni.getStorageSync('token'),
					},
					success: ({data}) => {
						let res = JSON.parse(data); 
						if (res.code == 2) {
							// this.userInfo.avatar = res.src;
							_this.info.avatar=res.src;
							_this.onSave();
							
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								mask: true
							});
						}
					},
					fail: () => {
						uni.showToast({
							title: '头像上传失败，请稍后重试~',
							icon: 'none',
							mask: true
						});
					}
				});
			},
			
			onSave(e){
				let _this=this;
				let par={
					openid:_this.userInfo.openid,
					avatar:_this.info.avatar,
					nickname:_this.userInfo.nickname,
					gender:_this.userInfo.gender,
					born:_this.userInfo.born,
					province:_this.userInfo.province,
					city:_this.userInfo.city,
					district:_this.userInfo.district, 
				} 
				_this.$http.request('member/saveMemberInfo',par, "", "", true).then(res => { 
					 
				}).catch(err => { 
				})
			},
			
			
		}
	}
</script>

<style lang="scss">
@import "./SchoolUserHeader.scss"
</style>