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 { Log, LogLevel } from '../../entity/Log';
import { ScreenBase } from '../../ScreenBase';
import { LogService } from '../../services/crudServices/log.service';
import { MsgBoxService } from '../../services/msg-box.service';
import { StateService } from '../../services/state.service';
import { FancyTag } from '../../ui/fancy-table/fancy-row-column.model';
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 { LogDetailComponent } from './log-detail/log-detail.component';

@Component({
  selector: 'ngx-logs',
  templateUrl: './logs.component.html',
  styleUrls: ['./logs.component.scss']
})
export class LogsComponent extends ScreenBase<Log> {


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

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

  //#region Table Setting
  settings = <FancySettings<Log>>{
    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: 'trackNo',
        title: 'Track No',
        type: 'text',
        widthPx: 50,
        sortDirection: 'desc'
        //valuePrepareFunction: (item) => ,
      },
      {
        name: 'level',
        title: 'Level',
        type: 'tag',
        widthPx: 50,
        tagsPrepareFunction: item => this.levelTagPrepareFunc(item),
        filterPreparedValue: true
        //valuePrepareFunction: (item) => ,
      },
      // {
      //   name: 'url',
      //   title: 'Url',
      //   type: 'text',
      //   widthPx: 150,
      //   //valuePrepareFunction: (item) => ,
      // },
      {
        name: 'source',
        title: 'Source',
        type: 'text',
        widthPx: 100,
        //valuePrepareFunction: (item) => ,
      },
      {
        name: 'message',
        title: 'Message',
        type: 'text',
        widthPx: 200,
        //valuePrepareFunction: (item) => ,
      },
      {
        name: 'detailMessage',
        title: 'Detail Message',
        type: 'text',
        widthPx: 200,
        //valuePrepareFunction: (item) => ,
      },
      // {
      //   name: 'stackTrace',
      //   title: 'Stack Trace',
      //   type: 'text',
      //   widthPx: 100,
      //   //valuePrepareFunction: (item) => ,
      // },
      {
        name: 'time',
        title: 'Time',
        type: 'dateTime',
        widthPx: 100,
        //valuePrepareFunction: (item) => ,
      },

    ],

  };
  //#endregion

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

  levelTagPrepareFunc(item: Log): FancyTag[] {
    let tags = [];
    switch (item.level) {
      case LogLevel.Info:
        tags.push(new FancyTag('Info', 'info'));
        break;
      case LogLevel.Warning:
        tags.push(new FancyTag('Warning', 'warning'));
        break;
      case LogLevel.Error:
        tags.push(new FancyTag('Error', 'danger'));
        break;
      default: break;
    }
    return tags;
  }

  //#region UI Calling Methods
  openEditingDialog(isAdding: boolean) {
    this.dlgService.open(LogDetailComponent, {
      context: {
        data: this.allData[this.selectedIndex],
      }
    });
  }

  //#endregion

  //#region CRUD Methods
  delete(datum) {
    this.msgBoxService.showConfirmDeleteBox().pipe(first()).subscribe(answer => {
      if (answer === true) {
        this.isLoading = true;
        this.logService.delete(datum).pipe(first()).subscribe(result => {
          this.isLoading = false;
          this.allData.splice(this.selectedIndex, 1);
          this.fancyTable.reload();
        });
      }
    });
  }
  purgeBefore: Date = new Date();
  purge() {
    this.msgBoxService.showConfirmDeleteBox().pipe(first()).subscribe(result => {
      if (result) {
        this.logService.purgeBefore(this.purgeBefore).pipe(first()).subscribe(result => {
          this.runGetAllData();
        });
      }
    });
  }
  refresh() {
    this.runGetAllData();
  }
  //#endregion

}
