import {
    Component,
    Injector,
    ViewChild,
    ViewEncapsulation,
} from "@angular/core";
import {
    UserServiceProxy,
    CustomerServiceProxy,
    BusinessHoursServiceProxy,
    GetCustomerProfileDto,
    GetBusinessHoursDto,
    ContactPersonsServiceProxy,
    GetContactPersonsDto,
    ProfileServiceProxy,
    GetContactPersonsList,
} from "@shared/service-proxies/service-proxies";
import { AppComponentBase } from "@shared/common/app-component-base";
import { appModuleAnimation } from "@shared/animations/routerTransition";
import { Table } from "primeng/components/table/table";
import { LazyLoadEvent } from "primeng/api";
import { Paginator } from 'primeng/components/paginator/paginator';
import { catchError, finalize } from 'rxjs/operators';
import { PermissionTreeModalComponent } from '@app/admin/shared/permission-tree-modal.component';
import { PrimengTableHelper } from "@shared/helpers/PrimengTableHelper";
import { AppConsts } from "@shared/AppConsts";
import { ChangeProfilePictureModalComponent } from "@app/shared/layout/profile/change-profile-picture-modal.component";
import { EntityTypeHistoryModalComponent } from "@app/shared/common/entityHistory/entity-type-history-modal.component";
import { nullableFloatToModel } from "devexpress-dashboard/model/index.metadata";
import { result } from "lodash";
import { ContactPersonPermissionsModalComponent } from "./contact-person-permission.component";
import * as moment from "moment";
import * as _ from "lodash";
// import { PermissionTreeModalComponent } from '../shared/permission-tree-modal.component';

@Component({
    selector: "app-customer-portal",
    templateUrl: "./customer-portal.component.html",
    styleUrls: ["./customer-portal.component.css"],
    encapsulation: ViewEncapsulation.None,
    animations: [appModuleAnimation()]
})
export class CustomerPortalComponent extends AppComponentBase {
    @ViewChild('dataTable', { static: true }) dataTable: Table;
    @ViewChild('paginator', { static: true }) paginator: Paginator;
    @ViewChild('changeProfilePictureModal', { static: true }) changeProfilePictureModal: ChangeProfilePictureModalComponent;
    @ViewChild('permissionFilterTreeModal', { static: true }) permissionFilterTreeModal: PermissionTreeModalComponent;
    @ViewChild('contactPersonPermissionsModal', { static: true }) contactPersonPermissionsModal: ContactPersonPermissionsModalComponent;

    uploadUrl: string;

    //Filters
    advancedFiltersAreShown = false;
    filterText = '';
    role = '';
    onlyLockedUsers = false;
    saving: boolean;
    profile: GetCustomerProfileDto = new GetCustomerProfileDto();
    hour: GetBusinessHoursDto[];
    persons: GetContactPersonsList[];
    contactPerson = new GetContactPersonsDto();
    primengTableHelper: PrimengTableHelper;
    customerprofilePicture = AppConsts.appBaseUrl + '/assets/common/images/default-profile-picture.png';
    contactprofilePicture = AppConsts.appBaseUrl + '/assets/common/images/default-profile-picture.png';
    retriving: boolean = true;
    numMore: number = 0;
    hasContactPerson: boolean = false;
    @ViewChild('entityTypeHistoryModal', { static: true }) entityTypeHistoryModal: EntityTypeHistoryModalComponent;
    _entityTypeFullName = 'SprintTek.Shipping.OrderTypes.OrderType';
    entityHistoryEnabled = false;
    address: string = "";
    clinicName: string = "";
    customer: string = "";
    contactAddress: string = "";
    customerPhone: string = "";
    contactPhone: string = "";
    onLoad: boolean;
    today = new Date();
    arrayDayHolder = [];
    arrayDateHolder = [];
    arrayHolder = [];
    dayList: Array<any> = [
        {id: 1, name: 'Sunday'},
        {id: 2, name: 'Monday'},
        {id: 3, name: 'Tuesday'},
        {id: 4, name: 'Wednesday'},
        {id: 5, name: 'Thursday'},
        {id: 6, name: 'Friday'},
        {id: 7, name: 'Saturday'}
    ];
    dayListSel: Array<any> = [];
    timeId:any;
    businessCount:number = 0;
    constructor(injector: Injector,
        private _contactPersonProxy: ContactPersonsServiceProxy,
        private _customerProfileProxy: CustomerServiceProxy,
        private _businessHoursServiceProxy: BusinessHoursServiceProxy,
        private _profileServiceProxy: ProfileServiceProxy,
    ) {
        super(injector);
    }

    ngOnInit(): void {
        this.getCustomerProfile();
        this.getProfilePicture();
        this.registerEvent();
    }

    getCustomerProfile() {
        this.spinnerService.show();
        this.retriving = true;
        this._customerProfileProxy.getCustomerProfile()
            .pipe(catchError((err, caught): any => {
                this.spinnerService.hide();
            }))
            .subscribe((result: GetCustomerProfileDto) => {
                this.retriving = false;
                this.spinnerService.hide();
                if (result.customerInfo != null) {
                    localStorage.setItem("customerUserId", result.customerInfo.userId.toString());
                    this.customerprofilePicture = result.customerInfo.profilePicture == null || result.customerInfo.profilePicture == "" ?
                        AppConsts.appBaseUrl + '/assets/common/images/default-profile-picture.png' : 'data:image/jpeg;base64,' + result.customerInfo.profilePicture;
                    var addressLine2 = result.customerInfo.addressLine2 == null ? "" : " " + result.customerInfo.addressLine2
                    this.address = result.customerInfo.addressLine1 == null ? result.contactPersonInfo.email : result.customerInfo.addressLine1 + addressLine2
                        + " " + result.customerInfo.city + ", " + result.customerInfo.state + " " + result.customerInfo.postalCode;
                    this.clinicName = result.accountNo + " | " + result.clinicName;
                    if (result.customerInfo.phone != '' || result.customerInfo.phone == null) {
                        this.onLoad = true;
                        this.customerPhone = result.customerInfo.phone;
                    }else{
                        this.onLoad = false;
                    }
                }
                if (result.contactPersonInfo != null) {
                    localStorage.setItem("customerUserId", result.contactPersonInfo.userId.toString());
                    this.contactprofilePicture = result.contactPersonInfo.profilePicture == null || result.contactPersonInfo.profilePicture == "" ?
                        AppConsts.appBaseUrl + '/assets/common/images/default-profile-picture.png' : 'data:image/jpeg;base64,' + result.contactPersonInfo.profilePicture;
                    var addressLine2 = result.contactPersonInfo.addressLine2 == null ? "" : " " + result.contactPersonInfo.addressLine2
                    this.contactAddress = result.contactPersonInfo.addressLine1 + addressLine2
                        + " " + result.contactPersonInfo.city + ", " + result.contactPersonInfo.state + " " + result.contactPersonInfo.postalCode;
                    this.customer = result.contactPersonInfo.name + " " + result.contactPersonInfo.surname;
                    if (result.contactPersonInfo.phone != '' || result.contactPersonInfo.phone == null) {
                        this.onLoad = true;
                        this.contactPhone = result.contactPersonInfo.phone;
                    }else{
                        this.onLoad = false;
                    }
                }
                this.onLoad = true;
                this.profile = result;
                this.spinnerService.hide();
            });
        this.getBusinessHours();
    }

    getBusinessHours() {
        this.spinnerService.show();
        this._businessHoursServiceProxy.getBusinessHours()
            .pipe(catchError((err, caught): any => {
                this.spinnerService.hide();
            }))
            .subscribe((result: GetBusinessHoursDto[]) => {
                this.businessCount = result == null ? 0 : result.length - 1;
                var hours = result;
                this.arrayDayHolder = [];
                this.arrayDateHolder = [];
                this.arrayHolder = [];
                this.dayList = [
                    { id: 1, name: 'Sunday' },
                    { id: 2, name: 'Monday' },
                    { id: 3, name: 'Tuesday' },
                    { id: 4, name: 'Wednesday' },
                    { id: 5, name: 'Thursday' },
                    { id: 6, name: 'Friday' },
                    { id: 7, name: 'Saturday' }
                ];
                this.dayListSel = [];
                this.timeId = localStorage.getItem('timeZoneId');
                let arrayDay = {}, arrayDate = {};
                for (var data in hours) {
                    let closing = this.today.toDateString() + ' ' + hours[data].closingTimeS;
                    let opening = this.today.toDateString() + ' ' + hours[data].openingTimeS;
                    if (hours[data].code == "DAYOFTHEWEEK") {
                        for (var data1 in this.dayList) {
                            if (hours[data].day == this.dayList[data1].name) {
                                arrayDay = {
                                    'id': hours[data].id,
                                    'code': hours[data].code,
                                    'date': moment.tz(hours[data].date, this.timeId).toDate(),
                                    'day': hours[data].day,
                                    'isClosed': hours[data].isClosed,
                                    'closing': moment(closing).toDate(),
                                    'opening': moment(opening).toDate(),
                                    'sort': this.dayList[data1].id,
                                    'dateString': hours[data].dateString,
                                    'openingTimeString': hours[data].openingTimeString,
                                    'closingTimeString': hours[data].closingTimeString,
                                    'closingTimeS': hours[data].closingTimeS,
                                    'openingTimeS': hours[data].openingTimeS
                                }
                                this.arrayDayHolder.push(arrayDay);
                            }
                        }
                    } else {
                        arrayDate = {
                            'id': hours[data].id,
                            'code': hours[data].code,
                            'date': moment.tz(hours[data].date, this.timeId).toDate(),
                            'day': hours[data].day,
                            'isClosed': hours[data].isClosed,
                            'closing': moment(closing).toDate(),
                            'opening': moment(opening).toDate(),
                            'dateString': hours[data].dateString,
                            'openingTimeString': hours[data].openingTimeString,
                            'closingTimeString': hours[data].closingTimeString,
                            'closingTimeS': hours[data].closingTimeS,
                            'openingTimeS': hours[data].openingTimeS
                        }
                        this.arrayDateHolder.push(arrayDate);
                    }
                }
                this.arrayDayHolder = this.arrayDayHolder == [] ? [] :  _.sortBy(this.arrayDayHolder, 'sort');
                this.arrayDateHolder = this.arrayDateHolder == [] ? [] : this.arrayDateHolder.sort((a, b) => new Date(a.date).getTime() - new Date(b.date).getTime());;
                if (this.arrayDayHolder != []) {
                    for (var x in this.arrayDayHolder) {
                        this.arrayHolder.push(this.arrayDayHolder[x]);
                    }
                }
                if (this.arrayDateHolder != []) {
                    for (var x in this.arrayDateHolder) {
                        this.arrayHolder.push(this.arrayDateHolder[x]);
                    }
                }
                this.spinnerService.hide();
            });
    }

    getContactPersons(event?: LazyLoadEvent) {
        if (this.primengTableHelper.shouldResetPaging(event)) {
            this.paginator.changePage(0);
            return;
        }
        this.spinnerService.show();
        this._customerProfileProxy.getAllContactPerson(this.primengTableHelper.getSorting(this.dataTable),
            this.primengTableHelper.getSkipCount(this.paginator, event),
            this.primengTableHelper.getMaxResultCount(this.paginator, event))
            .subscribe(result => {
                this.primengTableHelper.totalRecordsCount = result.totalCount;
                this.primengTableHelper.records = result.items;
                this.spinnerService.hide();
            });
    }

    gotoEditProfile(): void {
        abp.event.trigger('app.show.appchangecustomerprofilemodal');
    }

    changeProfilePicture(): void {
        abp.event.trigger('app.show.changeProfilePictureModal');
    }

    getProfilePicture(): void {
        this._profileServiceProxy.getProfilePicture().subscribe(result => {
            if (result && result.profilePicture) {
                this.customerprofilePicture = 'data:image/jpeg;base64,' + result.profilePicture;
            }
        });
    }

    registerEvent() {
        abp.event.on('profilePictureChanged', () => {
            this.getProfilePicture();
        });
    }

}