@aliretail/react-materials-components/lib/PowerEditor/components/preview/index.js

B 端物料组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports["default"] = void 0;

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

var _overlay = _interopRequireDefault(require("@alifd/next/lib/overlay"));

var _button = _interopRequireDefault(require("@alifd/next/lib/button"));

var _message = _interopRequireDefault(require("@alifd/next/lib/message"));

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

var _react = _interopRequireWildcard(require("react"));

var _api = require("../../utils/api");

var _static = require("../../utils/static");

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

var READONLY_CLASS_PREFIX = _static.CLASS_PREFIX + "-readOnly";

var Preview = function Preview(props) {
  var _useState = (0, _react.useState)(false),
      visible = _useState[0],
      setVisible = _useState[1]; // 从富文本地址中获取的内容


  var _useState2 = (0, _react.useState)(''),
      showedContent = _useState2[0],
      setShowedContent = _useState2[1];

  var _useState3 = (0, _react.useState)(null),
      btn = _useState3[0],
      setBtn = _useState3[1];

  var content = props.content,
      path = props.path;

  var showContent = /*#__PURE__*/function () {
    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
      var tempContent;
      return _regenerator["default"].wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              tempContent = content;

              if (!path) {
                _context.next = 5;
                break;
              }

              _context.next = 4;
              return (0, _api.getRemoteFileContent)(path);

            case 4:
              tempContent = _context.sent;

            case 5:
              setShowedContent(tempContent);

              if (tempContent) {
                setVisible(true);
              } else {
                _message["default"].show({
                  type: 'notice',
                  title: '提示',
                  shape: 'toast',
                  content: '暂无内容'
                });
              }

            case 7:
            case "end":
              return _context.stop();
          }
        }
      }, _callee);
    }));

    return function showContent() {
      return _ref.apply(this, arguments);
    };
  }();

  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_button["default"], {
    text: true,
    type: "primary",
    className: READONLY_CLASS_PREFIX + "-button " + READONLY_CLASS_PREFIX + "-button-primary",
    onClick: showContent,
    ref: function ref(_ref2) {
      setBtn(_ref2);
    }
  }, /*#__PURE__*/_react["default"].createElement("svg", {
    viewBox: "0 0 1024 1024",
    version: "1.1",
    xmlns: "http://www.w3.org/2000/svg",
    "p-id": "1535",
    className: "icon"
  }, /*#__PURE__*/_react["default"].createElement("path", {
    // eslint-disable-next-line
    d: "M469.333333 298.666667a42.666667 42.666667 0 0 1 42.666667 42.666666v85.333334h85.333333a42.666667 42.666667 0 0 1 42.368 37.674666L640 469.333333a42.666667 42.666667 0 0 1-42.666667 42.666667h-85.333333v85.333333a42.666667 42.666667 0 0 1-37.674667 42.368L469.333333 640a42.666667 42.666667 0 0 1-42.666666-42.666667v-85.333333H341.333333a42.666667 42.666667 0 0 1-42.368-37.674667L298.666667 469.333333a42.666667 42.666667 0 0 1 42.666666-42.666666h85.333334V341.333333a42.666667 42.666667 0 0 1 37.674666-42.368L469.333333 298.666667z m0-128a298.666667 298.666667 0 1 0 207.573334 513.408l3.285333-3.84a40.448 40.448 0 0 1 3.797333-3.370667A298.666667 298.666667 0 0 0 469.333333 170.666667z m0-85.333334a384 384 0 0 1 384 384 382.122667 382.122667 0 0 1-83.968 239.658667l156.8 156.842667a42.624 42.624 0 1 1-60.330666 60.330666l-156.842667-156.8A382.122667 382.122667 0 0 1 469.333333 853.333333c-212.096 0-384-171.904-384-384s171.904-384 384-384z",
    "p-id": "1536",
    fill: "#5584FF"
  })), /*#__PURE__*/_react["default"].createElement("span", {
    className: "text"
  }, "\u67E5\u770B\u8BE6\u60C5")), /*#__PURE__*/_react["default"].createElement(_overlay["default"], {
    visible: visible,
    safeNode: function safeNode() {
      return btn;
    },
    align: "cc cc",
    hasMask: true,
    disableScroll: true,
    onRequestClose: function onRequestClose() {
      setVisible(false);
    }
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: READONLY_CLASS_PREFIX + "-dialog-content",
    "data-name": _static.COMPONENT_NAME + "Dialog"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    dangerouslySetInnerHTML: {
      __html: showedContent
    }
  }))));
};

var _default = Preview;
exports["default"] = _default;