专案优化
This commit is contained in:
@@ -11,8 +11,7 @@ import {
|
|||||||
message,
|
message,
|
||||||
Select,
|
Select,
|
||||||
DatePicker,
|
DatePicker,
|
||||||
Typography,
|
Typography
|
||||||
Spin
|
|
||||||
} from 'antd';
|
} from 'antd';
|
||||||
import {
|
import {
|
||||||
ArrowLeftOutlined,
|
ArrowLeftOutlined,
|
||||||
@@ -259,7 +258,6 @@ export default function ProjectDetail() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="bg-gradient-to-b from-gray-50 to-white dark:from-gray-800 dark:to-gray-900/90 min-h-screen p-2">
|
<div className="bg-gradient-to-b from-gray-50 to-white dark:from-gray-800 dark:to-gray-900/90 min-h-screen p-2">
|
||||||
<Spin spinning={loading}>
|
|
||||||
<Card
|
<Card
|
||||||
className="shadow-lg rounded-lg border-0"
|
className="shadow-lg rounded-lg border-0"
|
||||||
title={
|
title={
|
||||||
@@ -431,7 +429,6 @@ export default function ProjectDetail() {
|
|||||||
|
|
||||||
</Form>
|
</Form>
|
||||||
</Card>
|
</Card>
|
||||||
</Spin>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,10 +1,11 @@
|
|||||||
import React, { useEffect, useState } from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import { Card, Table, Button, message, Popconfirm, Tag, Space, Select } from 'antd';
|
import { Card, Table, Button, message, Popconfirm, Tag, Space, Select, Tooltip } from 'antd';
|
||||||
import { PlusOutlined, EditOutlined, DeleteOutlined, EyeOutlined } from '@ant-design/icons';
|
import { PlusOutlined, EditOutlined, DeleteOutlined, EyeOutlined, ShareAltOutlined } from '@ant-design/icons';
|
||||||
import { useResources } from "@/hooks/resource/useResource";
|
import { useResources } from "@/hooks/resource/useResource";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import { supabase } from "@/config/supabase";
|
import { supabase } from "@/config/supabase";
|
||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
|
import { useCopyToClipboard } from 'react-use';
|
||||||
|
|
||||||
const ProjectPage = () => {
|
const ProjectPage = () => {
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
@@ -19,6 +20,7 @@ const ProjectPage = () => {
|
|||||||
const [tasks, setTasks] = useState([]);
|
const [tasks, setTasks] = useState([]);
|
||||||
const [loadingTasks, setLoadingTasks] = useState(false);
|
const [loadingTasks, setLoadingTasks] = useState(false);
|
||||||
const [selectedTask, setSelectedTask] = useState(null);
|
const [selectedTask, setSelectedTask] = useState(null);
|
||||||
|
const [state, copyToClipboard] = useCopyToClipboard();
|
||||||
|
|
||||||
const {
|
const {
|
||||||
resources: projects,
|
resources: projects,
|
||||||
@@ -164,7 +166,8 @@ const ProjectPage = () => {
|
|||||||
title: "操作",
|
title: "操作",
|
||||||
key: "action",
|
key: "action",
|
||||||
fixed: "right",
|
fixed: "right",
|
||||||
render: (_, record) => (
|
render: (_, record) => {
|
||||||
|
return (
|
||||||
<Space size={0} className="dark:text-gray-300">
|
<Space size={0} className="dark:text-gray-300">
|
||||||
<Button
|
<Button
|
||||||
size="small"
|
size="small"
|
||||||
@@ -175,6 +178,25 @@ const ProjectPage = () => {
|
|||||||
>
|
>
|
||||||
查看
|
查看
|
||||||
</Button>
|
</Button>
|
||||||
|
<Tooltip title="复制查看链接">
|
||||||
|
<Button
|
||||||
|
size="small"
|
||||||
|
type="link"
|
||||||
|
icon={<ShareAltOutlined />}
|
||||||
|
onClick={() => {
|
||||||
|
const viewUrl = `${window.location.origin}/company/projectView/${record.id}`;
|
||||||
|
copyToClipboard(viewUrl);
|
||||||
|
if (!state.error) {
|
||||||
|
message.success('链接已复制到剪贴板');
|
||||||
|
} else {
|
||||||
|
message.error('复制失败,请手动复制');
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
className="dark:text-gray-300 dark:hover:text-blue-400"
|
||||||
|
>
|
||||||
|
分享
|
||||||
|
</Button>
|
||||||
|
</Tooltip>
|
||||||
<Button
|
<Button
|
||||||
size="small"
|
size="small"
|
||||||
type="link"
|
type="link"
|
||||||
@@ -203,7 +225,8 @@ const ProjectPage = () => {
|
|||||||
</Button>
|
</Button>
|
||||||
</Popconfirm>
|
</Popconfirm>
|
||||||
</Space>
|
</Space>
|
||||||
),
|
);
|
||||||
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from 'react';
|
||||||
import { useParams } from 'react-router-dom';
|
import { useParams, useNavigate } from 'react-router-dom';
|
||||||
import { supabase } from "@/config/supabase";
|
import { supabase } from "@/config/supabase";
|
||||||
import { Spin, Tag, Empty, Button, Modal, Form, Input, Collapse, message, Upload,Tabs, Select, Divider } from 'antd';
|
import { Spin, Tag, Empty, Button, Modal, Form, Input, Collapse, message, Upload,Tabs, Select, Divider } from 'antd';
|
||||||
import { PlusOutlined, FolderOpenOutlined, ClockCircleOutlined, InboxOutlined } from '@ant-design/icons';
|
import { PlusOutlined, FolderOpenOutlined, ClockCircleOutlined, InboxOutlined } from '@ant-design/icons';
|
||||||
@@ -8,6 +8,7 @@ import {supabaseService}from '@/hooks/supabaseService'
|
|||||||
const type="project"
|
const type="project"
|
||||||
export default function ProjectInfo() {
|
export default function ProjectInfo() {
|
||||||
const { id } = useParams();
|
const { id } = useParams();
|
||||||
|
const navigate = useNavigate();
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
const [projectData, setProjectData] = useState(null);
|
const [projectData, setProjectData] = useState(null);
|
||||||
const [form] = Form.useForm();
|
const [form] = Form.useForm();
|
||||||
@@ -496,7 +497,10 @@ export default function ProjectInfo() {
|
|||||||
<Input.TextArea rows={4} placeholder="请输入资源描述" />
|
<Input.TextArea rows={4} placeholder="请输入资源描述" />
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
|
|
||||||
<Form.Item className="mb-0 flex justify-end gap-3">
|
<Form.Item >
|
||||||
|
<div className="mb-0 flex justify-end w-full gap-3">
|
||||||
|
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setIsModalVisible(false);
|
setIsModalVisible(false);
|
||||||
@@ -508,23 +512,42 @@ export default function ProjectInfo() {
|
|||||||
<Button type="primary" htmlType="submit">
|
<Button type="primary" htmlType="submit">
|
||||||
确定
|
确定
|
||||||
</Button>
|
</Button>
|
||||||
|
</div>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Form>
|
</Form>
|
||||||
</Modal>
|
</Modal>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// 加载状态展示
|
||||||
if (loading) {
|
if (loading) {
|
||||||
return (
|
return (
|
||||||
<div className="flex items-center justify-center min-h-screen">
|
<div className="min-h-screen bg-gray-50/40 flex items-center justify-center">
|
||||||
<Spin tip="加载中..." />
|
<div className="text-center">
|
||||||
|
<Spin size="large" />
|
||||||
|
<div className="mt-4 text-gray-500">加载项目信息中...</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!projectData) {
|
// 无项目数据状态(包括无 ID 和未找到项目)
|
||||||
|
if (!projectData || !id) {
|
||||||
return (
|
return (
|
||||||
<div className="flex items-center justify-center min-h-screen">
|
<div className="min-h-screen bg-gray-50/40 flex items-center justify-center">
|
||||||
<Empty description="未找到项目信息" />
|
<Empty
|
||||||
|
description={
|
||||||
|
<div className="text-gray-500">
|
||||||
|
<p className="mb-4">未找到项目信息</p>
|
||||||
|
<Button
|
||||||
|
onClick={() => navigate(-1)}
|
||||||
|
className="bg-blue-50 text-blue-600 hover:bg-blue-100 border-none
|
||||||
|
transition-colors duration-200"
|
||||||
|
>
|
||||||
|
返回上一页
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user