<template>
|
<view class="my">
|
<view class="my-head">
|
<u-navbar title="我的" :border-bottom="false" :background="background" :title-bold="true" title-color="#fff"
|
:is-back="false" />
|
<view class="my-head-content" @click="navTo('info')">
|
<u-avatar :src="image" size="240"></u-avatar>
|
<p style="font-weight: bold;
|
font-size: 34rpx;
|
color: #333333;margin-bottom: 12rpx;">{{
|
vuex_username || $t("login.noLogin")
|
}}</p>
|
<!-- TODO 对接部门 -->
|
<p style="font-weight: 500;
|
font-size: 28rpx;
|
color: #666666;">生产部门一</p>
|
</view>
|
</view>
|
<u-button type="primary" style="margin: 30rpx;" :loading="loading" @click="logout" :custom-style="{
|
backgroundColor: '#214DED',
|
height: '80rpx'
|
}" class="btn">{{ $t("login.logoutButton") }}</u-button>
|
</view>
|
</template>
|
|
<script>
|
import config from "../../../common/config";
|
export default {
|
data() {
|
return {
|
background: {
|
background: 'transparent'
|
},
|
loading: false,
|
image: undefined,
|
}
|
},
|
onLoad() {
|
this.image = config.baseUrl + this.vuex_user.avatar;
|
},
|
methods: {
|
logout() {
|
this.$u.api.logout().then((res) => {
|
this.$u.toast(res.message);
|
|
//清空存储信息
|
this.$u.vuex("vuex_token", "");
|
this.$u.vuex("vuex_refresh_token", "");
|
this.$u.vuex("vuex_username", "");
|
this.$u.vuex("vuex_userId", "");
|
this.$u.vuex("vuex_client_id", "");
|
this.$u.vuex("vuex_user", {});
|
|
setTimeout(() => {
|
uni.reLaunch({
|
url: "/pages/sys/login/index",
|
});
|
}, 500);
|
});
|
},
|
navTo(url) {
|
// uni.navigateTo({
|
// url: url,
|
// });
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.my {
|
height: calc(100vh - 100rpx);
|
background: linear-gradient(to bottom, #E5F0FF, #F6F9FF);
|
|
.my-head {
|
height: 320rpx;
|
background-image: url('~@/static/custom/user/bg2.png');
|
background-size: 100% auto;
|
background-repeat: no-repeat;
|
position: relative;
|
|
.my-head-content {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
position: absolute;
|
left: 50%;
|
transform: translate(-50%, 0);
|
bottom: -220rpx;
|
}
|
}
|
|
.btn {
|
position: fixed;
|
bottom: 160rpx;
|
width: calc(100% - 60rpx);
|
}
|
}
|
</style>
|
