jp-xpgj-GA-file/src/projects/home/views/User/Role.vue

<template>
	<div>
		<common @asynCallBack="asynCallBack"></common>
		<top-header :pageTitle="pageTitle" :leftShow="false"></top-header>

		<div class="mui-content margin60">
			<div class="vongi-choose mui-content-padded">
				<h5>经过比对，您可以使用下列身份登录: </h5>
				<ul class="mui-table-view  mui-table-view-radio vongi-pipei">
					<li v-show="popedom.indexOf('1')>-1" :class="'mui-table-view-cell '+(visterScene.role=='1'?'mui-selected':'')"
					 @click="visterScene.role='1'">
						<a>
							<div class="mui-pull-left mui-col-xs-2">
								<div class="mui-media-object">
									<img :src="person_data.faceImageUrl">
								</div>
								<p class='mui-ellipsis'>员工</p>
								<span class="mui-badge mui-badge-danger">1</span>
							</div>
							<div class="mui-media-body mui-col-xs-10">
								{{person_data.position1}}
								<p class='mui-ellipsis' v-text="person_data.position2"></p>
							</div>
						</a>
					</li>
					<li v-show="popedom.indexOf('2')>-1" :class="'mui-table-view-cell '+(visterScene.role=='2'?'mui-selected':'')"
					 @click="visterScene.role='2'">
						<a>
							<div class="mui-pull-left mui-col-xs-2">
								<div class="mui-media-object">
									<img :src="person_data.faceImageUrl">
								</div>
								<p class='mui-ellipsis'>管理人员</p>
							</div>
							<div class="mui-media-body mui-col-xs-10">
								{{person_data.position1}}
								<p class='mui-ellipsis' v-text="person_data.position2"></p>
							</div>
						</a>
					</li>
					<!-- <li v-show="popedom.indexOf('3')>-1" :class="'mui-table-view-cell '+(visterScene.role=='3'?'mui-selected':'')"
					 @click="visterScene.role='3'">
						<a>
							<div class="mui-pull-left mui-col-xs-2">
								<div class="mui-media-object">
									<img :src="person_data.faceImageUrl">
								</div>
								<p class='mui-ellipsis'>监管端</p>
							</div>
							<div class="mui-media-body mui-col-xs-10">
								{{person_data.position1}}
								<p class='mui-ellipsis' v-text="person_data.position2"></p>
							</div>
						</a>
					</li> -->
				</ul>
			</div>
		</div>
		<div class="fyy-footer">
			<div class="bindfyy-btn"><button type="submit" class="mui-btn mui-btn-primary" @click="sure">确认选择</button></div>
		</div>
	</div>
</template>

<script>
	import Common from '$project/components/Common.vue'
	import Loading from '$project/components/Loading.vue'
	import TopHeader from '$project/components/TopHeader.vue'
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	import * as types from '$project/store/mutation-types'
	export default {
		name: 'Role',
		components: {
			Common,
			Loading,
			TopHeader
		},
		data() {
			return {
				pageTitle: '匹配身份',

				//传递过来的场景项目
				visterScene: {
					project: this.$route.query.project,
					role: ''
				}
			}
		},
		created() {
			if (this.$route.query.project) {
				this.visterScene.project = this.$route.query.project
			}
		},
		methods: {
			//确认
			sure(auto) {
				this.set_vister_scene(this.visterScene);
				if (this.visterScene.project == 'business') {
					if (this.visterScene.role == '1') {
						window.location.href = "../" + this.visterScene.project + '/#/master';
					} else if (this.visterScene.role == '2') {
						window.location.href = "../" + this.visterScene.project + '/#/houseKeeper/admin';
					} else if (this.visterScene.role == '3') {
						window.location.href = "../" + this.visterScene.project + '/#/houseKeeper/control';
					} else {
						if (!auto) {
							mui.toast('请选择角色');
						}
					}
				} else {
					mui.toast('未开放场景');
				}
			},
			asynCallBack() {
				//如果用户不存则去注册用户
				if (!this.person_data) {
					this.$router.push({
						name: 'Login',
						query: {
							project: this.visterScene.project
						}
					})
				}

				//如果场景是存在的则直接跳转
				if (!this.$route.query.exchange && this.vister_scene.project && this.vister_scene.role) {
					this.sure(true);
				}
			},
			...mapMutations({
				set_vister_scene: types.SET_VISTER_SCENE,
			})
		},
		mounted() {},
		destroyed() {

		},
		computed: {
			popedom: {
				// getter
				get: function() {
					return this.person_data ? this.person_data.popedom.split(',') : [];
				},
				// setter
				set: function(newValue) {
					console.log(newValue)
				}
			},
			...mapGetters({
				openId: 'wx_openid',
				token: 'token',
				person_data: 'person_data',
                person_popedom: 'person_popedom',
				vister_scene: 'vister_scene',
			})
		}
	}
</script>

<style src="$project/assets/css/iconfont.css"></style>
<style scoped src="$project/assets/css/xpwyfyy.css"></style>
<style scoped>
</style>