kfmc_website/src/app/dashboard/vehicle-maintenance/vehicle-maintenance-add/vehicle-maintenance-add.component.ts

import { HttpClient } from '@angular/common/http';
import { NgxSpinnerService } from 'ngx-spinner';
import { ActivatedRoute, Params } from '@angular/router';
import { Location } from '@angular/common';
import { AuthServiceService } from './../../../shared/auth-service.service';
import { ToastrService } from 'ngx-toastr';
import { DashboardService } from './../../../shared/dashboard.service';
import { Component, OnInit, ViewChild } from '@angular/core';
import { NgForm } from '@angular/forms';

@Component({
  selector: 'app-vehicle-maintenance-add',
  templateUrl: './vehicle-maintenance-add.component.html',
  styleUrls: ['./vehicle-maintenance-add.component.css']
})

export class VehicleMaintenanceAddComponent implements OnInit {

  constructor(private dashBoardSer: DashboardService, 
    private toastr: ToastrService, 
    public authSer: AuthServiceService, 
    private route: ActivatedRoute,
    private spinner: NgxSpinnerService,
    private location: Location,
    private http: HttpClient
  ) { }

  @ViewChild('f') vehicleForm : NgForm;

  typePage: string = '';
  vehicleReceiptDate = '';
  vehicleDeliveryDate:string = '';
  bindingDateSplitStart;
  bindingDateSplitEnd;
  checkEdit: boolean = false;
  checkSaveclick:boolean = false;
  typeMode: boolean = false;
  vehicleNumber: number;
  
  vehicleId: number;  
  
  count: number;
  perPagePagenation: number;
  currentPage:number = 1;
  dataTableNumber: number = 5;
  show : Boolean = false;
  licenseNum = [];
  vehicle_types:any[] = [];
  modelNames:any[] = [];
  vehicleDataTable = [];
  maintenanceVehicleId: number;
  startDate: string = '';
  endDate: string = '';
  formData = {
    vehicle_type_id: '',
    vehicle_id: '',
    start_date: '',
    delivery_date: '',
    maintenance_notes: '',
    is_maintained: '',
  }

  ngOnInit() {

    //get vehicles types 
    this.http.get(this.authSer.pathApi + '/get_vehicle_types_list').subscribe(
      (response) => {
        console.log(response);
        this.vehicle_types = response['types'];
        
      },
      (error) => {
        console.log(error);
      });

      this.route.params.subscribe(
        (params: Params) => {
          this.maintenanceVehicleId = params['vehicleMaintenanceEditId'];
        }
      );

      if(this.maintenanceVehicleId) {
        this.spinner.show();
        this.typePage = 'تعديل';
        this.typeMode = true;
        this.dashBoardSer.getItemData(this.maintenanceVehicleId, 'maintenanceVehicle').subscribe(
          (responce) => {
            console.log('FFFFF',responce);
            this.formData.vehicle_id = responce['maintenance'].vehicle_id;
            this.formData.start_date = responce['maintenance'].start_date;
            this.formData.maintenance_notes = responce['maintenance'].maintenance_notes;
            this.formData.delivery_date = responce['maintenance'].delivery_date;
            this.formData.is_maintained = responce['maintenance'].is_maintained;
            this.formData.vehicle_type_id = responce['maintenance'].vehicle_type_id;
            this.getLicenseNum(this.formData.vehicle_type_id);
            this.formData.vehicle_id = responce['maintenance'].vehicle_id;
            this.vehicleNumber = responce['maintenance'].plate_number;
            //get table data
            this.dashBoardSer.getDataUSerSearchBar(this.vehicleNumber,
              46,
             this.currentPage,
             this.dataTableNumber).subscribe(
             (responce) => {
               console.log('search table edit ', responce);
               this.vehicleDataTable = responce['vehicle_maintenances'];
               this.count = responce['count'];
               this.perPagePagenation = responce['per_page'];
             },
             (error) => {
               console.log(error);
             }
           );
            this.startDate = responce['maintenance'].start_date;
            this.endDate = responce['maintenance'].delivery_date;
            this.checkEdit = true;
            this.bindingDateSplitStart = {
              year: parseInt(responce['maintenance'].start_date.split('-')[0]),
              month: parseInt(responce['maintenance'].start_date.split('-')[1]),
              day: parseInt(responce['maintenance'].start_date.split('-')[2]),
            }
            this.bindingDateSplitEnd = {
             year: parseInt(responce['maintenance'].delivery_date.split('-')[0]),
             month: parseInt(responce['maintenance'].delivery_date.split('-')[1]),
             day: parseInt(responce['maintenance'].delivery_date.split('-')[2]),
           }

           this.spinner.hide();

          },
          (error) => {
            console.log(error);
          }
         );
        
      } else {
        this.typePage = 'إضافه';
      }
  }

  onChangeVehicleType(event){
    this.licenseNum = [];
    const typeId = event.target.value;
    this.getLicenseNum(typeId)

  }

  getLicenseNum(typeId){
    this.http.get(this.authSer.pathApi + '/get_vehicles_by_type_id/' + typeId ).subscribe(
      (response) => {
        console.log(response);
        this.licenseNum = response['vehicles'];
        this.show = true;
      },
      (error) => {
        console.log(error);
      }
    );
  }  

  //get value date from child component 
  public getDate(date: any , type: string):void {
  
    if(date.month < 10) {
      date.month = '0' + date.month;
    } 

    if(date.day < 10) {
      date.day = '0' + date.day;
    }

    console.log( date);


    if(type == 'start') {
      this.startDate = date.year + '-' + date.month + '-' + date.day;
      console.log('start date', this.startDate);
    } else if(type == 'end') {
      this.endDate = date.year + '-' + date.month + '-' + date.day;
      console.log('end date', this.endDate);
    } else {
      console.log('not type recieved !');
    }

  }


        //change page 
    onPageChange(pagenationNumber) {
      this.spinner.show();
      
      this.currentPage = pagenationNumber;
      this.vehicleDataTable = [];
      //console.log(pagenationNumber);
      //console.log(this.pageId);
      this.dashBoardSer.getListData(46, pagenationNumber, this.dataTableNumber).subscribe(
      (responce) => {
        console.log('search result ', responce);
        this.vehicleDataTable = responce['vehicle_maintenances'];
        this.count = responce['count'];
        this.perPagePagenation = responce['per_page'];
        console.log(this.vehicleDataTable);
        this.spinner.hide();
      },
      (error) => {
        console.log(error);
        this.spinner.hide();
      }
      );
    };

  //determine the list count from select element 
  onGetValue(event) {
    this.spinner.show();
    this.vehicleDataTable = [];
    this.dataTableNumber = event.target.value;
    this.dashBoardSer.getListData(46, this.currentPage, this.dataTableNumber).subscribe(
      (responce) => {
        console.log(responce);
        this.vehicleDataTable = responce['vehicle_maintenances'];
        this.count = responce['count'];
        this.perPagePagenation = responce['per_page'];
        this.spinner.hide();
      },
      (error) => {
        console.log(error);
        this.spinner.hide();
      }
    );
  };


  onSubmitted() {

    this.checkSaveclick = true;

    this.vehicleForm.value['start_date'] = this.startDate;
    this.vehicleForm.value['delivery_date'] = this.endDate;

    delete this.vehicleForm.value['vehicle_type_id'];

    console.log(this.formData);

    const startDateData = this.startDate.split('-');
    const endDateData = this.endDate.split('-');

    if(this.typeMode) {
      if(startDateData[0] > endDateData[0]) {
        this.toastr.warning('سنه تاريخ الإنتهاء يجب أن تكون أكبر من سنه تاريخ الإنتهاء !');
        this.checkSaveclick = false;
      } else if(startDateData[1] > endDateData[1]) {
        this.toastr.warning('شهر تاريخ الانتهاء يجب أن يكون أكبر من شهر تاريخ الإبتداء !');
        this.checkSaveclick = false;
      } else if(startDateData[1] == endDateData[1] && startDateData[2] > endDateData[2]) {
        this.toastr.warning(' يوم تاريخ الإنتهاء يجب أن يكون أكبر من يوم تاريخ الإبتداء!');
        this.checkSaveclick = false;
      } else {
        this.dashBoardSer.editItem(this.maintenanceVehicleId,this.formData, 'vehicleMaintenance').subscribe(
          (responce) => {
            console.log(responce);
            this.toastr.success('تم التعديل بنجاح');
            this.location.back();
            this.checkSaveclick = false;
          },
          (error) => {
            console.log(error);
            this.toastr.error('يوجد مشكله في الخادم ، حاول لاحقاَ');
            this.checkSaveclick = false;
          }
        );
      }
    } else {
      if(startDateData[0] > endDateData[0]) {
        this.toastr.warning('سنه تاريخ الإنتهاء يجب أن تكون أكبر من سنه تاريخ الإنتهاء !');
        this.checkSaveclick = false;
      } else if(startDateData[1] > endDateData[1]) {
        this.toastr.warning('شهر تاريخ الانتهاء يجب أن يكون أكبر من شهر تاريخ الإبتداء !');
        this.checkSaveclick = false;
      } else if(startDateData[1] == endDateData[1] && startDateData[2] > endDateData[2]) {
        this.toastr.warning(' يوم تاريخ الإنتهاء يجب أن يكون أكبر من يوم تاريخ الإبتداء!');
        this.checkSaveclick = false;
      } else {
        this.dashBoardSer.addItem(this.vehicleForm.value, 'vehicleMaintenance').subscribe(
          (responce) => {
            console.log(responce);
            this.toastr.success('تم الإضافه بنجاح');
            this.location.back();
            this.checkSaveclick = false;
          },
          (error) => {
            console.log(error);
            this.toastr.error('يوجد مشكله في الخادم ، حاول لاحقاَ');
            this.checkSaveclick = false;
          }
        );
      }
    }

  }

}