fix(table): fix dataPicker show in fullscreen mode

修复basicTable编辑组件的校验提示以及日期选择框的弹出层在全屏模式下的显示问题
vbenjs · Jul 24, 2021 · a5a9b3f · a5a9b3f
1 parent a07ab6d
commit a5a9b3f
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/src/components/Table/src/components/editable/CellComponent.ts b/src/components/Table/src/components/editable/CellComponent.ts
@@ -10,10 +10,17 @@ export interface ComponentProps {
   rule: boolean;
   popoverVisible: boolean;
   ruleMessage: string;
+  getPopupContainer?: Fn;
 }
 
 export const CellComponent: FunctionalComponent = (
-  { component = 'Input', rule = true, ruleMessage, popoverVisible }: ComponentProps,
+  {
+    component = 'Input',
+    rule = true,
+    ruleMessage,
+    popoverVisible,
+    getPopupContainer,
+  }: ComponentProps,
   { attrs }
 ) => {
   const Comp = componentMap.get(component) as typeof defineComponent;
@@ -24,7 +31,11 @@ export const CellComponent: FunctionalComponent = (
   }
   return h(
     Popover,
-    { overlayClassName: 'edit-cell-rule-popover', visible: !!popoverVisible },
+    {
+      overlayClassName: 'edit-cell-rule-popover',
+      visible: !!popoverVisible,
+      ...(getPopupContainer ? { getPopupContainer } : {}),
+    },
     {
       default: () => DefaultComp,
       content: () => ruleMessage,

diff --git a/src/components/Table/src/components/editable/EditableCell.vue b/src/components/Table/src/components/editable/EditableCell.vue
@@ -114,6 +114,7 @@
 
         return {
           getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body,
+          getCalendarContainer: () => unref(table?.wrapRef.value) ?? document.body,
           placeholder: createPlaceholderMessage(unref(getComponent)),
           ...apiSelectProps,
           ...omit(compProps, 'onChange'),