<!-- login.page.html -->
<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/tabs/tab4"></ion-back-button>
    </ion-buttons>
    <ion-title>{{ isLogin ? '登录' : '注册' }}</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content class="ion-padding">
  <div class="auth-container">
    <ion-item>
      <ion-label position="floating">用户名</ion-label>
      <ion-input [(ngModel)]="username" type="text"></ion-input>
    </ion-item>

    <ion-item>
      <ion-label position="floating">密码</ion-label>
      <ion-input [(ngModel)]="password" type="password"></ion-input>
    </ion-item>

    <ion-item *ngIf="!isLogin">
      <ion-label position="floating">邮箱 (可选)</ion-label>
      <ion-input [(ngModel)]="email" type="email"></ion-input>
    </ion-item>

    <ion-button expand="block" (click)="submit()" class="ion-margin-top">
      {{ isLogin ? '登录' : '注册' }}
    </ion-button>

    <ion-button expand="block" fill="clear" (click)="toggleMode()">
      {{ isLogin ? '没有账号？立即注册' : '已有账号？立即登录' }}
    </ion-button>
  </div>
</ion-content>