knk/lib/components/basic/view/dragble_modal.js

react components based on react

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireWildcard(require("react"));
var _reactDraggable = _interopRequireDefault(require("react-draggable"));
var _propTypes = _interopRequireDefault(require("prop-types"));
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; }
// 可拖动模态框

function calcZIndex() {
  var index = 1000;
  return function () {
    if (index === 1050) {
      return index;
    }
    return index++;
  };
}
var getzIndex = calcZIndex();
var DragbleModal = function DragbleModal(props) {
  var _useState = (0, _react.useState)(getzIndex()),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    zIndex = _useState2[0],
    setZIndex = _useState2[1];
  var handleChangeZindex = function handleChangeZindex() {
    setZIndex(getzIndex());
  };
  var children = props.children,
    onCancel = props.onCancel,
    title = props.title;
  return /*#__PURE__*/_react.default.createElement(_reactDraggable.default, {
    handle: ".ant-modal-header"
  }, /*#__PURE__*/_react.default.createElement("span", {
    style: {
      position: 'fixed',
      zIndex: zIndex,
      top: 100
    },
    onClick: handleChangeZindex
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "ant-modal-content",
    style: {
      width: '800px'
    }
  }, /*#__PURE__*/_react.default.createElement("button", {
    "aria-label": "Close",
    className: "ant-modal-close",
    onClick: onCancel
  }, /*#__PURE__*/_react.default.createElement("span", {
    className: "ant-modal-close-x"
  }, /*#__PURE__*/_react.default.createElement("i", {
    className: "anticon anticon-close ant-modal-close-icon"
  }, /*#__PURE__*/_react.default.createElement("svg", {
    viewBox: "64 64 896 896",
    className: "",
    "data-icon": "close",
    width: "1em",
    height: "1em",
    fill: "currentColor",
    "aria-hidden": "true"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
  }))))), /*#__PURE__*/_react.default.createElement("div", {
    className: "ant-modal-header"
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "ant-modal-title",
    id: "rcDialogTitle0"
  }, title)), /*#__PURE__*/_react.default.createElement("div", {
    className: "ant-modal-body"
  }, children))));
};
DragbleModal.propTypes = {
  onCancel: _propTypes.default.func,
  title: _propTypes.default.string,
  children: _propTypes.default.any
};
var _default = exports.default = DragbleModal;