import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { NbDialogService } from '@nebular/theme';
import { Observable } from 'rxjs';
import { first } from 'rxjs/operators';
import { LineMessagingAccount } from '../../../entity/LineMessagingAccount';
import { ScreenBase } from '../../../ScreenBase';
import { LineMessagingAccountService } from '../../../services/crudServices/line-messaging-account.service';
import { LogService } from '../../../services/crudServices/log.service';
import { MsgBoxService } from '../../../services/msg-box.service';
import { StateService } from '../../../services/state.service';
import { FancySettings } from '../../../ui/fancy-table/fancy-settings.model';
import { FancyTableComponent } from '../../../ui/fancy-table/fancy-table.component';
import { ObjectUtils } from '../../../utilities/object-utils';
import { LineMessagingAccountEditorComponent } from '../line-messaging-account-editor/line-messaging-account-editor.component';

@Component({
  selector: 'ngx-line-messaging-account',
  templateUrl: './line-messaging-account.component.html',
  styleUrls: ['./line-messaging-account.component.scss']
})
export class LineMessagingAccountComponent extends ScreenBase<LineMessagingAccount> {


  @ViewChild(FancyTableComponent, { static: false }) fancyTable: FancyTableComponent<LineMessagingAccount>;
  data: LineMessagingAccount;
  selectedIndex: number = 0;

  constructor(
    private lineMessagingAccountService: LineMessagingAccountService,
    private msgBoxService: MsgBoxService,
    private dlgService: NbDialogService,
    protected stateService: StateService,
    protected route: ActivatedRoute,
  ) {
    super(lineMessagingAccountService, stateService, route);
  }

  //#region Table Setting
  settings = <FancySettings<LineMessagingAccount>>{
    contextMenuItems: [
      {
        id: 'add',
        enabled: true,
        title: 'Add New',
        icon: 'plus-circle-outline',
        callback: (datum, element) => {
          this.openEditingDialog(true);
        },
      },
      {
        id: 'edit',
        enabled: true,
        title: 'Edit',
        icon: 'edit',
        callback: (datum, element) => {
          this.openEditingDialog(false);
        },
      },
      {
        enabled: true,
        id: 'delete',
        title: 'Delete',
        icon: 'trash-2-outline',
        callback: (datum, element) => {
          this.delete(datum);
        },
      }],
    onContextMenuOpening: (datum, menuItems) => {
      menuItems.find(i => i.id == 'delete').visible = !!datum;
      menuItems.find(i => i.id == 'edit').visible = !!datum;
      return datum;
    },
    columns: [
      {
        name: 'seq',
        title: 'Seq',
        type: 'text',
        widthPx: 50,
        sortDirection: 'asc'
        //valuePrepareFunction: (item) => ,
      },
      {
        name: 'name',
        title: 'Name',
        type: 'text',
        widthPx: 200,
        //valuePrepareFunction: (item) => ,
      },
      {
        name: 'chatToken',
        title: 'Chat Token',
        type: 'text',
        widthPx: 300,
        //valuePrepareFunction: (item) => ,
      },
      {
        name: 'totalUsage',
        title: 'Total Usage',
        type: 'number',
        widthPx: 100,
        //valuePrepareFunction: (item) => ,
      },

    ],

  };
  //#endregion

  //#region Implements Methods
  screenOnInit(): void {
    //this.screen = 'LineMessagingAccount';
  }
  get saveMethod(): Observable<any> {
    return Observable.of(true);
  }
  //#endregion

  //#region UI Calling Methods
  openEditingDialog(isAdding: boolean) {
    this.dlgService.open(LineMessagingAccountEditorComponent, {
      context: {
        data: isAdding ? null : ObjectUtils.CloneValue(this.allData[this.selectedIndex]),
        isAdding: isAdding
      }
    }).onClose.pipe(first()).subscribe(result => {
      if (result) {
        this.runGetAllData();
      }
    });
  }

  //#endregion

  //#region CRUD Methods
  delete(datum) {
    this.msgBoxService.showConfirmDeleteBox().pipe(first()).subscribe(answer => {
      if (answer === true) {
        this.isLoading = true;
        this.lineMessagingAccountService.delete(datum).pipe(first()).subscribe(result => {
          this.isLoading = false;
          this.allData.splice(this.selectedIndex, 1);
          this.fancyTable.reload();
        });
      }
    });
  }
  refreshQuota() {
    this.isLoading = true;
    this.lineMessagingAccountService.refreshAllQuota().pipe(first()).subscribe(result => {
      this.runGetAllData();
    });
  }
  //#endregion

}
