Skip to content

9
91isoft_vue_manage
Commit 3fc10d0e authored by 刘怀志's avatar 刘怀志
Browse files
Options

init

parent 70fdf3dd
Hide whitespace changes
Inline Side-by-side
Showing with 700 additions and 315 deletions
src/api/internal.js
View file @ 3fc10d0e
......@@ -11,3 +11,57 @@ export function queryInAdhibitions(params) {
method: 'get'
})
}
/**
* 查询email
* @param params
* @returns {AxiosPromise}
*/
export function queryEmail(params) {
return request({
baseURL: process.env.VUE_APP_INTERNAL,
url: '/log/verify/queryEmail',
method: 'get',
params
})
}
/**
* 查询email
* @param params
* @returns {AxiosPromise}
*/
export function sendEmail(params) {
return request({
baseURL: process.env.VUE_APP_INTERNAL,
url: '/log/verify/sendEmail',
method: 'post',
data: params
})
}
/**
* 验证登录
* @param params
* @returns {AxiosPromise}
*/
export function verUrl(params) {
return request({
baseURL: process.env.VUE_APP_INTERNAL,
url: '/log/verify/verUrl',
method: 'post',
data: params
})
}
/**
* 验证登录
* @param params
* @returns {AxiosPromise}
*/
export function updatePassW(params) {
return request({
baseURL: process.env.VUE_APP_INTERNAL,
url: '/log/verify/updatePassW',
method: 'get',
params: params
})
}
src/assets/image/login-background.jpg
View replaced file @ 70fdf3dd View file @ 3fc10d0e
src/assets/image/login-background.jpg

509 KB | W: | H:

src/assets/image/login-background.jpg

61.8 KB | W: | H:

src/assets/image/login-background.jpg
src/assets/image/login-background.jpg
src/assets/image/login-background.jpg
src/assets/image/login-background.jpg
  • 2-up
  • Swipe
  • Onion skin
src/components/nav-container.vue 0 → 100644
View file @ 3fc10d0e
<template>
<div class="nav-container-two">
<div class="placeholder" />
<tags-view />
<navbar />
</div>
</template>
<script>
import { Navbar, TagsView } from '@/layout/components'
export default {
name: 'NavContainer',
components: {
Navbar,
TagsView
},
props: {},
data() {
return {}
},
computed: {},
watch: {},
created() {
},
mounted() {
},
methods: {}
}
</script>
<style lang="stylus" scoped>
</style>
src/layoutLogin/components/logo.vue 0 → 100644
View file @ 3fc10d0e
<template>
<div class="sidebar-logo-container" :class="{'collapse':collapse}">
<transition name="sidebarLogoFade">
<el-link v-if="collapse" key="collapse" class="sidebar-logo-link" @click="goDetail('/')">
<img v-if="logo" :src="logo" class="sidebar-logo">
<h1 v-else class="sidebar-title">{{ title }} </h1>
</el-link>
<el-link v-else key="expand" class="sidebar-logo-link" @click="goDetail('/')">
<img v-if="logo" :src="logo" class="sidebar-logo">
<h1 class="sidebar-title">{{ title }} </h1>
</el-link>
</transition>
</div>
</template>
<script>
export default {
name: 'Logo',
props: {
collapse: {
type: Boolean,
default: false
}
},
data() {
return {
title: '青秀法院信息化系统',
logo: 'https://image-1252351428.cos.ap-beijing.myqcloud.com/home_logo.png'
}
},
methods: {
goDetail(path) {
this.$router.push({
path: path,
query: this.$route.query
})
}
}
}
</script>
<style lang="scss" scoped>
.sidebarLogoFade-enter-active {
transition: opacity 1.5s;
}
.sidebarLogoFade-enter,
.sidebarLogoFade-leave-to {
opacity: 0;
}
.sidebar-logo-container {
position: relative;
/* width: 254px; */
height: 70px;
line-height: 50px;
background: #47BCF2;
/* text-align: center; */
overflow: hidden;
padding-left: 10px;
& .sidebar-logo-link {
/* height: 100%;
width: 100%;*/
& .sidebar-logo {
width: 32px;
height: 32px;
vertical-align: middle;
margin-right: 12px;
}
& .sidebar-title {
display: inline-block;
margin: 0;
color: #fff;
font-weight: bold;
line-height: 70px;
font-size: 20px;
font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
vertical-align: middle;
}
}
&.collapse {
.sidebar-logo {
margin-right: 0px;
}
}
}
</style>
src/layoutLogin/index.vue 0 → 100644
View file @ 3fc10d0e
<template>
<section>
<el-container>
<el-header height="70">
<logo />
</el-header>
<el-main>
<transition name="fade-transform" mode="out-in">
<router-view :key="key" />
</transition>
</el-main>
</el-container>
</section>
</template>
<script>
import logo from './components/logo'
export default {
name: 'Index',
components: {
logo: logo
},
props: {},
data() {
return {}
},
computed: {
key() {
return this.$route.path
}
},
watch: {},
created() {
},
mounted() {
},
methods: {}
}
</script>
<style lang="scss" scoped>
.el-header{
padding: 0;
}
</style>
src/permission.js
View file @ 3fc10d0e
......@@ -8,15 +8,14 @@ import { getToken } from '@/utils/auth' // get token from cookie
NProgress.configure({ showSpinner: false }) // NProgress Configuration
const whiteList = ['/auth-redirect', '/bind', '/register']
const whiteList = ['/auth-redirect', '/bind', '/register', '/login', '/forgetPwd']
router.beforeEach((to, from, next) => {
NProgress.start()
if (getToken()) {
/* has token*/
if (to.path === '/login') {
next({ path: '/' })
next()
NProgress.done()
} else {
if (store.getters.roles.length === 0) {
......@@ -38,21 +37,24 @@ router.beforeEach((to, from, next) => {
} else {
alert('用户无权限')
store.dispatch('FedLogOut').then(() => {
window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_NQ}`
next({ path: '/' })
// window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_NQ}`
})
}
})
} else {
alert('用户无权限')
store.dispatch('FedLogOut').then(() => {
window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_NQ}`
next({ path: '/' })
// window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_NQ}`
})
}
})
.catch(err => {
store.dispatch('FedLogOut').then(() => {
Message.error(err)
window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_NQ}`
next({ path: '/' })
// window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_NQ}`
})
})
} else {
......@@ -76,8 +78,9 @@ router.beforeEach((to, from, next) => {
} else {
// 临时跳转
console.log('wx')
next({ path: '/' })
// next(`http://login.court.com/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_ZT}`
// window.location.href = `${process.env.VUE_APP_LOGIN}?redirect=${to.fullPath}&reLocation=${process.env.VUE_APP_ZT}`
// next()
NProgress.done()
}
......
src/router/index.js
View file @ 3fc10d0e
......@@ -5,6 +5,7 @@ Vue.use(Router)
/* Layout */
import Layout from '@/layout'
import LayoutLogin from '@/layoutLogin'
/**
* hidden: true 当设置 true 的时候该路由不会在侧边栏出现 如401，login等页面，或者如一些编辑页面/edit/1 (默认 false)
......@@ -32,12 +33,36 @@ import Layout from '@/layout'
* 基础页面，所有人可以访问
*/
export const constantRoutes = [
// {
// path: '/login',
// component: () => import('@/views/login/login'),
// hidden: true
// },
{
path: '/',
redirect: '/login',
hidden: true
},
{
path: '/login',
component: (resolve) => require(['@/views/login/login.vue'], resolve),
hidden: true
},
{
path: '/forgetPwd',
component: LayoutLogin,
redirect: '/forgetPwd/index',
hidden: true,
children: [
{
path: '/forgetPwd/index',
component: (resolve) => require(['@/views/login/forgetPwd'], resolve),
name: '忘记密码',
meta: { title: '忘记密码', icon: 'dashboard', noCache: true, affix: true }
},
{
path: '/forgetPwd/reSet',
component: (resolve) => require(['@/views/login/setPwd'], resolve),
name: '重置密码',
meta: { title: '重置密码', icon: 'dashboard', noCache: true, affix: true }
}
]
},
{
path: '/404',
component: () => import('@/views/404'),
......@@ -67,7 +92,7 @@ export const constantRoutes = [
name: 'welcome',
hidden: true,
meta: { title: '欢迎', icon: 'dashboard' }
},
}
// {
// path: '/old',
// component: Layout,
......
src/utils/auth.js
View file @ 3fc10d0e
......@@ -7,9 +7,9 @@ export function getToken() {
}
export function setToken(token) {
return Cookies.set(TokenKey, token, { domain: process.env.VUE_APP_ROOT })
return Cookies.set(TokenKey, token)
}
export function removeToken() {
return Cookies.remove(TokenKey, { domain: process.env.VUE_APP_ROOT })
return Cookies.remove(TokenKey)
}
src/views/login/forgetPwd.vue 0 → 100644
View file @ 3fc10d0e
<template>
<section class="forget-pwd-content">
<div class="title">忘记密码</div>
<el-form
ref="pwdForm"
:rules="pwdRules"
label-width="80px"
:model="pwdList"
>
<el-form-item
prop="account"
label="账号"
>
<el-input
v-model.trim="pwdList.account"
:maxlength="10"
show-word-limit
placeholder="请输入账号"
@change="sendFlag = false"
@blur="getUserEmail()"
/>
</el-form-item>
<el-form-item
style="margin-bottom: 8px"
label="邮箱"
>
<el-input
v-model="pwdList.email"
disabled
/>
<span class="msg">* 如果更换邮箱，请到网络办修改</span>
</el-form-item>
<el-form-item>
<el-button :disabled="!(pwdList.account && pwdList.email && sendFlag)" class="blue-btn" type="primary" @click="onSubmit">发送</el-button>
</el-form-item>
</el-form>
</section>
</template>
<script>
import { queryEmail, sendEmail } from '@/api/internal.js'
export default {
name: 'ForgetPwd',
components: {},
props: {},
data() {
return {
sendFlag: false,
userId: '',
pwdList: {
account: '', // 账号
email: '' // 邮箱
},
pwdRules: {
account: [{
required: true,
message: '请输入账号',
trigger: 'blur'
}]
}
}
},
computed: {},
watch: {},
created() {
},
mounted() {
},
methods: {
onSubmit() {
this.$refs['pwdForm'].validate((valid) => {
if (valid) {
const params = {
email: this.pwdList.email,
userId: this.userId,
url: process.env.VUE_APP_LOGIN + 'forgetPwd/reSet?reLocation=' + this.$route.query.reLocation
}
sendEmail(params).then(res => {
this.$message({
message: '邮件发送成功',
type: 'success'
})
})
} else {
return false
}
})
},
/**
* @Description: 根据账号获取用户邮箱
* @author liuhuaizhi
* @date 2020/8/31
*/
getUserEmail() {
if (this.pwdList.account) {
queryEmail({ userName: this.pwdList.account }).then(res => {
this.sendFlag = true
console.log(res)
this.pwdList.email = res.data.email
this.userId = res.data.userId
}).catch(err => {
console.log(err)
this.sendFlag = false
})
}
}
}
}
</script>
<style lang="scss">
.sidebar-logo-container {
height: 50px!important;
}
.sidebar-logo-container .sidebar-logo-link .sidebar-title {
line-height: 50px !important;
}
.forget-pwd-content{
.el-input--medium .el-input__inner{
height: 32px;
}
display: flex;
flex-direction: column;
align-items: center;
min-height: calc(100vh - 110px);
.title{
font-size: 24px;
font-weight: bold;
margin-top: 30px;
margin-bottom: 48px;
}
.el-form{
margin-top: 0px;
width: 40%;
.el-form-item__label{
color: #333333;
font-weight: normal;
}
.el-input__inner{
border-radius: 4px;
}
.blue-btn{
height: 32px;
border-radius: 4px;
}
.el-form-item.el-form-item--medium{
margin-bottom: 20px;
}
}
.msg{
color: red;
font-size: 12px;
}
}
</style>
src/views/login/index.vue deleted 100644 → 0
View file @ 70fdf3dd
<template>
<div class="login-container">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
<div class="title-container">
<h3 class="title">Login Form</h3>
</div>
<el-form-item prop="username">
<span class="svg-container">
<svg-icon icon-class="user" />
</span>
<el-input
ref="username"
v-model="loginForm.username"
placeholder="Username"
name="username"
type="text"
tabindex="1"
auto-complete="on"
/>
</el-form-item>
<el-form-item prop="password">
<span class="svg-container">
<svg-icon icon-class="password" />
</span>
<el-input
:key="passwordType"
ref="password"
v-model="loginForm.password"
:type="passwordType"
placeholder="Password"
name="password"
tabindex="2"
auto-complete="on"
@keyup.enter.native="handleLogin"
/>
<span class="show-pwd" @click="showPwd">
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
</span>
</el-form-item>
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">Login</el-button>
<div class="tips">
<span style="margin-right:20px;">username: admin</span>
<span> password: any</span>
</div>
</el-form>
</div>
</template>
<script>
import { validUsername } from '@/utils/validate'
export default {
name: 'Login',
data() {
const validateUsername = (rule, value, callback) => {
if (!validUsername(value)) {
callback(new Error('Please enter the correct user name'))
} else {
callback()
}
}
const validatePassword = (rule, value, callback) => {
if (value.length < 6) {
callback(new Error('The password can not be less than 6 digits'))
} else {
callback()
}
}
return {
loginForm: {
username: 'admin',
password: '123456'
},
loginRules: {
username: [{ required: true, trigger: 'blur', validator: validateUsername }],
password: [{ required: true, trigger: 'blur', validator: validatePassword }]
},
loading: false,
passwordType: 'password',
redirect: undefined
}
},
watch: {
$route: {
handler: function(route) {
this.redirect = route.query && route.query.redirect
},
immediate: true
}
},
methods: {
showPwd() {
if (this.passwordType === 'password') {
this.passwordType = ''
} else {
this.passwordType = 'password'
}
this.$nextTick(() => {
this.$refs.password.focus()
})
},
handleLogin() {
this.$refs.loginForm.validate(valid => {
if (valid) {
this.loading = true
this.$store.dispatch('Login', this.loginForm).then(() => {
this.$router.push({ path: this.redirect || '/' })
this.loading = false
}).catch(() => {
this.loading = false
})
} else {
console.log('error submit!!')
return false
}
})
}
}
}
</script>
<style lang="scss">
/* 修复input 背景不协调 和光标变色 */
/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
$bg:#283443;
$light_gray:#fff;
$cursor: #fff;
@supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
.login-container .el-input input {
color: $cursor;
}
}
/* reset element-ui css */
.login-container {
.el-input {
display: inline-block;
height: 47px;
width: 85%;
input {
background: transparent;
border: 0px;
-webkit-appearance: none;
border-radius: 0px;
padding: 12px 5px 12px 15px;
color: $light_gray;
height: 47px;
caret-color: $cursor;
&:-webkit-autofill {
box-shadow: 0 0 0px 1000px $bg inset !important;
-webkit-text-fill-color: $cursor !important;
}
}
}
.el-form-item {
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.1);
border-radius: 5px;
color: #454545;
}
}
</style>
<style lang="scss" scoped>
$bg:#2d3a4b;
$dark_gray:#889aa4;
$light_gray:#eee;
.login-container {
min-height: 100%;
width: 100%;
background-color: $bg;
overflow: hidden;
.login-form {
position: relative;
width: 520px;
max-width: 100%;
padding: 160px 35px 0;
margin: 0 auto;
overflow: hidden;
}
.tips {
font-size: 14px;
color: #fff;
margin-bottom: 10px;
span {
&:first-of-type {
margin-right: 16px;
}
}
}
.svg-container {
padding: 6px 5px 6px 15px;
color: $dark_gray;
vertical-align: middle;
width: 30px;
display: inline-block;
}
.title-container {
position: relative;
.title {
font-size: 26px;
color: $light_gray;
margin: 0px auto 40px auto;
text-align: center;
font-weight: bold;
}
}
.show-pwd {
position: absolute;
right: 10px;
top: 7px;
font-size: 16px;
color: $dark_gray;
cursor: pointer;
user-select: none;
}
}
</style>
src/views/login/login.vue
View file @ 3fc10d0e
<template>
<div class="login">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
<h3 class="title">后台管理系统</h3>
<el-form-item prop="username">
<el-input :maxlength="300" v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="loginForm.password"
type="password"
auto-complete="off"
placeholder="密码"
@keyup.enter.native="handleLogin"
<img class="fy-logo" src="../../assets/image/denglu_logo.png">
<h3 class="title">靑秀法院信息化系统</h3>
<div class="login-form-content">
<el-form-item prop="username">
<el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="loginForm.password"
type="password"
auto-complete="off"
placeholder="密码"
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="code">
<el-input
v-model="loginForm.code"
auto-complete="off"
placeholder="验证码"
style="width: 63%"
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input>
<div class="login-code">
<img :src="codeUrl" @click="getCode">
</div>
</el-form-item>
<el-form-item style="width:80%;margin-bottom: 20px">
<el-button
class="blue-btn"
:loading="loading"
size="medium"
type="primary"
@click.native.prevent="handleLogin"
>
<span v-if="!loading">登 录</span>
<span v-else>登 录 中...</span>
</el-button>
</el-form-item>
<div
class="buttons-content"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="code">
<el-input
v-model="loginForm.code"
auto-complete="off"
placeholder="验证码"
style="width: 63%"
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input>
<div class="login-code">
<img :src="codeUrl" @click="getCode">
<el-checkbox v-model="loginForm.rememberMe" class="rem-code">记住密码</el-checkbox>
<el-link
:underline="false"
@click="goDetail('/forgetPwd')"
>
<router-link to="/forgetPwd">忘记密码</router-link>
</el-link>
</div>
</el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
<el-form-item style="width:100%;">
<el-button
:loading="loading"
size="medium"
type="primary"
style="width:100%;"
@click.native.prevent="handleLogin"
>
<span v-if="!loading">登 录</span>
<span v-else>登 录 中...</span>
</el-button>
</el-form-item>
</div>
</el-form>
<!-- 底部 -->
<div class="el-login-footer" />
......@@ -60,6 +73,7 @@ export default {
name: 'Login',
data() {
return {
reLocation: '',
codeUrl: '',
cookiePassword: '',
loginForm: {
......@@ -75,19 +89,10 @@ export default {
],
password: [
{ required: true, trigger: 'blur', message: '密码不能为空' }
],
code: [{ required: true, trigger: 'change', message: '验证码不能为空' }]
},
loading: false,
redirect: undefined
}
},
watch: {
$route: {
handler: function(route) {
this.redirect = route.query && route.query.redirect
]/*,
code: [{ required: true, trigger: "change", message: "验证码不能为空" }]*/
},
immediate: true
loading: false
}
},
created() {
......@@ -95,6 +100,12 @@ export default {
this.getCookie()
},
methods: {
goDetail(path) {
this.$router.push({
path: path,
query: this.$route.query
})
},
getCode() {
getCodeImg().then(res => {
this.codeUrl = 'data:image/gif;base64,' + res.img
......@@ -112,9 +123,6 @@ export default {
}
},
handleLogin() {
// 临时跳转
// this.$router.push({ path: this.redirect || "/" });
this.$refs.loginForm.validate(valid => {
if (valid) {
this.loading = true
......@@ -130,7 +138,9 @@ export default {
this.$store
.dispatch('Login', this.loginForm)
.then(() => {
this.$router.push({ path: this.redirect || '/' })
// window.location.href = `${this.reLocation}/#/`
// this.$router.push({ path: `http://main.court.com${this.redirect || "/"}` });
this.$router.push('/welcome')
})
.catch(() => {
this.loading = false
......@@ -149,20 +159,63 @@ export default {
justify-content: center;
align-items: center;
height: 100%;
/*background-image: url("../assets/image/login-background.jpg");*/
background-image: url("../../assets/image/login-background.jpg");
background-size: cover;
.el-input__prefix{
left: 14px;
}
.el-input--prefix .el-input__inner{
padding-left: 44px;
font-size: 16px;
}
.el-form-item {
margin-bottom: 4vh;
}
}
.fy-logo{
position: fixed;
top: 20px;
left: 45%;
width: 8vw;
}
.title {
margin: 0px auto 30px auto;
margin: 7vh auto 7vh auto;
text-align: center;
color: #707070;
color: black;
font-size: 36px;
}
.login-form {
display: flex;
flex-direction: column;
align-items: flex-end;
border-radius: 6px;
background: #ffffff;
width: 400px;
background-image: url("../../assets/image/denglu_pic_fayuan.png");
background-repeat: no-repeat;
background-size: 59%;
background-position-y: 57px;
width: 78vw;
height: 76vh;
padding: 25px 25px 5px 25px;
.login-form-content{
width: 45%;
display: flex;
flex-direction: column;
align-items: center;
.el-form-item{
width: 80%;
.el-input__inner{
border-radius: 4px;
}
}
.blue-btn{
width: 26.8vw;
height: 40px;
border-radius: 4px;
font-size: 18px;
}
}
.el-input {
height: 38px;
input {
......@@ -201,4 +254,19 @@ export default {
font-size: 12px;
letter-spacing: 1px;
}
.buttons-content{
display: flex;
width: 80%;
justify-content: space-between;
padding: 0 14px;
.rem-code span{
color: $font-dark;
}
.el-link span{
color: $color-theme;
}
.rem-code span, .el-link span{
font-size: 16px;
}
}
</style>
src/views/login/setPwd.vue 0 → 100644
View file @ 3fc10d0e
<template>
<section class="forget-pwd-content">
<div class="title">重置密码</div>
<el-form
ref="pwdForm"
label-width="80px"
:rules="pwdRules"
:model="pwdList"
>
<el-form-item
prop="pass"
label="密码"
>
<el-input
v-model="pwdList.pass"
type="password"
placeholder="8~16位,由字母和数字混合组成"
/>
</el-form-item>
<el-form-item
prop="checkPass"
label="确认密码"
>
<el-input
v-model="pwdList.checkPass"
type="password"
/>
</el-form-item>
<el-form-item>
<el-button class="blue-btn" type="primary" @click="onSubmit">重置密码</el-button>
</el-form-item>
</el-form>
</section>
</template>
<script>
import { verUrl, updatePassW } from '@/api/internal.js'
export default {
name: 'SetPwd',
components: {},
props: {},
beforeRouteEnter(to, from, next) {
if (window.location.href.indexOf('code') > 0) {
next()
} else {
next('/')
}
},
data() {
return {
userId: '',
pwdList: {
pass: '', // 密码
checkPass: '' // 密码确认
},
pwdRules: {
pass: [
{ validator: this.validatePass, trigger: 'blur', required: true }
],
checkPass: [
{ validator: this.validatePass2, trigger: 'blur', required: true }
]
}
}
},
computed: {},
watch: {},
created() {
},
mounted() {
this.verUrl()
},
methods: {
/**
* @Description: 验证登录 获取userId
* @author liuhuaizhi
* @date 2020/8/31
*/
verUrl() {
verUrl({ url: window.location.href }).then(res => {
this.userId = res.data.userId
})
},
onSubmit() {
this.$refs['pwdForm'].validate((vaild) => {
if (vaild) {
const params = {
userId: this.userId,
password: this.pwdList.pass
}
updatePassW(params).then(res => {
if (res.code === 200) {
this.$router.push({
path: '/',
query: this.$route.query
})
}
})
} else {
return false
}
})
},
validatePass(rule, value, callback) {
if (value === '') {
callback(new Error('请输入密码'))
} else {
const pw_pattern = '^(?![A-Za-z]+$)(?![a-z\\W]+$)(?![A-Z\\W]+$)(?![0-9\\W]+$)[a-zA-Z0-9\\W]{8,16}$'
if (value.match(pw_pattern)) {
callback()
} else {
callback(new Error('8~16位,由字母和数字混合组成'))
}
}
},
validatePass2(rule, value, callback) {
if (value === '') {
callback(new Error('请再次输入密码'))
} else if (value !== this.pwdList.pass) {
callback(new Error('两次输入密码不一致!'))
} else {
callback()
}
}
}
}
</script>
<style lang="scss" scoped>
.forget-pwd-content{
display: flex;
flex-direction: column;
align-items: center;
min-height: calc(100vh - 110px);
.title{
font-size: 24px;
font-weight: bold;
margin-top: 40px;
}
.el-form{
margin-top: 40px;
width: 40%;
.el-form-item__label{
color: #333333;
font-weight: normal;
}
.el-input__inner{
border-radius: 4px;
}
.blue-btn{
height: 32px;
border-radius: 4px;
}
}
}
</style>
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