diff --git a/src/pages/ResourceCategoryPage.tsx b/src/pages/ResourceCategoryPage.tsx deleted file mode 100644 index cc5912c..0000000 --- a/src/pages/ResourceCategoryPage.tsx +++ /dev/null @@ -1,390 +0,0 @@ -import React, { useState, useEffect } from 'react' -import { Plus, Edit, Trash2, Search, Save, X } from 'lucide-react' -import { ResourceCategoryService, ResourceCategory } from '../services/resourceCategoryService' - -const ResourceCategoryPage: React.FC = () => { - const [categories, setCategories] = useState([]) - const [loading, setLoading] = useState(true) - const [searchTerm, setSearchTerm] = useState('') - const [editingCategory, setEditingCategory] = useState(null) - const [showCreateForm, setShowCreateForm] = useState(false) - const [showDisabled, setShowDisabled] = useState(true) // 在管理页面默认显示所有分类 - const [formData, setFormData] = useState({ - title: '', - ai_prompt: '', - color: '#FF6B6B' - }) - - // 预设颜色选项 - const presetColors = [ - '#FF6B6B', '#4ECDC4', '#45B7D1', '#96CEB4', '#FFEAA7', '#DDA0DD', - '#FF7675', '#74B9FF', '#00B894', '#FDCB6E', '#E17055', '#A29BFE', - '#FD79A8', '#6C5CE7', '#00CEC9', '#55A3FF', '#FF9F43', '#26DE81' - ] - - useEffect(() => { - loadCategories() - }, []) - - const loadCategories = async () => { - try { - setLoading(true) - const response = await ResourceCategoryService.getAllCategories() - console.log(`loadCategories`, response) - if (response.status && response.data) { - setCategories(response.data) - } else { - console.error('Failed to load categories:', response.msg) - } - } catch (error) { - console.error('Failed to load categories:', error) - } finally { - setLoading(false) - } - } - - const handleCreateCategory = async () => { - try { - const response = await ResourceCategoryService.createCategory(formData) - console.log(`handleCreateCategory`, response) - if (response.status && response.data) { - setCategories([...categories, response.data]) - setShowCreateForm(false) - setFormData({ title: '', ai_prompt: '', color: '#FF6B6B' }) - } else { - console.error('创建失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to create category:', error) - } - } - - const handleUpdateCategory = async () => { - if (!editingCategory) return - - try { - const response = await ResourceCategoryService.updateCategory(editingCategory.id, formData) - if (response.status && response.data) { - const updatedCategories = categories.map(cat => - cat.id === editingCategory.id ? response.data! : cat - ) - setCategories(updatedCategories) - setEditingCategory(null) - setFormData({ title: '', ai_prompt: '', color: '#FF6B6B' }) - } else { - console.error('更新失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to update category:', error) - } - } - - const handleDeleteCategory = async (categoryId: string) => { - if (!confirm('确定要删除这个分类吗?')) return - - try { - const response = await ResourceCategoryService.deleteCategory(categoryId) - if (response.status) { - setCategories(categories.filter(cat => cat.id !== categoryId)) - } else { - console.error('删除失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to delete category:', error) - } - } - - const handleToggleCategory = async (categoryId: string, isActive: boolean) => { - try { - const response = await ResourceCategoryService.updateCategory(categoryId, { - is_active: isActive - }) - if (response.status && response.data) { - const updatedCategories = categories.map(cat => - cat.id === categoryId ? response.data! : cat - ) - setCategories(updatedCategories) - } else { - console.error('切换状态失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to toggle category:', error) - } - } - - const startEdit = (category: ResourceCategory) => { - setEditingCategory(category) - setFormData({ - title: category.title, - ai_prompt: category.ai_prompt, - color: category.color - }) - setShowCreateForm(false) - } - - const cancelEdit = () => { - setEditingCategory(null) - setShowCreateForm(false) - setFormData({ title: '', ai_prompt: '', color: '#FF6B6B' }) - } - - const filteredCategories = categories.filter(category => { - // 搜索过滤 - const matchesSearch = category.title.toLowerCase().includes(searchTerm.toLowerCase()) || - category.ai_prompt.toLowerCase().includes(searchTerm.toLowerCase()) - - // 状态过滤:在管理页面显示所有分类,其他地方只显示启用的 - const matchesStatus = showDisabled || category.is_active - - return matchesSearch && matchesStatus - }) - - if (loading) { - return ( -
-
加载中...
-
- ) - } - - return ( -
- {/* 页面标题 */} -
-

素材分类管理

-

管理素材分类,设置AI识别提示词和展示颜色

-
- - {/* 搜索和创建按钮 */} -
-
- - setSearchTerm(e.target.value)} - className="pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent w-full" - /> -
- -
- {/* 显示禁用分类开关 */} - - - -
-
- - {/* 分类列表 */} -
- {filteredCategories.map((category) => ( -
- {/* 分类标题和颜色 */} -
-
-
-

- {category.title} -

- {!category.is_active && ( - - 已禁用 - - )} -
- -
- {/* 启用/禁用开关 */} - - - - -
-
- - {/* AI提示词 */} -
-

{category.ai_prompt}

-
- - {/* 创建时间 */} -
- 创建于 {new Date(category.created_at).toLocaleDateString()} -
-
- ))} -
- - {/* 空状态 */} - {filteredCategories.length === 0 && ( -
-
- {searchTerm ? '没有找到匹配的分类' : '暂无分类'} -
- {!searchTerm && ( - - )} -
- )} - - {/* 创建/编辑表单弹窗 */} - {(showCreateForm || editingCategory) && ( -
-
- {/* 表单标题 */} -
-

- {editingCategory ? '编辑分类' : '新建分类'} -

- -
- - {/* 表单内容 */} -
- {/* 分类标题 */} -
- - setFormData({ ...formData, title: e.target.value })} - placeholder="请输入分类标题" - className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent" - /> -
- - {/* AI识别提示词 */} -
- -