@fe-free/core 1.4.0 → 1.4.3

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @fe-free/core
 
+## 1.4.3
+
+### Patch Changes
+
+- feat: crud
+  - @fe-free/tool@1.4.3
+
+## 1.4.2
+
+### Patch Changes
+
+- @fe-free/tool@1.4.2
+
 ## 1.4.0
 
 ### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/core",
-  "version": "1.4.0",
+  "version": "1.4.3",
   "description": "",
   "main": "./src/index.ts",
   "author": "",
@@ -28,7 +28,6 @@
     "ahooks": "^3.7.8",
     "axios": "^1.6.5",
     "classnames": "^2.5.1",
-    "dayjs": "~1.11.10",
     "lodash-es": "^4.17.21",
     "react-ace": "^11.0.1",
     "react-markdown": "^9.0.1",
@@ -36,11 +35,12 @@
     "react-syntax-highlighter": "^15.5.0",
     "vanilla-jsoneditor": "^0.23.1",
     "zustand": "^4.5.4",
-    "@fe-free/tool": "1.4.0"
+    "@fe-free/tool": "1.4.3"
   },
   "peerDependencies": {
     "@ant-design/pro-components": "^2.8.7",
     "antd": "^5.25.1",
+    "dayjs": "~1.11.10",
     "react": "^18.2.0"
   },
   "scripts": {

package/src/crud/crud.stories.tsx

@@ -387,7 +387,13 @@ export const CustomText: Story = {
           request: fakeRequest,
         }}
         createButton={<Button type="primary">新建</Button>}
+        createProps={{
+          submitText: '自定义新建确定',
+          resetText: '自定义新建取消',
+        }}
         readProps={{
+          submitText: '自定义查看确定',
+          resetText: '自定义查看取消',
           operateText: '查看',
         }}
         deleteProps={{
@@ -397,6 +403,8 @@ export const CustomText: Story = {
         }}
         updateProps={{
           operateText: '编辑',
+          submitText: '自定义编辑确定',
+          resetText: '自定义编辑取消',
           successText: '编辑成功',
         }}
         requestDeleteByRecord={fakeDeleteByRecord}

package/src/crud/crud.tsx

@@ -54,6 +54,7 @@ function CRUDComponent<
       requestUpdateById,
       detailFormInstance,
       createProps,
+      readProps,
       updateProps,
     }),
     [
@@ -63,6 +64,7 @@ function CRUDComponent<
       requestUpdateById,
       detailFormInstance,
       createProps,
+      readProps,
       updateProps,
     ],
   );

package/src/crud/crud_detail.tsx

@@ -3,7 +3,7 @@ import { message, Spin } from 'antd';
 import classNames from 'classnames';
 import { isString } from 'lodash-es';
 import { useCallback, useMemo, useState } from 'react';
-import type { CRUDProps } from './crud';
+import type { CRUDProps } from './types';
 
 /**
  * create 创建
@@ -20,6 +20,7 @@ interface CRUDDetailProps
     CRUDProps,
     | 'requestGetByRecord'
     | 'createProps'
+    | 'readProps'
     | 'requestCreateByValues'
     | 'updateProps'
     | 'requestUpdateById'
@@ -44,6 +45,7 @@ function CRUDDetail(props: CRUDDetailProps) {
     detailForm,
     requestGetByRecord,
     createProps,
+    readProps,
     requestCreateByValues,
     updateProps,
     requestUpdateById,
@@ -170,6 +172,61 @@ function CRUDDetail(props: CRUDDetailProps) {
     };
   }, []);
 
+  const title = useMemo(() => {
+    if (action === 'create') {
+      return '新建';
+    }
+    if (action === 'read') {
+      return '查看';
+    }
+    if (action === 'update') {
+      return '编辑';
+    }
+
+    return '';
+  }, [action]);
+
+  const submitter = useMemo(() => {
+    const result = {
+      searchConfig: {
+        submitText: '确定',
+        resetText: '取消',
+      },
+    };
+    if (action === 'create') {
+      if (createProps?.submitText) {
+        result.searchConfig.submitText = createProps.submitText;
+      }
+      if (createProps?.resetText) {
+        result.searchConfig.resetText = createProps.resetText;
+      }
+    } else if (action === 'read') {
+      if (readProps?.submitText) {
+        result.searchConfig.submitText = readProps.submitText;
+      }
+      if (readProps?.resetText) {
+        result.searchConfig.resetText = readProps.resetText;
+      }
+    } else if (action === 'update') {
+      if (updateProps?.submitText) {
+        result.searchConfig.submitText = updateProps.submitText;
+      }
+      if (updateProps?.resetText) {
+        result.searchConfig.resetText = updateProps.resetText;
+      }
+    }
+
+    return result;
+  }, [
+    action,
+    createProps?.resetText,
+    createProps?.submitText,
+    readProps?.resetText,
+    readProps?.submitText,
+    updateProps?.resetText,
+    updateProps?.submitText,
+  ]);
+
   return (
     <DrawerForm
       form={form}
@@ -181,6 +238,8 @@ function CRUDDetail(props: CRUDDetailProps) {
       readonly={action === 'read' && !!id}
       // 关闭销毁，否则会有很奇怪的 onFinish 闭包问题，怀疑 pro components bug
       drawerProps={drawerProps}
+      title={title}
+      submitter={submitter}
     >
       {children}
     </DrawerForm>

package/src/crud/types.tsx

@@ -30,6 +30,10 @@ interface CRUDProps<DataSource = any, Key = string> {
   createButton?: ReactNode;
   /** create 更多设置 */
   createProps?: {
+    /** 保存按钮文本 */
+    submitText?: string;
+    /** 重置按钮文本 */
+    resetText?: string;
     /** 成功文案 */
     successText?: string | (() => string);
   };
@@ -59,6 +63,10 @@ interface CRUDProps<DataSource = any, Key = string> {
     operateText?: string;
     /** 打开方式, action 为 read_detail 有效 */
     target?: '_blank';
+    /** 保存按钮文本 */
+    submitText?: string;
+    /** 重置按钮文本 */
+    resetText?: string;
   };
 
   // *** Update 更新 ***
@@ -70,6 +78,10 @@ interface CRUDProps<DataSource = any, Key = string> {
   updateProps?: {
     /** 文本 */
     operateText?: string;
+    /** 保存按钮文本 */
+    submitText?: string;
+    /** 重置按钮文本 */
+    resetText?: string;
     /** 成功文案 */
     successText?: string | (() => string);
   };

package/src/tailwind.config.js

@@ -8,8 +8,6 @@ module.exports = {
         secondary: 'rgba(0, 0, 0, 0.65)',
         /** 描述文本 */
         desc: 'rgba(0, 0, 0, 0.45)',
-        // 价格
-        price: '#E7484D',
       },
     },
   },

package/src/tailwindcss.stories.tsx

@@ -11,7 +11,6 @@ export const Default = () => {
         <span className="text-primary">text-primary</span>
         <span className="text-secondary">text-secondary</span>
         <span className="text-desc">text-desc</span>
-        <span className="text-price">text-price</span>
       </div>
     </div>
   );