<ion-header>
  <ion-toolbar color="primary">
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/health-record"></ion-back-button>
    </ion-buttons>
    <ion-title>{{ report.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> {{ report.date | date: 'yyyy-MM-dd' }}</p>
      <p><strong>详情:</strong> {{ report.details }}</p>
    </ion-card-content>
  </ion-card>

  <!-- 体检报告详细信息 -->
  <ion-card *ngIf="report.details">
    <ion-card-header>
      <ion-card-title>详细信息</ion-card-title>
    </ion-card-header>
    <ion-card-content>
      <p [innerHTML]="report.details"></p>
    </ion-card-content>
  </ion-card>

  <!-- 体检报告图片或附件 -->
  <ion-card *ngIf="report.attachments && report.attachments.length > 0">
    <ion-card-header>
      <ion-card-title>附件</ion-card-title>
    </ion-card-header>
    <ion-card-content>
      <ion-grid>
        <ion-row>
          <ion-col size="6" *ngFor="let attachment of report.attachments">
            <img [src]="attachment.url" alt="Attachment" style="width: 100%; height: auto;"/>
            <p>{{ attachment.name }}</p>
          </ion-col>
        </ion-row>
      </ion-grid>
    </ion-card-content>
  </ion-card>

  <!-- 操作按钮 -->
  <ion-button expand="block" (click)="goBack()">返回个人中心</ion-button>
</ion-content>