~chenshaoxiong/treatment_room_screen.git

long

2024-02-04 ae5ea1a3d06324d85f4b04f17bac0dc5572a5a8f

提交 \| 用户 \| age
aeb317	1	<template>
J	2	<div class="login-container flex flex-ver">
	3	<div class="login-form">
	4	<!-- <div class="title-container flex flex-ver mb20">
	5	<img class="login_logo" src="../../assets/login/logo.png">
	6	<h3 class="title">芙艾预约管理系统</h3>
	7	<div class="title ml10">芙艾（P-HIS）医院管理系统</div>
	8	<h3 class="title ml10">昊芝综合医疗运营管理系统</h3>
	9	</div> -->
	10	<!-- 账号登录 -->
	11	<div v-if="loginType===0">
	12	<el-form ref="loginForm" :model="loginForm" :rules="loginRules" autocomplete="on" label-position="left">
	13
	14	<el-form-item prop="username">
	15	<span class="svg-container">
	16	<svg-icon icon-class="user" />
	17	</span>
	18	<el-input
	19	ref="username"
	20	v-model="loginForm.username"
	21	placeholder="请输入账号"
	22	name="username"
	23	type="text"
	24	tabindex="1"
	25	autocomplete="on"
	26	@keyup.enter.native="handleLogin"
	27	/>
	28	</el-form-item>
	29
	30	<el-tooltip v-model="capsTooltip" content="Caps lock is On" placement="right" manual>
	31	<el-form-item prop="password">
	32	<span class="svg-container">
	33	<svg-icon icon-class="password" />
	34	</span>
	35	<el-input
	36	:key="passwordType"
	37	ref="password"
	38	v-model="loginForm.password"
	39	:type="passwordType"
	40	placeholder="请输入密码"
	41	name="password"
	42	tabindex="2"
	43	autocomplete="on"
	44	@keyup.native="checkCapslock"
	45	@blur="capsTooltip = false"
	46	@keyup.enter.native="handleLogin"
	47	/>
	48	<span class="show-pwd" @click="showPwd">
	49	<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
	50	</span>
	51	</el-form-item>
	52	</el-tooltip>
	53
	54	<div class="flex flex-start flex-sb">
	55	<el-form-item prop="safecode" class="flex-1">
	56	<span class="svg-container">
	57	<svg-icon icon-class="safecode" />
	58	</span>
	59	<el-input
	60	ref="safecode"
	61	v-model="loginForm.safecode"
	62	style="width: 70%"
	63	placeholder="请输入验证码"
	64	name="safecode"
	65	type="text"
	66	tabindex="3"
	67	autocomplete="off"
	68	@keyup.enter.native="handleLogin"
	69	/>
	70	<el-image
	71	v-if="isTestView"
	72	class="safecode-img"
	73	:src="safecodeImg"
	74	fit="fill"
	75	@click="getSafeCodeImg"
	76	>
	77	<div slot="error" class="image-slot">
	78	<i class="el-icon-picture-outline" />
	79	</div>
	80	</el-image>
	81	</el-form-item>
	82	<el-button v-if="!isTestView" class="ml10 mt5" :disabled="isShowCount" type="blackblue" @click="sendCode">
	83	{{ isShowCount ? secondCount + '秒后重发' : '发送验证码' }}
	84	</el-button>
	85	</div>
	86
	87	<!-- <el-form-item prop="safecode">
	88	<span class="svg-container">
	89	<svg-icon icon-class="safecode" />
	90	</span>
	91	<el-input
	92	ref="safecode"
	93	v-model="loginForm.safecode"
	94	style="width: 60%"
	95	placeholder="请输入验证码"
	96	name="safecode"
	97	type="text"
	98	tabindex="3"
	99	autocomplete="off"
	100	@keyup.enter.native="handleLogin"
	101	/>
	102	<el-image
	103	class="safecode-img"
	104	:src="safecodeImg"
	105	fit="fill"
	106	@click="getSafeCodeImg"
	107	>
	108	<div slot="error" class="image-slot">
	109	<i class="el-icon-picture-outline" />
	110	</div>
	111	</el-image>
	112	</el-form-item> -->
	113
	114	</el-form>
	115
	116	<div>
	117	<el-button :loading="loading" type="blackblue" style="width:100%;margin-bottom:20px;border-radius: 22px;" @click.native.prevent="handleLogin">登录</el-button>
	118	</div>
	119	<div>
	120	<el-button v-if="!isTestView" :loading="loading" plain style="width:100%;border-radius: 22px;" @click="loginType=1">切换扫码登录</el-button>
	121	<!-- <el-button v-else :loading="loading" plain style="width:100%;border-radius: 22px;" @click="simulateLogin">模拟扫码登录</el-button> -->
	122	</div>
	123	<!-- 企业微信直接带上state和code，无需再用按钮 -->
	124	<!-- <div>
	125	<el-button :loading="loading" plain style="width:100%;margin-top:20px;border-radius: 22px;" @click.native.prevent="handleWebLogin">网页登录</el-button>
	126	</div> -->
	127	</div>
	128	<!-- 扫码登录 -->
	129	<div v-if="loginType===1">
	130	<!-- 扫码 -->
	131	<div v-if="!show_role_list" id="wx_reg" class="flex flex-align-center" />
	132	<!-- 扫码回调后 -->
	133	<div v-if="show_role_list">
	134	<div class="role-list-title">请选择角色</div>
	135	<div class="role-list flex flex-wrap" :class="{'block-list': roleList.length<=4}">
	136	<!-- 20231117 long 加个双击进入 -->
	137	<div v-for="(item,index) in roleList" :key="index" class="item flex flex-ver" :class="{active:item.id == roleId}" @click="selectRole(item.id)" @dblclick="item.id == roleId?selectCodeLoginTest(roleId):noop()">
	138	<div class="flex-1">
	139	<div class="role-name ell">{{ item.roleName }}</div>
	140	<div class="shop-name ell">{{ item.shopName }}</div>
	141	</div>
	142	<i class="el-icon-check" />
	143	</div>
	144	</div>
	145	<div>
	146	<el-button v-if="isTestView" :loading="loading" :disabled="!roleId" type="blackblue" style="width: 100%;margin-bottom:20px;border-radius: 22px;" @click.native.prevent="selectCodeLoginTest(roleId)">{{ roleId ? '马上登录' : '选择角色后登录' }}</el-button>
	147	<el-button v-else :loading="loading" :disabled="!roleId" type="blackblue" style="width: 100%;margin-bottom:20px;border-radius: 22px;" @click.native.prevent="selectCodeLogin(roleId)">{{ roleId ? '马上登录' : '选择角色后登录' }}</el-button>
	148	</div>
	149	<div v-if="!isTestView">
	150	<el-button type="blackblue" style="width: 100%;margin-bottom:20px;border-radius: 22px;" @click.native.prevent="scanAgain">重新扫码<i class="el-icon-refresh-right el-icon--right" /></el-button>
	151	</div>
	152	</div>
	153	<!-- <el-button :loading="loading" plain style="width:100%;border-radius: 22px;" @click="loginType=0">切换账号登录<i class="el-icon-arrow-right el-icon--right" /></el-button> -->
	154	<!-- <el-button :loading="loading" plain style="width:100%;border-radius: 22px;" @click="loginType=0">切换登录方式<i class="el-icon-arrow-right el-icon--right" /></el-button> -->
	155	</div>
	156
	157	</div>
	158	</div>
	159	</template>
	160
	161	<script>
	162	// 设置token和用户数据
	163	import { setToken, setUserData } from '@/utils/auth' // get token from session
	164	// 基础配置 - 获取当前环境
	165	const baseConfig = require('../../config/index')
	166	// 登录接口的 mockData
	167	const g_mockData = require('./g_mockData.js')
	168	// 获取参数方法
	169	import { getQueryObj } from '@/pages/login/getQueryObj'
	170	import Req from '../../utils/jun_httpInstall' // http 请求
	171	export default {
	172	name: 'Login',
	173	components: {},
	174	data() {
	175	const validateUsername = (rule, value, callback) => {
	176	if (!value) {
	177	callback(new Error('请输入账号'))
	178	} else {
	179	callback()
	180	}
	181	}
	182	const validatePassword = (rule, value, callback) => {
	183	if (value ? value.length < 6 : !value) {
	184	callback(new Error('密码不能少于6位'))
	185	} else {
	186	callback()
	187	}
	188	}
	189	const validateSafecode = (rule, value, callback) => {
	190	if (!value) {
	191	callback(new Error('请输入验证码'))
	192	} else {
	193	callback()
	194	}
	195	}
	196	return {
	197	// 当前登陆环境
	198	localOnline: baseConfig.localOnline, // 本地连线上（和isTestView一起判断） 20230619 long
	199
	200	loginForm: {
	201	username: '',
	202	password: '',
	203	safecode: '',
	204	checkedId: ''
	205	},
	206	loginRules: {
	207	username: [{ required: true, trigger: 'blur', validator: validateUsername }],
	208	password: [{ required: true, trigger: 'blur', validator: validatePassword }],
	209	safecode: [{ required: true, trigger: 'blur', validator: validateSafecode }]
	210	},
	211	passwordType: 'password',
	212	capsTooltip: false,
	213	loading: false,
	214	showDialog: false,
	215	redirect: undefined,
	216	otherQuery: {},
	217	// 测试服用图片验证码线上用发送手机验证码
	218	safecodeImg: '',
	219	secondCount: 0, // 秒
	220	telCode: '', // 短信验证码
	221	messageId: '', // 发送成功
	222	isShowCount: false,
	223	timer: null,
	224
	225	loginType: 0,
	226
	227	// 20230216 long 用户重定向页面识别登录类型
	228	// 扫码登录STATE_SCAN、网页登录TATE_WEB
	229	state: '',
	230	STATE_SCAN: 'hx168',
	231	STATE_WEB: 'hx168_web',
	232
	233	show_role_list: false, // 显示选择角色
	234	roleList: [],
	235	roleId: '',
	236	code: ''
	237	}
	238	},
	239	watch: {
	240	$route: {
	241	handler: function(route) {
	242	const query = route.query
	243	if (query) {
	244	this.redirect = query.redirect
	245	this.otherQuery = this.getOtherQuery(query)
	246	}
	247	},
	248	immediate: true
	249	},
	250
	251	// 切换loginType
	252	loginType: {
	253	handler(loginType) {
	254	this.$nextTick(() => {
	255	if (loginType === 1) {
	256	if (baseConfig.ismock) {
	257	// this.$messageWarn('本地环境请使用密码登录')
	258	// this.loginType = 0
	259	} else {
	260	if (!this.show_role_list) {
	261	if (!this.isTestView) this.initCodeLogin()
	262	}
	263	}
	264	} else {
	265	this.initLoginData()
	266	}
	267	})
	268	},
	269	immediate: true
	270	}
	271	},
	272	mounted() {
	273	this.init()
	274	},
	275	methods: {
	276	init() {
	277	this.loginType = this.isTestView ? 0 : 1
	278	if (getQueryObj() && getQueryObj().loginType === '1') {
	279	this.loginType = 1
	280	}
	281	if (this.$route.query.logout) {
	282	// 清空企业微信登录code
	283	this.replaceNoCode()
	284	return
	285	}
	286	if (this.$route.query.logout_603) {
	287	// 清空企业微信登录code，清空redirect
	288	this.replaceNoCodeNoRedirect()
	289	return
	290	}
	291	const code = getQueryObj().code
	292	if (code) {
	293	this.state = getQueryObj().state
	294	this.code = code
	295	this.$nextTick(() => {
	296	this.codeLogin(code)
	297	})
	298	}
	299	},
	300
	301	// 清空企业微信登录code
	302	replaceNoCode() {
	303	if (this.$route.query.isMiniprogram) { return }
	304	window.location.replace('//' + window.location.host + window.location.pathname + '#/login?redirect=' + this.$route.query.redirect)
	305	},
	306
	307	// 清空企业微信登录code，清空redirect
	308	replaceNoCodeNoRedirect() {
	309	if (this.$route.query.isMiniprogram) { return }
	310	window.location.replace('//' + window.location.host + window.location.pathname + '#/login')
	311	},
	312
	313	// 企业微信扫码登录 - 初始化
	314	initCodeLogin() {
	315	// 测试
	316	// this.selectCodeLogin(window.prompt('请输入角色id'))
	317	// return
	318
	319	// 测试回调
	320	// this.wwLogin = new window.WwLogin({
	321	// 'id': 'wx_reg',
	322	// 'appid': 'wx23a7c266dcd048aa',
	323	// 'agentid': '1000050',
	324	// 'redirect_uri': 'http://test6.phiskin.com/assist/admin/employee/login/scanLogin',
	325	// 'state': 'hx168',
	326	// 'href': '',
	327	// 'lang': 'zh'
	328	// })
	329
	330	if (this.code) {
	331	return
	332	}
	333
	334	this.wwLogin = new window.WwLogin({
	335	'id': 'wx_reg',
	336	'appid': 'wx23a7c266dcd048aa',
	337	'agentid': '1000050',
	338	'redirect_uri': 'https://' + window.location.host + window.location.pathname,
	339	// 'redirect_uri': 'http://serv3.phiskin.com/appointment/adminweb_v2/index.html',
	340	// 'redirect_uri': 'http://test6.phiskin.com/adminwebV3/index.html', // 新版管理系统
	341	'state': this.STATE_SCAN,
	342	'href': '',
	343	'lang': 'zh'
	344	})
	345	},
	346
	347	scanAgain() {
	348	this.code = ''
	349	this.show_role_list = false
	350	if (this.loginType === 1) {
	351	this.$nextTick(() => {
	352	this.initCodeLogin()
	353	})
	354	} else {
	355	this.loginType = 1
	356	}
	357	},
	358
	359	// 网页登录
	360	handleWebLogin() {
	361	let redirect_uri = 'https://' + window.location.host + window.location.pathname
	362	redirect_uri = encodeURIComponent(redirect_uri)
	363	const appid = 'wx23a7c266dcd048aa'
	364	const response_type = 'code'
	365	const scope = 'snsapi_base'
	366	const state = this.STATE_WEB
	367	const agentid = '1000050'
	368
	369	const loginUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${redirect_uri}&response_type=${response_type}&scope=${scope}&state=${state}&agentid=${agentid}#wechat_redirect`
	370
	371	window.location.replace(loginUrl)
	372	},
	373
	374	// 扫码登录回调
	375	codeLogin(code) {
	376	const { state, STATE_SCAN, STATE_WEB } = this
	377	let url = ''
	378	if (state === STATE_SCAN) url = 'admin/employee/login/scanLogin'
	379	if (state === STATE_WEB) url = 'admin/employee/login/webAuthLogin'
	380
	381	if (this.localOnline && this.isTestView) url = 'admin/employee/login/scanLogin' // 本地连线上 20230619 long
	382
	383	// state值不对，重新登录
	384	if (!url) {
	385	this.$alert('登录异常，请重新登录', '提示', {
	386	confirmButtonText: '重新登录',
	387	showClose: false,
	388	callback: action => {
	389	this.replaceNoCodeNoRedirect()
	390	}
	391	})
	392	return
	393	}
	394
	395	Req.http.post({
	396	url: url,
	397	udData: { noToken: true },
	398	data: {
	399	code, state
	400	},
	401	mockData: { 'code': '100', 'msg': 'SUCCESS', 'data': { 'roleList': [{ 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': '顾问', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'adviser_leader', 'id': '82c1a5fe0a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }, { 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': 'MIC', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'mic', 'id': '82c1ca2f0a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }, { 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': '医生', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'doctor', 'id': '82c1eb980a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }, { 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': '护士', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'nurse', 'id': '82c20cde0a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }, { 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': '前台', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'reception', 'id': '82c22d150a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }, { 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': '店长', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'shopowner', 'id': '82c24da90a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }, { 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': '护士助理', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'nurse_assistant', 'id': '82c26d510a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }, { 'roleTypeId': '', 'createTime': { 'date': 22, 'hours': 17, 'seconds': 46, 'month': 8, 'timezoneOffset': -480, 'year': 121, 'minutes': 17, 'time': 1632302266607, 'day': 3 }, 'roleId': '82c1a5fe0a5011ec96245254007749be', 'roleName': '医生助理', 'shopName': '新天地店', 'employeeId': '', 'roleUniqueStr': 'doctor_assistant', 'id': '82c28d7d0a5011ec96245254007749be', 'shopId': '605e391b620d11ebb06bb8599f4cafbe', 'oldId': '', 'isDel': 0 }], 'employeeId': '476051fc000711ecbbe230d0422e31b5' }}
	402	}).then((inf) => {
	403	// this.afterLogin(inf)
	404	// 更改显示登录选项
	405	this.roleList = inf.roleList
	406	this.show_role_list = true
	407	// 切换登录模式
	408	this.loginType = 1
	409	}).catch((res) => {
	410	this.loading = false
	411	this.code = '' // 清空关键判断
	412	this.$messageError(res.msg)
	413
	414	// 去掉code参数，刷新页面
	415	setTimeout(() => {
	416	this.replaceNoCodeNoRedirect()
	417	}, 1500)
	418	})
	419	},
	420
	421	// 选择角色
	422	selectRole(id) {
	423	this.roleId = id
	424	},
	425	// 选择角色后登录
	426	selectCodeLogin(roleId) {
	427	if (!roleId) {
	428	this.$messageWarn('缺少选择角色id')
	429	return
	430	}
	431	Req.http.post({
	432	// 2022-06-23 登录新接口
	433	url: 'admin/employee/login/selectLoginRoleNew',
	434	// url: 'admin/employee/login/selectLoginRole',
	435	udData: { noToken: true },
	436	data: {
	437	roleId
	438	},
	439	mockData: g_mockData.login
	440	}).then((inf) => {
	441	this.afterLogin(inf)
	442	}).catch((res) => {
	443	this.loading = false
	444	this.$messageError(res.msg)
	445	})
	446	},
	447
	448	// 发送验证码
	449	sendCode() {
	450	if (!this.loginForm.username) return this.$message.error('请输入账号')
	451	Req.http.post({
	452	url: 'admin/employee/login/sendVerifyCode',
	453	data: { account: this.loginForm.username },
	454	mockData: {
	455	code: 100,
	456	msg: '',
	457	data: {}
	458	}
	459	}).then((inf) => {
	460	this.getCode()
	461	this.$message.success('验证码发送成功')
	462	})
	463	},
	464	// 倒计时
	465	getCode() {
	466	const times = 60 // 倒计时时间
	467	if (!this.timer) {
	468	this.secondCount = times
	469	this.isShowCount = true
	470	this.timer = setInterval(() => {
	471	if (this.secondCount > 0 && this.secondCount <= times) {
	472	this.secondCount--
	473	} else {
	474	this.isShowCount = false
	475	clearInterval(this.timer)
	476	this.timer = null
	477	}
	478	}, 1000)
	479	}
	480	},
	481
	482	// 密码登录 - 初始化
	483	initLoginData() {
	484	var loginData = localStorage.getItem('loginData')
	485	// console.log(loginData)
	486	// 获取保存的账号密码
	487	if (loginData) this.loginForm = JSON.parse(loginData)
	488
	489	if (this.loginForm.username === '') {
	490	this.$refs.username && this.$refs.username.focus()
	491	} else if (this.loginForm.password === '') {
	492	this.$refs.password && this.$refs.password.focus()
	493	} else if (this.loginForm.safecode === '') {
	494	this.$refs.safecode && this.$refs.safecode.focus()
	495	}
	496	if (this.isTestView) this.getSafeCodeImg()
	497	},
	498
	499	// 是否大写
	500	checkCapslock(e) {
	501	const { key } = e
	502	this.capsTooltip = key && key.length === 1 && (key >= 'A' && key <= 'Z')
	503	},
	504
	505	// 切换密码显示
	506	showPwd() {
	507	if (this.passwordType === 'password') {
	508	this.passwordType = ''
	509	} else {
	510	this.passwordType = 'password'
	511	}
	512	this.$nextTick(() => {
	513	this.$refs.password.focus()
	514	})
	515	},
	516
	517	// 获取验证码图
	518	getSafeCodeImg() {
	519	var checkedId = this.getCheckedId()
	520	Req.http.post({
	521	url: 'admin/create/cheked',
	522	data: { checkedId: checkedId },
	523	udData: { noToken: true },
	524	mockData: {
	525	code: 100,
	526	msg: '',
	527	data: {
	528	imgStr: 'xxxx'
	529	}
	530	}
	531	}).then((inf) => {
	532	this.safecodeImg = this.perfectSafeCode(inf.data.imgStr)
	533	this.loginForm.checkedId = checkedId
	534	})
	535	},
	536	// 补全验证码
	537	perfectSafeCode(img) {
	538	if (!img) return
	539	return `data:image/jpeg;base64,${img}`
	540	},
	541	// 登录后回调
	542	afterLogin(inf) {
	543	// 保存登录凭证
	544	setToken(inf.adminToken)
	545
	546	// 保存账号密码
	547	var loginData = JSON.stringify({
	548	username: this.loginForm.username.trim()
	549	})
	550	// password: this.loginForm.password.trim() // 20210322 long 取消记住密码
	551	localStorage.setItem('loginData', loginData)
	552
	553	sessionStorage.setItem('newAppTime', new Date()) // 存入时间用于获取新的预约数
	554
	555	// 保存用户数据
	556	setUserData(inf)
	557
	558	this.loading = false
	559
	560	// 登录成功跳转页面
	561	this.$messageSuc('登录成功')
	562	setTimeout(() => {
	563	// this.$router.push({ path: '/dashboard' })
	564	this.$router.push({ path: this.redirect \|\| '/dashboard', query: this.otherQuery })
	565	}, 1000)
	566	},
	567	// 密码登录
	568	handleLogin() {
	569	this.$refs.loginForm.validate(valid => {
	570	if (valid) {
	571	const { username, password, safecode, checkedId } = this.loginForm
	572	const params = {
	573	account: username.trim(),
	574	password: password.trim(),
	575	checkedCode: safecode.trim()
	576	}
	577	this.loading = true
	578	// const url = this.isTestView ? 'admin/employee/login/accountLogin' : 'admin/loginNew'
	579	const url = this.isTestView ? 'admin/employee/login/accountLogin' : 'admin/employee/login/accountLogin/v2'
	580	if (this.isTestView) {
	581	params.checkedId = checkedId
	582	}
	583	Req.http.post({
	584	// url: 'admin/loginNew',
	585	url,
	586	data: params,
	587	udData: { noToken: true },
	588	// mockData: g_mockData.login
	589	mockData: g_mockData.scanLoginTest
	590	}).then((inf) => {
	591	this.loading = false
	592	this.loginType = 1
	593	this.jumpToRoomList()
	594	// this.show_role_list = true
	595	// this.roleList = inf.roleList \|\| []
	596	/* if (this.isTestView) {
	597	this.loading = false
	598	this.loginType = 1
	599	this.show_role_list = true
	600	this.roleList = inf.roleList \|\| []
	601	} else {
	602	this.afterLogin(inf)
	603	} */
	604	}).catch((res) => {
	605	this.loading = false
	606	this.$messageError(res.msg)
	607	})
	608	} else {
	609	console.log('表单验证失败')
	610	return false
	611	}
	612	})
	613	},
	614	// 跳转房间列表
	615	jumpToRoomList() {
	616	this.$router.push({
	617	path: `./room/list`
	618	})
	619	},
	620	// 获取route query对象
	621	getOtherQuery(query) {
	622	return Object.keys(query).reduce((acc, cur) => {
	623	if (cur !== 'redirect') {
	624	acc[cur] = query[cur]
	625	}
	626	return acc
	627	}, {})
	628	},
	629
	630	// 测试服登录 👇
	631	// 测试扫码登录
	632	simulateLogin() {
	633	this.loginType = 1
	634	// 获取用户缓存权限信息
	635	// const userData = JSON.parse(getUserData())
	636	Req.http.post({
	637	url: 'admin/employee/login/scanLoginTest',
	638	data: {
	639	employeeId: '476051fc000711ecbbe230d0422e31b5' // 黄嘉荣员工id 476051fc000711ecbbe230d0422e31b5
	640	// employeeId: '3eb10b540b2b11ecb06bb8599f4cafbe' // 黄嘉荣员工id 3eb10b540b2b11ecb06bb8599f4cafbe - 和爷
	641	},
	642	mockData: g_mockData.scanLoginTest
	643	}).then((res) => {
	644	this.show_role_list = true
	645	this.roleList = res.roleList \|\| []
	646	})
	647	},
	648
	649	selectCodeLoginTest(id) {
	650	let url = 'admin/employee/login/selectLoginRoleNewTest'
	651	if (this.localOnline && this.isTestView) url = 'admin/employee/login/selectLoginRoleNew' // 本地连线上 20230619 long
	652	Req.http.post({
	653	url,
	654	data: {
	655	roleId: id
	656	},
	657	mockData: {
	658	code: 100,
	659	msg: '',
	660	data: {
	661	'adminToken': 'eyJhbGciOiJIUzI1NiJ9.eyJqdGkiOiIxMzhlZjMzZjEyMzUxMWVkOTFkMTUyNTQwMGI4NTEwYSIsInN1YiI6ImxvZ2luX2FkbWluX2VtcGxveWVlIiwiaXNzIjoidXNlciIsImlhdCI6MTY3MzA4MTcwOSwiZXhwIjoxNjczMTI0MDA5fQ.s3QiYhK6EemOw9ksbxvM0jygnQxkHZwTWJ3JdAAFxkc',
	662	'name': '黄嘉荣',
	663	'tel': '15999971794',
	664	'imgUrl': 'https://phiskin-pre-1305571091.cos.ap-shanghai.myqcloud.com/member/3a82bead-4960-44c1-915f-467df3a80cf3.jpg',
	665	arr: [],
	666	arrNew: [],
	667	'employeeId': '476051fc000711ecbbe230d0422e31b5',
	668	'shopId': 'bb4e8a7d620d11ebb06bb8599f4cafbe',
	669	'roleName': 'admin',
	670	'dataAuth': {
	671	'warehouseList': [],
	672	'noAttributionData': 0,
	673	'roleId': '138ef33f123511ed91d1525400b8510a',
	674	'dataList': [
	675	{
	676	'name': '静安店',
	677	'id': 'bb4e8a7d620d11ebb06bb8599f4cafbe'
	678	},
	679	{
	680	'name': '合肥店',
	681	'id': '66c581244ebb11edbebb525400b8510a'
	682	},
	683	{
	684	'name': '芙艾美容',
	685	'id': '2baa4ed774f111ecb4d45254007749be'
	686	},
	687	{
	688	'name': '倾选店',
	689	'id': '2bab614774f111ecb4d45254007749be'
	690	},
	691	{
	692	'name': '九方店',
	693	'id': '2bac145474f111ecb4d45254007749be'
	694	},
	695	{
	696	'name': '新天地店',
	697	'id': '605e391b620d11ebb06bb8599f4cafbe'
	698	},
	699	{
	700	'name': '静安国际及VIP门诊',
	701	'id': '973f9b28620e11ebb06bb8599f4cafbe'
	702	},
	703	{
	704	'name': '艾选店',
	705	'id': '66cb53b84ebb11edbebb525400b8510a'
	706	},
	707	{
	708	'name': '北京光华店',
	709	'id': '66ca982f4ebb11edbebb525400b8510a'
	710	},
	711	{
	712	'name': '东银店',
	713	'id': 'b88e3cd8620d11ebb06bb8599f4cafbe'
	714	},
	715	{
	716	'name': '杭州店',
	717	'id': 'b96aa6d1620d11ebb06bb8599f4cafbe'
	718	},
	719	{
	720	'name': '宁波海曙店',
	721	'id': 'b9fbfd79620d11ebb06bb8599f4cafbe'
	722	},
	723	{
	724	'name': '芙艾总部',
	725	'id': 'd685ff306ca54b1ea06b707fb0f57659'
	726	},
	727	{
	728	'name': '营销助手功能测试门店',
	729	'id': 'd4b9ace5a01911ecb4d45254007749be'
	730	},
	731	{
	732	'name': '古北店',
	733	'id': 'fc9f34d2994711ecb4d45254007749be'
	734	}
	735	]
	736	},
	737	'shopList': [
	738	{
	739	'carWay': '',
	740	'clinicName': '',
	741	'code': '',
	742	'maxAppNum': 0,
	743	'city': '',
	744	'departmentId': '',
	745	'colorStr': '',
	746	'doctorRelaxTime': '',
	747	'editTime': {
	748	'date': 7,
	749	'hours': 16,
	750	'seconds': 10,
	751	'month': 0,
	752	'timezoneOffset': -480,
	753	'year': 123,
	754	'minutes': 55,
	755	'time': 1673081710058,
	756	'day': 6
	757	},
	758	'corpMpDepId': 0,
	759	'isUp': 0,
	760	'province': '',
	761	'subWay': '',
	762	'id': 'bb4e8a7d620d11ebb06bb8599f4cafbe',
	763	'addr': '',
	764	'institutionalCode': '',
	765	'apiId': '',
	766	'area': '',
	767	'sameTimeCustomerNum': 0,
	768	'shengMeiNum': 0,
	769	'workTime': '',
	770	'createTime': {
	771	'date': 7,
	772	'hours': 16,
	773	'seconds': 10,
	774	'month': 0,
	775	'timezoneOffset': -480,
	776	'year': 123,
	777	'minutes': 55,
	778	'time': 1673081710058,
	779	'day': 6
	780	},
	781	'maxSwitchNum': 0,
	782	'name': '静安店',
	783	'clinicCode': '',
	784	'isDel': 0
	785	}
	786	],
	787	'warehouseList': []
	788	}
	789	}
	790	}).then((inf) => {
	791	this.afterLogin(inf)
	792	}).catch((res) => {
	793	this.loading = false
	794	this.$messageError(res.msg)
	795	})
	796	},
	797
	798	noop() {}
	799	}
	800	}
	801	</script>
	802
	803	<style lang="scss">
	804	/* 修复input 背景不协调和光标变色 */
	805	/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
	806
	807	$bg:#283443;
	808	$light_gray:#fff;
	809	$gray_gray:#1B1E2F;
	810	$cursor: #fff;
	811
	812	@supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
	813	.login-container .el-input input {
	814	color: $cursor;
	815	}
	816	}
	817
	818	/* reset element-ui css */
	819	.login-container {
	820	.el-input {
	821	display: inline-block;
	822	height: 47px;
	823	width: 70%;
	824
	825	input {
	826	background: transparent;
	827	border: 0px;
	828	-webkit-appearance: none;
	829	border-radius: 0px;
	830	padding: 12px 5px 12px 15px;
	831	color: $gray_gray;
	832	height: 47px;
	833	caret-color: $gray_gray;
	834
	835	&:-webkit-autofill {
	836	box-shadow: 0 0 0px 1000px #f0f1f6 inset !important;
	837	-webkit-text-fill-color: $gray_gray !important;
	838	}
	839	}
	840
	841	}
	842
	843	.el-form-item {
	844	border: 1px solid #2B3855;
	845	// background: rgba(0, 0, 0, 0.1);
	846	background: transparent;
	847	border-radius: 22px;
	848	color: #2B3855;
	849	}
	850	}
	851	</style>
	852
	853	<style lang="scss" scoped>
	854	$bg:#2d3a4b;
	855	$dark_gray:#889aa4;
	856	$light_gray:#eee;
	857	$gray_gray:#2B3855;
	858
	859	.login-container {
	860	min-height: 100vh;
	861	width: 100vw;
	862	position: relative;
	863	overflow: hidden;
	864	background: url('../../assets/login/login_left.png') 0 0 repeat-y, url('../../assets/login/login_mid.png') 15.2% 50% no-repeat,url('../../assets/login/login_right.png') 18% 0 no-repeat;
	865	background-size: 15% auto, 15px auto, cover;
	866	background-attachment: fixed;
	867	.login-logo {
	868	width: 40px;
	869	height: 40px;
	870	}
	871
	872	.login-form {
	873	position: relative;
	874	width: 85%;
	875	max-width: 520px;
	876	padding: 30px 35px 130px;
	877	// padding: 160px 35px;
	878	// padding: 0 25px;
	879	margin: 0 auto;
	880	// margin-top: 18vh;
	881	// margin-left: 18%;
	882	overflow: hidden;
	883	}
	884
	885	.tips {
	886	font-size: 14px;
	887	color: #fff;
	888	margin-bottom: 10px;
	889
	890	span {
	891	&:first-of-type {
	892	margin-right: 16px;
	893	}
	894	}
	895	}
	896
	897	.svg-container {
	898	padding: 6px 5px 6px 15px;
	899	color: $dark_gray;
	900	vertical-align: middle;
	901	width: 30px;
	902	display: inline-block;
	903	}
	904
	905	.title-container {
	906	position: relative;
	907	margin-top: 100px;
	908	.title {
	909	font-size: 26px;
	910	color: $gray_gray;
	911	// margin: 0px auto 40px auto;
	912	text-align: left;
	913	font-weight: bold;
	914	}
	915	}
	916
	917	.show-pwd {
	918	position: absolute;
	919	right: 10px;
	920	top: 7px;
	921	font-size: 16px;
	922	color: $dark_gray;
	923	cursor: pointer;
	924	user-select: none;
	925	}
	926
	927	.safecode-img{
	928	width: 80px;
	929	height: 70%;
	930	position: absolute;
	931	right: 10px;
	932	top: 50%;
	933	transform: translateY(-50%);
	934	font-size: 30px;
	935	text-align: right;
	936	color: $light_gray;
	937	cursor: pointer;
	938	}
	939
	940	.thirdparty-button {
	941	position: absolute;
	942	right: 0;
	943	bottom: 6px;
	944	}
	945
	946	@media only screen and (max-width: 470px) {
	947	.thirdparty-button {
	948	display: none;
	949	}
	950	}
	951
	952	// 企业微信扫码登录
	953	#wx_reg{
	954	padding: 30px 0 0;
	955	border: 1px solid rgba(255, 255, 255, 0.1);
	956	background: rgba(0, 0, 0, 0.1);
	957	border-radius: 12px;
	958	margin-bottom: 30px;
	959	iframe{
	960	width: 300px;
	961	height: 300px;
	962	}
	963	}
	964	.role-list-title{
	965	color: $gray_gray;
	966	margin-bottom: 20px;
	967	text-align: center;
	968	font-size: 18px;
	969	font-weight: bold;
	970	letter-spacing: 1px;
	971	}
	972	.role-list{
	973	// margin-bottom: 20px;
	974
	975	.item{
	976	box-sizing: border-box;
	977	width: 47.5%;
	978	margin-right: 5%;
	979	padding: 10px 20px;
	980	border: 1px solid $gray_gray;
	981	background: transparent;
	982	border-radius: 12px;
	983	color: $gray_gray;
	984	margin-bottom: 5%;
	985	cursor: pointer;
	986	transition: background .1s ease;
	987	position: relative;
	988
	989	&:nth-child(2n){
	990	margin-right: 0;
	991	}
	992
	993	&:hover, &.active{
	994	background: rgba(43, 56, 85, 0.8);
	995	color: #fff;
	996	}
	997
	998	.el-icon-check{
	999	font-size: 24px;
	1000	font-weight: bold;
	1001	color: #99FFCC;
	1002	transition: opacity .1s ease;
	1003	opacity: 0;
	1004	position: absolute;
	1005	right: 10px;
	1006	bottom: 5px;
	1007	}
	1008
	1009	&.active .el-icon-check{
	1010	opacity: 1;
	1011	}
	1012	}
	1013
	1014	&.block-list .item{
	1015	margin-right: 0;
	1016	width: 100%;
	1017	}
	1018
	1019	.role-name{
	1020	font-size: 16px;
	1021	margin-bottom: 10px;
	1022	}
	1023
	1024	.shop-name{
	1025	font-size: 14px;
	1026	// color: #aaa;
	1027	}
	1028	}
	1029	}
	1030	</style>