diff --git a/src/pages/ProjectManagePage.tsx b/src/pages/ProjectManagePage.tsx deleted file mode 100644 index e65c2aa..0000000 --- a/src/pages/ProjectManagePage.tsx +++ /dev/null @@ -1,426 +0,0 @@ -import React, { useState, useEffect } from 'react' -import { ProjectService, Project } from '../services/projectService' -import ProjectSearchBar from '../components/ProjectSearchBar' -import ProjectList from '../components/ProjectList' -import ProjectForm from '../components/ProjectForm' - -interface FormData { - name: string - local_directory: string - product_name: string - product_image: string -} - -const ProjectManagePage: React.FC = () => { - const [projects, setProjects] = useState([]) - const [loading, setLoading] = useState(true) - const [searchTerm, setSearchTerm] = useState('') - const [editingProject, setEditingProject] = useState(null) - const [showCreateForm, setShowCreateForm] = useState(false) - const [formData, setFormData] = useState({ - name: '', - local_directory: '', - product_name: '', - product_image: '' - }) - - useEffect(() => { - loadProjects() - }, []) - - const loadProjects = async () => { - try { - setLoading(true) - const response = await ProjectService.getAllProjects() - console.log(`loadProjects`, response) - if (response.status && response.data) { - setProjects(response.data) - } else { - console.error('Failed to load projects:', response.msg) - } - } catch (error) { - console.error('Failed to load projects:', error) - } finally { - setLoading(false) - } - } - - const handleCreateProject = async () => { - try { - const response = await ProjectService.createProject(formData) - console.log(`handleCreateProject`, response) - if (response.status && response.data) { - setProjects([...projects, response.data]) - setShowCreateForm(false) - setFormData({ name: '', local_directory: '', product_name: '', product_image: '' }) - } else { - console.error('创建失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to create project:', error) - } - } - - const handleUpdateProject = async () => { - if (!editingProject) return - - try { - const response = await ProjectService.updateProject(editingProject.id, formData) - if (response.status && response.data) { - const updatedProjects = projects.map(proj => - proj.id === editingProject.id ? response.data! : proj - ) - setProjects(updatedProjects) - setEditingProject(null) - setFormData({ name: '', local_directory: '', product_name: '', product_image: '' }) - } else { - console.error('更新失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to update project:', error) - } - } - - const handleDeleteProject = async (projectId: string) => { - if (!confirm('确定要删除这个项目吗?')) return - - try { - const response = await ProjectService.deleteProject(projectId) - if (response.status) { - setProjects(projects.filter(proj => proj.id !== projectId)) - } else { - console.error('删除失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to delete project:', error) - } - } - - const handleOpenDirectory = async (projectId: string) => { - try { - const response = await ProjectService.openProjectDirectory(projectId) - if (!response.status) { - console.error('打开目录失败:', response.msg || '未知错误') - } - } catch (error) { - console.error('Failed to open directory:', error) - } - } - - const selectDirectory = async () => { - try { - const directory = await open({ - directory: true, - multiple: false, - title: '选择项目目录' - }) - - if (directory && typeof directory === 'string') { - setFormData({ ...formData, local_directory: directory }) - } - } catch (error) { - console.error('Failed to select directory:', error) - } - } - - const selectImage = async () => { - try { - const imagePath = await open({ - multiple: false, - title: '选择商品图片', - filters: [ - { - name: '图片文件', - extensions: ['png', 'jpg', 'jpeg', 'gif', 'bmp', 'webp', 'svg'] - } - ] - }) - - if (imagePath && typeof imagePath === 'string') { - setFormData({ ...formData, product_image: imagePath }) - } - } catch (error) { - console.error('Failed to select image:', error) - } - } - - const startEdit = (project: Project) => { - setEditingProject(project) - setFormData({ - name: project.name, - local_directory: project.local_directory, - product_name: project.product_name, - product_image: project.product_image - }) - setShowCreateForm(false) - } - - const cancelEdit = () => { - setEditingProject(null) - setShowCreateForm(false) - setFormData({ name: '', local_directory: '', product_name: '', product_image: '' }) - } - - const filteredProjects = projects.filter(project => - project.name.toLowerCase().includes(searchTerm.toLowerCase()) || - project.product_name.toLowerCase().includes(searchTerm.toLowerCase()) - ) - - if (loading) { - return ( -
-
加载中...
-
- ) - } - - return ( -
- {/* 页面标题 */} -
-

项目管理

-

管理项目信息,包括项目目录、商品信息等

-
- - {/* 搜索和创建按钮 */} -
-
- - 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" - /> -
- - -
- - {/* 项目列表 */} -
- {filteredProjects.map((project) => ( -
- {/* 商品图片 */} -
- -
- -
- {/* 项目标题 */} -
-

{project.name}

- -
- - - -
-
- - {/* 项目信息 */} -
- {/* 商品信息 */} - {project.product_name && ( -
-

商品名:

-

{project.product_name}

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

- {editingProject ? '编辑项目' : '新建项目'} -

- -
- - {/* 表单内容 */} -
- {/* 项目名 */} -
- - setFormData({ ...formData, name: 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" - /> -
- - {/* 本地目录 */} -
- -
- setFormData({ ...formData, local_directory: e.target.value })} - placeholder="请选择项目目录路径" - className="flex-1 px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent" - readOnly - /> - -
-
- - {/* 商品名 */} -
- - setFormData({ ...formData, product_name: 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" - /> -
- - {/* 商品图片 */} -
- -
- setFormData({ ...formData, product_image: e.target.value })} - placeholder="请选择商品图片文件" - className="flex-1 px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent" - readOnly - /> - -
- {/* 图片预览 */} - {formData.product_image && ( -
-

预览:

-
- -
-
- )} -
-
- - {/* 表单按钮 */} -
- - -
-
-
- )} -
- ) -} - -export default ProjectManagePage