Skip to content

9
91isoft_vue_manage
Commit 990a30d9 authored by 张毅辰's avatar 张毅辰
Browse files
Options

登录修改(验证码&加密)

parent 116932aa
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1459 additions and 77 deletions
package.json
View file @ 990a30d9
...@@ -33,7 +33,8 @@ ...@@ -33,7 +33,8 @@
"path-to-regexp": "2.4.0", "path-to-regexp": "2.4.0",
"qs": "^6.9.4", "qs": "^6.9.4",
"v-viewer": "^1.5.1", "v-viewer": "^1.5.1",
"vue": "2.6.10", "viewerjs": "^1.11.6",
"vue": "2.7.10",
"vue-cropper": "^0.5.4", "vue-cropper": "^0.5.4",
"vue-pdf": "^4.1.0", "vue-pdf": "^4.1.0",
"vue-router": "3.0.6", "vue-router": "3.0.6",
...@@ -66,7 +67,8 @@ ...@@ -66,7 +67,8 @@
"stylus-loader": "^3.0.2", "stylus-loader": "^3.0.2",
"svg-sprite-loader": "4.1.3", "svg-sprite-loader": "4.1.3",
"svgo": "1.2.2", "svgo": "1.2.2",
"vue-template-compiler": "2.6.10" "vue-template-compiler": "2.6.10",
"crypto-js": "4.1.1"
}, },
"engines": { "engines": {
"node": ">=8.9", "node": ">=8.9",
......
src/api/login.js
View file @ 990a30d9
import request from '@/utils/request' import request from '@/utils/request'
import { encrypt } from '@/utils/jsencrypt'
import Qs from 'qs'
// 登录方法 // 登录方法
export function login(username, password, code, uuid) { export function login(username, password, code, uuid) {
const data = { const data = {
username, username,
password password,
// code, code,
// uuid uuid
} }
console.log('加密前数据', data)
return request({ return request({
url: '/auth/login', url: '/auth/login',
method: 'post', method: 'post',
params: data, data: Qs.stringify({
sign: encrypt(data)
}),
headers: { headers: {
'Content-Type': 'application/x-www-form-urlencoded' 'Content-Type': 'application/x-www-form-urlencoded'
} }
...@@ -48,3 +53,29 @@ export function getCodeImg() { ...@@ -48,3 +53,29 @@ export function getCodeImg() {
method: 'get' method: 'get'
}) })
} }
// 获取验证码类型及验证内容
export function captchaImage() {
return request({
url: '/captcha/captchaImage',
method: 'get'
})
}
// 获取验证图片
export function reqGet(data) {
return request({
url: '/captcha/get',
method: 'post',
data
})
}
// 滑动或者点选验证
export function reqCheck(data) {
return request({
url: '/captcha/check',
method: 'post',
data
})
}
src/components/Verifition/Verify.vue 0 → 100644
View file @ 990a30d9
This diff is collapsed.
src/components/Verifition/Verify/VerifyPoints.vue 0 → 100644
View file @ 990a30d9
<template>
<div style="position: relative">
<div class="verify-img-out">
<div
class="verify-img-panel"
:style="{
width: setSize.imgWidth,
height: setSize.imgHeight,
'background-size': setSize.imgWidth + ' ' + setSize.imgHeight,
'margin-bottom': vSpace + 'px',
}"
>
<div
v-show="showRefresh"
class="verify-refresh"
style="z-index: 3"
@click="refresh"
>
<i class="iconfont icon-refresh" />
</div>
<img
ref="canvas"
:src="
pointBackImgBase
? 'data:image/png;base64,' + pointBackImgBase
: defaultImg
"
alt=""
style="width: 100%; height: 100%; display: block"
@click="bindingClick ? canvasClick($event) : undefined"
>
<div
v-for="(tempPoint, index) in tempPoints"
:key="index"
class="point-area"
:style="{
'background-color': '#1abd6c',
color: '#fff',
'z-index': 9999,
width: '20px',
height: '20px',
'text-align': 'center',
'line-height': '20px',
'border-radius': '50%',
position: 'absolute',
top: parseInt(tempPoint.y - 10) + 'px',
left: parseInt(tempPoint.x - 10) + 'px',
}"
>
{{ index + 1 }}
</div>
</div>
</div>
<!-- 'height': this.barSize.height, -->
<div
class="verify-bar-area"
:style="{
width: setSize.imgWidth,
color: this.barAreaColor,
'border-color': this.barAreaBorderColor,
'line-height': this.barSize.height,
}"
>
<span class="verify-msg">{{ text }}</span>
</div>
</div>
</template>
<script type="text/babel">
/**
* VerifyPoints
* @description 点选
* */
import {
resetSize,
_code_chars,
_code_color1,
_code_color2
} from './../utils/util'
import { aesEncrypt } from './../utils/ase'
import { reqGet, reqCheck } from '@/api/login'
export default {
name: 'VerifyPoints',
props: {
// 弹出式pop，固定fixed
mode: {
type: String,
default: 'fixed'
},
captchaType: {
type: String
},
// 间隔
vSpace: {
type: Number,
default: 5
},
imgSize: {
type: Object,
default() {
return {
width: '310px',
height: '155px'
}
}
},
barSize: {
type: Object,
default() {
return {
width: '310px',
height: '40px'
}
}
},
defaultImg: {
type: String,
default: ''
}
},
data() {
return {
secretKey: '', // 后端返回的ase加密秘钥
checkNum: 3, // 默认需要点击的字数
fontPos: [], // 选中的坐标信息
checkPosArr: [], // 用户点击的坐标
num: 1, // 点击的记数
pointBackImgBase: '', // 后端获取到的背景图片
poinTextList: [], // 后端返回的点击字体顺序
backToken: '', // 后端返回的token值
setSize: {
imgHeight: 0,
imgWidth: 0,
barHeight: 0,
barWidth: 0
},
tempPoints: [],
text: '',
barAreaColor: undefined,
barAreaBorderColor: undefined,
showRefresh: true,
bindingClick: true
}
},
computed: {
resetSize() {
return resetSize
}
},
watch: {
// type变化则全面刷新
type: {
immediate: true,
handler() {
this.init()
}
}
},
mounted() {
// 禁止拖拽
this.$el.onselectstart = function() {
return false
}
},
methods: {
init() {
// 加载页面
this.fontPos.splice(0, this.fontPos.length)
this.checkPosArr.splice(0, this.checkPosArr.length)
this.num = 1
this.getPictrue()
this.$nextTick(() => {
this.setSize = this.resetSize(this) // 重新设置宽度高度
this.$parent.$emit('ready', this)
})
},
canvasClick(e) {
this.checkPosArr.push(this.getMousePos(this.$refs.canvas, e))
if (this.num == this.checkNum) {
this.num = this.createPoint(this.getMousePos(this.$refs.canvas, e))
// 按比例转换坐标值
this.checkPosArr = this.pointTransfrom(this.checkPosArr, this.setSize)
// 等创建坐标执行完
setTimeout(() => {
// var flag = this.comparePos(this.fontPos, this.checkPosArr);
// 发送后端请求
var captchaVerification = this.secretKey
? aesEncrypt(
this.backToken + '---' + JSON.stringify(this.checkPosArr),
this.secretKey
)
: this.backToken + '---' + JSON.stringify(this.checkPosArr)
const data = {
captchaType: this.captchaType,
pointJson: this.secretKey
? aesEncrypt(JSON.stringify(this.checkPosArr), this.secretKey)
: JSON.stringify(this.checkPosArr),
token: this.backToken
}
console.log('captchaType', this.captchaType)
console.log('secretKey', this.secretKey)
console.log('token', this.backToken)
console.log('大概是滑动数据(加密后 pointJson)', this.checkPosArr)
console.log('加密前JSON', JSON.stringify(this.checkPosArr))
reqCheck(data).then((res) => {
if (res.repCode == '0000') {
this.barAreaColor = '#4cae4c'
this.barAreaBorderColor = '#5cb85c'
this.text = '验证成功'
this.bindingClick = false
if (this.mode == 'pop') {
setTimeout(() => {
this.$parent.clickShow = false
this.refresh()
}, 1500)
}
this.$parent.$emit('success', { captchaVerification })
} else {
this.$parent.$emit('error', this)
this.barAreaColor = '#d9534f'
this.barAreaBorderColor = '#d9534f'
this.text = '验证失败'
setTimeout(() => {
this.refresh()
}, 700)
}
})
}, 400)
}
if (this.num < this.checkNum) {
this.num = this.createPoint(this.getMousePos(this.$refs.canvas, e))
}
},
// 获取坐标
getMousePos: function(obj, e) {
var x = e.offsetX
var y = e.offsetY
return { x, y }
},
// 创建坐标点
createPoint: function(pos) {
this.tempPoints.push(Object.assign({}, pos))
return ++this.num
},
refresh: function() {
this.tempPoints.splice(0, this.tempPoints.length)
this.barAreaColor = '#000'
this.barAreaBorderColor = '#ddd'
this.bindingClick = true
this.fontPos.splice(0, this.fontPos.length)
this.checkPosArr.splice(0, this.checkPosArr.length)
this.num = 1
this.getPictrue()
this.text = '验证失败'
this.showRefresh = true
},
// 请求背景图片和验证图片
getPictrue() {
const data = {
captchaType: this.captchaType,
clientUid: localStorage.getItem('point'),
ts: Date.now() // 现在的时间戳
}
reqGet(data).then((res) => {
if (res.repCode == '0000') {
this.pointBackImgBase = res.repData.originalImageBase64
this.backToken = res.repData.token
this.secretKey = res.repData.secretKey
this.poinTextList = res.repData.wordList
this.text = '请依次点击【' + this.poinTextList.join(',') + '】'
} else {
this.text = res.repMsg
}
// 判断接口请求次数是否失效
if (res.repCode == '6201') {
this.pointBackImgBase = null
}
})
},
// 坐标转换函数
pointTransfrom(pointArr, imgSize) {
var newPointArr = pointArr.map((p) => {
const x = Math.round((310 * p.x) / parseInt(imgSize.imgWidth))
const y = Math.round((155 * p.y) / parseInt(imgSize.imgHeight))
return { x, y }
})
return newPointArr
}
}
}
</script>
src/components/Verifition/Verify/VerifySlide.vue 0 → 100644
View file @ 990a30d9
This diff is collapsed.
src/components/Verifition/api/index.js 0 → 100644
View file @ 990a30d9
import request from '@/utils/request'
src/components/Verifition/utils/ase.js 0 → 100644
View file @ 990a30d9
import CryptoJS from 'crypto-js'
/**
* @word 要加密的内容
* @keyWord String 服务器随机返回的关键字
* */
export function aesEncrypt(word, keyWord = "XwKsGlMcdPMEhR1B") {
var key = CryptoJS.enc.Utf8.parse(keyWord);
var srcs = CryptoJS.enc.Utf8.parse(word);
var encrypted = CryptoJS.AES.encrypt(srcs, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 });
return encrypted.toString();
}
src/components/Verifition/utils/util.js 0 → 100644
View file @ 990a30d9
export function resetSize(vm) {
var img_width, img_height, bar_width, bar_height; //图片的宽度、高度，移动条的宽度、高度
var parentWidth = vm.$el.parentNode.offsetWidth || window.offsetWidth
var parentHeight = vm.$el.parentNode.offsetHeight || window.offsetHeight
if (vm.imgSize.width.indexOf('%') != -1) {
img_width = parseInt(this.imgSize.width) / 100 * parentWidth + 'px'
} else {
img_width = this.imgSize.width;
}
if (vm.imgSize.height.indexOf('%') != -1) {
img_height = parseInt(this.imgSize.height) / 100 * parentHeight + 'px'
} else {
img_height = this.imgSize.height
}
if (vm.barSize.width.indexOf('%') != -1) {
bar_width = parseInt(this.barSize.width) / 100 * parentWidth + 'px'
} else {
bar_width = this.barSize.width
}
if (vm.barSize.height.indexOf('%') != -1) {
bar_height = parseInt(this.barSize.height) / 100 * parentHeight + 'px'
} else {
bar_height = this.barSize.height
}
return { imgWidth: img_width, imgHeight: img_height, barWidth: bar_width, barHeight: bar_height }
}
export const _code_chars = [1, 2, 3, 4, 5, 6, 7, 8, 9, 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
export const _code_color1 = ['#fffff0', '#f0ffff', '#f0fff0', '#fff0f0']
export const _code_color2 = ['#FF0033', '#006699', '#993366', '#FF9900', '#66CC66', '#FF33CC']
\ No newline at end of file
src/store/modules/user.js
View file @ 990a30d9
...@@ -40,10 +40,10 @@ const user = { ...@@ -40,10 +40,10 @@ const user = {
Login({ commit }, userInfo) { Login({ commit }, userInfo) {
const username = userInfo.username.trim() const username = userInfo.username.trim()
const password = userInfo.password const password = userInfo.password
// const code = userInfo.code const code = userInfo.code
// const uuid = userInfo.uuid const uuid = userInfo.uuid
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
login(username, password).then(res => { login(username, password, code, uuid).then(res => {
setToken(res.data) setToken(res.data)
commit('SET_TOKEN', res.data) commit('SET_TOKEN', res.data)
resolve() resolve()
......
src/utils/jsencrypt.js
View file @ 990a30d9
...@@ -2,10 +2,31 @@ import JSEncrypt from 'jsencrypt/bin/jsencrypt' ...@@ -2,10 +2,31 @@ import JSEncrypt from 'jsencrypt/bin/jsencrypt'
// 密钥对生成 http://web.chacuo.net/netrsakeypair // 密钥对生成 http://web.chacuo.net/netrsakeypair
const publicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBANL378k3RiZHWx5AfJqdH9xRNBmD9wGD\n' + const publicKey = 'MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAu6EsPHTuCzwyZ7D0/OhW\n' +
'QDQdB9tByC0vDnb7k7gmT0h77/mmJYcwvuqUdj+PXKO+V1NlJJqlf61UjcQkWD9o\n' +
'K6M1MHLHlS1qWXeXGaETClNUXAhdw2IkdBouXSHxyDkXYIDINYlOd91chxEBuBac\n' +
'igJI0c5p9BA62QcOKDUE2mDJL+LOd70NCYsJf3um1IAgfKDX8RH2H3aPxy/BJ8aS\n' +
'Edu+M9YDWsF6VFpaBr/WPPdouuPPjfs5203PCbvp0pvco+05JNDSiurEFcL+VDMm\n' +
'wFNKExmeCvn/zr+UIkRPWHwxfJq+/gw/lt+UzBO2NURhCv4pQZy19vdFLLLeMM09\n' +
'ewIDAQAB'
export function encrypt(data) {
const json = JSON.stringify(data)
const encryptor = new JSEncrypt()
encryptor.setPublicKey(publicKey)
return encryptor.encrypt(json)
}
export function decrypt(txt) {
const encryptor = new JSEncrypt()
encryptor.setPrivateKey('')
return encryptor.decrypt(txt)
}
const passwordPublicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBANL378k3RiZHWx5AfJqdH9xRNBmD9wGD\n' +
'2iRe41HdTNF8RUhNnHit5NpMNtGL0NPTSSpPjjI1kJfVorRvaQerUgkCAwEAAQ==' '2iRe41HdTNF8RUhNnHit5NpMNtGL0NPTSSpPjjI1kJfVorRvaQerUgkCAwEAAQ=='
const privateKey = 'MIIBUwIBADANBgkqhkiG9w0BAQEFAASCAT0wggE5AgEAAkEA0vfvyTdGJkdbHkB8\n' + const passwordPrivateKey = 'MIIBUwIBADANBgkqhkiG9w0BAQEFAASCAT0wggE5AgEAAkEA0vfvyTdGJkdbHkB8\n' +
'mp0f3FE0GYP3AYPaJF7jUd1M0XxFSE2ceK3k2kw20YvQ09NJKk+OMjWQl9WitG9p\n' + 'mp0f3FE0GYP3AYPaJF7jUd1M0XxFSE2ceK3k2kw20YvQ09NJKk+OMjWQl9WitG9p\n' +
'B6tSCQIDAQABAkA2SimBrWC2/wvauBuYqjCFwLvYiRYqZKThUS3MZlebXJiLB+Ue\n' + 'B6tSCQIDAQABAkA2SimBrWC2/wvauBuYqjCFwLvYiRYqZKThUS3MZlebXJiLB+Ue\n' +
'/gUifAAKIg1avttUZsHBHrop4qfJCwAI0+YRAiEA+W3NK/RaXtnRqmoUUkb59zsZ\n' + '/gUifAAKIg1avttUZsHBHrop4qfJCwAI0+YRAiEA+W3NK/RaXtnRqmoUUkb59zsZ\n' +
...@@ -15,16 +36,16 @@ const privateKey = 'MIIBUwIBADANBgkqhkiG9w0BAQEFAASCAT0wggE5AgEAAkEA0vfvyTdGJkdb ...@@ -15,16 +36,16 @@ const privateKey = 'MIIBUwIBADANBgkqhkiG9w0BAQEFAASCAT0wggE5AgEAAkEA0vfvyTdGJkdb
'tTbklZkD2A==' 'tTbklZkD2A=='
// 加密 // 加密
export function encrypt(txt) { export function passwordEncrypt(txt) {
const encryptor = new JSEncrypt() const encryptor = new JSEncrypt()
encryptor.setPublicKey(publicKey) // 设置公钥 encryptor.setPublicKey(passwordPublicKey) // 设置公钥
return encryptor.encrypt(txt) // 对需要加密的数据进行加密 return encryptor.encrypt(txt) // 对需要加密的数据进行加密
} }
// 解密 // 解密
export function decrypt(txt) { export function passwordDecrypt(txt) {
const encryptor = new JSEncrypt() const encryptor = new JSEncrypt()
encryptor.setPrivateKey(privateKey) encryptor.setPrivateKey(passwordPrivateKey)
return encryptor.decrypt(txt) return encryptor.decrypt(txt)
} }
src/views/login/login.vue
View file @ 990a30d9
<template> <template>
<div class="login"> <div class="login">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form"> <el-form ref="loginForm" :model="loginForm" :rules="rules" class="login-form" v-loading="vLoading">
<!-- <img class="fy-logo" src="../../assets/image/denglu_logo.png">--> <!-- <img class="fy-logo" src="../../assets/image/denglu_logo.png">-->
<h3 class="title">信息化管理系统</h3> <h3 class="title">信息化管理系统</h3>
<div class="login-form-content"> <div class="login-form-content">
<el-form-item prop="username"> <el-form-item prop="username">
...@@ -15,25 +15,33 @@ ...@@ -15,25 +15,33 @@
type="password" type="password"
auto-complete="off" auto-complete="off"
placeholder="密码" placeholder="密码"
@keyup.enter.native="handleLogin" @keypress.enter.native="handleLogin"
> >
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
</el-input> </el-input>
</el-form-item> </el-form-item>
<!-- <el-form-item prop="code">--> <el-form-item v-if="captchaType === 'MATH' || captchaType === 'CHAR'" prop="code">
<!-- <el-input--> <el-input
<!-- v-model="loginForm.code"--> v-model="loginForm.code"
<!-- auto-complete="off"--> auto-complete="off"
<!-- placeholder="验证码"--> placeholder="验证码"
<!-- style="width: 63%"--> style="width: 63%"
<!-- @keyup.enter.native="handleLogin"--> @keypress.enter.native="handleLogin"
<!-- >--> >
<!-- <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />--> <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
<!-- </el-input>--> </el-input>
<!-- &lt;!&ndash;<div class="login-code">--> <div class="login-code">
<!-- <img :src="codeUrl" @click="getCode">--> <img :src="codeUrl" @click="getCode">
<!-- </div>&ndash;&gt;--> </div>
<!-- </el-form-item>--> </el-form-item>
<Verify
v-if="captchaType === 'BLOCK' || captchaType === 'WORD'"
ref="verify"
:mode="'pop'"
:captcha-type="captchaType"
:img-size="{ width: '330px', height: '155px' }"
@success="capctchaCheckSuccess"
/>
<el-form-item style="width:80%;margin-bottom: 20px"> <el-form-item style="width:80%;margin-bottom: 20px">
<el-button <el-button
class="blue-btn" class="blue-btn"
...@@ -50,12 +58,12 @@ ...@@ -50,12 +58,12 @@
class="login_buttons-content" class="login_buttons-content"
> >
<el-checkbox v-model="loginForm.rememberMe" class="rem-code">记住密码</el-checkbox> <el-checkbox v-model="loginForm.rememberMe" class="rem-code">记住密码</el-checkbox>
<!-- <el-link--> <!-- <el-link-->
<!-- :underline="false"--> <!-- :underline="false"-->
<!-- @click="goDetail('/forgetPwd')"--> <!-- @click="goDetail('/forgetPwd')"-->
<!-- >--> <!-- >-->
<!-- <router-link to="/forgetPwd">忘记密码</router-link>--> <!-- <router-link to="/forgetPwd">忘记密码</router-link>-->
<!-- </el-link>--> <!-- </el-link>-->
</div> </div>
</div> </div>
</el-form> </el-form>
...@@ -65,12 +73,14 @@ ...@@ -65,12 +73,14 @@
</template> </template>
<script> <script>
// import { getCodeImg } from '@/api/login' import { getCodeImg, captchaImage } from '@/api/login'
import Cookies from 'js-cookie' import Cookies from 'js-cookie'
import { encrypt, decrypt } from '@/utils/jsencrypt' import { passwordEncrypt, passwordDecrypt } from '@/utils/jsencrypt'
import Verify from '@/components/Verifition/Verify'
export default { export default {
name: 'Login', name: 'Login',
components: { Verify },
data() { data() {
return { return {
reLocation: '', reLocation: '',
...@@ -83,20 +93,22 @@ export default { ...@@ -83,20 +93,22 @@ export default {
code: '', code: '',
uuid: '' uuid: ''
}, },
loginRules: { rules: {
username: [ username: [
{ required: true, trigger: 'blur', message: '用户名不能为空' } { required: true, trigger: 'blur', message: '用户名不能为空' }
], ],
password: [ password: [
{ required: true, trigger: 'blur', message: '密码不能为空' } { required: true, trigger: 'blur', message: '密码不能为空' }
]/*, ]
code: [{ required: true, trigger: "change", message: "验证码不能为空" }]*/
}, },
loading: false loading: false,
vLoading: true,
// NUll: 无验证码, MATH: 数字验证码, CHAR: 文本验证码, BLOCK: 滑块验证码, WORD: 文字验证码
captchaType: 'NULL'
} }
}, },
created() { created() {
// this.getCode() this.getCode()
this.getCookie() this.getCookie()
}, },
methods: { methods: {
...@@ -106,48 +118,81 @@ export default { ...@@ -106,48 +118,81 @@ export default {
query: this.$route.query query: this.$route.query
}) })
}, },
/* getCode() { getCode() {
getCodeImg().then(res => { captchaImage().then(res => {
this.codeUrl = 'data:image/gif;base64,' + res.img const { captchaType, img, uuid } = res.data
this.loginForm.uuid = res.uuid switch (captchaType) {
case 'NUll':
break
case 'MATH':
this.codeUrl = 'data:image/gif;base64,' + img
this.loginForm.uuid = uuid
this.rules.code = [
{ required: true, trigger: 'change', message: '验证码不能为空' }
]
break
case 'CHAR':
this.codeUrl = 'data:image/gif;base64,' + img
this.loginForm.uuid = uuid
this.rules.code = [
{ required: true, trigger: 'change', message: '验证码不能为空' }
]
break
case 'BLOCK':
break
case 'WORD':
break
}
this.vLoading = false
this.captchaType = captchaType
}) })
},*/ },
getCookie() { getCookie() {
const username = Cookies.get('username') const username = Cookies.get('username')
const password = Cookies.get('password') const password = Cookies.get('password')
const rememberMe = Cookies.get('rememberMe') const rememberMe = Cookies.get('rememberMe')
this.loginForm = { this.loginForm = {
username: username === undefined ? this.loginForm.username : username, username: username === undefined ? this.loginForm.username : username,
password: password === undefined ? this.loginForm.password : decrypt(password), password: password === undefined ? this.loginForm.password : passwordDecrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe) rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
} }
}, },
capctchaCheckSuccess(params) {
this.loginForm.code = params.captchaVerification
this.rememberMe()
this.successLogin()
},
handleLogin() { handleLogin() {
this.$refs.loginForm.validate(valid => { this.$refs.loginForm.validate(valid => {
if (valid) { if (valid) {
this.loading = true this.rememberMe()
if (this.loginForm.rememberMe) { this.successLogin()
Cookies.set('username', this.loginForm.username, { expires: 30 }) }
Cookies.set('password', encrypt(this.loginForm.password), { expires: 30 }) })
Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 }) },
} else { rememberMe() {
Cookies.remove('username') if (this.loginForm.rememberMe) {
Cookies.remove('password') Cookies.set('username', this.loginForm.username, { expires: 30 })
Cookies.remove('rememberMe') Cookies.set('password', passwordEncrypt(this.loginForm.password), { expires: 30 })
} Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 })
this.$store } else {
.dispatch('Login', this.loginForm) Cookies.remove('username')
.then(() => { Cookies.remove('password')
// window.location.href = `${this.reLocation}/#/` Cookies.remove('rememberMe')
// this.$router.push({ path: `http://main.court.com${this.redirect || "/"}` }); }
this.loading = false },
// this.$router.push('/welcome') successLogin() {
this.$router.push('/controlPlatform/control') this.loading = true
}) this.$store.dispatch('Login', this.loginForm).then(() => {
.catch(() => { // window.location.href = `${this.reLocation}/#/`
this.loading = false // this.$router.push({ path: `http://main.court.com${this.redirect || "/"}` });
// this.getCode() // this.$router.push('/welcome')
}) this.$router.push('/controlPlatform/control')
this.loading = false
}).catch(() => {
this.loading = false
if (this.captchaType === 'MATH' || this.captchaType === 'CHAR') {
this.getCode()
} }
}) })
} }
......
vue.config.js
View file @ 990a30d9
...@@ -19,7 +19,7 @@ const name = defaultSettings.title || 'vue Admin Template' // page title ...@@ -19,7 +19,7 @@ const name = defaultSettings.title || 'vue Admin Template' // page title
// For example, Mac: sudo npm run // For example, Mac: sudo npm run
// You can change the port by the following methods: // You can change the port by the following methods:
// port = 9528 npm run dev OR npm run dev --port = 9528 // port = 9528 npm run dev OR npm run dev --port = 9528
const port = process.env.port || process.env.npm_config_port || 9706 // dev port const port = process.env.port || process.env.npm_config_port || 8080 // dev port
// All configuration item explanations can be find in https://cli.vuejs.org/config/ // All configuration item explanations can be find in https://cli.vuejs.org/config/
module.exports = { module.exports = {
...@@ -43,8 +43,9 @@ module.exports = { ...@@ -43,8 +43,9 @@ module.exports = {
lintOnSave: process.env.NODE_ENV === 'development', lintOnSave: process.env.NODE_ENV === 'development',
productionSourceMap: false, productionSourceMap: false,
devServer: { devServer: {
// port: port, host: '0.0.0.0',
// open: true, port: port,
open: false,
// overlay: { // overlay: {
// warnings: false, // warnings: false,
// errors: true // errors: true
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment