@fe-free/core 6.0.4 → 6.0.5

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @fe-free/core
 
+## 6.0.5
+
+### Patch Changes
+
+- feat: crud ui
+  - @fe-free/icons@6.0.5
+  - @fe-free/tool@6.0.5
+
 ## 6.0.4
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/core",
-  "version": "6.0.4",
+  "version": "6.0.5",
   "description": "",
   "main": "./src/index.ts",
   "author": "",
@@ -52,8 +52,8 @@
     "i18next-icu": "^2.4.1",
     "react": "^19.2.0",
     "react-i18next": "^16.4.0",
-    "@fe-free/tool": "6.0.4",
-    "@fe-free/icons": "6.0.4"
+    "@fe-free/tool": "6.0.5",
+    "@fe-free/icons": "6.0.5"
   },
   "scripts": {
     "i18n-extract": "rm -rf ./src/locales/zh-CN && npx i18next-cli extract"

package/src/crud_of_pure/crud_of_pure.stories.tsx

@@ -262,6 +262,61 @@ export const SpecialToolbar: Story = {
   },
 };
 
+export const SpecialToolbarEmpty: Story = {
+  render: () => {
+    const columns = [
+      {
+        title: 'id',
+        dataIndex: 'id',
+        search: true,
+      },
+      {
+        title: '名字(省略)',
+        dataIndex: 'name',
+        search: true,
+        ellipsis: true,
+      },
+      {
+        title: 'city',
+        dataIndex: 'city',
+      },
+      {
+        title: 'area',
+        dataIndex: 'area',
+      },
+    ];
+
+    return (
+      <CRUDOfPure
+        specialToolbar="empty"
+        actions={['delete']}
+        tableProps={{
+          rowKey: 'id',
+          columns,
+          request: fakeRequest,
+          pagination: false,
+        }}
+        requestDeleteByRecord={fakeDeleteByRecord}
+        deleteProps={{
+          nameIndex: 'id',
+        }}
+        detailForm={() => (
+          <>
+            <ProFormText
+              name="name"
+              label="名字"
+              required
+              rules={[{ required: true }]}
+              extra="extra extra extra extra"
+            />
+          </>
+        )}
+        requestCreateByValues={fakeCreate}
+      />
+    );
+  },
+};
+
 export const SpecialToolbarWithToolBarRender: Story = {
   render: () => {
     const columns = [

package/src/crud_of_pure/index.tsx

@@ -10,11 +10,20 @@ interface CRUDOfPureProps<
   DataSource extends Record<string, any> = any,
   Key extends string | number = string,
 > extends CRUDProps<DataSource, Key> {
-  /** 特殊位置的 toolbar，向上 margin，是的 search 和 toolbar 一起。仅适用于 search 很少的情况。 */
-  specialToolbar?: boolean;
+  /**
+   * 特殊位置的 toolbar，margin 为 -48px，使得 search 和 toolbar 一起。
+   * empty 表示toolbar 为空的情况，margin 为 -16px。
+   * */
+  specialToolbar?: boolean | 'empty';
 }
 
-function useSpecialToolbar({ specialToolbar, id }: { specialToolbar?: boolean; id: string }) {
+function useSpecialToolbar({
+  specialToolbar,
+  id,
+}: {
+  specialToolbar?: boolean | 'empty';
+  id: string;
+}) {
   useEffect(() => {
     if (!specialToolbar) return;
 
@@ -107,6 +116,7 @@ function CRUDOfPure<
         {
           'fec-crud-of-pure-no-search': noSearch,
           'fec-crud-of-pure-special-toolbar': props.specialToolbar,
+          'fec-crud-of-pure-special-toolbar-empty': props.specialToolbar === 'empty',
         },
         props.className,
       )}

package/src/crud_of_pure/style.scss

@@ -77,5 +77,11 @@
         pointer-events: auto;
       }
     }
+
+    &.fec-crud-of-pure-special-toolbar-empty {
+      .ant-pro-card:not(.ant-pro-table-search) {
+        margin-top: -16px;
+      }
+    }
   }
 }