vxe-pc-ui 3.16.0 → 3.16.2

package/lib/modal/src/modal.js

@@ -0,0 +1,1730 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.allActiveModals = void 0;
+var _comp = require("../../ui/src/comp");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+var _ui = require("../../ui");
+var _dom = require("../../ui/src/dom");
+var _utils = require("../../ui/src/utils");
+var _button = _interopRequireDefault(require("../../button"));
+var _loading = _interopRequireDefault(require("../../loading"));
+var _vn = require("../../ui/src/vn");
+var _log = require("../../ui/src/log");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _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(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+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(r) { if (Array.isArray(r)) return r; }
+var _createComponentLog = (0, _log.createComponentLog)('modal'),
+  warnLog = _createComponentLog.warnLog,
+  errLog = _createComponentLog.errLog;
+var allActiveModals = exports.allActiveModals = [];
+var msgQueue = [];
+var notifyQueue = [];
+var lockScrollAttrKey = 'data-vxe-lock-scroll';
+var lockScrollCssWidthKey = '--vxe-ui-modal-lock-scroll-view-width';
+var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
+  name: 'VxeModal',
+  mixins: [_ui.globalMixins.sizeMixin, _ui.globalMixins.permissionMixin],
+  props: {
+    value: Boolean,
+    id: String,
+    type: {
+      type: String,
+      default: 'modal'
+    },
+    loading: {
+      type: Boolean,
+      default: null
+    },
+    status: String,
+    iconStatus: String,
+    className: String,
+    top: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.top;
+      }
+    },
+    position: [String, Object],
+    title: String,
+    duration: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.duration;
+      }
+    },
+    content: [Number, String],
+    useHtml: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.useHtml;
+      }
+    },
+    showCancelButton: {
+      type: Boolean,
+      default: null
+    },
+    cancelButtonText: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.cancelButtonText;
+      }
+    },
+    showConfirmButton: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.showConfirmButton;
+      }
+    },
+    confirmButtonText: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.confirmButtonText;
+      }
+    },
+    lockView: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.lockView;
+      }
+    },
+    lockScroll: Boolean,
+    mask: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.mask;
+      }
+    },
+    maskClosable: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.maskClosable;
+      }
+    },
+    escClosable: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.escClosable;
+      }
+    },
+    cancelClosable: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.cancelClosable;
+      }
+    },
+    confirmClosable: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.confirmClosable;
+      }
+    },
+    resize: Boolean,
+    showHeader: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.showHeader;
+      }
+    },
+    showFooter: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.showFooter;
+      }
+    },
+    preload: Boolean,
+    showZoom: Boolean,
+    zoomConfig: Object,
+    showMaximize: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _utils.handleBooleanDefaultValue)((0, _ui.getConfig)().modal.showMaximize);
+      }
+    },
+    showMinimize: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _utils.handleBooleanDefaultValue)((0, _ui.getConfig)().modal.showMinimize);
+      }
+    },
+    showClose: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.showClose;
+      }
+    },
+    dblclickZoom: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.dblclickZoom;
+      }
+    },
+    width: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.width;
+      }
+    },
+    height: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.height;
+      }
+    },
+    minWidth: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.minWidth;
+      }
+    },
+    minHeight: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.minHeight;
+      }
+    },
+    zIndex: Number,
+    marginSize: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.marginSize;
+      }
+    },
+    fullscreen: Boolean,
+    draggable: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.draggable;
+      }
+    },
+    remember: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.remember;
+      }
+    },
+    destroyOnClose: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.destroyOnClose;
+      }
+    },
+    showTitleOverflow: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.showTitleOverflow;
+      }
+    },
+    transfer: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.transfer;
+      }
+    },
+    storage: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.storage;
+      }
+    },
+    storageKey: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.storageKey;
+      }
+    },
+    padding: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.padding;
+      }
+    },
+    size: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.size || (0, _ui.getConfig)().size;
+      }
+    },
+    beforeHideMethod: Function,
+    slots: Object,
+    /**
+     * 已废弃
+     * @deprecated
+     */
+    message: [Number, String],
+    /**
+     * 已废弃
+     * @deprecated
+     */
+    animat: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().modal.animat;
+      }
+    }
+  },
+  inject: {
+    $xeParentModal: {
+      from: '$xeModal',
+      default: null
+    },
+    $xeDrawer: {
+      default: null
+    },
+    $xeTable: {
+      default: null
+    },
+    $xeForm: {
+      default: null
+    }
+  },
+  provide: function provide() {
+    var $xeModal = this;
+    return {
+      $xeModal: $xeModal
+    };
+  },
+  data: function data() {
+    var xID = _xeUtils.default.uniqueId();
+    var reactData = {
+      initialized: false,
+      visible: false,
+      contentVisible: false,
+      modalTop: 0,
+      modalZindex: 0,
+      prevZoomStatus: '',
+      zoomStatus: '',
+      revertLocat: null,
+      prevLocat: null,
+      firstOpen: true,
+      resizeFlag: 1
+    };
+    var internalData = {
+      msgTimeout: undefined
+    };
+    return {
+      xID: xID,
+      reactData: reactData,
+      internalData: internalData
+    };
+  },
+  computed: Object.assign(Object.assign({}, {}), {
+    computeBtnTransfer: function computeBtnTransfer() {
+      var $xeSelect = this;
+      var props = $xeSelect;
+      var $xeTable = $xeSelect.$xeTable;
+      var $xeParentModal = $xeSelect.$xeParentModal;
+      var $xeDrawer = $xeSelect.$xeDrawer;
+      var $xeForm = $xeSelect.$xeForm;
+      var transfer = props.transfer;
+      if (transfer === null) {
+        var globalTransfer = (0, _ui.getConfig)().select.transfer;
+        if (_xeUtils.default.isBoolean(globalTransfer)) {
+          return globalTransfer;
+        }
+        if ($xeTable || $xeParentModal || $xeDrawer || $xeForm) {
+          return true;
+        }
+      }
+      return transfer;
+    },
+    computeIsMsg: function computeIsMsg() {
+      var $xeModal = this;
+      var props = $xeModal;
+      return props.type === 'message' || props.type === 'notification';
+    },
+    computeIsMinimizeStatus: function computeIsMinimizeStatus() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      return reactData.zoomStatus === 'minimize';
+    },
+    computeIsMaximizeStatus: function computeIsMaximizeStatus() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      return reactData.zoomStatus === 'maximize';
+    },
+    computeZoomOpts: function computeZoomOpts() {
+      var $xeModal = this;
+      var props = $xeModal;
+      return Object.assign({}, (0, _ui.getConfig)().modal.zoomConfig, props.zoomConfig);
+    }
+  }),
+  watch: {
+    width: function width() {
+      var $xeModal = this;
+      $xeModal.recalculate();
+    },
+    height: function height() {
+      var $xeModal = this;
+      $xeModal.recalculate();
+    },
+    value: function value(val) {
+      var $xeModal = this;
+      if (val) {
+        $xeModal.openModal();
+      } else {
+        $xeModal.closeModal('model');
+      }
+    }
+  },
+  methods: {
+    //
+    // Method
+    //
+    dispatchEvent: function dispatchEvent(type, params, evnt) {
+      var $xeModal = this;
+      $xeModal.$emit(type, (0, _ui.createEvent)(evnt, {
+        $modal: $xeModal
+      }, params));
+    },
+    emitModel: function emitModel(value) {
+      var $xeModal = this;
+      var _events = $xeModal._events;
+      $xeModal.$emit('input', value);
+      if (_events && _events.modelValue) {
+        $xeModal.$emit('modelValue', value);
+      } else {
+        $xeModal.$emit('model-value', value);
+      }
+    },
+    callSlot: function callSlot(slotFunc, params, h) {
+      var $xeModal = this;
+      var slots = $xeModal.$scopedSlots;
+      if (slotFunc) {
+        if (_xeUtils.default.isString(slotFunc)) {
+          slotFunc = slots[slotFunc] || null;
+        }
+        if (_xeUtils.default.isFunction(slotFunc)) {
+          return (0, _vn.getSlotVNs)(slotFunc.call($xeModal, params, h));
+        }
+      }
+      return [];
+    },
+    open: function open() {
+      var $xeModal = this;
+      return $xeModal.openModal();
+    },
+    close: function close() {
+      var $xeModal = this;
+      return $xeModal.closeModal('close');
+    },
+    getBox: function getBox() {
+      var $xeModal = this;
+      var boxElem = $xeModal.$refs.refModalBox;
+      return boxElem;
+    },
+    getPosition: function getPosition() {
+      var $xeModal = this;
+      var isMsg = $xeModal.computeIsMsg;
+      if (!isMsg) {
+        var boxElem = $xeModal.getBox();
+        if (boxElem) {
+          return {
+            top: boxElem.offsetTop,
+            left: boxElem.offsetLeft
+          };
+        }
+      }
+      return null;
+    },
+    setPosition: function setPosition(top, left) {
+      var $xeModal = this;
+      var isMsg = $xeModal.computeIsMsg;
+      if (!isMsg) {
+        var boxElem = $xeModal.getBox();
+        if (boxElem) {
+          if (_xeUtils.default.isNumber(top)) {
+            boxElem.style.top = "".concat(top, "px");
+          }
+          if (_xeUtils.default.isNumber(left)) {
+            boxElem.style.left = "".concat(left, "px");
+          }
+        }
+      }
+      return $xeModal.$nextTick();
+    },
+    isMinimized: function isMinimized() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      return reactData.zoomStatus === 'minimize';
+    },
+    isMaximized: function isMaximized() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      return reactData.zoomStatus === 'maximize';
+    },
+    zoom: function zoom() {
+      var $xeModal = this;
+      return $xeModal.handleZoom();
+    },
+    minimize: function minimize() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      if (!reactData.visible) {
+        return Promise.resolve({
+          status: false
+        });
+      }
+      return $xeModal.handleMinimize();
+    },
+    maximize: function maximize() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      if (!reactData.visible) {
+        return Promise.resolve({
+          status: false
+        });
+      }
+      return $xeModal.handleMaximize();
+    },
+    revert: function revert() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      if (!reactData.visible) {
+        return Promise.resolve({
+          status: false
+        });
+      }
+      return $xeModal.handleRevert();
+    },
+    recalculate: function recalculate() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var width = props.width,
+        height = props.height,
+        minWidth = props.minWidth,
+        minHeight = props.minHeight;
+      var isMsg = $xeModal.computeIsMsg;
+      var isMinimizeStatus = $xeModal.computeIsMinimizeStatus;
+      var boxElem = $xeModal.getBox();
+      if (boxElem) {
+        boxElem.style.width = width ? (0, _dom.toCssUnit)(width) : '';
+        boxElem.style.height = height ? (0, _dom.toCssUnit)(height) : '';
+        boxElem.style.minWidth = !isMsg && !isMinimizeStatus && minWidth ? (0, _dom.toCssUnit)(minWidth) : '';
+        boxElem.style.minHeight = !isMsg && !isMinimizeStatus && minHeight ? (0, _dom.toCssUnit)(minHeight) : '';
+      }
+      return $xeModal.$nextTick();
+    },
+    updateZindex: function updateZindex() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      var zIndex = props.zIndex;
+      var modalZindex = reactData.modalZindex;
+      if (zIndex) {
+        reactData.modalZindex = zIndex;
+      } else {
+        var isMsg = $xeModal.computeIsMsg;
+        if (isMsg) {
+          if (modalZindex < (0, _utils.getSubLastZIndex)()) {
+            reactData.modalZindex = (0, _utils.nextSubZIndex)();
+          }
+        } else {
+          if (modalZindex < (0, _utils.getLastZIndex)()) {
+            reactData.modalZindex = (0, _utils.nextZIndex)();
+          }
+        }
+      }
+    },
+    updatePosition: function updatePosition() {
+      var $xeModal = this;
+      var props = $xeModal;
+      return $xeModal.$nextTick().then(function () {
+        var position = props.position;
+        var marginSize = _xeUtils.default.toNumber(props.marginSize);
+        var boxElem = $xeModal.getBox();
+        if (!boxElem) {
+          return;
+        }
+        var clientVisibleWidth = document.documentElement.clientWidth || document.body.clientWidth;
+        var clientVisibleHeight = document.documentElement.clientHeight || document.body.clientHeight;
+        var isPosCenter = position === 'center';
+        var _ref = _xeUtils.default.isString(position) ? {
+            top: position,
+            left: position
+          } : Object.assign({}, position),
+          top = _ref.top,
+          left = _ref.left;
+        var topCenter = isPosCenter || top === 'center';
+        var leftCenter = isPosCenter || left === 'center';
+        var posTop = '';
+        var posLeft = '';
+        if (left && !leftCenter) {
+          posLeft = isNaN(left) ? left : "".concat(left, "px");
+        } else {
+          posLeft = "".concat(Math.max(marginSize, clientVisibleWidth / 2 - boxElem.offsetWidth / 2), "px");
+        }
+        if (top && !topCenter) {
+          posTop = isNaN(top) ? top : "".concat(top, "px");
+        } else {
+          posTop = "".concat(Math.max(marginSize, clientVisibleHeight / 2 - boxElem.offsetHeight / 2), "px");
+        }
+        boxElem.style.top = posTop;
+        boxElem.style.left = posLeft;
+      });
+    },
+    updateStyle: function updateStyle() {
+      var $xeModal = this;
+      var props = $xeModal;
+      $xeModal.$nextTick(function () {
+        var type = props.type;
+        var queueList = type === 'notification' ? notifyQueue : msgQueue;
+        var offsetTop = 0;
+        queueList.forEach(function (comp) {
+          var boxElem = comp.getBox();
+          if (boxElem) {
+            offsetTop += _xeUtils.default.toNumber(comp.top);
+            comp.reactData.modalTop = offsetTop;
+            offsetTop += boxElem.clientHeight;
+          }
+        });
+      });
+    },
+    removeActiveQueue: function removeActiveQueue() {
+      var $xeModal = this;
+      if (allActiveModals.indexOf($xeModal) > -1) {
+        _xeUtils.default.remove(allActiveModals, function (item) {
+          return item === $xeModal;
+        });
+      }
+    },
+    removeMsgQueue: function removeMsgQueue() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var type = props.type;
+      var queueList = type === 'notification' ? notifyQueue : msgQueue;
+      if (queueList.indexOf($xeModal) > -1) {
+        _xeUtils.default.remove(queueList, function (comp) {
+          return comp === $xeModal;
+        });
+      }
+      $xeModal.updateStyle();
+    },
+    closeModal: function closeModal(type) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      var remember = props.remember;
+      var visible = reactData.visible;
+      var isMsg = $xeModal.computeIsMsg;
+      var beforeHideFn = props.beforeHideMethod || (0, _ui.getConfig)().modal.beforeHideMethod;
+      var params = {
+        type: type
+      };
+      if (visible) {
+        Promise.resolve(beforeHideFn ? beforeHideFn(params) : null).then(function (rest) {
+          if (!_xeUtils.default.isError(rest)) {
+            if (isMsg) {
+              $xeModal.removeMsgQueue();
+            }
+            reactData.contentVisible = false;
+            if (!remember) {
+              $xeModal.handleRevert();
+            }
+            $xeModal.removeActiveQueue();
+            $xeModal.dispatchEvent('before-hide', params, null);
+            setTimeout(function () {
+              reactData.visible = false;
+              $xeModal.emitModel(false);
+              $xeModal.dispatchEvent('hide', params, null);
+            }, 200);
+            $xeModal.removeBodyLockScroll();
+          }
+        }).catch(function (e) {
+          return e;
+        });
+      }
+      return $xeModal.$nextTick();
+    },
+    closeEvent: function closeEvent(evnt) {
+      var $xeModal = this;
+      var type = 'close';
+      $xeModal.dispatchEvent(type, {
+        type: type
+      }, evnt);
+      $xeModal.closeModal(type);
+    },
+    confirmEvent: function confirmEvent(evnt) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var confirmClosable = props.confirmClosable;
+      var type = 'confirm';
+      $xeModal.dispatchEvent(type, {
+        type: type
+      }, evnt);
+      if (confirmClosable) {
+        $xeModal.closeModal(type);
+      }
+    },
+    cancelEvent: function cancelEvent(evnt) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var cancelClosable = props.cancelClosable;
+      var type = 'cancel';
+      $xeModal.dispatchEvent(type, {
+        type: type
+      }, evnt);
+      if (cancelClosable) {
+        $xeModal.closeModal(type);
+      }
+    },
+    getStorageMap: function getStorageMap(key) {
+      var version = (0, _ui.getConfig)().version;
+      var rest = _xeUtils.default.toStringJSON(localStorage.getItem(key) || '');
+      return rest && rest._v === version ? rest : {
+        _v: version
+      };
+    },
+    hasPosStorage: function hasPosStorage() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var id = props.id,
+        storage = props.storage,
+        storageKey = props.storageKey;
+      return !!(id && storage && $xeModal.getStorageMap(storageKey)[id]);
+    },
+    restorePosStorage: function restorePosStorage() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      var id = props.id,
+        storage = props.storage,
+        storageKey = props.storageKey;
+      if (id && storage) {
+        var posStorage = $xeModal.getStorageMap(storageKey)[id];
+        if (posStorage) {
+          var boxElem = $xeModal.getBox();
+          var _posStorage$split = posStorage.split(','),
+            _posStorage$split2 = _slicedToArray(_posStorage$split, 8),
+            left = _posStorage$split2[0],
+            top = _posStorage$split2[1],
+            width = _posStorage$split2[2],
+            height = _posStorage$split2[3],
+            zoomLeft = _posStorage$split2[4],
+            zoomTop = _posStorage$split2[5],
+            zoomWidth = _posStorage$split2[6],
+            zoomHeight = _posStorage$split2[7];
+          if (boxElem) {
+            if (left) {
+              boxElem.style.left = "".concat(left, "px");
+            }
+            if (top) {
+              boxElem.style.top = "".concat(top, "px");
+            }
+            if (width) {
+              boxElem.style.width = "".concat(width, "px");
+            }
+            if (height) {
+              boxElem.style.height = "".concat(height, "px");
+            }
+          }
+          if (zoomLeft && zoomTop) {
+            reactData.revertLocat = {
+              left: zoomLeft,
+              top: zoomTop,
+              width: zoomWidth,
+              height: zoomHeight
+            };
+          }
+        }
+      }
+    },
+    addMsgQueue: function addMsgQueue() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var type = props.type;
+      var queueList = type === 'notification' ? notifyQueue : msgQueue;
+      if (queueList.indexOf($xeModal) === -1) {
+        queueList.push($xeModal);
+      }
+      $xeModal.updateStyle();
+    },
+    savePosStorage: function savePosStorage() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      var id = props.id,
+        storage = props.storage,
+        storageKey = props.storageKey;
+      var zoomStatus = reactData.zoomStatus,
+        revertLocat = reactData.revertLocat;
+      if (zoomStatus) {
+        return;
+      }
+      if (id && storage) {
+        var boxElem = $xeModal.getBox();
+        if (!boxElem) {
+          return;
+        }
+        var posStorageMap = $xeModal.getStorageMap(storageKey);
+        posStorageMap[id] = [boxElem.style.left, boxElem.style.top, boxElem.clientWidth, boxElem.clientHeight].concat(revertLocat ? [revertLocat.left, revertLocat.top, revertLocat.width, revertLocat.height] : []).map(function (val) {
+          return val ? _xeUtils.default.toNumber(val) : '';
+        }).join(',');
+        localStorage.setItem(storageKey, _xeUtils.default.toJSONString(posStorageMap));
+      }
+    },
+    handleMinimize: function handleMinimize() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      var zoomOpts = $xeModal.computeZoomOpts;
+      var minimizeLayout = zoomOpts.minimizeLayout,
+        minimizeMaxSize = zoomOpts.minimizeMaxSize,
+        minimizeHorizontalOffset = zoomOpts.minimizeHorizontalOffset,
+        minimizeVerticalOffset = zoomOpts.minimizeVerticalOffset,
+        minimizeOffsetMethod = zoomOpts.minimizeOffsetMethod;
+      var isHorizontalLayout = minimizeLayout === 'horizontal';
+      var prevZoomStatus = reactData.zoomStatus;
+      var hlMList = [];
+      var vlMList = [];
+      allActiveModals.forEach(function (item) {
+        if (item.xID !== $xeModal.xID && item.type === 'modal' && item.reactData.zoomStatus === 'minimize') {
+          var itemZoomOpts = item.computeZoomOpts;
+          if (itemZoomOpts.minimizeLayout === 'horizontal') {
+            hlMList.push(item);
+          } else {
+            vlMList.push(item);
+          }
+        }
+      });
+      var mList = isHorizontalLayout ? hlMList : vlMList;
+      // 如果配置最小化最大数量
+      if (minimizeMaxSize && mList.length >= minimizeMaxSize) {
+        if (_ui.VxeUI.modal) {
+          _ui.VxeUI.modal.message({
+            status: 'error',
+            content: (0, _ui.getI18n)('vxe.modal.miniMaxSize', [minimizeMaxSize])
+          });
+        }
+        return Promise.resolve({
+          status: false
+        });
+      }
+      reactData.prevZoomStatus = prevZoomStatus;
+      reactData.zoomStatus = 'minimize';
+      return $xeModal.$nextTick().then(function () {
+        var boxElem = $xeModal.getBox();
+        if (!boxElem) {
+          return {
+            status: false
+          };
+        }
+        var headerEl = $xeModal.$refs.refHeaderElem;
+        if (!headerEl) {
+          return {
+            status: false
+          };
+        }
+        var _getDomNode = (0, _dom.getDomNode)(),
+          visibleHeight = _getDomNode.visibleHeight;
+        // 如果当前处于复原状态
+        if (!prevZoomStatus) {
+          reactData.revertLocat = {
+            top: boxElem.offsetTop,
+            left: boxElem.offsetLeft,
+            width: boxElem.offsetWidth + (boxElem.style.width ? 0 : 1),
+            height: boxElem.offsetHeight + (boxElem.style.height ? 0 : 1)
+          };
+        }
+        var targetModal = _xeUtils.default[isHorizontalLayout ? 'max' : 'min'](mList, function ($modal) {
+          var boxElem = $modal.getBox();
+          return boxElem ? _xeUtils.default.toNumber(boxElem.style[isHorizontalLayout ? 'left' : 'top']) : 0;
+        });
+        var targetTop = visibleHeight - headerEl.offsetHeight - 16;
+        var targetLeft = 16;
+        if (targetModal) {
+          var minBoxElem = targetModal.getBox();
+          if (minBoxElem) {
+            var boxLeft = _xeUtils.default.toNumber(minBoxElem.style.left);
+            var boxTop = _xeUtils.default.toNumber(minBoxElem.style.top);
+            var offsetObj = {};
+            if (isHorizontalLayout) {
+              offsetObj = Object.assign({}, minimizeHorizontalOffset);
+            } else {
+              offsetObj = Object.assign({}, minimizeVerticalOffset);
+            }
+            targetLeft = boxLeft + _xeUtils.default.toNumber(offsetObj.left);
+            targetTop = boxTop + _xeUtils.default.toNumber(offsetObj.top);
+            if (minimizeOffsetMethod) {
+              offsetObj = minimizeOffsetMethod({
+                $modal: $xeModal,
+                left: targetLeft,
+                top: targetTop
+              });
+              targetLeft = _xeUtils.default.toNumber(offsetObj.left);
+              targetTop = _xeUtils.default.toNumber(offsetObj.top);
+            }
+          }
+        }
+        Object.assign(boxElem.style, {
+          top: "".concat(targetTop, "px"),
+          left: "".concat(targetLeft, "px"),
+          width: '200px',
+          height: "".concat(headerEl.offsetHeight, "px"),
+          minHeight: '',
+          minWidth: ''
+        });
+        $xeModal.savePosStorage();
+        return {
+          status: true
+        };
+      });
+    },
+    handleMaximize: function handleMaximize() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      var prevZoomStatus = reactData.zoomStatus;
+      reactData.prevZoomStatus = prevZoomStatus;
+      reactData.zoomStatus = 'maximize';
+      return $xeModal.$nextTick().then(function () {
+        var boxElem = $xeModal.getBox();
+        if (boxElem) {
+          // 如果当前处于复原状态
+          if (!prevZoomStatus) {
+            var marginSize = _xeUtils.default.toNumber(props.marginSize);
+            var clientVisibleWidth = document.documentElement.clientWidth || document.body.clientWidth;
+            var clientVisibleHeight = document.documentElement.clientHeight || document.body.clientHeight;
+            reactData.revertLocat = {
+              top: Math.max(marginSize, clientVisibleHeight / 2 - boxElem.offsetHeight / 2),
+              left: Math.max(marginSize, clientVisibleWidth / 2 - boxElem.offsetWidth / 2),
+              width: boxElem.offsetWidth + (boxElem.style.width ? 0 : 1),
+              height: boxElem.offsetHeight + (boxElem.style.height ? 0 : 1)
+            };
+          }
+          Object.assign(boxElem.style, {
+            top: '0',
+            left: '0',
+            width: '100%',
+            height: '100%',
+            minHeight: '',
+            minWidth: ''
+          });
+        }
+        $xeModal.savePosStorage();
+      });
+    },
+    handleMsgAutoClose: function handleMsgAutoClose() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var internalData = $xeModal.internalData;
+      var duration = props.duration;
+      if (duration !== -1) {
+        internalData.msgTimeout = setTimeout(function () {
+          return $xeModal.closeModal('close');
+        }, _xeUtils.default.toNumber(duration));
+      }
+    },
+    removeBodyLockScroll: function removeBodyLockScroll() {
+      var $xeModal = this;
+      var xID = $xeModal.xID;
+      var htmlElem = document.documentElement;
+      var lockData = htmlElem.getAttribute(lockScrollAttrKey);
+      if (lockData) {
+        var lockList = lockData.split(',').filter(function (key) {
+          return key !== xID;
+        });
+        if (lockList.length) {
+          htmlElem.setAttribute(lockScrollAttrKey, lockList.join(','));
+        } else {
+          htmlElem.removeAttribute(lockScrollAttrKey);
+          htmlElem.style.removeProperty(lockScrollCssWidthKey);
+        }
+      }
+    },
+    addBodyLockScroll: function addBodyLockScroll() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var xID = $xeModal.xID;
+      var lockScroll = props.lockScroll;
+      var isMsg = $xeModal.computeIsMsg;
+      if (lockScroll && !isMsg) {
+        var htmlElem = document.documentElement;
+        var clientWidth = document.body.clientWidth;
+        var lockData = htmlElem.getAttribute(lockScrollAttrKey);
+        var lockList = lockData ? lockData.split(',') : [];
+        if (!lockList.includes(xID)) {
+          lockList.push(xID);
+          htmlElem.setAttribute(lockScrollAttrKey, lockList.join(','));
+        }
+        htmlElem.style.setProperty(lockScrollCssWidthKey, "".concat(clientWidth, "px"));
+      }
+    },
+    openModal: function openModal() {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      var remember = props.remember,
+        showFooter = props.showFooter;
+      var initialized = reactData.initialized,
+        visible = reactData.visible;
+      var isMsg = $xeModal.computeIsMsg;
+      var btnTransfer = $xeModal.computeBtnTransfer;
+      if (!initialized) {
+        reactData.initialized = true;
+        if (btnTransfer) {
+          var panelElem = $xeModal.$refs.refElem;
+          document.body.appendChild(panelElem);
+        }
+      }
+      if (!visible) {
+        $xeModal.addBodyLockScroll();
+        reactData.visible = true;
+        reactData.contentVisible = false;
+        $xeModal.updateZindex();
+        allActiveModals.push($xeModal);
+        setTimeout(function () {
+          reactData.contentVisible = true;
+          $xeModal.$nextTick(function () {
+            if (!props.fullscreen) {
+              $xeModal.recalculate();
+            }
+            if (showFooter) {
+              var confirmBtn = $xeModal.$refs.refConfirmBtn;
+              var cancelBtn = $xeModal.$refs.refCancelBtn;
+              var operBtn = confirmBtn || cancelBtn;
+              if (operBtn) {
+                operBtn.focus();
+              }
+            }
+            var type = '';
+            var params = {
+              type: type
+            };
+            $xeModal.emitModel(true);
+            $xeModal.dispatchEvent('show', params, null);
+          });
+        }, 10);
+        if (isMsg) {
+          $xeModal.addMsgQueue();
+          $xeModal.handleMsgAutoClose();
+        } else {
+          $xeModal.$nextTick(function () {
+            var firstOpen = reactData.firstOpen;
+            if (firstOpen) {
+              reactData.firstOpen = false;
+              if ($xeModal.hasPosStorage()) {
+                $xeModal.restorePosStorage();
+              } else {
+                if (props.fullscreen) {
+                  $xeModal.$nextTick(function () {
+                    return $xeModal.handleMaximize();
+                  });
+                } else {
+                  $xeModal.recalculate();
+                  $xeModal.updatePosition().then(function () {
+                    setTimeout(function () {
+                      return $xeModal.updatePosition();
+                    }, 20);
+                  });
+                }
+              }
+            } else {
+              if (!remember) {
+                $xeModal.recalculate();
+                $xeModal.updatePosition().then(function () {
+                  setTimeout(function () {
+                    return $xeModal.updatePosition();
+                  }, 20);
+                });
+              }
+            }
+          });
+        }
+      }
+      return $xeModal.$nextTick();
+    },
+    selfClickEvent: function selfClickEvent(evnt) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var el = $xeModal.$refs.refElem;
+      if (props.maskClosable && evnt.target === el) {
+        var type = 'mask';
+        $xeModal.closeModal(type);
+      }
+    },
+    selfMouseoverEvent: function selfMouseoverEvent() {
+      var $xeModal = this;
+      var internalData = $xeModal.internalData;
+      var msgTimeout = internalData.msgTimeout;
+      if (!msgTimeout) {
+        return;
+      }
+      var isMsg = $xeModal.computeIsMsg;
+      if (isMsg) {
+        clearTimeout(msgTimeout);
+        internalData.msgTimeout = undefined;
+      }
+    },
+    selfMouseoutEvent: function selfMouseoutEvent() {
+      var $xeModal = this;
+      var internalData = $xeModal.internalData;
+      var msgTimeout = internalData.msgTimeout;
+      if (!msgTimeout) {
+        var isMsg = $xeModal.computeIsMsg;
+        if (isMsg) {
+          $xeModal.handleMsgAutoClose();
+        }
+      }
+    },
+    handleGlobalKeydownEvent: function handleGlobalKeydownEvent(evnt) {
+      var $xeModal = this;
+      var isEsc = _ui.globalEvents.hasKey(evnt, _ui.GLOBAL_EVENT_KEYS.ESCAPE);
+      if (isEsc) {
+        var lastModal = _xeUtils.default.max(allActiveModals, function (item) {
+          return item.reactData.modalZindex;
+        });
+        // 多个时，只关掉最上层的窗口
+        if (lastModal) {
+          setTimeout(function () {
+            if (lastModal === $xeModal && lastModal.escClosable) {
+              var type = 'exit';
+              $xeModal.dispatchEvent('close', {
+                type: type
+              }, evnt);
+              $xeModal.closeModal(type);
+            }
+          }, 10);
+        }
+      }
+    },
+    handleRevert: function handleRevert() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      reactData.prevZoomStatus = reactData.zoomStatus;
+      reactData.zoomStatus = '';
+      return $xeModal.$nextTick().then(function () {
+        var revertLocat = reactData.revertLocat;
+        if (revertLocat) {
+          var boxElem = $xeModal.getBox();
+          reactData.revertLocat = null;
+          if (boxElem) {
+            Object.assign(boxElem.style, {
+              top: "".concat(revertLocat.top, "px"),
+              left: "".concat(revertLocat.left, "px"),
+              width: "".concat(revertLocat.width, "px"),
+              height: "".concat(revertLocat.height, "px")
+            });
+          }
+          $xeModal.savePosStorage();
+          return $xeModal.$nextTick().then(function () {
+            return {
+              status: true
+            };
+          });
+        }
+        return {
+          status: false
+        };
+      });
+    },
+    handleZoom: function handleZoom(type) {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      var zoomStatus = reactData.zoomStatus;
+      return new Promise(function (resolve) {
+        if (type) {
+          if (type === 'maximize') {
+            resolve($xeModal.handleMaximize());
+            return;
+          }
+          if (type === 'minimize') {
+            resolve($xeModal.handleMinimize());
+            return;
+          }
+          resolve($xeModal.handleRevert());
+          return;
+        }
+        resolve(zoomStatus ? $xeModal.handleRevert() : $xeModal.handleMaximize());
+      }).then(function () {
+        return reactData.zoomStatus || 'revert';
+      });
+    },
+    toggleZoomMinEvent: function toggleZoomMinEvent(evnt) {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      var zoomStatus = reactData.zoomStatus,
+        prevZoomStatus = reactData.prevZoomStatus;
+      return $xeModal.handleZoom(zoomStatus === 'minimize' ? prevZoomStatus || 'revert' : 'minimize').then(function (type) {
+        var params = {
+          type: type
+        };
+        $xeModal.dispatchEvent('zoom', params, evnt);
+      });
+    },
+    toggleZoomMaxEvent: function toggleZoomMaxEvent(evnt) {
+      var $xeModal = this;
+      return $xeModal.handleZoom().then(function (type) {
+        var params = {
+          type: type
+        };
+        $xeModal.dispatchEvent('zoom', params, evnt);
+      });
+    },
+    boxMousedownEvent: function boxMousedownEvent() {
+      var $xeModal = this;
+      var reactData = $xeModal.reactData;
+      var modalZindex = reactData.modalZindex;
+      if (allActiveModals.some(function (comp) {
+        return comp.reactData.visible && comp.reactData.modalZindex > modalZindex;
+      })) {
+        $xeModal.updateZindex();
+      }
+    },
+    mousedownEvent: function mousedownEvent(evnt) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      var storage = props.storage;
+      var zoomStatus = reactData.zoomStatus;
+      var marginSize = _xeUtils.default.toNumber(props.marginSize);
+      var boxElem = $xeModal.getBox();
+      if (!boxElem) {
+        return;
+      }
+      if (zoomStatus !== 'maximize' && evnt.button === 0 && !(0, _dom.getEventTargetNode)(evnt, boxElem, 'trigger--btn').flag) {
+        evnt.preventDefault();
+        var disX = evnt.clientX - boxElem.offsetLeft;
+        var disY = evnt.clientY - boxElem.offsetTop;
+        var _getDomNode2 = (0, _dom.getDomNode)(),
+          visibleHeight = _getDomNode2.visibleHeight,
+          visibleWidth = _getDomNode2.visibleWidth;
+        document.onmousemove = function (evnt) {
+          evnt.preventDefault();
+          var offsetWidth = boxElem.offsetWidth;
+          var offsetHeight = boxElem.offsetHeight;
+          var minX = marginSize;
+          var maxX = visibleWidth - offsetWidth - marginSize - 1;
+          var minY = marginSize;
+          var maxY = visibleHeight - offsetHeight - marginSize - 1;
+          var left = evnt.clientX - disX;
+          var top = evnt.clientY - disY;
+          if (left > maxX) {
+            left = maxX;
+          }
+          if (left < minX) {
+            left = minX;
+          }
+          if (top > maxY) {
+            top = maxY;
+          }
+          if (top < minY) {
+            top = minY;
+          }
+          boxElem.style.left = "".concat(left, "px");
+          boxElem.style.top = "".concat(top, "px");
+          boxElem.className = boxElem.className.replace(/\s?is--drag/, '') + ' is--drag';
+          $xeModal.$emit('move', (0, _ui.createEvent)(evnt, {
+            type: 'move'
+          }));
+          reactData.resizeFlag++;
+        };
+        document.onmouseup = function () {
+          document.onmousemove = null;
+          document.onmouseup = null;
+          if (storage) {
+            $xeModal.$nextTick(function () {
+              $xeModal.savePosStorage();
+            });
+          }
+          reactData.resizeFlag++;
+          setTimeout(function () {
+            boxElem.className = boxElem.className.replace(/\s?is--drag/, '');
+          }, 50);
+        };
+      }
+    },
+    dragEvent: function dragEvent(evnt) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var reactData = $xeModal.reactData;
+      evnt.preventDefault();
+      var storage = props.storage;
+      var _getDomNode3 = (0, _dom.getDomNode)(),
+        visibleHeight = _getDomNode3.visibleHeight,
+        visibleWidth = _getDomNode3.visibleWidth;
+      var marginSize = _xeUtils.default.toNumber(props.marginSize);
+      var targetElem = evnt.target;
+      var type = targetElem.getAttribute('type');
+      var minWidth = _xeUtils.default.toNumber(props.minWidth);
+      var minHeight = _xeUtils.default.toNumber(props.minHeight);
+      var maxWidth = visibleWidth;
+      var maxHeight = visibleHeight;
+      var boxElem = $xeModal.getBox();
+      var clientWidth = boxElem.clientWidth;
+      var clientHeight = boxElem.clientHeight;
+      var disX = evnt.clientX;
+      var disY = evnt.clientY;
+      var offsetTop = boxElem.offsetTop;
+      var offsetLeft = boxElem.offsetLeft;
+      var params = {
+        type: 'resize'
+      };
+      document.onmousemove = function (evnt) {
+        evnt.preventDefault();
+        var dragLeft;
+        var dragTop;
+        var width;
+        var height;
+        switch (type) {
+          case 'wl':
+            dragLeft = disX - evnt.clientX;
+            width = dragLeft + clientWidth;
+            if (offsetLeft - dragLeft > marginSize) {
+              if (width > minWidth) {
+                boxElem.style.width = "".concat(width < maxWidth ? width : maxWidth, "px");
+                boxElem.style.left = "".concat(offsetLeft - dragLeft, "px");
+              }
+            }
+            break;
+          case 'swst':
+            dragLeft = disX - evnt.clientX;
+            dragTop = disY - evnt.clientY;
+            width = dragLeft + clientWidth;
+            height = dragTop + clientHeight;
+            if (offsetLeft - dragLeft > marginSize) {
+              if (width > minWidth) {
+                boxElem.style.width = "".concat(width < maxWidth ? width : maxWidth, "px");
+                boxElem.style.left = "".concat(offsetLeft - dragLeft, "px");
+              }
+            }
+            if (offsetTop - dragTop > marginSize) {
+              if (height > minHeight) {
+                boxElem.style.height = "".concat(height < maxHeight ? height : maxHeight, "px");
+                boxElem.style.top = "".concat(offsetTop - dragTop, "px");
+              }
+            }
+            break;
+          case 'swlb':
+            dragLeft = disX - evnt.clientX;
+            dragTop = evnt.clientY - disY;
+            width = dragLeft + clientWidth;
+            height = dragTop + clientHeight;
+            if (offsetLeft - dragLeft > marginSize) {
+              if (width > minWidth) {
+                boxElem.style.width = "".concat(width < maxWidth ? width : maxWidth, "px");
+                boxElem.style.left = "".concat(offsetLeft - dragLeft, "px");
+              }
+            }
+            if (offsetTop + height + marginSize < visibleHeight) {
+              if (height > minHeight) {
+                boxElem.style.height = "".concat(height < maxHeight ? height : maxHeight, "px");
+              }
+            }
+            break;
+          case 'st':
+            dragTop = disY - evnt.clientY;
+            height = clientHeight + dragTop;
+            if (offsetTop - dragTop > marginSize) {
+              if (height > minHeight) {
+                boxElem.style.height = "".concat(height < maxHeight ? height : maxHeight, "px");
+                boxElem.style.top = "".concat(offsetTop - dragTop, "px");
+              }
+            }
+            break;
+          case 'wr':
+            dragLeft = evnt.clientX - disX;
+            width = dragLeft + clientWidth;
+            if (offsetLeft + width + marginSize < visibleWidth) {
+              if (width > minWidth) {
+                boxElem.style.width = "".concat(width < maxWidth ? width : maxWidth, "px");
+              }
+            }
+            break;
+          case 'sest':
+            dragLeft = evnt.clientX - disX;
+            dragTop = disY - evnt.clientY;
+            width = dragLeft + clientWidth;
+            height = dragTop + clientHeight;
+            if (offsetLeft + width + marginSize < visibleWidth) {
+              if (width > minWidth) {
+                boxElem.style.width = "".concat(width < maxWidth ? width : maxWidth, "px");
+              }
+            }
+            if (offsetTop - dragTop > marginSize) {
+              if (height > minHeight) {
+                boxElem.style.height = "".concat(height < maxHeight ? height : maxHeight, "px");
+                boxElem.style.top = "".concat(offsetTop - dragTop, "px");
+              }
+            }
+            break;
+          case 'selb':
+            dragLeft = evnt.clientX - disX;
+            dragTop = evnt.clientY - disY;
+            width = dragLeft + clientWidth;
+            height = dragTop + clientHeight;
+            if (offsetLeft + width + marginSize < visibleWidth) {
+              if (width > minWidth) {
+                boxElem.style.width = "".concat(width < maxWidth ? width : maxWidth, "px");
+              }
+            }
+            if (offsetTop + height + marginSize < visibleHeight) {
+              if (height > minHeight) {
+                boxElem.style.height = "".concat(height < maxHeight ? height : maxHeight, "px");
+              }
+            }
+            break;
+          case 'sb':
+            dragTop = evnt.clientY - disY;
+            height = dragTop + clientHeight;
+            if (offsetTop + height + marginSize < visibleHeight) {
+              if (height > minHeight) {
+                boxElem.style.height = "".concat(height < maxHeight ? height : maxHeight, "px");
+              }
+            }
+            break;
+        }
+        boxElem.className = boxElem.className.replace(/\s?is--drag/, '') + ' is--drag';
+        if (storage) {
+          $xeModal.savePosStorage();
+        }
+        $xeModal.dispatchEvent('resize', params, evnt);
+      };
+      document.onmouseup = function () {
+        reactData.revertLocat = null;
+        document.onmousemove = null;
+        document.onmouseup = null;
+        setTimeout(function () {
+          boxElem.className = boxElem.className.replace(/\s?is--drag/, '');
+        }, 50);
+      };
+    },
+    //
+    // Render
+    //
+    renderTitles: function renderTitles(h) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var slots = $xeModal.$scopedSlots;
+      var reactData = $xeModal.reactData;
+      var _props$slots = props.slots,
+        propSlots = _props$slots === void 0 ? {} : _props$slots,
+        showClose = props.showClose,
+        showZoom = props.showZoom,
+        showMaximize = props.showMaximize,
+        showMinimize = props.showMinimize,
+        title = props.title;
+      var zoomStatus = reactData.zoomStatus;
+      var titleSlot = slots.title || propSlots.title;
+      var cornerSlot = slots.corner || propSlots.corner;
+      var isMinimizeStatus = $xeModal.computeIsMinimizeStatus;
+      var isMaximizeStatus = $xeModal.computeIsMaximizeStatus;
+      return [h('div', {
+        class: 'vxe-modal--header-title'
+      }, titleSlot ? $xeModal.callSlot(titleSlot, {
+        $modal: $xeModal,
+        minimized: isMinimizeStatus,
+        maximized: isMaximizeStatus
+      }, h) : title ? (0, _utils.getFuncText)(title) : (0, _ui.getI18n)('vxe.alert.title')), h('div', {
+        class: 'vxe-modal--header-right'
+      }, [cornerSlot && !isMinimizeStatus ? h('div', {
+        class: 'vxe-modal--corner-wrapper'
+      }, $xeModal.callSlot(cornerSlot, {
+        $modal: $xeModal
+      }, h)) : (0, _ui.renderEmptyElement)($xeModal), (_xeUtils.default.isBoolean(showMinimize) ? showMinimize : showZoom) ? h('div', {
+        class: ['vxe-modal--zoom-btn', 'trigger--btn'],
+        attrs: {
+          title: (0, _ui.getI18n)("vxe.modal.zoom".concat(zoomStatus === 'minimize' ? 'Out' : 'Min'))
+        },
+        on: {
+          click: $xeModal.toggleZoomMinEvent
+        }
+      }, [h('i', {
+        class: zoomStatus === 'minimize' ? (0, _ui.getIcon)().MODAL_ZOOM_REVERT : (0, _ui.getIcon)().MODAL_ZOOM_MIN
+      })]) : (0, _ui.renderEmptyElement)($xeModal), (_xeUtils.default.isBoolean(showMaximize) ? showMaximize : showZoom) && zoomStatus !== 'minimize' ? h('div', {
+        class: ['vxe-modal--zoom-btn', 'trigger--btn'],
+        attrs: {
+          title: (0, _ui.getI18n)("vxe.modal.zoom".concat(zoomStatus === 'maximize' ? 'Out' : 'In'))
+        },
+        on: {
+          click: $xeModal.toggleZoomMaxEvent
+        }
+      }, [h('i', {
+        class: zoomStatus === 'maximize' ? (0, _ui.getIcon)().MODAL_ZOOM_OUT : (0, _ui.getIcon)().MODAL_ZOOM_IN
+      })]) : (0, _ui.renderEmptyElement)($xeModal), showClose ? h('div', {
+        class: ['vxe-modal--close-btn', 'trigger--btn'],
+        attrs: {
+          title: (0, _ui.getI18n)('vxe.modal.close')
+        },
+        on: {
+          click: $xeModal.closeEvent
+        }
+      }, [h('i', {
+        class: (0, _ui.getIcon)().MODAL_CLOSE
+      })]) : (0, _ui.renderEmptyElement)($xeModal)])];
+    },
+    renderHeader: function renderHeader(h) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var slots = $xeModal.$scopedSlots;
+      var _props$slots2 = props.slots,
+        propSlots = _props$slots2 === void 0 ? {} : _props$slots2,
+        showZoom = props.showZoom,
+        showMaximize = props.showMaximize,
+        draggable = props.draggable;
+      var headerSlot = slots.header || propSlots.header;
+      if (props.showHeader) {
+        var headerOns = {};
+        if (draggable) {
+          headerOns.mousedown = $xeModal.mousedownEvent;
+        }
+        if ((_xeUtils.default.isBoolean(showMaximize) ? showMaximize : showZoom) && props.dblclickZoom && props.type === 'modal') {
+          headerOns.dblclick = $xeModal.toggleZoomMaxEvent;
+        }
+        return h('div', {
+          ref: 'refHeaderElem',
+          class: ['vxe-modal--header', {
+            'is--ellipsis': props.showTitleOverflow
+          }],
+          on: headerOns
+        }, headerSlot ? $xeModal.callSlot(headerSlot, {
+          $modal: $xeModal
+        }, h) : $xeModal.renderTitles(h));
+      }
+      return (0, _ui.renderEmptyElement)($xeModal);
+    },
+    renderBody: function renderBody(h) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var slots = $xeModal.$scopedSlots;
+      var _props$slots3 = props.slots,
+        propSlots = _props$slots3 === void 0 ? {} : _props$slots3,
+        status = props.status,
+        message = props.message,
+        iconStatus = props.iconStatus,
+        useHtml = props.useHtml;
+      var content = props.content || message;
+      var isMsg = $xeModal.computeIsMsg;
+      var defaultSlot = slots.default || propSlots.default;
+      var leftSlot = slots.left || propSlots.left;
+      var rightSlot = slots.right || propSlots.right;
+      var contVNs = [];
+      if (!isMsg && (status || iconStatus)) {
+        contVNs.push(h('div', {
+          class: 'vxe-modal--status-wrapper'
+        }, [h('i', {
+          class: ['vxe-modal--status-icon', iconStatus || (0, _ui.getIcon)()["MODAL_".concat(status).toLocaleUpperCase()]]
+        })]));
+      }
+      contVNs.push(useHtml && !defaultSlot ? h('div', {
+        key: 'hc',
+        class: 'vxe-modal--content',
+        domProps: {
+          innerHTML: (0, _utils.getFuncText)(content)
+        }
+      }) : h('div', {
+        key: 'dc',
+        class: 'vxe-modal--content'
+      }, defaultSlot ? $xeModal.callSlot(defaultSlot, {
+        $modal: $xeModal
+      }, h) : (0, _utils.getFuncText)(content)));
+      return h('div', {
+        class: 'vxe-modal--body'
+      }, [leftSlot ? h('div', {
+        class: 'vxe-modal--body-left'
+      }, $xeModal.callSlot(leftSlot, {
+        $modal: $xeModal
+      }, h)) : (0, _ui.renderEmptyElement)($xeModal), h('div', {
+        class: 'vxe-modal--body-default'
+      }, contVNs), rightSlot ? h('div', {
+        class: 'vxe-modal--body-right'
+      }, $xeModal.callSlot(rightSlot, {
+        $modal: $xeModal
+      }, h)) : (0, _ui.renderEmptyElement)($xeModal), isMsg ? (0, _ui.renderEmptyElement)($xeModal) : h(_loading.default, {
+        class: 'vxe-modal--loading',
+        props: {
+          value: props.loading
+        }
+      })]);
+    },
+    renderDefaultFooter: function renderDefaultFooter(h) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var slots = $xeModal.$scopedSlots;
+      var _props$slots4 = props.slots,
+        propSlots = _props$slots4 === void 0 ? {} : _props$slots4,
+        showCancelButton = props.showCancelButton,
+        showConfirmButton = props.showConfirmButton,
+        type = props.type,
+        loading = props.loading;
+      var lfSlot = slots.leftfoot || propSlots.leftfoot;
+      var rfSlot = slots.rightfoot || propSlots.rightfoot;
+      var btnVNs = [];
+      if (_xeUtils.default.isBoolean(showCancelButton) ? showCancelButton : type === 'confirm') {
+        btnVNs.push(h(_button.default, {
+          key: 1,
+          ref: 'refCancelBtn',
+          props: {
+            content: props.cancelButtonText || (0, _ui.getI18n)('vxe.button.cancel')
+          },
+          on: {
+            click: $xeModal.cancelEvent
+          }
+        }));
+      }
+      if (_xeUtils.default.isBoolean(showConfirmButton) ? showConfirmButton : type === 'confirm' || type === 'alert') {
+        btnVNs.push(h(_button.default, {
+          key: 2,
+          ref: 'refConfirmBtn',
+          props: {
+            status: 'primary',
+            loading: loading,
+            content: props.confirmButtonText || (0, _ui.getI18n)('vxe.button.confirm')
+          },
+          on: {
+            click: $xeModal.confirmEvent
+          }
+        }));
+      }
+      return h('div', {
+        class: 'vxe-modal--footer-wrapper'
+      }, [h('div', {
+        class: 'vxe-modal--footer-left'
+      }, lfSlot ? $xeModal.callSlot(lfSlot, {
+        $modal: $xeModal
+      }, h) : []), h('div', {
+        class: 'vxe-modal--footer-right'
+      }, rfSlot ? $xeModal.callSlot(rfSlot, {
+        $modal: $xeModal
+      }, h) : btnVNs)]);
+    },
+    renderFooter: function renderFooter(h) {
+      var $xeModal = this;
+      var props = $xeModal;
+      var slots = $xeModal.$scopedSlots;
+      var _props$slots5 = props.slots,
+        propSlots = _props$slots5 === void 0 ? {} : _props$slots5;
+      var footerSlot = slots.footer || propSlots.footer;
+      if (props.showFooter) {
+        return h('div', {
+          class: 'vxe-modal--footer'
+        }, footerSlot ? $xeModal.callSlot(footerSlot, {
+          $modal: $xeModal
+        }, h) : [$xeModal.renderDefaultFooter(h)]);
+      }
+      return (0, _ui.renderEmptyElement)($xeModal);
+    },
+    renderVN: function renderVN(h) {
+      var _ref2;
+      var $xeModal = this;
+      var props = $xeModal;
+      var slots = $xeModal.$scopedSlots;
+      var reactData = $xeModal.reactData;
+      var _props$slots6 = props.slots,
+        propSlots = _props$slots6 === void 0 ? {} : _props$slots6,
+        className = props.className,
+        type = props.type,
+        animat = props.animat,
+        draggable = props.draggable,
+        iconStatus = props.iconStatus,
+        position = props.position,
+        loading = props.loading,
+        destroyOnClose = props.destroyOnClose,
+        status = props.status,
+        lockScroll = props.lockScroll,
+        padding = props.padding,
+        lockView = props.lockView,
+        mask = props.mask,
+        resize = props.resize;
+      var initialized = reactData.initialized,
+        modalTop = reactData.modalTop,
+        contentVisible = reactData.contentVisible,
+        visible = reactData.visible,
+        zoomStatus = reactData.zoomStatus;
+      var asideSlot = slots.aside || propSlots.aside;
+      var vSize = $xeModal.computeSize;
+      var isMsg = $xeModal.computeIsMsg;
+      var isMinimizeStatus = $xeModal.computeIsMinimizeStatus;
+      var ons = {};
+      if (isMsg) {
+        ons.mouseover = $xeModal.selfMouseoverEvent;
+        ons.mouseout = $xeModal.selfMouseoutEvent;
+      }
+      return h('div', {
+        ref: 'refElem',
+        class: ['vxe-modal--wrapper', "type--".concat(type), "zoom--".concat(zoomStatus || 'revert'), className || '', position ? "pos--".concat(position) : '', (_ref2 = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_ref2, "size--".concat(vSize), vSize), "status--".concat(status), status), 'is--padding', padding), 'is--animat', animat), 'lock--scroll', lockScroll), 'lock--view', lockView), 'is--draggable', draggable), 'is--resize', resize), 'is--mask', mask), 'is--visible', contentVisible), _defineProperty(_defineProperty(_ref2, 'is--active', visible), 'is--loading', loading))],
+        style: {
+          zIndex: reactData.modalZindex,
+          top: modalTop ? "".concat(modalTop, "px") : null
+        },
+        on: Object.assign(Object.assign({}, ons), {
+          click: $xeModal.selfClickEvent
+        })
+      }, initialized ? [h('div', {
+        ref: 'refModalBox',
+        class: 'vxe-modal--box',
+        on: {
+          mousedown: $xeModal.boxMousedownEvent
+        }
+      }, [(isMsg || asideSlot) && !isMinimizeStatus ? h('div', {
+        class: 'vxe-modal--aside'
+      }, asideSlot ? $xeModal.callSlot(asideSlot, {
+        $modal: $xeModal
+      }, h) : [status || iconStatus ? h('div', {
+        class: 'vxe-modal--status-wrapper'
+      }, [h('i', {
+        class: ['vxe-modal--status-icon', iconStatus || (0, _ui.getIcon)()["MODAL_".concat(status).toLocaleUpperCase()]]
+      })]) : (0, _ui.renderEmptyElement)($xeModal)]) : (0, _ui.renderEmptyElement)($xeModal), h('div', {
+        class: 'vxe-modal--container'
+      }, !reactData.initialized || destroyOnClose && !reactData.visible ? [] : [$xeModal.renderHeader(h), $xeModal.renderBody(h), $xeModal.renderFooter(h), !isMsg && resize ? h('span', {
+        class: 'vxe-modal--resize'
+      }, ['wl', 'wr', 'swst', 'sest', 'st', 'swlb', 'selb', 'sb'].map(function (type) {
+        return h('span', {
+          class: "".concat(type, "-resize"),
+          attrs: {
+            type: type
+          },
+          on: {
+            mousedown: $xeModal.dragEvent
+          }
+        });
+      })) : (0, _ui.renderEmptyElement)($xeModal)])])] : []);
+    }
+  },
+  mounted: function mounted() {
+    var $xeModal = this;
+    var slots = $xeModal.$scopedSlots;
+    var props = $xeModal;
+    var reactData = $xeModal.reactData;
+    if (props.type === 'modal' && props.showFooter && !(props.showConfirmButton || props.showCancelButton || slots.footer)) {
+      warnLog('vxe.modal.footPropErr');
+    }
+    reactData.initialized = !!props.preload;
+    $xeModal.$nextTick(function () {
+      if (props.storage && !props.id) {
+        errLog('vxe.error.reqProp', ['[modal] id']);
+      }
+      if (props.value) {
+        $xeModal.openModal();
+      }
+      $xeModal.recalculate();
+    });
+    if (props.escClosable) {
+      _ui.globalEvents.on($xeModal, 'keydown', $xeModal.handleGlobalKeydownEvent);
+    }
+  },
+  beforeDestroy: function beforeDestroy() {
+    var $xeModal = this;
+    var panelElem = $xeModal.$refs.refElem;
+    if (panelElem && panelElem.parentNode) {
+      panelElem.parentNode.removeChild(panelElem);
+    }
+    _ui.globalEvents.off($xeModal, 'keydown');
+    $xeModal.removeMsgQueue();
+    $xeModal.removeActiveQueue();
+    $xeModal.removeBodyLockScroll();
+  },
+  render: function render(h) {
+    return this.renderVN(h);
+  }
+});
+/* define-vxe-component end */