crud-page-react 0.0.7 → 0.1.1

package/README.md

@@ -36,6 +36,8 @@ yarn add crud-page-react
 
 ## 快速开始
 
+### 基础用法
+
 ```tsx
 import React from 'react';
 import { CrudPage } from 'crud-page-react';
@@ -45,10 +47,22 @@ const schema: CrudPageSchema = {
   id: 'users',
   title: '用户管理',
   api: {
-    list: '/api/users',
-    create: '/api/users',
-    update: '/api/users/:id',
-    delete: '/api/users/:id',
+    list: {
+      url: '/api/users',
+      method: 'GET'
+    },
+    create: {
+      url: '/api/users',
+      method: 'POST'
+    },
+    update: {
+      url: '/api/users/:id',
+      method: 'PUT'
+    },
+    delete: {
+      url: '/api/users/:id',
+      method: 'DELETE'
+    },
   },
   fields: [
     {
@@ -105,6 +119,90 @@ function App() {
 export default App;
 ```
 
+### 扩展 API 配置
+
+v0.1.0+ 版本要求使用完整的 API 配置对象，支持自定义 HTTP 方法、请求头、请求体数据和模板变量：
+
+```tsx
+const advancedSchema: CrudPageSchema = {
+  id: 'orders',
+  title: '订单管理',
+  api: {
+    // 基础配置
+    list: {
+      url: '/api/orders',
+      method: 'GET'
+    },
+    
+    // 扩展配置
+    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 构建
+
+### 💥 Breaking Changes (v0.1.0)
+
+v0.1.0 版本移除了简单字符串配置支持，所有 API 配置必须使用对象格式：
+
+```tsx
+// ❌ 不再支持 (v0.0.x)
+api: {
+  list: '/api/users',
+  create: '/api/users'
+}
+
+// ✅ 必须使用 (v0.1.0+)
+api: {
+  list: {
+    url: '/api/users',
+    method: 'GET'
+  },
+  create: {
+    url: '/api/users',
+    method: 'POST'
+  }
+}
+```
+
 ## 动态 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;