function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { Select, Modal, Form, Button, InputNumber } from "antd";
import React, { useState, useMemo, useEffect, useRef } from "react";
import useEngineContext from "../../hooks/useEngineContext";
import { locales } from "@pisell/utils";
import localeTexts from "./locales";
import "./index.less";
import { getLocale } from "../../utils/locales";
var TaxSelect = function TaxSelect(props) {
  var value = props.value,
    onChange = props.onChange,
    selectProps = props.selectProps,
    _props$tax_rate = props.tax_rate,
    tax_rate = _props$tax_rate === void 0 ? 10 : _props$tax_rate,
    _props$tax_title = props.tax_title,
    tax_title = _props$tax_title === void 0 ? "Tax" : _props$tax_title;
  var inputNumberRef = useRef();
  var _Form$useForm = Form.useForm(),
    _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
    form = _Form$useForm2[0];
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    open = _useState2[0],
    setOpen = _useState2[1];
  var context = useEngineContext();
  var useTax = Form.useWatch("tax", form);
  locales.init(localeTexts, getLocale());
  useEffect(function () {
    document.body.id = "body";
  }, []);
  var options = useMemo(function () {
    var isEn = localStorage.getItem("umi_locale") === "en-US";
    var taxOptions = [{
      value: 0,
      label: (isEn ? tax_title : "") + locales.getText("pisell2.text.tax-free")
    }, {
      value: tax_rate,
      label: tax_rate + "%"
    }, {
      value: "custom",
      label: locales.getText("pisell2.text.custom")
    }];
    return taxOptions;
  }, []);
  var _onChange = function _onChange(val) {
    if (val === "custom") {
      setOpen(true);
      setTimeout(function () {
        var _inputNumberRef$curre, _inputNumberRef$curre2;
        form.setFieldsValue({
          tax: value || tax_rate
        });
        (_inputNumberRef$curre = (_inputNumberRef$curre2 = inputNumberRef.current).focus) === null || _inputNumberRef$curre === void 0 || _inputNumberRef$curre.call(_inputNumberRef$curre2);
      }, 10);
      return;
    }
    onChange === null || onChange === void 0 || onChange(val);
  };
  var _value = useMemo(function () {
    if (value === undefined || value === null) {
      return;
    }
    if (options.some(function (d) {
      return d.value === value;
    })) {
      return value;
    }
    return "".concat(locales.getText("pisell2.text.custom"), " (").concat(value, "%)");
  }, [value]);
  var onCancel = function onCancel() {
    form.resetFields();
    setOpen(false);
  };
  var onFinish = function onFinish(values) {
    onChange === null || onChange === void 0 || onChange(values.tax);
    onCancel();
  };
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Select, _extends({
    options: options,
    size: "large",
    value: _value,
    onChange: _onChange,
    style: {
      width: "100%"
    },
    placeholder: locales.getText("pisell2.text.please-enter")
  }, selectProps)), /*#__PURE__*/React.createElement(Modal, {
    open: open,
    title: "".concat(locales.getText("pisell2.text.custom"), " ").concat(tax_title),
    footer: null,
    onCancel: onCancel
  }, /*#__PURE__*/React.createElement(Form, {
    form: form,
    layout: "vertical",
    onFinish: onFinish
  }, /*#__PURE__*/React.createElement(Form.Item, {
    label: tax_title,
    name: "tax",
    required: true
  }, /*#__PURE__*/React.createElement(InputNumber, {
    ref: inputNumberRef,
    size: "large",
    min: 0,
    max: 100,
    type: "number",
    addonAfter: "%",
    style: {
      width: "100%"
    }
  }))), /*#__PURE__*/React.createElement("div", {
    className: "tax-select-footer"
  }, /*#__PURE__*/React.createElement(Button, {
    onClick: onCancel,
    className: "tax-select-footer-item",
    size: "large"
  }, locales.getText("pisell2.text.cancel")), /*#__PURE__*/React.createElement(Button, {
    type: "primary",
    className: "tax-select-footer-item",
    size: "large",
    disabled: !useTax,
    onClick: function onClick() {
      form.submit();
    }
  }, locales.getText("pisell2.text.confirm")))));
};
var Test = function Test() {
  var _useState3 = useState(),
    _useState4 = _slicedToArray(_useState3, 2),
    value = _useState4[0],
    setValue = _useState4[1];
  return /*#__PURE__*/React.createElement(TaxSelect, {
    value: value,
    onChange: setValue
  });
};
export default TaxSelect;