|
|
@@ -1,10 +1,10 @@
|
|
|
<template>
|
|
|
<div class="login-container">
|
|
|
<div class="login-form-main">
|
|
|
- <img src="@/assets/sheji/loginlan.png" alt="">
|
|
|
+ <img src="@/assets/sheji/loginlan.png" alt="" />
|
|
|
<div class="main-title">
|
|
|
<h1>欢迎登录</h1>
|
|
|
- <h3>采销365</h3>
|
|
|
+ <h3>采销bate 3.0公测版</h3>
|
|
|
</div>
|
|
|
<el-form
|
|
|
ref="loginForm"
|
|
|
@@ -16,7 +16,7 @@
|
|
|
>
|
|
|
<div class="title-container">
|
|
|
<h3 class="title">
|
|
|
- 采销365
|
|
|
+ 采销bate 3.0公测版
|
|
|
<div style="font-size: 20px; margin-top: 5px">{{ ver }}</div>
|
|
|
</h3>
|
|
|
</div>
|
|
|
@@ -94,7 +94,8 @@
|
|
|
type="primary"
|
|
|
style="width: 100%; margin-top: 5px"
|
|
|
@click.native.prevent="handleLogin()"
|
|
|
- >登 录</el-button>
|
|
|
+ >登 录</el-button
|
|
|
+ >
|
|
|
|
|
|
<!-- <div style="position: relative; padding: 12px 0 0 0"> -->
|
|
|
<!-- <div class="tips" style="float: left">
|
|
|
@@ -126,237 +127,237 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { isnumber, isAlphanumeric, validAlphabets, isMobile } from '@/utils/validate'
|
|
|
-import asyncRequest from '@/apis/service/user'
|
|
|
-import Identify from '@/components/identify'
|
|
|
-import urlConfig from '@/apis/url-config'
|
|
|
-import resToken from '@/mixins/resToken'
|
|
|
+import { isnumber, isAlphanumeric, validAlphabets, isMobile } from "@/utils/validate";
|
|
|
+import asyncRequest from "@/apis/service/user";
|
|
|
+import Identify from "@/components/identify";
|
|
|
+import urlConfig from "@/apis/url-config";
|
|
|
+import resToken from "@/mixins/resToken";
|
|
|
|
|
|
export default {
|
|
|
- name: 'Login',
|
|
|
+ name: "Login",
|
|
|
components: { Identify },
|
|
|
mixins: [resToken],
|
|
|
data() {
|
|
|
const validateUsername = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('手机号不能为空！'))
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("手机号不能为空！"));
|
|
|
} else {
|
|
|
if (!isMobile(value)) {
|
|
|
- callback(new Error('请输入正确的手机号'))
|
|
|
+ callback(new Error("请输入正确的手机号"));
|
|
|
} else {
|
|
|
- callback()
|
|
|
+ callback();
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
+ };
|
|
|
const validatePassword = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('密码不能为空！'))
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("密码不能为空！"));
|
|
|
} else {
|
|
|
if (!isAlphanumeric(value)) {
|
|
|
- callback(new Error('密码为6-18位数字字母组合！'))
|
|
|
+ callback(new Error("密码为6-18位数字字母组合！"));
|
|
|
} else if (value.length < 6 || value.length > 18) {
|
|
|
- callback(new Error('密码为6-18位数字字母组合！'))
|
|
|
+ callback(new Error("密码为6-18位数字字母组合！"));
|
|
|
} else if (isnumber(value)) {
|
|
|
- callback(new Error('密码不能为纯数字！'))
|
|
|
+ callback(new Error("密码不能为纯数字！"));
|
|
|
} else if (validAlphabets(value)) {
|
|
|
- callback(new Error('密码不能为纯字母！'))
|
|
|
+ callback(new Error("密码不能为纯字母！"));
|
|
|
} else {
|
|
|
- callback()
|
|
|
+ callback();
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
+ };
|
|
|
|
|
|
const validateCode = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('验证码不能为空!'))
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("验证码不能为空!"));
|
|
|
} else {
|
|
|
if (value !== this.identifyCode) {
|
|
|
- callback(new Error('请输入正确的验证码'))
|
|
|
+ callback(new Error("请输入正确的验证码"));
|
|
|
} else {
|
|
|
- callback()
|
|
|
+ callback();
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
+ };
|
|
|
|
|
|
return {
|
|
|
- ver: '',
|
|
|
+ ver: "",
|
|
|
show: false,
|
|
|
loginTitle: urlConfig.loginTitle,
|
|
|
loginBeian: urlConfig.loginBeian,
|
|
|
loginBeianUrl: urlConfig.loginBeianUrl,
|
|
|
loginForm: {
|
|
|
- username: '',
|
|
|
- password: '',
|
|
|
- code: ''
|
|
|
+ username: "",
|
|
|
+ password: "",
|
|
|
+ code: "",
|
|
|
},
|
|
|
loginRules: {
|
|
|
- username: [{ required: true, trigger: 'blur', validator: validateUsername }],
|
|
|
- password: [{ required: true, trigger: 'blur', validator: validatePassword }],
|
|
|
- code: [{ required: true, trigger: 'blur', validator: validateCode }]
|
|
|
+ username: [{ required: true, trigger: "blur", validator: validateUsername }],
|
|
|
+ password: [{ required: true, trigger: "blur", validator: validatePassword }],
|
|
|
+ code: [{ required: true, trigger: "blur", validator: validateCode }],
|
|
|
},
|
|
|
- identifyCode: '',
|
|
|
+ identifyCode: "",
|
|
|
identifyCodes: [
|
|
|
- '0',
|
|
|
- '1',
|
|
|
- '2',
|
|
|
- '3',
|
|
|
- '4',
|
|
|
- '5',
|
|
|
- '6',
|
|
|
- '7',
|
|
|
- '8',
|
|
|
- '9',
|
|
|
- 'a',
|
|
|
- 'b',
|
|
|
- 'c',
|
|
|
- 'd'
|
|
|
+ "0",
|
|
|
+ "1",
|
|
|
+ "2",
|
|
|
+ "3",
|
|
|
+ "4",
|
|
|
+ "5",
|
|
|
+ "6",
|
|
|
+ "7",
|
|
|
+ "8",
|
|
|
+ "9",
|
|
|
+ // 'a',
|
|
|
+ // 'b',
|
|
|
+ // 'c',
|
|
|
+ // 'd'
|
|
|
],
|
|
|
- passwordType: 'password',
|
|
|
+ passwordType: "password",
|
|
|
capsTooltip: false,
|
|
|
loading: false,
|
|
|
showDialog: false,
|
|
|
redirect: undefined,
|
|
|
- otherQuery: {}
|
|
|
- }
|
|
|
+ otherQuery: {},
|
|
|
+ };
|
|
|
},
|
|
|
watch: {
|
|
|
$route: {
|
|
|
- handler: function(route) {
|
|
|
- const query = route.query
|
|
|
+ handler: function (route) {
|
|
|
+ const query = route.query;
|
|
|
if (query) {
|
|
|
- this.redirect = query.redirect
|
|
|
- this.otherQuery = this.getOtherQuery(query)
|
|
|
+ this.redirect = query.redirect;
|
|
|
+ this.otherQuery = this.getOtherQuery(query);
|
|
|
}
|
|
|
},
|
|
|
- immediate: true
|
|
|
- }
|
|
|
+ immediate: true,
|
|
|
+ },
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.refreshCode()
|
|
|
- this.bindEnterEvent()
|
|
|
+ this.refreshCode();
|
|
|
+ this.bindEnterEvent();
|
|
|
// this.getversion();
|
|
|
- if (this.loginForm.username === '') {
|
|
|
- this.$refs.username.focus()
|
|
|
- } else if (this.loginForm.password === '') {
|
|
|
- this.$refs.password.focus()
|
|
|
+ if (this.loginForm.username === "") {
|
|
|
+ this.$refs.username.focus();
|
|
|
+ } else if (this.loginForm.password === "") {
|
|
|
+ this.$refs.password.focus();
|
|
|
}
|
|
|
},
|
|
|
beforeDestroy() {
|
|
|
- this.removeEnterEvent()
|
|
|
+ this.removeEnterEvent();
|
|
|
},
|
|
|
methods: {
|
|
|
bindEnterEvent() {
|
|
|
- window.addEventListener('keydown', this.listener)
|
|
|
+ window.addEventListener("keydown", this.listener);
|
|
|
},
|
|
|
removeEnterEvent() {
|
|
|
- window.removeEventListener('keydown', this.listener)
|
|
|
+ window.removeEventListener("keydown", this.listener);
|
|
|
},
|
|
|
listener(e) {
|
|
|
- e.keyCode === 13 && this.handleLogin()
|
|
|
+ e.keyCode === 13 && this.handleLogin();
|
|
|
},
|
|
|
async getversion() {
|
|
|
- const { code, data } = await asyncRequest.version({})
|
|
|
+ const { code, data } = await asyncRequest.version({});
|
|
|
if (code === 0) {
|
|
|
- const { version } = data
|
|
|
- this.ver = version
|
|
|
+ const { version } = data;
|
|
|
+ this.ver = version;
|
|
|
} else {
|
|
|
- this.ver = ''
|
|
|
+ this.ver = "";
|
|
|
}
|
|
|
},
|
|
|
setVisible(val) {
|
|
|
- this.show = val
|
|
|
+ this.show = val;
|
|
|
},
|
|
|
handleClick() {
|
|
|
- this.show = true
|
|
|
+ this.show = true;
|
|
|
},
|
|
|
handleSuccess() {
|
|
|
- this.show = false
|
|
|
- this.handleLogin()
|
|
|
+ this.show = false;
|
|
|
+ this.handleLogin();
|
|
|
},
|
|
|
checkCapslock(e) {
|
|
|
- const { key } = e
|
|
|
- this.capsTooltip = key && key.length === 1 && key >= 'A' && key <= 'Z'
|
|
|
+ const { key } = e;
|
|
|
+ this.capsTooltip = key && key.length === 1 && key >= "A" && key <= "Z";
|
|
|
},
|
|
|
showPwd() {
|
|
|
- if (this.passwordType === 'password') {
|
|
|
- this.passwordType = ''
|
|
|
+ if (this.passwordType === "password") {
|
|
|
+ this.passwordType = "";
|
|
|
} else {
|
|
|
- this.passwordType = 'password'
|
|
|
+ this.passwordType = "password";
|
|
|
}
|
|
|
this.$nextTick(() => {
|
|
|
- this.$refs.password.focus()
|
|
|
- })
|
|
|
+ this.$refs.password.focus();
|
|
|
+ });
|
|
|
},
|
|
|
// 生成随机数
|
|
|
randomNum(min, max) {
|
|
|
- max = max + 1
|
|
|
- return Math.floor(Math.random() * (max - min) + min)
|
|
|
+ max = max + 1;
|
|
|
+ return Math.floor(Math.random() * (max - min) + min);
|
|
|
},
|
|
|
// 更新验证码
|
|
|
refreshCode() {
|
|
|
- this.identifyCode = ''
|
|
|
- this.makeCode(this.identifyCodes, 4)
|
|
|
+ this.identifyCode = "";
|
|
|
+ this.makeCode(this.identifyCodes, 4);
|
|
|
},
|
|
|
makeCode(data, len) {
|
|
|
for (let i = 0; i < len; i++) {
|
|
|
this.identifyCode += this.identifyCodes[
|
|
|
this.randomNum(0, this.identifyCodes.length - 1)
|
|
|
- ]
|
|
|
+ ];
|
|
|
}
|
|
|
},
|
|
|
handleLogin() {
|
|
|
this.$refs.loginForm.validate((valid) => {
|
|
|
if (valid) {
|
|
|
- this.loading = true
|
|
|
+ this.loading = true;
|
|
|
this.$store
|
|
|
- .dispatch('user/login', this.loginForm)
|
|
|
+ .dispatch("user/login", this.loginForm)
|
|
|
.then((res) => {
|
|
|
- console.log(res)
|
|
|
+ console.log(res);
|
|
|
if (res.code === 0) {
|
|
|
- this.getMenu()
|
|
|
+ this.getMenu();
|
|
|
} else {
|
|
|
- this.$message.warning(res.message)
|
|
|
- this.loading = false
|
|
|
+ this.$message.warning(res.message);
|
|
|
+ this.loading = false;
|
|
|
}
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
- console.log(err)
|
|
|
- this.loading = false
|
|
|
- })
|
|
|
+ console.log(err);
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
} else {
|
|
|
- console.log('error submit!!')
|
|
|
- return false
|
|
|
+ console.log("error submit!!");
|
|
|
+ return false;
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
},
|
|
|
getMenu() {
|
|
|
this.$store
|
|
|
- .dispatch('user/getMenuList', this)
|
|
|
+ .dispatch("user/getMenuList", this)
|
|
|
.then((res) => {
|
|
|
window.vm.$router.push({
|
|
|
path: this.redirect
|
|
|
? this.redirect
|
|
|
- : res === 'success-dataV'
|
|
|
- ? '/bigScreen/datavScr'
|
|
|
- : '/welcome/dashboard/',
|
|
|
- query: this.otherQuery
|
|
|
- })
|
|
|
- this.loading = false
|
|
|
+ : res === "success-dataV"
|
|
|
+ ? "/bigScreen/datavScr"
|
|
|
+ : "/welcome/dashboard/",
|
|
|
+ query: this.otherQuery,
|
|
|
+ });
|
|
|
+ this.loading = false;
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
- this.loading = false
|
|
|
- })
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
},
|
|
|
getOtherQuery(query) {
|
|
|
return Object.keys(query).reduce((acc, cur) => {
|
|
|
- if (cur !== 'redirect') {
|
|
|
- acc[cur] = query[cur]
|
|
|
+ if (cur !== "redirect") {
|
|
|
+ acc[cur] = query[cur];
|
|
|
}
|
|
|
- return acc
|
|
|
- }, {})
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ return acc;
|
|
|
+ }, {});
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
