import { OnInit, Component, EventEmitter, Injector, Output, ViewChild } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import { HtmlHelper } from '@shared/helpers/HtmlHelper';
import { ListResultDtoOfOrganizationUnitDto, MoveOrganizationUnitInput, OrganizationUnitDto, OrganizationUnitServiceProxy, FleetsServiceProxy, FleetDto, ListResultDtoOfFleetDto, ContactGroupServiceProxy, PagedResultDtoOfGetContactGroupsListItemDto, GetContactGroupsListItemDto } from '@shared/service-proxies/service-proxies';
import * as _ from 'lodash';
import { Observable } from 'rxjs';
import { catchError } from 'rxjs/operators';

import { TreeNode, MenuItem } from 'primeng/api';

import { ArrayToTreeConverterService } from '@shared/utils/array-to-tree-converter.service';
import { TreeDataHelperService } from '@shared/utils/tree-data-helper.service';
import { EntityTypeHistoryModalComponent } from '@app/shared/common/entityHistory/entity-type-history-modal.component';
import { IBasicOrganizationUnitInfo } from '@app/admin/organization-units/basic-organization-unit-info';
import { CreateOrEditCustomerGroupsModal } from '@app/main/laboratory/clinic-groups/create-or-edit-customer-groups.component';
import { IUsersWithOrganizationUnit } from '@app/admin/organization-units/users-with-organization-unit';
import { IUserWithOrganizationUnit } from '@app/admin/organization-units/user-with-organization-unit';
import { IRolesWithOrganizationUnit } from '@app/admin/organization-units/roles-with-organization-unit';
import { IRoleWithOrganizationUnit } from '@app/admin/organization-units/role-with-organization-unit';
import { IClinicGroupUnit } from '@app/main/laboratory/clinic-groups/clinic-groups-unit.info';
import { ICustomerWithGroup } from './customer-with-group.component';
import { getItem } from 'localforage';

export interface IClinicGroupOnTree extends IClinicGroupUnit {
    id?: number;
    parentId?: number;
    displayName?: string;
    code?:string;
    description?:string;
    isActive?:boolean;
    color?:string;
    icon?:string;
}

@Component({
    selector: 'clinic-groups-tree',
    templateUrl: './clinic-groups-tree.component.html',
    providers: [ContactGroupServiceProxy]
})
export class ClinicGroupTreeComponent extends AppComponentBase implements OnInit {

    @Output() ouSelected = new EventEmitter<IClinicGroupUnit>();

    @ViewChild('createOrEditCustomerGroupsModal', { static: true }) createOrEditCustomerGroupsModal: CreateOrEditCustomerGroupsModal;
    @ViewChild('entityTypeHistoryModal', { static: true }) entityTypeHistoryModal: EntityTypeHistoryModalComponent;
    _entityTypeFullName = 'SprintTek.Shipping.Contacts.ContactGroup';
    entityHistoryEnabled = false;
    

    treeData: any;
     selectedOu: TreeNode;
    ouContextMenuItems: MenuItem[];
    canManageOrganizationUnits = false;
    fleetsList : any;

    constructor(
        injector: Injector,
        private _organizationUnitService: OrganizationUnitServiceProxy,
        private _arrayToTreeConverterService: ArrayToTreeConverterService,
        private _treeDataHelperService: TreeDataHelperService,
        private _fleetsServiceProxy: FleetsServiceProxy,
        private _contactGroupServiceProxy: ContactGroupServiceProxy,
    ) {
        super(injector);
    }

    totalUnitCount = 0;

    ngOnInit(): void {
        this.canManageOrganizationUnits = this.isGranted('Pages.Administration.OrganizationUnits.ManageOrganizationTree');
        this.setIsEntityHistoryEnabled();
        this.ouContextMenuItems = this.getContextMenuItems();
        this.getTreeDataFromServer();
        
    }

    nodeSelect(event) {
        this.ouSelected.emit(<IClinicGroupUnit>{
            id: event.node.data.id,
            displayName: event.node.data.description
        });
    }

    reload(): void {
        this.getTreeDataFromServer();
    }

    private getTreeDataFromServer(): void {
        let self = this;
        self.spinnerService.show();
        self._contactGroupServiceProxy.getContactGroups(undefined, 500, undefined).subscribe((result: PagedResultDtoOfGetContactGroupsListItemDto)  => {
            self.totalUnitCount = result.items.length;
            this.treeData = this._arrayToTreeConverterService.createTree(result.items,
                'parentId',
                'id',
                null,
                'children',
                [
                    {
                        target: 'label',
                        targetFunction(item) {
                            return item.description;
                        }
                    }, 
                    {
                        target: 'expandedIcon',
                        targetFunction(item) {
                            return item.icon;
                        }
                    },
                    {
                        target: 'collapsedIcon',
                        targetFunction(item) {
                            return item.icon;
                        }
                    },
                    {
                        target: 'selectable',
                        value: true
                    }
                ]);
                self.spinnerService.hide();
        });
    }

    private getContextMenuItems(): any[] {
        const canManageOrganizationTree = this.isGranted('Pages.Administration.OrganizationUnits.ManageOrganizationTree');
        let items = [
            {
                label: this.l('Edit'),
                disabled: !canManageOrganizationTree,
                command: (event) => {
                    // console.log(this.selectedOu)
                    this.createOrEditCustomerGroupsModal.showModal({
                        id: this.selectedOu.data.id,
                        description: this.selectedOu.data.description,
                        code: this.selectedOu.data.code,
                        color: this.selectedOu.data.color,
                        icon: this.selectedOu.data.icon,
                        isActive: this.selectedOu.data.isActive
                    });
                    console.log(this.selectedOu)
                }
            },
            {
                label: this.l('Delete'),
                disabled: !canManageOrganizationTree,
                command: () => {
                    this.message.confirm(
                        '','Are you sure?',
                        (isConfirmed) => {
                            if (isConfirmed) {
                                // console.log(this.selectedOu)
                                this._contactGroupServiceProxy.deleteContactGroup(undefined,this.selectedOu.data.id)
                                    .subscribe(() => {
                                        this.ouSelected.emit(null);
                                        this.reload();
                                        this.notify.success(this.l('SuccessfullyDeleted'));
                                    });
                            }
                        }
                    );
                }
            },
            {
                label: this.l('History'),
                disabled: !this.entityHistoryEnabled,
                command: (event) => {
                    this.showHistory(this.selectedOu.data);
                }
            },
        ];
        return items;
    }

    

    // rateAdded(data: IRatesWithFleet): void {
    //     this.incrementRateCount(data.ouId, data.rateIds.length);
    // }

    contactRemoved(data: ICustomerWithGroup): void {
        this.incrementGroupCount(data.ouId, -1);
    }

    contactAdded(data: ICustomerWithGroup): void {
        // console.log(data)
        this.incrementGroupCount(data.ouId, data.contactIds.length);
        // console.log("emit")
    }

    incrementGroupCount(ouId: number, incrementAmount: number): void {
        let item = this._treeDataHelperService.findNode(this.treeData, { data: { id: ouId } });
        // console.log(item)
        item.data.totalContacts += incrementAmount;
        item.totalContacts = item.data.totalContacts;
        // console.log("emit")
    }

    // driverAdded(data: IDriversWithFleet): void {
    //     this.incrementDriverCount(data.ouId, data.userIds.length);
    // }

    // driverRemoved(data: IDriverWithFleet): void {
    //     this.incrementDriverCount(data.ouId, -1);
    // }

    // incrementDriverCount(ouId: number, incrementAmount: number): void {
    //     let item = this._treeDataHelperService.findNode(this.treeData, { data: { id: ouId } });
    //     item.data.driverCount += incrementAmount;
    //     item.driverCount = item.data.driverCount;
    // }

    customersAdded(data: ICustomerWithGroup): void {
        console.log(1)
        this.incrementCustomerCount(data.ouId, data.contactIds.length);
    }

    // vehicleRemoved(data: IVehicleWithFleet): void {
    //     this.incrementVehicleCount(data.ouId, -1);
    // }

    incrementCustomerCount(ouId: number, incrementAmount: number): void {
        let item = this._treeDataHelperService.findNode(this.treeData, { data: { id: ouId } });
        // item.data.customerCount += incrementAmount;
        // item.customerCount = item.data.customerCount;
        console.log(item)
    }
    
    addCustomerGroup(): void{
        this.createOrEditCustomerGroupsModal.showModal({});
    }

    private setIsEntityHistoryEnabled(): void {
        let customSettings = (abp as any).custom;
        this.entityHistoryEnabled = customSettings.EntityHistory && customSettings.EntityHistory.isEnabled && _.filter(customSettings.EntityHistory.enabledEntities, entityType => entityType === this._entityTypeFullName).length === 1;
    }

    showHistory(role: GetContactGroupsListItemDto): void {
        this.entityTypeHistoryModal.show({
            entityId: role.id.toString(),
            entityTypeFullName: this._entityTypeFullName,
            entityTypeDescription: "Group - " +role.code
        });
    }
}