refactor(ui): 移除主题相关代码并更新文档

README.md

@@ -4,64 +4,61 @@
 [![React Version](https://img.shields.io/badge/React-19.0.0+-blue.svg)](https://reactjs.org)
 [![License](https://img.shields.io/badge/License-MIT-green.svg)](LICENSE)
 
-ModelKit 是一个强大的AI模型管理平台，支持多种AI服务提供商，提供统一的模型管理、配置验证和API接口服务。
+ModelKit 是一个强大的AI模型管理平台，支持多种AI服务提供商，提供统一的模型管理、配置验证服务。
 
 ## 🚀 功能特性
 
 - **多模型提供商支持**: 支持 OpenAI、Ollama、DeepSeek、SiliconFlow、Moonshot、Azure OpenAI、百智云、腾讯混元、百炼、火山引擎、Gemini、智谱等主流AI服务商
 - **模型类型管理**: 支持聊天模型、嵌入模型、重排序模型、视觉模型、代码模型、函数调用等多种模型类型
 - **配置验证**: 提供模型配置的实时验证功能，确保API配置正确性
-- **统一API接口**: 提供标准化的RESTful API，简化AI模型集成
 - **现代化Web界面**: 基于React 19和Material-UI构建的响应式用户界面
 - **国际化支持**: 内置中英文多语言支持
 - **可复用组件**: 提供开箱即用的ModelModal组件，支持在其他项目中快速集成
 
-## 🏗️ 技术架构
-
-### 后端 (Go)
-- **框架**: Echo v4 (HTTP框架)
-- **语言**: Go 1.24.0+
-- **架构**: 分层架构 (Handler -> UseCase -> Domain)
-- **依赖管理**: Go Modules
-
-### 前端 (React)
-- **框架**: React 19 + TypeScript
-- **UI库**: Material-UI v6 + CT-MUI
-- **构建工具**: Vite 6
-- **状态管理**: Redux Toolkit
-- **路由**: React Router v7
-- **编辑器**: TipTap (富文本编辑器)
-
-## 📁 项目结构
-
-```
-ModelKit/
-├── consts/           # 常量定义
-├── domain/           # 领域模型和接口
-├── errcode/          # 错误码和国际化
-├── handler/          # HTTP处理器
-├── pkg/              # 公共包
-├── usecase/          # 业务用例
-├── ui/               # 前端应用
-│   ├── src/          # 源代码
-│   │   ├── components/     # 可复用组件
-│   │   │   └── Card/       # 卡片组件
-│   │   ├── constant/       # 常量定义
-│   │   ├── api/            # API接口
-│   │   └── services/       # 服务层
-│   ├── public/       # 静态资源
-│   └── package.json  # 前端依赖
-├── utils/            # 工具函数
-├── go.mod            # Go模块文件
-└── Makefile          # 构建脚本
+## 使用方式
+### 后端
+``` bash
+    // 1. 引入ModelKit
+	import (
+		modelkit "github.com/chaitin/ModelKit/usecase"
+	)
+    // 2. 调用ModelKit提供的函数即可
+    modelkitRes, err := modelkit.CheckModel(...)
+    modelkitRes, err := modelkit.ListModel(...)
 ```
-
-## 🛠️ 安装部署
-
-### 环境要求
-
-- Go 1.24.0+
-
-## 📝 许可证
-
-本项目采用 [MIT 许可证](LICENSE)。
+### 前端
+``` bash
+    // 1. 引入ModelKit
+    import { ModelModal, Model, ModelService, ConstsModelType as ModelKitType, ModelListItem } from '@yokowu/modelkit-ui';
+    // 2.创建符合ModelService接口的服务实现
+    const modelService: ModelService = {
+    createModel: async (params) => {
+      const response = await postCreateModel(params as unknown as DomainCreateModelReq);
+      return { model: response as unknown as Model };
+    },
+    listModel: async (params) => {
+      const response = await getGetProviderModelList(params as unknown as GetGetProviderModelListParams);
+      return { models: response?.models || [] };
+    },
+    checkModel: async (params) => {
+      const response = await postCheckModel(params as unknown as DomainCheckModelReq);
+      return { model: response as unknown as Model };
+    },
+    updateModel: async (params) => {
+      const response = await putUpdateModel(params as unknown as DomainUpdateModelReq);
+      return { model: response as unknown as Model };
+    }
+    // 3. 使用ModelModal组件
+        <ModelModal
+        open={open}
+        onClose={() => {
+          setOpen(false);
+          setEditData(null);
+        }}
+        refresh={refreshModel}
+        data={editData as Model | null}
+        type={modelType}
+        modelService={modelService}
+        language="zh-CN"
+      />
+```

handler/http/v1/modelkit.go

@@ -51,12 +51,12 @@ func (p *ModelKit) GetModelList(c echo.Context) error {
 	}
 
 	// 验证参数
-	// if err := c.Validate(&req); err != nil {
-	// 	return c.JSON(http.StatusBadRequest, domain.Response{
-	// 		Success: false,
-	// 		Message: "参数验证失败: " + err.Error(),
-	// 	})
-	// }
+	if err := c.Validate(&req); err != nil {
+		return c.JSON(http.StatusBadRequest, domain.Response{
+			Success: false,
+			Message: "参数验证失败: " + err.Error(),
+		})
+	}
 
 	resp, err := usecase.ModelList(c.Request().Context(), &req)
 	if err != nil {

ui/ModelModal/README.md

@@ -5,11 +5,7 @@
 ## 安装
 
 ```bash
-npm install @yokowu/modelkit-ui
-# 或
-yarn add @yokowu/modelkit-ui
-# 或
-pnpm add @yokowu/modelkit-ui
+npm install @your-org/model-modal
 ```
 
 ## 使用方法
@@ -100,51 +96,61 @@ const baseTheme = createTheme({
 const theme = mergeThemeWithDefaults(baseTheme);
 ```
 
-## 组件
+### TypeScript 支持
 
-### ModelAdd
+如果你使用 TypeScript，需要确保主题类型扩展被正确导入：
 
-模型添加/编辑弹窗组件。
+```tsx
+// 在你的类型声明文件中（如 vite-env.d.ts 或 global.d.ts）
+import '@your-org/model-modal/dist/types/theme';
+```
 
-#### Props
+或者在使用组件的文件中导入：
 
-- `open: boolean` - 是否显示弹窗
-- `data: ModelListItem | null` - 编辑时的模型数据
-- `type: 'chat' | 'embedding' | 'rerank'` - 模型类型
-- `onClose: () => void` - 关闭弹窗回调
-- `refresh: () => void` - 刷新数据回调
+```tsx
+import '@your-org/model-modal/dist/types/theme';
+import { ModelModal } from '@your-org/model-modal';
+```
 
-## 依赖要求
+## 常见问题
 
-确保你的项目已安装以下依赖：
+### 样式显示不正确
 
-```json
-{
-  "peerDependencies": {
-    "react": ">=18.0.0",
-    "react-dom": ">=18.0.0",
-    "@mui/material": ">=5.0.0",
-    "@mui/icons-material": ">=5.0.0",
-    "@emotion/react": ">=11.0.0",
-    "@emotion/styled": ">=11.0.0",
-    "react-hook-form": ">=7.0.0"
-  }
-}
-```
+如果组件的样式显示不正确，通常是因为主题中缺少 `background.paper2` 的定义。请确保：
 
-## 开发
+1. 在主题配置中添加 `background.paper2` 属性
+2. 使用 `ThemeProvider` 包装你的应用
+3. 导入了正确的主题类型声明
 
-本项目使用 pnpm 作为包管理器：
+### TypeScript 类型错误
 
-```bash
-# 安装依赖
-pnpm install
+如果遇到 TypeScript 类型错误，如 "Property 'paper2' does not exist"，请确保：
 
-# 开发模式
-pnpm dev
+1. 导入了主题类型扩展：`import '@your-org/model-modal/dist/types/theme'`
+2. 重启 TypeScript 服务
 
-# 构建
-pnpm build
+## API
+
+### ModelModalProps
+
+| 属性 | 类型 | 必需 | 描述 |
+|------|------|------|------|
+| open | boolean | ✓ | 控制模态框的显示/隐藏 |
+| onClose | () => void | ✓ | 关闭模态框的回调函数 |
+| refresh | () => void | ✓ | 刷新数据的回调函数 |
+| data | Model \| null | ✓ | 编辑时的模型数据，新建时为 null |
+| type | ConstsModelType | ✓ | 模型类型 |
+| modelService | ModelService | ✓ | 模型服务接口 |
+
+### ModelService
+
+```tsx
+interface ModelService {
+  createModel: (data: CreateModelReq) => Promise<{ model: Model }>;
+  listModel: (data: ListModelReq) => Promise<{ models: ModelListItem[] }>;
+  checkModel: (data: CheckModelReq) => Promise<{ model: Model }>;
+  updateModel: (data: UpdateModelReq) => Promise<{ model: Model }>;
+}
 ```
 
 ## 许可证

ui/ModelModal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yokowu/modelkit-ui",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "A reusable AI model configuration modal component for React applications",
   "private": false,
   "type": "module",
@@ -16,8 +16,7 @@
     "./styles": "./dist/styles.css"
   },
   "publishConfig": {
-    "registry": "https://registry.npmjs.org",
-    "access": "public"
+    "registry": "https://npm.pkg.github.com"
   },
   "files": [
     "dist"

ui/ModelModal/src/ModelModal.tsx

@@ -24,7 +24,6 @@ import {
 } from './types/types';
 import { DEFAULT_MODEL_PROVIDERS } from './constants/providers';
 import { ModelProvider } from './constants/providers';
-import { mergeThemeWithDefaults } from './constants/theme';
 import { getLocaleMessage } from './constants/locale';
 import './assets/fonts/iconfont';
 import { lightTheme } from './theme';