import { DashboardService } from './../dashboard/dashboard.service';
import { CategoryService } from './category.service';
import { Component, OnInit, ViewChild } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-category',
  templateUrl: './category.component.html',
  styleUrls: ['./category.component.css']
})
export class CategoryComponent implements OnInit {
 categories: any;
 cantcategories: number;
 existError = false;
 textError = '';
 showIndex = -1;

  constructor(
    private categoryService: CategoryService,
    private router: Router,
    private dashboardService: DashboardService,
  ) { }

  ngOnInit() {
    this.dashboardService.updateMenuPosition(7);
    this.fetchCategories();
  }

  fetchCategories() {
    this.categoryService.getCategories()
    .subscribe(data => {
      const aux: any = data;
      if (aux.resp) {
          this.categories = aux.categories;
          this.cantcategories = this.categories.length;
      }
    });
  }

  onAdd() {
    this.router.navigateByUrl('/main/addcategory');
  }

  onEdit(catId: string) {
    this.router.navigateByUrl(`/main/editcategory/${catId}`);
  }


  updateIndex(ind) {
    if (this.showIndex === ind) {
      this.showIndex = -1;
    } else {
      this.showIndex = ind;
    }
  }

  eliminar(catid: string){
    this.categoryService.delCategory(catid)
    .subscribe(data => {
      const aux: any = data;
      if (aux.resp) {
        this.showIndex = -1;
        this.fetchCategories();
      }
    });
  }

  FieldsChange(values: any, catId: string) {
    this.categoryService.changePopularValue(catId, values.currentTarget.checked)
    .subscribe(data => {
      const aux: any = data;
      if (aux.resp) {
        this.fetchCategories();
      }
    });
  }


}