import { Component, Element, h, Listen, Prop, State } from "@stencil/core";
import * as translation from "../../translation";
export class IntergiroMonitorSettlementsTransactions {
  constructor() {
    this.opened = {};
  }
  componentWillLoad() {
    this.t = translation.create(this.element);
  }
  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();
  }
  getFlag(country) {
    return country.toUpperCase().replace(/./g, char => String.fromCodePoint(char.charCodeAt(0) + 127397));
  }
  getScheme(scheme) {
    return ["mastercard", "visa"].includes(scheme) ? (h("ig-scheme-logotype", { style: { padding: "0 .3em" }, size: "small", scheme: scheme })) : (scheme);
  }
  render() {
    var _a;
    const t = this.t;
    return (h("ig-table", { value: this.transactions, name: t("transactions"), header: [
        { name: t("authorization") },
        { name: t("type") },
        { name: t("card") },
        { name: t("gross"), align: "right" },
        { name: t("fee"), align: "right" },
        this.costPlus ? { name: t("interchange"), align: "right" } : undefined,
        { name: t("net"), align: "right" },
      ] }, (_a = this.transactions) === null || _a === void 0 ? void 0 : _a.map((transaction, index) => {
      var _a;
      const authorization = (_a = this.authorizations) === null || _a === void 0 ? void 0 : _a.find(a => transaction.authorization == a.authorization.id);
      return [
        h("ig-table-row", { row: [
            { column: transaction.authorization, openable: true },
            { column: this.t(transaction.type) },
            {
              column: [
                this.getFlag(transaction.area),
                this.getScheme(transaction.scheme),
                transaction.card[0].toUpperCase() + transaction.card.slice(1),
              ],
            },
            {
              column: (h("smoothly-display-amount", { amount: transaction.gross, currency: transaction.currency })),
              align: "right",
            },
            {
              column: (h("smoothly-display-amount", { amount: typeof transaction.fee == "object" ? transaction.fee.total : transaction.fee, currency: transaction.currency })),
              align: "right",
            },
            this.costPlus
              ? {
                column: (h("smoothly-display-amount", { amount: typeof transaction.fee == "object" ? transaction.fee.scheme : 0, currency: transaction.currency })),
                align: "right",
              }
              : undefined,
            {
              column: (h("smoothly-display-amount", { amount: transaction.net, currency: transaction.currency })),
              align: "right",
            },
          ], index: index, opened: this.opened[index] }),
        this.opened[index] && (h("td", { colSpan: 6 + (this.costPlus ? 1 : 0) },
          h("ig-authorization-table", { abbreviated: true, authorizations: authorization ? [authorization] : [], merchants: this.merchants, "cost-plus": this.costPlus }))),
      ];
    })));
  }
  static get is() { return "ig-monitor-settlements-transactions"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() { return {
    "$": ["style.css"]
  }; }
  static get styleUrls() { return {
    "$": ["style.css"]
  }; }
  static get properties() { return {
    "transactions": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "AcquirerSettlement.Transaction[]",
        "resolved": "Transaction[] | undefined",
        "references": {
          "AcquirerSettlement": {
            "location": "import",
            "path": "../../../model"
          }
        }
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "authorizations": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "(ModelState.Authorization | ModelState.FailedAuthorization)[]",
        "resolved": "(Authorization | FailedAuthorization)[] | undefined",
        "references": {
          "ModelState": {
            "location": "import",
            "path": "../../../model"
          }
        }
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "merchants": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "Merchant[]",
        "resolved": "Merchant[] | undefined",
        "references": {
          "Merchant": {
            "location": "import",
            "path": "@payfunc/model-acquirer"
          }
        }
      },
      "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": {},
    "opened": {}
  }; }
  static get elementRef() { return "element"; }
  static get listeners() { return [{
      "name": "columnClicked",
      "method": "toggleColumn",
      "target": undefined,
      "capture": false,
      "passive": false
    }]; }
}
