import { Component, ViewChild, Injector, Output, EventEmitter } from '@angular/core';
import { ModalDirective } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';
import {
    SupportTicketNotificationsServiceProxy, CreateOrEditSupportTicketNotificationDto, SupportTicketNotificationOrderNotificationTemplateLookupTableDto
    , SupportTicketNotificationSupportTicketStatusLookupTableDto
    , SupportTicketNotificationSmsTemplateLookupTableDto,
    CreateOrEditSupportTicketNotificationRecipientsDto,
    SupportTicketNotificationRecipientsServiceProxy,
    UserListDto,
    OrganizationUnitDto,
    TenantListDto
} from '@shared/service-proxies/service-proxies';
import { AppComponentBase } from '@shared/common/app-component-base';
import * as moment from 'moment';

@Component({
    selector: 'createOrEditSupportTicketNotificationModal',
    templateUrl: './create-or-edit-supportTicketNotification-modal.component.html'
})
export class CreateOrEditSupportTicketNotificationModalComponent extends AppComponentBase {

    @ViewChild('createOrEditModal', { static: true }) modal: ModalDirective;

    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    active = false;
    saving = false;
    activeTabIndex = 0;
    delete: any;
    form: any;
    supportTicketNotification: CreateOrEditSupportTicketNotificationDto = new CreateOrEditSupportTicketNotificationDto();
    recipient: any;
    orderNotificationTemplateDescription = '';
    supportTicketStatusDescription = '';
    smsTemplateDescription = '';
    tenantName = '';
    unit: any;
    allOrderNotificationTemplates: SupportTicketNotificationOrderNotificationTemplateLookupTableDto[];
    allSupportTicketStatuss: SupportTicketNotificationSupportTicketStatusLookupTableDto[];
    allSmsTemplates: SupportTicketNotificationSmsTemplateLookupTableDto[];
    allUsers: UserListDto[];
    allOrganizationUnits: OrganizationUnitDto[];
    allTenants: TenantListDto[];

    constructor(
        injector: Injector,
        private _supportTicketNotificationsServiceProxy: SupportTicketNotificationsServiceProxy,
        private _supportTicketNotificationRecipientsServiceProxy: SupportTicketNotificationRecipientsServiceProxy
    ) {
        super(injector);
    }

    onShown(): void {
        $('.kt-select2').select2();
    }

    show(supportTicketNotificationId?: number): void {
        $('.kt-select2').select2();
        let s = this;
        this.recipient = [];
        if (!supportTicketNotificationId) {
            this.supportTicketNotification = new CreateOrEditSupportTicketNotificationDto();
            this.supportTicketNotification.id = supportTicketNotificationId;
            this.orderNotificationTemplateDescription = '';
            this.supportTicketStatusDescription = '';
            this.smsTemplateDescription = '';
            this.tenantName = '';

            this.active = true;
            this.modal.show();
        } else {
            this._supportTicketNotificationsServiceProxy.getSupportTicketNotificationForEdit(supportTicketNotificationId).subscribe(result => {
                this.supportTicketNotification = result.supportTicketNotification;
                this.recipient = result.supportTicketNotification.supportTicketNotificationRecipients;
                this.orderNotificationTemplateDescription = result.orderNotificationTemplateDescription;
                this.supportTicketStatusDescription = result.supportTicketStatusDescription;
                this.smsTemplateDescription = result.smsTemplateDescription;
                this.tenantName = result.tenantName;

                this.active = true;
                this.modal.show();
            });
        }
        this._supportTicketNotificationsServiceProxy.getAllOrderNotificationTemplateForTableDropdown().subscribe(result => {
            this.allOrderNotificationTemplates = result;
        });
        this._supportTicketNotificationsServiceProxy.getAllSupportTicketStatusForTableDropdown().subscribe(result => {
            this.allSupportTicketStatuss = result;
        });
        this._supportTicketNotificationsServiceProxy.getAllSmsTemplateForTableDropdown().subscribe(result => {
            this.allSmsTemplates = result;
        });
        this._supportTicketNotificationsServiceProxy.getAllUserForTableDropdown().subscribe(result => {
            this.allUsers = result;
        });

        this._supportTicketNotificationsServiceProxy.getAllOrgUnitsForTableDropdown().subscribe(result => {
            this.allOrganizationUnits = result;
        });

        this._supportTicketNotificationsServiceProxy.getAllTenantsForTableDropdown().subscribe(result => {
            this.allTenants = result;
        });

    }

    save(): void {
        this.saving = true;

        this.form = new CreateOrEditSupportTicketNotificationDto();
        if (this.supportTicketNotification.id) {
            this.form.id = this.supportTicketNotification.id;
        }

        this.form.code = this.supportTicketNotification.code;
        this.form.isActive = this.supportTicketNotification.isActive;
        this.form.description = this.supportTicketNotification.description;

        this.form.supportTicketNotificationRecipients = new CreateOrEditSupportTicketNotificationRecipientsDto();

        this.form.supportTicketNotificationRecipients = this.recipient;

        this.form.orderNotificationTemplateId = Number((<HTMLInputElement>document.getElementById('orderNotificationTemplateId')).value);
        this.form.smsTemplateId = Number((<HTMLInputElement>document.getElementById('smsTemplateId')).value);
        this.form.supportTicketStatusId = Number((<HTMLInputElement>document.getElementById('supportTicketStatusId')).value);
        this.form.tenantId = Number((<HTMLInputElement>document.getElementById('tenantId')).value);

        this._supportTicketNotificationsServiceProxy.createOrEdit(this.form)
            .pipe(finalize(() => { this.saving = false; }))
            .subscribe(() => {
                this.notify.info(this.l('SavedSuccessfully'));
                this.close();
                this.modalSave.emit(null);
            });
    }

    addRecipient(): void {
        let s = this;

        this.unit = new CreateOrEditSupportTicketNotificationRecipientsDto();

        this.unit.isEmail = false;
        this.unit.isSMS = false;
        this.unit.isActive = false;
        this.unit.organizationUnitId = null;
        this.unit.emailAddress = "";
        this.unit.phoneNumber = "";
        this.unit.code = null;
        this.unit.userId = null;

        this.recipient.push(this.unit);
        setTimeout(() => {
            $('.organization-unit').select2();
            $('.user').select2();
        }, 10);

        console.log(this.unit);
    }

    updateUnits(id, data): void {
        this.recipient[id].organizationUnitId = data;

        setTimeout(() => {
            $('.organization-unit').select2();
            $('.user').select2();
        }, 100);
    }

    updateUsers(id, data): void {
        this.recipient[id].userId = data;


        setTimeout(() => {
            $('.organization-unit').select2();
            $('.user').select2();
        }, 100);

    }

    updateRecipientType(id, data): void {
        let s = this;
        this.recipient[id].code = data;

        setTimeout(() => {
            $('.organization-unit').select2();
            $('.user').select2();

            $('.organization-unit').on('select2:select', function (e) {
                s.updateUnits($(e.currentTarget).attr('id'), $(e.currentTarget).val());
            });
            $('.user').on('select2:select', function (e) {
                s.updateUsers($(e.currentTarget).attr('id'), $(e.currentTarget).val());
            });
        }, 100);
    }

    updateSms(id, data): void {
        this.recipient[id].isSMS = data;
    }
    updateEmail(id, data): void {
        this.recipient[id].isEmail = data;
    }

    close(): void {
        this.active = false;
        this.modal.hide();
    }

    deleteRecipient(id: number): void {
        this.delete = this.recipient[id];
        this._supportTicketNotificationRecipientsServiceProxy.delete(this.delete.id)
            .subscribe(() => {
                this.notify.success(this.l('SuccessfullyDeleted'));
            });
        this.recipient.splice(id, 1);
    }
}