import { Component, ChangeDetectionStrategy, Input, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
import { OrderItemListItemDTO } from '@swagger/oms';

@Component({
  selector: 'app-shelf-order-item-details',
  templateUrl: 'order-item-details.component.html',
  styleUrls: ['order-item-details.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ShelfOrderItemDetailsComponent implements OnChanges {
  more = false;

  private _orderItemListItem: OrderItemListItemDTO;

  @Input()
  get orderItemListItem() {
    return this._orderItemListItem;
  }
  set orderItemListItem(val) {
    if (val) {
      this._orderItemListItem = { ...val };
    } else {
      this._orderItemListItem = val;
    }
  }

  @Input()
  selectable: boolean;

  @Input()
  selected = false;

  @Output()
  select = new EventEmitter<boolean>();

  @Output()
  quantityChange = new EventEmitter<number>();

  dropdownValues: number[] = [];

  constructor() {}

  ngOnChanges({ orderItemListItem }: SimpleChanges): void {
    if (orderItemListItem) {
      this.updateDropdownValues();
    }
  }

  selectedChange(value: boolean) {
    this.select.emit(value);
    this.selected = value;
  }

  updateDropdownValues() {
    if (!!this.orderItemListItem) {
      this.dropdownValues = Array(this.orderItemListItem.quantity)
        .fill(0)
        .map((x, i) => i + 1);
    } else {
      this.dropdownValues = [];
    }
  }
}
