import { Component, ViewChild, Injector, Output, EventEmitter} from '@angular/core';
import { ModalDirective } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';
import { ContainersServiceProxy, CreateContainerInputDto } from '@shared/service-proxies/service-proxies';
import { AppComponentBase } from '@shared/common/app-component-base';
import * as moment from 'moment';

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

    @ViewChild('createOrEditModal', { static: true }) modal: ModalDirective;
    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    active: boolean = false;
    saving = false;
    container: CreateContainerInputDto = new CreateContainerInputDto();
    public color: string = '#2889e9';

    constructor(
        injector: Injector,
        private _containerServiceProxy: ContainersServiceProxy
    ) {
        super(injector);
    }

    show(container: any): void {
        if (!container) {
            this.container = new CreateContainerInputDto();
            this.container.color = '#000000';
            this.container.inActive = !this.active ? true : false;
            this.modal.show();
        } else {
            this.modal.show();

            this.active = container.inActive == false ? true : false;
            this.container.code = container.code;
            this.container.color = container.color;
            this.container.name = container.name;
            this.container.sortOrder = container.sortOrder;
            this.container.price = container.price == null ? 0 : container.price;
            this.container.size = container.size == null ? 0 : container.price;
        }
    }

    save(): void {
        this.saving = true;
        this.container.inActive = this.active ? false : true;

        this._containerServiceProxy.createOrUpdate(this.container)
            .pipe(finalize(() => { this.saving = false;}))
            .subscribe(() => {
            this.notify.info(this.l('SavedSuccessfully'));
            this.close();
            this.modalSave.emit(null);
            });
    }

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