<template>
<view class="page page-fill">
<!-- header start -->
<view class="header">
<view v-if="userLogin">
<image :src="userphoto" class="face"></image>
</view>
<view v-else>
<image src="../../static/userfalse.png" class="face"></image>
</view>
<view class="info-wapper" v-if="userLogin">
<view class="nickname">{{nickname}}</view>
<view class="nav-info">city: {{city}}</view>
</view>
<view class="info-wapper" v-else>
<view class="regist-login" data-logintype="weixin" @click="appAuthLogin">微信登录</view>
</view>
<view class="set-wapper">
<image src="../../static/setting.png" mode="" class="settings"></image>
</view>
</view>
<!-- header end -->
<view class="page-content">
<!-- 服务 start -->
<view class="service-wapper">
<view class="service-item" @click="outLogin">
<image src="../../static/daifukuan2.png" mode="widthFix" class="service-icon"></image>
<text class="service-title">退出登录</text>
<image src="../../static/come.png" mode="widthFix" class="service-come"></image>
</view>
</view>
<!-- 服务 end -->
</view>
</view>
</template>
<script>
export default {
data() {
return {
userLogin: false,
nickname: "",
city: "",
userphoto: ""
}
},
onLoad() {
},
onShow() {
let userInfo = uni.getStorageSync('userInfo');
if (userInfo) {
this.userLogin = true;
this.nickname = userInfo.nickName;
this.city = userInfo.city;
this.userphoto = userInfo.avatarUrl;
} else {
this.userLogin = false;
}
},
methods: {
appAuthLogin(e) {
//获取用户的登录类型
var logintype = e.currentTarget.dataset.logintype;
//授权登录
uni.login({
provider: logintype,
success: (res) => {
//授权成功后获取用户信息
uni.getUserInfo({
provider: logintype,
success: (res) => {
uni.showToast({
title: "登录成功",
success: (res) => {
uni.switchTab({
url: "../index/index"
})
}
})
var me = this;
me.userLogin = true;
uni.setStorageSync("userInfo", res.userInfo);
}
})
}
})
},
onPullDownRefresh() {
//延迟加载,防止提示框出不来
setTimeout(function() {
uni.showToast({
title: "数据加载成功",
})
}, 200)
//导航条的加载动画,pages.json里如果不禁用的话
uni.showNavigationBarLoading();
//成功获取数据后结束下拉刷新
uni.stopPullDownRefresh();
//成功获取数据后隐藏加载动画
uni.hideNavigationBarLoading();
},
//退出登录
outLogin() {
var me = this;
uni.showModal({
title: '退出登录',
content: '确定要退出登录吗',
success: function(res) {
if (res.confirm) {
me.userLogin = false;
uni.removeStorageSync('userInfo');
uni.showToast({
title: "成功退出登录"
})
}
}
});
}
},
}
</script>
<style>
@import url("me.css");
</style>
12-28
2595