fix: user id
This commit is contained in:
root
parent
846eaaf9b0
commit
ca779ce66b
|
|
@ -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<ResourceCategory[]>([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [searchTerm, setSearchTerm] = useState('')
|
||||
const [editingCategory, setEditingCategory] = useState<ResourceCategory | null>(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 (
|
||||
<div className="flex items-center justify-center h-64">
|
||||
<div className="text-gray-500">加载中...</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="p-6">
|
||||
{/* 页面标题 */}
|
||||
<div className="mb-6">
|
||||
<h1 className="text-2xl font-bold text-gray-900">素材分类管理</h1>
|
||||
<p className="text-gray-600 mt-2">管理素材分类，设置AI识别提示词和展示颜色</p>
|
||||
</div>
|
||||
|
||||
{/* 搜索和创建按钮 */}
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<div className="relative flex-1 max-w-md">
|
||||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400" size={20} />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="搜索分类..."
|
||||
value={searchTerm}
|
||||
onChange={(e) => 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"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-3 ml-4">
|
||||
{/* 显示禁用分类开关 */}
|
||||
<label className="flex items-center text-sm text-gray-600">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={showDisabled}
|
||||
onChange={(e) => setShowDisabled(e.target.checked)}
|
||||
className="mr-2"
|
||||
/>
|
||||
显示禁用分类
|
||||
</label>
|
||||
|
||||
<button
|
||||
onClick={() => {
|
||||
setShowCreateForm(true)
|
||||
setEditingCategory(null)
|
||||
setFormData({ title: '', ai_prompt: '', color: '#FF6B6B' })
|
||||
}}
|
||||
className="flex items-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
<Plus size={20} className="mr-2" />
|
||||
新建分类
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 分类列表 */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{filteredCategories.map((category) => (
|
||||
<div key={category.id} className={`bg-white rounded-lg shadow-sm border p-6 transition-all ${
|
||||
category.is_active
|
||||
? 'border-gray-200'
|
||||
: 'border-gray-300 bg-gray-50 opacity-75'
|
||||
}`}>
|
||||
{/* 分类标题和颜色 */}
|
||||
<div className="flex items-center justify-between mb-4">
|
||||
<div className="flex items-center">
|
||||
<div
|
||||
className="w-4 h-4 rounded-full mr-3"
|
||||
style={{ backgroundColor: category.color }}
|
||||
/>
|
||||
<h3 className={`text-lg font-semibold ${category.is_active ? 'text-gray-900' : 'text-gray-400'}`}>
|
||||
{category.title}
|
||||
</h3>
|
||||
{!category.is_active && (
|
||||
<span className="ml-2 px-2 py-1 text-xs bg-gray-100 text-gray-500 rounded">
|
||||
已禁用
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-2">
|
||||
{/* 启用/禁用开关 */}
|
||||
<label className="relative inline-flex items-center cursor-pointer">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={category.is_active}
|
||||
onChange={(e) => handleToggleCategory(category.id, e.target.checked)}
|
||||
className="sr-only peer"
|
||||
/>
|
||||
<div className="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-600"></div>
|
||||
</label>
|
||||
|
||||
<button
|
||||
onClick={() => startEdit(category)}
|
||||
className="p-2 text-gray-400 hover:text-blue-600 transition-colors"
|
||||
title="编辑"
|
||||
>
|
||||
<Edit size={16} />
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleDeleteCategory(category.id)}
|
||||
className="p-2 text-gray-400 hover:text-red-600 transition-colors"
|
||||
title="删除"
|
||||
>
|
||||
<Trash2 size={16} />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* AI提示词 */}
|
||||
<div className="mb-4">
|
||||
<p className="text-sm text-gray-600 leading-relaxed">{category.ai_prompt}</p>
|
||||
</div>
|
||||
|
||||
{/* 创建时间 */}
|
||||
<div className="text-xs text-gray-400">
|
||||
创建于 {new Date(category.created_at).toLocaleDateString()}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* 空状态 */}
|
||||
{filteredCategories.length === 0 && (
|
||||
<div className="text-center py-12">
|
||||
<div className="text-gray-400 mb-4">
|
||||
{searchTerm ? '没有找到匹配的分类' : '暂无分类'}
|
||||
</div>
|
||||
{!searchTerm && (
|
||||
<button
|
||||
onClick={() => setShowCreateForm(true)}
|
||||
className="text-blue-600 hover:text-blue-700"
|
||||
>
|
||||
创建第一个分类
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* 创建/编辑表单弹窗 */}
|
||||
{(showCreateForm || editingCategory) && (
|
||||
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
|
||||
<div className="bg-white rounded-lg shadow-xl w-full max-w-md mx-4">
|
||||
{/* 表单标题 */}
|
||||
<div className="flex items-center justify-between p-6 border-b border-gray-200">
|
||||
<h2 className="text-lg font-semibold text-gray-900">
|
||||
{editingCategory ? '编辑分类' : '新建分类'}
|
||||
</h2>
|
||||
<button
|
||||
onClick={cancelEdit}
|
||||
className="text-gray-400 hover:text-gray-600"
|
||||
>
|
||||
<X size={24} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* 表单内容 */}
|
||||
<div className="p-6 space-y-4">
|
||||
{/* 分类标题 */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
分类标题
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
value={formData.title}
|
||||
onChange={(e) => 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"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* AI识别提示词 */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
AI识别提示词
|
||||
</label>
|
||||
<textarea
|
||||
value={formData.ai_prompt}
|
||||
onChange={(e) => setFormData({ ...formData, ai_prompt: e.target.value })}
|
||||
placeholder="描述这类素材的特征，用于AI自动分类"
|
||||
rows={3}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 展示颜色 */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
展示颜色
|
||||
</label>
|
||||
<div className="flex items-center space-x-3 mb-3">
|
||||
<div
|
||||
className="w-8 h-8 rounded-lg border-2 border-gray-300"
|
||||
style={{ backgroundColor: formData.color }}
|
||||
/>
|
||||
<input
|
||||
type="color"
|
||||
value={formData.color}
|
||||
onChange={(e) => setFormData({ ...formData, color: e.target.value })}
|
||||
className="w-16 h-8 border border-gray-300 rounded cursor-pointer"
|
||||
/>
|
||||
<span className="text-sm text-gray-600">{formData.color}</span>
|
||||
</div>
|
||||
|
||||
{/* 预设颜色 */}
|
||||
<div className="grid grid-cols-9 gap-2">
|
||||
{presetColors.map((color) => (
|
||||
<button
|
||||
key={color}
|
||||
onClick={() => setFormData({ ...formData, color })}
|
||||
className={`w-8 h-8 rounded-lg border-2 transition-all ${
|
||||
formData.color === color
|
||||
? 'border-gray-800 scale-110'
|
||||
: 'border-gray-300 hover:border-gray-400'
|
||||
}`}
|
||||
style={{ backgroundColor: color }}
|
||||
title={color}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 表单按钮 */}
|
||||
<div className="flex items-center justify-end space-x-3 p-6 border-t border-gray-200">
|
||||
<button
|
||||
onClick={cancelEdit}
|
||||
className="px-4 py-2 text-gray-600 border border-gray-300 rounded-lg hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
取消
|
||||
</button>
|
||||
<button
|
||||
onClick={editingCategory ? handleUpdateCategory : handleCreateCategory}
|
||||
disabled={!formData.title.trim() || !formData.ai_prompt.trim()}
|
||||
className="flex items-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:bg-gray-400 disabled:cursor-not-allowed transition-colors"
|
||||
>
|
||||
<Save size={16} className="mr-2" />
|
||||
{editingCategory ? '保存' : '创建'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default ResourceCategoryPage
|
||||
|
|
@ -1,141 +0,0 @@
|
|||
import { invoke } from '@tauri-apps/api/core'
|
||||
|
||||
export interface ResourceCategory {
|
||||
id: string
|
||||
title: string
|
||||
ai_prompt: string
|
||||
color: string
|
||||
created_at: string
|
||||
updated_at: string
|
||||
is_active: boolean
|
||||
}
|
||||
|
||||
export interface CreateCategoryRequest {
|
||||
title: string
|
||||
ai_prompt: string
|
||||
color: string
|
||||
}
|
||||
|
||||
export interface UpdateCategoryRequest {
|
||||
title?: string
|
||||
ai_prompt?: string
|
||||
color?: string
|
||||
is_active?: boolean
|
||||
}
|
||||
|
||||
export interface ApiResponse<T> {
|
||||
status: boolean
|
||||
data?: T
|
||||
msg?: string
|
||||
}
|
||||
|
||||
export class ResourceCategoryService {
|
||||
/**
|
||||
* 获取所有分类
|
||||
*/
|
||||
static async getAllCategories(): Promise<ApiResponse<ResourceCategory[]>> {
|
||||
try {
|
||||
const result = await invoke('get_all_resource_categories')
|
||||
return { status: true, msg: 'ok', data: this.tryJsonParse(result) } as ApiResponse<ResourceCategory[]>
|
||||
} catch (error) {
|
||||
console.error('Failed to get all categories:', error)
|
||||
return {
|
||||
status: false,
|
||||
msg: error instanceof Error ? error.message : 'Unknown error'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 根据ID获取分类
|
||||
*/
|
||||
static async getCategoryById(categoryId: string): Promise<ApiResponse<ResourceCategory>> {
|
||||
try {
|
||||
const result = await invoke('get_resource_category_by_id', { categoryId })
|
||||
return { status: true, msg: 'ok', data: this.tryJsonParse(result) } as ApiResponse<ResourceCategory>
|
||||
} catch (error) {
|
||||
console.error('Failed to get category by id:', error)
|
||||
return {
|
||||
status: false,
|
||||
msg: error instanceof Error ? error.message : 'Unknown error'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建新分类
|
||||
*/
|
||||
static async createCategory(request: CreateCategoryRequest): Promise<ApiResponse<ResourceCategory>> {
|
||||
try {
|
||||
const result = await invoke('create_resource_category', { request })
|
||||
return { status: true, msg: 'ok', data: this.tryJsonParse(result) } as ApiResponse<ResourceCategory>
|
||||
} catch (error) {
|
||||
console.error('Failed to create category:', error)
|
||||
return {
|
||||
status: false,
|
||||
msg: error instanceof Error ? error.message : 'Unknown error'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
static tryJsonParse(str: any) {
|
||||
try {
|
||||
if (typeof str === 'string') {
|
||||
return JSON.parse(str)
|
||||
}
|
||||
return str;
|
||||
} catch (e) {
|
||||
return str;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* 更新分类
|
||||
*/
|
||||
static async updateCategory(
|
||||
categoryId: string,
|
||||
request: UpdateCategoryRequest
|
||||
): Promise<ApiResponse<ResourceCategory>> {
|
||||
try {
|
||||
const result = await invoke('update_resource_category', { categoryId, request })
|
||||
return { status: true, msg: 'ok', data: this.tryJsonParse(result) } as ApiResponse<ResourceCategory>
|
||||
} catch (error) {
|
||||
console.error('Failed to update category:', error)
|
||||
return {
|
||||
status: false,
|
||||
msg: error instanceof Error ? error.message : 'Unknown error'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除分类
|
||||
*/
|
||||
static async deleteCategory(categoryId: string): Promise<ApiResponse<boolean>> {
|
||||
try {
|
||||
const result = await invoke('delete_resource_category', { categoryId })
|
||||
return { status: true, msg: 'ok', data: this.tryJsonParse(result) } as ApiResponse<boolean>
|
||||
} catch (error) {
|
||||
console.error('Failed to delete category:', error)
|
||||
return {
|
||||
status: false,
|
||||
msg: error instanceof Error ? error.message : 'Unknown error'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 搜索分类
|
||||
*/
|
||||
static async searchCategories(keyword: string): Promise<ApiResponse<ResourceCategory[]>> {
|
||||
try {
|
||||
const result = await invoke('search_resource_categories', { keyword })
|
||||
return { status: true, msg: 'ok', data: this.tryJsonParse(result) } as ApiResponse<ResourceCategory[]>
|
||||
} catch (error) {
|
||||
console.error('Failed to search categories:', error)
|
||||
return {
|
||||
status: false,
|
||||
msg: error instanceof Error ? error.message : 'Unknown error'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
import { invoke } from '@tauri-apps/api/core'
|
||||
import { useAuthStore } from '../stores/useAuthStore'
|
||||
|
||||
// 扩展的资源分类接口，包含新字段
|
||||
export interface ResourceCategoryV2 {
|
||||
|
|
@ -107,7 +108,18 @@ export interface BatchCreateResult {
|
|||
}
|
||||
|
||||
export class ResourceCategoryServiceV2 {
|
||||
private static defaultUserId = 'default'
|
||||
/**
|
||||
* 获取当前用户ID
|
||||
*/
|
||||
private static getCurrentUserId(): string {
|
||||
const authState = useAuthStore.getState()
|
||||
|
||||
if (!authState.isAuthenticated || !authState.user?.id) {
|
||||
throw new Error('用户未登录，请先登录后再进行操作')
|
||||
}
|
||||
|
||||
return authState.user.id
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取所有分类（新版本）
|
||||
|
|
@ -115,7 +127,7 @@ export class ResourceCategoryServiceV2 {
|
|||
static async getAllCategories(request?: Partial<CategoryListRequest>): Promise<ResourceCategoryV2[]> {
|
||||
try {
|
||||
const params: CategoryListRequest = {
|
||||
user_id: this.defaultUserId,
|
||||
user_id: request?.user_id || this.getCurrentUserId(),
|
||||
include_cloud: true,
|
||||
limit: 100,
|
||||
verbose: false,
|
||||
|
|
@ -144,7 +156,7 @@ export class ResourceCategoryServiceV2 {
|
|||
try {
|
||||
const params: CategoryGetRequest = {
|
||||
category_id: categoryId,
|
||||
user_id: userId || this.defaultUserId,
|
||||
user_id: userId || this.getCurrentUserId(),
|
||||
verbose: false,
|
||||
json_output: true
|
||||
}
|
||||
|
|
@ -179,7 +191,7 @@ export class ResourceCategoryServiceV2 {
|
|||
ai_prompt: aiPrompt || '',
|
||||
color: color || '#FF5733',
|
||||
is_cloud: isCloud || false,
|
||||
user_id: userId || this.defaultUserId,
|
||||
user_id: userId || this.getCurrentUserId(),
|
||||
verbose: false,
|
||||
json_output: true
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue