crud-page-react 0.0.5 → 0.0.6

package/dist/index.d.ts

@@ -150,6 +150,7 @@ interface ActionSchema {
         content?: string;
     };
     api?: ActionApiConfig;
+    apiKey?: string;
 }
 interface PaginationConfig {
     pageSize?: number;
@@ -165,6 +166,7 @@ interface CrudPageSchema {
         update?: string;
         delete?: string;
         detail?: string;
+        [key: string]: string | ActionApiConfig | undefined;
     };
     fields: FieldSchema[];
     actions?: ActionSchema[];

package/dist/index.esm.js

@@ -817,6 +817,23 @@ function buildUrl(template, record) {
         return value !== undefined ? String(value) : match;
     });
 }
+/** 处理模板数据，支持 {{fieldName}} 格式的变量替换 */
+function processTemplateData(data, record) {
+    const result = {};
+    for (const [key, value] of Object.entries(data)) {
+        if (typeof value === 'string' && value.includes('{{') && value.includes('}}')) {
+            // 替换模板变量 {{fieldName}}
+            result[key] = value.replace(/\{\{(\w+)\}\}/g, (match, fieldName) => {
+                const fieldValue = record[fieldName];
+                return fieldValue !== undefined ? String(fieldValue) : match;
+            });
+        }
+        else {
+            result[key] = value;
+        }
+    }
+    return result;
+}
 /** 通用请求封装 */
 async function apiRequest(url, options) {
     const res = await fetch(url, Object.assign({ headers: { 'Content-Type': 'application/json' } }, options));
@@ -940,31 +957,55 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
         else if (action.type === 'delete') {
             handleDelete(record);
         }
-        else if (action.type === 'custom' && action.api) {
+        else if (action.type === 'custom') {
             // 处理自定义 action 的 API 调用
+            let apiConfig;
+            // 优先使用 apiKey 引用统一配置，向后兼容 api 直接配置
+            if (action.apiKey) {
+                const apiDef = schema.api[action.apiKey];
+                if (typeof apiDef === 'string') {
+                    // 简单字符串 URL 配置
+                    apiConfig = {
+                        url: apiDef,
+                        method: 'GET',
+                        responseType: 'json'
+                    };
+                }
+                else if (apiDef && typeof apiDef === 'object') {
+                    // 完整的 API 配置对象
+                    apiConfig = apiDef;
+                }
+            }
+            else if (action.api) {
+                // 向后兼容：使用 action.api 配置
+                apiConfig = action.api;
+            }
+            if (!apiConfig) {
+                messageApi.error(`${action.label}未配置 API`);
+                return;
+            }
             try {
                 // 构建 URL，动态替换占位符
-                let url = action.api.url;
-                // 替换所有 :fieldName 格式的占位符
+                let url = apiConfig.url;
                 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)
+                    method: apiConfig.method || 'GET',
+                    headers: Object.assign({ 'Content-Type': 'application/json' }, apiConfig.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() }));
+                // 处理请求体数据
+                if (apiConfig.data && ['POST', 'PUT', 'PATCH'].includes(apiConfig.method || 'GET')) {
+                    // 支持模板变量替换
+                    const processedData = processTemplateData(apiConfig.data, record);
+                    options.body = JSON.stringify(Object.assign(Object.assign({}, processedData), { recordId: record[rowKey], timestamp: new Date().toISOString() }));
                 }
                 // 调用 API
                 const response = await request(url, options);
                 // 处理特殊响应类型
-                if (action.api.responseType === 'blob') {
+                if (apiConfig.responseType === 'blob') {
                     // 处理文件下载
                     const blob = new Blob([response]);
                     const downloadUrl = URL.createObjectURL(blob);