<template>
	<view class="myPage bgLightBlue">
		<view class="bg">
			<headers :showBack="false" :themeType="'white'">
				<view class="headerName">
					我的
				</view>
			</headers>
			<view class="userBox">
				<image class="userImg" src="@/static/userImg.png"></image>
				<span v-if="uid">{{userInfo.realName}}</span>
				<span v-else>{{userInfo.account}}</span>
			</view>
		</view>
		<view v-if="!uid" class="operateBar logoutBar" @click="logout">
			退出登录
		</view>
		<footers activeTab="supplierMy"></footers>
	</view>
</template>

<script>
	import {
		exitApp
	} from "@/utils/tool.js"
	import footers from "@/components/footers/footers.vue"
	import headers from "@/components/headers/headers.vue"
	export default {
		components: {
			footers,
			headers
		},
		data() {
			return {
				userInfo: {
					accountType: 0
				},
				systemInfo: {},
				version: '',
				flag: true,
				uid: '',
			};
		},
		onLoad(val) {
			this.uid = uni.getStorageSync('UID')
			this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
			this.systemInfo = uni.getStorageSync('systemInfo')
			if (typeof plus !== "undefined") {
				this.version = plus.runtime.version
			}
			if (val.type == 1) {
				this.flag = false
			}
		},
		methods: {
			logout() {
				this.sendRequest({
					url: "xmgl/base/logout",
					data: {
						id: this.userInfo.userId
					},
					method: "POST",
					success() {
						exitApp()
					},
					fail() {
						exitApp()
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.myPage {
		height: 100%;

		/deep/.headerBox {
			border-bottom: none;
		}
	}

	.bg {
		background-color: #2b8df3;
		;
		color: #FFFFFF;

		.title {
			text-align: center;
			// padding: 10px 0 0;
		}
	}

	.userBox {
		display: flex;
		align-items: center;
		padding: 40px 20px;
		font-size: 20px;
	}

	.userImg {
		width: 50px;
		height: 50px;
		border-radius: 50%;
		margin-right: 10px;
	}

	.operateBar {
		background-color: #FFFFFF;
		font-size: 14px;
		height: 58px;
		display: flex;
		align-items: center;
		margin-bottom: 10px;
		padding: 0 15px;
		justify-content: space-between;

		.left {
			display: flex;
			align-items: center;
		}

		.operateIcon {
			width: 20px;
			height: 20px;
			margin-right: 10px;
		}

		.arrowright {
			opacity: 0.5;
		}
	}

	.logoutBar {
		justify-content: center;
	}
</style>