<ion-header>
  <ion-toolbar>
    <ion-title style="text-align: center;">联系人</ion-title>
  </ion-toolbar>
  <ion-toolbar>
    <ion-searchbar class="custom-searchbar" placeholder="搜索联系人"></ion-searchbar>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list lines="full">
    <ion-item *ngFor="let session of sessionList" (click)="goSession(session)">
      <ion-avatar slot="start">
        <img [src]="'/assets/img/clock.png'">
      </ion-avatar>
      <ion-label>
        <h2>{{targetUser(session) | userName}}</h2>
        <p>{{session?.get('message')?.get("contentJson")?.content}}</p>
        <p>{{session?.createdAt | date:"MM-dd HH:mm"}}</p>
      </ion-label>
    </ion-item>
  </ion-list>


  <ion-list lines="full" *ngIf="!sessionList?.length">
    <ion-item *ngFor="let item of skeletonList">
      <ion-avatar slot="start">
        <img [src]="item.avatar">
      </ion-avatar>
      <ion-label>
        <h2>{{ item.username }}</h2>
        <p>{{ item.lastMessageTime }}</p>
        <p>{{ item.lastMessage }}</p>
      </ion-label>
    </ion-item>
  </ion-list>
</ion-content>
