61 lines
2.0 KiB
HTML
Raw Normal View History

2019-09-18 15:02:21 +09:00
<div class="login-form">
<div class="title">LOGIN TO YOUR ACCOUNT</div>
<form name="loginForm" [formGroup]="loginForm" novalidate>
<mat-form-field appearance="outline">
<mat-label>Company</mat-label>
<mat-select formControlName="companyCode" required>
2019-10-02 17:12:51 +09:00
<mat-option *ngFor="let company of companyList" [value]="company.companyCode">{{ company.companyName }}
</mat-option>
2019-09-18 15:02:21 +09:00
</mat-select>
<mat-error *ngIf="loginForm.get('companyCode').hasError('required')">
Company is required
</mat-error>
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Login ID</mat-label>
<input matInput formControlName="loginId" />
<mat-error *ngIf="loginForm.get('loginId').hasError('required')">
Login ID is required
</mat-error>
<mat-error *ngIf="!loginForm.get('loginId').hasError('required')">
Please enter a valid login id
</mat-error>
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Password</mat-label>
<input matInput type="password" formControlName="loginPw" #loginPw />
<mat-error>
Password is required
</mat-error>
</mat-form-field>
2019-10-02 17:12:51 +09:00
<div class="remember-forgot-password" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="space-between center">
2019-09-18 15:02:21 +09:00
<mat-checkbox class="remember-me" aria-label="Remember Me">
Remember Me
</mat-checkbox>
<a class="forgot-password">
Forgot Password?
</a>
</div>
2019-10-02 17:12:51 +09:00
<button mat-raised-button color="accent" class="submit-button" aria-label="LOG IN" [disabled]="loginForm.invalid"
(click)="onClickLogin()">
2019-09-18 15:02:21 +09:00
LOGIN
</button>
</form>
<div class="register" fxLayout="column" fxLayoutAlign="center center">
<span class="text">Don't have an account?</span>
<a class="link">Create an account</a>
</div>
2019-10-02 17:12:51 +09:00
<button mat-raised-button color="accent" class="submit-button" aria-label="Template" (click)="onClickTemplate()">
Template
</button>
2019-09-18 15:02:21 +09:00
</div>