图形验证码

chengdu
liangliang.Li 4 years ago
parent d63fcb4023
commit 9158c8044c
  1. 17
      src/components/page/ProjectPattern.vue
  2. 42
      src/components/page/RegisterForm.vue
  3. 4
      src/router/index.js
  4. 2
      src/utils/api.js

@ -92,7 +92,6 @@ export default {
</script>
<style lang="scss" scoped>
.back_index:hover{
// background: #3f7ecc;
opacity: 0.8;
cursor: pointer;
}
@ -114,17 +113,11 @@ export default {
.wrap{
width: 100%;
height: 100%;
// display: flex;
font-family: '微软雅黑';
}
.content_one{
// margin-top: 60px;
width: 100%;
background: white;
// height: 600px;
// background: red;
.content_one_title{
width: 100%;
height: 100px;
@ -143,6 +136,7 @@ export default {
border-radius: 20px;
height: 400px;
overflow: hidden;
background-size: 100% 100%;
background: url('../../assets/img/content.jpg') no-repeat;
}
}
@ -157,15 +151,12 @@ export default {
letter-spacing:4px;
box-sizing: border-box;
font-weight: 550;
// border-radius: 0px 20px 20px 0px;
// background: white;
}
.one_text{
width: 2300px;
height: 130px;
padding: 45px 0px;
box-sizing: border-box;
// background: red;
font-size: 23px;
line-height: 2;
color: #4D4D4F;
@ -176,14 +167,10 @@ export default {
.pattern_wrap{
width: 100%;
// height: 150px;
// background: red;
// border-top: 2px solid #FF5288;
padding: 0px 100px;
display: flex;
justify-content: space-between;
box-sizing: border-box;
// margin-top: 20px;
.img_wrap{
margin-top: 30px;
width: 500px;
@ -192,7 +179,6 @@ export default {
box-shadow: -2px 6px 10px -4px rgba(136,80,98,0.75);
-webkit-box-shadow: -2px 6px 10px -4px rgba(136,80,98,0.75);
-moz-box-shadow: -2px 6px 10px -4px rgba(136,80,98,0.75);
// margin-bottom: 10px;
font-size: 23px;
color: #FF5288;
font-weight: 550;
@ -205,7 +191,6 @@ export default {
cursor: pointer;
img{
opacity: 0.9;
}
}
img{

@ -68,19 +68,29 @@
<el-input type="password" v-model="regForm.password" placeholder="请输入密码"></el-input>
</el-form-item>
<el-form-item prop="rePassword">
<el-input type="password" v-model="regForm.rePassword" placeholder="请再次输入密码" @keyup.enter.native="registerForm"></el-input>
<el-input type="password" v-model="regForm.rePassword" placeholder="请再次输入密码"></el-input>
</el-form-item>
</div>
<div class="line">
<el-form-item>
<p class="label">*验证码</p>
<el-input v-model="regForm.validateCode" placeholder="请输入验证码" @keyup.enter.native="registerForm"></el-input>
</el-form-item>
<el-form-item>
<img :src="verifyCode" style="cursor: pointer;" @click="getVerificationCode" title="看不清?换一张" />
</el-form-item>
</div>
<el-button class="submit" type="primary" @click="registerForm">注册</el-button>
</el-form>
</div>
</template>
<script>
import axios from 'axios';
export default {
data: function() {
return {
verifyCode:'',
regForm: {
userName: '',
workNumber: '',
@ -91,7 +101,8 @@ export default {
password: '',
rePassword: '',
roleId: 4,
schoolId: 2105
schoolId: 2105,
validateCode:''
},
regRules: {
userName: [{ required: true, message: '请输入学生姓名', trigger: 'blur' }],
@ -122,8 +133,27 @@ export default {
mounted() {
this.getProvince()
this.getSchoolData()
this.getVerificationCode()
},
methods: {
//
getVerificationCode(){
// this.$get(this.api.getValidateCode)
axios({
url:this.api.getValidateCode,
methods:'get',
headers: {
"Content-Type": "application/json",
"EngineCode": "j371gy1q1ioeveq2y05l4gjz3",
"EngineSecret": "IgMlZo+KOs8FthII3KnobUoynILH5ELJVqcHNZcs1G2mwrkofR1THw=="
},
responseType: 'arraybuffer',
})
.then(res => {
const bufferUrl = btoa(new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), ''));
this.verifyCode = 'data:image/png;base64,' + bufferUrl;
}).catch(res => {});
},
getProvince(){
this.$get(this.api.queryProvince).then(res => {
this.provinceList = res.message
@ -155,12 +185,14 @@ export default {
let data = this.regForm
data.account = data.phone
data.uniqueIdentificationAccount = new Date().getTime()
this.$post(`${this.api.save}?workNumber=${this.regForm.workNumber}`,data).then(res => {
this.$post(`${this.api.save}?workNumber=${this.regForm.workNumber}&validateCode=${this.regForm.validateCode}`,data).then(res => {
this.$message.success('注册成功')
this.$emit('update:isReg',false)
this.$emit('updateInfo',{username: this.regForm.phone,password: this.regForm.password})
this.$refs.reg.resetFields()
}).catch(res => {});
}).catch(res => {
// this.$message.error(res)
});
} else {
// this.$message.error('');
return false;

@ -9,8 +9,8 @@ export default new Router({
routes: [
{
path: '/',
redirect: '/login',
// redirect: '/index',
// redirect: '/login',
redirect: '/index',
},
{
path: '/teachingVideo',

@ -1,6 +1,7 @@
// let host = 'http://192.168.31.125:9090'//林
// let host = 'http://192.168.31.151:9090'//榕
// let host = 'http://192.168.31.137:9090'//陈
// let host = 'http://192.168.31.205:9090'//杨
// let host = 'http://122.9.154.146'
// let host = 'http://192.168.242.218'//学校内网
@ -36,6 +37,7 @@ export default {
getCoursevideo:`${host}/evaluation/tms/classTech/simulationPlayList`,//开始课程-课程视频
queryPersonalCenter:`${host}/evaluation/personalCenter/queryPersonalCenter`,
getAccessNum:`${host}/evaluation/tms/userInfo/getAccessNum`,//获取项目访问量
getValidateCode:`${host}/evaluation/tms/userInfo/getValidateCode`,//获取图形验证码
examinePassword:`${host}/evaluation/tms/user/examinePassword`,//更换密码

Loading…
Cancel
Save