<div class="_layout">
  <div class="_backdrop">
    <img src="/assets/images/login-bg.svg">
  </div>

  <div class="_content">
    <div class="_form-box">
      <div class="_form-box-cover">
        <img src="/assets/images/login-form.svg">
      </div>
      <div class="_form-box-inner">
        <div class="_logo">
          <img src="/assets/images/logo.svg">
          <h1><%= getPascalCase(name) %>Dev</h1>
        </div>
        <form nz-form [formGroup]="_loginForm">

          <nz-form-item>
            <nz-form-control [nzErrorTip]="controlErrorTemplate">
              <nz-input-group nzPrefixIcon="user">
                <input nz-input formControlName="login" placeholder="账号 / 手机号 / 邮箱">
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>

          <nz-form-item>
            <nz-form-control [nzErrorTip]="controlErrorTemplate">
              <nz-input-group nzPrefixIcon="lock" [nzSuffix]="passwordSuffixTemplate">
                <input formControlName="password" nz-input placeholder="密码" [type]="_passwordVisible ? 'text' : 'password'">
                <ng-template #passwordSuffixTemplate>
                  <i nz-icon [nzType]="_passwordVisible ? 'eye-invisible' : 'eye'" (click)="_passwordVisible = !_passwordVisible"></i>
                </ng-template>
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>

          <div nz-row nzJustify="space-between">
            <div nz-col><label nz-checkbox formControlName="rememberMe">自动登录</label></div>
          </div>
          <button nz-button nzBlock nzType="primary" [nzLoading]="_loginLoading" (click)="_login()">登 录</button>

        </form>
      </div>
    </div>
    <div class="_copy">
      <span>&copy; 2021 CloudPlex Technology (Guangzhou) Limited | V3.0.20210123 | </span>
      <a href="https://beian.miit.gov.cn" target="_blank">粤ICP备18110697号</a>
    </div>
  </div>
</div>

<ng-template #controlErrorTemplate let-control>
  <div *ngFor="let error of control.errors | keyvalue">{{ error.value }}</div>
</ng-template>
