bilingo-ui/eslib/index-6e59934c.js

import { _ as _defineProperty, s as styleInject, b as _inherits, d as _createClass, e as _classCallCheck, f as _possibleConstructorReturn, h as _getPrototypeOf, i as _objectSpread2, j as _slicedToArray } from './style-inject.es-b888177c.js';
import React, { Component, PureComponent, useState } from 'react';
import { c as classnames } from './index-29b5a955.js';

var IMAGE_PROCESS = '?x-oss-process=image/resize,h_350';
var IMAGE_PROCESS_SMALL = '?x-oss-process=image/resize,h_100';
var IMAGE_PROCESS_LARGE = '?x-oss-process=image/resize,h_500';
function addImageProcess(url) {
  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
    width: '36px',
    height: '36px'
  };

  // 防止重复添加导致的url不正确
  if (url && url.indexOf('x-oss-process') > -1) {
    return url;
  }

  if (options.small) {
    return url + IMAGE_PROCESS_SMALL;
  }

  if (options.large) {
    return url + IMAGE_PROCESS_LARGE;
  }

  if (options.custom) {
    return "".concat(url, "?x-oss-process=image/resize,limit_0,m_fill,w_").concat(options.width, ",h_").concat(options.height);
  }

  return url + IMAGE_PROCESS;
}
function formatMoney(input) {
  var fuzz = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;

  if (isNaN(+input)) {
    return input;
  }

  return (+input).toFixed(fuzz);
}
function exportStyleSizeClass(styles, size) {
  return _defineProperty({}, styles[size], true);
}

const img = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAABvklEQVQ4T62UTygEcRTHv29MIsqfk6OL5CYH5aKd9WfjwqxEnBzExYWTCEWJJGove5H8OTA1uwdCrOWAi83ZwUXJiSj5u+Z5s0msmd2SX81h+r33ee/7fW+G8E+H/srhqEcFCjphve1RzcaVK4j3mmoB5YxqQzdOxTji1wE2QZglb2jAEcT7/g4wr0rQugS1OYJ26nOg5nYDr4ZrR7yrl0FBAKBlqjEX3eRLwSXAmidvOJbSI47oF9LVKaCOkNc4/w7kSPOoFBqDwjpp4XA60LUkF8nzbsuERQt4ejtGdsYwiAYTYIV6STOD6UB3EpqXJC0u7zKxz0Mk3Zrj7lOLerJg5T9K+2lWhALiYx8xS9NbDZnUuPXy0wN/hYw3lnbPiNfE7HaSfTAloRqKWkya8WAnMrdmIBqfBqM/BehJAo+gKHMibdMGzUhqKUiZAHGVXJYLwPdpshPnRDRM4fl5+7uKL/0c1WXdOSie5Dh3wZcyoR7SQttO9z+M5MOWEsStFQmsTAoOwVK7qM64d5P6ayKJj9EqHBa5Q4kx2/ujqR1Exnsq493HH2muFN98oNtJ0g7s3Ul5/vwbSab+G+gDqFybE11pYkYAAAAASUVORK5CYII=';

var css = ".ConsumeListView_wrapper__la1cB {\n  display: flex;\n  justify-content: center;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b {\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-wrap: wrap;\n  padding-top: 10px;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b li {\n  list-style: none;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b .ConsumeListView_consumeItem__2M0dc {\n  margin: 0 6px 10px;\n  text-align: center;\n  position: relative;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b .ConsumeListView_consumeItem__2M0dc .ConsumeListView_kingdomIcon__YPzT9 {\n  position: absolute;\n  width: 24px;\n  height: 22px;\n  left: -6px;\n  top: -12px;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b .ConsumeListView_consumeItem__2M0dc .ConsumeListView_avatar__AXZJE {\n  margin: 0 auto 4px;\n  width: 36px;\n  height: 36px;\n  background-size: cover;\n  border-radius: 50%;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b .ConsumeListView_consumeItem__2M0dc .ConsumeListView_gray__3h-Ue {\n  color: #9b9b9b;\n  font-size: 12px;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b .ConsumeListView_toggle__31sUD {\n  margin: 0 6px 10px;\n  width: 36px;\n  height: 36px;\n  line-height: 36px;\n  background-color: #ececec;\n  border-radius: 50%;\n  color: #a8adb6;\n  cursor: pointer;\n  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAACv0lEQVRIS8WXTW8SURSGzzAYNSYCA7SCUEqBioLtohvjD9CN7ozG36AmXfsRafxYN9b+BqNx50r3GjddqEVRRgSRVr4GWmOsERjfOwEzVYa5lAokEwJzznnOe865d+4IxPFRVXVPrVY73Wq1TgmCMIffYbjZ2q4b+E/GfysWi+WZw+F4it+/zMIKvQwAszcajXnYXEIwl1kwdh8JVPC1bLVaF5FE3cjHEFytVs8hyH04jvMAu9gUkexlp9P5uJv/P2DABCi9hbJehUPPinAkpKL8d6H8BpJQ9fbbAjOooigP8H2BIyi3CaAPJUm6qIdvAwN6G0qvcUfswxDK7wB+vePyB9zu6aNdKK9ROioUn+/0XAOz6W02m6kBBolXe1EUxSibdg0MtQn09Sav9yB2UL0A1QmBbQ6VSmWNd50OAu2sc5fL5WVTfAYD9WTQgP34Y9DOClB7D05X+nHcBdslAf19jnKfNAr2cmWVDuzfR7HoFCFTUyaqR8lUhr7/2KITc/Gu9mjrC6a4iLtjRhHfvv9Ea1/L5JLsNBML94Qz6OukTBWlTt5Dbjp2JGgUtsTAW7i713DxqSql0jkqrJfIKdloNhbpCmfQV8k0VZUNOuwZo2gkQFBmFPanKVibRFxpOUefC0VyOmw0E4+QqCt7s8mgH0ipbdKEb5wiIUB7N0UD9yy13l/O5CmbXyfJfpBm49MkihbSoKuA1jdpcsJD4aDfdA5gUDIdrr+jZLIFyuQK5AD8+NEQvXknU63+jUKTPgoGvDxQ1gJtuPpeTkw1U8+mnPU2MuWngN/DBW0bLe14A8mj3x+zX7TS+ryGi6JrMtoGMrItk6VULpcTqPtQHhIQuuB2uxOjfSwy1SM5CHQmYCRHn/azcjSHvQ586Mdb/aIb+oFeD2eHQOxM87j6eoXBBrGMa2evMPoE/sdL22+mI4T0ou1LqAAAAABJRU5ErkJggg==);\n  background-position: center;\n}\n.ConsumeListView_wrapper__la1cB .ConsumeListView_consumelist__sAA2b .ConsumeListView_toggle__31sUD.ConsumeListView_expand__XSb0z {\n  transform: rotate(180deg);\n}\n";
var styles = {"wrapper":"ConsumeListView_wrapper__la1cB","consumelist":"ConsumeListView_consumelist__sAA2b","consumeItem":"ConsumeListView_consumeItem__2M0dc","kingdomIcon":"ConsumeListView_kingdomIcon__YPzT9","avatar":"ConsumeListView_avatar__AXZJE","gray":"ConsumeListView_gray__3h-Ue","toggle":"ConsumeListView_toggle__31sUD","expand":"ConsumeListView_expand__XSb0z"};
styleInject(css);

var DEFAULT_AVATAR = '//links-comment.oss-cn-beijing.aliyuncs.com/comment/20180820/Kgka4_oU1.jpeg';

var ConsumeListView =
/*#__PURE__*/
function (_Component) {
  _inherits(ConsumeListView, _Component);

  function ConsumeListView() {
    _classCallCheck(this, ConsumeListView);

    return _possibleConstructorReturn(this, _getPrototypeOf(ConsumeListView).apply(this, arguments));
  }

  _createClass(ConsumeListView, [{
    key: "renderConsumeItem",
    value: function renderConsumeItem() {
      var _this$props = this.props,
          dataSource = _this$props.dataSource,
          isToggle = _this$props.isToggle,
          showLength = _this$props.showLength,
          listLength = _this$props.listLength,
          options = _this$props.options;
      var kingdomWidth = options.kingdomWidth,
          kingdomHeight = options.kingdomHeight,
          kingdomPosition = options.kingdomPosition,
          avatarSize = options.avatarSize,
          avatarMarginLeftAndRight = options.avatarMarginLeftAndRight;
      var renderData = dataSource;

      if (!isToggle && listLength > showLength) {
        renderData = dataSource.slice(0, showLength - 1);
      }

      return renderData.map(function (v, i) {
        var kingdom = null;

        if (i === 0) {
          kingdom = React.createElement("img", {
            className: styles.kingdomIcon,
            src: img,
            alt: "reward top user",
            style: {
              width: "".concat(kingdomWidth, "px"),
              height: "".concat(kingdomHeight, "px"),
              left: "".concat(kingdomPosition[0], "px"),
              top: "".concat(kingdomPosition[1], "px")
            }
          });
        }

        return React.createElement("li", {
          key: v.id,
          className: styles.consumeItem,
          style: {
            margin: "0 ".concat(avatarMarginLeftAndRight, "px 10px")
          }
        }, kingdom, React.createElement("div", {
          className: styles.avatar,
          style: {
            backgroundImage: "url(".concat(addImageProcess(v.user_avatar || DEFAULT_AVATAR, {
              small: true
            }), ")"),
            width: "".concat(avatarSize, "px"),
            height: "".concat(avatarSize, "px")
          }
        }), React.createElement("span", {
          className: styles.gray
        }));
      });
    }
  }, {
    key: "renderToggleButton",
    value: function renderToggleButton() {
      var _this$props2 = this.props,
          isToggle = _this$props2.isToggle,
          onToggleChange = _this$props2.onToggleChange,
          listLength = _this$props2.listLength,
          showLength = _this$props2.showLength,
          options = _this$props2.options;
      var avatarSize = options.avatarSize,
          avatarMarginLeftAndRight = options.avatarMarginLeftAndRight;

      if (listLength <= showLength) {
        return null;
      }

      return React.createElement("li", {
        onClick: function onClick() {
          return onToggleChange();
        },
        className: classnames(styles.toggle, _defineProperty({}, styles.expand, isToggle)),
        style: {
          width: "".concat(avatarSize, "px"),
          height: "".concat(avatarSize, "px"),
          lineHeight: "".concat(avatarSize, "px"),
          margin: "0 ".concat(avatarMarginLeftAndRight, "px 10px")
        }
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props3 = this.props,
          showLength = _this$props3.showLength,
          options = _this$props3.options;
      var avatarSize = options.avatarSize,
          avatarMarginLeftAndRight = options.avatarMarginLeftAndRight;
      return React.createElement("div", {
        className: styles.wrapper
      }, React.createElement("ul", {
        className: styles.consumelist,
        style: {
          width: "calc(".concat(avatarMarginLeftAndRight * 2 + avatarSize, "px * ").concat(showLength, ")")
        }
      }, this.renderConsumeItem(), this.renderToggleButton()));
    }
  }]);

  return ConsumeListView;
}(Component);

_defineProperty(ConsumeListView, "defaultProps", {
  isToggle: false,
  onToggleChange: function onToggleChange() {},
  dataSource: [],
  listLength: 0,
  showLength: 6,
  options: {
    avatarSize: 36,
    avatarMarginLeftAndRight: 6,
    kingdomWidth: 24,
    kingdomHeight: 22,
    kingdomPosition: [-6, -12]
  }
});

const img$1 = 'data:image/png;base64,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';

const img$2 = 'data:image/png;base64,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';

const img$3 = 'data:image/png;base64,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';

const img$4 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABECAMAAAAPzWOAAAAAM1BMVEVHcEwArfAAq/AArvQAq+4Aqu8Aqu8Ar/QAqu8Aq+8Aqu8ArPAAsf8Aq/AAqu8Aq/AAqu6gIIw3AAAAEHRSTlMAKoAZ9JXXD7o86WoHSaldjgJo7wAAAgBJREFUWMPtmNmShCAMRSHsIMj/f+1oCy4YsB2oeZr7SHWdJsklEgj5iDkteXwlLrVj5JCCl4AdBCozqIy/lqSJYWOH7IeiZOySXCOC2ClY6sJ7IZwRF7vliO6HaNJOq5+2ArZTS5op4dlJ7aSQ2A+J/5A/gcyq0N5xCukWhHypFgRMobyRcl3+l/gtJIizEoRdFu0jxDyWV8UBEP8M0VVBgoiXiS368SbbA0kHycQOiK5G8wKSDudknyFWCwAQQZe/tdvHg8xPZpNAj0oyD5pfvrgfyTZEztPNE9SFDcRVzSQXSFC4tya/+ry1kQOSf6UYZbcdUWCNjeyQ8AG4YFN6wavntlhArFqP6vW7rO85Ms1WsJjA3A3ARXkcfeBViF32gV//tC8bwawrEEHqlx3pyqgYSAziWw2Q03uC6YWzQZpXN4/758Qh6ZTDYxtBOfo7iNvv7oA5R81CJgit5iQzmFwrzvDOTbJN0OrwnI90d+eBophseswneYQ43/+1r0GW8twdy2E6xdIyDjnOHwtXy+8JuOEtMAyyJXAvvQ3zUQrUQsEgEJ4XmfHm/D+sdh7OjXDfPmqqqTUdHlHFRn9U8DTZpajOubwEOuG9A42qWBLOG2r8LPTXE5kVpHt6W+9Tsh8ix4xvQwbJISPtkOF6zJg/5MFhzNPHmEeY7uegH1eE2uqiaqwMAAAAAElFTkSuQmCC';

const img$5 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAAA+CAMAAAChgZ0aAAAAM1BMVEVHcEwJvAcNvwoKvQgcxxwKvAgJvAcJvAcKvAgMwQsKvAcJvAcJvAgLvQkJvAgJvAcJuwemYXQzAAAAEHRSTlMA4SZICXfR91wV7YrANpyxIG3ToQAAAgRJREFUWMOlWFmigyAMJKwB2e5/2qdWXys7mE+1Y8hMxqSEVEMz4a0Eo5QBab1glMwGRw8xC/CoZzCCirWwyIdA9GZiM8ymB0BU7IbqAaGJQ6FEKxUfh0O6GgqDOBOVhLY4Gb7AGQ9xOmRWaW5jfI+zksuJ8zyXX0OJwH5RxBqIxUcuTq2AhEQ5XM5jqO22Dc2XjwTipoiLuy+0maXnWxLcha/0inrDlxz3Edt2pjWTjPI0b2RzVAdXSnJU9Pv645BhvCQ/kmW/7Nr9TIlmUKheSQihybs5Yckr92dksyT7mzOjZZloaM6dEbpjtCIrjT+ZhEpJ9lslyQeSXv2ISd/olo24tSRQsdgj9WdJTuVXlECyG+Y6A2cs8TasWr4h+TUsOz5t2KwippDh9CfMEBhKR7QbD0ghVZt9B3u+Zotm/nRH2u86X2zw0FR+LJXBlS7TAZKT56GYZEP5schtyUOvjhj9CB4uWjxVaCi/UoOiOiGMDzsfgbD4Mi4TsO9QbrW6dzB0eVxLaVqfBUoNSM0qinn44ypbKplx8BXX73AUK8zo05ObKc77DiY5qmx7eob3xg5DJwa3xuLJx1NpbYqDzdVb7oYmWyl6q+a/Y4CtsCY311+cL+UAnsv8Zh9KUtLj0ELPrpN/y6cdQxRCILrxPf60nTD/F0JeGsnI6xAg+OJP/wCiDbP03htrDwAAAABJRU5ErkJggg==';

const img$6 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAABGCAMAAACnmwfnAAAAb1BMVEVHcEwSOoYNeb4ROoUAnuMAneIAnuMROoUAneMSU5wUO4gROoUROoYROYUROYUAoOUAnuMSOoYRO4YAnuMROoUAoOUNUpwEh88Ja7QAnuQAnuQROYQAneIXLHAUM3sVL3USNn8NWqEIdLsRRYwEh8yuGf8EAAAAG3RSTlMAVQvuy+eo5PkXKW/Rr4goeETDiZ43us7AS166//BKAAAB4UlEQVRYw6WW25qCMAyEEVoOAitycBdboYrv/4yru4oS0pDK3P9f0gkZ4nmjNmWEK8vK+ivd+55dG7WkLE1scKQYqnF8q1gKNhi8V0ylCJxyYYXUrtlwsJ3BJRtW+QwO+LCCpRMHVtWfmn1X9LHZSN9fTjCYVr4GjlbAvloBz9bCdKiMMXPD4DJ3J7v6TiWk2SdSfVwldrMNDSutZfOCM37XN5211nE7wsoJvtxgLROL2T39ZP2n0LIWNDz8w3GCrwWj65sKNIMMp+ux79LFr/MTFmgGdazCWqIZ1LMKP2AXs40GsIPZ/fUFC2wtDGNM9zmHjmvxevA454hr9oTVLZZBNr/6y4TVO4e1UNcpK9AMwkcEyj6fvJxB/TBDH10jZvejOqOG81UjEmgGmUFz1KIZFLBYgWfQDwtu8Az65rAF/msOYgYbWu6gjPNg33IHHRh1fdsddGC/F8mgJbPDHXEHkWbLCTrPIDkj4rukFGHVwNMPrEUEySN14YO1KAFceZQi2uwdxfq02ZIsvKXNFiQMMshMzY5DEl4wuyDhnF6LloSzFWaDtTDA7NhzgN3MBobl0pIYtq8keZPv9HECNQA+usBHPGB5qgDsu8Chy1pAiemUxQrYzWyviN8l6I/T+wU2HDmgaaHs/gAAAABJRU5ErkJggg==';

var css$1 = ".PayPlatformOptions_flexContainer__1-MCg {\n  display: flex;\n  justify-content: space-around;\n  align-items: center;\n}\n.PayPlatformOptions_label__1E4pz {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616A79;\n}\n.PayPlatformOptions_payment-method-box__Iiao- {\n  padding: 20px 10px 10px 10px;\n  text-align: center;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payment-method__3fVWP {\n  display: inline-block;\n  margin: 0;\n  width: 60%;\n  vertical-align: middle;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payment-method-before__2Lu24 {\n  display: inline-block;\n  height: 100%;\n  vertical-align: middle;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  border: 1px solid transparent;\n  height: 66px;\n  line-height: 66px;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS .PayPlatformOptions_platformName__2VrlA {\n  text-align: center;\n  white-space: nowrap;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_small__kkYKV {\n  width: 88px;\n  height: 36px;\n  line-height: 36px;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_small__kkYKV .PayPlatformOptions_payment-method__3fVWP {\n  margin: 0;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_normal__1LPcR {\n  width: 132px;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_large__3Tz_u {\n  width: 162px;\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_active__3uZ7L {\n  border-radius: 5px;\n  border-color: #1790FF;\n  box-shadow: 0px 2px 6px 0px rgba(163, 163, 163, 0.3);\n}\n.PayPlatformOptions_payment-method-box__Iiao- .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_en__2udua {\n  font-size: 12px;\n}\n.PayPlatformOptions_payment-method-box__Iiao-.PayPlatformOptions_mobile__XZq_G {\n  padding: 8px 10px 10px 8px;\n}\n.PayPlatformOptions_payment-method-box__Iiao-.PayPlatformOptions_mobile__XZq_G .PayPlatformOptions_payitem__2o3qS {\n  display: inline-flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: 78px;\n  height: 80px;\n  line-height: initial;\n  border: 1px solid transparent;\n}\n.PayPlatformOptions_payment-method-box__Iiao-.PayPlatformOptions_mobile__XZq_G .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_active__3uZ7L {\n  border-radius: 4px;\n  border-color: #1790FF;\n}\n.PayPlatformOptions_payment-method-box__Iiao-.PayPlatformOptions_mobile__XZq_G .PayPlatformOptions_payitem__2o3qS .PayPlatformOptions_payment-method__3fVWP {\n  display: inline-block;\n  width: 34px;\n  height: 34px;\n}\n@media (max-width: 768px) {\n  .PayPlatformOptions_payitem__2o3qS {\n    cursor: pointer;\n    border: 1px solid transparent;\n  }\n  .PayPlatformOptions_payitem__2o3qS.PayPlatformOptions_active__3uZ7L {\n    border-radius: 5px;\n    border-color: #1790FF;\n  }\n}\n";
var styles$1 = {"flexContainer":"PayPlatformOptions_flexContainer__1-MCg","label":"PayPlatformOptions_label__1E4pz","payment-method-box":"PayPlatformOptions_payment-method-box__Iiao-","payment-method":"PayPlatformOptions_payment-method__3fVWP","payment-method-before":"PayPlatformOptions_payment-method-before__2Lu24","payitem":"PayPlatformOptions_payitem__2o3qS","platformName":"PayPlatformOptions_platformName__2VrlA","small":"PayPlatformOptions_small__kkYKV","normal":"PayPlatformOptions_normal__1LPcR","large":"PayPlatformOptions_large__3Tz_u","active":"PayPlatformOptions_active__3uZ7L","en":"PayPlatformOptions_en__2udua","mobile":"PayPlatformOptions_mobile__XZq_G","paymentMethodBox":"PayPlatformOptions_payment-method-box__Iiao-","paymentMethod":"PayPlatformOptions_payment-method__3fVWP","paymentMethodBefore":"PayPlatformOptions_payment-method-before__2Lu24"};
styleInject(css$1);

var PAY_CHANNEL = {
  PAYPAL: "PAYPAL_PAYPAL",
  // PAYPAL_LIVE
  ALI_WEB: "ALI_WEB",
  ALI_WAP: "ALI_WAP",
  WX_WAP: "WX_WAP",
  WX_NATIVE: "WX_NATIVE"
};

var PayPlatformOptions =
/*#__PURE__*/
function (_PureComponent) {
  _inherits(PayPlatformOptions, _PureComponent);

  function PayPlatformOptions() {
    _classCallCheck(this, PayPlatformOptions);

    return _possibleConstructorReturn(this, _getPrototypeOf(PayPlatformOptions).apply(this, arguments));
  }

  _createClass(PayPlatformOptions, [{
    key: "render",
    value: function render() {
      var _objectSpread5, _objectSpread6, _objectSpread7;

      var _this$props = this.props,
          payitem = _this$props.payitem,
          onPayItemChange = _this$props.onPayItemChange,
          _this$props$isMobile = _this$props.isMobile,
          isMobile = _this$props$isMobile === void 0 ? false : _this$props$isMobile,
          _this$props$size = _this$props.size,
          size = _this$props$size === void 0 ? "normal" : _this$props$size,
          _this$props$withTitle = _this$props.withTitle,
          withTitle = _this$props$withTitle === void 0 ? true : _this$props$withTitle,
          titleTxt = _this$props.titleTxt,
          _this$props$locale = _this$props.locale,
          locale = _this$props$locale === void 0 ? "zh" : _this$props$locale;
      var titleDOM = null;

      if (withTitle) {
        var titleResult = titleTxt || locale === 'zh' ? '支付方式' : 'Payment';
        titleDOM = React.createElement("div", {
          className: styles$1.label
        }, titleResult);
      }

      if (isMobile) {
        var _objectSpread2$1, _objectSpread3, _objectSpread4;

        return React.createElement("div", null, titleDOM, React.createElement("div", {
          className: classnames(styles$1["payment-method-box"], _defineProperty({}, styles$1.mobile, isMobile))
        }, React.createElement("div", {
          className: styles$1.flexContainer
        }, React.createElement("div", {
          className: styles$1.flexItem
        }, React.createElement("div", {
          className: classnames(_objectSpread2((_objectSpread2$1 = {}, _defineProperty(_objectSpread2$1, styles$1.payitem, true), _defineProperty(_objectSpread2$1, styles$1.active, payitem === PAY_CHANNEL.ALI_WEB), _objectSpread2$1), exportStyleSizeClass(styles$1, size)), styles$1[locale]),
          onClick: function onClick() {
            onPayItemChange(PAY_CHANNEL.ALI_WEB);
          }
        }, React.createElement("img", {
          src: img$4,
          alt: "alipay",
          className: styles$1["payment-method"]
        }), React.createElement("div", {
          className: styles$1.platformName
        }, "\u652F\u4ED8\u5B9D"))), React.createElement("div", {
          className: styles$1.flexItem
        }, React.createElement("div", {
          className: classnames(_objectSpread2((_objectSpread3 = {}, _defineProperty(_objectSpread3, styles$1.payitem, true), _defineProperty(_objectSpread3, styles$1.active, payitem === PAY_CHANNEL.WX_NATIVE), _objectSpread3), exportStyleSizeClass(styles$1, size)), styles$1[locale]),
          onClick: function onClick() {
            onPayItemChange(PAY_CHANNEL.WX_NATIVE);
          }
        }, React.createElement("img", {
          src: img$5,
          alt: "wechatpay",
          className: styles$1["payment-method"]
        }), React.createElement("div", {
          className: styles$1.platformName
        }, "\u5FAE\u4FE1"))), React.createElement("div", {
          className: styles$1.flexItem
        }, React.createElement("div", {
          className: classnames(_objectSpread2((_objectSpread4 = {}, _defineProperty(_objectSpread4, styles$1.payitem, true), _defineProperty(_objectSpread4, styles$1.active, payitem === PAY_CHANNEL.PAYPAL), _objectSpread4), exportStyleSizeClass(styles$1, size)), styles$1[locale]),
          onClick: function onClick() {
            onPayItemChange(PAY_CHANNEL.PAYPAL);
          }
        }, React.createElement("img", {
          src: img$6,
          alt: "paypal",
          className: styles$1["payment-method"]
        }), React.createElement("div", {
          className: styles$1.platformName
        }, "Paypal"))))));
      }

      return React.createElement("div", null, titleDOM, React.createElement("div", {
        className: styles$1["payment-method-box"]
      }, React.createElement("div", {
        className: styles$1.flexContainer
      }, React.createElement("div", {
        className: styles$1.flexItem
      }, React.createElement("div", {
        className: classnames(_objectSpread2((_objectSpread5 = {}, _defineProperty(_objectSpread5, styles$1.payitem, true), _defineProperty(_objectSpread5, styles$1.active, payitem === PAY_CHANNEL.ALI_WEB), _objectSpread5), exportStyleSizeClass(styles$1, size)), styles$1[locale]),
        onClick: function onClick() {
          onPayItemChange(PAY_CHANNEL.ALI_WEB);
        }
      }, React.createElement("span", {
        className: styles$1["payment-method-before"]
      }), React.createElement("img", {
        src: img$1,
        alt: "alipay",
        className: styles$1["payment-method"]
      }))), React.createElement("div", {
        className: styles$1.flexItem
      }, React.createElement("div", {
        className: classnames(_objectSpread2((_objectSpread6 = {}, _defineProperty(_objectSpread6, styles$1.payitem, true), _defineProperty(_objectSpread6, styles$1.active, payitem === PAY_CHANNEL.WX_NATIVE), _objectSpread6), exportStyleSizeClass(styles$1, size)), styles$1[locale]),
        onClick: function onClick() {
          onPayItemChange(PAY_CHANNEL.WX_NATIVE);
        }
      }, React.createElement("span", {
        className: styles$1["payment-method-before"]
      }), React.createElement("img", {
        src: img$2,
        alt: "wechatpay",
        className: styles$1["payment-method"]
      }))), React.createElement("div", {
        className: styles$1.flexItem
      }, React.createElement("div", {
        className: classnames(_objectSpread2((_objectSpread7 = {}, _defineProperty(_objectSpread7, styles$1.payitem, true), _defineProperty(_objectSpread7, styles$1.active, payitem === PAY_CHANNEL.PAYPAL), _objectSpread7), exportStyleSizeClass(styles$1, size)), styles$1[locale]),
        onClick: function onClick() {
          onPayItemChange(PAY_CHANNEL.PAYPAL);
        }
      }, React.createElement("span", {
        className: styles$1["payment-method-before"]
      }), React.createElement("img", {
        src: img$3,
        alt: "paypal",
        className: styles$1["payment-method"]
      }))))));
    }
  }]);

  return PayPlatformOptions;
}(PureComponent);

var css$2 = ".PriceOptions_options__iSN_S {\n  padding: 20px 50px;\n  border-bottom: 1px dashed #00000017;\n}\n.PriceOptions_options__iSN_S p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n  margin-bottom: 20px;\n}\n.PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD {\n  padding-right: 0;\n}\n.PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_priceItem__3ahwJ {\n  background: rgba(243, 243, 243, 0.14);\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n  font-size: 14px;\n  font-weight: 600;\n  color: #616a79;\n  display: inline-block;\n  text-align: center;\n  vertical-align: top;\n  height: 30px;\n  width: 70px;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 6px;\n}\n.PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_priceItem__3ahwJ.PriceOptions_active__3cl1G {\n  background: rgba(255, 50, 102, 0.1);\n  border-radius: 4px;\n  border: 1px solid #ff3266;\n  color: #616a79;\n}\n.PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_priceInput__2GSDh {\n  display: inline-block;\n  min-width: 70px;\n  width: auto;\n  margin: 6px;\n  text-align: center;\n}\n.PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  height: 30px;\n  width: 50px;\n  vertical-align: top;\n  padding: 0 5px;\n}\n.PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_rate__FJSKL {\n  margin-left: 10px;\n}\n.PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_rate__FJSKL i {\n  margin-right: 5px;\n  color: #1790FF;\n}\n.PriceOptions_options__iSN_S.PriceOptions_small__3O05i {\n  padding: 0 0 12px 0;\n  border-bottom: none;\n}\n.PriceOptions_options__iSN_S.PriceOptions_small__3O05i p {\n  margin-bottom: 8px;\n}\n.PriceOptions_options__iSN_S.PriceOptions_small__3O05i .PriceOptions_infoItem__p5iwD {\n  text-align: center;\n}\n.PriceOptions_options__iSN_S.PriceOptions_small__3O05i .PriceOptions_infoItem__p5iwD .PriceOptions_priceItem__3ahwJ {\n  border-radius: 6px;\n  height: 32px;\n  width: 72px;\n  margin: 0 0 12px 19px;\n}\n.PriceOptions_options__iSN_S.PriceOptions_small__3O05i .PriceOptions_infoItem__p5iwD .PriceOptions_priceItem__3ahwJ:first-child {\n  margin: 0 0 12px 0px;\n}\n.PriceOptions_options__iSN_S.PriceOptions_small__3O05i .PriceOptions_infoItem__p5iwD .PriceOptions_priceInput__2GSDh {\n  display: block;\n  width: 254px;\n  border-radius: 6px;\n  height: 32px;\n}\n@media (max-width: 768px) {\n  .PriceOptions_options__iSN_S {\n    padding: 20px 20px;\n  }\n  .PriceOptions_options__iSN_S p {\n    font-size: 14px;\n    font-weight: 400;\n    color: #616a79;\n  }\n  .PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD {\n    padding-right: 0;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n  .PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_priceBtn__2vdWf {\n    display: flex;\n    justify-content: space-between;\n  }\n  .PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_priceItem__3ahwJ {\n    display: inline-block;\n    background-color: #fff;\n    width: 74px;\n    height: 36px;\n    line-height: 36px;\n    border-radius: 6px;\n    border: 1px solid #cfcfcf;\n  }\n  .PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_priceItem__3ahwJ.PriceOptions_active__3cl1G {\n    background-color: #fff;\n    color: #FF3266FF;\n    border-radius: 4px;\n    border: 1px solid #ff3266;\n  }\n  .PriceOptions_options__iSN_S .PriceOptions_infoItem__p5iwD .PriceOptions_priceInput__2GSDh {\n    border-radius: 6px;\n    height: 36px;\n    width: auto;\n  }\n}\n";
var styles$2 = {"options":"PriceOptions_options__iSN_S","infoItem":"PriceOptions_infoItem__p5iwD","priceItem":"PriceOptions_priceItem__3ahwJ","active":"PriceOptions_active__3cl1G","priceInput":"PriceOptions_priceInput__2GSDh","rate":"PriceOptions_rate__FJSKL","small":"PriceOptions_small__3O05i","priceBtn":"PriceOptions_priceBtn__2vdWf"};
styleInject(css$2);

var FormattedMessage = function FormattedMessage(_ref) {
  var id = _ref.id;
  return id;
};

var PriceOptions = function PriceOptions(_ref2) {
  var price = _ref2.price,
      onPriceChange = _ref2.onPriceChange,
      _ref2$size = _ref2.size,
      _ref2$focusScroll = _ref2.focusScroll,
      _ref2$withTitle = _ref2.withTitle,
      withTitle = _ref2$withTitle === void 0 ? true : _ref2$withTitle,
      inputRef = _ref2.inputRef;
  var defaultOptions = [100, 600, 800]; // 控制是否为其他金额输入情况

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      inputStatus = _useState2[0],
      setInputStatus = _useState2[1];

  return React.createElement("div", {
    className: classnames(styles$2.options)
  }, withTitle ? React.createElement("p", null, React.createElement(FormattedMessage, {
    id: "pay.price.select.text"
  })) : null, React.createElement("div", {
    className: styles$2.infoItem,
    style: {
      marginBottom: "-12px"
    }
  }, React.createElement("span", {
    className: styles$2.priceBtn
  }, defaultOptions.map(function (item) {
    var _classnames;

    return React.createElement("span", {
      className: classnames((_classnames = {}, _defineProperty(_classnames, styles$2.priceItem, true), _defineProperty(_classnames, styles$2.active, price === item && !inputStatus), _classnames)),
      key: item,
      onClick: function onClick() {
        onPriceChange(item);
        setInputStatus(false);
      }
    }, React.createElement(FormattedMessage, {
      id: "".concat(formatMoney(item / 100, 0), "\xA5")
    }));
  }))));
};

var css$3 = ".WaitPayInfoView_waitingContainer__3wZ0a {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n";
var styles$3 = {"waitingContainer":"WaitPayInfoView_waitingContainer__3wZ0a"};
styleInject(css$3);

const img$7 = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNDhweCIgaGVpZ2h0PSI0M3B4IiB2aWV3Qm94PSIwIDAgNDggNDMiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDUwLjIgKDU1MDQ3KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5rY3hxX3BvcG92ZXJzX2ljb25fdGFuaGFvPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IuWPpuWuoue9kV/nm7Tmkq3or75f6K++56iL5LuL57uN6K+m5oOFX+i0reS5sOaPkOekuuW8ueeqlyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkzNi4wMDAwMDAsIC0xOTAuMDAwMDAwKSIgZmlsbC1ydWxlPSJub256ZXJvIj4KICAgICAgICAgICAgPGcgaWQ9Ikdyb3VwLTIyIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2OTAuMDAwMDAwLCAxMTAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0ia2N4cV9wb3BvdmVyc19pY29uX3RhbmhhbyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQ2LjAwMDAwMCwgODAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTQ4LDIxLjUgQzQ4LDMzLjM3MzY2MjYgMzguMzY0NTc1Niw0MyAyNi40Nzk3MDQ4LDQzIEMyMS4xMzA2MjczLDQzIDE3LjAzOTExNDQsNDIuMTUwNjE3MyAxMy4yODQxMzI4LDM4LjkzMDA0MTIgQzExLjgxNDAyMjEsMzcuNjczNjYyNiAxLjcwMDM2OSw0My4yMTIzNDU3IDAuMTc3MTIxNzcxLDM5LjI4Mzk1MDYgQy0xLjA2MjczMDYzLDM2LjA5ODc2NTQgNS45NTEyOTE1MSwyOS4yNTA2MTczIDUuMzEzNjUzMTQsMjcuMDc0MDc0MSBDNC43NjQ1NzU2NSwyNS4xODA2NTg0IDQuOTU5NDA5NTksMjMuNTcwMzcwNCA0Ljk1OTQwOTU5LDIxLjUgQzQuOTU5NDA5NTksOS42MjYzMzc0NSAxNC41OTQ4MzM5LDAgMjYuNDc5NzA0OCwwIEMzOC4zNjQ1NzU2LDAgNDgsOS42MjYzMzc0NSA0OCwyMS41IFoiIGlkPSJTaGFwZSIgZmlsbD0iIzE3OTBGRiI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjMuODQ4NzA4LCA4LjE5MzQxNikiIGZpbGw9IiNGRkZGRkYiPgogICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMi41LDI3LjQ5NzEwOTggQzEuMTMyMzUyOTQsMjcuNDk3MTA5OCAwLDI2LjM3OTQ2MjggMCwyNC45OTcxMDk4IEMwLDIzLjYxNDc1NjkgMS4xMzIzNTI5NCwyMi40OTcxMDk4IDIuNSwyMi40OTcxMDk4IEMzLjg2NzY0NzA2LDIyLjQ5NzEwOTggNSwyMy42MTQ3NTY5IDUsMjQuOTk3MTA5OCBDNSwyNi4zNzk0NjI4IDMuODY3NjQ3MDYsMjcuNDk3MTA5OCAyLjUsMjcuNDk3MTA5OCBaIE0yLjUsMTkuNDIxOTY1MyBDMS4xMzIzNTI5NCwxOS40MjE5NjUzIDAsMTguMTkxOTA3NSAwLDE2LjY3MDUyMDIgTDAsMi43NTE0NDUwOSBDMCwxLjI0NjI0Mjc3IDEuMTMyMzUyOTQsMCAyLjUsMCBDMy44Njc2NDcwNiwwIDUsMS4yMzAwNTc4IDUsMi43NTE0NDUwOSBMNSwxNi42NzA1MjAyIEM1LDE4LjE5MTkwNzUgMy44Njc2NDcwNiwxOS40MjE5NjUzIDIuNSwxOS40MjE5NjUzIFoiIGlkPSJTaGFwZSI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+';

var Button = function Button() {
  for (var _len = arguments.length, props = new Array(_len), _key = 0; _key < _len; _key++) {
    props[_key] = arguments[_key];
  }

  return React.createElement("button", props, "button");
};

var WaitPayInfoView =
/*#__PURE__*/
function (_Component) {
  _inherits(WaitPayInfoView, _Component);

  function WaitPayInfoView() {
    _classCallCheck(this, WaitPayInfoView);

    return _possibleConstructorReturn(this, _getPrototypeOf(WaitPayInfoView).apply(this, arguments));
  }

  _createClass(WaitPayInfoView, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          onClickPayed = _this$props.onClickPayed,
          onClickProblem = _this$props.onClickProblem;
      return React.createElement("div", {
        className: styles$3.waitingContainer
      }, React.createElement("div", {
        className: styles$3.infoIconImgContainer
      }, React.createElement("img", {
        src: img$7,
        alt: "info label icon"
      })), React.createElement("div", null, React.createElement("div", {
        className: styles$3.pay_text
      }, "live.course_info.pay.notification"), React.createElement("div", {
        className: styles$3.btn_row
      }, React.createElement(Button, {
        className: classnames(styles$3.pay_btn, styles$3.btn_default),
        size: "small",
        onClick: function onClick() {
          onClickPayed && onClickPayed();
        }
      }, "live.course_info.pay.payed"), React.createElement(Button, {
        className: styles$3.btn_default,
        size: "small",
        style: {
          marginLeft: '16px'
        },
        onClick: function onClick() {
          onClickProblem && onClickProblem();
        }
      }, "live.course_info.pay.help"))));
    }
  }]);

  return WaitPayInfoView;
}(Component);

_defineProperty(WaitPayInfoView, "defaultProps", {
  onClickPayed: function onClickPayed() {
    console.log("onClickPayed");
  },
  onClickProblem: function onClickProblem() {
    console.log("onClickProblem");
  }
});

export { ConsumeListView as C, PayPlatformOptions as P, WaitPayInfoView as W, PriceOptions as a };
//# sourceMappingURL=index-6e59934c.js.map