my.vue 3.38 KB
<template>
	<view class="my-info">
		<view class="header u-f u-f-jcsb u-f-aic" @tap='goProfile'>
			<view class="hl">
				<view class="u-f u-f-jcfs ">
						<image style="width: 50px; height: 50px;border-radius: 50%; background-color: #eeeeee;" :src="src"
						 mode="aspectFit">
						 </image>
					<view class="hl-r">
						<view class="name">
							{{info.nickName}}
						</view>
						<view class="company">
							{{leader}}
						</view>
					</view>
				</view>
			</view>
			<view>
                <uni-icons type="arrowright" size="20" color="gray"></uni-icons>
			</view>
		</view>
		<view class="divider"></view>
		<view class="center">
			<view class="u-f pass" @tap="resetPwd">
				<view class="common-mr">
					<!-- <uni-icons type="locked" size="30" color="#F8DE06"></uni-icons> -->
					<text class="iconfont icon-mima"></text>
				</view>
				<view class="u-f1 common-b">
					修改密码
				</view>
				<view>
					<uni-icons type="arrowright" size="20" color="gray"></uni-icons>
				</view>
			</view>
			<view class="u-f about" @tap="aboutUs">
				<view class="common-mr">
					<!-- <uni-icons type="info" size="30" color="#007aff"></uni-icons> -->
					<text class="iconfont icon-guanyuwomen"></text>
				</view>
				<view class="u-f1 common-b">
					关于我们
				</view>
				<view>
					<uni-icons type="arrowright" size="20" color="gray"></uni-icons>
				</view>
			</view>
		</view>
		<view class="footer">
         <button class="btn"  type="warn" @tap="logOut">退出系统</button>
		</view>
	</view>
</template>

<script>
	 
	export default {
		data() {
			return {
				version: this.$conf.version,
				src:'',
				info: {},
				leader: ''
			}
		},
		onLoad() {
			this.$http.user.getProfile().then(res => {
				console.log(res)
				this.leader = res.data.data.dept.leader;
				this.src = res.data.data.avatar;
				this.info = res.data.data;
				try {
				    uni.setStorageSync('my_profile', res.data.data);
				} catch (e) {
				    // error
				}
			})
		},
		methods: {
			goProfile() {
				uni.navigateTo({
					url:'profile'
				})
			},
			resetPwd() {
				uni.navigateTo({
					url: 'reset-pwd'
				})
			},
			aboutUs() {
				uni.navigateTo({
					url: 'about-us'
				})
			},
			logOut() {
				this.$store.dispatch("logout")
				this.$http.user.logout().then(res => {
					console.log(res)
					if(res.data.code == 200) {
						uni.redirectTo({
							url: '../login/login'
						})
					}
				});
				
			}
		},
	}
</script>

<style lang="scss" scoped>
	.my-info {
		position: fixed;
		width: 100%;
		height: 100%;
		background-color: #FFFFFF;

		.header {
			height: 200rpx;
			padding: 0 50rpx;
			.hl {
			 .hl-r {
				 height: 60rpx;
				 margin: 5rpx 0 0 $uni-spacing-row-base;
				 .name {
					 margin-bottom: $uni-spacing-col-sm;
					 font-weight: bold;
				 }
				 .company {
					 font-size: $uni-font-size-sm;
				 }
			 }	
			}
		}
		.divider {
			height: $uni-spacing-col-sm;
			margin: 0 50rpx;
			background-color: #f8f8f8;
		}
		.center {
			padding: 0 50rpx;
			.pass {
				height: 110rpx;
				line-height: 120rpx;
			}
			.about {
				height: 100rpx;
				line-height: 100rpx;
			}
		}
		.footer {
			margin-top: 80rpx;
			padding: 0 50rpx;
			.btn {
				height: 80rpx;
				line-height: 80rpx;
				border-radius: 50rpx;
				font-size: $uni-font-size-lg;
			}
		}
	}
	.common-mr {
		margin-right: $uni-spacing-row-base;
	}
	.common-b {
		border-bottom: 2rpx solid $uni-border-color;
	}

</style>