|
@@ -0,0 +1,117 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <div class="login-container">
|
|
|
|
|
+123
|
|
|
|
|
+ </div>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script>
|
|
|
|
|
+import { captchaImage } from '@/api/user'
|
|
|
|
|
+
|
|
|
|
|
+export default {
|
|
|
|
|
+ name: 'Login',
|
|
|
|
|
+ data() {
|
|
|
|
|
+ },
|
|
|
|
|
+ watch: {
|
|
|
|
|
+ $route: {
|
|
|
|
|
+ handler: function(route) {
|
|
|
|
|
+ this.redirect = route.query && route.query.redirect
|
|
|
|
|
+ },
|
|
|
|
|
+ immediate: true
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ created() {
|
|
|
|
|
+ this.captchaImage()
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ captchaImage() {
|
|
|
|
|
+ captchaImage({ type: 'math' }).then(res => {
|
|
|
|
|
+ const url = 'data:image/jpg;base64,' + res.img
|
|
|
|
|
+ this.imgSrc = url
|
|
|
|
|
+ this.loginForm.uuid = res.uuid
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ 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('user/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">
|
|
|
|
|
+ .login-container {
|
|
|
|
|
+ background-image: url('../../assets/login/bg.png');
|
|
|
|
|
+ background-size: 100% 100%;
|
|
|
|
|
+ .el-form {
|
|
|
|
|
+ width: 70%;
|
|
|
|
|
+ margin: 0 auto;
|
|
|
|
|
+ .el-input__inner{
|
|
|
|
|
+ height: 40px;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ }
|
|
|
|
|
+</style>
|
|
|
|
|
+
|
|
|
|
|
+<style lang="css" scoped>
|
|
|
|
|
+ .title-container{
|
|
|
|
|
+ color: #547BD4;
|
|
|
|
|
+ font-family: Noto Sans Malayalam UI;
|
|
|
|
|
+ font-size: 28px;
|
|
|
|
|
+ line-height: 26px;
|
|
|
|
|
+ letter-spacing: 0px;
|
|
|
|
|
+ }
|
|
|
|
|
+ /deep/ .el-input__inner {
|
|
|
|
|
+ border: 0;
|
|
|
|
|
+ border-bottom: 1px solid #DCDFE6;
|
|
|
|
|
+ border-radius: 0;
|
|
|
|
|
+ padding: 0;
|
|
|
|
|
+ }
|
|
|
|
|
+ /deep/ .el-form-item__label{
|
|
|
|
|
+ padding:0;
|
|
|
|
|
+ }
|
|
|
|
|
+ .login-container {
|
|
|
|
|
+ min-height: 100%;
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ /deep/ .el-form-item{
|
|
|
|
|
+ margin-bottom: 4px;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .window-login {
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ border-radius: 15px;
|
|
|
|
|
+ margin: 0 auto;
|
|
|
|
|
+ margin-top: 3%;
|
|
|
|
|
+ width: 800px;
|
|
|
|
|
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)
|
|
|
|
|
+ }
|
|
|
|
|
+ .picColor{
|
|
|
|
|
+ background: linear-gradient(166.06deg, #2782DF 0%, #003DAE 100%);
|
|
|
|
|
+ box-shadow: 0px 4px 8px 0px #46BBFD5B;
|
|
|
|
|
+ }
|
|
|
|
|
+</style>
|