workspace/soul-app/src/lib/user/modal-user-login/modal-user-login.component.html

<!-- 用户登录状态 -->
<ion-card>
  <ion-card-header>
    <ion-card-title>
      <ion-segment [value]="type" (ionChange)="typeChange($event)">
        <ion-segment-button value="login">
          <ion-label>登录</ion-label>
        </ion-segment-button>
        <ion-segment-button value="signup">
          <ion-label>注册</ion-label>
        </ion-segment-button>
      </ion-segment>
    </ion-card-title>
    <ion-card-subtitle>请输入账号密码</ion-card-subtitle>
  </ion-card-header>
  <ion-card-content>
    <ion-item>
      <ion-input [value]="username" (ionChange)="usernameChange($event)" label="昵称" placeholder="昵称"></ion-input>
    </ion-item>
    <ion-item>
      <ion-input [value]="password" (ionChange)="passwordChange($event)" label="密码" type="password" value="password"placeholder="密码"></ion-input>
    </ion-item>

    @if(type==="signup"){
      <ion-item>
        <ion-input [value]="password2" (ionChange)="password2Change($event)" label="密码确认" type="password" value="password"></ion-input>
      </ion-item>
    }
    @if(type==="login"){
      <ion-button expand="block"  color="danger" (click)="login()" style="flex: 1; margin-left: 5px;">登录</ion-button>
    }
    @if(type==="signup"){
      <ion-button expand="block"  color="danger" (click)="signup()" style="flex: 1; margin-right: 5px;">注册</ion-button>
    }
  </ion-card-content>
</ion-card>