|
|
@@ -1,108 +1,101 @@
|
|
|
<template xmlns="">
|
|
|
<div>
|
|
|
<top-menu :methodType="1"></top-menu>
|
|
|
- <div style="overflow: auto; height: 92vh">
|
|
|
- <div class="container" style="position: relative">
|
|
|
+ <div>
|
|
|
+ <div class="container">
|
|
|
<!-- <div class="logo"></div> -->
|
|
|
<div class="processPic">
|
|
|
<img
|
|
|
- src="../assets/images/process.gif"
|
|
|
- style="width: 100%; height: 100%"
|
|
|
+ src="../assets/images/process.gif"
|
|
|
+ style="width: 100%; height: 100%"
|
|
|
/>
|
|
|
</div>
|
|
|
-
|
|
|
- <!-- 登录区域 -->
|
|
|
- <!-- <div class="content" style="margin-top: 1%; margin-left: 4%"></div> -->
|
|
|
- <div class="content" style="margin-left: 4%; z-index: 1">
|
|
|
- <div class="loginLeft">
|
|
|
- <div style="width: 100%; height: 100%">
|
|
|
- <h1 style="font-size: 32px; text-align: center; margin: 0 auto">
|
|
|
- 扫码登录
|
|
|
- </h1>
|
|
|
- <div style="width: 70%; height: 70%; margin: 15px auto 0 auto">
|
|
|
- <img
|
|
|
+ <!-- 登录区域 -->
|
|
|
+ <!-- <div class="content" style="margin-top: 1%; margin-left: 4%"></div> -->
|
|
|
+ <div class="content" style="margin-left: 6%; z-index: 1">
|
|
|
+ <div class="loginLeft">
|
|
|
+ <div style="width: 100%; height: 100%">
|
|
|
+ <h1 style="font-size: 32px; text-align: center; margin: 0 auto">
|
|
|
+ 扫码登录
|
|
|
+ </h1>
|
|
|
+ <div style="width: 70%; height: 70%; margin: 15px auto 0 auto">
|
|
|
+ <img
|
|
|
:src="imgData"
|
|
|
style="width: 100%; height: 100%"
|
|
|
@click="reflushFlag && reflushErWei()"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div
|
|
|
- style="
|
|
|
- width: 100%;
|
|
|
- height: 25%;
|
|
|
- text-align: center;
|
|
|
- margin-top: 10px;
|
|
|
- "
|
|
|
- >
|
|
|
- <p style="margin-bottom: 0px">
|
|
|
- 请使用"会助理"小程序扫描二维码进入平台
|
|
|
- </p>
|
|
|
- <p style="margin-bottom: 0px">
|
|
|
- 二维码剩余有效时间:
|
|
|
- <span style="color: red">{{ effectiveTime }}</span> s
|
|
|
- </p>
|
|
|
- <!-- <el-button @click="testLogin">测试登录</el-button> -->
|
|
|
- </div>
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div style="width: 100%;height: 25%;text-align: center;margin-top: 10px;">
|
|
|
+ <p style="margin-bottom: 0px">
|
|
|
+ 请使用"会助理"小程序扫描二维码进入平台
|
|
|
+ </p>
|
|
|
+ <p style="margin-bottom: 0px">
|
|
|
+ 二维码剩余有效时间:
|
|
|
+ <span style="color: red">{{ effectiveTime }}</span> s
|
|
|
+ </p>
|
|
|
+ <!-- <el-button @click="testLogin">测试登录</el-button> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="loginRight">
|
|
|
- <div style="width: 60%; height: 100%; margin: 40px auto">
|
|
|
- <h1 style="font-size: 32px; text-align: center; margin: 0 auto">
|
|
|
- 手机号登录
|
|
|
- </h1>
|
|
|
- <el-form
|
|
|
+ </div>
|
|
|
+ <div class="loginRight">
|
|
|
+ <div style="width: 80%; height: 100%; margin: 70px auto">
|
|
|
+ <h1 style="font-size: 32px; text-align: center; margin: 0 auto">
|
|
|
+ 手机号登录
|
|
|
+ </h1>
|
|
|
+ <el-form
|
|
|
ref="loginForm"
|
|
|
:model="loginForm"
|
|
|
:rules="LoginRules"
|
|
|
style="margin-left: 10px; margin-top: 20px"
|
|
|
- >
|
|
|
- <!-- 账号密码登录 -->
|
|
|
- <div v-if="loginForm.loginType === 'uname'">
|
|
|
- <el-form-item prop="mobile">
|
|
|
- <el-input
|
|
|
+ >
|
|
|
+ <!-- 账号密码登录 -->
|
|
|
+ <div v-if="loginForm.loginType === 'uname'">
|
|
|
+ <el-form-item prop="mobile">
|
|
|
+ <el-input
|
|
|
v-model="loginForm.mobile"
|
|
|
type="text"
|
|
|
auto-complete="off"
|
|
|
placeholder="请输入手机号"
|
|
|
@blur="moblieBlur()"
|
|
|
+ resize="vertical"
|
|
|
oninput="if(value.length>11)value=value.slice(0,11)"
|
|
|
- >
|
|
|
- <svg-icon
|
|
|
+ >
|
|
|
+ <svg-icon
|
|
|
slot="prefix"
|
|
|
icon-class="phone"
|
|
|
class="el-input__icon input-icon"
|
|
|
- />
|
|
|
- </el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="password">
|
|
|
- <el-input
|
|
|
+ />
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="password">
|
|
|
+ <el-input
|
|
|
v-model="loginForm.password"
|
|
|
type="password"
|
|
|
auto-complete="off"
|
|
|
placeholder="请输入密码"
|
|
|
@keyup.enter.native="getCode"
|
|
|
- >
|
|
|
- <svg-icon
|
|
|
+ >
|
|
|
+ <svg-icon
|
|
|
slot="prefix"
|
|
|
icon-class="password"
|
|
|
class="el-input__icon input-icon"
|
|
|
- />
|
|
|
- </el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="tenantName" v-if="tenantEnable">
|
|
|
- <el-select
|
|
|
+ />
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="tenantName" v-if="tenantEnable">
|
|
|
+ <el-select
|
|
|
v-model="loginForm.tenantName"
|
|
|
placeholder="请选择机构名称"
|
|
|
- >
|
|
|
- <el-option
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
v-for="item in options"
|
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <!-- <el-select
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <!-- <el-select
|
|
|
v-model="loginForm.tenantName"
|
|
|
filterable
|
|
|
remote
|
|
|
@@ -124,94 +117,96 @@
|
|
|
class="el-input__icon input-icon"
|
|
|
/>
|
|
|
</el-select> -->
|
|
|
- <!-- <el-input v-model="loginForm.tenantName" type="text" auto-complete="off" placeholder="请输入机构名称">
|
|
|
+ <!-- <el-input v-model="loginForm.tenantName" type="text" auto-complete="off" placeholder="请输入机构名称">
|
|
|
<svg-icon slot="prefix" icon-class="tree" class="el-input__icon input-icon" />
|
|
|
</el-input> -->
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="verifyInCode">
|
|
|
- <el-input
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="verifyInCode">
|
|
|
+ <el-input
|
|
|
v-model="loginForm.verifyInCode"
|
|
|
type="text"
|
|
|
auto-complete="off"
|
|
|
placeholder="请输入验证码"
|
|
|
style="width: 60%"
|
|
|
@keyup.enter.native="getCode"
|
|
|
- >
|
|
|
- <svg-icon
|
|
|
+ >
|
|
|
+ <svg-icon
|
|
|
slot="prefix"
|
|
|
icon-class="question"
|
|
|
class="el-input__icon input-icon"
|
|
|
- />
|
|
|
- </el-input>
|
|
|
- <img
|
|
|
+ />
|
|
|
+ </el-input>
|
|
|
+ <img
|
|
|
:src="verifyCode"
|
|
|
style="width: 40%"
|
|
|
@click="refreshVerifyCode()"
|
|
|
alt="验证码"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </div>
|
|
|
- <!-- 下方的登录按钮 -->
|
|
|
- <el-form-item style="width: 100%; margin-top: 10px">
|
|
|
- <el-button
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <!-- 下方的登录按钮 -->
|
|
|
+ <el-form-item style="width: 100%; margin-top: 10px">
|
|
|
+ <el-button
|
|
|
:loading="loading"
|
|
|
size="medium"
|
|
|
type="primary"
|
|
|
- style="width: 100%"
|
|
|
+ style="width: 100%;height: 60px"
|
|
|
@click.native.prevent="getCode"
|
|
|
- >
|
|
|
- <span v-if="!loading">登 录</span>
|
|
|
- <span v-else>登 录 中...</span>
|
|
|
- </el-button>
|
|
|
- </el-form-item>
|
|
|
- <el-checkbox
|
|
|
+ >
|
|
|
+ <span v-if="!loading" style="font-size: 24px">登 录</span>
|
|
|
+ <span v-else>登 录 中...</span>
|
|
|
+ </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <el-checkbox
|
|
|
v-model="loginForm.rememberMe"
|
|
|
style="float: right; right: 0px; color: #999999"
|
|
|
- >记住密码
|
|
|
- </el-checkbox>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
+ >记住密码
|
|
|
+ </el-checkbox
|
|
|
+ >
|
|
|
+ </el-form>
|
|
|
</div>
|
|
|
- <!-- 注册 -->
|
|
|
- <!-- <div class="rightUp">
|
|
|
+ </div>
|
|
|
+ <!-- 注册 -->
|
|
|
+ <!-- <div class="rightUp">
|
|
|
<img
|
|
|
src="../assets/images/upRight1.png"
|
|
|
style="width: 100%; height: 100%"
|
|
|
/>
|
|
|
</div> -->
|
|
|
- </div>
|
|
|
- <div class="loginTitle">
|
|
|
- <span class="loginTitleStr"
|
|
|
- >赋 予 装 备 智 慧 动 能 · 构 建 场 景 数 字 脉 络</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- <!-- 图形验证码 -->
|
|
|
- <Verify
|
|
|
+ </div>
|
|
|
+ <div class="loginTitle">
|
|
|
+ <span class="loginTitleStr">赋 予 装 备 智 慧 动 能 · 构 建 场 景 数 字 脉 络</span>
|
|
|
+ </div>
|
|
|
+ <!-- 图形验证码 -->
|
|
|
+ <Verify
|
|
|
ref="verify"
|
|
|
:captcha-type="'blockPuzzle'"
|
|
|
:img-size="{ width: '400px', height: '200px' }"
|
|
|
@success="handleLogin"
|
|
|
- />
|
|
|
- </div>
|
|
|
+ />
|
|
|
|
|
|
- <!-- footer class="footer"-->
|
|
|
- <div style="margin-top: 50px; text-align: center; font-size: 20px">
|
|
|
- <div style="margin: 10px 0">
|
|
|
- <a style="margin: 0 15px">会山科技</a> |
|
|
|
- <a style="margin: 0 15px">版权所有</a> |
|
|
|
- <a style="margin: 0 15px">市场合作</a> |
|
|
|
- <a style="margin: 0 15px">关于会助理</a> |
|
|
|
- <a style="margin: 0 15px">使用协议</a> |
|
|
|
- <a style="margin: 0 15px">隐私条款</a>
|
|
|
- </div>
|
|
|
- <div style="margin: 10px 0">
|
|
|
- {{ version }} <span style="margin-left: 30px">开发者：会山科技</span>
|
|
|
- </div>
|
|
|
- <div style="margin: 10px 0">沪 I C P 备 1 9 0 0 7 0 6 1 号 - 1</div>
|
|
|
- Copyright © 2023-2024 willalp.com All Rights Reserved.
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- footer class="footer"-->
|
|
|
+ <div style="margin-top: 50px;text-align: center;font-size: 20px">
|
|
|
+ <div style="margin: 10px 0">
|
|
|
+ <a style="margin: 0 15px">会山科技</a> |
|
|
|
+ <a style="margin: 0 15px">版权所有</a> |
|
|
|
+ <a style="margin: 0 15px">市场合作</a> |
|
|
|
+ <a style="margin: 0 15px">关于会助理</a> |
|
|
|
+ <a style="margin: 0 15px">使用协议</a> |
|
|
|
+ <a style="margin: 0 15px">隐私条款</a>
|
|
|
</div>
|
|
|
+ <div style="margin: 10px 0">
|
|
|
+ {{ version }} <span style="margin-left: 30px">开发者：会山科技</span>
|
|
|
+ </div>
|
|
|
+ <div style="margin: 10px 0">
|
|
|
+ 沪 I C P 备 1 9 0 0 7 0 6 1 号 - 1
|
|
|
+ </div>
|
|
|
+ Copyright © 2023-2024 willalp.com All Rights Reserved.
|
|
|
</div>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -257,39 +252,39 @@ import { resetUserPwd, getUsernameByMobile } from "@/api/system/user";
|
|
|
import topMenu from "./components/login/topMenu.vue";
|
|
|
|
|
|
export default {
|
|
|
- name: "Login",
|
|
|
+ name: 'Login',
|
|
|
components: {
|
|
|
Verify,
|
|
|
topMenu,
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- version: "会助理平台 v2.0.2 版",
|
|
|
+ version: '会助理平台 v2.0.2 版',
|
|
|
options: [],
|
|
|
states: [],
|
|
|
list: [],
|
|
|
loadingTenant: false,
|
|
|
- verifyKey: "",
|
|
|
- verifyCode: "",
|
|
|
+ verifyKey: '',
|
|
|
+ verifyCode: '',
|
|
|
reflushFlag: false,
|
|
|
- qrcodeId: "",
|
|
|
+ qrcodeId: '',
|
|
|
effectiveTime: 0,
|
|
|
imgData: null,
|
|
|
loginT: 1,
|
|
|
- codeUrl: "",
|
|
|
+ codeUrl: '',
|
|
|
captchaEnable: true,
|
|
|
tenantEnable: true,
|
|
|
mobileCodeTimer: 0,
|
|
|
loginForm: {
|
|
|
- loginType: "uname",
|
|
|
- mobile: "",
|
|
|
- password: "",
|
|
|
- captchaVerification: "",
|
|
|
- mobile: "",
|
|
|
- mobileCode: "",
|
|
|
+ loginType: 'uname',
|
|
|
+ mobile: '',
|
|
|
+ password: '',
|
|
|
+ captchaVerification: '',
|
|
|
+ mobile: '',
|
|
|
+ mobileCode: '',
|
|
|
rememberMe: false,
|
|
|
- tenantName: "",
|
|
|
- timer: null,
|
|
|
+ tenantName: '',
|
|
|
+ timer: null
|
|
|
},
|
|
|
scene: 21,
|
|
|
|
|
|
@@ -298,342 +293,343 @@ export default {
|
|
|
// { required: true, trigger: "blur", message: "用户名不能为空" },
|
|
|
// ],
|
|
|
verifyInCode: [
|
|
|
- { required: true, trigger: "blur", message: "验证码不能为空" },
|
|
|
+ { required: true, trigger: 'blur', message: '验证码不能为空' }
|
|
|
],
|
|
|
password: [
|
|
|
- { required: true, trigger: "blur", message: "密码不能为空" },
|
|
|
+ { required: true, trigger: 'blur', message: '密码不能为空' }
|
|
|
],
|
|
|
mobile: [
|
|
|
- { required: true, trigger: "blur", message: "手机号不能为空" },
|
|
|
- { min: 11, max: 11, message: "请输入11位手机号码", trigger: "blur" },
|
|
|
+ { required: true, trigger: 'blur', message: '手机号不能为空' },
|
|
|
+ { min: 11, max: 11, message: '请输入11位手机号码', trigger: 'blur' },
|
|
|
{
|
|
|
- validator: function (rule, value, callback) {
|
|
|
+ validator: function(rule, value, callback) {
|
|
|
if (/^1(2|3|4|5|7|8|9)\d{9}$/.test(value) === false) {
|
|
|
- callback(new Error("手机号格式错误"));
|
|
|
+ callback(new Error('手机号格式错误'))
|
|
|
} else {
|
|
|
- callback();
|
|
|
+ callback()
|
|
|
}
|
|
|
},
|
|
|
- trigger: "blur",
|
|
|
- },
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
],
|
|
|
tenantName: [
|
|
|
- { required: true, trigger: "blur", message: "机构不能为空" },
|
|
|
+ { required: true, trigger: 'blur', message: '机构不能为空' },
|
|
|
{
|
|
|
validator: (rule, value, callback) => {
|
|
|
// debugger
|
|
|
getTenantIdByName(value).then((res) => {
|
|
|
- const tenantId = res.data;
|
|
|
+ const tenantId = res.data
|
|
|
if (tenantId && tenantId >= 0) {
|
|
|
// 设置机构
|
|
|
- setTenantId(tenantId);
|
|
|
- callback();
|
|
|
+ setTenantId(tenantId)
|
|
|
+ callback()
|
|
|
} else {
|
|
|
- callback("机构不存在");
|
|
|
+ callback('机构不存在')
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
},
|
|
|
- trigger: "blur",
|
|
|
- },
|
|
|
- ],
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
},
|
|
|
loading: false,
|
|
|
redirect: undefined,
|
|
|
// 枚举
|
|
|
- SysUserSocialTypeEnum: SystemUserSocialTypeEnum,
|
|
|
- };
|
|
|
+ SysUserSocialTypeEnum: SystemUserSocialTypeEnum
|
|
|
+ }
|
|
|
},
|
|
|
beforeCreate() {
|
|
|
- sessionStorage.clear();
|
|
|
+ sessionStorage.clear()
|
|
|
},
|
|
|
created() {
|
|
|
getVerify().then((res) => {
|
|
|
- this.verifyCode = res.captchaImg;
|
|
|
- this.verifyKey = res.captchaKey;
|
|
|
- });
|
|
|
+ this.verifyCode = res.captchaImg
|
|
|
+ this.verifyKey = res.captchaKey
|
|
|
+ })
|
|
|
// 机构开关
|
|
|
- this.tenantEnable = getTenantEnable();
|
|
|
+ this.tenantEnable = getTenantEnable()
|
|
|
if (this.tenantEnable) {
|
|
|
getTenantIdByName(this.loginForm.tenantName).then((res) => {
|
|
|
// 设置机构
|
|
|
- const tenantId = res.data;
|
|
|
+ const tenantId = res.data
|
|
|
if (tenantId && tenantId >= 0) {
|
|
|
- setTenantId(tenantId);
|
|
|
+ setTenantId(tenantId)
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
// 验证码开关
|
|
|
- this.captchaEnable = getCaptchaEnable();
|
|
|
+ this.captchaEnable = getCaptchaEnable()
|
|
|
// 重定向地址
|
|
|
this.redirect = this.$route.query.redirect
|
|
|
- ? decodeURIComponent(this.$route.query.redirect)
|
|
|
- : undefined;
|
|
|
- this.getCookie();
|
|
|
- this.generateErWeima();
|
|
|
+ ? decodeURIComponent(this.$route.query.redirect)
|
|
|
+ : undefined
|
|
|
+ this.getCookie()
|
|
|
+ this.generateErWeima()
|
|
|
},
|
|
|
methods: {
|
|
|
moblieBlur() {
|
|
|
getAllTenantListByPhone(this.loginForm.mobile).then((response) => {
|
|
|
- this.states = response.data;
|
|
|
+ this.states = response.data
|
|
|
this.list = this.states.map((item) => {
|
|
|
return {
|
|
|
value: `${item.name}`,
|
|
|
- label: `${item.name}`,
|
|
|
- };
|
|
|
- });
|
|
|
- this.options = this.list;
|
|
|
+ label: `${item.name}`
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.options = this.list
|
|
|
// this.loginForm.tenantName = this.list[0].value;
|
|
|
- this.$set(this.loginForm, "tenantName", this.list[0].value);
|
|
|
- });
|
|
|
+ this.$set(this.loginForm, 'tenantName', this.list[0].value)
|
|
|
+ })
|
|
|
},
|
|
|
/** 机构输入搜索 */
|
|
|
remoteMethod(query) {
|
|
|
getAllTenantListByPhone(this.loginForm.mobile).then((response) => {
|
|
|
- this.states = response.data;
|
|
|
+ this.states = response.data
|
|
|
this.list = this.states.map((item) => {
|
|
|
return {
|
|
|
value: `${item.name}`,
|
|
|
- label: `${item.name}`,
|
|
|
- };
|
|
|
- });
|
|
|
- });
|
|
|
- if (query !== "") {
|
|
|
- this.loadingTenant = true;
|
|
|
+ label: `${item.name}`
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ if (query !== '') {
|
|
|
+ this.loadingTenant = true
|
|
|
setTimeout(() => {
|
|
|
- this.loadingTenant = false;
|
|
|
+ this.loadingTenant = false
|
|
|
this.options = this.list.filter((item) => {
|
|
|
- return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
|
|
|
- });
|
|
|
- }, 200);
|
|
|
+ return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1
|
|
|
+ })
|
|
|
+ }, 200)
|
|
|
} else {
|
|
|
- this.options = [];
|
|
|
+ this.options = []
|
|
|
}
|
|
|
},
|
|
|
refreshVerifyCode() {
|
|
|
getVerify().then((res) => {
|
|
|
- this.verifyCode = res.captchaImg;
|
|
|
- this.verifyKey = res.captchaKey;
|
|
|
- });
|
|
|
+ this.verifyCode = res.captchaImg
|
|
|
+ this.verifyKey = res.captchaKey
|
|
|
+ })
|
|
|
},
|
|
|
testLogin() {
|
|
|
var testForm = {
|
|
|
- code: "0f1Qg62w3EKP313My74w3sHBVk1Qg62q",
|
|
|
+ code: '0f1Qg62w3EKP313My74w3sHBVk1Qg62q',
|
|
|
loginType: 0,
|
|
|
- mobile: "15612345678",
|
|
|
- password: "admin123",
|
|
|
+ mobile: '15612345678',
|
|
|
+ password: 'admin123',
|
|
|
tenantId: 1,
|
|
|
- qrcode: this.qrcodeId,
|
|
|
- };
|
|
|
+ qrcode: this.qrcodeId
|
|
|
+ }
|
|
|
loginScan(testForm).then((res) => {
|
|
|
- console.log(res.data);
|
|
|
- });
|
|
|
+ console.log(res.data)
|
|
|
+ })
|
|
|
},
|
|
|
reflushErWei() {
|
|
|
- this.generateErWeima();
|
|
|
+ this.generateErWeima()
|
|
|
},
|
|
|
generateErWeima() {
|
|
|
getQrcodeId().then((res) => {
|
|
|
- this.qrcodeId = res.data;
|
|
|
+ this.qrcodeId = res.data
|
|
|
createLoginQrcode(this.qrcodeId).then((res) => {
|
|
|
let blob = new Blob([res], {
|
|
|
- type: "image/png",
|
|
|
- });
|
|
|
- let url = window.URL.createObjectURL(blob);
|
|
|
+ type: 'image/png'
|
|
|
+ })
|
|
|
+ let url = window.URL.createObjectURL(blob)
|
|
|
// 将图片转换成img标签可以识别的url
|
|
|
- this.imgData = url;
|
|
|
+ this.imgData = url
|
|
|
//开始倒计时
|
|
|
- this.effectiveTime = 120;
|
|
|
+ this.effectiveTime = 120
|
|
|
this.timer = setInterval(() => {
|
|
|
if (this.effectiveTime > 0) {
|
|
|
//检查扫码登录状态
|
|
|
checkScanStatus(this.qrcodeId).then((res) => {
|
|
|
- let scanState = res.data;
|
|
|
+ let scanState = res.data
|
|
|
if (scanState == null) {
|
|
|
- this.imgData = require("../assets/images/reflushErWei.png");
|
|
|
- this.reflushFlag = true;
|
|
|
- clearInterval(this.timer);
|
|
|
- this.$modal.msgError("二维码已过期，请刷新二维码后重试");
|
|
|
- return;
|
|
|
- } else if (scanState == "yesLogin") {
|
|
|
+ this.imgData = require('../assets/images/reflushErWei.png')
|
|
|
+ this.reflushFlag = true
|
|
|
+ clearInterval(this.timer)
|
|
|
+ this.$modal.msgError('二维码已过期，请刷新二维码后重试')
|
|
|
+ return
|
|
|
+ } else if (scanState == 'yesLogin') {
|
|
|
//获取登录信息信息后跳转页面
|
|
|
loginScanResult(this.qrcodeId)
|
|
|
- .then((res) => {
|
|
|
- const data = res.data;
|
|
|
- localStorage.clear();
|
|
|
- localStorage.setItem("ACCESS_TOKEN", data.accessToken);
|
|
|
- localStorage.setItem("REFRESH_TOKEN", data.refreshToken);
|
|
|
- localStorage.setItem("USER_ID", data.userId);
|
|
|
- localStorage.setItem("EXPIRES_TIME", data.expiresTime);
|
|
|
- this.$router.push({ path: "/" });
|
|
|
- this.effectiveTime = 0;
|
|
|
- clearInterval(this.timer);
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- this.loading = false;
|
|
|
- });
|
|
|
+ .then((res) => {
|
|
|
+ const data = res.data
|
|
|
+ localStorage.clear()
|
|
|
+ localStorage.setItem('ACCESS_TOKEN', data.accessToken)
|
|
|
+ localStorage.setItem('REFRESH_TOKEN', data.refreshToken)
|
|
|
+ localStorage.setItem('USER_ID', data.userId)
|
|
|
+ localStorage.setItem('EXPIRES_TIME', data.expiresTime)
|
|
|
+ this.$router.push({ path: '/' })
|
|
|
+ this.effectiveTime = 0
|
|
|
+ clearInterval(this.timer)
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
|
|
|
- this.effectiveTime--;
|
|
|
+ this.effectiveTime--
|
|
|
} else {
|
|
|
- clearInterval(this.timer);
|
|
|
- this.imgData = require("../assets/images/reflushErWei.png");
|
|
|
- this.reflushFlag = true;
|
|
|
+ clearInterval(this.timer)
|
|
|
+ this.imgData = require('../assets/images/reflushErWei.png')
|
|
|
+ this.reflushFlag = true
|
|
|
}
|
|
|
- }, 1000);
|
|
|
- });
|
|
|
- });
|
|
|
+ }, 1000)
|
|
|
+ })
|
|
|
+ })
|
|
|
},
|
|
|
getCode() {
|
|
|
// 情况一，未开启：则直接登录
|
|
|
if (!this.captchaEnable) {
|
|
|
- this.handleLogin({});
|
|
|
- return;
|
|
|
+ this.handleLogin({})
|
|
|
+ return
|
|
|
}
|
|
|
|
|
|
// 情况二，已开启：则展示验证码；只有完成验证码的情况，才进行登录
|
|
|
// 弹出验证码
|
|
|
- this.$refs.verify.show();
|
|
|
+ this.$refs.verify.show()
|
|
|
},
|
|
|
getCookie() {
|
|
|
- const username = getUsername();
|
|
|
- const password = getPassword();
|
|
|
- const rememberMe = getRememberMe();
|
|
|
- const tenantName = getTenantName();
|
|
|
- const mobile = getMobile();
|
|
|
+ const username = getUsername()
|
|
|
+ const password = getPassword()
|
|
|
+ const rememberMe = getRememberMe()
|
|
|
+ const tenantName = getTenantName()
|
|
|
+ const mobile = getMobile()
|
|
|
this.loginForm = {
|
|
|
...this.loginForm,
|
|
|
- username: username ? username : "",
|
|
|
+ username: username ? username : '',
|
|
|
mobile: mobile ? mobile : this.loginForm.mobile,
|
|
|
password: password ? password : this.loginForm.password,
|
|
|
rememberMe: rememberMe ? getRememberMe() : false,
|
|
|
- tenantName: tenantName ? tenantName : this.loginForm.tenantName,
|
|
|
- };
|
|
|
+ tenantName: tenantName ? tenantName : this.loginForm.tenantName
|
|
|
+ }
|
|
|
},
|
|
|
handleLogin(captchaParams) {
|
|
|
this.$refs.loginForm.validate((valid) => {
|
|
|
if (valid) {
|
|
|
- this.loading = true;
|
|
|
+ this.loading = true
|
|
|
// 设置 Cookie
|
|
|
if (this.loginForm.rememberMe) {
|
|
|
getUsernameByMobile(this.loginForm.mobile).then((res) => {
|
|
|
if (res.data != null) {
|
|
|
- setUsername(res.data.username);
|
|
|
+ setUsername(res.data.username)
|
|
|
}
|
|
|
- });
|
|
|
- setMobile(this.loginForm.mobile);
|
|
|
- setPassword(this.loginForm.password);
|
|
|
- setRememberMe(this.loginForm.rememberMe);
|
|
|
- setTenantName(this.loginForm.tenantName);
|
|
|
+ })
|
|
|
+ setMobile(this.loginForm.mobile)
|
|
|
+ setPassword(this.loginForm.password)
|
|
|
+ setRememberMe(this.loginForm.rememberMe)
|
|
|
+ setTenantName(this.loginForm.tenantName)
|
|
|
// setVerifyInCode(this.loginForm.verifyInCode);
|
|
|
// setCaptchaKey(this.captchaKey);
|
|
|
} else {
|
|
|
- removeUsername();
|
|
|
- removePassword();
|
|
|
- removeRememberMe();
|
|
|
- removeTenantName();
|
|
|
+ removeUsername()
|
|
|
+ removePassword()
|
|
|
+ removeRememberMe()
|
|
|
+ removeTenantName()
|
|
|
}
|
|
|
- this.loginForm.captchaKey = this.verifyKey;
|
|
|
+ this.loginForm.captchaKey = this.verifyKey
|
|
|
this.loginForm.captchaVerification =
|
|
|
- captchaParams.captchaVerification;
|
|
|
+ captchaParams.captchaVerification
|
|
|
this.$store
|
|
|
- .dispatch(
|
|
|
- this.loginForm.loginType === "sms" ? "SmsLogin" : "Login",
|
|
|
- this.loginForm
|
|
|
- )
|
|
|
- .then(() => {
|
|
|
- this.$router.push({ path: this.redirect || "/navigation" }).catch(() => {});
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- console.log("登陆失败！！！！！！！！！！！");
|
|
|
- this.refreshVerifyCode();
|
|
|
- this.loading = false;
|
|
|
- });
|
|
|
+ .dispatch(
|
|
|
+ this.loginForm.loginType === 'sms' ? 'SmsLogin' : 'Login',
|
|
|
+ this.loginForm
|
|
|
+ )
|
|
|
+ .then(() => {
|
|
|
+ this.$router.push({ path: this.redirect || '/' }).catch(() => {
|
|
|
+ })
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ console.log('登陆失败！！！！！！！！！！！')
|
|
|
+ this.refreshVerifyCode()
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
},
|
|
|
async doSocialLogin(socialTypeEnum) {
|
|
|
// 设置登录中
|
|
|
- this.loading = true;
|
|
|
- let tenant = false;
|
|
|
+ this.loading = true
|
|
|
+ let tenant = false
|
|
|
if (this.tenantEnable) {
|
|
|
- await this.$prompt("请输入机构名称", "提示", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
+ await this.$prompt('请输入机构名称', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消'
|
|
|
})
|
|
|
- .then(async ({ value }) => {
|
|
|
- await getTenantIdByName(value).then((res) => {
|
|
|
- const tenantId = res.data;
|
|
|
- tenant = true;
|
|
|
- if (tenantId && tenantId >= 0) {
|
|
|
- setTenantId(tenantId);
|
|
|
- }
|
|
|
- });
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- // 取消登录按钮 loading状态
|
|
|
- this.loading = false;
|
|
|
+ .then(async({ value }) => {
|
|
|
+ await getTenantIdByName(value).then((res) => {
|
|
|
+ const tenantId = res.data
|
|
|
+ tenant = true
|
|
|
+ if (tenantId && tenantId >= 0) {
|
|
|
+ setTenantId(tenantId)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ // 取消登录按钮 loading状态
|
|
|
+ this.loading = false
|
|
|
|
|
|
- return false;
|
|
|
- });
|
|
|
+ return false
|
|
|
+ })
|
|
|
} else {
|
|
|
- tenant = true;
|
|
|
+ tenant = true
|
|
|
}
|
|
|
if (tenant) {
|
|
|
// 计算 redirectUri
|
|
|
const redirectUri =
|
|
|
- location.origin +
|
|
|
- "/social-login?" +
|
|
|
- encodeURIComponent(
|
|
|
- "type=" +
|
|
|
- socialTypeEnum.type +
|
|
|
- "&redirect=" +
|
|
|
- (this.redirect || "/")
|
|
|
- ); // 重定向不能丢
|
|
|
+ location.origin +
|
|
|
+ '/social-login?' +
|
|
|
+ encodeURIComponent(
|
|
|
+ 'type=' +
|
|
|
+ socialTypeEnum.type +
|
|
|
+ '&redirect=' +
|
|
|
+ (this.redirect || '/')
|
|
|
+ ) // 重定向不能丢
|
|
|
// const redirectUri = 'http://127.0.0.1:48080/api/gitee/callback';
|
|
|
// const redirectUri = 'http://127.0.0.1:48080/api/dingtalk/callback';
|
|
|
// 进行跳转
|
|
|
socialAuthRedirect(
|
|
|
- socialTypeEnum.type,
|
|
|
- encodeURIComponent(redirectUri)
|
|
|
+ socialTypeEnum.type,
|
|
|
+ encodeURIComponent(redirectUri)
|
|
|
).then((res) => {
|
|
|
// console.log(res.url);
|
|
|
- window.location.href = res.data;
|
|
|
- });
|
|
|
+ window.location.href = res.data
|
|
|
+ })
|
|
|
}
|
|
|
},
|
|
|
/** ========== 以下为升级短信登录 ========== */
|
|
|
getSmsCode() {
|
|
|
- if (this.mobileCodeTimer > 0) return;
|
|
|
+ if (this.mobileCodeTimer > 0) return
|
|
|
this.$refs.loginForm.validate((valid) => {
|
|
|
- if (!valid) return;
|
|
|
+ if (!valid) return
|
|
|
sendSmsCode(
|
|
|
- this.loginForm.mobile,
|
|
|
- this.scene,
|
|
|
- this.loginForm.uuid,
|
|
|
- this.loginForm.code
|
|
|
+ this.loginForm.mobile,
|
|
|
+ this.scene,
|
|
|
+ this.loginForm.uuid,
|
|
|
+ this.loginForm.code
|
|
|
).then((res) => {
|
|
|
- this.$modal.msgSuccess("获取验证码成功");
|
|
|
- this.mobileCodeTimer = 60;
|
|
|
+ this.$modal.msgSuccess('获取验证码成功')
|
|
|
+ this.mobileCodeTimer = 60
|
|
|
let msgTimer = setInterval(() => {
|
|
|
- this.mobileCodeTimer = this.mobileCodeTimer - 1;
|
|
|
+ this.mobileCodeTimer = this.mobileCodeTimer - 1
|
|
|
if (this.mobileCodeTimer <= 0) {
|
|
|
- clearInterval(msgTimer);
|
|
|
+ clearInterval(msgTimer)
|
|
|
}
|
|
|
- }, 1000);
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
+ }, 1000)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
@import "~@/assets/styles/login.scss";
|
|
|
|
|
|
-.el-form-item {
|
|
|
- margin-bottom: 20px !important;
|
|
|
-}
|
|
|
+//.el-form-item {
|
|
|
+// margin-bottom: 20px !important;
|
|
|
+//}
|
|
|
|
|
|
.loginTitle {
|
|
|
position: absolute;
|
|
|
@@ -646,8 +642,8 @@ export default {
|
|
|
position: absolute;
|
|
|
color: #4588f6;
|
|
|
font-size: 28px;
|
|
|
- bottom: 7%;
|
|
|
- right: 11%;
|
|
|
+ bottom: 12%;
|
|
|
+ right: 13%;
|
|
|
}
|
|
|
|
|
|
::v-deep .el-input__inner {
|
|
|
@@ -680,19 +676,17 @@ export default {
|
|
|
}
|
|
|
|
|
|
.loginRight {
|
|
|
- width: 52%;
|
|
|
- height: 96%;
|
|
|
+ width: 50%;
|
|
|
+ height: 100%;
|
|
|
margin: 1% 0;
|
|
|
float: left;
|
|
|
// z-index: 1;
|
|
|
}
|
|
|
|
|
|
.processPic {
|
|
|
- // margin-top: 1%;
|
|
|
+ //margin-top: 1%;
|
|
|
// margin-left: 3%;
|
|
|
- width: 32%;
|
|
|
- height: 70%;
|
|
|
- position: relative;
|
|
|
+ width: 35%;
|
|
|
}
|
|
|
|
|
|
.oauth-login {
|
