<div class="category-list">
  <sa-loading-spider [show]="isLoading"></sa-loading-spider>
  <p class="text-muted" *ngIf="!categories.length;else dstaList">暂无分类</p>
  <ng-template #dstaList>
    <div [title]="category.name" class="category-item-checkbox" *ngFor="let category of categories">
      <sa-checkbox [(ngModel)]="category.checked" (ngModelChange)="itemSelectChange()">
        <span sa-checkbox-label>
          <span>&nbsp;</span>
          <span *ngIf="category.level">└</span>
          <strong>{{ ''.padEnd(category.level, '─') }}</strong>
          <span>&nbsp;</span>
          <span>{{ category.name }}</span>
        </span>
      </sa-checkbox>
      <p></p>
    </div>
  </ng-template>
  <hr>
  <button class="btn btn-sm btn-default btn-with-icon" (click)="getCategories()" [disabled]="isLoading">
    <ion-icon class="icon" name="refresh"></ion-icon>
    <span>更新分类</span>
  </button>
</div>
