105 lines
2.0 KiB
Vue
105 lines
2.0 KiB
Vue
<template>
|
|
<view class="component">
|
|
<view class="layout-head flex justify-between align-center">
|
|
<view class="m-left-20">
|
|
<u-icon name="arrow-left" color="#ffffff" size="22" @click="handBack" v-if="showBack"></u-icon>
|
|
</view>
|
|
<view class="text text-single p-right-20">
|
|
{{ title }}
|
|
</view>
|
|
<view class="user flex justify-end align-center flex-1">
|
|
<view class="text" @click="loginLink">{{
|
|
(userData && userData.nickname) ? userData.nickname : '未登录'
|
|
}}
|
|
</view>
|
|
<u-button v-if="userData && userData.nickname" type="primary" @click="logout"
|
|
:custom-style="{width: '140rpx', margin: '0 10rpx', padding: '0'}"
|
|
size="mini">退出登录
|
|
</u-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
isLogin: false,
|
|
userData: null
|
|
}
|
|
},
|
|
props: {
|
|
title: {
|
|
type: String,
|
|
default: '金久信'
|
|
},
|
|
showBack: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
|
|
},
|
|
methods: {
|
|
handBack() {
|
|
uni.navigateBack({
|
|
delta: 1,
|
|
})
|
|
},
|
|
loginLink() {
|
|
if (this.userData && this.userData.nickname) uni.navigateTo({url: '/pages/user/user'})
|
|
else vk.navigateTo('/pages/login/login')
|
|
},
|
|
logout() {
|
|
vk.userCenter.logout({
|
|
success: () => {
|
|
uni.reLaunch({
|
|
url: '/'
|
|
})
|
|
}
|
|
});
|
|
},
|
|
},
|
|
mounted() {
|
|
this.userData = vk.getStorageSync('uni_id_user_info')
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.layout-head {
|
|
// width: 750rpx;
|
|
height: 80rpx;
|
|
background: #ae4f4d;
|
|
|
|
.num {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
}
|
|
|
|
.img {
|
|
width: 220rpx;
|
|
height: 58rpx;
|
|
}
|
|
|
|
.text {
|
|
font-size: 28rpx;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.user {
|
|
.icon {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
}
|
|
|
|
.text {
|
|
padding-left: 10rpx;
|
|
font-size: 24rpx;
|
|
line-height: 32rpx;
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
}
|
|
</style>
|