@fe-free/core 3.0.33 → 3.0.35

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @fe-free/core
 
+## 3.0.35
+
+### Patch Changes
+
+- feat: crud
+  - @fe-free/icons@3.0.35
+  - @fe-free/tool@3.0.35
+
+## 3.0.34
+
+### Patch Changes
+
+- feat: crud
+  - @fe-free/icons@3.0.34
+  - @fe-free/tool@3.0.34
+
 ## 3.0.33
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/core",
-  "version": "3.0.33",
+  "version": "3.0.35",
   "description": "",
   "main": "./src/index.ts",
   "author": "",
@@ -46,8 +46,8 @@
     "antd": "^5.27.1",
     "dayjs": "~1.11.10",
     "react": "^19.2.0",
-    "@fe-free/icons": "3.0.33",
-    "@fe-free/tool": "3.0.33"
+    "@fe-free/icons": "3.0.35",
+    "@fe-free/tool": "3.0.35"
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

package/src/core_app/index.tsx

@@ -2,6 +2,7 @@ import { ProConfigProvider } from '@ant-design/pro-components';
 import { useTitle } from 'ahooks';
 import { App, ConfigProvider } from 'antd';
 import zhCN from 'antd/locale/zh_CN';
+import classNames from 'classnames';
 import { merge } from 'lodash-es';
 import { useEffect, useMemo } from 'react';
 import { BrowserRouter as Router, useNavigate } from 'react-router-dom';
@@ -103,6 +104,9 @@ function CoreApp(props: {
   appProps?: Omit<React.ComponentProps<typeof App>, 'children'>;
   routerProps?: Omit<Partial<React.ComponentProps<typeof Router>>, 'children'>;
   children: React.ReactNode;
+  customConfig?: {
+    hiddenFormItemLabelColon?: boolean;
+  };
 }) {
   const {
     basename,
@@ -113,6 +117,7 @@ function CoreApp(props: {
     configProviderProps,
     appProps,
     routerProps,
+    customConfig,
   } = props;
 
   useTitle(name || '');
@@ -140,7 +145,12 @@ function CoreApp(props: {
         locale={configProviderProps?.locale || zhCN}
         theme={theme}
       >
-        <App {...appProps}>
+        <App
+          {...appProps}
+          className={classNames('fec-app', appProps?.className, {
+            'fec-app-hidden-form-item-label-colon': customConfig?.hiddenFormItemLabelColon,
+          })}
+        >
           <Router {...routerProps} basename={basename}>
             <SetRouteTool basename={basename} />
             {enableCheckUpdate && <CheckUpdate basename={basename} />}

package/src/crud/crud.stories.tsx

@@ -1,7 +1,7 @@
 import type { ProColumns } from '@ant-design/pro-components';
 import { ProForm, ProFormSwitch, ProFormText } from '@ant-design/pro-components';
-import type { CRUDRef } from '@fe-free/core';
-import { CRUD, proFormSelectSearchProps } from '@fe-free/core';
+import type { CRUDProps, CRUDRef } from '@fe-free/core';
+import { CRUD, CustomValueTypeEnum, proFormSelectSearchProps } from '@fe-free/core';
 
 import type { Meta, StoryObj } from '@storybook/react-vite';
 import { Button } from 'antd';
@@ -31,6 +31,10 @@ type Story = StoryObj<typeof CRUD>;
 export const Normal: Story = {
   render: () => {
     const columns = [
+      {
+        title: '序号',
+        valueType: CustomValueTypeEnum.CustomSerialNumber,
+      },
       {
         title: 'id',
         dataIndex: 'id',
@@ -50,7 +54,7 @@ export const Normal: Story = {
         title: 'area',
         dataIndex: 'area',
       },
-    ];
+    ] as CRUDProps['tableProps']['columns'];
 
     return (
       <CRUD
@@ -76,7 +80,6 @@ export const Normal: Story = {
         )}
         requestGetByRecord={fakeGetByRecord}
         requestCreateByValues={fakeCreate}
-        requestUpdateById={fakeUpdateById}
       />
     );
   },
@@ -171,6 +174,16 @@ export const MoreCustom: Story = {
           toolBarRender: () => {
             return [<div key="custom1">自定义1</div>, <div key="custom2">自定义2</div>];
           },
+          search: {
+            optionRender: (_, __, dom) => {
+              return [
+                ...dom,
+                <Button key="1" type="primary" className="ml-2">
+                  额外的按钮
+                </Button>,
+              ];
+            },
+          },
         }}
         operateColumnProps={{
           // 自定义宽度
@@ -216,7 +229,6 @@ export const MoreCustom: Story = {
         )}
         requestGetByRecord={fakeGetByRecord}
         requestCreateByValues={fakeCreate}
-        requestUpdateById={fakeUpdateById}
         updateProps={{
           operateIsDisabled: (record) => {
             if (record.id % 3) {
@@ -567,7 +579,6 @@ export const ExpandedRowRender: Story = {
         )}
         requestGetByRecord={fakeGetByRecord}
         requestCreateByValues={fakeCreate}
-        requestUpdateById={fakeUpdateById}
       />
     );
   },
@@ -623,7 +634,6 @@ export const FullPage: Story = {
           )}
           requestGetByRecord={fakeGetByRecord}
           requestCreateByValues={fakeCreate}
-          requestUpdateById={fakeUpdateById}
         />
       </div>
     );

package/src/crud/crud.tsx

@@ -31,7 +31,6 @@ function CRUD<DataSource extends Record<string, any> = any, Key extends string |
     createProps,
     requestCreateByValues,
     updateProps,
-    requestUpdateById,
     requestUpdateByValues,
     detailFormInstance,
     requestDeleteByRecords,
@@ -56,7 +55,6 @@ function CRUD<DataSource extends Record<string, any> = any, Key extends string |
       detailForm,
       requestGetByRecord,
       requestCreateByValues,
-      requestUpdateById,
       requestUpdateByValues,
       detailFormInstance,
       createProps,
@@ -67,7 +65,6 @@ function CRUD<DataSource extends Record<string, any> = any, Key extends string |
       detailForm,
       requestGetByRecord,
       requestCreateByValues,
-      requestUpdateById,
       requestUpdateByValues,
       detailFormInstance,
       createProps,

package/src/crud/crud_detail.tsx

@@ -23,7 +23,6 @@ interface CRUDDetailProps
     | 'readProps'
     | 'requestCreateByValues'
     | 'updateProps'
-    | 'requestUpdateById'
     | 'requestUpdateByValues'
     | 'detailForm'
     | 'detailFormInstance'
@@ -49,7 +48,6 @@ function CRUDDetail(props: CRUDDetailProps) {
     readProps,
     requestCreateByValues,
     updateProps,
-    requestUpdateById,
     requestUpdateByValues,
     detailFormInstance,
   } = props;
@@ -76,15 +74,8 @@ function CRUDDetail(props: CRUDDetailProps) {
             content,
           });
         }
-        if (action === 'update' && (requestUpdateById || requestUpdateByValues)) {
-          if (requestUpdateByValues) {
-            result = await requestUpdateByValues(values);
-          } else if (requestUpdateById) {
-            result = await requestUpdateById({
-              ...values,
-              id,
-            });
-          }
+        if (action === 'update' && requestUpdateByValues) {
+          result = await requestUpdateByValues(values);
 
           let content = '更新成功';
           if (updateProps?.successText) {
@@ -114,16 +105,7 @@ function CRUDDetail(props: CRUDDetailProps) {
         }, 10);
       }
     },
-    [
-      action,
-      requestCreateByValues,
-      requestUpdateById,
-      requestUpdateByValues,
-      onSuccess,
-      createProps,
-      id,
-      updateProps,
-    ],
+    [action, requestCreateByValues, requestUpdateByValues, onSuccess, createProps, updateProps],
   );
 
   const handleOpenChange = useCallback(
@@ -164,7 +146,7 @@ function CRUDDetail(props: CRUDDetailProps) {
 
     if (loading) {
       return (
-        <div className="pt-[100px] flex justify-center">
+        <div className="flex justify-center pt-[100px]">
           <Spin />
         </div>
       );

package/src/crud/table/style.scss

@@ -29,8 +29,11 @@
       margin-right: 8px;
     }
 
-    .ant-pagination-item-link {
-      border: 1px solid #e2e7f0;
+    .ant-pagination-prev,
+    .ant-pagination-next {
+      .ant-pagination-item-link {
+        border: 1px solid #e2e7f0;
+      }
     }
 
     .ant-pagination-item {

package/src/crud/types.tsx

@@ -84,8 +84,6 @@ interface CRUDProps<DataSource = any, Key = string> {
 
   /** 更新接口，返回 false 则不关闭弹窗 */
   requestUpdateByValues?: (values: Partial<DataSource>) => Promise<false | void>;
-  /** @deprecated 请使用 requestUpdateByValues 替代 */
-  requestUpdateById?: (values: Partial<DataSource>) => Promise<false | void>;
   updateProps?: {
     /** 文本“编辑” */
     operateText?: string;

package/src/crud_of_pure/index.tsx

@@ -13,7 +13,10 @@ interface CRUDOfPureProps<
   specialToolbar?: boolean;
 }
 
-function CRUDOfPure(props: CRUDOfPureProps) {
+function CRUDOfPure<
+  DataSource extends Record<string, any> = any,
+  Key extends string | number = string,
+>(props: CRUDOfPureProps<DataSource, Key>) {
   const newColumns = props.tableProps.columns?.map((column) => {
     if (column.search) {
       return {
@@ -26,7 +29,9 @@ function CRUDOfPure(props: CRUDOfPureProps) {
         // 设置 placeholder
         fieldProps: {
           placeholder:
-            column.valueType === 'select' ? `请选择${column.title}` : `请输入${column.title}`,
+            column.valueType === 'select' || column.valueEnum
+              ? `请选择${column.title}`
+              : `请输入${column.title}`,
           ...column.fieldProps,
         },
       };

package/src/style.scss

@@ -14,9 +14,11 @@
 /* stylelint-disable-next-line at-rule-no-unknown */
 @tailwind utilities;
 
-// 隐藏 label 的冒号
-.ant-form-item .ant-form-item-label > label::after {
-  visibility: hidden;
+.fec-app-hidden-form-item-label-colon {
+  // 隐藏 label 的冒号
+  .ant-form-item .ant-form-item-label > label::after {
+    visibility: hidden;
+  }
 }
 
 .ant-modal-footer {

package/src/value_type_map/index.tsx

@@ -16,6 +16,8 @@ enum CustomValueTypeEnum {
   /** 渲染开关 */
   CustomSwitchNumber = 'CustomSwitchNumber',
   CustomSwitchOptions = 'CustomSwitchOptions',
+  /** CRUD 用，显示序号 */
+  CustomSerialNumber = 'CustomSerialNumber',
 }
 
 const customValueTypeMap: Record<string, ProRenderFieldPropsType> = {
@@ -43,6 +45,10 @@ const customValueTypeMap: Record<string, ProRenderFieldPropsType> = {
     render: switchOptionsRender.render,
     renderFormItem: switchOptionsRender.renderFormItem,
   },
+  [CustomValueTypeEnum.CustomSerialNumber]: {
+    render: () => <></>,
+    renderFormItem: () => <></>,
+  },
 };
 
 export { CustomValueTypeEnum, customValueTypeMap };