<!--
|
* @Author: 小明丶
|
* @Date: 2019-08-19 09:30:14
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2020-11-17 10:02:59
|
* @Description: 切换身份页面
|
-->
|
<template>
|
<div class="identity-box">
|
<v-navbar :title="$route.query.title" fixed></v-navbar>
|
<section class="role-box" v-for="(item, index) in roleList" :key="index">
|
<van-radio-group v-if="item.arr.length" v-model="roleId">
|
<h4 class="title">{{item.title}}</h4>
|
<div class="flex-between-g role-item" v-for="(role, k) in item.arr" :key="k">
|
<div class="left">
|
<p class="flex-start-g">
|
<svg class="icon" aria-hidden="true" style="width:15px;height:15px;">
|
<use xlink:href="#iconyonghu"></use>
|
</svg>
|
<span class="name">{{role.orgName}}</span>
|
</p>
|
<p class="flex-start-g">
|
<svg class="icon" aria-hidden="true" style="width:15px;height:15px;">
|
<use xlink:href="#iconshijian"></use>
|
</svg>
|
<time class='time'>创建时间：{{role.creTime | timeformat('yyyy-MM-dd HH:mm:ss')}}</time>
|
</p>
|
</div>
|
<div @click="setRole(role)" v-if="role.status == 1 && role.supStatus == 1" >
|
<van-radio :name="role.id" :checked-color="$store.state.backColor" />
|
</div>
|
</div>
|
</van-radio-group>
|
</section>
|
<van-button class="btn-login" :color="$store.state.backColor" @click="getRoleInfo">登录</van-button>
|
</div>
|
</template>
|
|
<script>
|
import { mapActions, mapState } from 'vuex';
|
export default {
|
data() {
|
return {
|
roleList: [],//角色列表
|
roleId: '',//radio的value
|
role:null //当前选中的角色
|
}
|
},
|
computed:{
|
...mapState(['userinfo'])
|
},
|
created() {
|
this.roleId = this.userinfo.id;
|
if(sessionStorage.isLoginByOpenId == 1){
|
this.roleList = [{
|
title:'门店',
|
arr:JSON.parse(localStorage.storeList)
|
}]
|
}else{
|
this.getRole();
|
}
|
|
},
|
methods: {
|
...mapActions(['setUserMenu']),
|
// 设置当前选中的角色
|
setRole(role){
|
this.role = role;
|
},
|
// 获取角色
|
getRole() {
|
this.$api.getRole().then((res) => {
|
let {
|
agencyList,
|
chanList,
|
merchantList,
|
storeList
|
} = res.body;
|
this.roleList.push({
|
title:'代理',
|
arr:agencyList || []
|
});
|
this.roleList.push({
|
title:'渠道',
|
arr:chanList || []
|
});
|
this.roleList.push({
|
title:'商户',
|
arr:merchantList || []
|
});
|
this.roleList.push({
|
title:'门店',
|
arr:storeList || []
|
});
|
|
}).catch((err) => {
|
|
});
|
},
|
// 获取用户信息
|
getRoleInfo(){
|
if(!this.roleId){
|
this.$notify('请选择登录角色');
|
return
|
}
|
this.setUserMenu({
|
vm:this,
|
lastLoginMgrId:this.roleId,
|
})
|
// this.$api.getPowerInfo(this.roleId).then((res) => {
|
|
// }).catch((err) => {
|
|
// });
|
}
|
},
|
}
|
</script>
|
|
<style lang="less" scoped>
|
.identity-box {
|
background-color: @c-bg-f5;
|
min-height: 100%;
|
padding-top: 44px;
|
padding-bottom: 30px;
|
}
|
|
.role-box {
|
.title {
|
.lh(30px);
|
margin-left: 20px;
|
margin-top: 15px;
|
color: @c-text-999;
|
font-size: @font-14;
|
}
|
|
.role-item {
|
padding: 0 12px;
|
background-color: @c-bg-fff;
|
margin: 0 8px 1px;
|
border-radius: 3px;
|
}
|
|
.left {
|
height: 75px;
|
.flex(center, flex-start, wrap, column);
|
|
p:first-child {
|
margin-bottom: 10px;
|
}
|
|
.icon {
|
margin-right: 8px;
|
}
|
}
|
|
.name {
|
font-size: @font-16;
|
font-weight: bold;
|
}
|
|
.time {
|
font-size: @font-12;
|
color: @c-text-999;
|
}
|
|
.circle {
|
height: 18px;
|
width: 18px;
|
margin-right: 2px;
|
border-radius: 50%;
|
background-color: #fff;
|
border: 2px solid @c-default;
|
}
|
}
|
|
.btn-login {
|
display: block;
|
.lh(44px);
|
width: 320px;
|
margin: 25px auto 0;
|
background-color: @c-bg-default;
|
color: @c-text-fff;
|
border-radius: 22px;
|
}
|
</style>
|
