fix: BsUi-表格组件修改

src/components/BsUi/Table/Table.vue

@@ -1,5 +1,5 @@
 <template>
-  <vxe-grid class="wrapper" v-bind="gridOptions" ref="gridRef" v-fullscreen :style="{height: isFixed ? `calc(100vh - 101px)` : '100%'}">
+  <vxe-grid class="wrapper" v-bind="gridOptions" ref="gridRef" v-fullscreen :style="{ height: isFixed ? `calc(100vh - 101px)` : '100%' }">
     <template #form>
       <Search
         v-if="searchConfig && searchConfig.enable && searchConfig?.fields && searchConfig?.data"
@@ -20,9 +20,7 @@
       <div class="top-main">
         <div class="top-top" v-if="$slots.toolbarTop">
           <a-space v-if="toolbarTopConfig && toolbarTopConfig.enable" style="margin-right: 8px">
-            <a-button v-for="(btn, idx) in toolbarTopConfig.buttons" :key="btn.code" size="middle" v-bind="btn.props">{{
-              btn.title
-            }}</a-button>
+            <a-button v-for="(btn, idx) in toolbarTopConfig.buttons" :key="btn.code" size="middle" v-bind="btn.props">{{ btn.title }}</a-button>
           </a-space>
 
           <slot name="toolbarTop"></slot>
@@ -31,15 +29,16 @@
           <div class="top-left">
             <Toolbar :toolbarConfig="toolbarConfig">
               <a-space v-if="toolbarConfig.leftButtons" style="margin-right: 8px">
-                <a-button v-for="(btn, idx) in toolbarConfig.leftButtons" :key="btn.code" size="middle" v-bind="btn.props">{{
-                  btn.title
-                }}</a-button>
+                <a-button v-for="(btn, idx) in toolbarConfig.leftButtons" :key="btn.code" size="middle" v-bind="btn.props">{{ btn.title }}</a-button>
               </a-space>
               <slot name="toolbarLeft"></slot>
             </Toolbar>
           </div>
           <div class="top-right" v-if="toolbarConfig && toolbarConfig.enable">
-            <div class="top-right-left" v-if="!has(toolbarConfig, 'displayToolbar') || get(toolbarConfig, 'displayToolbar') === DISPLAY_STATE.VISIBLE">
+            <div
+              class="top-right-left"
+              v-if="!has(toolbarConfig, 'displayToolbar') || get(toolbarConfig, 'displayToolbar') === DISPLAY_STATE.VISIBLE"
+            >
               <a-tooltip placement="top">
                 <template #title>
                   <span>刷新</span>
@@ -78,10 +77,8 @@
             </div>
 
             <div class="top-right-right" v-if="toolbarConfig.rightButtons">
-              <a-space  style="margin-right: 8px">
-                <a-button v-for="(btn, idx) in toolbarConfig.rightButtons" :key="btn.code" size="middle" v-bind="btn.props">{{
-                    btn.title
-                  }}</a-button>
+              <a-space style="margin-right: 8px">
+                <a-button v-for="(btn, idx) in toolbarConfig.rightButtons" :key="btn.code" size="middle" v-bind="btn.props">{{ btn.title }}</a-button>
               </a-space>
             </div>
           </div>
@@ -90,7 +87,7 @@
     </template>
 
     <template #pager>
-      <div :class="`pager ${(!has(pagerConfig, 'isFixed') || pagerConfig.isFixed) ? 'page_fixed' : '' }`" v-if="pagerConfig && pagerConfig.enable">
+      <div :class="`pager ${!has(pagerConfig, 'isFixed') || pagerConfig.isFixed ? 'page_fixed' : ''}`" v-if="pagerConfig && pagerConfig.enable">
         <Pagination :pagerConfig="pagerConfig" />
       </div>
     </template>
@@ -113,16 +110,16 @@
 </template>
 
 <script setup>
-  import { nextTick, onMounted, ref, useSlots } from 'vue';
+  import { nextTick, onMounted, ref, useSlots, watch } from 'vue';
   import Search from './component/search/index.vue';
   import Pagination from './component/pagination/index.vue';
   import Toolbar from './component/toolbar/index.vue';
   import IndexData from './component/indexData/index.vue';
-  import { mapValues, has, isString, get } from 'lodash';
-  import {DISPLAY_STATE} from "/@/components/BsUi/constant.js";
-  const props = defineProps(['gridOptions', 'searchConfig', 'pagerConfig', 'toolbarConfig', 'getGridRef', 'mounted', 'toolbarTopConfig']);
+  import { mapValues, has, isString, get, isEmpty } from 'lodash';
+  import { DISPLAY_STATE } from '/@/components/BsUi/constant.js';
+  const props = defineProps(['gridOptions', 'searchConfig', 'pagerConfig', 'toolbarConfig', 'getGridRef', 'mounted', 'toolbarTopConfig', 'url']);
 
-  const isFixed = get(props.pagerConfig,'isFixed', true)
+  const isFixed = get(props.pagerConfig, 'isFixed', true);
 
   const $slots = useSlots();
 
@@ -160,8 +157,10 @@
   onMounted(() => {
     setSlotsCols();
     nextTick(() => {
-      props.getGridRef && props.getGridRef(gridRef.value);
-      props.mounted && props.mounted(gridRef.value);
+      if (!props.url) {
+        props.getGridRef && props.getGridRef(gridRef.value);
+        props.mounted && props.mounted(gridRef.value);
+      }
     });
   });
 
@@ -171,6 +170,16 @@
     });
   };
 
+  watch(
+    () => props.gridOptions.data,
+    (value) => {
+      if (props.url && !isEmpty(value)) {
+        props.getGridRef && props.getGridRef(gridRef.value);
+        props.mounted && props.mounted(gridRef.value);
+      }
+    }
+  );
+
   defineExpose({ gridRef });
 </script>