From ff4dcb643997e1f94a06639a26ae437bb6918c45 Mon Sep 17 00:00:00 2001 From: zouyu <2723363702@qq.com> Date: 星期一, 28 八月 2023 14:31:35 +0800 Subject: [PATCH] deleted: src/views/login/2.vue --- /dev/null | 214 ----------------------------------------------------- 1 files changed, 0 insertions(+), 214 deletions(-) diff --git a/src/views/login/2.vue b/src/views/login/2.vue deleted file mode 100644 index 0b3aaf1..0000000 --- a/src/views/login/2.vue +++ /dev/null @@ -1,214 +0,0 @@ -<template> - <div class="login-container"> - <el-form ref="loginForm" :model="loginForm" class="login-form" auto-complete="on" label-position="left"> - <!-- <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left"> --> - <!-- form 琛ㄥ崟鏍¢獙 --> - <div class="title-container"> - <h3 class="title">鐧� 褰�</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' -import { get } from "@/api/util/requestUtil.js" -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: '123456', - 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() { - - } - } -} -</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: url('../../assets/404_images/backgroud.png') no-repeat; - background-size: 100vw 100vh; - overflow: hidden; - - .login-form { - position: relative; - width: 520px; - max-width: 100%; - padding: 0 35px; - margin: 0 auto; - overflow: hidden; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - - } - - .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> -- Gitblit v1.9.3