Jeecg-Boot 2.1.4 版本发布 | 重构较大,较多新功能

This commit is contained in:
zhangdaiscott
2020-02-24 02:44:53 +08:00
parent f342b18ddf
commit 9d8c7da31f
269 changed files with 15734 additions and 24855 deletions

View File

@ -1,13 +1,13 @@
<template>
<a-card :bordered="false" style="width: 160%;text-align: center;margin-left:-25%">
<a-card :bordered="false" style="width: 130%;text-align: center;margin-left:-10%">
<a-steps class="steps" :current="currentTab">
<a-step title="账户信息" />
<a-step title="身份验证" />
<a-step title="更改密码" />
<a-step title="完成" />
<a-step title="用户账户"/>
<a-step title="手机验证"/>
<a-step title="密码"/>
<a-step title="完成"/>
</a-steps>
<div class="content">
<step1 v-if="currentTab === 0" @nextStep="nextStep" />
<step1 v-if="currentTab === 0" @nextStep="nextStep"/>
<step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep" :userList="userList"/>
<step3 v-if="currentTab === 2" @nextStep="nextStep" @prevStep="prevStep" :userList="userList"/>
<step4 v-if="currentTab === 3" @prevStep="prevStep" @finish="finish" :userList="userList"/>
@ -20,6 +20,7 @@
import Step2 from './Step2'
import Step3 from './Step3'
import Step4 from './Step4'
export default {
name: "Alteration",
components: {
@ -28,11 +29,11 @@
Step3,
Step4
},
data () {
data() {
return {
description: '将一个冗长或用户不熟悉的表单任务分成多个步骤,指导用户完成。',
currentTab: 0,
userList:{},
userList: {},
// form
form: null,
}
@ -40,19 +41,19 @@
methods: {
// handler
nextStep (data) {
this.userList=data;
nextStep(data) {
this.userList = data;
if (this.currentTab < 4) {
this.currentTab += 1
}
},
prevStep (data) {
this.userList=data;
prevStep(data) {
this.userList = data;
if (this.currentTab > 0) {
this.currentTab -= 1
}
},
finish () {
finish() {
this.currentTab = 0
}
}

View File

@ -9,7 +9,7 @@
<a-form-item>
<a-input
size="large"
v-decorator="['username',validatorRules.username,{ validator: this.handleUsernameOrEmail }]"
v-decorator="['username',{initialValue:'admin', rules: validatorRules.username.rules}]"
type="text"
placeholder="请输入帐户名 / jeecg">
<a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }"/>
@ -18,7 +18,7 @@
<a-form-item>
<a-input
v-decorator="['password',validatorRules.password]"
v-decorator="['password',{initialValue:'123456', rules: validatorRules.password.rules}]"
size="large"
type="password"
autocomplete="false"
@ -28,7 +28,7 @@
</a-form-item>
<a-row :gutter="0">
<a-col :span="14">
<a-col :span="16">
<a-form-item>
<a-input
v-decorator="['inputCode',validatorRules.inputCode]"
@ -36,13 +36,13 @@
type="text"
@change="inputCodeChange"
placeholder="请输入验证码">
<a-icon slot="prefix" v-if=" inputCodeContent==verifiedCode " type="smile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
<a-icon slot="prefix" v-else type="frown" :style="{ color: 'rgba(0,0,0,.25)' }"/>
<a-icon slot="prefix" type="smile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
</a-input>
</a-form-item>
</a-col>
<a-col :span="10">
<j-graphic-code @success="generateCode" ref="jgraphicCodeRef" style="float: right" remote></j-graphic-code>
<a-col :span="8" style="text-align: right">
<img style="margin-top: 2px;" :src="randCodeImage" @click="handleChangeCheckCode"/>
<!--<j-graphic-code @success="generateCode" ref="jgraphicCodeRef" style="float: right" remote></j-graphic-code>-->
</a-col>
</a-row>
@ -88,7 +88,7 @@
<router-link :to="{ name: 'alteration'}" class="forge-password" style="float: right;">
忘记密码
</router-link>
<router-link :to="{ name: 'register'}" class="forge-password" style="float: right;margin-right: 10px" >
<router-link :to="{ name: 'register'}" class="forge-password" style="float: right;margin-right: 10px" >
注册账户
</router-link>
</a-form-item>
@ -173,8 +173,7 @@
import Vue from 'vue'
import { ACCESS_TOKEN ,ENCRYPTED_STRING} from "@/store/mutation-types"
import JGraphicCode from '@/components/jeecg/JGraphicCode'
import { putAction } from '@/api/manage'
import { postAction } from '@/api/manage'
import { putAction,postAction,getAction } from '@/api/manage'
import { encryption , getEncryptedString } from '@/utils/encryption/aesEncrypt'
import store from '@/store/'
import { USER_INFO } from "@/store/mutation-types"
@ -202,11 +201,11 @@
smsSendBtn: false,
},
validatorRules:{
username:{rules: [{ required: true, message: '请输入用户名!',validator: 'click'}]},
username:{rules: [{ required: true, message: '请输入用户名!'},{validator: this.handleUsernameOrEmail}]},
password:{rules: [{ required: true, message: '请输入密码!',validator: 'click'}]},
mobile:{rules: [{validator:this.validateMobile}]},
captcha:{rule: [{ required: true, message: '请输入验证码!'}]},
inputCode:{rules: [{ required: true, message: '请输入验证码!'},{validator: this.validateInputCode}]}
inputCode:{rules: [{ required: true, message: '请输入验证码!'}]}
},
verifiedCode:"",
inputCodeContent:"",
@ -216,12 +215,16 @@
departVisible:false,
departSelected:"",
currentUsername:"",
validate_status:""
validate_status:"",
currdatetime:'',
randCodeImage:''
}
},
created () {
this.currdatetime = new Date().getTime();
Vue.ls.remove(ACCESS_TOKEN)
this.getRouterData();
this.handleChangeCheckCode();
// update-begin- --- author:scott ------ date:20190805 ---- for:密码加密逻辑暂时注释掉,有点问题
//this.getEncrypte();
// update-end- --- author:scott ------ date:20190805 ---- for:密码加密逻辑暂时注释掉,有点问题
@ -257,10 +260,9 @@
loginParams.password = values.password
loginParams.remember_me = values.rememberMe
// update-begin- --- author:scott ------ date:20190805 ---- for:密码加密逻辑暂时注释掉,有点问题
let checkParams = this.$refs.jgraphicCodeRef.getLoginParam()
loginParams.captcha = checkParams.checkCode
loginParams.checkKey = checkParams.checkKey
loginParams.captcha = that.inputCodeContent
loginParams.checkKey = that.currdatetime
console.log("登录参数",loginParams)
that.Login(loginParams).then((res) => {
this.departConfirm(res)
}).catch((err) => {
@ -339,6 +341,16 @@
this.stepCaptchaVisible = false
})
},
handleChangeCheckCode(){
this.currdatetime = new Date().getTime();
getAction(`/sys/randomImage/${this.currdatetime}`).then(res=>{
if(res.success){
this.randCodeImage = res.result
}else{
this.$message.error(res.message)
}
})
},
loginSuccess () {
// update-begin- author:sunjianlei --- date:20190812 --- for: 登录成功后不解除禁用按钮,防止多次点击
// this.loginBtn = false
@ -384,12 +396,6 @@
},
inputCodeChange(e){
this.inputCodeContent = e.target.value
if(!e.target.value||0==e.target.value){
this.inputCodeNull=true
}else{
this.inputCodeContent = this.inputCodeContent.toLowerCase()
this.inputCodeNull=false
}
},
departConfirm(res){
if(res.success){
@ -452,10 +458,12 @@
},
getRouterData(){
this.$nextTick(() => {
this.form.setFieldsValue({
'username': this.$route.params.username
});
})
if (this.$route.params.username) {
this.form.setFieldsValue({
'username': this.$route.params.username
});
}
})
},
//获取密码加密规则
getEncrypte(){

View File

@ -26,7 +26,7 @@
},
computed: {
email () {
let v = this.form && this.form.username || 'xxx'
let v = this.form ? this.form.username || this.form.mobile : ' XXX '
let title = `你的账户${v} 注册成功`
this.username = v;
return title

View File

@ -1,14 +1,14 @@
<template>
<div class="main">
<a-form style="max-width: 500px; margin: 40px auto 0;" :form="form">
<a-form style="max-width: 500px; margin: 40px auto 0;" :form="form" @keyup.enter.native="nextStep">
<a-form-item>
<a-input
v-decorator="['username',validatorRules.username]"
size="large"
type="text"
autocomplete="false"
placeholder="请输入用户或手机号">
placeholder="请输入用户账号或手机号">
<a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }"/>
</a-input>
</a-form-item>
@ -32,6 +32,7 @@
</a-col>
</a-row>
<a-form-item :wrapperCol="{span: 19, offset: 5}">
<router-link style="float: left;line-height: 40px;" :to="{ name: 'login' }">使用已有账户登录</router-link>
<a-button type="primary" @click="nextStep">下一步</a-button>
</a-form-item>
</a-form>
@ -40,95 +41,99 @@
<script>
import JGraphicCode from '@/components/jeecg/JGraphicCode'
import { getAction } from '@/api/manage'
import {checkOnlyUser } from '@/api/api'
import {getAction} from '@/api/manage'
import {checkOnlyUser} from '@/api/api'
export default {
name: "Step1",
components: {
JGraphicCode
},
data () {
data() {
return {
form: this.$form.createForm(this),
inputCodeContent: "",
inputCodeNull:true,
verifiedCode:"",
inputCodeNull: true,
verifiedCode: "",
validatorRules: {
username:{rules: [{ required: false},{validator: this.validateInputUsername}]},
inputCode:{rules: [{ required: true, message: '请输入验证码!'},{validator: this.validateInputCode}]},
username: {rules: [{required: false}, {validator: this.validateInputUsername}]},
inputCode: {rules: [{required: true, message: '请输入验证码!'}, {validator: this.validateInputCode}]},
},
}
},
methods: {
nextStep () {
nextStep() {
let that = this
this.form.validateFields((err, values) => {
if (!err){
var params={}
var reg=/^[1-9]\d*$|^0$/;
var username=values.username;
if(reg.test(username)==true) {
params.phone=username;
}else{
params.username=username;
if (!err) {
let isPhone = false;
var params = {}
var reg = /^[1-9]\d*$|^0$/;
var username = values.username;
if (reg.test(username) == true) {
params.phone = username;
isPhone = true
} else {
params.username = username;
}
getAction("/sys/user/querySysUser", params).then((res) => {
if (res.success) {
var userList = {
username: res.result.username,
phone: res.result.phone,
isPhone: isPhone
};
setTimeout(function () {
that.$emit('nextStep', userList)
})
}
});
}
getAction("/sys/user/querySysUser",params).then((res)=>{
if(res.success){
var userList={
username:res.result.username,
phone:res.result.phone
};
setTimeout(function () {
that.$emit('nextStep',userList)
})
}
});
}
})
})
},
validateInputCode(rule, value, callback){
validateInputCode(rule, value, callback) {
if (!value || this.verifiedCode == this.inputCodeContent) {
callback();
} else {
callback(new Error("您输入的验证码不正确!"));
}
},
inputCodeChange(e){
inputCodeChange(e) {
this.inputCodeContent = e.target.value;
console.log(this.inputCodeContent)
if(!e.target.value||0==e.target.value){
this.inputCodeNull=true
}else{
if (!e.target.value || 0 == e.target.value) {
this.inputCodeNull = true
} else {
this.inputCodeContent = this.inputCodeContent.toLowerCase()
this.inputCodeNull=false
this.inputCodeNull = false
}
},
generateCode(value){
generateCode(value) {
this.verifiedCode = value.toLowerCase();
console.log(this.verifiedCode);
},
validateInputUsername(rule, value, callback){
validateInputUsername(rule, value, callback) {
console.log(value);
var reg=/^[0-9]+.?[0-9]*/;
if(!value){
var reg = /^[0-9]+.?[0-9]*/;
if (!value) {
callback("请输入用户名和手机号");
}
//判断用户输入账号还是手机号码
if(reg.test(value)){
if (reg.test(value)) {
var params = {
phone : value,
phone: value,
};
checkOnlyUser(params).then((res) => {
if (res.success) {
callback("用户名不存在!")
} else {
callback()
}
})
}else{
callback("用户名不存在!")
} else {
callback()
}
})
} else {
var params = {
username: value,
};

View File

@ -1,80 +1,79 @@
<template>
<div>
<a-form :form="form" style="max-width: 500px; margin: 40px auto 0;">
<a-form-item
label="账号名"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-input
type="text"
autocomplete="false"
:style="{width:'310px'}"
:value="accountName"
disabled>
</a-input>
</a-form-item>
<a-form-item
label="手机"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-input
type="text"
autocomplete="false"
:style="{width:'310px'}"
placeholder="请输入手机号"
:value="phone"
disabled>
<a-icon slot="prefix" type="phone" :style="{ color: 'rgba(0,0,0,.25)'}" />
</a-input>
</a-form-item>
<a-form :form="form" style="max-width: 500px; margin: 40px auto 0;" @keyup.enter.native="nextStep">
<a-form-item
label="账号名"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-input
type="text"
autocomplete="false"
:style="{width:'310px'}"
:value="accountName"
disabled>
</a-input>
</a-form-item>
<a-form-item
label="手机"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-input
type="text"
autocomplete="false"
:style="{width:'310px'}"
v-decorator="['phone',{initialValue: defaultPhone, rules: validatorRules.phone.rule}]"
placeholder="请输入手机号">
<a-icon slot="prefix" type="phone" :style="{ color: 'rgba(0,0,0,.25)'}"/>
</a-input>
</a-form-item>
<a-form-item
label="验证码"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
v-if="show">
<a-row :gutter="16" style="margin-left: 35px">
<a-col class="gutter-row" :span="10">
<a-input
v-decorator="['captcha',validatorRules.captcha]"
type="text"
placeholder="手机短信验证码" >
</a-input>
</a-col>
<a-col class="gutter-row" :span="8" >
<a-button
tabindex="-1"
size="default"
:disabled="state.smsSendBtn"
@click.stop.prevent="getCaptcha"
v-text="!state.smsSendBtn && '获取验证码' || (state.time+' s')"></a-button>
</a-col>
</a-row>
<a-row :gutter="16" style="margin-left: 2px">
<a-col class="gutter-row" :span="12">
<a-input
v-decorator="['captcha',validatorRules.captcha]"
type="text"
placeholder="手机短信验证码">
</a-input>
</a-col>
<a-col class="gutter-row" :span="8">
<a-button
tabindex="-1"
size="default"
:disabled="state.smsSendBtn"
@click.stop.prevent="getCaptcha"
v-text="!state.smsSendBtn && '获取验证码' || (state.time+' s')"></a-button>
</a-col>
</a-row>
</a-form-item>
<a-form-item :wrapperCol="{span: 19, offset: 5}">
<a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
<a-button type="primary" @click="nextStep" style="margin-left: 20px">下一步</a-button>
</a-form-item>
<a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
<a-button type="primary" @click="nextStep" style="margin-left: 20px">下一步</a-button>
</a-form-item>
</a-form>
</div>
</template>
<script>
import { postAction } from '@/api/manage'
import {postAction} from '@/api/manage'
export default {
name: "Step2",
props:['userList'],
data () {
props: ['userList'],
data() {
return {
form: this.$form.createForm(this),
loading: false,
accountName:this.userList.username,
phone:this.userList.phone,
dropList:"0",
accountName: this.userList.username,
dropList: "0",
captcha: "",
show:true,
show: true,
state: {
time: 60,
smsSendBtn: false,
@ -83,58 +82,66 @@
captcha: "",
mobile: "",
},
validatorRules:{
captcha:{rule: [{ required: true, message: '请输入短信验证码!'},{validator:this.validateCaptcha}]},
validatorRules: {
captcha: {rule: [{required: true, message: '请输入短信验证码!'}, {validator: this.validateCaptcha}]},
phone: {rule: [{required: true, message: '请输入手机号码!'}]},
},
}
},
computed: {
defaultPhone: function(){
if(this.userList.isPhone){
return this.userList.phone
}
return null;
}
},
methods: {
nextStep () {
nextStep() {
let that = this
that.loading = true
this.form.validateFields((err, values) => {
console.log(values);
if (!err) {
if(that.dropList=="0"){
if(values.captcha==undefined){
if (that.dropList == "0") {
if (values.captcha == undefined) {
this.cmsFailed("请输入短信验证码!");
}else{
var params={}
params.phone=this.userList.phone;
params.smscode=values.captcha;
postAction("/sys/user/phoneVerification",params).then((res)=>{
if(res.success){
console.log(res);
var userList={
username:this.userList.username,
phone:this.userList.phone,
smscode:res.result
};
setTimeout(function () {
that.$emit('nextStep',userList)
},0)
}else{
this.cmsFailed(res.message);
}
})
} else {
var params = {}
params.phone = this.userList.phone;
params.smscode = values.captcha;
postAction("/sys/user/phoneVerification", params).then((res) => {
if (res.success) {
console.log(res);
var userList = {
username: this.userList.username,
phone: this.userList.phone,
smscode: res.result
};
setTimeout(function () {
that.$emit('nextStep', userList)
}, 0)
} else {
this.cmsFailed(res.message);
}
})
}
}
}
})
}
})
},
prevStep () {
this.$emit('prevStep',this.userList);
prevStep() {
this.$emit('prevStep', this.userList);
},
getCaptcha (e) {
getCaptcha(e) {
e.preventDefault();
let that = this;
this.state.smsSendBtn = true;
let interval = window.setInterval(() => {
if (that.state.time-- <= 0) {
this.state.smsSendBtn = true;
let interval = window.setInterval(() => {
if (that.state.time-- <= 0) {
that.state.time = 60;
that.state.smsSendBtn = false;
window.clearInterval(interval);
@ -147,30 +154,30 @@
smsmode: "2"
};
postAction("/sys/sms", smsParams).then(res => {
if(!res.success ){
setTimeout(hide, 1);
this.cmsFailed(res.message);
}
setTimeout(hide, 500);
})
if (!res.success) {
setTimeout(hide, 1);
this.cmsFailed(res.message);
}
setTimeout(hide, 500);
})
},
cmsFailed(err){
this.$notification[ 'error' ]({
cmsFailed(err) {
this.$notification['error']({
message: "验证错误",
description:err,
description: err,
duration: 4,
});
},
handleChangeSelect(value){
var that=this;
handleChangeSelect(value) {
var that = this;
console.log(value);
if(value==0){
that.dropList="0";
that.show=true;
}else{
that.dropList="1";
that.show=false;
}
if (value == 0) {
that.dropList = "0";
that.show = true;
} else {
that.dropList = "1";
that.show = false;
}
},
}
@ -181,10 +188,11 @@
.stepFormText {
margin-bottom: 24px;
}
.ant-form-item-label,
.ant-form-item-control {
line-height: 22px;
}
.ant-form-item-label,
.ant-form-item-control {
line-height: 22px;
}
.getCaptcha {
display: block;