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

import { Component, OnInit } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { ModalController } from '@ionic/angular';
import { PublicationFolder } from 'src/app/models/publicationfolder';
import { PublicationsService } from 'src/app/services/publications.service';
import { ToastService } from 'src/app/services/toast.service';
import { NgxMatDateFormats } from '@angular-material-components/datetime-picker';
import { NGX_MAT_DATE_FORMATS } from '@angular-material-components/datetime-picker';
import { HttpErrorHandle } from 'src/app/services/http-error-handle.service';


const CUSTOM_DATE_FORMATS: NgxMatDateFormats = {
  parse: {
    dateInput: "YYYY-MMMM-DD HH:mm"
  },
  display: {
    dateInput: "DD MMM YYYY",
    monthYearLabel: "MMM YYYY",
    dateA11yLabel: "LL",
    monthYearA11yLabel: "MMMM YYYY"
  }
}

@Component({
  selector: 'app-new-action',
  templateUrl: './new-action.page.html',
  styleUrls: ['./new-action.page.scss'],
  providers: [
    { provide: NGX_MAT_DATE_FORMATS, useValue: CUSTOM_DATE_FORMATS },
  ]
})
export class NewActionPage implements OnInit {

  folder: PublicationFolder;
  segment:string;

  Form: FormGroup;
  validateFrom = false

  public date: any;
  public disabled = false;
  public showSpinners = true;
  public showSeconds = false;
  public touchUi = false;
  public enableMeridian = false;
  public minDate = new Date().toISOString()
  public endMinDate = new Date(new Date().getTime() + 15 * 60000);
  public stepHour = 1;
  public stepMinute = 15;
  public stepSecond = 5;
  public dateControlStart
  public dateControlEnd
  currentDate = new Date();

  showLoader = false

  get dateStart () {
    return this.dateControlStart
  }

  get dateEnd () {
    return this.dateControlEnd
  }

  constructor(
    private modalController: ModalController,
    private publication: PublicationsService,
    private toastService: ToastService,
    private httpErroHandle: HttpErrorHandle

  ) {


    this.folder = new PublicationFolder();

    this.dateControlStart = this.roundTimeQuarterHour()
    this.dateControlEnd = this.roundTimeQuarterHourPlus15(this.dateControlStart)


  }

  ngOnInit() {
    this.segment = "Evento";
    // this.setDefaultTime()
  }

  ngOnDestroy() {
    clearInterval(this.myInterval)
  }

  myInterval = setInterval(() => {
    document.querySelectorAll('.ngx-mat-timepicker input').forEach((e :any) => {
      if(e) {
        e.disabled = true;
      }
    })
  }, 1000);

  segmentChanged(ev: any) {

  }

  get dateValid() {
    return new Date(this.dateStart).getTime() < new Date(this.dateEnd).getTime() ? 'ok': null
  }

  runValidation() {
    this.validateFrom  = true;
    if(new Date(this.dateControlStart).getTime() > new Date(this.dateControlEnd).getTime()){
      this.toastService._badRequest("A data de início não pode ser superior a data de fim");
    }
  }

  injectValidation() {

    this.Form = new FormGroup({
      Subject: new FormControl(this.folder.Description, [
        Validators.required,
        // Validators.minLength(4)
      ]),
      Date: new FormControl( this.dateValid,[
        Validators.required
      ]),
      Detail: new FormControl(this.folder.Detail, [
        Validators.required
      ])
    })
  }


  async save() {

    this.injectValidation()
    this.runValidation()

    if(this.Form.invalid) return false

    this.folder = {
      ProcessId: null,
      Description: this.folder.Description,
      Detail: this.folder.Detail,
      DateBegin: this.dateControlStart,
      DateEnd: this.dateControlEnd,
      ActionType: this.segment,
    }


    const loader = this.toastService.loading()

    try {
      await this.publication.CreatePublicationFolder(this.folder).toPromise();

      this.httpErroHandle.httpsSucessMessagge('Acção criada')
      this.close();
    } catch (error) {

      this.httpErroHandle.httpStatusHandle(error)
    }     finally {
      loader.remove()
    }


  }

  close(){
    this.modalController.dismiss();
  }


  roundTimeQuarterHour(timeToReturn = new Date()) {
    let date = timeToReturn || new Date();
    const minutes = date.getMinutes();
    date.setSeconds(0);

    if(minutes % 15 != 0) {

      if (minutes > 45) {
        date.setMinutes(60)
      } else if (minutes > 30) {
        date.setMinutes(45)
      } else if (minutes > 15) {
        date.setMinutes(30)
      } else if (minutes > 0) {
        date.setMinutes(15)
      }

    }

    return date
  }

  roundTimeQuarterHourPlus15(date:Date) {
    const _date = new Date(date);
    const minutes = _date .getMinutes();
    _date .setMinutes(minutes + 15)
    return _date
  }

}