| | |
| | | <div class="login_box"> |
| | | <!-- 头像区域 --> |
| | | <div class="avatar_box"> |
| | | <img src="../assets/logo.png" alt="" /> |
| | | <img src="../assets/logo.jpg" alt="" /> |
| | | </div> |
| | | <!-- 登录表单区域 --> |
| | | <el-form ref="loginFormRef" :model="loginForm" label-width="0px" class="login_form"> |
| | |
| | | return { |
| | | // 这是登录表单的数据绑定对象 |
| | | loginForm: { |
| | | username: '', |
| | | password: '' |
| | | username: 'rendong', |
| | | password: '123456' |
| | | } |
| | | } |
| | | }, |
| | |
| | | this.$router.push('/administrator/main') |
| | | } |
| | | }) |
| | | |
| | | // this.$refs.loginFormRef.validate(async (valid) => { |
| | | // if (!valid) return |
| | | // const { data: res } = await this.$http.post('/login', this.loginForm) |
| | | // console.log('12312123123123123') |
| | | // console.log(res) |
| | | // if (res.meta.status !== 200) return this.$message.error('登录失败!') |
| | | // this.$message.success('登录成功') |
| | | // // console.log(res) |
| | | // // 1. 将登录成功之后的 token,保存到客户端的 sessionStorage 中 |
| | | // // 1.1 项目中出了登录之外的其他API接口,必须在登录之后才能访问 |
| | | // // 1.2 token 只应在当前网站打开期间生效,所以将 token 保存在 sessionStorage 中 |
| | | // window.sessionStorage.setItem('token', res.data.token) |
| | | // // 2. 通过编程式导航跳转到后台主页,路由地址是 /home |
| | | // this.$router.push('/administrator/main') |
| | | // }) |
| | | } |
| | | } |
| | | } |
| | |
| | | |
| | | <style lang="less" scoped> |
| | | .login_container { |
| | | background-color: #2b4b6b; |
| | | background-color: #607eaa; |
| | | height: 100%; |
| | | } |
| | | |
| | |
| | | |
| | | .btns { |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | justify-content: space-between; |
| | | } |
| | | </style> |