crud-page-react 0.0.6 → 0.1.0

package/dist/index.js

@@ -812,13 +812,6 @@ function DynamicForm({ schema, mode, visible, initialValues, onSubmit, onCancel,
 }
 
 const { Title } = antd.Typography;
-/** 动态替换 URL 模板中的占位符 */
-function buildUrl(template, record) {
-    return template.replace(/:(\w+)/g, (match, fieldName) => {
-        const value = record[fieldName];
-        return value !== undefined ? String(value) : match;
-    });
-}
 /** 处理模板数据，支持 {{fieldName}} 格式的变量替换 */
 function processTemplateData(data, record) {
     const result = {};
@@ -889,14 +882,34 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
             initializeData();
             return;
         }
+        const listApiConfig = schema.api.list;
         setLoading(true);
         try {
+            // 构建查询参数
             const query = new URLSearchParams({ page: String(p), pageSize: String(ps) });
             Object.entries(params).forEach(([k, v]) => {
                 if (v !== undefined && v !== null && v !== '')
                     query.set(k, String(v));
             });
-            const json = await request(`${schema.api.list}?${query}`);
+            // 构建请求选项
+            const options = {
+                method: listApiConfig.method || 'GET',
+                headers: Object.assign({ 'Content-Type': 'application/json' }, listApiConfig.headers)
+            };
+            // 如果是 POST 请求，将查询参数放到请求体中
+            let url = listApiConfig.url;
+            if (listApiConfig.method === 'POST') {
+                const queryParams = {};
+                query.forEach((value, key) => {
+                    queryParams[key] = value;
+                });
+                const requestData = Object.assign(Object.assign({}, queryParams), listApiConfig.data);
+                options.body = JSON.stringify(requestData);
+            }
+            else {
+                url = `${url}?${query}`;
+            }
+            const json = await request(url, options);
             const { list, total: tot } = extractListResponse(json);
             setData(list);
             setTotal(tot);
@@ -938,8 +951,25 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
             messageApi.error('删除功能未配置');
             return;
         }
+        const deleteApiConfig = schema.api.delete;
         try {
-            await request(buildUrl(schema.api.delete, record), { method: 'DELETE' });
+            // 构建 URL，动态替换占位符
+            let url = deleteApiConfig.url;
+            url = url.replace(/:(\w+)/g, (match, fieldName) => {
+                const value = record[fieldName];
+                return value !== undefined ? String(value) : match;
+            });
+            // 构建请求选项
+            const options = {
+                method: deleteApiConfig.method || 'DELETE',
+                headers: Object.assign({ 'Content-Type': 'application/json' }, deleteApiConfig.headers)
+            };
+            // 处理请求体数据
+            if (deleteApiConfig.data && ['POST', 'PUT', 'PATCH', 'DELETE'].includes(deleteApiConfig.method || 'DELETE')) {
+                const processedData = processTemplateData(deleteApiConfig.data, record);
+                options.body = JSON.stringify(Object.assign(Object.assign({}, processedData), { recordId: record[rowKey], timestamp: new Date().toISOString() }));
+            }
+            await request(url, options);
             messageApi.success('删除成功');
             fetchList();
         }
@@ -947,7 +977,7 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
             console.error('Delete failed:', error);
             messageApi.error('删除失败，请稍后重试');
         }
-    }, [request, schema.api.delete, fetchList, messageApi]);
+    }, [request, schema.api.delete, fetchList, messageApi, rowKey]);
     // ---------- 操作列点击 ----------
     const handleAction = react.useCallback(async (action, record) => {
         if (action.type === 'view') {
@@ -1045,11 +1075,21 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
                 messageApi.error('新增功能未配置');
                 return;
             }
+            const createApiConfig = schema.api.create;
             try {
-                await request(schema.api.create, {
-                    method: 'POST',
-                    body: JSON.stringify(values),
-                });
+                // 构建请求选项
+                const options = {
+                    method: createApiConfig.method || 'POST',
+                    headers: Object.assign({ 'Content-Type': 'application/json' }, createApiConfig.headers)
+                };
+                // 处理请求体数据
+                let requestData = Object.assign({}, values);
+                if (createApiConfig.data) {
+                    const processedData = processTemplateData(createApiConfig.data, values);
+                    requestData = Object.assign(Object.assign(Object.assign({}, requestData), processedData), { timestamp: new Date().toISOString() });
+                }
+                options.body = JSON.stringify(requestData);
+                await request(createApiConfig.url, options);
                 messageApi.success('新增成功');
                 setModalState({ open: false, mode: 'create' });
                 fetchList();
@@ -1064,11 +1104,27 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
                 messageApi.error('编辑功能未配置');
                 return;
             }
+            const updateApiConfig = schema.api.update;
             try {
-                await request(buildUrl(schema.api.update, values), {
-                    method: 'PUT',
-                    body: JSON.stringify(values),
+                // 构建 URL，动态替换占位符
+                let url = updateApiConfig.url;
+                url = url.replace(/:(\w+)/g, (match, fieldName) => {
+                    const value = values[fieldName];
+                    return value !== undefined ? String(value) : match;
                 });
+                // 构建请求选项
+                const options = {
+                    method: updateApiConfig.method || 'PUT',
+                    headers: Object.assign({ 'Content-Type': 'application/json' }, updateApiConfig.headers)
+                };
+                // 处理请求体数据
+                let requestData = Object.assign({}, values);
+                if (updateApiConfig.data) {
+                    const processedData = processTemplateData(updateApiConfig.data, values);
+                    requestData = Object.assign(Object.assign(Object.assign({}, requestData), processedData), { timestamp: new Date().toISOString() });
+                }
+                options.body = JSON.stringify(requestData);
+                await request(url, options);
                 messageApi.success('编辑成功');
                 setModalState({ open: false, mode: 'create' });
                 fetchList();