import { Component, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute, Router } from '@angular/router';
import { Observable } from 'rxjs';
import { map, switchMap } from 'rxjs/operators';

import { AuthService } from '../../auth/auth.service';
import { Table } from '../../core/table';
import { ToasterService } from '../../core/toaster.service';
import { ConfirmDialogComponent } from '../../shared/confirm-dialog/confirm-dialog.component';
import { TableService } from '../../tables/table.service';
import { BillService } from '../bill.service';
import { PaxComponent } from '../pax/pax.component';
import { QuantityComponent } from '../quantity/quantity.component';
import { TablesDialogComponent } from '../tables-dialog/tables-dialog.component';

import { Bill } from './bill';
import { BillsDataSource } from './bills-datasource';
import { Kot } from './kot';
import { VoucherType } from './voucher-type';

@Component({
  selector: 'app-bills',
  templateUrl: './bills.component.html',
  styleUrls: ['./bills.component.css'],
})
export class BillsComponent implements OnInit {
  dataSource: BillsDataSource = new BillsDataSource(this.bs.dataObs);
  /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
  displayedColumns: string[] = ['select', 'info', 'quantity'];

  constructor(
    private route: ActivatedRoute,
    private router: Router,
    private dialog: MatDialog,
    private toaster: ToasterService,
    private auth: AuthService,
    public bs: BillService,
    private tSer: TableService,
  ) {}

  ngOnInit() {
    this.route.data.subscribe((value) => {
      const data = value as { item: Bill };
      this.bs.loadData(data.item);
    });
    this.getPax();
    this.dataSource = new BillsDataSource(this.bs.dataObs);
  }

  getPax(): void {
    if (this.bs.bill.id || this.bs.bill.customer) {
      return;
    }
    const dialogRef = this.dialog.open(PaxComponent, {
      // width: '750px',
      data: this.bs.bill.pax,
    });

    dialogRef.afterClosed().subscribe((result: boolean | number) => {
      if (!result) {
        return;
      }
      this.bs.bill.pax = result as number;
    });
  }

  isAllSelected(kot: Kot) {
    return this.bs.data
      .filter((x) => x.kotId === kot.id)
      .reduce((p: boolean, c: any) => p && this.bs.selection.isSelected(c), true);
  }

  isAnySelected(kot: Kot) {
    let total = 0;
    let found = 0;
    this.bs.data
      .filter((x) => x.kotId === kot.id)
      .forEach((c: any) => {
        total += 1;
        if (this.bs.selection.isSelected(c)) {
          found += 1;
        }
      });
    return found > 0 && found < total;
  }

  masterToggle(kot: Kot) {
    const isAllSelected = this.isAllSelected(kot);
    this.bs.data
      .filter((x) => x.kotId === kot.id)
      .forEach((row) =>
        isAllSelected ? this.bs.selection.deselect(row) : this.bs.selection.select(row),
      );
  }

  addOne(item: any): void {
    this.bs.addOne(item);
  }

  quantity(item: any): void {
    const dialogRef = this.dialog.open(QuantityComponent, {
      // width: '750px',
      data: item.quantity,
    });

    dialogRef.afterClosed().subscribe((result: boolean | number) => {
      if (!result) {
        return;
      }
      if (!item.isPrinted) {
        this.bs.quantity(item, result as number);
      } else {
        const quantity = result as number;
        const product = {
          ...item.product,
          hasHappyHour: item.isHappyHour,
          tax: item.tax,
          price: item.price,
        };
        this.bs.addProduct(product, quantity, item.discount);
      }
    });
  }

  subtractOne(item: any): void {
    const canEdit = this.auth.allowed('edit-printed-product');
    this.bs.subtractOne(item, canEdit);
  }

  removeItem(item: any): void {
    this.bs.removeItem(item);
  }

  modifier(item: any): void {
    this.bs.modifier(item);
  }

  confirmMoveKotDialog(table: Table): Observable<Table> {
    return this.dialog
      .open(ConfirmDialogComponent, {
        width: '250px',
        data: { title: 'Move KOT?', content: 'Are you sure?' },
      })
      .afterClosed()
      .pipe(
        map((x: boolean) => {
          if (!x) {
            throw new Error('Please confirm move');
          }
          return table;
        }),
      );
  }

  chooseTable(allowMerge: boolean): Observable<Table> {
    return this.dialog
      .open(TablesDialogComponent, {
        // width: '750px',
        data: {
          list: this.tSer.running(),
          canChooseRunning: allowMerge,
        },
      })
      .afterClosed()
      .pipe(
        map((x: Table) => {
          if (!x) {
            throw new Error('Please choose a table');
          }
          return x;
        }),
      );
  }

  moveKot(kot: Kot) {
    const canMergeTables = this.auth.allowed('merge-tables');
    this.chooseTable(canMergeTables)
      .pipe(
        switchMap((table: Table) => this.confirmMoveKotDialog(table)),
        switchMap((table: Table) => {
          if (this.bs.bill.kots.length === 1 && table.status) {
            return this.bs.mergeTable(table);
          }
          if (this.bs.bill.kots.length === 1 && !table.status) {
            return this.bs.moveTable(table);
          }
          if (table.status) {
            return this.bs.mergeKot(kot.id as string, table);
          }
          return this.bs.moveKot(kot.id as string, table);
        }),
      )
      .subscribe(
        () => {
          this.toaster.show('Success', '');
          this.router.navigate(['/sales']);
        },
        (x) => {
          this.toaster.show('Error', x);
        },
      );
  }

  rowQuantityDisabled(row: any) {
    if (!row.isPrinted) {
      return false;
    }
    if (this.bs.bill.voucherType === VoucherType.Void) {
      return true;
    }
    if (!this.auth.allowed('edit-printed-product')) {
      return true;
    }
    return false;
  }
}