<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); 
 | 
      }) 
 | 
      .catch((err) => { 
 | 
        this.$u.api.workReporting 
 | 
                    .getWorkshopOrder({}) 
 | 
                    .then((res) => { 
 | 
                    }); 
 | 
      }) 
 | 
    }, 
 | 
    navTo(url) { 
 | 
      // uni.navigateTo({ 
 | 
      //   url: url, 
 | 
      // }); 
 | 
    }, 
 | 
  } 
 | 
} 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
.my { 
 | 
  height: 100%; 
 | 
  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> 
 |