From a863f62383247ecedee850fc1a621725a7ff452e Mon Sep 17 00:00:00 2001
From: ShineKOT <1917095344@qq.com>
Date: Fri, 18 Oct 2024 15:08:50 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=8C=89=E9=92=AE=E7=BB=84?=
 =?UTF-8?q?=E5=92=8C=E5=85=B3=E7=B3=BB=E5=88=86=E9=A1=B5=E4=B8=8A=E6=96=B9?=
 =?UTF-8?q?=E4=B8=8B=E6=8B=89=E5=88=97=E8=A1=A8popover=E5=85=B3=E9=97=AD?=
 =?UTF-8?q?=E6=A8=A1=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                           |  4 ++++
 src/common/button-list/button-list.tsx |  8 ++++----
 src/control/drtab/drtab.scss           |  9 +++++----
 src/control/drtab/drtab.tsx            | 24 +++++++++++++++---------
 4 files changed, 28 insertions(+), 17 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3f26beeb6..0cb065f35 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@
 
 ## [Unreleased]
 
+### Change
+
+- 优化按钮组和关系分页上方下拉列表 popover 关闭模式
+
 ## [0.0.28] - 2024-10-18
 
 ### Added
diff --git a/src/common/button-list/button-list.tsx b/src/common/button-list/button-list.tsx
index 4df5b5751..3fcf224b5 100644
--- a/src/common/button-list/button-list.tsx
+++ b/src/common/button-list/button-list.tsx
@@ -69,12 +69,12 @@ export const IBizButtonList = defineComponent({
     };
 
     /**
-     * 打开 Popover
+     * 改变Popover显示
      * @param e
      */
-    const openPopover = (e: MouseEvent) => {
+    const onChangePopover = (e: MouseEvent) => {
       e.stopPropagation();
-      showPopover.value = true;
+      showPopover.value = !showPopover.value;
     };
 
     const details = computed(() => {
@@ -167,7 +167,7 @@ export const IBizButtonList = defineComponent({
             reference: (): VNode => {
               const { caption, sysImage, showCaption } = props.model;
               return (
-                <van-button onClick={openPopover}>
+                <van-button onClick={onChangePopover}>
                   {sysImage && (
                     <iBizIcon
                       class={ns.em('popover', 'icon')}
diff --git a/src/control/drtab/drtab.scss b/src/control/drtab/drtab.scss
index 141b4bd4b..817776317 100644
--- a/src/control/drtab/drtab.scss
+++ b/src/control/drtab/drtab.scss
@@ -1,5 +1,5 @@
 @include b(control-drtab) {
-  padding: 0 getCssVar(spacing, tight);
+  padding: getCssVar(spacing, tight);
   background-color: getCssVar(view, bg-color);
 
   .van-button {
@@ -45,10 +45,11 @@
 
       .caption {
         flex-grow: 1;
-        padding-right: getCssVar(spacing, base);
-
+        .text {
+          margin-right: rem(6px);
+        }
         .ibiz-badge {
-          margin-left: rem(6px);
+          margin-right: rem(6px);
         }
       }
 
diff --git a/src/control/drtab/drtab.tsx b/src/control/drtab/drtab.tsx
index eb61a66c3..89fee60a5 100644
--- a/src/control/drtab/drtab.tsx
+++ b/src/control/drtab/drtab.tsx
@@ -38,7 +38,7 @@ export const DRTabControl = defineComponent({
     const tabPosition =
       (c.view.model as IAppDETabExplorerView).tabLayout?.toLowerCase() || 'top';
 
-    const referenceTab = computed(() => {
+    const activeTab = computed(() => {
       return c.state.drTabPages.find(tab => tab.tag === c.state.activeName);
     });
 
@@ -63,12 +63,12 @@ export const DRTabControl = defineComponent({
     };
 
     /**
-     * 打开Popover
+     * 打开/关闭 Popover
      * @param e
      */
-    const openPopover = (e: MouseEvent) => {
+    const onChangePopover = (e: MouseEvent) => {
       e.stopPropagation();
-      showPopover.value = true;
+      showPopover.value = !showPopover.value;
     };
 
     onUnmounted(() => {
@@ -98,7 +98,7 @@ export const DRTabControl = defineComponent({
                         >
                           {tab.sysImage && <iBizIcon icon={tab.sysImage} />}
                           <div class={'caption'}>
-                            <span>{tab.caption}</span>
+                            <span class={'text'}>{tab.caption}</span>
                             {tab.counterId && (
                               <iBizBadge
                                 value={counterData[tab.counterId]}
@@ -119,15 +119,21 @@ export const DRTabControl = defineComponent({
             },
             reference: () => {
               return (
-                <van-button onClick={openPopover}>
-                  {referenceTab.value?.sysImage && (
+                <van-button onClick={onChangePopover}>
+                  {activeTab.value?.sysImage && (
                     <iBizIcon
                       class={ns.em('dropdown-list', 'icon')}
-                      icon={referenceTab.value.sysImage}
+                      icon={activeTab.value.sysImage}
                     />
                   )}
                   <span class={ns.em('dropdown-list', 'caption')}>
-                    {referenceTab.value?.caption}
+                    {activeTab.value?.caption}
+                    {activeTab.value?.counterId && (
+                      <iBizBadge
+                        value={counterData[activeTab.value.counterId]}
+                        counterMode={activeTab.value.counterMode}
+                      />
+                    )}
                   </span>
                   <ion-icon name='chevron-down-outline'></ion-icon>
                 </van-button>
-- 
Gitee