shuju_ui/qs_zhaoshang/pages/mine/info/index.vue

<template>
  <view class="info">
	  <view class='zhanline'></view>
	<view class="pl12">
		<view class="flexc infolist">
			<view class="f16 fw c34 flex0">账号名称</view>
			<view class="f16  c34 flex1 txr">{{user.userName}}</view>
		</view>
		<view class="flexc infolist">
			<view class="f16 fw c34 flex0">用户类型</view>
			<view class="f16  c34 flex1 txr">{{roleGroup}}</view>
		</view>
		<!-- <view class="flexc infolist">
			<view class="f16 fw c34 flex0">联系方式</view>
			<view class="f16  c34 flex1 txr">180****5668</view>
		</view> -->
		<view class="infobtn flexcc cf f16 mt60 f500" @click="handleLogout">退出登录</view>
	</view>

  </view>
</template>

<script>
  import { getUserProfile } from "@/api/system/user"

  export default {
    data() {
      return {
        user: {},
        roleGroup: "",
        postGroup: "",
	
		
      }
    },
    onLoad() {
      this.getUser()
    },
    methods: {
      getUser() {
        getUserProfile().then(response => {
          this.user = response.data
          this.roleGroup = response.roleGroup
          this.postGroup = response.postGroup
        })
      },
	  handleLogout() {
	    this.$modal.confirm('确定注销并退出系统吗？').then(() => {
	      this.$store.dispatch('LogOut').then(() => {
	        this.$tab.reLaunch('/pages/index')
	      })
	    })
	  }
    }
  }
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }
  .infolist{border-bottom: 2rpx solid #E5E5E5;padding: 40rpx 0;padding-right: 24rpx;}
   .infobtn{width: 700rpx;height: 88rpx;background: #FA5F03;border-radius:10rpx;line-height: 88rpx;}
</style>