crud-page-react 0.0.2 → 0.0.4

package/dist/index.d.ts

@@ -129,17 +129,27 @@ interface ActionPermission {
     role?: string[];
     condition?: string;
 }
+interface ActionApiConfig {
+    url: string;
+    method: 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';
+    data?: Record<string, unknown>;
+    headers?: Record<string, string>;
+    responseType?: 'json' | 'blob' | 'text';
+}
 interface ActionSchema {
     key: string;
     label: string;
     type: ActionType;
     icon?: string;
     danger?: boolean;
+    color?: string;
     permission?: ActionPermission;
+    condition?: Record<string, unknown>;
     confirm?: {
         title: string;
         content?: string;
     };
+    api?: ActionApiConfig;
 }
 interface PaginationConfig {
     pageSize?: number;

package/dist/index.esm.js

@@ -810,9 +810,12 @@ function DynamicForm({ schema, mode, visible, initialValues, onSubmit, onCancel,
 }
 
 const { Title } = Typography;
-/** 替换 URL 模板中的 :id */
-function buildUrl(template, id) {
-    return template.replace(/:id/, String(id));
+/** 动态替换 URL 模板中的占位符 */
+function buildUrl(template, record) {
+    return template.replace(/:(\w+)/g, (match, fieldName) => {
+        const value = record[fieldName];
+        return value !== undefined ? String(value) : match;
+    });
 }
 /** 通用请求封装 */
 async function apiRequest(url, options) {
@@ -920,7 +923,7 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
         const id = record[rowKey];
         if (schema.api.delete) {
             try {
-                await request(buildUrl(schema.api.delete, id), { method: 'DELETE' });
+                await request(buildUrl(schema.api.delete, record), { method: 'DELETE' });
                 messageApi.success('删除成功');
                 fetchList();
                 return;
@@ -934,7 +937,7 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
         messageApi.success('删除成功（演示模式）');
     }, [request, schema.api.delete, rowKey, fetchList, localFilter, filterParams, page, pageSize, messageApi]);
     // ---------- 操作列点击 ----------
-    const handleAction = useCallback((action, record) => {
+    const handleAction = useCallback(async (action, record) => {
         if (action.type === 'view') {
             setModalState({ open: true, mode: 'view', record });
         }
@@ -944,7 +947,60 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
         else if (action.type === 'delete') {
             handleDelete(record);
         }
-    }, [handleDelete]);
+        else if (action.type === 'custom' && action.api) {
+            // 处理自定义 action 的 API 调用
+            try {
+                // 构建 URL，动态替换占位符
+                let url = action.api.url;
+                // 替换所有 :fieldName 格式的占位符
+                url = url.replace(/:(\w+)/g, (match, fieldName) => {
+                    const value = record[fieldName];
+                    return value !== undefined ? String(value) : match;
+                });
+                // 构建请求选项
+                const options = {
+                    method: action.api.method,
+                    headers: Object.assign({ 'Content-Type': 'application/json' }, action.api.headers)
+                };
+                // 添加请求体数据
+                if (action.api.data && ['POST', 'PUT', 'PATCH'].includes(action.api.method)) {
+                    options.body = JSON.stringify(Object.assign(Object.assign({}, action.api.data), { 
+                        // 可以添加动态数据
+                        recordId: record[rowKey], timestamp: new Date().toISOString() }));
+                }
+                // 调用 API
+                const response = await request(url, options);
+                // 处理特殊响应类型
+                if (action.api.responseType === 'blob') {
+                    // 处理文件下载
+                    const blob = new Blob([response]);
+                    const downloadUrl = URL.createObjectURL(blob);
+                    const a = document.createElement('a');
+                    a.href = downloadUrl;
+                    a.download = `${action.key}.pdf`;
+                    a.click();
+                    URL.revokeObjectURL(downloadUrl);
+                    messageApi.success(`${action.label}成功`);
+                }
+                else {
+                    // 处理 JSON 响应
+                    const result = response;
+                    if (result.success !== false) {
+                        messageApi.success(`${action.label}成功`);
+                        // 刷新数据
+                        await fetchList();
+                    }
+                    else {
+                        messageApi.error(result.message || `${action.label}失败`);
+                    }
+                }
+            }
+            catch (error) {
+                console.error(`Action ${action.key} failed:`, error);
+                messageApi.error(`${action.label}失败`);
+            }
+        }
+    }, [handleDelete, rowKey, request, messageApi, fetchList]);
     // ---------- 新增 / 编辑提交 ----------
     const handleFormOk = useCallback(async (values) => {
         const isCreate = modalState.mode === 'create';
@@ -974,7 +1030,7 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
             const id = values[rowKey];
             if (schema.api.update) {
                 try {
-                    await request(buildUrl(schema.api.update, id), {
+                    await request(buildUrl(schema.api.update, values), {
                         method: 'PUT',
                         body: JSON.stringify(values),
                     });