import React from 'react';
import classNames from 'classnames';
import { PisellEmpty } from '@pisell/materials';
import { formatAmount, locales } from '@pisell/utils';
import { formatLocalizedDateTime } from "../../../../utils";
import { resolvePaymentMethodName, usePaymentMethodNameMap } from "../../../../../pisellSalesManagement/hooks/usePaymentMethodNameMap";
import "./index.less";
function formatPaymentTime(record) {
  var value = record.payment_time || record.created_at;
  return formatLocalizedDateTime(value);
}
function getPaymentRecordMethod(record, paymentMethodNameMap) {
  return resolvePaymentMethodName(record, paymentMethodNameMap);
}
function getPaymentRecordAmount(record) {
  var _ref, _record$origin_amount;
  return (_ref = (_record$origin_amount = record.origin_amount) !== null && _record$origin_amount !== void 0 ? _record$origin_amount : record.amount) !== null && _ref !== void 0 ? _ref : 0;
}
function getPaymentRecordSurchargeAmount(record) {
  var _record$service_fee;
  return (_record$service_fee = record.service_fee) !== null && _record$service_fee !== void 0 ? _record$service_fee : 0;
}
function isNonZeroAmount(value) {
  return Number(value || 0) !== 0;
}
function isRefundPaymentRecord(record) {
  var rawType = String(record.type || '').toLowerCase();
  return rawType.includes('refund') || Number(getPaymentRecordAmount(record)) < 0;
}
export function Pay(_ref2) {
  var _ref3, _context$summary$summ;
  var context = _ref2.context;
  var paymentMethodNameMap = usePaymentMethodNameMap();
  var tempOrder = context.sales.tempOrder;
  var summary = (_ref3 = (_context$summary$summ = context.summary.summary) !== null && _context$summary$summ !== void 0 ? _context$summary$summ : tempOrder === null || tempOrder === void 0 ? void 0 : tempOrder.summary) !== null && _ref3 !== void 0 ? _ref3 : null;
  var symbol = (tempOrder === null || tempOrder === void 0 ? void 0 : tempOrder.currency_symbol) || '$';
  var payments = Array.isArray(tempOrder === null || tempOrder === void 0 ? void 0 : tempOrder.payments) ? tempOrder === null || tempOrder === void 0 ? void 0 : tempOrder.payments : [];
  var overviewItems = [{
    key: 'total',
    label: locales.getText('pisell2.sale-detail.total'),
    value: summary === null || summary === void 0 ? void 0 : summary.expect_amount
  }, {
    key: 'paid',
    label: locales.getText('pisell2.sale-detail.pay.paid'),
    value: summary === null || summary === void 0 ? void 0 : summary.order_paid_amount
  }, {
    key: 'refunded',
    label: locales.getText('pisell2.sale-detail.pay.refunded'),
    value: summary === null || summary === void 0 ? void 0 : summary.total_refund_amount,
    tone: 'warning'
  }, {
    key: 'toPay',
    label: locales.getText('pisell2.sale-detail.to-pay'),
    value: summary === null || summary === void 0 ? void 0 : summary.amount_gap
  }];
  return /*#__PURE__*/React.createElement("main", {
    className: "pisell-sale-detail-main pisell-sale-detail-pay-main"
  }, /*#__PURE__*/React.createElement("section", {
    className: "pisell-sale-detail-pay-overview"
  }, overviewItems.map(function (item) {
    var _item$value;
    return /*#__PURE__*/React.createElement("div", {
      key: item.key,
      className: classNames('pisell-sale-detail-pay-overview__item', {
        'pisell-sale-detail-pay-overview__item--warning': item.tone === 'warning'
      })
    }, /*#__PURE__*/React.createElement("span", {
      className: "pisell-sale-detail-pay-overview__label"
    }, item.label), /*#__PURE__*/React.createElement("span", {
      className: "pisell-sale-detail-pay-overview__value"
    }, formatAmount((_item$value = item.value) !== null && _item$value !== void 0 ? _item$value : 0, 2, symbol)));
  })), /*#__PURE__*/React.createElement("section", {
    className: "pisell-sale-detail-pay-timeline"
  }, payments.length ? payments.map(function (payment, index) {
    var isRefund = isRefundPaymentRecord(payment);
    var amount = getPaymentRecordAmount(payment);
    var surchargeAmount = getPaymentRecordSurchargeAmount(payment);
    var signedAmount = isRefund ? -Math.abs(Number(amount)) : amount;
    var signedSurchargeAmount = isRefund ? -Math.abs(Number(surchargeAmount)) : surchargeAmount;
    return /*#__PURE__*/React.createElement("article", {
      key: payment.order_payment_id || index,
      className: classNames('pisell-sale-detail-pay-record', {
        'pisell-sale-detail-pay-record--refund': isRefund
      })
    }, /*#__PURE__*/React.createElement("div", {
      className: "pisell-sale-detail-pay-record__date"
    }, formatPaymentTime(payment)), /*#__PURE__*/React.createElement("div", {
      className: "pisell-sale-detail-pay-record__content"
    }, /*#__PURE__*/React.createElement("span", {
      className: "pisell-sale-detail-pay-record__title"
    }, isRefund ? locales.getText('pisell2.sale-detail.refund') : locales.getText('pisell2.sale-detail.pay.payment'), ' · ', getPaymentRecordMethod(payment, paymentMethodNameMap), ' ', "(", locales.getText('pisell2.sale-detail.applied'), ")"), /*#__PURE__*/React.createElement("span", {
      className: "pisell-sale-detail-pay-record__amount"
    }, formatAmount(signedAmount, 2, symbol))), isNonZeroAmount(surchargeAmount) ? /*#__PURE__*/React.createElement("div", {
      className: "pisell-sale-detail-pay-record__sub-content"
    }, /*#__PURE__*/React.createElement("span", {
      className: "pisell-sale-detail-pay-record__sub-title"
    }, locales.getText('pisell2.sale-detail.payment-surcharge')), /*#__PURE__*/React.createElement("span", {
      className: "pisell-sale-detail-pay-record__sub-amount"
    }, formatAmount(signedSurchargeAmount, 2, symbol))) : null);
  }) : /*#__PURE__*/React.createElement("div", {
    className: "pisell-sale-detail-pay-timeline__empty"
  }, /*#__PURE__*/React.createElement(PisellEmpty, {
    description: locales.getText('pisell2.sale-detail.pay.empty')
  }))));
}