77 lines
2.2 KiB
TypeScript
77 lines
2.2 KiB
TypeScript
|
||
import "@pageLess/Login.less";
|
||
import { Component, Vue } from 'vue-property-decorator';
|
||
import { LoginLogic } from "@logic/page/Login.logic";
|
||
import { Route, RawLocation } from 'vue-router';
|
||
import { RouterMeta, VueCustomize } from "@logic/Base.type";
|
||
|
||
@Component
|
||
export default class Login extends VueCustomize {
|
||
private logic: LoginLogic<Login> = new LoginLogic(this);
|
||
|
||
private RouterMeta: RouterMeta = {
|
||
title: '用户登录',
|
||
isLogin: false
|
||
};
|
||
|
||
public async created() {
|
||
await this.logic.StartUp();
|
||
};
|
||
|
||
// 路由拦截器
|
||
beforeRouteEnter(to: Route, from: Route, next: (to?: RawLocation | false | ((vm: Vue) => void)) => void) {
|
||
next();
|
||
}
|
||
|
||
protected render(): JSX.Element {
|
||
return (
|
||
<div class="login">
|
||
<div class="login_img">
|
||
<div class="circular"></div>
|
||
<el-carousel autoplay={false} class="banner" height="340px">
|
||
{
|
||
this.logic.Banner.map((v,i) => {
|
||
return (
|
||
<el-carousel-item>
|
||
<img src={v.img} alt=""/>
|
||
<div class="banner_title">{ v.title }</div>
|
||
</el-carousel-item>
|
||
)
|
||
})
|
||
}
|
||
</el-carousel>
|
||
</div>
|
||
<div class="login_input">
|
||
<div class="center">
|
||
<div class="login_text">
|
||
登录
|
||
<small>此页面已加密</small>
|
||
</div>
|
||
|
||
<div class="login_form">
|
||
<input v-model={this.logic.UserLoginParams.admin_user_name}
|
||
type="text" placeholder="账户名"/>
|
||
<input v-model={this.logic.UserLoginParams.admin_user_pwd}
|
||
type="password" placeholder="密码"/>
|
||
|
||
<div class="LoginSubmit">
|
||
<div class="login_button" onClick={() => this.logic.UserLogin() }>
|
||
登 录
|
||
<i class="el-icon-right"></i>
|
||
</div>
|
||
|
||
<div class="reg_text">
|
||
还没有账户?
|
||
<span> 注册</span>
|
||
</div>
|
||
</div>
|
||
|
||
<i></i>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
}
|