doneit-web/src/app/shared/publication/view-publications/view-publications.page.html

<ion-header class="ion-no-border">
  <div class="main-header">
    <div class="title-content">
      <div *ngIf="publicationFolderService.FolderDetails[folderId]" class="div-title d-flex width-100 flex-grow-1 justify-content-between">
        <div class="title">
          <ion-label>{{publicationFolderService.FolderDetails[folderId].Description}}</ion-label>
        </div>

        <div class="actions-icon align-baseline">
          <!--  <ion-icon (click)="AddPublication('1',item.ProcessId)" slot="end" src='assets/images/icons-add-photo.svg'></ion-icon> -->
          <button *ngIf="p.userPermission([p.permissionList.Actions.editPost])" class="btn-no-color" (click)="openEditPublication(publicationFolderService.FolderDetails[folderId].ProcessId)">
            <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="edit" slot="end" src="assets/images/icons-edit.svg" ></ion-icon>
            <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="edit" slot="end" src="assets/images/theme/gov/icons-edit.svg" ></ion-icon>
          </button>
          <button *ngIf="p.userPermission([p.permissionList.Actions.deletePost])" class="btn-no-color" (click)="deletePublication(publicationFolderService.FolderDetails[folderId].ProcessId)">
            <ion-icon class="delete"  src='assets/images/theme/gov/icons-delete.svg'></ion-icon>
          </button>
          <button class="btn-no-color cursor-pointer" (click)="doRefresh($event)">
            <ion-icon class=" font-45-em" src="assets/images/theme/gov/icon-reload.svg"></ion-icon>
          </button >
         </div>
      </div>
      <div class="div-body width-100" *ngIf="publicationFolderService.FolderDetails[folderId]?.DateBegin != null">
        <p class="item-content-date">{{ publicationFolderService.FolderDetails[folderId].DateBegin | date: 'dd-MM-yyyy  HH:mm'}}</p>
      </div>

    </div>
  </div>
</ion-header>

<ion-content>
  <ion-refresher  name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
    <ion-progress-bar type="indeterminate" *ngIf="showLoader || publicationFolderService.showLoader"></ion-progress-bar>
    <ion-refresher-content>
    </ion-refresher-content>
  </ion-refresher>

  <div class="main-container px-20" *ngIf="publicationFolderService.FolderDetails[folderId]" >
    <p class="item-content-detail">{{publicationFolderService.FolderDetails[folderId].Detail}}</p>


    <ion-card *ngFor="let publication of publicationFolderService.publicationList[folderId] let i = index">
      <ion-card-content>

        <div  style="width: 100%; height: 395px;overflow:hidden">
          <app-swiper
            [publicationList]=publication
            [navigation]="true"
            [pagination]="false"
          ></app-swiper>
          </div>
<!--
        <swiper-container [config]="swiperThumbsConfig" [modules]="swiperModules" [speed]=400 navigation="true" [pagination]="{clickable: true, dynamicBullets: true }">
          <swiper-slide *ngFor="let files of publication.Files let k = index" class="centered-slide">
            <div class="cool">
              <div >
                <img  *ngIf="checkFileType.checkFileType(files.FileExtension ) == 'image'" class="post-img cursor-pointer"
                  [lazyLoad]="'data:image/jpg;base64,' + files.FileBase64">

                <video [appVisibility]="onVisibilityChange" #myVideo #videoElement *ngIf="checkFileType.checkFileType(files.FileExtension ) == 'video'" class="post-video" controls="controls" preload="metadata"
                  webkit-playsinline="webkit-playsinline" class="videoPlayer"  (click)="preventVideoPlay($event)">
                  <source [src]="files.FileBase64" type="video/mp4" >
                </video>


              </div>
            </div>

          </swiper-slide> -->

          <!-- <div *ngIf="publication?.Files?.length == 0">
            12
          </div>
 -->

<!--
          <div class="swiper-button-next"
          style="
            position: absolute;
            background: red;
            top: 50%;
          ">
          <div>arrow-left</div>
        </div>
        <div class="slides-per-view"
        style="
          position: absolute;
          background: red;
          top: 50%;
          right: 0px;
        ">
          <div>arrow-rights</div>
        </div>s -->
       <!--  </swiper-container> -->

        <div class="post-content" (click)="viewPublicationDetail(publication.DocumentId, publication.ProcessId)">
          <div class="post-title-time">
            <div class="post-title">
              <ion-label>{{publication.Title}}</ion-label>
            </div>
            <div class="post-data">{{publication.DatePublication | date: 'dd-MM-yyyy  HH:mm'}}</div>
          </div>
          <div class="post-description">
            <app-show-more
              [text]=publication.Message
            ></app-show-more>
          </div>
        </div>
      </ion-card-content>
    </ion-card>
  </div>
  <!-- fab placed to the bottom end -->
  <ion-fab *ngIf="p.userPermission([p.permissionList.Actions.create]) && publicationFolderService.FolderDetails[folderId]" vertical="bottom" horizontal="end">
    <ion-fab-button title="Nova Publicação" (click)="AddPublication('2',publicationFolderService.FolderDetails[folderId].ProcessId)">
      <ion-icon name="add"></ion-icon>
    </ion-fab-button>
  </ion-fab>
</ion-content>