import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';
import { Subject } from 'rxjs';
import { ToastrService } from 'ngx-toastr';
import { ItemVariantService } from '../../../services/item.variant.service';
import { BsModalRef, BsModalService } from 'ngx-bootstrap';
import { SalesInfoComponent } from '../sales-info/sales-info.component';
import { TaxInfoComponent } from '../tax-info/tax-info.component';
import { CostInfoComponent } from '../cost-info/cost-info.component';
import { VariantInfoComponent } from '../variant-info/variant-info.component';

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

export class AllVariantsComponent implements OnInit {

    bsModalRef: BsModalRef;
    filterStates: { state_id: number; flow_state: string; }[] = [];
    dtOptions: DataTables.Settings = {};
    dtTrigger: Subject<any> = new Subject<any>();
    currentVariantState: number = 1;
    variantsForm: FormGroup;
    tableData: any[];
    checkedList: any;
    isMarkAsDefaultEnabled: boolean;
    isMarkAsAvailableEnabled: boolean;
    isMarkAsUnavailableEnabled: boolean;
    isUpdateSalesInfoEnabled: boolean;
    isUpdateTaxInfoEnabled: boolean;
    isUpdateCostInfoEnabled: boolean;
    isUpdateCInfoEnabled: boolean;
    isUpdateTInfoEnabled: boolean;

    constructor(private itemVariantService: ItemVariantService, private toastr: ToastrService, private fb: FormBuilder, private modalService: BsModalService) { }

    ngOnInit() {
        this.filterStates.push({ "state_id": 1, "flow_state": "CUSTOMER" });
        this.filterStates.push({ "state_id": 2, "flow_state": "TEAM" });
        this.loadData(this.currentVariantState);
        this.variantsForm = this.fb.group({
            variantState: [this.currentVariantState],
        });
    }

    /*
    @usage: called to load the table with data
    @purpose: called whenever there is state changed .
    */
    loadData(id) {
        this.itemVariantService.getItemVariants(id).subscribe((result: { status: string, message: string, data }) => {
            this.tableData = result.data;
            for (let i = 0; i < this.tableData.length; i++) {
                this.tableData[i].isSelected = false;
                if(this.tableData[i].uom){
                    this.tableData[i].uom_value = this.tableData[i].uom.uom_code;
                }
                if(this.tableData[i].item){
                    this.tableData[i].item_name = this.tableData[i].item.item_name;
                    this.tableData[i].customer = this.tableData[i].item.customer;
                    this.tableData[i].key_item = this.tableData[i].item.key_item;
                    this.tableData[i].promo_item = this.tableData[i].item.promo_item;
                }
                if(this.tableData[i].location_code){
                    this.tableData[i].location_name = this.tableData[i].location_code.location_name;
                }
            }
            this.disableEnableButtons(false);
            this.isUpdateCostInfoEnabled = false;
            this.isUpdateTInfoEnabled = false;
            this.dtTrigger.next();
        });
        this.dtOptions = {
            columnDefs: [{ type: 'string', 'targets': [1] }],
            order: [[1, 'desc']],
            pageLength: 100,
            scrollX: true
        }
    }

    disableEnableButtons(buttonState, itemVariant?){
        if(buttonState){
            if(!itemVariant.is_default)
                this.isMarkAsDefaultEnabled = true;
            else
                this.isMarkAsDefaultEnabled = false;
            if(!itemVariant.is_available)
                this.isMarkAsAvailableEnabled = true;
            else
                this.isMarkAsAvailableEnabled = false;
            if(itemVariant.is_available)
                this.isMarkAsUnavailableEnabled = true;
            else
                this.isMarkAsUnavailableEnabled = false;
            if(itemVariant.taxable)
                this.isUpdateTaxInfoEnabled = true;
            else
                this.isUpdateTaxInfoEnabled = false;
            this.isUpdateSalesInfoEnabled = true;
            this.isUpdateCInfoEnabled = true;
        }else{
            this.isMarkAsDefaultEnabled = false;
            this.isMarkAsAvailableEnabled = false;
            this.isMarkAsUnavailableEnabled = false;
            this.isUpdateSalesInfoEnabled = false;
            this.isUpdateTaxInfoEnabled = false;
            this.isUpdateCInfoEnabled = false;
        }
    }

    /*
     @usage: called whenever there is statechange filter is called
     @purpose: based on selected state it will load the data.
    */
     variantStateChanged(stateID) {
        this.currentVariantState = stateID;
        var table = $('#invoiceGrid').DataTable();
        table.destroy();
        this.loadData(this.currentVariantState);
    }

    rowSelectedUnselected(itemVariant){
        if(itemVariant){
            this.checkedList = itemVariant;
            this.isUpdateCostInfoEnabled = true;
            if(this.currentVariantState === 1){
                this.disableEnableButtons(true, itemVariant);
                this.isUpdateTInfoEnabled = false;
            }else{
                this.disableEnableButtons(false);
                this.isUpdateTInfoEnabled = true;
            }
        }
    }

    reloadGridData(){
        var table = $('#invoiceGrid').DataTable();
        table.destroy();
        this.loadData(this.currentVariantState);
    }

    markAsDefault(){
        const itemVariantDetails: any = {};
        itemVariantDetails.item_id = this.checkedList['item_id'];
        itemVariantDetails.variant_id = this.checkedList['variant_id'];
        itemVariantDetails.location_code_id = this.checkedList['location_code_id'];
        itemVariantDetails.customer = this.checkedList['customer'];
        itemVariantDetails.key_item = this.checkedList['key_item'];
        itemVariantDetails.promo_item = this.checkedList['promo_item'];
        this.itemVariantService.markAsDefault(itemVariantDetails).subscribe((result: { status: string, message: string, data })=>{
            if (result.status === 'success') {
                this.toastr.success('Item variant updated as default successfully.');
                this.reloadGridData();
            }
        },(error) => {
            this.toastr.error('Item variant can not be updated as default.');
            this.reloadGridData();
        });
    }

    updateItemVariantAvailability(status){
        const itemVariantDetails: any = {};
        itemVariantDetails.variant_id = this.checkedList['variant_id'];
        itemVariantDetails.is_available = status;
        itemVariantDetails.customer = this.checkedList['customer'];
        itemVariantDetails.key_item = this.checkedList['key_item'];
        itemVariantDetails.promo_item = this.checkedList['promo_item'];
        this.itemVariantService.updateItemVariantAvailability(itemVariantDetails).subscribe((result: { status: string, message: string, data })=>{
            if (result.status === 'success') {
                if(status)
                    this.toastr.success('Item variant updated as available successfully.');
                else
                    this.toastr.success('Item variant updated as unavailable successfully.');
                this.reloadGridData();
            }
        },(error) => {
            if(status)
                this.toastr.error('Item variant can not be updated as available.');
            else
                this.toastr.error('Item variant can not be updated as unavailable.');
            this.reloadGridData();
        });
    }

    updateSalesInfo(){
        this.bsModalRef = this.modalService.show(SalesInfoComponent, {
            backdrop: 'static',
            keyboard: false,
            animated: true,
            ignoreBackdropClick: true,
            initialState: {
              config: "{ backdrop: 'static' }",
              itemVariant: this.checkedList
            }
        });
        this.bsModalRef.content.event.subscribe(res => {
            if(res){
                this.reloadGridData();
            }
        });
    }

    updateCostInfo(){
        this.bsModalRef = this.modalService.show(CostInfoComponent, {
            backdrop: 'static',
            keyboard: false,
            animated: true,
            ignoreBackdropClick: true,
            initialState: {
              config: "{ backdrop: 'static' }",
              itemVariant: this.checkedList
            }
        });
        this.bsModalRef.content.event.subscribe(res => {
            if(res){
                this.reloadGridData();
            }
        });
    }

    updateTaxInfo(){
        this.bsModalRef = this.modalService.show(TaxInfoComponent, {
            backdrop: 'static',
            keyboard: false,
            animated: true,
            ignoreBackdropClick: true,
            initialState: {
              config: "{ backdrop: 'static' }",
              itemVariant: this.checkedList
            }
        });
        this.bsModalRef.content.event.subscribe(res => {
            if(res){
                this.reloadGridData();
            }
        });
    }

    updateInfo(){
        let variantInfo = this.checkedList;
        this.bsModalRef = this.modalService.show(VariantInfoComponent, {
            backdrop: 'static',
            keyboard: false,
            animated: true,
            ignoreBackdropClick: true,
            initialState: {
              config: "{ backdrop: 'static' }",
              itemVariant: this.checkedList,
              itemVariantFor: this.currentVariantState,
              allVariantsOfItem: this.tableData.filter((variant) => variant.item_id === variantInfo.item_id && variant.location_code_id === variantInfo.location_code_id )
            }
        });
        this.bsModalRef.content.event.subscribe(res => {
            if(res){
                this.reloadGridData();
            }
        });
    }
}