s202226701018/wisdom-app/src/app/tab4/tab4.page.html

<ion-header [translucent]="true">
  <ion-toolbar class="custom-toolbar">
    <ion-title class="custom-title">
      我的
    </ion-title>
  </ion-toolbar>
</ion-header>
<ion-content [fullscreen]="true">
 
  <!-- 用户登录状态 -->
  <ion-card>
    <!-- 未登录 -->
     @if(!currentUser?.id){
        <ion-content>
          <ion-card class="login-card">
              <ion-card-header>
                  <ion-card-title>请登录</ion-card-title>
                  <ion-card-subtitle>暂无信息</ion-card-subtitle>
                  <ion-card-content>欢迎来到“智养人生”！在这里，我们为您提供科学、全面的健康管理方案，帮助您实现身心的和谐与平衡。无论是饮食、运动还是心理调适，我们的专业团队将为您量身定制个性化的健康计划。让我们一起探索智慧养生的奥秘，开启健康新生活！登录后，您将踏上智养之旅，发现更好的自己。欢迎您的加入，智养人生，从此刻开始！</ion-card-content>
              </ion-card-header>
              <div class="image-container">
                <img src="https://app.fmode.cn/dev/jxnu/202226701019/logo.png" alt="健康主题图片" class="responsive-image">
            </div>
          </ion-card>
      </ion-content>
      }
        <!-- 已登录 -->
     @if(currentUser?.id){
      <ion-card-header class="card-header">
        <img [src]="currentUser?.get('avatar')" onerror="this.src='https://app.fmode.cn/dev/jxnu/202226701019/头像示例.png';" alt="图片加载失败" class="avatar" />
        <div class="user-info">
            <ion-card-title>账号：{{currentUser?.get("username")}}</ion-card-title>
            <ion-card-subtitle>
                姓名: {{currentUser?.get("realname") || "-"}} 
                性别: {{currentUser?.get("gender") || "-"}} 
                年龄: {{currentUser?.get("age") || "-"}}
            </ion-card-subtitle>
        </div>
    </ion-card-header>
      }
      <ion-card-content>
      @if(!currentUser?.id){
        <ion-button expand="block" (click)="signup()" color="success">注册</ion-button>
        <ion-button expand="block" (click)="login()" color="success">登录</ion-button>
      }
     @if(currentUser?.id){
      <ion-button expand="block" (click)="editUser()" color="success">编辑资料</ion-button>
      <ion-button expand="block" (click)="logout()" color="medium">登出</ion-button>
    }
    </ion-card-content>
  </ion-card>
  @if(currentUser?.id){
    <ion-card>
      <ion-card-header>
        <ion-card-title>个性头像生成器</ion-card-title>
        <ion-card-subtitle>点击创建个性化头像</ion-card-subtitle>
      </ion-card-header>
      <ion-card-content>
        <ion-button expand="block" (click)="goToAvatar()" color="success">前往生成</ion-button>
      </ion-card-content>
    </ion-card>
  }
  @if(currentUser?.id){
  <ion-card class="memo-card">
    <h2 class="memo-title">健康备忘录</h2>
    <p class="memo-description">写下您问诊的医生名或者心动的科普知识，便于您下次查找（点击标签可删除）</p>
    <app-edit-tag (onTagChange)="setTagsValue($event)"></app-edit-tag>

    <h2 class="memo-title">收藏夹</h2>
    <ul class="tag-list">
        @for(tag of editTags; track tag;){
            <li class="tag-item">{{tag}}</li>
        }
    </ul>
  </ion-card>
  }

</ion-content>