@bizdoc/core 1.13.8 → 1.13.12

package/src/lib/chat/conversation.component.html

@@ -0,0 +1,28 @@
+<div (wheel)="onScroll($event)" class="chat-conversation" #conversation>
+  <bizdoc-none *ngIf="!items.length" title="Chat" icon="chat"></bizdoc-none>
+
+  <ng-container *ngFor="let item of items; let i = index; trackBy: trackBy">
+    <div class="chat-item" [class.you]="item.userId!==contact.id">
+      <div class="chat-text" [innerHTML]="item.text|taggingHtml:item.resource"></div>
+      <img *ngIf="item.image" [src]="'data:image/png;base64,'+item.image" alt="" (click)="preview(item)" />
+      <div class="chat-info" *ngIf="(i===items.length - 1)||item.userId!==items[i+1].userId">
+        <small>
+          <bizdoc-identity-name [identity]="item.userId" chating="none">
+          </bizdoc-identity-name>
+        </small>
+        <span class="divider"></span>
+        <small class="chat-time" [bizdocTooltip]="item.time | amDateFormat: 'lll'">{{item.time | amCalendar : null : CALENDAR_SPEC }}</small>
+      </div>
+    </div>
+    <div class="chat-watermark" *ngIf="watermark && ((i<items.length - 1 && items[i+1].time>watermark&&item.time<=watermark)||(i===items.length - 1 &&item.time<=watermark))">
+      <mat-icon [bizdocTooltip]="'Watched' | translate : (watermark | amTimeAgo)">done_all</mat-icon>
+    </div>
+  </ng-container>
+</div>
+<div class="chat-typing" [style.visibility]="typing ? 'visible':'hidden'" [innerHTML]="(profile?.gender === 'Male' ? 'TypingMale' : profile?.gender === 'Female' ? 'TypingFemale' : 'Typing') | translate : (profile?.nick || profile?.name)"></div>
+
+<bizdoc-edit-text (ok)="send($event)" (focus)="onFocus()"
+                  (focusout)="onBlur()" [disabled]="sending" (change)="_textChange.next()"></bizdoc-edit-text>
+<ng-template #previewTemplate let-item="item">
+  <img [src]="'data:image/png;base64,'+item.image" alt="" />
+</ng-template>

package/src/lib/chat/conversation.component.scss

@@ -0,0 +1,14 @@
+:host {
+  display: flex;
+  flex-direction: column;
+  flex: 1 auto;
+  overflow-y: auto;
+}
+.chat-conversation {
+  -ms-flex: 1 1 auto;
+  -webkit-flex: 1 1 auto;
+  flex: 1 1 auto;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding: 0 4px 0 4px;
+}

package/src/lib/chat/conversation.component.ts

@@ -0,0 +1,186 @@
+import { Component, ElementRef, ViewChild, OnInit, Input, TemplateRef, ViewContainerRef, OnChanges, SimpleChanges, Inject } from '@angular/core';
+import { Overlay } from '@angular/cdk/overlay';
+import { TemplatePortal } from '@angular/cdk/portal';
+import { ESCAPE } from '@angular/cdk/keycodes';
+import { merge, Subject } from 'rxjs';
+import { takeUntil, debounceTime, filter } from 'rxjs/operators';
+import { CalendarSpec } from "../core/pipes/calendar.pipe";
+import { Chat, Contact, UserInfo } from '../core/models';
+import { HubService } from '../core/hub.service';
+import { ChatService } from './chat.service';
+import { TranslateService } from '../core/translate.service';
+import { AccountService } from '../core/account.service';
+import { PromptService } from '../core/prompt.service';
+import { EditInputComponent, EditTextEvent } from '../core/tagging/edit-input.component';
+import { OnDestroy } from '@angular/core';
+import { BizDocConfig, BIZDOC_CONFIG, ChatSettings } from '../core/configuration';
+
+const CONTACT_TYPING_NOTE = 1500;
+
+@Component({
+  selector: 'bizdoc-chat-conversation',
+  templateUrl: './conversation.component.html',
+  styleUrls: ['./conversation.component.scss']
+})
+export
+  class ConversationComponent implements OnInit, OnChanges, OnDestroy {
+  @Input() public contact: Contact;
+  profile: UserInfo;
+  items: Chat[] = [];
+  typing = false;
+  watermark: Date;
+  sending = false;
+  working = false;
+  readonly CALENDAR_SPEC: CalendarSpec = {
+    lastDay: `[${this._translate.get('Yesterday')}] HH:mm`,
+    lastWeek: 'ddd HH:mm',
+    sameDay: 'HH:mm',
+    sameElse: 'MMM D HH:mm'
+  };
+  @ViewChild(EditInputComponent, { static: true }) _input: EditInputComponent;
+  @ViewChild('conversation', { read: ElementRef, static: true }) conversationElement: ElementRef<HTMLDivElement>;
+  @ViewChild('previewTemplate') previewTemplate: TemplateRef<any>;
+  private _inFocus = false;
+  private _top = false;
+  private _typingTask: NodeJS.Timeout;
+  private _preserveDraft: boolean;
+  readonly _textChange = new Subject<void>();
+  private readonly _destroy = new Subject<void>();
+  constructor(
+    @Inject(BIZDOC_CONFIG) config: BizDocConfig,
+    private _service: ChatService,
+    private _messaging: HubService,
+    private _translate: TranslateService,
+    private _accounts: AccountService,
+    private _sb: PromptService,
+    private _vc: ViewContainerRef,
+    private _overlay: Overlay
+  ) {
+    this._preserveDraft = config.chating && (config.chating as ChatSettings).preserveDraft;
+  }
+  ngOnInit(): void {
+    this._messaging.chatTyping$.pipe(takeUntil(this._destroy)).subscribe(e => {
+      if (e.contactId === this.contact.id) {
+        clearTimeout(this._typingTask);
+        this._typingTask = setTimeout(() => this.typing = false, CONTACT_TYPING_NOTE);
+        this.typing = true;
+      }
+    });
+    this._messaging.chat$.pipe(takeUntil(this._destroy)).subscribe(e => {
+      if (e.contactId === this.contact.id) {
+        this.items.push(e.model);
+        this._scrollToBottom();
+        this._inFocus && this._seen();
+      }
+    });
+    this._messaging.chatWatermark$.pipe(takeUntil(this._destroy)).subscribe(e => {
+      if (e.contactId === this.contact.id) this.watermark = e.time;
+    });
+    this._textChange.pipe(debounceTime(350), takeUntil(this._destroy)).subscribe(() =>
+      this._service.typing(this.contact.id));
+  }
+  ngOnChanges(_: SimpleChanges): void {
+    this.profile &&
+      this._preserveDraft && this._persist();
+
+    this._accounts.get(this.contact.id).subscribe(u => {
+      this.profile = u;
+    }, () => this._sb.error());
+    // latest
+    this.watermark = this.contact.visited || this.contact.watermark ? (this.contact.visited && this.contact.watermark ?
+      this.contact.watermark > this.contact.visited ?
+        this.contact.watermark : this.contact.visited :
+      this.contact.watermark || this.contact.visited) : null;
+    // fetch
+    this._service.conversations(this.contact.id).subscribe(cs => {
+      this.items = cs.reverse();
+      this._scrollToBottom();
+      !this.contact.count &&
+        this.focus();
+    }, () =>
+      this._sb.error());
+    if (this._preserveDraft) {
+      const text = localStorage.getItem(this.contact.id);
+      if (text) this._input.text = text;
+    }
+  }
+  trackBy = (_, item: Chat) => item.id;
+
+  private _scrollToBottom(): void {
+    setTimeout(() => {
+      try {
+        this.conversationElement.nativeElement.scrollTop = this.conversationElement.nativeElement.scrollHeight;
+      } catch (e) {
+        console.error(e)
+      }
+    });
+  }
+  onScroll(e: MouseEvent) {
+    const el = this.conversationElement.nativeElement;
+    if (el.scrollTop < 10 && !this._top && !this.working) {
+      this.working = true;
+      this._service.conversations(this.contact.id, this.items.length ? this.items[0].time : null).subscribe(is => {
+        if (is.length)
+          this.items = is.reverse().concat(this.items)
+        else
+          this._top = true;
+        this.working = false;
+      });
+      e.preventDefault();
+    }
+  }
+  send(evt: EditTextEvent) {
+    this.sending = true;
+    this._service.send(this.contact.id, evt).subscribe(c => {
+      this.items.push(c);
+      this._input.clear();
+      this._scrollToBottom();
+      this.sending = false;
+    }, e => {
+      this.sending = false;
+      this._sb.error()
+    });
+  }
+
+  onFocus() {
+    this._inFocus = true;
+    this._service.active = this.contact.id;
+    this.contact.count && this._seen();
+  }
+  onBlur() {
+    this._service.active = null;
+    this._inFocus = false;
+  }
+  private _seen() {
+    this._service.seen(this.contact.id).subscribe(e => {
+      this.watermark = e.time;
+      this._scrollToBottom();
+    });
+  }
+
+  focus() {
+    this._input.focus();
+  }
+  preview(item: Chat) {
+    const oRef = this._overlay.create({
+      hasBackdrop: true,
+      disposeOnNavigation: true,
+      positionStrategy: this._overlay.position().global().centerHorizontally().centerVertically(),
+    });
+    oRef.attach(new TemplatePortal(this.previewTemplate, this._vc, { item }));
+    merge(oRef.keydownEvents().pipe(filter(k => k.keyCode === ESCAPE)), oRef.backdropClick()).subscribe(() => oRef.detach());
+  }
+
+  ngOnDestroy(): void {
+    if (this._typingTask) clearTimeout(this._typingTask);
+    this._destroy.next();
+    this._destroy.complete();
+
+    this._preserveDraft && this._persist();
+  }
+
+  private _persist() {
+    this._input.text && this._input.text.length &&
+      window.localStorage.setItem(this.profile.id, this._input.text);
+  }
+}

package/src/lib/chat/conversation.pane.component.ts

@@ -0,0 +1,46 @@
+import { Component, OnDestroy } from '@angular/core';
+import { Subject, takeUntil } from 'rxjs';
+import { Contact } from '../core/models';
+import { PaneRef } from '../core/slots/pane-ref';
+import { SessionService } from '../core/session.service';
+import { AccountService } from '../core/account.service';
+import { ChatService } from './chat.service';
+import { TranslateService } from '../core/translate.service';
+
+@Component({
+  template: '<bizdoc-chat-conversation [contact]=contact></bizdoc-chat-conversation>',
+  styles: [`:host{
+  min-width: 320px;
+}`],
+  host: {
+    class: 'pane'
+  }
+})
+export
+  class ConversationPaneComponent implements OnDestroy {
+  contact: Contact;
+  private readonly _destroy = new Subject<void>();
+  constructor(
+    pane: PaneRef,
+    translate: TranslateService,
+    accounts: AccountService,
+    chat: ChatService,
+    session: SessionService) {
+    pane.paramsChange.subscribe(p => {
+      pane.group = translate.get('Chat');
+      const id = p['id'];
+      this.contact = session.profile.contacts.find(c => c.id === id) || {} as any;
+      accounts.get(id).subscribe(u =>
+        pane.title = u.name);
+    });
+    chat.change.pipe(takeUntil(this._destroy)).
+      subscribe(c => {
+        if (c.id === this.contact.id)
+          pane.badge = c.count;
+      })
+  }
+  ngOnDestroy(): void {
+    this._destroy.next();
+    this._destroy.complete();
+  }
+}

package/src/lib/compose/_compose-theme.scss

@@ -0,0 +1,63 @@
+@mixin compose-theme($theme) {
+  $primary: map-get($theme, primary);
+  $accent: map-get($theme, accent);
+  $background: map-get($theme, background);
+  $foreground: map-get($theme, foreground);
+
+  $background-color: mat.get-color-from-palette($background, card);
+  $border-color: mat.get-color-from-palette($primary, 600);
+
+  .form-container {
+    color: mat.get-color-from-palette($foreground, text)
+  }
+
+  .form-header {
+    padding: 4px
+  }
+
+  .compose-note {
+    padding: 5px;
+    /*border-left: 5px solid $border-color;*/
+    /*background: $background-color;*/
+    margin: 5px 5px;
+
+    .mat-icon {
+      vertical-align: middle;
+      padding: 0 4px;
+    }
+
+    span {
+      vertical-align: text-top;
+    }
+  }
+
+  [dir=rtl] .compose-note {
+    border-left: none;
+    /*border-right: 4px solid $border-color;*/
+  }
+
+  .file-upload {
+    cursor: default
+  }
+
+  .file-dropable {
+    /*pointer-events: none;*/
+    &.drag {
+      opacity: .5;
+      /*width: 100%;*/
+      /*height: 100%;*/
+      overflow: hidden;
+      margin: 8px;
+      border-style: dashed;
+      border-color: #777;
+      border-width: 5px;
+      background-color: whitesmoke;
+      z-index: 2;
+      /*position: absolute;*/
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+    }
+  }
+}

package/src/lib/compose/action/action-picker.component.html

@@ -0,0 +1,25 @@
+<ng-container *ngIf="actions.length">
+  <button mat-raised-button color="primary" [attr.data-help]="'action-'+actions[0].name" (click)="send(actions[0])" [disabled]="working">
+    <span>{{actions[0].title}}</span>
+  </button>
+  &nbsp;
+  <ng-container [ngSwitch]="actions.length">
+    <button mat-stroked-button [attr.data-help]="'action-'+actions[1].name" *ngSwitchCase="2" [disabled]="working" (click)="send(actions[1])">
+      <span>{{actions[1].title}}</span>
+    </button>
+    <ng-container *ngSwitchDefault>
+      <button mat-stroked-button data-help="send" [matMenuTriggerFor]="actionMenu" [disabled]="working" [bizdocTooltip]="'Send' | translate">
+        <span>{{'Actions' | translate}}</span> <mat-icon>arrow_drop_down</mat-icon>
+      </button>
+      <!-- action -->
+      <mat-menu #actionMenu>
+        <ng-template matMenuContent>
+          <ng-container *ngFor="let a of actions.slice(1); let i = index">
+            <mat-divider *ngIf="i > 1 && actions[i - 1].group !== a.group"></mat-divider>
+            <button mat-menu-item (click)="send(a)">{{a.title}}</button>
+          </ng-container>
+        </ng-template>
+      </mat-menu>
+    </ng-container>
+  </ng-container>
+</ng-container>

package/src/lib/compose/action/action-picker.component.scss

@@ -0,0 +1,4 @@
+:host {
+  display: flex;
+  flex-direction: row;
+}

package/src/lib/compose/action/action-picker.component.ts

@@ -0,0 +1,72 @@
+import { AfterViewInit, EventEmitter, Inject, OnChanges, Output, SimpleChanges } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+import { queryParams } from '../../core/functions';
+import { DOCUMENT_MODEL, MailboxService } from '../../core/mailbox.service';
+import { Action, RecipientModel } from '../../core/models';
+import { SessionService } from '../../core/session.service';
+import { ActionDialog, ActionDialogData } from './action.dialog';
+import { ActionBase } from './action.base';
+import { PromptService } from '../../core/prompt.service';
+import { AccountService } from '../../core/account.service';
+import { TranslateService } from '../../core/translate.service';
+
+@Component({
+  selector: 'bizdoc-action-picker',
+  templateUrl: './action-picker.component.html',
+  styleUrls: ['./action-picker.component.scss'],
+})
+/** action-picker component*/
+export class ActionPicker extends ActionBase implements OnChanges, AfterViewInit {
+  @Input() working = false;
+  @Output() readonly workingChange = new EventEmitter<boolean>();
+  actions: Action[] = [];
+  constructor(
+    @Inject(DOCUMENT_MODEL) public model: RecipientModel<any>,
+    private _session: SessionService,
+    mailbox: MailboxService,
+    private _dialog: MatDialog,
+    accounts: AccountService,
+    translate: TranslateService,
+    sb: PromptService
+  ) {
+    super(mailbox, accounts, sb, translate);
+  }
+  ngAfterViewInit(): void {
+    const btn = (document.querySelector('[data-help=send]') as HTMLButtonElement);
+    if (btn) btn.style.display = 'none';
+  }
+  ngOnChanges(changes: SimpleChanges): void {
+    if (changes['model'])
+      this.actions = this._session.profile.actions.filter(a => this.model.actions.indexOf(a.name) > -1).
+        sort(this._sortActions);
+  }
+  private _sortActions(a: Action, b: Action) {
+    if (a.group && b.group && a.group !== b.group)
+      return a.group < b.group ? -1 : 1;
+    return 0;
+  }
+  send(action: Action) {
+    this._dialog.open(ActionDialog, {
+      data: {
+        action: action.name,
+        item: this.model
+      } as ActionDialogData,
+      closeOnNavigation: true
+    }).afterClosed().subscribe(args => {
+      if (args) {
+        const params = queryParams(args);
+        this.workingChange.emit(true);
+        this.working = true;
+        return super._ok(action, params).
+          subscribe(() => {
+            this.working = false;
+            this.workingChange.emit(false);
+          }, e => {
+            this.working = false;
+            this.workingChange.emit(false);
+          });
+      }
+    })
+  }
+}

package/src/lib/compose/action/action-ref.ts

@@ -0,0 +1,19 @@
+import { Action, RecipientModel } from "../../core/models";
+
+export class ActionRef<T = any> {
+  public get name(): string {
+      return this._action.name;
+  }
+  public get options(): T {
+      return this._action.options;
+  }
+  public get item(): RecipientModel {
+      return this._items[0];
+  }
+  public get items(): RecipientModel[] {
+      return this._items;
+  }
+  constructor(private _items: RecipientModel[], private _action: Action) {
+
+  }
+}

package/src/lib/compose/action/action.base.ts

@@ -0,0 +1,58 @@
+import { HttpErrorResponse } from '@angular/common/http';
+import { tap } from 'rxjs';
+import { Action, RecipientModel } from '../../core/models';
+import { AccountService } from '../../core/account.service';
+import { MailboxService } from '../../core/mailbox.service';
+import { PromptService } from '../../core/prompt.service';
+import { TranslateService } from '../../core/translate.service';
+
+export abstract class ActionBase {
+  public model: RecipientModel<any>;
+  constructor(
+    private _mailbox: MailboxService,
+    private _accounts: AccountService,
+    protected _sb: PromptService,
+    private _translate: TranslateService
+  ) { }
+  protected _ok(action: Action, args) {
+    const { id, version, number, model, formId } = this.model;
+    return this._mailbox.send(id, version, formId, model, action.name, args).
+      pipe(tap(r => {
+        const origin = r.recipients.filter(r => r.originId === id);
+        if (origin.length)
+          this._accounts.getAll(origin.map(r => r.userId)).subscribe(u =>
+            this._sb.toast('SentTo', number, (action.adjective || action.past || action.title).toLowerCase(), this._translate.join(u.map(u => u.name))));
+        else
+          this._sb.toast('Sent', number, (action.adjective || action.past || action.title).toLowerCase());
+      }, e => {
+        this._handleError(e, 'SendErr');
+      }));
+  }
+  private _handleError(response: HttpErrorResponse | any, message: string, ...args: string[]) {
+    if (response.constructor.name === 'PositionError')
+      switch (response.code) {
+        case 1:
+          this._sb.error('UserDeniedGeoErr');
+          break;
+        default:
+          this._sb.error('GeoErr');
+      }
+
+    else
+      switch (response.status) {
+        case 401:
+          break;
+        case 409: // version change
+          {
+            const obj = response.error /* serialized model */ as RecipientModel<any>;
+            this._sb.error('VersionErr', this.model.number);
+            break;
+          }
+        case 406: // validation exception
+          this._sb.errorString(response.error);
+          break;
+        default:
+          this._sb.error(message, ...args);
+      }
+  }
+}

package/src/lib/compose/action/action.dialog.html

@@ -0,0 +1,17 @@
+<h2 mat-dialog-title>{{action.title}}</h2>
+<mat-dialog-content fxLayout="column">
+  <p *ngIf="!action.arguments.length">
+    {{ 'ActionAsk' | translate : (action.verb || action.title).toLowerCase() }}
+  </p>
+  <bizdoc-layout [fields]="action.arguments"
+              *ngIf="!action.template; else template"
+              [(model)]="arguments"
+              [(valid)]="valid"></bizdoc-layout>
+</mat-dialog-content>
+<mat-dialog-actions>
+  <button mat-button type="submit" [disabled]="!valid" [mat-dialog-close]="arguments" color="primary">{{'Yes'|translate}}</button>
+  <button mat-button mat-dialog-close>{{'No' | translate}}</button>
+</mat-dialog-actions>
+<ng-template #template>
+  <ngx-component-outlet [type]="comp" [injector]="injector" (create)="bind($event)"></ngx-component-outlet>
+</ng-template>

package/src/lib/compose/action/action.dialog.scss

@@ -0,0 +1 @@
+:host ::ng-deep form{display:flex}

package/src/lib/compose/action/action.dialog.ts

@@ -0,0 +1,57 @@
+import { Component, Inject, Injector, OnDestroy, OnInit, TemplateRef, Type, ViewChild, ViewContainerRef } from '@angular/core';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { SessionService } from '../../core/session.service';
+import { Action, RecipientModel } from '../../core/models';
+import { ArgumentsComponent } from '../../core/base';
+import { BizDocComponentFactoryResolver } from '../../core/component-factory-resolver';
+import { ActionRef } from './action-ref';
+
+@Component({
+  templateUrl: './action.dialog.html',
+  styleUrls: ['./action.dialog.scss']
+})
+/** action-dialog component*/
+export class ActionDialog implements OnInit, OnDestroy {
+  readonly action: Action;
+  arguments = {};
+  valid: boolean;
+  @ViewChild('container', { read: ViewContainerRef }) container: ViewContainerRef;
+  /** action-dialog ctor */
+  private readonly _destroy = new Subject<void>();
+  injector: Injector;
+  comp: Type<ArgumentsComponent>;
+  constructor(@Inject(MAT_DIALOG_DATA) public data: ActionDialogData, session: SessionService,
+    private _fr: BizDocComponentFactoryResolver) {
+    this.action = session.profile.actions.find(a => a.name === data.action);
+  }
+  ngOnInit(): void {
+    if (this.action.template) {
+      this.injector = Injector.create([{
+        provide: ActionRef,
+        useValue: new ActionRef(this.data.items || [this.data.item], this.action)
+      }]);
+      this.comp = this._fr.component(this.action.template);
+    }
+    else {
+      if (this.action.arguments.length === 0)
+        this.valid = true;
+    }
+  }
+  bind(instance: ArgumentsComponent) {
+    instance.form.valueChanges.pipe(takeUntil(this._destroy)).subscribe(v => this.arguments = v);
+    instance.form.statusChanges.pipe(takeUntil(this._destroy)).
+      subscribe(() => this.valid = instance.form.valid);
+  }
+  ngOnDestroy(): void {
+    this._destroy.next();
+    this._destroy.complete();
+  }
+}
+export interface ActionDialogData {
+  action: string;
+  item?: RecipientModel<any>;
+  items?: RecipientModel<any>[];
+}
+

package/src/lib/compose/action/action.pane.dialog.exp.ts

@@ -0,0 +1,77 @@
+import { Component, ComponentFactoryResolver, EventEmitter, OnDestroy, OnInit, ViewChild, ViewContainerRef } from '@angular/core';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { SessionService } from '../../core/session.service';
+import { Action } from '../../core/models';
+import { ArgumentsComponent } from '../../core/base';
+import { BizDocComponentFactoryResolver } from '../../core/component-factory-resolver';
+import { LayoutComponent } from '../../core/layout/layout.component';
+import { PaneRef } from '../../core/slots/pane-ref';
+import { MailboxService } from '../../core/mailbox.service';
+import { PromptService } from '../../core/prompt.service';
+import { ParamMap } from '../../core/configuration';
+import { ActionBase } from './action.base';
+import { AccountService } from '../../core/account.service';
+import { TranslateService } from '../../core/translate.service';
+
+@Component({
+  selector: 'bizdoc-action-dialog.pane',
+  templateUrl: './action.pane.dialog.html',
+  styleUrls: ['./action.dialog.scss'],
+  host: {
+    class: 'pane'
+  }
+})
+/** action-dialog component*/
+export class ActionPaneComponent extends ActionBase implements OnInit, OnDestroy {
+  @ViewChild('container') container: ViewContainerRef;
+  arguments = {};
+  readonly action: Action;
+  valid: boolean;
+  readonly okChange = new EventEmitter<ParamMap>();
+  private readonly _destroy = new Subject<void>();
+  /** action-dialog ctor */
+  constructor(
+    private _pane: PaneRef<ActionPaneComponent>,
+    mailbox: MailboxService,
+    private _fr: BizDocComponentFactoryResolver,
+    private _fr2: ComponentFactoryResolver,
+    accounts: AccountService,
+    sb: PromptService,
+    translate: TranslateService,
+    session: SessionService) {
+    super(mailbox, accounts, sb, translate);
+    this.model = _pane.data.item;
+    this.action = session.profile.actions.find(a => a.name === _pane.params.action);
+  }
+  close() { this._pane.close(); }
+  ok() {
+    super._ok(this.action, this.arguments).subscribe(() =>
+      this.close()
+    );
+  }
+  ngOnInit(): void {
+    if (this.action.template) {
+      const factory = this._fr.resolve(this.action.template);
+      const cRef = this.container.createComponent(factory);
+      (cRef.instance as ArgumentsComponent).form.valueChanges.pipe(takeUntil(this._destroy)).subscribe(v => this.arguments = v);
+      (cRef.instance as ArgumentsComponent).form.statusChanges.pipe(takeUntil(this._destroy)).
+        subscribe(() => this.valid = (cRef.instance as ArgumentsComponent).form.valid);
+    }
+    else {
+      if (this.action.arguments.length === 0)
+        this.valid = true;
+      else {
+        const factory = this._fr2.resolveComponentFactory(LayoutComponent);
+        const cRef = this.container.createComponent(factory);
+        cRef.instance.fields = this.action.arguments;
+        cRef.instance.modelChange.pipe(takeUntil(this._destroy)).subscribe(v => this.arguments = v);
+        cRef.instance.validChange.pipe(takeUntil(this._destroy)).subscribe(v => this.valid = v);
+      }
+    }
+  }
+  ngOnDestroy(): void {
+    this._destroy.next();
+    this._destroy.complete();
+  }
+}