From c066889c377904b52cd707bd96e163f24d926900 Mon Sep 17 00:00:00 2001
From: layhuts <45724118+LayHuts@users.noreply.github.com>
Date: Fri, 22 May 2026 11:56:09 +0800
Subject: [PATCH] =?UTF-8?q?Fix:=20=E5=9C=A8isMobile=3Dtrue=E6=97=B6?=
 =?UTF-8?q?=E6=97=A0=E6=B3=95=E8=87=AA=E5=AE=9A=E4=B9=89Drawer=E7=9A=84cla?=
 =?UTF-8?q?ss=E9=97=AE=E9=A2=98=20(#7941)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: 在isMobile=true时无法自定义Drawer的class问题

* fix: 在ResizableHandle两边增加边距
---
 .../ui-kit/popup-ui/src/drawer/drawer.vue     | 16 +++++++++-----
 .../src/components/col-page/col-page.vue      | 22 +++++++++++--------
 2 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue b/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
index 9385f56c1..b0f454405 100644
--- a/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
@@ -54,7 +54,6 @@ const components = globalShareState.getComponents();
 const id = useId();
 provide('DISMISSABLE_DRAWER_ID', id);
 
-// @ts-expect-error unused
 const wrapperRef = ref<HTMLElement>();
 const { $t } = useSimpleLocale();
 const { isMobile } = useIsMobile();
@@ -185,11 +184,16 @@ const getForceMount = computed(() => {
     <SheetContent
       :append-to="getAppendTo"
       :class="
-        cn('flex w-130 flex-col', drawerClass, {
-          'w-full!': isMobile || placement === 'bottom' || placement === 'top',
-          'max-h-screen': placement === 'bottom' || placement === 'top',
-          hidden: isClosed,
-        })
+        cn(
+          'flex w-130 flex-col',
+          {
+            'w-full!':
+              isMobile || placement === 'bottom' || placement === 'top',
+            'max-h-screen': placement === 'bottom' || placement === 'top',
+            hidden: isClosed,
+          },
+          drawerClass,
+        )
       "
       :modal="modal"
       :open="state?.isOpen"
diff --git a/packages/effects/common-ui/src/components/col-page/col-page.vue b/packages/effects/common-ui/src/components/col-page/col-page.vue
index c3f9d686d..73a38ca57 100644
--- a/packages/effects/common-ui/src/components/col-page/col-page.vue
+++ b/packages/effects/common-ui/src/components/col-page/col-page.vue
@@ -76,14 +76,16 @@ defineExpose({
         :min-size="leftMinWidth"
       >
         <template #default="slotProps">
-          <slot
-            name="left"
-            v-bind="{
-              ...slotProps,
-              expand: expandLeft,
-              collapse: collapseLeft,
-            }"
-          ></slot>
+          <div class="h-full pr-2">
+            <slot
+              name="left"
+              v-bind="{
+                ...slotProps,
+                expand: expandLeft,
+                collapse: collapseLeft,
+              }"
+            ></slot>
+          </div>
         </template>
       </ResizablePanel>
       <ResizableHandle
@@ -99,7 +101,9 @@ defineExpose({
         :min-size="rightMinWidth"
       >
         <template #default>
-          <slot></slot>
+          <div class="h-full pl-2">
+            <slot></slot>
+          </div>
         </template>
       </ResizablePanel>
     </ResizablePanelGroup>