fix: BsUi-修改基础表格

src/components/BsUi/Render/cell.jsx

@@ -1,7 +1,10 @@
 import { VxeUI } from 'vxe-pc-ui';
 import dayjs from 'dayjs';
-import { get, isEmpty } from 'lodash';
+import { get, has, isEmpty, isFunction } from 'lodash';
 import { formatMoney, formatPercentage } from '/@/components/BsUi/uitl.js';
+import { DISPLAY_STATE } from '/@/components/BsUi/constant.js';
+import { DeleteOutlined, EditOutlined, EyeOutlined, PlusOutlined } from '@ant-design/icons-vue';
+import { h } from 'vue';
 
 const getValue = (params) => {
   const { column, row } = params;
@@ -29,7 +32,7 @@ VxeUI.renderer.add('CellDate', {
   // 默认显示模板
   renderTableDefault(renderOpts, params) {
     if (isEmpty(getValue(params))) return <></>;
-    return <>{ dayjs(getValue(params)).format('YYYY-MM-DD') }</>
+    return <>{dayjs(getValue(params)).format('YYYY-MM-DD')}</>;
   },
 });
 
@@ -37,17 +40,61 @@ VxeUI.renderer.add('CellDate', {
 VxeUI.renderer.add('CellDateTime', {
   // 默认显示模板
   renderTableDefault(renderOpts, params) {
-      if (isEmpty(getValue(params))) return <></>;
-      return <>{ dayjs(getValue(params)).format('YYYY-MM-DD HH:mm:ss') }</>
+    if (isEmpty(getValue(params))) return <></>;
+    return <>{dayjs(getValue(params)).format('YYYY-MM-DD HH:mm:ss')}</>;
   },
 });
 
-
 // 字典渲染
 VxeUI.renderer.add('CellDict', {
   // 默认显示模板
   renderTableDefault(renderOpts, params) {
     if (isEmpty(getValue(params))) return <></>;
-    return <>{ getValue(params)[0].valueName || '' }</>
+    return <>{getValue(params)[0].valueName || ''}</>;
+  },
+});
+
+// 字典渲染
+VxeUI.renderer.add('CellOption', {
+  // 默认显示模板
+  renderTableDefault(renderOpts, params) {
+    const { extraProps } = renderOpts;
+    const { row, column } = params;
+
+    const { buttons } = extraProps;
+    const visibleBtn = buttons.filter(
+      (v) => !has(v, 'display') || (isFunction(v.display) && v.display(params) === DISPLAY_STATE.VISIBLE) || v.display === DISPLAY_STATE.VISIBLE
+    );
+    column.title = '操作';
+    column.width = 'auto';
+
+    const iconMap = {
+      add: h(PlusOutlined),
+      edit: h(EditOutlined),
+      delete: h(DeleteOutlined),
+      view: h(EyeOutlined),
+    };
+
+    return (
+      <a-space>
+        {visibleBtn.map((v) => {
+          const disabled = has(v, 'disabled') && isFunction(v.disabled) ? v.disabled(params) : v.props?.disabled;
+          return (
+            <a-button
+              style={{ padding: '0' }}
+              type='link'
+              onClick={() => {
+                v?.onClick(params);
+              }}
+              disabled={disabled}
+              icon={iconMap[v?.code]}
+              {...v.extraProps}
+            >
+              {v.title}
+            </a-button>
+          );
+        })}
+      </a-space>
+    );
   },
 });

src/components/BsUi/Table/Table.vue

@@ -19,9 +19,10 @@
     <template #top>
       <div class="top-main">
         <div class="top-top" v-if="$slots.toolbarTop">
-
           <a-space v-if="props?.toolbarTopConfig && props?.toolbarTopConfig.enable" style="margin-right: 8px">
-            <a-button v-for="(btn, idx) in props?.toolbarTopConfig.buttons" :key="btn.code" size="middle" v-bind="btn.props">{{ btn.title }}</a-button>
+            <a-button v-for="(btn, idx) in props?.toolbarTopConfig.buttons" :key="btn.code" size="middle" v-bind="btn.props">{{
+              btn.title
+            }}</a-button>
           </a-space>
 
           <slot name="toolbarTop"></slot>
@@ -59,6 +60,15 @@
                 <FullscreenOutlined />
               </a-button>
             </a-tooltip>
+
+            <a-tooltip placement="top">
+              <template #title>
+                <span>列设置</span>
+              </template>
+              <a-button type="text" size="small" @click="handleSetting">
+                <SettingOutlined />
+              </a-button>
+            </a-tooltip>
           </div>
         </div>
       </div>
@@ -104,6 +114,12 @@
 
   const slotCols = ref([]);
 
+
+  const handleSetting = () => {
+    gridRef.value.openCustom();
+  }
+
+
   const setSlotsCols = () => {
     slotCols.value = [];
     props.gridOptions.columns.forEach((v) => {

src/components/BsUi/Table/component/pagination/index.vue

@@ -1,13 +1,19 @@
 <template>
   <a-pagination
+    showSizeChanger
+    showQuickJumper
+    show-less-items
+    :pageSizeOptions="props.pagerConfig.pageSizeOptions"
+    :defaultPageSize="props.pagerConfig.pageSize"
     v-model:current="props.pagerConfig.pageNum"
-    show-quick-jumper
+    v-model:pageSize="props.pagerConfig.pageSize"
     v-model:total="props.pagerConfig.total"
-    v-model:page-size="props.pagerConfig.pageSize"
     v-bind="props.pagerConfig"
-    size="small"
+    :show-total="(total) => `共${total}条`"
   />
 </template>
 <script setup>
+  import { PAGE_SIZE_OPTIONS } from '/@/constants/common-const.js';
+
   const props = defineProps(['pagerConfig']);
 </script>

src/components/BsUi/Table/component/search/index.vue

@@ -17,8 +17,20 @@
           <a-col :span="btnSpan">
             <div class="search-btn">
               <a-space>
-                <a-button type="primary" :icon="h(SearchOutlined)" @click="searchHandler" size="middle">查询</a-button>
-                <a-button :icon="h(ClearOutlined)" @click="resetHandler" size="middle">重置</a-button>
+                <a-button-group>
+                  <a-button type="primary" @click="searchHandler">
+                    <template #icon>
+                      <ReloadOutlined />
+                    </template>
+                    查询
+                  </a-button>
+                  <a-button @click="resetHandler">
+                    <template #icon>
+                      <SearchOutlined />
+                    </template>
+                    重置
+                  </a-button>
+                </a-button-group>
                 <a-space v-if="props.fields.length > 1">
                   <a-button type="dashed" :icon="h(UpOutlined)" @click="toggleHandler" v-if="isZheDie" size="middle">收起</a-button>
                   <a-button type="dashed" :icon="h(DownOutlined)" @click="toggleHandler" v-if="!isZheDie" size="middle">展开</a-button>

src/components/BsUi/Table/index.js

@@ -9,10 +9,18 @@ export const useBsTable = (options, tableRef) => {
   let gridRef = null;
 
   const initGridOptions = () => {
-    const seqCol = tableOptions?.gridOptions.columns.find(v => v.type === 'seq');
+    const seqCol = tableOptions?.gridOptions.columns.find(v => ['seq', 'check', 'radio'].includes(v.type));
+    const optCol =  tableOptions?.gridOptions.columns.find(v => v?.cellRender && v.cellRender.name === 'CellOption');
+    // 操作初始化
+    if(!isEmpty(optCol)) {
+      optCol.fixed = 'right';
+    }
+    // 序号初始化
     if(!isEmpty(seqCol)) {
       seqCol.align = 'center';
       seqCol.headerAlign = "center";
+      seqCol.width = "60px";
+      seqCol.fixed = 'left'
     }
 
     set(tableOptions, 'gridOptions', {
@@ -25,6 +33,14 @@ export const useBsTable = (options, tableRef) => {
         height: '40px',
         ...tableOptions.gridOptions?.cellConfig
       },
+      customConfig: {
+        mode: 'drawer',
+        ...tableOptions.gridOptions?.customConfig
+      },
+      headerCellConfig: {
+        height: '40px',
+        ...tableOptions.gridOptions?.headerCellConfig
+      },
       ...tableOptions?.gridOptions,
     });
 
@@ -134,13 +150,14 @@ export const useBsTable = (options, tableRef) => {
         setPagerVisible(false);
         resolve(tableOptions.gridOptions.data);
       } else {
-        console.log('入参为 =====>', { pageNum, pageSize, ...newSearchParams });
+
         const resData = await getTableDataApi(tableOptions?.url, { pageNum, pageSize, ...newSearchParams });
         const { data } = resData;
         setLoading(false);
         setTableData(data.list);
         setPageTotal(data.total);
         resolve(data);
+        // console.log('入参为 =====>', { pageNum, pageSize, ...newSearchParams });
         // setTimeout(() => {
         //   const resData = {
         //     data:  {