<template>
	<view>
		<view class="my">
			<view class="profile">
				<image src="../../static/img/wo_bj_ll@2x.png" mode="aspectFit" class="profile-bgi"></image>
				<view class="avator">
					<u-avatar :src="src" size="100rpx"></u-avatar>
				</view>
				<view class="username">{{username}}</view>
				<view class="account">账号:{{account}}
					<u-icon name="edit-pen" class="edit-icon" size="20" color="#fff" @click="toEdit"></u-icon>
				</view>

			</view>
			<view class="publish">
				<u-cell-group>
					<u-cell icon="/static/my/wo_icon_zr.png" title="发布的店铺转让" is-link="true"
						@click="topublished('发布的店铺转让')"></u-cell>
					<u-cell icon="/static/my/wo_icon_xz.png" title="发布的找店选址" is-link="true"
						@click="topublished('发布的找店选址')"></u-cell>
					<u-cell icon="/static/my/wo_icon_cc.png" title="发布的店铺出租" is-link="true"
						@click="topublished('发布的店铺出租')"></u-cell>
					<u-cell icon="/static/my/wo_icon_zs.png" title="发布的项目招商" is-link="true"
						@click="topublished('发布的项目招商')"></u-cell>
					<u-cell icon="/static/my/wo_icon_hh.png" title="成功合伙人" is-link="true" @click="topartner"></u-cell>
					<u-cell icon="/static/my/wo_icon_pppp.png" title="我的匹配" is-link="true" @click="topublished('我的匹配')"></u-cell>
				</u-cell-group>
			</view>
		</view>
		<TabBar :current-page="4"></TabBar>
		<view>
			<u-overlay :show="!isLoad">
				<login @success="reOnLoad()" @fail="failToLoad()"></login>
			</u-overlay>
		</view>
	</view>
</template>

<script>
	import login from 'pages/my/login/login'
	export default {
		components: {
			login
		},
		data() {
			return {
				src: 'https://cdn.uviewui.com/uview/album/2.jpg',
				account: '123',
				username: '用户名',
				isLoad: true
			}
		},
		onLoad() {
			if (!uni.getStorageSync('loginToken') || uni.getStorageSync('loginToken').length === 0) {
				this.isLoad = false
				return
			}
			this.isLoad = true
		},
		methods: {
			reOnLoad() {
				if (!uni.getStorageSync('loginToken') || uni.getStorageSync('loginToken').length === 0) {
					this.$toast.warn('登录失败请重试')
					this.isLoad = false
					return
				}
				this.isLoad = true
				if(this.isLoad){
					this.getInfo()
				}
			},
			failToLoad() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
			},
			topublished(title) {
				uni.navigateTo({
					url: '/pages/published/published?titletext=' + title
				})
			},
			todetail() {
				uni.navigateTo({
					url: '/pages/detail/detail'
				})
			},
			topartner() {
				uni.navigateTo({
					url: '/pages/Partnerships/Partnerships'
				})
			},
			toEdit() {
				uni.navigateTo({
					url: '/pages/my/edit/edit'
				})
			},
			//---------页面调用接口示例------------
			getInfo() {
				this.$api.getUser().then(res => {
					var data = res.data.data
					if (data) {
						this.src = this.$api.imgUrl + data.avatar
						this.username = data.nickname
						this.account = data.sn
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.profile {
		color: #fff;
		display: flex;
		width: 100%;
		height: 275rpx;
		margin-bottom: 36rpx;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		gap: 10rpx;

		.profile-bgi {
			position: absolute;
			width: 100%;
			height: 500px;
			z-index: -1;
		}

		.avator {
			margin-top: 20rpx;
		}

		.username {
			font-size: 18px;
			font-weight: 1rpx;
		}

		.account {
			font-size: 15px;
			font-weight: 1rpx;
			display: flex;
		}

		.edit-icon {}

	}
</style>