crud-page-react 0.0.7 → 0.1.0

package/README.md

@@ -36,6 +36,8 @@ yarn add crud-page-react
 
 ## 快速开始
 
+### 基础用法
+
 ```tsx
 import React from 'react';
 import { CrudPage } from 'crud-page-react';
@@ -105,6 +107,63 @@ function App() {
 export default App;
 ```
 
+### 扩展 API 配置
+
+v0.0.7+ 版本支持更强大的 API 配置，包括自定义 HTTP 方法、请求头、请求体数据和模板变量：
+
+```tsx
+const advancedSchema: CrudPageSchema = {
+  id: 'orders',
+  title: '订单管理',
+  api: {
+    // 简单字符串配置（向后兼容）
+    list: '/api/orders',
+    
+    // 扩展对象配置
+    create: {
+      url: '/api/orders',
+      method: 'POST',
+      headers: {
+        'X-Request-Source': 'admin-panel'
+      },
+      data: {
+        source: 'web',
+        createdBy: '{{currentUser}}',
+        timestamp: '{{timestamp}}'
+      }
+    },
+    
+    update: {
+      url: '/api/orders/:id',
+      method: 'PUT',
+      data: {
+        updatedBy: '{{currentUser}}',
+        updateTime: '{{timestamp}}'
+      }
+    },
+    
+    delete: {
+      url: '/api/orders/:orderNo',
+      method: 'DELETE',
+      data: {
+        deletedBy: '{{currentUser}}',
+        deleteReason: '{{deleteReason}}',
+        timestamp: '{{timestamp}}'
+      }
+    }
+  },
+  // ... 其他配置
+};
+```
+
+### 支持的扩展配置
+
+- **HTTP 方法**：GET、POST、PUT、PATCH、DELETE
+- **自定义请求头**：添加认证、来源标识等
+- **请求体数据**：固定参数和动态参数
+- **模板变量**：`{{fieldName}}` 格式的动态值替换
+- **URL 占位符**：`:fieldName` 格式的动态 URL 构建
+
 ## 动态 URL 参数
 
 支持在 API 配置中使用任意字段作为 URL 参数：

package/dist/index.d.ts

@@ -161,12 +161,12 @@ interface CrudPageSchema {
     id: string;
     title: string;
     api: {
-        list: string | ActionApiConfig;
-        create?: string | ActionApiConfig;
-        update?: string | ActionApiConfig;
-        delete?: string | ActionApiConfig;
-        detail?: string | ActionApiConfig;
-        [key: string]: string | ActionApiConfig | undefined;
+        list: ActionApiConfig;
+        create?: ActionApiConfig;
+        update?: ActionApiConfig;
+        delete?: ActionApiConfig;
+        detail?: ActionApiConfig;
+        [key: string]: ActionApiConfig | undefined;
     };
     fields: FieldSchema[];
     actions?: ActionSchema[];

package/dist/index.esm.js

@@ -827,24 +827,6 @@ function processTemplateData(data, record) {
     }
     return result;
 }
-/** 解析 API 配置，支持字符串和对象两种格式 */
-function parseApiConfig(apiDef) {
-    if (!apiDef)
-        return undefined;
-    if (typeof apiDef === 'string') {
-        // 简单字符串 URL 配置
-        return {
-            url: apiDef,
-            method: 'GET',
-            responseType: 'json'
-        };
-    }
-    else if (typeof apiDef === 'object') {
-        // 完整的 API 配置对象
-        return apiDef;
-    }
-    return undefined;
-}
 /** 通用请求封装 */
 async function apiRequest(url, options) {
     const res = await fetch(url, Object.assign({ headers: { 'Content-Type': 'application/json' } }, options));
@@ -893,12 +875,12 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
     }, []);
     // ---------- 获取列表 ----------
     const fetchList = useCallback(async (params = filterParams, p = page, ps = pageSize) => {
-        const listApiConfig = parseApiConfig(schema.api.list);
-        if (!listApiConfig) {
+        if (!schema.api.list) {
             // 没有配置 API，使用初始数据
             initializeData();
             return;
         }
+        const listApiConfig = schema.api.list;
         setLoading(true);
         try {
             // 构建查询参数
@@ -963,11 +945,11 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
     }, []);
     // ---------- 删除 ----------
     const handleDelete = useCallback(async (record) => {
-        const deleteApiConfig = parseApiConfig(schema.api.delete);
-        if (!deleteApiConfig) {
+        if (!schema.api.delete) {
             messageApi.error('删除功能未配置');
             return;
         }
+        const deleteApiConfig = schema.api.delete;
         try {
             // 构建 URL，动态替换占位符
             let url = deleteApiConfig.url;
@@ -1087,11 +1069,11 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
     const handleFormOk = useCallback(async (values) => {
         const isCreate = modalState.mode === 'create';
         if (isCreate) {
-            const createApiConfig = parseApiConfig(schema.api.create);
-            if (!createApiConfig) {
+            if (!schema.api.create) {
                 messageApi.error('新增功能未配置');
                 return;
             }
+            const createApiConfig = schema.api.create;
             try {
                 // 构建请求选项
                 const options = {
@@ -1116,11 +1098,11 @@ const CrudPage = ({ schema, initialData = [], apiRequest: customApiRequest }) =>
             }
         }
         else {
-            const updateApiConfig = parseApiConfig(schema.api.update);
-            if (!updateApiConfig) {
+            if (!schema.api.update) {
                 messageApi.error('编辑功能未配置');
                 return;
             }
+            const updateApiConfig = schema.api.update;
             try {
                 // 构建 URL，动态替换占位符
                 let url = updateApiConfig.url;