提交 9b0fb822 authored 作者: 王鹏飞's avatar 王鹏飞

chore: 优化certs登录页面

上级 3b774ee0
export default { export default {
main: { main: {
title: 'Online Learning System' title: 'Login'
}, },
login: { login: {
rememberMe: 'Remember Me', rememberMe: 'Remember Me',
......
export default { export default {
main: { main: {
title: '在线学习系统' title: '登录'
}, },
login: { login: {
rememberMe: '记住我', rememberMe: '记住我',
......
<template> <template>
<div> <div>
<div class="app-header"> <div class="app-header">
<img src="https://zws-imgs-pub.ezijing.com/static/public/6e2f93f8d412e69a7aadedb19dd37485.png" alt="" class="logo"> <img src="https://zws-imgs-pub.ezijing.com/static/public/6e2f93f8d412e69a7aadedb19dd37485.png" class="logo" />
</div> </div>
<div class="login-box"> <div class="login-box">
<router-view></router-view> <router-view></router-view>
...@@ -14,43 +14,38 @@ export default { ...@@ -14,43 +14,38 @@ export default {
name: 'WmpLayout', name: 'WmpLayout',
metaInfo() { metaInfo() {
return { return {
title: this.$t('main.title'),
link: [{ rel: 'icon', href: 'https://zws-imgs-pub.ezijing.com/static/build/learn-enterprise/favicon.png' }] link: [{ rel: 'icon', href: 'https://zws-imgs-pub.ezijing.com/static/build/learn-enterprise/favicon.png' }]
} }
}, },
data() { data() {
return { return {}
imgUrl: 'pc'
}
}, },
created() { created() {
if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { this.$i18n.locale = 'en'
this.imgUrl = 'mobile'
} else {
this.imgUrl = 'pc'
}
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-header{ .app-header {
height: 130px; height: 130px;
background: #FFFFFF; background: #ffffff;
box-shadow: 0px 3px 15px 5px rgba(201, 201, 201, 0.5); box-shadow: 0px 3px 15px 5px rgba(201, 201, 201, 0.5);
padding-top: 26px; padding-top: 26px;
box-sizing: border-box; box-sizing: border-box;
.logo{ .logo {
width: 705px; width: 705px;
margin: 0 auto; margin: 0 auto;
display: block; display: block;
} }
} }
.login-box{ .login-box {
width: 740px; width: 740px;
margin: 100px auto; margin: 100px auto;
// width: 100%; // width: 100%;
// height: 411px; // height: 411px;
background: #FFFFFF; background: #ffffff;
box-shadow: 2px 4px 12px 4px rgba(206, 206, 206, 0.5); box-shadow: 2px 4px 12px 4px rgba(206, 206, 206, 0.5);
box-sizing: border-box; box-sizing: border-box;
padding: 90px 128px; padding: 90px 128px;
......
...@@ -5,20 +5,12 @@ ...@@ -5,20 +5,12 @@
</template> </template>
<script> <script>
import Cookies from 'js-cookie'
export default { export default {
methods: { methods: {
handleSuccess(response) { handleSuccess(response) {
const { url } = webConf.others.certs const { url } = webConf.others.certs
window.location.href = url window.location.href = url
} }
},
created() {
if (this.$i18n.locale !== 'en') {
Cookies.set('lang', 'en', { expires: 30, domain: '.ezijing.com' })
this.$i18n.locale = 'en'
this.$router.go(0)
}
} }
} }
</script> </script>
......
<template>
<div class="register">
<el-page-header @back="$router.push('login')" title="返回登录" content="注册"></el-page-header>
<div class="register-form">
<el-form :model="ruleForm" :rules="rules" ref="form" @submit.native.prevent>
<el-form-item prop="name">
<el-input v-model="ruleForm.name" placeholder="姓名"></el-input>
</el-form-item>
<el-form-item prop="organization">
<el-input v-model="ruleForm.organization" placeholder="机构"></el-input>
</el-form-item>
<el-form-item prop="job">
<el-input v-model="ruleForm.job" placeholder="职务"></el-input>
</el-form-item>
<el-form-item prop="mobile">
<el-input v-model="ruleForm.mobile" placeholder="手机"></el-input>
</el-form-item>
<el-form-item prop="code">
<el-input v-model="ruleForm.code" placeholder="验证码">
<countdown
slot="suffix"
size="mini"
:disabled="disabledSend"
@start="sendCodeRequest"
ref="countdown"
></countdown>
</el-input>
</el-form-item>
<el-form-item prop="email">
<el-input v-model="ruleForm.email" placeholder="邮箱"></el-input>
</el-form-item>
<el-form-item prop="password">
<el-input type="password" v-model="ruleForm.password" placeholder="密码"></el-input>
</el-form-item>
<el-button type="primary" class="submit-button" :loading="loading" @click="handleSubmit">注册</el-button>
</el-form>
</div>
</div>
</template>
<script>
import * as api from '@/api/account'
import countdown from '@/components/countdown.vue'
export default {
name: 'Register',
components: { countdown },
data() {
return {
ruleForm: { name: '', organization: '', job: '', mobile: '', code: '', email: '', password: '' },
rules: {
name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
organization: [{ required: true, message: '请输入机构名称', trigger: 'blur' }],
job: [{ required: true, message: '请输入职务', trigger: 'blur' }],
mobile: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
email: [{ required: true, message: '请输入邮箱', trigger: 'blur' }],
password: [
{ required: true, message: '请输入登录密码', trigger: 'blur' },
{ min: 6, max: 20, message: '长度为6-20个字符', trigger: 'blur' }
]
},
loading: false
}
},
computed: {
disabledSend() {
const value = this.ruleForm.mobile
return !(/^1[3-9]\d{9}$/.test(value) || /@/.test(value))
}
},
methods: {
// 提交
handleSubmit() {
this.$refs.form.validate().then(this.handleRequest)
},
// 接口请求
handleRequest() {
this.loading = true
api.register(this.ruleForm).then(response => {
response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
this.loading = false
})
},
// 成功
handleSuccess(response) {
this.$alert('注册成功', '提示', {
type: 'success',
confirmButtonText: '去登录',
callback: action => {
this.$router.push('login')
}
})
},
// 验证码
sendCodeRequest() {
api
.sendCode({ account: this.ruleForm.mobile, signName: 'wmp', template: 'SMS_200186414' })
.then(response => {
console.log(response)
if (response.code === 0) {
this.$message({ type: 'success', message: '验证码已发送' })
} else {
// 停止计时
this.$refs.countdown.stop()
this.$message({ type: 'error', message: response.msg })
}
})
.catch(this.$refs.countdown.stop)
}
}
}
</script>
<style lang="scss" scoped>
.register-form {
margin-top: 20px;
}
</style>
...@@ -122,13 +122,7 @@ export default [ ...@@ -122,13 +122,7 @@ export default [
{ {
path: 'password', path: 'password',
component: () => import(/* webpackChunkName: "certs" */ '../pages/certs/password.vue'), component: () => import(/* webpackChunkName: "certs" */ '../pages/certs/password.vue'),
children: [ children: [{ path: '', component: password }]
{ path: '', component: password }
]
},
{
path: 'register',
component: () => import(/* webpackChunkName: "wmp" */ '../pages/wmp/register.vue')
} }
] ]
}, },
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论