<template>
	<view>
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="content">
				我的账号
			</block>
		</cu-custom>

		<view class="flex  align-center justify-between" style="margin-top: 15rpx; background-color: white;"
			@tap="chooseImage()">
			<view class=""
				style="border-bottom: #EEEEEE 1rpx; padding-left: 40rpx;padding-top: 30rpx; padding-bottom: 30rpx;font-size: 30rpx;">
				头像
			</view>
			<view class="flex align-center">
				<view class="">
					<image :src="userInfo.avatar" mode="" v-if="userInfo.avatar"
						style="border-radius: 100rpx;width: 80rpx;height: 80rpx;margin-right: 10rpx;"></image>
					<image src="../../../static/avatar_icon.png" mode="" v-else
						style="border-radius: 100rpx;width: 80rpx;height: 80rpx;margin-right: 10rpx;"></image>
				</view>
				<view class="">
					<u-icon name='arrow-right' class="right_icon" style="margin-right: 20rpx;"> </u-icon>
				</view>
			</view>
		</view>

		<view class="flex  align-center justify-between" style="background-color: white; " @tap="jumpUpdateUserName()">
			<view class=""
				style="border-bottom: #EEEEEE 1rpx;padding-left: 40rpx;padding-top: 30rpx;padding-bottom: 30rpx; font-size: 30rpx;">
				用户名
			</view>
			<view class="flex align-center">
				<view class="">
					{{userInfo.nikeName}}
				</view>
				<view class="">
					<u-icon name='arrow-right' class="right_icon" style="margin-right: 20rpx;"> </u-icon>
				</view>
			</view>
		</view>

		<view class="flex  align-center justify-between" style="background-color: white; ">
			<view class=""
				style="border-bottom: #EEEEEE 1rpx;padding-left: 40rpx;padding-top: 30rpx;padding-bottom: 30rpx;font-size: 30rpx;">
				手机号
			</view>
			<view class="flex align-center">
				<view class="">
					
					{{$formatPhone( userInfo.phone)}}
				</view>
				<view class="">
					<u-icon class="" style="margin-right: 20rpx;"> </u-icon>
				</view>
			</view>
		</view>
		<view class="" v-if="userInfo!=''" style="position: fixed;bottom: 50rpx;left: 45rpx;">
			<view class=""
			 @click="goOut"
			 style="width: 660rpx; color: #fc6035;border: 1rpx solid #fc6035; border-radius: 30rpx;padding: 20rpx;text-align: center;">
				退出当前账号
			</view>
		</view>
		<u-modal v-model="show" :show-cancel-button="true" confirm-color='#fc6035'
			confirm-text="确认" cancel-text="取消" :content="content" @confirm="seting"></u-modal>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				content:'',
				show:false,
				userInfo: '',
				memberId: uni.getStorageSync('userInfo').memberId,
			}
		},
		onShow() {
			this.getUserInfo()
		},
		methods: {
			seting(){
				uni.clearStorageSync()
				uni.switchTab({
					url:'../../index/index'
				})
			},
			goOut(){
				this.content='您确认要退出登录吗?'
				this.show=true
			},
			getUserInfo() {
				this.$u.api.getUserInfo(this.memberId).then(res => {
					// console.log(res)
					if (res.code === 200) {
						this.userInfo = res.data
					}
				})
			},
			///1.底部弹出相机和相册
			chooseImage() {
				var that = this
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择、摄像头
					success: function(res) {
						// console.log(res)
						let uploadUrl = `${that.$u.http.config.ossUrl}/common/uploadImage`;
						uni.uploadFile({
							url: uploadUrl,
							filePath: res.tempFilePaths[0],
							name: 'file',
							success: (res) => {
								// console.log(res)
								let Urls = JSON.parse(res.data);
								// console.log(Urls.url)
								const param = {
									memberId: uni.getStorageSync('userInfo').memberId, //会员id
									avatar: Urls.url //姓名
								}
								that.$u.api.changeUserInfo(param).then(res => {
									// console.log(res)
									if (res.code == 200) {
										that.$api.msg('头像修改成功')
										that.getUserInfo()

									}
								}).catch(error => {
									console.log(error)
								})
							},
							fail: (err) => {
								console.log(err)
								uni.hideLoading();
								that.$refs.uToast.show({
									title: "上传失败",
									duration: 1000,
								})
							},
						})
					}
				});
				// ass()
			},
			///2.进入修改用户名称页面
			jumpUpdateUserName() {
				uni.navigateTo({
					url: "/pages/mine/minePage/updateUserName?name=" + this.userInfo.nikeName,
				});
			}
		}
	}
</script>

<style>

</style>
