doneit-web/src/app/pages/publications/publications.page.ts

import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { ModalController } from '@ionic/angular';
import { PublicationFolder } from 'src/app/models/publicationfolder';
import { ProcessesService } from 'src/app/services/processes.service';
import { PublicationsService } from 'src/app/services/publications.service';
import { NewActionPage } from './new-action/new-action.page';
import { ViewPublicationsPage } from './view-publications/view-publications.page';

import { Animation, AnimationController } from '@ionic/angular';
import { LoadingController } from '@ionic/angular';
import { LoadingService } from 'src/app/services/loading.service';


@Component({
  selector: 'app-publications',
  templateUrl: './publications.page.html',
  styleUrls: ['./publications.page.scss'],
})
export class PublicationsPage implements OnInit {
  showLoader: boolean;
  publicationFolder: PublicationFolder;

  publicationFolderList: PublicationFolder[];
  publicationsEventFolderList: PublicationFolder[];
  publicationsTravelFolderList: PublicationFolder[];

  theDate:any;
  theEndDate:any;
  customDate:any;
  months: string[];
  days:string[];

  constructor(
    private router: Router, 
    private modalController: ModalController,
    private animationController: AnimationController,
    private loading: LoadingService,
    private publications: PublicationsService,
    ) {
      this.months = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
      this.days = ["Domingo", "Segunda-feira", "Terça-feira", "Quarta-feira", "Quinta-feira", "Sexta-feira", "Sábado"];

      function setCookie(cname, cvalue, exdays) {
        var d = new Date();
        d.setTime(d.getTime() + (exdays*24*60*60*1000));
        var expires = "expires="+ d.toUTCString();
        document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
      }

      //  AccoesPresidenciais =  AccoesPresidenciais = 386,,
      setCookie('searchModalAPPType','386', 99999999);
    }

  ngOnInit() {
    this.router.events.forEach((event) => {
      if(event instanceof NavigationEnd && event.url == this.router.url) {
        this.getActions();
      }
    });
  }
  doRefresh(event) {
    /* this.getActions(); */

    setTimeout(() => {
      this.getActions();
      event.target.complete();
    }, 2000);
  }

  getActions(){
    this.showLoader = true;
    this.publications.GetPublicationFolderList().subscribe(res=>{
      this.publicationFolderList = res;
      console.log(res);
      this.publicationsEventFolderList = new Array();
      this.publicationsTravelFolderList = new Array();
      res.forEach(data => {
        this.theDate = new Date(data.DateBegin);
        this.theEndDate = new Date(data.DateEnd);
        let folder: PublicationFolder = {
          ProcessId: data.ProcessId,
          Description: data.Description,
          Detail: data.Detail,
          DateBegin: this.theDate.getDate() +" de "  + ( this.months[this.theDate.getMonth()])+" de "  +this.theDate.getFullYear(),
          DateEnd: this.theEndDate.getDate() +" de "  + ( this.months[this.theEndDate.getMonth()])+" de "  +this.theEndDate.getFullYear(),
          ActionType: data.ActionType,
        }
        if(data.ActionType == "Evento"){
          this.publicationsEventFolderList.push(folder);
        }
        else{
          this.publicationsTravelFolderList.push(folder);
        }
        this.showLoader = false;
      });
    });
  }

  async AddPublicationFolder(item:any) {
    const modal = await this.modalController.create({
      component: NewActionPage,
      componentProps:{
        item: item,
      },
      cssClass: 'new-action',
      backdropDismiss: false
    });
    await modal.present();
    modal.onDidDismiss().then(()=>{
      this.doRefresh(event);
    });
  }

  async viewPublications(folder: PublicationFolder) {

   /*  const enterAnimation = (baseEl: any) => {
      const backdropAnimation = this.animationController.create()
        .addElement(baseEl.querySelector('ion-backdrop')!)
        .fromTo('opacity', '0.01', 'var(--backdrop-opacity)');

      const wrapperAnimation = this.animationController.create()
        .addElement(baseEl.querySelector('.modal-wrapper')!)
        .keyframes([
          { offset: 0, opacity: '0', transform: 'scale(0)' },
          { offset: 1, opacity: '0.99', transform: 'scale(1)' }
        ]);

      return this.animationController.create()
        .addElement(baseEl)
        .easing('ease-out')
        .duration(500)
        .addAnimation([backdropAnimation, wrapperAnimation]);
    }

    const leaveAnimation = (baseEl: any) => {
      return enterAnimation(baseEl).direction('reverse');
    }
 */


    /* let item =  this.publicationFolderList; */
    const modal = await this.modalController.create({
      component: ViewPublicationsPage,
      /* enterAnimation,
      leaveAnimation, */
      componentProps:{
        item:folder,
      },
      cssClass: 'new-action',
      backdropDismiss: false
    });
    await modal.present();
    modal.onDidDismiss();
  }

}