import { Component, OnInit } from "@angular/core";
import { NgbModal } from "@ng-bootstrap/ng-bootstrap";
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
import { DatePipe } from "@angular/common";
import { Router } from "@angular/router";

// export interface Testdata {
//   img: String;
//   name: String;
//   details: String;
// }

@Component({
  selector: "app-portal-category-manage",
  templateUrl: "./portal-category-manage.component.html",
  styleUrls: ["./portal-category-manage.component.scss"],
})
export class PortalCategoryManageComponent implements OnInit {
  
  constructor(private fb: FormBuilder, private modalService: NgbModal, private datePipe: DatePipe, private router:Router) {}

  get searchTerm(): string {
    return this._searchTerm;
  }
  set searchTerm(val: string) {
    this._searchTerm = val;
  }
  page = 1;
  pageSize = 9;

  testdata: {
    id:string;
    img: String;
    name: String;
    details: String;
    document: String;
  }[] = [];

  // config: any;
  // editUser: FormGroup | null = null;

  // joiningDate: string | null = null;

  _searchTerm = "";

  // ValidationMessage = [
  //   {
  //     Name: { required: "Name is required." },
  //   },
  //   {
  //     Position: { required: "Position is required." },
  //   },
  //   {
  //     Email: { required: "Email is required." },
  //   },
  //   {
  //     Mobile: { required: "Mobile is required." },
  //   },

  //   {
  //     DateOfJoining: { required: "DOJ is required." },
  //   },
  //   {
  //     Salary: { required: "Salary is required." },
  //   },
  //   {
  //     Projects: { required: "Project is required." },
  //   },
  // ];

  formsErrors = [];

  ngOnInit() {
    // this.editUser = this.fb.group({
    //   id: [""],
    //   Name: ["", Validators.required],
    //   Position: ["", Validators.required],
    //   Email: ["", Validators.required],
    //   Mobile: ["", Validators.required],
    //   DateOfJoining: ["", Validators.required],
    //   Salary: ["", Validators.required],
    //   Projects: ["", Validators.required],
    // });

    this.testdata = [
      {
        id:'1',
        img: "assets/images/icon/excel.png",
        name: "ประเภทไฟล์: Excel",
        details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
        document: "จำนวนเอกสาร 8 ฉบับ"
      },
      {
        id:'2',
        img: "assets/images/icon/document.png",
        name: "ประเภทไฟล์: Document",
        details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
        document: "จำนวนเอกสาร 3 ฉบับ"
      },
      {
        id:'3',
        img: "assets/images/icon/course.png",
        name: "ประเภทไฟล์: Course",
        details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
        document: "จำนวนเอกสาร 5 ฉบับ"
      },
    ];
  }

  logValidationErrors(group: FormGroup) {
    // Object.keys(group.controls).forEach((key: string) => {
    //     const ac = group.get(key);
    //     this.formsErrors[key] = '';
    //     if (ac && !ac.valid && (ac.touched || ac.dirty)) {
    //         const message = this.ValidationMessage[key];
    //         for (const errorKey in ac.errors) {
    //             if (errorKey) {
    //                 this.formsErrors[key] += message[errorKey] + '    ';
    //             }
    //         }
    //     }
    //     if (ac instanceof FormGroup) {
    //         this.logValidationErrors(ac)
    //     }
    // })
  }

  openModal(targetModal: NgbModal) {
    this.modalService.open(targetModal, {
      centered: true,
      backdrop: "static",
    });
  }

  closeBtnClick() {
    this.modalService.dismissAll();
    this.ngOnInit();
  }

  routerLink(path: String, type: String){
    this.router.navigate([path,{type:type}])
  }

}
