/** * 我的 */
<template>
  <view class="mine">
    <TabBar></TabBar>
		<view class="image-area">
			<u-avatar :src="img" size='80'></u-avatar>
		</view>
		
		<view class="title">我的账号</view>
		
		<view class="content" v-for="item in list" :key="item.id">
			<text class="title">{{item.name}}</text>
			<text class="value">{{item.value}}</text>
		</view>
		
		<view class="title">账号设置</view>
		<button class="title" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">修改图片</button>
  </view>
</template>

<script>
import TabBar from '@/components/tabBar/tabBar.vue'
export default {
  components: {
    TabBar,
  },
  data() {
    return {
      img: '', //头像
			list: [
				{
					id: 'number',
					name: '员工号',
					value: '111'
				},
				{
					id: 'name',
					name: '员工姓名',
					value: '张三'
				},
				{
					id: 'type',
					name: '员工类型',
					value: '111'
				},
				{
					id: 'phone',
					name: '手机号',
					value: '111'
				},
			]
    }
  },
  onShow() {
    let pages = getCurrentPages()
    const curPage = pages[pages.length - 1]
    this.currentPagePath = curPage.route
    uni.setStorageSync('currentPagePath', this.currentPagePath)
  },
  methods: {
    onChooseAvatar(e) {
			this.img = e.detail.avatarUrl;
			
			//在此，调一个接口把头像信息存上
		}
  },
}
</script>

<style scoped lang="scss">
	.mine {
		padding: 52rpx;
		.image-area {
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.title {
			font-weight: 600;
			margin: 30rpx 0;
		}
		.content {
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
		}
	}
</style>