import { Component, Element, h, Listen, Prop, State } from "@stencil/core";
import { Handler } from "../../../Handler";
import { isDefined } from "../../../model";
import * as translation from "../../translation";
export class IntergiroMonitorMerchantSettlements {
  constructor() {
    this.opened = {};
  }
  componentWillLoad() {
    this.t = translation.create(this.element);
    Handler.register((authorizations, _, merchants) => {
      this.authorizations = authorizations;
      this.merchants = merchants;
    });
  }
  toggleColumn(e) {
    const opened = Object.assign({}, this.opened);
    opened[e.detail.index] == e.detail.column
      ? delete opened[e.detail.index]
      : (opened[e.detail.index] = e.detail.column);
    this.opened = opened;
    e.stopPropagation();
  }
  render() {
    var _a;
    const t = this.t;
    const header = [
      { name: t("merchant") },
      { name: t("gross"), align: "right" },
      { name: t("fee"), align: "right" },
      this.costPlus ? { name: t("interchange"), align: "right" } : undefined,
      { name: t("net"), align: "right" },
      { name: t("transactions") },
    ];
    return (h("ig-table", { value: this.settlements, name: t("settlements"), header: header }, (_a = this.settlements) === null || _a === void 0 ? void 0 : _a.map((s, index) => {
      var _a;
      const merchant = (_a = this.merchants) === null || _a === void 0 ? void 0 : _a.find(m => m.id == s.merchant);
      return [
        h("ig-table-row", { row: [
            { column: merchant ? merchant.name : s.merchant, openable: true },
            {
              column: h("smoothly-display-amount", { amount: s.gross, currency: s.currency }),
              align: "right",
            },
            {
              column: (h("smoothly-display-amount", { amount: typeof s.fee == "object" ? s.fee.total : s.fee, currency: s.currency })),
              align: "right",
            },
            this.costPlus
              ? {
                column: (h("smoothly-display-amount", { amount: typeof s.fee == "object" ? s.fee.scheme : 0, currency: s.currency })),
                align: "right",
              }
              : undefined,
            {
              column: h("smoothly-display-amount", { amount: s.net, currency: s.currency }),
              align: "right",
            },
            { column: s.transactions.length + " " + t("transactions"), openable: true },
          ], index: index, opened: this.opened[index] }),
        this.opened[index] == (header.filter(isDefined).length - 1).toString() && (h("td", { colSpan: header.filter(isDefined).length },
          h("ig-monitor-settlements-transactions", { authorizations: this.authorizations, merchants: this.merchants, transactions: s.transactions, "cost-plus": this.costPlus }))),
        this.opened[index] == "0" && (h("td", { colSpan: header.filter(isDefined).length },
          h("ig-merchant-table", { abbrivated: true, merchants: merchant ? [merchant] : [] }))),
      ];
    })));
  }
  static get is() { return "ig-monitor-merchant-settlements"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() { return {
    "$": ["style.css"]
  }; }
  static get styleUrls() { return {
    "$": ["style.css"]
  }; }
  static get properties() { return {
    "settlements": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "AcquirerSettlement[]",
        "resolved": "Settlement[] | undefined",
        "references": {
          "AcquirerSettlement": {
            "location": "import",
            "path": "../../../model"
          }
        }
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "costPlus": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean | undefined",
        "references": {}
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "cost-plus",
      "reflect": false
    }
  }; }
  static get states() { return {
    "t": {},
    "authorizations": {},
    "merchants": {},
    "opened": {}
  }; }
  static get elementRef() { return "element"; }
  static get listeners() { return [{
      "name": "columnClicked",
      "method": "toggleColumn",
      "target": undefined,
      "capture": false,
      "passive": false
    }]; }
}
