fix: BsUi-基础表格增加按钮区域

src/components/BsUi/Table/Table.vue

@@ -17,40 +17,45 @@
     </template>
 
     <template #top>
-      <div class="top">
-        <div class="top-left" v-if="props?.toolbarConfig && props?.toolbarConfig.enable">
-          <Toolbar :toolbarConfig="props.toolbarConfig">
-            <slot name="toolbarLeft"></slot>
-          </Toolbar>
-        </div>
-        <div class="top-right" v-if="props?.toolbarConfig && props?.toolbarConfig.enable">
-          <a-tooltip placement="top">
-            <template #title>
-              <span>刷新</span>
-            </template>
-            <a-button type="text" size="small" @click="handleRefresh">
-              <ReloadOutlined />
-            </a-button>
-          </a-tooltip>
-
-          <a-tooltip placement="top" v-if="isZoom">
-            <template #title>
-              <span>还原</span>
-            </template>
-            <a-button type="text" size="small" @click="toggleFullscreen">
-              <FullscreenExitOutlined />
-            </a-button>
-          </a-tooltip>
-
-          <a-tooltip placement="top" v-if="!isZoom">
-            <template #title>
-              <span>全屏</span>
-            </template>
-            <a-button type="text" size="small" @click="toggleFullscreen">
-              <FullscreenOutlined />
-            </a-button>
-          </a-tooltip>
-        </div>
+      <div class="top-main">
+       <div class="top-top" v-if="$slots.toolbarTop">
+         <slot name="toolbarTop"></slot>
+       </div>
+       <div class="top-bottom">
+         <div class="top-left" v-if="props?.toolbarConfig && props?.toolbarConfig.enable">
+           <Toolbar :toolbarConfig="props.toolbarConfig">
+             <slot name="toolbarLeft"></slot>
+           </Toolbar>
+         </div>
+         <div class="top-right" v-if="props?.toolbarConfig && props?.toolbarConfig.enable">
+           <a-tooltip placement="top">
+             <template #title>
+               <span>刷新</span>
+             </template>
+             <a-button type="text" size="small" @click="handleRefresh">
+               <ReloadOutlined />
+             </a-button>
+           </a-tooltip>
+
+           <a-tooltip placement="top" v-if="isZoom">
+             <template #title>
+               <span>还原</span>
+             </template>
+             <a-button type="text" size="small" @click="toggleFullscreen">
+               <FullscreenExitOutlined />
+             </a-button>
+           </a-tooltip>
+
+           <a-tooltip placement="top" v-if="!isZoom">
+             <template #title>
+               <span>全屏</span>
+             </template>
+             <a-button type="text" size="small" @click="toggleFullscreen">
+               <FullscreenOutlined />
+             </a-button>
+           </a-tooltip>
+         </div>
+       </div>
       </div>
     </template>
 
@@ -86,6 +91,8 @@
   import { mapValues, has, isString } from 'lodash';
   const props = defineProps(['gridOptions', 'searchConfig', 'pagerConfig', 'toolbarConfig', 'getGridRef', 'mounted']);
 
+  const $slots = useSlots();
+
   const gridRef = ref(null);
 
   const isZoom = ref(false);
@@ -135,20 +142,27 @@
   .wrapper {
     width: 100%;
     height: 100%;
-    .top {
-      border-radius: 10px 10px 0 0;
-      padding: 10px 20px;
-      background: white;
-      display: flex;
-      align-items: center;
-
-      .top-left {
-        flex: 1;
+    .top-main {
+      width: 100%;
+      background: #fff;
+      .top-top {
+        padding: 10px 20px;
       }
-      .top-right {
+      .top-bottom {
+        border-radius: 10px 10px 0 0;
+        padding: 10px 20px;
+        background: white;
         display: flex;
-        justify-content: flex-end;
         align-items: center;
+
+        .top-left {
+          flex: 1;
+        }
+        .top-right {
+          display: flex;
+          justify-content: flex-end;
+          align-items: center;
+        }
       }
     }
     .pager {