import { Component, OnInit } from '@angular/core';
import { ModalOptions, NzModalService, NzNotificationService } from 'ng-zorro-antd';
import { DynamicComponentItem, MessageModel, MessageService } from 'pz-unit';

@Component({
    selector: 'app-message',
    template: `
        <ng-template></ng-template>
        <nz-drawer [nzClosable]="false" [nzVisible]="visible" nzPlacement="right" [nzWidth]="width"
                   [nzTitle]=componentItem?.title
                   (nzOnClose)="close()">
            <app-components-dynamic-component-container [componentItem]="componentItem"></app-components-dynamic-component-container>
        </nz-drawer>`
})

export class MessageComponent implements OnInit {
    public visible: boolean;
    public componentItem: DynamicComponentItem | null;
    public width: number | string = 640;

    public constructor(private msg: NzNotificationService,
                       private modal: NzModalService,
                       private msgSevice: MessageService) {

    }

    public ngOnInit() {
        this.msgSevice.growlSubject.subscribe(
            (res: MessageModel) => {
                this.msg.create(res.type, res.title, res.content);
            }
        );
        this.msgSevice.confirmSubject.subscribe(
            (res: { method: string, confirm: ModalOptions }) => {
                this.modal[res.method](res.confirm);
            }
        );
        this.msgSevice.drawerSubject.subscribe(
            (v: DynamicComponentItem | null) => {
                if (v === null) {
                    this.visible = false;
                    this.componentItem = null;
                } else {
                    this.visible = true;
                    this.componentItem = v;
                }
            }
        );
    }

    public close(): void {
        this.visible = false;
    }
}