<ion-header>
  <ion-toolbar color="primary">
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/tabs/tab3"></ion-back-button>
    </ion-buttons>
    <ion-title>健康档案</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
  <!-- 基本信息 -->
  <ion-card>
    <ion-card-header>
      <ion-card-title>基本信息</ion-card-title>
    </ion-card-header>
    <ion-card-content>
      <p><strong>姓名:</strong> {{ healthRecord.name }}</p>
      <p><strong>性别:</strong> {{ healthRecord.gender | genderPipe }}</p>
      <p><strong>年龄:</strong> {{ healthRecord.age }}</p>
      <p><strong>联系方式:</strong> {{ healthRecord.contact }}</p>
      <p><strong>病史:</strong> {{ healthRecord.medicalHistory || '无' }}</p>
      <ion-button expand="block" (click)="editBasicInfo()">编辑基本信息</ion-button>
    </ion-card-content>
  </ion-card>

  <!-- 体检报告列表 -->
  <ion-card *ngIf="healthRecord.reports && healthRecord.reports.length > 0">
    <ion-card-header>
      <ion-card-title>体检报告</ion-card-title>
    </ion-card-header>
    <ion-list>
      <ion-item *ngFor="let report of healthRecord.reports; let i = index" button (click)="viewReport(i)">
        <ion-label>
          <h2>{{ report.title }}</h2>
          <p>{{ report.date | date: 'yyyy-MM-dd' }}</p>
        </ion-label>
        <ion-icon name="arrow-forward" slot="end"></ion-icon>
      </ion-item>
    </ion-list>
  </ion-card>

  <ion-button expand="block" (click)="addNewReport()">添加新体检报告</ion-button>
</ion-content>