vxe-pc-ui 4.6.3 → 4.6.5

package/lib/index.umd.js

@@ -4213,14 +4213,14 @@ function checkDynamic() {
 }
 ;// CONCATENATED MODULE: ./packages/ui/src/log.ts
 
-const log_version = `ui v${"4.6.3"}`;
+const log_version = `ui v${"4.6.5"}`;
 const warnLog = log.create('warn', log_version);
 const errLog = log.create('error', log_version);
 ;// CONCATENATED MODULE: ./packages/ui/index.ts
 
 
 
-const ui_version = "4.6.3";
+const ui_version = "4.6.5";
 index_esm_VxeUI.uiVersion = ui_version;
 index_esm_VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -5071,6 +5071,102 @@ function dom_triggerEvent(targetElem, type) {
 function isNodeElement(elem) {
   return elem && elem.nodeType === 1;
 }
+function updatePanelPlacement(targetElem, panelElem, options) {
+  const {
+    placement,
+    teleportTo,
+    marginSize
+  } = Object.assign({
+    teleportTo: false,
+    marginSize: 5
+  }, options);
+  let panelPlacement = 'bottom';
+  let top = '';
+  let bottom = '';
+  let left = '';
+  const right = '';
+  let minWidth = '';
+  const stys = {};
+  if (panelElem && targetElem) {
+    const documentElement = document.documentElement;
+    const bodyElem = document.body;
+    const targetHeight = targetElem.offsetHeight;
+    const panelHeight = panelElem.offsetHeight;
+    const panelWidth = panelElem.offsetWidth;
+    const bounding = targetElem.getBoundingClientRect();
+    const boundingTop = bounding.top;
+    const boundingLeft = bounding.left;
+    const visibleHeight = documentElement.clientHeight || bodyElem.clientHeight;
+    const visibleWidth = documentElement.clientWidth || bodyElem.clientWidth;
+    minWidth = targetElem.offsetWidth;
+    if (teleportTo) {
+      left = boundingLeft;
+      top = boundingTop + targetHeight;
+      if (placement === 'top') {
+        panelPlacement = 'top';
+        top = boundingTop - panelHeight;
+      } else if (!placement) {
+        // 如果下面不够放，则向上
+        if (top + panelHeight + marginSize > visibleHeight) {
+          panelPlacement = 'top';
+          top = boundingTop - panelHeight;
+        }
+        // 如果上面不够放，则向下（优先）
+        if (top < marginSize) {
+          panelPlacement = 'bottom';
+          top = boundingTop + targetHeight;
+        }
+      }
+      // 如果溢出右边
+      if (left + panelWidth + marginSize > visibleWidth) {
+        left -= left + panelWidth + marginSize - visibleWidth;
+      }
+      // 如果溢出左边
+      if (left < marginSize) {
+        left = marginSize;
+      }
+    } else {
+      if (placement === 'top') {
+        panelPlacement = 'top';
+        bottom = targetHeight;
+      } else if (!placement) {
+        // 如果下面不够放，则向上
+        top = targetHeight;
+        if (boundingTop + targetHeight + panelHeight > visibleHeight) {
+          // 如果上面不够放，则向下（优先）
+          if (boundingTop - targetHeight - panelHeight > marginSize) {
+            panelPlacement = 'top';
+            top = '';
+            bottom = targetHeight;
+          }
+        }
+      }
+    }
+    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(top)) {
+      stys.top = toCssUnit(top);
+    }
+    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(bottom)) {
+      stys.bottom = toCssUnit(bottom);
+    }
+    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(left)) {
+      stys.left = toCssUnit(left);
+    }
+    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(right)) {
+      stys.right = toCssUnit(right);
+    }
+    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(minWidth)) {
+      stys.minWidth = toCssUnit(minWidth);
+    }
+  }
+  return {
+    top: top || 0,
+    bottom: bottom || 0,
+    left: left || 0,
+    right: right || 0,
+    style: stys,
+    placement: panelPlacement
+  };
+}
 ;// CONCATENATED MODULE: ./packages/anchor/src/util.ts
 
 function assembleAnchorLink($xeAnchor, elem, linkConfig, $xeParentAnchorLink) {
@@ -6590,85 +6686,28 @@ function handleBooleanDefaultValue(value) {
       }
     };
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex
-        } = reactData;
-        const targetElem = refButton.value;
-        const panelElem = refBtnPanel.value;
-        const btnTransfer = computeBtnTransfer.value;
-        if (panelElem && targetElem) {
-          const targetHeight = targetElem.offsetHeight;
-          const targetWidth = targetElem.offsetWidth;
-          const panelHeight = panelElem.offsetHeight;
-          const panelWidth = panelElem.offsetWidth;
-          const marginSize = 5;
-          const panelStyle = {
-            zIndex: panelIndex
-          };
-          const {
-            top,
-            left,
-            boundingTop,
-            visibleHeight,
-            visibleWidth
-          } = getAbsolutePos(targetElem);
-          let panelPlacement = 'bottom';
-          if (btnTransfer) {
-            let btnLeft = left + targetWidth - panelWidth;
-            let btnTop = top + targetHeight;
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              btnTop = top - panelHeight;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (boundingTop + targetHeight + panelHeight + marginSize > visibleHeight) {
-                panelPlacement = 'top';
-                btnTop = top - panelHeight;
-              }
-              // 如果上面不够放，则向下（优先）
-              if (btnTop < marginSize) {
-                panelPlacement = 'bottom';
-                btnTop = top + targetHeight;
-              }
-            }
-            // 如果溢出右边
-            if (btnLeft + panelWidth + marginSize > visibleWidth) {
-              btnLeft -= btnLeft + panelWidth + marginSize - visibleWidth;
-            }
-            // 如果溢出左边
-            if (btnLeft < marginSize) {
-              btnLeft = marginSize;
-            }
-            Object.assign(panelStyle, {
-              left: `${btnLeft}px`,
-              right: 'auto',
-              top: `${btnTop}px`,
-              minWidth: `${targetWidth}px`
-            });
-          } else {
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              panelStyle.bottom = `${targetHeight}px`;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                // 如果上面不够放，则向下（优先）
-                if (boundingTop - targetHeight - panelHeight > marginSize) {
-                  panelPlacement = 'top';
-                  panelStyle.bottom = `${targetHeight}px`;
-                }
-              }
-            }
-          }
-          reactData.panelStyle = panelStyle;
-          reactData.panelPlacement = panelPlacement;
-          return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-        }
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refButton.value;
+      const panelElem = refBtnPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     const clickEvent = evnt => {
       if ($xeButtonGroup) {
@@ -7014,6 +7053,7 @@ function handleBooleanDefaultValue(value) {
             $button: $xeButton
           }) : popupClassName : '', {
             [`size--${vSize}`]: vSize,
+            'is--transfer': btnTransfer,
             'ani--leave': isAniVisible,
             'ani--enter': visiblePanel
           }],
@@ -13499,83 +13539,28 @@ function toFloatValueFixed(inputValue, digitsValue) {
       }
     };
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex
-        } = reactData;
-        const el = refElem.value;
-        const panelElem = refOptionPanel.value;
-        const btnTransfer = computeBtnTransfer.value;
-        if (panelElem && el) {
-          const targetHeight = el.offsetHeight;
-          const targetWidth = el.offsetWidth;
-          const panelHeight = panelElem.offsetHeight;
-          const panelWidth = panelElem.offsetWidth;
-          const marginSize = 5;
-          const panelStyle = {
-            zIndex: panelIndex
-          };
-          const {
-            boundingTop,
-            boundingLeft,
-            visibleHeight,
-            visibleWidth
-          } = getAbsolutePos(el);
-          let panelPlacement = 'bottom';
-          if (btnTransfer) {
-            let left = boundingLeft;
-            let top = boundingTop + targetHeight;
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              top = boundingTop - panelHeight;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (top + panelHeight + marginSize > visibleHeight) {
-                panelPlacement = 'top';
-                top = boundingTop - panelHeight;
-              }
-              // 如果上面不够放，则向下（优先）
-              if (top < marginSize) {
-                panelPlacement = 'bottom';
-                top = boundingTop + targetHeight;
-              }
-            }
-            // 如果溢出右边
-            if (left + panelWidth + marginSize > visibleWidth) {
-              left -= left + panelWidth + marginSize - visibleWidth;
-            }
-            // 如果溢出左边
-            if (left < marginSize) {
-              left = marginSize;
-            }
-            Object.assign(panelStyle, {
-              left: `${left}px`,
-              top: `${top}px`,
-              minWidth: `${targetWidth}px`
-            });
-          } else {
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              panelStyle.bottom = `${targetHeight}px`;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                // 如果上面不够放，则向下（优先）
-                if (boundingTop - targetHeight - panelHeight > marginSize) {
-                  panelPlacement = 'top';
-                  panelStyle.bottom = `${targetHeight}px`;
-                }
-              }
-            }
-          }
-          reactData.panelStyle = panelStyle;
-          reactData.panelPlacement = panelPlacement;
-          return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-        }
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refElem.value;
+      const panelElem = refOptionPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     const showOptionPanel = () => {
       const {
@@ -16809,85 +16794,28 @@ const DatePanel = VxeDatePanel;
       }
     };
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex
-        } = reactData;
-        const targetElem = refInputTarget.value;
-        const panelElem = refInputPanel.value;
-        const btnTransfer = computeBtnTransfer.value;
-        if (targetElem && panelElem) {
-          const targetHeight = targetElem.offsetHeight;
-          const targetWidth = targetElem.offsetWidth;
-          const panelHeight = panelElem.offsetHeight;
-          const panelWidth = panelElem.offsetWidth;
-          const marginSize = 5;
-          const panelStyle = {
-            zIndex: panelIndex
-          };
-          const {
-            boundingTop,
-            boundingLeft,
-            visibleHeight,
-            visibleWidth
-          } = getAbsolutePos(targetElem);
-          let panelPlacement = 'bottom';
-          if (btnTransfer) {
-            let left = boundingLeft;
-            let top = boundingTop + targetHeight;
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              top = boundingTop - panelHeight;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (top + panelHeight + marginSize > visibleHeight) {
-                panelPlacement = 'top';
-                top = boundingTop - panelHeight;
-              }
-              // 如果上面不够放，则向下（优先）
-              if (top < marginSize) {
-                panelPlacement = 'bottom';
-                top = boundingTop + targetHeight;
-              }
-            }
-            // 如果溢出右边
-            if (left + panelWidth + marginSize > visibleWidth) {
-              left -= left + panelWidth + marginSize - visibleWidth;
-            }
-            // 如果溢出左边
-            if (left < marginSize) {
-              left = marginSize;
-            }
-            Object.assign(panelStyle, {
-              left: `${left}px`,
-              top: `${top}px`,
-              minWidth: `${targetWidth}px`
-            });
-          } else {
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              panelStyle.bottom = `${targetHeight}px`;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              panelStyle.top = `${targetHeight}px`;
-              if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                // 如果上面不够放，则向下（优先）
-                if (boundingTop - targetHeight - panelHeight > marginSize) {
-                  panelPlacement = 'top';
-                  panelStyle.top = '';
-                  panelStyle.bottom = `${targetHeight}px`;
-                }
-              }
-            }
-          }
-          reactData.panelStyle = panelStyle;
-          reactData.panelPlacement = panelPlacement;
-          return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-        }
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refInputTarget.value;
+      const panelElem = refInputPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     const showPanel = () => {
       const {
@@ -17521,7 +17449,7 @@ const DatePicker = VxeDatePicker;
       if (globalPlaceholder) {
         return getFuncText(globalPlaceholder);
       }
-      return i18n_getI18n('vxe.base.pleaseSelect');
+      return i18n_getI18n('vxe.dateRangePicker.pleaseRange');
     });
     const computeInpImmediate = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       const {
@@ -17867,11 +17795,11 @@ const DatePicker = VxeDatePicker;
       if ($startDatePanel && $endDatePanel) {
         const startValue = $startDatePanel.getModelValue();
         const endValue = $endDatePanel.getModelValue();
-        if (startValue && endValue) {
+        if (startValue && !endValue || !startValue && endValue) {
+          handleChange('', '', evnt);
+        } else {
           $startDatePanel.confirmByEvent(evnt);
           $endDatePanel.confirmByEvent(evnt);
-        } else {
-          handleChange('', '', evnt);
         }
       }
       hidePanel();
@@ -17976,85 +17904,28 @@ const DatePicker = VxeDatePicker;
       }
     };
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex
-        } = reactData;
-        const targetElem = refInputTarget.value;
-        const panelElem = refInputPanel.value;
-        const btnTransfer = computeBtnTransfer.value;
-        if (targetElem && panelElem) {
-          const targetHeight = targetElem.offsetHeight;
-          const targetWidth = targetElem.offsetWidth;
-          const panelHeight = panelElem.offsetHeight;
-          const panelWidth = panelElem.offsetWidth;
-          const marginSize = 5;
-          const panelStyle = {
-            zIndex: panelIndex
-          };
-          const {
-            boundingTop,
-            boundingLeft,
-            visibleHeight,
-            visibleWidth
-          } = getAbsolutePos(targetElem);
-          let panelPlacement = 'bottom';
-          if (btnTransfer) {
-            let left = boundingLeft;
-            let top = boundingTop + targetHeight;
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              top = boundingTop - panelHeight;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (top + panelHeight + marginSize > visibleHeight) {
-                panelPlacement = 'top';
-                top = boundingTop - panelHeight;
-              }
-              // 如果上面不够放，则向下（优先）
-              if (top < marginSize) {
-                panelPlacement = 'bottom';
-                top = boundingTop + targetHeight;
-              }
-            }
-            // 如果溢出右边
-            if (left + panelWidth + marginSize > visibleWidth) {
-              left -= left + panelWidth + marginSize - visibleWidth;
-            }
-            // 如果溢出左边
-            if (left < marginSize) {
-              left = marginSize;
-            }
-            Object.assign(panelStyle, {
-              left: `${left}px`,
-              top: `${top}px`,
-              minWidth: `${targetWidth}px`
-            });
-          } else {
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              panelStyle.bottom = `${targetHeight}px`;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              panelStyle.top = `${targetHeight}px`;
-              if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                // 如果上面不够放，则向下（优先）
-                if (boundingTop - targetHeight - panelHeight > marginSize) {
-                  panelPlacement = 'top';
-                  panelStyle.top = '';
-                  panelStyle.bottom = `${targetHeight}px`;
-                }
-              }
-            }
-          }
-          reactData.panelStyle = panelStyle;
-          reactData.panelPlacement = panelPlacement;
-          return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-        }
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refInputTarget.value;
+      const panelElem = refInputPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     const showPanel = () => {
       const {
@@ -26444,83 +26315,28 @@ function getOptUniqueId() {
       }
     };
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex
-        } = reactData;
-        const el = refElem.value;
-        const panelElem = refOptionPanel.value;
-        const btnTransfer = computeBtnTransfer.value;
-        if (panelElem && el) {
-          const targetHeight = el.offsetHeight;
-          const targetWidth = el.offsetWidth;
-          const panelHeight = panelElem.offsetHeight;
-          const panelWidth = panelElem.offsetWidth;
-          const marginSize = 5;
-          const panelStyle = {
-            zIndex: panelIndex
-          };
-          const {
-            boundingTop,
-            boundingLeft,
-            visibleHeight,
-            visibleWidth
-          } = getAbsolutePos(el);
-          let panelPlacement = 'bottom';
-          if (btnTransfer) {
-            let left = boundingLeft;
-            let top = boundingTop + targetHeight;
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              top = boundingTop - panelHeight;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (top + panelHeight + marginSize > visibleHeight) {
-                panelPlacement = 'top';
-                top = boundingTop - panelHeight;
-              }
-              // 如果上面不够放，则向下（优先）
-              if (top < marginSize) {
-                panelPlacement = 'bottom';
-                top = boundingTop + targetHeight;
-              }
-            }
-            // 如果溢出右边
-            if (left + panelWidth + marginSize > visibleWidth) {
-              left -= left + panelWidth + marginSize - visibleWidth;
-            }
-            // 如果溢出左边
-            if (left < marginSize) {
-              left = marginSize;
-            }
-            Object.assign(panelStyle, {
-              left: `${left}px`,
-              top: `${top}px`,
-              minWidth: `${targetWidth}px`
-            });
-          } else {
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              panelStyle.bottom = `${targetHeight}px`;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                // 如果上面不够放，则向下（优先）
-                if (boundingTop - targetHeight - panelHeight > marginSize) {
-                  panelPlacement = 'top';
-                  panelStyle.bottom = `${targetHeight}px`;
-                }
-              }
-            }
-          }
-          reactData.panelStyle = panelStyle;
-          reactData.panelPlacement = panelPlacement;
-          return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-        }
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refElem.value;
+      const panelElem = refOptionPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     const showOptionPanel = () => {
       const {
@@ -35255,83 +35071,28 @@ function tree_select_getOptUniqueId() {
       }
     };
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex
-        } = reactData;
-        const el = refElem.value;
-        const panelElem = refOptionPanel.value;
-        const btnTransfer = computeBtnTransfer.value;
-        if (panelElem && el) {
-          const targetHeight = el.offsetHeight;
-          const targetWidth = el.offsetWidth;
-          const panelHeight = panelElem.offsetHeight;
-          const panelWidth = panelElem.offsetWidth;
-          const marginSize = 5;
-          const panelStyle = {
-            zIndex: panelIndex
-          };
-          const {
-            boundingTop,
-            boundingLeft,
-            visibleHeight,
-            visibleWidth
-          } = getAbsolutePos(el);
-          let panelPlacement = 'bottom';
-          if (btnTransfer) {
-            let left = boundingLeft;
-            let top = boundingTop + targetHeight;
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              top = boundingTop - panelHeight;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (top + panelHeight + marginSize > visibleHeight) {
-                panelPlacement = 'top';
-                top = boundingTop - panelHeight;
-              }
-              // 如果上面不够放，则向下（优先）
-              if (top < marginSize) {
-                panelPlacement = 'bottom';
-                top = boundingTop + targetHeight;
-              }
-            }
-            // 如果溢出右边
-            if (left + panelWidth + marginSize > visibleWidth) {
-              left -= left + panelWidth + marginSize - visibleWidth;
-            }
-            // 如果溢出左边
-            if (left < marginSize) {
-              left = marginSize;
-            }
-            Object.assign(panelStyle, {
-              left: `${left}px`,
-              top: `${top}px`,
-              minWidth: `${targetWidth}px`
-            });
-          } else {
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              panelStyle.bottom = `${targetHeight}px`;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                // 如果上面不够放，则向下（优先）
-                if (boundingTop - targetHeight - panelHeight > marginSize) {
-                  panelPlacement = 'top';
-                  panelStyle.bottom = `${targetHeight}px`;
-                }
-              }
-            }
-          }
-          reactData.panelStyle = panelStyle;
-          reactData.panelPlacement = panelPlacement;
-          return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-        }
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refElem.value;
+      const panelElem = refOptionPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     const showOptionPanel = () => {
       const {
@@ -46080,7 +45841,10 @@ const browseObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd
 // 打印
 let printFrame;
 // 默认导出或打印的 HTML 样式
-const defaultHtmlStyle = 'body{margin:0;padding:0;color:#000000;font-size:14px;font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu}body *{-webkit-box-sizing:border-box;box-sizing:border-box}.vxe-table{border-collapse:collapse;text-align:left;border-spacing:0}.vxe-table:not(.is--print){table-layout:fixed}.vxe-table,.vxe-table th,.vxe-table td,.vxe-table td{border-color:#D0D0D0;border-style:solid;border-width:0}.vxe-table.is--print{width:100%}.border--default,.border--full,.border--outer{border-top-width:1px}.border--default,.border--full,.border--outer{border-left-width:1px}.border--outer,.border--default th,.border--default td,.border--full th,.border--full td,.border--outer th,.border--inner th,.border--inner td{border-bottom-width:1px}.border--default,.border--outer,.border--full th,.border--full td{border-right-width:1px}.border--default th,.border--full th,.border--outer th{background-color:#f8f8f9}.vxe-table td>div,.vxe-table th>div{padding:.5em .4em}.col--center{text-align:center}.col--right{text-align:right}.vxe-table:not(.is--print) .col--ellipsis>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.vxe-table--tree-node{text-align:left}.vxe-table--tree-node-wrapper{position:relative}.vxe-table--tree-icon-wrapper{position:absolute;top:50%;width:1em;height:1em;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.vxe-table--tree-unfold-icon,.vxe-table--tree-fold-icon{position:absolute;width:0;height:0;border-style:solid;border-width:.5em;border-right-color:transparent;border-bottom-color:transparent}.vxe-table--tree-unfold-icon{left:.3em;top:0;border-left-color:#939599;border-top-color:transparent}.vxe-table--tree-fold-icon{left:0;top:.3em;border-left-color:transparent;border-top-color:#939599}.vxe-table--tree-cell{display:block;padding-left:1.5em}.vxe-table input[type="checkbox"]{margin:0}.vxe-table input[type="checkbox"],.vxe-table input[type="radio"],.vxe-table input[type="checkbox"]+span,.vxe-table input[type="radio"]+span{vertical-align:middle;padding-left:0.4em}';
+const defaultHtmlStyle = 'body{padding:0;font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu}body *{-webkit-box-sizing:border-box;box-sizing:border-box}.vxe-table{border-collapse:collapse;text-align:left;border-spacing:0}.vxe-table:not(.is--print){table-layout:fixed}.vxe-table,.vxe-table th,.vxe-table td,.vxe-table td{border-color:#D0D0D0;border-style:solid;border-width:0}.vxe-table.is--print{width:100%}.border--default,.border--full,.border--outer{border-top-width:1px}.border--default,.border--full,.border--outer{border-left-width:1px}.border--outer,.border--default th,.border--default td,.border--full th,.border--full td,.border--outer th,.border--inner th,.border--inner td{border-bottom-width:1px}.border--default,.border--outer,.border--full th,.border--full td{border-right-width:1px}.border--default th,.border--full th,.border--outer th{background-color:#f8f8f9}.vxe-table td>div,.vxe-table th>div{padding:.5em .4em}.col--center{text-align:center}.col--right{text-align:right}.vxe-table:not(.is--print) .col--ellipsis>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.vxe-table--tree-node{text-align:left}.vxe-table--tree-node-wrapper{position:relative}.vxe-table--tree-icon-wrapper{position:absolute;top:50%;width:1em;height:1em;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.vxe-table--tree-unfold-icon,.vxe-table--tree-fold-icon{position:absolute;width:0;height:0;border-style:solid;border-width:.5em;border-right-color:transparent;border-bottom-color:transparent}.vxe-table--tree-unfold-icon{left:.3em;top:0;border-left-color:#939599;border-top-color:transparent}.vxe-table--tree-fold-icon{left:0;top:.3em;border-left-color:transparent;border-top-color:#939599}.vxe-table--tree-cell{display:block;padding-left:1.5em}.vxe-table input[type="checkbox"]{margin:0}.vxe-table input[type="checkbox"],.vxe-table input[type="radio"],.vxe-table input[type="checkbox"]+span,.vxe-table input[type="radio"]+span{vertical-align:middle;padding-left:0.4em}';
+function trimHtml(html) {
+  return `${html}`.replace(/(<!---->)/, '');
+}
 function createPrintFrame() {
   const frame = document.createElement('iframe');
   frame.className = 'vxe-table--print-frame';
@@ -46111,44 +45875,51 @@ function getExportBlobByString(str, type) {
   });
 }
 const defaultPrintMargin = 50;
-function parseMargin(val) {
+const defaultFontColor = '#000000';
+function parsePageStyle(val) {
+  const styOpts = Object.assign({}, val);
+  const headStyOpts = Object.assign({}, styOpts.header);
+  const titStyOpts = Object.assign({}, styOpts.title);
+  const footStyOpts = Object.assign({}, styOpts.footer);
+  const pnStyOpts = Object.assign({}, styOpts.pageNumber);
   let mVal = defaultPrintMargin;
-  let top = mVal;
-  let bottom = mVal;
-  let left = mVal;
-  let right = mVal;
-  if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(val) || external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(val)) {
-    mVal = val;
-    top = mVal;
-    bottom = mVal;
-    left = mVal;
-    right = mVal;
-  } else if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isPlainObject(val)) {
-    if (val.margin) {
-      mVal = val.margin;
-      top = mVal;
-      bottom = mVal;
-      left = mVal;
-      right = mVal;
-    }
-    if (val.marginTop) {
-      top = val.marginTop;
-    }
-    if (val.marginBottom) {
-      bottom = val.marginBottom;
-    }
-    if (val.marginLeft) {
-      left = val.marginLeft;
-    }
-    if (val.marginRight) {
-      right = val.marginRight;
-    }
+  let marginTop = mVal;
+  let marginBottom = mVal;
+  let marginLeft = mVal;
+  let marginRight = mVal;
+  if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(styOpts.margin) || external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(styOpts.margin)) {
+    mVal = styOpts.margin;
+    marginTop = mVal;
+    marginBottom = mVal;
+    marginLeft = mVal;
+    marginRight = mVal;
   }
   return {
-    top: toCssUnit(top),
-    bottom: toCssUnit(bottom),
-    left: toCssUnit(left),
-    right: toCssUnit(right)
+    marginTop: toCssUnit(styOpts.marginTop || marginTop),
+    marginBottom: toCssUnit(styOpts.marginBottom || marginBottom),
+    marginLeft: toCssUnit(styOpts.marginLeft || marginLeft),
+    marginRight: toCssUnit(styOpts.marginRight || marginRight),
+    fontSize: toCssUnit(styOpts.fontSize),
+    color: styOpts.color,
+    textAlign: styOpts.textAlign,
+    header: {
+      height: toCssUnit(headStyOpts.height),
+      textAlign: headStyOpts.textAlign
+    },
+    title: {
+      color: titStyOpts.color,
+      fontSize: toCssUnit(titStyOpts.fontSize),
+      textAlign: titStyOpts.textAlign
+    },
+    footer: {
+      height: toCssUnit(footStyOpts.height),
+      textAlign: footStyOpts.textAlign
+    },
+    pageNumber: {
+      color: pnStyOpts.color,
+      fontSize: toCssUnit(pnStyOpts.fontSize),
+      textAlign: pnStyOpts.textAlign
+    }
   };
 }
 function createHtmlPage(opts, printHtml) {
@@ -46156,8 +45927,13 @@ function createHtmlPage(opts, printHtml) {
     pageStyle,
     customStyle
   } = opts;
-  const marginObj = parseMargin(pageStyle);
-  return ['<!DOCTYPE html><html>', '<head>', '<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">', `<title>${opts.title || ''}</title>`, opts._pageBreaks || opts.pageBreaks && opts.pageBreaks.length ? '<style media="print">@page {size: auto;margin: 0mm;}</style>' : '', `<style>.vxe-print-slots{display: none;}.vxe-print-page-break.align--center{text-align:center;}.vxe-print-page-break.align--left{text-align:left;}.vxe-print-page-break.align--right{text-align:right;}.vxe-print-page-break--header-title{font-size:1.8em;line-height:${marginObj.top || 'normal'};text-align:center;}.vxe-print-page-break{page-break-before:always;display:flex;flex-direction:column;height:100vh;overflow:hidden;}.vxe-print-page-break--body{display:flex;flex-direction:row;flex-grow:1;overflow: hidden;}.vxe-print-page-break--left,.vxe-print-page-break--right{flex-shrink:0;height:100%;}.vxe-print-page-break--left{width:${marginObj.left};}.vxe-print-page-break--right{width:${marginObj.right};}.vxe-print-page-break--header,.vxe-print-page-break--footer{flex-shrink:0;width:100%;}.vxe-print-page-break--header{height:${marginObj.top};}.vxe-print-page-break--footer{height:${marginObj.bottom};}.vxe-print-page-break--content{flex-grow: 1;overflow: hidden;}.vxe-print-page-break--footer-page-number{line-height:${marginObj.bottom || 'normal'};text-align:center;}</style>`, '<style>.vxe-table{white-space:pre;}</style>', `<style>${defaultHtmlStyle}</style>`, customStyle ? `<style>${customStyle}</style>` : '', '</head>', '<body>', `${printHtml}`, '</body>', '</html>'].join('');
+  const pageStyObj = parsePageStyle(pageStyle);
+  const headStyOpts = pageStyObj.header;
+  const titStyOpts = pageStyObj.title;
+  const footStyOpts = pageStyObj.header;
+  const pnStyOpts = pageStyObj.pageNumber;
+  const isPbMode = opts._pageBreaks || opts.pageBreaks && opts.pageBreaks.length;
+  return ['<!DOCTYPE html><html>', '<head>', '<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">', `<title>${opts.title || ''}</title>`, '<style media="print">@page{size:auto;margin: 0mm;}</style>', `<style>body{font-size:${pageStyObj.fontSize || '14px'};color:${pageStyObj.color || defaultFontColor};text-align:${pageStyObj.textAlign || 'left'};}</style>`, '<style>', '.vxe-print-slots{display:none;}', '.vxe-print-page-break.align--center{text-align:center;}', '.vxe-print-page-break.align--left{text-align:left;}', '.vxe-print-page-break.align--right{text-align:right;}', '.vxe-print-page-break{break-before:always;page-break-before:always;display:flex;flex-direction:column;height:100vh;overflow:hidden;}', '.vxe-print-page-break--body{display:flex;flex-direction:row;flex-grow:1;overflow:hidden;}', '.vxe-print-page-break--left,.vxe-print-page-break--right{flex-shrink:0;height:100%;}', `.vxe-print-page-break--left{width:${pageStyObj.marginLeft};}`, `.vxe-print-page-break--right{width:${pageStyObj.marginRight};}`, '.vxe-print-page-break--header,.vxe-print-page-break--footer{display:flex;justify-content:center;flex-direction:column;flex-shrink:0;width:100%;}', `.vxe-print-page-break--header{height:${headStyOpts.height || pageStyObj.marginTop};padding:0 ${pageStyObj.marginLeft} 0 ${pageStyObj.marginRight};text-align:${headStyOpts.textAlign || 'left'};}`, `.vxe-print-page-break--header-title{font-size:${titStyOpts.fontSize || '1.6em'};color:${titStyOpts.color || defaultFontColor};text-align:${opts.headerAlign || pnStyOpts.textAlign || 'center'};}`, `.vxe-print-page-break--footer{height:${footStyOpts.height || pageStyObj.marginBottom};padding:0 ${pageStyObj.marginLeft} 0 ${pageStyObj.marginRight};text-align:${footStyOpts.textAlign || 'left'};}`, '.vxe-print-page-break--content{flex-grow:1;overflow:hidden;}', `.vxe-print-page-break--footer-page-number{font-size:${pnStyOpts.fontSize || '1.2em'};color:${pnStyOpts.color || defaultFontColor};text-align:${opts.footerAlign || pnStyOpts.textAlign || 'center'};}`, '</style>', '<style>.vxe-table{white-space:pre;}</style>', `<style>${defaultHtmlStyle}</style>`, isPbMode ? '<style>body{margin:0;}</style>' : `<style>body{margin:${pageStyObj.marginTop} ${pageStyObj.marginRight} ${pageStyObj.marginBottom} ${pageStyObj.marginLeft};}</style>`, customStyle ? `<style>${customStyle}</style>` : '', '</head>', '<body>', `${printHtml}`, '</body>', '</html>'].join('');
 }
 function handlePrint(opts, printHtml = '') {
   const {
@@ -46431,7 +46207,7 @@ const PrintPageBreak = VxePrintPageBreak;
         const elem = refElem.value;
         return printHtml(Object.assign({}, props, {
           _pageBreaks: !!reactData.staticPageBreaks.length,
-          html: (elem ? elem.outerHTML : '') || props.html || props.content || ''
+          html: trimHtml(elem ? elem.outerHTML : '') || props.html || props.content || ''
         }));
       }
     };
@@ -46669,86 +46445,28 @@ const Print = VxePrint;
      * 手动更新位置
      */
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex,
-          visiblePanel
-        } = reactData;
-        const btnTransfer = computeBtnTransfer.value;
-        if (visiblePanel) {
-          const targetElem = refPulldownContent.value;
-          const panelElem = refPulldownPanel.value;
-          if (panelElem && targetElem) {
-            const targetHeight = targetElem.offsetHeight;
-            const targetWidth = targetElem.offsetWidth;
-            const panelHeight = panelElem.offsetHeight;
-            const panelWidth = panelElem.offsetWidth;
-            const marginSize = 5;
-            const panelStyle = {
-              zIndex: panelIndex
-            };
-            const {
-              boundingTop,
-              boundingLeft,
-              visibleHeight,
-              visibleWidth
-            } = getAbsolutePos(targetElem);
-            let panelPlacement = 'bottom';
-            if (btnTransfer) {
-              let left = boundingLeft;
-              let top = boundingTop + targetHeight;
-              if (placement === 'top') {
-                panelPlacement = 'top';
-                top = boundingTop - panelHeight;
-              } else if (!placement) {
-                // 如果下面不够放，则向上
-                if (top + panelHeight + marginSize > visibleHeight) {
-                  panelPlacement = 'top';
-                  top = boundingTop - panelHeight;
-                }
-                // 如果上面不够放，则向下（优先）
-                if (top < marginSize) {
-                  panelPlacement = 'bottom';
-                  top = boundingTop + targetHeight;
-                }
-              }
-              // 如果溢出右边
-              if (left + panelWidth + marginSize > visibleWidth) {
-                left -= left + panelWidth + marginSize - visibleWidth;
-              }
-              // 如果溢出左边
-              if (left < marginSize) {
-                left = marginSize;
-              }
-              Object.assign(panelStyle, {
-                left: `${left}px`,
-                top: `${top}px`,
-                minWidth: `${targetWidth}px`
-              });
-            } else {
-              if (placement === 'top') {
-                panelPlacement = 'top';
-                panelStyle.bottom = `${targetHeight}px`;
-              } else if (!placement) {
-                // 如果下面不够放，则向上
-                if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                  // 如果上面不够放，则向下（优先）
-                  if (boundingTop - targetHeight - panelHeight > marginSize) {
-                    panelPlacement = 'top';
-                    panelStyle.bottom = `${targetHeight}px`;
-                  }
-                }
-              }
-            }
-            reactData.panelStyle = panelStyle;
-            reactData.panelPlacement = panelPlacement;
-          }
-        }
-        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refPulldownContent.value;
+      const panelElem = refPulldownPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     /**
      * 显示下拉面板
@@ -48482,83 +48200,28 @@ function getRowUniqueId() {
       }
     };
     const updatePlacement = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          placement
-        } = props;
-        const {
-          panelIndex
-        } = reactData;
-        const el = refElem.value;
-        const panelElem = refOptionPanel.value;
-        const btnTransfer = computeBtnTransfer.value;
-        if (panelElem && el) {
-          const targetHeight = el.offsetHeight;
-          const targetWidth = el.offsetWidth;
-          const panelHeight = panelElem.offsetHeight;
-          const panelWidth = panelElem.offsetWidth;
-          const marginSize = 5;
-          const panelStyle = {
-            zIndex: panelIndex
-          };
-          const {
-            boundingTop,
-            boundingLeft,
-            visibleHeight,
-            visibleWidth
-          } = getAbsolutePos(el);
-          let panelPlacement = 'bottom';
-          if (btnTransfer) {
-            let left = boundingLeft;
-            let top = boundingTop + targetHeight;
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              top = boundingTop - panelHeight;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (top + panelHeight + marginSize > visibleHeight) {
-                panelPlacement = 'top';
-                top = boundingTop - panelHeight;
-              }
-              // 如果上面不够放，则向下（优先）
-              if (top < marginSize) {
-                panelPlacement = 'bottom';
-                top = boundingTop + targetHeight;
-              }
-            }
-            // 如果溢出右边
-            if (left + panelWidth + marginSize > visibleWidth) {
-              left -= left + panelWidth + marginSize - visibleWidth;
-            }
-            // 如果溢出左边
-            if (left < marginSize) {
-              left = marginSize;
-            }
-            Object.assign(panelStyle, {
-              left: `${left}px`,
-              top: `${top}px`,
-              minWidth: `${targetWidth}px`
-            });
-          } else {
-            if (placement === 'top') {
-              panelPlacement = 'top';
-              panelStyle.bottom = `${targetHeight}px`;
-            } else if (!placement) {
-              // 如果下面不够放，则向上
-              if (boundingTop + targetHeight + panelHeight > visibleHeight) {
-                // 如果上面不够放，则向下（优先）
-                if (boundingTop - targetHeight - panelHeight > marginSize) {
-                  panelPlacement = 'top';
-                  panelStyle.bottom = `${targetHeight}px`;
-                }
-              }
-            }
-          }
-          reactData.panelStyle = panelStyle;
-          reactData.panelPlacement = panelPlacement;
-          return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-        }
-      });
+      const {
+        placement
+      } = props;
+      const {
+        panelIndex
+      } = reactData;
+      const targetElem = refElem.value;
+      const panelElem = refOptionPanel.value;
+      const btnTransfer = computeBtnTransfer.value;
+      const handleStyle = () => {
+        const ppObj = updatePanelPlacement(targetElem, panelElem, {
+          placement,
+          teleportTo: btnTransfer
+        });
+        const panelStyle = Object.assign(ppObj.style, {
+          zIndex: panelIndex
+        });
+        reactData.panelStyle = panelStyle;
+        reactData.panelPlacement = ppObj.placement;
+      };
+      handleStyle();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
     const showOptionPanel = () => {
       const {