<ion-header>
  <ion-toolbar>
    <ion-title>发布信息</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-item>
    <ion-label>选择活动类型</ion-label>
    <ion-select [(ngModel)]="selectedType">
      <ion-select-option value="求助">求助</ion-select-option>
      <ion-select-option value="二手交易">二手交易</ion-select-option>
      <ion-select-option value="失物招领">失物招领</ion-select-option>
      <ion-select-option value="活动">活动</ion-select-option>
    </ion-select>
  </ion-item>

  <ion-item *ngIf="selectedType === '求助'">
    <ion-label position="floating">标题</ion-label>
    <ion-input type="text" [(ngModel)]="formData.title"></ion-input>
    <ion-label position="floating">内容</ion-label>
    <ion-input type="text" [(ngModel)]="formData.content"></ion-input>
  </ion-item>

  <ion-item *ngIf="selectedType === '二手交易'">
    <ion-label position="floating">标题</ion-label>
    <ion-input type="text" [(ngModel)]="formData.title"></ion-input>
    <ion-label position="floating">金额</ion-label>
    <ion-input type="text" [(ngModel)]="formData.amount"></ion-input>
    <ion-label position="floating">产品</ion-label>
    <ion-input type="text" [(ngModel)]="formData.name"></ion-input>
    <ion-label position="floating">地点</ion-label>
    <ion-input type="text" [(ngModel)]="formData.location"></ion-input>
    <ion-label position="floating">内容</ion-label>
    <ion-input type="text" [(ngModel)]="formData.content"></ion-input>
    <ion-label position="floating">选择图片</ion-label>
    <input type="file" (change)="onFileChange($event)">
  </ion-item>

  <ion-item *ngIf="selectedType === '失物招领'">
    <ion-label position="floating">标题</ion-label>
    <ion-input type="text" [(ngModel)]="formData.title"></ion-input>
    <ion-label position="floating">物品</ion-label>
    <ion-input type="text" [(ngModel)]="formData.name"></ion-input>
    <ion-label position="floating">状态</ion-label>
    <ion-input type="text" [(ngModel)]="formData.status"></ion-input>
    <ion-label position="floating">时间</ion-label>
    <ion-input type="text" [(ngModel)]="formData.time"></ion-input>
    <ion-label position="floating">地点</ion-label>
    <ion-input type="text" [(ngModel)]="formData.location"></ion-input>
    <ion-label position="floating">内容</ion-label>
    <ion-input type="text" [(ngModel)]="formData.content"></ion-input>
    <ion-label position="floating">选择图片</ion-label>
    <input type="file" (change)="onFileChange($event)">
  </ion-item>

  <ion-item *ngIf="selectedType === '活动'">
    <ion-label position="floating">标题</ion-label>
    <ion-input type="text" [(ngModel)]="formData.title"></ion-input>
    <ion-label position="floating">活动名</ion-label>
    <ion-input type="text" [(ngModel)]="formData.name"></ion-input>
    <ion-label position="floating">可参与对象</ion-label>
    <ion-input type="text" [(ngModel)]="formData.target"></ion-input>
    <ion-label position="floating">开始时间</ion-label>
    <ion-input type="text" [(ngModel)]="formData.time"></ion-input>
    <ion-label position="floating">时长</ion-label>
    <ion-input type="text" [(ngModel)]="formData.duration"></ion-input>
    <ion-label position="floating">地点</ion-label>
    <ion-input type="text" [(ngModel)]="formData.location"></ion-input>
    <ion-label position="floating">内容</ion-label>
    <ion-input type="text" [(ngModel)]="formData.content"></ion-input>
  </ion-item>

  <ion-button expand="block" (click)="submitForm()">保存</ion-button>

  <!-- 显示保存后的数据 -->
  <ion-card *ngIf="savedItems.length > 0">
    <ion-card-header>
      已保存的数据
    </ion-card-header>
    <ion-card-content>
      <ion-list>
        <ion-item *ngFor="let item of savedItems">
          <ion-label>{{ item?.get('title') }}</ion-label>
          <ion-label>{{ item?.get('category') }}</ion-label>
          <ion-label>{{ item?.get('headImage') }}</ion-label>
          <ion-label>{{ item?.get('image') }}</ion-label>
          <ion-label>{{ item?.get('content') }}</ion-label>
          <ion-label>{{ item?.get('amount') }}</ion-label>
          <ion-label>{{ item?.get('location') }}</ion-label>
          <ion-label>{{ item?.get('duration') }}</ion-label>
          <ion-label>{{ item?.get('status') }}</ion-label>
          <ion-label>{{ item?.get('target') }}</ion-label>
          <ion-label>{{ item?.get('time') }}</ion-label>
          <ion-label>{{ item?.get('name') }}</ion-label>
          <ion-label>{{ item?.get('repliesId') }}</ion-label>
        </ion-item>
      </ion-list>
    </ion-card-content>
  </ion-card>