diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index fdd5663..713ccee 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -92,6 +92,9 @@ importers:
       uuid:
         specifier: ^11.0.3
         version: 11.0.3
+      zod:
+        specifier: ^3.24.1
+        version: 3.24.1
     devDependencies:
       '@types/react':
         specifier: ^18.2.15
diff --git a/src/components/ProjectList/index.jsx b/src/components/ProjectList/index.jsx
new file mode 100644
index 0000000..0d07330
--- /dev/null
+++ b/src/components/ProjectList/index.jsx
@@ -0,0 +1,615 @@
+import React, { useState, useEffect } from 'react';
+import {
+  Form,
+  Input,
+  Button,
+  Card,
+  Typography,
+  Modal,
+  message,
+  Select,
+  Divider,
+  Upload,
+} from 'antd';
+import {
+  PlusOutlined,
+  DeleteOutlined,
+  EditOutlined,
+  CheckOutlined,
+  CloseOutlined,
+  InboxOutlined,
+  UploadOutlined,
+} from '@ant-design/icons';
+import { v4 as uuidv4 } from 'uuid';
+import { supabase } from "@/config/supabase";
+import { supabaseService } from "@/hooks/supabaseService";
+
+const { Text } = Typography;
+
+const ProjectResourceList = ({ form, isView, formValues, type = "project" }) => {
+  const [editingSectionIndex, setEditingSectionIndex] = useState(null);
+  const [editingSectionName, setEditingSectionName] = useState("");
+  const [templateModalVisible, setTemplateModalVisible] = useState(false);
+  const [availableSections, setAvailableSections] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [resourceTypes, setResourceTypes] = useState([]);
+  const [loadingResourceTypes, setLoadingResourceTypes] = useState(false);
+  const [units, setUnits] = useState([]);
+  const [loadingUnits, setLoadingUnits] = useState(false);
+  const [uploadModalVisible, setUploadModalVisible] = useState(false);
+  const [currentAddItem, setCurrentAddItem] = useState(null);
+
+  const fetchAvailableSections = async () => {
+    try {
+      setLoading(true);
+      const { data: sections, error } = await supabase
+        .from("resources")
+        .select("*")
+        .eq("type", "sections")
+        .eq("attributes->>template_type", type)
+        .order("created_at", { ascending: false });
+
+      if (error) throw error;
+      setAvailableSections(sections || []);
+    } catch (error) {
+      message.error("获取资源模板失败");
+      console.error(error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const fetchResourceTypes = async () => {
+    setLoadingResourceTypes(true);
+    try {
+      const { data: types } = await supabaseService.select("resources", {
+        filter: {
+          type: { eq: "resource_types" },
+          "attributes->>template_type": { in: `(${type})` },
+        },
+        order: {
+          column: "created_at",
+          ascending: false,
+        },
+      });
+      setResourceTypes(types || []);
+    } catch (error) {
+      console.error('获取资源类型失败:', error);
+    } finally {
+      setLoadingResourceTypes(false);
+    }
+  };
+
+  const handleSectionNameEdit = (sectionIndex, initialValue) => {
+    setEditingSectionIndex(sectionIndex);
+    setEditingSectionName(initialValue || "");
+  };
+
+  const handleSectionNameSave = () => {
+    if (!editingSectionName.trim()) {
+      message.error("请输入名称");
+      return;
+    }
+
+    const sections = form.getFieldValue("sections");
+    const newSections = [...sections];
+    newSections[editingSectionIndex] = {
+      ...newSections[editingSectionIndex],
+      sectionName: editingSectionName.trim(),
+    };
+    form.setFieldValue("sections", newSections);
+    setEditingSectionIndex(null);
+    setEditingSectionName("");
+  };
+  const handleAddUnit = async (unitName) => {
+    try {
+      const { error } = await supabase.from("resources").insert([
+        {
+          type: "units",
+          attributes: {
+            name: unitName,
+            template_type: type,
+          },
+          schema_version: 1,
+        },
+      ]);
+
+      if (error) throw error;
+      message.success("新增资源类型成功");
+      fetchUnits();
+      return true;
+    } catch (error) {
+      message.error("新增资源类型失败");
+      console.error(error);
+      return false;
+    }
+  };
+
+  const handleUseTemplate = (template, add) => {
+    const newSection = {
+      key: uuidv4(),
+      sectionName: template.attributes.name,
+      items: (template.attributes.items || []).map((item) => ({
+        key: uuidv4(),
+        title: item.title || "",
+        unit: item.unit || "",
+        url: item.url || "",
+        description: item.description || "",
+      })),
+    };
+    add(newSection);
+    setTemplateModalVisible(false);
+    message.success("套用模版成功");
+  };
+
+  const handleCreateCustom = (add, fieldsLength) => {
+    add({
+      key: uuidv4(),
+      sectionName: `资源分组 ${fieldsLength + 1}`,
+      items: [
+        {
+          key: uuidv4(),
+          title: "",
+          unit: "",
+          url: "",
+          description: "",
+        },
+      ],
+    });
+    setTemplateModalVisible(false);
+  };
+
+  const handleAddItem = (addItem) => {
+    addItem({
+      key: uuidv4(),
+      title: "",
+      unit: "",
+      url: "",
+      description: "",
+    });
+  };
+
+  const handleFileUpload = async (file, addItem) => {
+    try {
+      const fileExt = file.name.split('.').pop();
+      const fileName = `${Date.now()}.${fileExt}`;
+      const filePath = `${type}/${fileName}`;
+
+      const { data, error } = await supabase.storage
+        .from('file')
+        .upload(filePath, file);
+
+      if (error) throw error;
+
+      const { data: { publicUrl } } = supabase.storage
+        .from('file')
+        .getPublicUrl(filePath);
+
+      let fileType = '';
+      if (file.type.startsWith('image/')) {
+        fileType = '图片';
+      } else if (file.type.startsWith('video/')) {
+        fileType = '视频';
+      } else if (file.type.includes('pdf')) {
+        fileType = 'PDF文档';
+      } else {
+        fileType = '其他文件';
+      }
+
+      addItem({
+        key: uuidv4(),
+        url: publicUrl,
+        title: `${fileType}-${file.name}`,
+        unit: fileType,
+        description: '',
+      });
+
+      return true;
+    } catch (error) {
+      message.error('文件上传失败');
+      console.error(error);
+      return false;
+    }
+  };
+
+  const handleButtonClick = (addItem) => {
+    setCurrentAddItem(addItem);
+    setUploadModalVisible(true);
+  };
+
+  const renderUploadModal = () => (
+    <Modal
+      title="上传资源文件"
+      open={uploadModalVisible}
+      onCancel={() => setUploadModalVisible(false)}
+      footer={null}
+    >
+      <Upload.Dragger
+        multiple
+        customRequest={async ({ file, onSuccess, onError }) => {
+          try {
+            const result = await handleFileUpload(file, currentAddItem);
+            if (result) {
+              onSuccess();
+            } else {
+              onError();
+            }
+          } catch (err) {
+            onError();
+          }
+        }}
+        onChange={(info) => {
+          if (info.file.status === 'done') {
+            message.success(`${info.file.name} 上传成功`);
+          } else if (info.file.status === 'error') {
+            message.error(`${info.file.name} 上传失败`);
+          }
+        }}
+      >
+        <p className="ant-upload-drag-icon">
+          <InboxOutlined />
+        </p>
+        <p className="ant-upload-text">点击或拖拽文件到此区域上传</p>
+        <p className="ant-upload-hint">支持单个或批量上传</p>
+      </Upload.Dragger>
+    </Modal>
+  );
+
+  const fetchUnits = async () => {
+    setLoadingUnits(true);
+    try {
+      const { data: units } = await supabaseService.select("resources", {
+        filter: {
+          type: { eq: "units" },
+          "attributes->>template_type": { in: `(${type})` },
+        },
+        order: {
+          column: "created_at",
+          ascending: false,
+        },
+      });
+      setUnits(units || []);
+    } catch (error) {
+      message.error("获取状态列表失败");
+      console.error(error);
+    } finally {
+      setLoadingUnits(false);
+    }
+  };
+useEffect(()=>{
+    fetchUnits()
+},[])
+
+const addSectionFn = async (field) => {
+  try {
+    const sections = form.getFieldValue("sections");
+    const currentSection = sections[field.name];
+
+    const { error } = await supabase.from("resources").insert([
+      {
+        type: "sections",
+        attributes: {
+          name: currentSection.sectionName,
+          template_type: type,
+          items: currentSection.items.map(item => ({
+            title: item.title,
+            unit: item.unit,
+            url: item.url,
+            description: item.description
+          }))
+        },
+        schema_version: 1
+      }
+    ]);
+
+    if (error) throw error;
+    message.success("保存模板成功");
+    // 刷新可用模板列表
+    fetchAvailableSections();
+  } catch (error) {
+    message.error("保存模板失败");
+    console.error(error);
+  }
+};
+
+  return (
+    <>
+      <Form.List name="sections">
+        {(fields, { add, remove }) => (
+          <>
+            <div className="space-y-4 overflow-auto">
+              {fields.map((field, sectionIndex) => (
+                <Card
+                  key={field.key}
+                  className="shadow-sm rounded-lg min-w-[1200px]"
+                  type="inner"
+                  title={
+                    <div className="flex items-center justify-between">
+                      <div className="flex items-center gap-2">
+                        {editingSectionIndex === sectionIndex ? (
+                          <div className="flex items-center gap-2">
+                            <Input
+                              value={editingSectionName}
+                              onChange={(e) => setEditingSectionName(e.target.value)}
+                              onPressEnter={handleSectionNameSave}
+                              autoFocus
+                              className="w-48"
+                            />
+                            <Button
+                              type="link"
+                              icon={<CheckOutlined />}
+                              onClick={handleSectionNameSave}
+                              className="text-green-500"
+                            />
+                            <Button
+                              type="link"
+                              icon={<CloseOutlined />}
+                              onClick={() => {
+                                setEditingSectionIndex(null);
+                                setEditingSectionName("");
+                              }}
+                              className="text-red-500"
+                            />
+                          </div>
+                        ) : (
+                          <div className="flex items-center gap-2">
+                            <span className="w-1 h-4 bg-purple-500 rounded-full" />
+                            <Text strong className="text-lg">
+                              {form.getFieldValue([
+                                "sections",
+                                sectionIndex,
+                                "sectionName",
+                              ]) || `资源分组 ${sectionIndex + 1}`}
+                            </Text>
+                            {!isView && (
+                              <Button
+                                type="link"
+                                icon={<EditOutlined />}
+                                onClick={() =>
+                                  handleSectionNameEdit(
+                                    sectionIndex,
+                                    form.getFieldValue([
+                                      "sections",
+                                      sectionIndex,
+                                      "sectionName",
+                                    ])
+                                  )
+                                }
+                                className="text-gray-400 hover:text-blue-500"
+                              />
+                            )}
+                          </div>
+                        )}
+                      </div>
+                      {!isView && (
+                        <div className="flex gap-3">
+                          <Button
+                            type="text"
+                            icon={<PlusOutlined />}
+                            onClick={() => addSectionFn(field)}
+                            className="ml-2"
+                          >
+                            添加到模版
+                          </Button>
+                          <Button
+                            type="text"
+                            danger
+                            icon={<DeleteOutlined />}
+                            onClick={() => remove(field.name)}
+                          />
+                        </div>
+                      )}
+                    </div>
+                  }
+                >
+                  <Form.List name={[field.name, "items"]}>
+                    {(itemFields, { add: addItem, remove: removeItem }) => (
+                      <>
+                        <div className="grid grid-cols-[2fr_1fr_2fr_2fr_1fr] gap-4 mb-2 text-gray-500 px-2">
+                          <div>资源链接</div>
+                          <div>资源标题</div>
+                          <div>资源类型</div>
+                          <div>资源描述</div>
+                          <div className="text-center">操作</div>
+                        </div>
+
+                        {itemFields.map((itemField) => {
+                          const { key, ...restItemField } = itemField;
+                          return (
+                            <div
+                              key={key}
+                              className="grid grid-cols-[2fr_1fr_2fr_2fr_1fr] gap-4 mb-4 items-start"
+                            >
+                             <Form.Item
+                                {...restItemField}
+                                name={[itemField.name, "url"]}
+                                rules={[{ required: true, message: '请输入资源链接' }]}
+                                className="!mb-0"
+                              >
+                                <Input placeholder="资源链接" disabled={isView} />
+                              </Form.Item>
+                              <Form.Item
+                                {...restItemField}
+                                name={[itemField.name, "title"]}
+                                rules={[{ required: true, message: '请输入资源标题' }]}
+                                className="!mb-0"
+                              >
+                                <Input placeholder="资源标题" disabled={isView} />
+                              </Form.Item>
+
+                              {/* 资源类型 */}
+                              <Form.Item
+                                {...restItemField}
+                                name={[itemField.name, "unit"]}
+                                className="!mb-0"
+                              >
+                               <Select
+                                  placeholder="资源类型"
+                                  loading={loadingUnits}
+                                  showSearch
+                                  allowClear
+                                  style={{ minWidth: "120px" }}
+                                  options={units.map((unit) => ({
+                                    label: unit.attributes.name,
+                                    value: unit.attributes.name,
+                                  }))}
+                                //   onDropdownVisibleChange={(open) => {
+                                //     if (open) fetchUnits();
+                                //   }}
+                                  dropdownRender={(menu) => (
+                                    <>
+                                      {menu}
+                                      <Divider style={{ margin: "12px 0" }} />
+                                      <div style={{ padding: "4px" }}>
+                                        <Input.Search
+                                          placeholder="输入新类型"
+                                          enterButton={<PlusOutlined />}
+                                          onSearch={async (value) => {
+                                            if (!value.trim()) return;
+                                            if (
+                                              await handleAddUnit(value.trim())
+                                            ) {
+                                              const currentItems =
+                                                form.getFieldValue([
+                                                  "sections",
+                                                  field.name,
+                                                  "items",
+                                                ]);
+                                              currentItems[
+                                                itemField.name
+                                              ].unit = value.trim();
+                                              form.setFieldValue(
+                                                [
+                                                  "sections",
+                                                  field.name,
+                                                  "items",
+                                                ],
+                                                currentItems
+                                              );
+                                            }
+                                          }}
+                                        />
+                                      </div>
+                                    </>
+                                  )}
+                                />
+                              </Form.Item>
+
+                           
+
+                              {/* 资源描述 */}
+                              <Form.Item
+                                {...restItemField}
+                                name={[itemField.name, "description"]}
+                                className="!mb-0"
+                              >
+                                <Input placeholder="资源描述" disabled={isView} />
+                              </Form.Item>
+
+                              {!isView && itemFields.length > 1 && (
+                                <Button
+                                  type="text"
+                                  danger
+                                  icon={<DeleteOutlined />}
+                                  onClick={() => removeItem(itemField.name)}
+                                  className="flex items-center justify-center"
+                                />
+                              )}
+                            </div>
+                          );
+                        })}
+
+                        {!isView && (
+                          <div className="flex gap-2">
+                            <Button
+                              type="dashed"
+                              onClick={() => handleAddItem(addItem)}
+                              icon={<PlusOutlined />}
+                              className="w-full hover:border-blue-400 hover:text-blue-500"
+                            >
+                              手动添加资源
+                            </Button>
+                            <Button
+                              type="dashed"
+                              onClick={() => {
+                                setCurrentAddItem(() => addItem);
+                                setUploadModalVisible(true);
+                              }}
+                              icon={<UploadOutlined />}
+                              className="w-full hover:border-blue-400 hover:text-blue-500"
+                            >
+                              上传文件
+                            </Button>
+                          </div>
+                        )}
+                      </>
+                    )}
+                  </Form.List>
+                </Card>
+              ))}
+            </div>
+
+            {/* 添加资源分组按钮 */}
+            <div className="flex items-center justify-center mt-6 flex-col">
+              {!isView && (
+                <div className="w-full flex justify-center">
+                  <Button
+                    type="dashed"
+                    onClick={() => {
+                      setTemplateModalVisible(true);
+                      fetchAvailableSections();
+                    }}
+                    icon={<PlusOutlined />}
+                    className="w-1/3 border-2 hover:border-blue-400 hover:text-blue-500"
+                  >
+                    新建资源分组
+                  </Button>
+                </div>
+              )}
+            </div>
+
+            {/* 模板选择弹窗 */}
+            <Modal
+              title={<h3 className="text-lg font-medium">选择模版</h3>}
+              open={templateModalVisible}
+              onCancel={() => setTemplateModalVisible(false)}
+              footer={null}
+              width={800}
+              closeIcon={<CloseOutlined className="text-gray-500" />}
+            >
+              <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+                {availableSections.map((section) => (
+                  <Card
+                    key={section.id}
+                    hoverable
+                    onClick={() => handleUseTemplate(section, add)}
+                    className="cursor-pointer"
+                  >
+                    <Card.Meta
+                      title={section.attributes.name}
+                      description={`${section.attributes.items?.length || 0} 个资源`}
+                    />
+                  </Card>
+                ))}
+                <Card
+                  hoverable
+                  onClick={() => handleCreateCustom(add, fields.length)}
+                  className="cursor-pointer"
+                >
+                  <div className="flex items-center justify-center h-full">
+                    <PlusOutlined className="text-2xl" />
+                    <span className="ml-2">创建自定义分组</span>
+                  </div>
+                </Card>
+              </div>
+            </Modal>
+
+            {renderUploadModal()}
+          </>
+        )}
+      </Form.List>
+    </>
+  );
+};
+
+export default ProjectResourceList;
\ No newline at end of file
diff --git a/src/hooks/resource/useResource.js b/src/hooks/resource/useResource.js
index 6716d7d..5ba1c5e 100644
--- a/src/hooks/resource/useResource.js
+++ b/src/hooks/resource/useResource.js
@@ -24,14 +24,16 @@ export const useResources = (initialPagination, initialSorter, type) => {
 
         setCurrentPagination(newPagination);
         setCurrentSorter(newSorter);
-
+        console.log(params.searchQuery,'params.searchQuery');
+        
         const { data, total: newTotal } = await resourceService.getResources({
           page: newPagination.current,
           pageSize: newPagination.pageSize,
           orderBy: newSorter.field,
           ascending: newSorter.order === "ascend",
           type: type,
-          ...(params?.search !== "" ? { searchQuery: params.search } : {}),
+          ...(params?.search ? { searchQuery: params.search } : {}),
+          ...(params?.searchQuery  ? {searchQuery:params.searchQuery} : {}),
         });
 
         setResources(data || []);
diff --git a/src/pages/company/project/detail/index.jsx b/src/pages/company/project/detail/index.jsx
index e629f6a..ce35943 100644
--- a/src/pages/company/project/detail/index.jsx
+++ b/src/pages/company/project/detail/index.jsx
@@ -1,7 +1,437 @@
-import React from 'react'
+import React, { useState, useEffect } from 'react';
+import { useParams, useSearchParams, useNavigate } from 'react-router-dom';
+import { supabase } from "@/config/supabase";
+import { supabaseService } from "@/hooks/supabaseService";
+import { 
+  Card,
+  Form, 
+  Input, 
+  Button, 
+  Space, 
+  message, 
+  Select,
+  DatePicker,
+  Typography,
+  Spin
+} from 'antd';
+import {
+  ArrowLeftOutlined,
+  SaveOutlined
+} from '@ant-design/icons';
+import dayjs from 'dayjs';
+import { v4 as uuidv4 } from 'uuid';
+import ProjectResourceList from '@/components/ProjectList';
+const { Title } = Typography;
+const { TextArea } = Input;
+const TYPE = 'project';
 
 export default function ProjectDetail() {
+  const { id } = useParams();
+  const [searchParams] = useSearchParams();
+  const isEdit = searchParams.get("edit") === "true";
+  const templateId = searchParams.get("templateId");
+  const isView = id && !isEdit;
+  const [form] = Form.useForm();
+  const navigate = useNavigate();
+  const [loading, setLoading] = useState(false);
+  const [customers, setCustomers] = useState([]);
+  const [formValues, setFormValues] = useState({});
+ 
+  const [tasks, setTasks] = useState([]);
+  const [loadingTasks, setLoadingTasks] = useState(false);
+
+  const initialValues = {
+    sections: [
+      {
+        uniqueId: uuidv4(),
+        sectionName: "资源分组 1",
+        items: [
+          {
+            uniqueId: uuidv4(),
+            title: "",
+            unit: "",
+            url: "",
+            description: "",
+          },
+        ],
+      },
+    ],
+    timeRange: null,
+    relatedTasks: [],
+  };
+
+
+  const fetchProjectDetail = async () => {
+    try {
+      setLoading(true);
+      const { data, error } = await supabase
+        .from("resources")
+        .select("*")
+        .eq("id", id)
+        .single();
+
+      if (error) throw error;
+
+      if (data?.attributes) {
+        const formData = {
+          projectName: data.attributes.projectName,
+          customers: data.attributes.customers.map((customer) => customer.id) || [],
+          description: data.attributes.description,
+          sections: data.attributes.sections.map((section) => ({
+            uniqueId: uuidv4(),
+            sectionName: section.sectionName,
+            items: section.items.map((item) => ({
+              uniqueId: uuidv4(),
+              title: item.title,
+              unit: item.unit,
+              url: item.url,
+              description: item.description || "",
+            })),
+          })),
+          timeRange: data.attributes.startDate && data.attributes.endDate 
+            ? [dayjs(data.attributes.startDate), dayjs(data.attributes.endDate)]
+            : null,
+          relatedTasks: data.attributes.relatedTasks?.map(task => task.id) || [],
+        };
+
+        form.setFieldsValue(formData);
+        setFormValues(formData);
+      }
+    } catch (error) {
+      console.error("获取项目详情失败:", error);
+      message.error("获取项目详情失败");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const fetchTemplateData = async () => {
+    try {
+      setLoading(true);
+      const { data: template, error } = await supabase
+        .from("resources")
+        .select("*")
+        .eq("type", "projectTemplate")
+        .eq("id", templateId)
+        .single();
+
+      if (error) throw error;
+
+      if (template?.attributes) {
+        const projectData = {
+          projectName: template.attributes.templateName,
+          description: template.attributes.description,
+          sections: template.attributes.sections.map((section) => ({
+            uniqueId: uuidv4(),
+            sectionName: section.sectionName,
+            items: section.items.map((item) => ({
+              uniqueId: uuidv4(),
+              title: item.title,
+              unit: item.unit,
+              url: item.url,
+              description: item.description,
+            })),
+          })),
+        };
+        form.setFieldsValue(projectData);
+        setFormValues(projectData);
+      }
+    } catch (error) {
+      console.error("获取模板数据失败:", error);
+      message.error("获取模板数据失败");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const fetchCustomers = async () => {
+    try {
+      const { data, error } = await supabase
+        .from("resources")
+        .select("*")
+        .eq("type", "customer");
+
+      if (error) throw error;
+      setCustomers(data || []);
+    } catch (error) {
+      console.error("获取客户列表失败:", error);
+    }
+  };
+
+  const fetchTasks = async () => {
+    setLoadingTasks(true);
+    try {
+      const { data, error } = await supabase
+        .from("resources")
+        .select("*")
+        .eq("type", "task")
+        .order("created_at", { ascending: false });
+
+      if (error) throw error;
+      setTasks(data || []);
+    } catch (error) {
+      console.error("获取任务列表失败:", error);
+      message.error("获取任务列表失败");
+    } finally {
+      setLoadingTasks(false);
+    }
+  };
+
+  const handleValuesChange = (changedValues, allValues) => {
+    setFormValues(allValues);
+  };
+
+  const onFinish = async (values) => {
+    try {
+      setLoading(true);
+      const projectData = {
+        type: "project",
+        attributes: {
+          projectName: values.projectName,
+          customers: customers
+            .filter(customer => values.customers.includes(customer.id))
+            .map(customer => ({
+              id: customer.id,
+              name: customer.attributes.name
+            })),
+          description: values.description,
+          sections: values.sections.map((section) => ({
+            sectionName: section.sectionName,
+            items: section.items.map((item) => ({
+              title: item.title,
+              unit: item.unit,
+              url: item.url,
+              description: item.description,
+            })),
+          })),
+          startDate: values.timeRange ? values.timeRange[0].format('YYYY-MM-DD') : null,
+          endDate: values.timeRange ? values.timeRange[1].format('YYYY-MM-DD') : null,
+          relatedTasks: tasks
+            .filter(task => values.relatedTasks?.includes(task.id))
+            .map(task => ({
+              id: task.id,
+              name: task.attributes.taskName
+            })),
+        },
+      };
+
+      let result;
+      if (id) {
+        result = await supabase
+          .from("resources")
+          .update(projectData)
+          .eq("id", id)
+          .select();
+      } else {
+        result = await supabase
+          .from("resources")
+          .insert([projectData])
+          .select();
+      }
+
+      if (result.error) throw result.error;
+
+      message.success("保存成功");
+      navigate("/company/project");
+    } catch (error) {
+      console.error("保存失败:", error);
+      message.error("保存失败");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchCustomers();
+    fetchTasks();
+  }, []);
+
+  useEffect(() => {
+    if (id) {
+      fetchProjectDetail();
+    } else if (templateId) {
+      fetchTemplateData();
+    } else {
+      form.setFieldsValue(initialValues);
+      setFormValues(initialValues);
+    }
+  }, [id, templateId]);
+
   return (
-    <div>ProjectDetail</div>
-  )
+    <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
+          className="shadow-lg rounded-lg border-0"
+          title={
+            <div className="flex justify-between items-center py-2">
+              <div className="flex items-center space-x-3">
+                <Title level={4} className="mb-0 text-gray-800">
+                  {id ? (isEdit ? "编辑专案" : "查看专案") : "新建专案"}
+                </Title>
+                <span className="text-gray-400 text-sm">
+                  {id
+                    ? isEdit
+                      ? "请修改专案信息"
+                      : "专案详情"
+                    : "请填写专案信息"}
+                </span>
+              </div>
+              <Space size="middle">
+                <Button
+                  icon={<ArrowLeftOutlined />}
+                  onClick={() => navigate("/company/project")}
+                >
+                  返回
+                </Button>
+                {!isView && (
+                  <Button
+                    type="primary"
+                    icon={<SaveOutlined />}
+                    onClick={() => form.submit()}
+                    loading={loading}
+                  >
+                    保存
+                  </Button>
+                )}
+              </Space>
+            </div>
+          }
+        >
+          <Form
+            form={form}
+            onFinish={onFinish}
+            onValuesChange={handleValuesChange}
+            layout="vertical"
+            disabled={isView}
+            initialValues={initialValues}
+          >
+            <Card
+              className="shadow-sm rounded-lg"
+              type="inner"
+              title={
+                <span className="flex items-center space-x-2 text-gray-700">
+                  <span className="w-1 h-4 bg-blue-500 rounded-full" />
+                  <span>基本信息</span>
+                </span>
+              }
+              bordered={false}
+            >
+              <div className="grid grid-cols-2 gap-8">
+                <Form.Item
+                  name="projectName"
+                  label={<span className="text-gray-700 font-medium">专案名称</span>}
+                  rules={[{ required: true, message: "请输入专案名称" }]}
+                >
+                  <Input
+                    placeholder="请输入专案名称"
+                    className="hover:border-blue-400 focus:border-blue-500"
+                  />
+                </Form.Item>
+
+                <Form.Item
+                  name="customers"
+                  label={<span className="text-gray-700 font-medium">客户名称</span>}
+                >
+                  <Select
+                    mode="multiple"
+                    placeholder="请选择客户"
+                    className="hover:border-blue-400 focus:border-blue-500"
+                    showSearch
+                    optionFilterProp="children"
+                    filterOption={(input, option) =>
+                      (option?.label ?? "").toLowerCase().includes(input.toLowerCase())
+                    }
+                    options={customers.map((customer) => ({
+                      value: customer.id,
+                      label: customer.attributes.name,
+                    }))}
+                  />
+                </Form.Item>
+
+               
+
+                <Form.Item
+                  name="timeRange"
+                  label={<span className="text-gray-700 font-medium">时间范围</span>}
+                >
+                  <DatePicker.RangePicker 
+                    className="w-full  hover:border-blue-400 focus:border-blue-500"
+                    format="YYYY-MM-DD"
+                    onChange={(dates) => {
+                      if (dates) {
+                        form.setFieldValue('timeRange', [
+                          dayjs(dates[0]),
+                          dayjs(dates[1])
+                        ]);
+                      } else {
+                        form.setFieldValue('timeRange', null);
+                      }
+                    }}
+                  />
+                </Form.Item>
+                <Form.Item
+              name="relatedTasks"
+              label={<span className="text-gray-700 font-medium">关联任务</span>}
+            >
+              <Select
+                mode="multiple"
+                placeholder="请选择关联任务"
+                className="hover:border-blue-400 focus:border-blue-500"
+                loading={loadingTasks}
+                showSearch
+                optionFilterProp="children"
+                filterOption={(input, option) =>
+                  (option?.label ?? "").toLowerCase().includes(input.toLowerCase())
+                }
+                options={tasks.map((task) => ({
+                  value: task.id,
+                  label: task.attributes.taskName,
+                }))}
+              />
+            </Form.Item>
+              </div>
+
+              <Form.Item
+                name="description"
+                label={<span className="text-gray-700 font-medium">专案描述</span>}
+              >
+                <TextArea
+                  rows={4}
+                  placeholder="请输入专案描述"
+                  className="hover:border-blue-400 focus:border-blue-500"
+                />
+              </Form.Item>
+            </Card>
+
+            <Card
+              className="shadow-sm rounded-lg mt-6"
+              type="inner"
+              title={
+                <span className="flex items-center space-x-2 text-gray-700">
+                  <span className="w-1 h-4 bg-blue-500 rounded-full" />
+                  <span>专案资源</span>
+                </span>
+              }
+              bordered={false}
+            >
+              <ProjectResourceList
+                type={TYPE}
+                form={form}
+                isView={isView}
+                formValues={formValues}
+                onValuesChange={handleValuesChange}
+              />
+              {/* <TaskList     type={TYPE}
+                form={form}
+                isView={isView}
+                formValues={formValues}
+                onValuesChange={handleValuesChange} /> */}
+            </Card>
+
+           
+          </Form>
+        </Card>
+      </Spin>
+    </div>
+  );
 }
diff --git a/src/pages/company/project/index.jsx b/src/pages/company/project/index.jsx
index 8669832..074719a 100644
--- a/src/pages/company/project/index.jsx
+++ b/src/pages/company/project/index.jsx
@@ -1,41 +1,331 @@
-import React from 'react';
-import { Card, Table, Button } from 'antd';
-import { PlusOutlined } from '@ant-design/icons';
+import React, { useEffect, useState } from 'react';
+import { Card, Table, Button, message, Popconfirm, Tag, Space, Select } from 'antd';
+import { PlusOutlined, EditOutlined, DeleteOutlined, EyeOutlined } from '@ant-design/icons';
+import { useResources } from "@/hooks/resource/useResource";
+import { useNavigate } from "react-router-dom";
+import { supabase } from "@/config/supabase";
+import dayjs from 'dayjs';
 
 const ProjectPage = () => {
+  const navigate = useNavigate();
+  const [pagination, setPagination] = useState({ current: 1, pageSize: 10 });
+  const [sorter, setSorter] = useState({
+    field: "created_at",
+    order: "descend",
+  });
+  const [customers, setCustomers] = useState([]);
+  const [loadingCustomers, setLoadingCustomers] = useState(false);
+  const [selectedCustomer, setSelectedCustomer] = useState(null);
+  const [tasks, setTasks] = useState([]);
+  const [loadingTasks, setLoadingTasks] = useState(false);
+  const [selectedTask, setSelectedTask] = useState(null);
+
+  const {
+    resources: projects,
+    loading: loadingProjects,
+    total,
+    fetchResources: fetchProjects,
+    deleteResource: deleteProject,
+  } = useResources(pagination, sorter, "project");
+
+  useEffect(() => {
+    fetchProjects();
+    fetchCustomers();
+    fetchTasks();
+  }, []);
+
+  const fetchCustomers = async () => {
+    setLoadingCustomers(true);
+    try {
+      const { data, error } = await supabase
+        .from('resources')
+        .select('*')
+        .eq('type', 'customer')
+        .order('created_at', { ascending: false });
+
+      if (error) throw error;
+      setCustomers(data || []);
+    } catch (error) {
+      console.error('获取客户列表失败:', error);
+      message.error('获取客户列表失败');
+    } finally {
+      setLoadingCustomers(false);
+    }
+  };
+
+  const fetchTasks = async () => {
+    setLoadingTasks(true);
+    try {
+      const { data, error } = await supabase
+        .from('resources')
+        .select('*')
+        .eq('type', 'task')
+        .order('created_at', { ascending: false });
+
+      if (error) throw error;
+      setTasks(data || []);
+    } catch (error) {
+      console.error('获取任务列表失败:', error);
+      message.error('获取任务列表失败');
+    } finally {
+      setLoadingTasks(false);
+    }
+  };
+
   const columns = [
     {
-      title: '项目名称',
-      dataIndex: 'name',
-      key: 'name',
+      title: "专案名称",
+      dataIndex: ["attributes", "projectName"],
+      key: "projectName",
+      ellipsis: true,
+      className: "dark:text-gray-200",
     },
     {
-      title: '负责人',
-      dataIndex: 'manager',
-      key: 'manager',
+      title: "客户",
+      dataIndex: ["attributes", "customers"],
+      key: "customers",
+      render: (customers) => (
+        <Space size={4}>
+          {customers?.map(customer => (
+            <Tag 
+              key={customer.id} 
+              color="blue" 
+              className="cursor-pointer"
+            >
+              {customer.name}
+            </Tag>
+          )) || '-'}
+        </Space>
+      ),
     },
     {
-      title: '开始日期',
-      dataIndex: 'startDate',
-      key: 'startDate',
+      title: "相关任务",
+      dataIndex: ["attributes", "relatedTasks"],
+      key: "relatedTasks",
+      render: (tasks) => (
+        <Space size={4} wrap>
+          {tasks?.map(task => (
+            <Tag 
+              key={task.id} 
+              color="green" 
+              className="cursor-pointer"
+            >
+              {task.name}
+            </Tag>
+          )) || '-'}
+        </Space>
+      ),
     },
     {
-      title: '状态',
-      dataIndex: 'status',
-      key: 'status',
+      title: "项目周期",
+      key: "projectPeriod",
+      render: (_, record) => {
+        const startDate = record.attributes.startDate;
+        const endDate = record.attributes.endDate;
+        if (!startDate || !endDate) return '-';
+        
+        const start = dayjs(startDate);
+        const end = dayjs(endDate);
+        const days = end.diff(start, 'day');
+        const months = end.diff(start, 'month', true).toFixed(1);
+        
+        return (
+          <span className="dark:text-gray-300">
+              {days > 60 
+                ? `约 ${months} 个月` 
+                : `${days} 天`}
+          </span>
+        );
+      },
+    },
+    {
+      title: "开始日期",
+      dataIndex: ["attributes", "startDate"],
+      key: "startDate",
+      render: (date) => (
+        <span className="dark:text-gray-300">
+          {date || '-'}
+        </span>
+      ),
+    },
+ 
+    {
+      title: "创建时间",
+      dataIndex: "created_at",
+      key: "created_at",
+      sorter: true,
+      render: (text) => (
+        <span className="dark:text-gray-300">
+          {dayjs(text).format('YYYY-MM-DD HH:mm')}
+        </span>
+      ),
+    },
+    {
+      title: "操作",
+      key: "action",
+      fixed: "right",
+      render: (_, record) => (
+        <Space size={0} className="dark:text-gray-300">
+          <Button
+            size="small"
+            type="link"
+            icon={<EyeOutlined />}
+            onClick={() => navigate(`/company/projectView/${record.id}`)}
+            className="dark:text-gray-300 dark:hover:text-blue-400"
+          >
+            查看
+          </Button>
+          <Button
+            size="small"
+            type="link"
+            icon={<EditOutlined />}
+            onClick={() => navigate(`/company/projectInfo/${record.id}?edit=true`)}
+            className="dark:text-gray-300 dark:hover:text-blue-400"
+          >
+            编辑
+          </Button>
+          <Popconfirm
+            title="确定要删除这个专案吗？"
+            description="删除后将无法恢复！"
+            onConfirm={() => handleDelete(record.id)}
+            okText="确定"
+            cancelText="取消"
+            okButtonProps={{ danger: true }}
+          >
+            <Button 
+              size="small" 
+              type="link" 
+              danger 
+              icon={<DeleteOutlined />}
+              className="dark:hover:text-red-400"
+            >
+              删除
+            </Button>
+          </Popconfirm>
+        </Space>
+      ),
     },
   ];
 
+  const handleDelete = async (id) => {
+    try {
+      await deleteProject(id);
+      fetchProjects();
+      message.success('删除成功');
+    } catch (error) {
+      message.error("删除失败：" + error.message);
+    }
+  };
+
+  const handleTableChange = (pagination, filters, sorter) => {
+    setPagination(pagination);
+    setSorter({
+      field: sorter.field || "created_at",
+      order: sorter.order || "descend",
+    });
+    fetchProjects({
+      current: pagination.current,
+      pageSize: pagination.pageSize,
+      field: sorter.field,
+      order: sorter.order,
+      search: JSON.stringify({
+        ...(selectedCustomer && { customerId: selectedCustomer }),
+        ...(selectedTask && { taskId: selectedTask })
+      })
+    });
+  };
+
   return (
     <Card
-      title="专案管理"
+      title={
+        <Space className="dark:text-gray-200 py-4 px-2">
+          <span>专案管理</span>
+          <Tag color="blue" className="dark:border-opacity-50">
+            {total} 个专案
+          </Tag>
+        </Space>
+      }
+      className="h-full w-full overflow-auto "
       extra={
-        <Button type="primary" icon={<PlusOutlined />}>
-          新增专案
-        </Button>
+        <Space>
+          <Select
+            allowClear
+            loading={loadingCustomers}
+            placeholder="按客户筛选"
+            variant="filled"
+            style={{ width: 200 }}
+            options={customers.map(c => ({
+              label: c.attributes.name,
+              value: c.id
+            }))}
+            onChange={(value) => {
+              setSelectedCustomer(value);
+              setPagination({ current: 1, pageSize: pagination.pageSize });
+              fetchProjects({
+                current: 1,
+                pageSize: pagination.pageSize,
+                field: sorter.field,
+                order: sorter.order,
+                searchQuery: JSON.stringify({
+                  ...(value && { customerId: value }),
+                  ...(selectedTask && { taskId: selectedTask })
+                })
+              });
+            }}
+          />
+          {/* <Select
+            allowClear
+            loading={loadingTasks}
+            placeholder="按任务筛选"
+            variant="filled"
+            style={{ width: 200 }}
+            options={tasks.map(t => ({
+              label: t.attributes.taskName,
+              value: t.id
+            }))}
+            onChange={(value) => {
+
+              setSelectedTask(value);
+              setPagination({ current: 1, pageSize: pagination.pageSize });
+              fetchProjects({
+                current: 1,
+                pageSize: pagination.pageSize,
+                field: sorter.field,
+                order: sorter.order,
+                searchQuery: JSON.stringify({
+                  ...(selectedCustomer && { customerId: selectedCustomer }),
+                  ...(value && { taskId: value })
+                })
+              });
+            }}
+          /> */}
+          <Button
+            type="primary"
+            icon={<PlusOutlined />}
+            onClick={() => navigate('/company/projectInfo')}
+            className="bg-blue-600 hover:bg-blue-700 dark:bg-blue-600 dark:hover:bg-blue-700"
+          >
+            新增专案
+          </Button>
+        </Space>
       }
     >
-      <Table columns={columns} dataSource={[]} rowKey="id" />
+      <Table
+        className="w-full"
+        columns={columns}
+        dataSource={projects}
+        rowKey="id"
+        scroll={{ x: true }}
+        loading={loadingProjects}
+        onChange={handleTableChange}
+        pagination={{
+          ...pagination,
+          total,
+          showSizeChanger: true,
+          showQuickJumper: true,
+          showTotal: (total) => `共 ${total} 条记录`,
+        }}
+      />
     </Card>
   );
 };
diff --git a/src/pages/company/project/info.jsx b/src/pages/company/project/info.jsx
new file mode 100644
index 0000000..1b7f18e
--- /dev/null
+++ b/src/pages/company/project/info.jsx
@@ -0,0 +1,758 @@
+import React, { useState, useEffect } from 'react';
+import { useParams } from 'react-router-dom';
+import { supabase } from "@/config/supabase";
+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 dayjs from 'dayjs';
+import {supabaseService}from '@/hooks/supabaseService'
+const type="project"
+export default function ProjectInfo() {
+  const { id } = useParams();
+  const [loading, setLoading] = useState(true);
+  const [projectData, setProjectData] = useState(null);
+  const [form] = Form.useForm();
+  const [isModalVisible, setIsModalVisible] = useState(false);
+  const [units, setUnits] = useState([]);
+  const [loadingUnits, setLoadingUnits] = useState(false);
+  const [currentUnit, setCurrentUnit] = useState('');
+  const [relatedTasks, setRelatedTasks] = useState([]);
+  const [loadingTasks, setLoadingTasks] = useState(false);
+  const [uploadFileList, setUploadFileList] = useState([]);
+
+  const fetchProjectDetail = async () => {
+    try {
+      setLoading(true);
+      const { data, error } = await supabase
+        .from("resources")
+        .select("*")
+        .eq("id", id)
+        .single();
+
+      if (error) throw error;
+      setProjectData(data);
+    } catch (error) {
+      console.error("获取项目详情失败:", error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    if (id) {
+      fetchProjectDetail();
+    } 
+    
+  }, [id]);
+
+  const handleAddItem = async (values) => {
+    try {
+      const newItem = {
+        url: values.url,
+        unit: currentUnit,
+        title: values.title,
+        description: values.description,
+      };
+
+      const updatedSections = projectData.attributes.sections.map(section => {
+        if (section.sectionName === currentUnit) {
+          return {
+            ...section,
+            items: [...(section.items || []), newItem]
+          };
+        }
+        return section;
+      });
+
+      const { error } = await supabase
+        .from("resources")
+        .update({
+          attributes: {
+            ...projectData.attributes,
+            sections: updatedSections
+          }
+        })
+        .eq("id", id);
+
+      if (error) throw error;
+
+      setProjectData({
+        ...projectData,
+        attributes: {
+          ...projectData.attributes,
+          sections: updatedSections
+        }
+      });
+
+      message.success('添加成功');
+      setIsModalVisible(false);
+      form.resetFields();
+    } catch (error) {
+      console.error("添加资源项失败:", error);
+      message.error('添加失败');
+    }
+  };
+
+  const fetchUnits = async () => {
+    setLoadingUnits(true);
+    try {
+      const { data: units } = await supabaseService.select("resources", {
+        filter: {
+          type: { eq: "units" },
+          "attributes->>template_type": { in: `(${type})` },
+        },
+        order: {
+          column: "created_at",
+          ascending: false,
+        },
+      });
+      setUnits(units || []);
+    } catch (error) {
+      message.error("获取状态列表失败");
+      console.error(error);
+    } finally {
+      setLoadingUnits(false);
+    }
+  };
+
+  const handleAddUnit = async (unitName) => {
+    try {
+      const { error } = await supabase.from("resources").insert([
+        {
+          type: "units",
+          attributes: {
+            name: unitName,
+            template_type: "project",
+          },
+          schema_version: 1,
+        },
+      ]);
+
+      if (error) throw error;
+      message.success("新增资源类型成功");
+      fetchUnits();
+      return true;
+    } catch (error) {
+      message.error("新增资源类型失败");
+      console.error(error);
+      return false;
+    }
+  };
+
+  useEffect(() => {
+    fetchUnits();
+  }, []);
+
+  const getDomainFromUrl = (url) => {
+    try {
+      const domain = new URL(url).hostname;
+      return domain.replace('www.', '');
+    } catch (error) {
+      return url;
+    }
+  };
+
+  // 处理资源分组
+  const getResourcesByUnit = () => {
+    const resourcesByUnit = {};
+    
+    // 确保 sections 存在且是数组
+    if (projectData?.attributes?.sections && Array.isArray(projectData.attributes.sections)) {
+      projectData.attributes.sections.forEach(section => {
+        // 确保 items 存在且是数组
+        if (section.items && Array.isArray(section.items)) {
+          // 使用 sectionName 作为 unit
+          const unit = section.sectionName;
+          if (!resourcesByUnit[unit]) {
+            resourcesByUnit[unit] = [];
+          }
+          // 将该 section 的所有 items 添加到对应的 unit 中
+          resourcesByUnit[unit].push(...section.items);
+        }
+      });
+    }
+
+    return resourcesByUnit;
+  };
+
+  // 在渲染之前获取处理后的资源
+  const resourcesByUnit = getResourcesByUnit();
+
+  // 添加一个图标映射函数
+  const getResourceIcon = (url) => {
+    const domain = getDomainFromUrl(url).toLowerCase();
+    if (domain.includes('figma')) return '🎨';
+    if (domain.includes('github')) return '💻';
+    if (domain.includes('notion')) return '📝';
+    if (domain.includes('docs.google')) return '📄';
+    if (domain.includes('sheets.google')) return '📊';
+    if (domain.includes('youtube')) return '🎥';
+    if (domain.includes('drive.google')) return '📁';
+    return '🔗';
+  };
+
+  // 获取关联任务的详细信息
+  const fetchRelatedTasks = async () => {
+    if (!projectData?.attributes?.relatedTasks?.length) return;
+    
+    setLoadingTasks(true);
+    try {
+      const taskIds = projectData.attributes.relatedTasks.map(task => task.id);
+      const { data: tasks, error } = await supabase
+        .from("resources")
+        .select("*")
+        .eq("type", "task")
+        .in("id", taskIds);
+
+      if (error) throw error;
+      setRelatedTasks(tasks || []);
+    } catch (error) {
+      console.error("获取关联任务失败:", error);
+      message.error("获取关联任务失败");
+    } finally {
+      setLoadingTasks(false);
+    }
+  };
+
+  useEffect(() => {
+    if (projectData) {
+      fetchRelatedTasks();
+    }
+  }, [projectData]);
+
+  // 渲染任务详情
+  const renderTaskDetails = () => {
+    if (loadingTasks) {
+      return <Spin />;
+    }
+
+    if (!relatedTasks.length) {
+      return null;
+    }
+
+    return (
+      <div className="lg:col-span-3 mb-6">
+        <div className="bg-white dark:bg-gray-800 rounded-2xl shadow-sm border border-gray-100 dark:border-gray-700 overflow-hidden">
+          <div className="p-6">
+            <h2 className="text-xl font-semibold text-gray-900 dark:text-white flex items-center mb-6">
+              <div className="w-1 h-6 bg-purple-500 rounded-full mr-3 shadow-lg shadow-purple-500/50"></div>
+              关联任务
+            </h2>
+            
+            <div className="space-y-4">
+              {relatedTasks.map((task) => (
+                <div 
+                  key={task.id}
+                  className="border border-gray-100 dark:border-gray-700 rounded-xl p-6
+                           hover:border-purple-100 dark:hover:border-purple-900/50
+                           transition-all duration-300"
+                >
+                  {/* 任务标题和状态 */}
+                  <div className="flex items-center justify-between mb-4">
+                    <h3 className="text-lg font-medium text-gray-900 dark:text-white">
+                      {task.attributes.taskName}
+                    </h3>
+                    <Tag 
+                      className={`px-3 py-1 rounded-full 
+                        ${task.attributes.status === '进行中' ? 'bg-blue-50 text-blue-600 border-blue-200' :
+                          task.attributes.status === '已完成' ? 'bg-green-50 text-green-600 border-green-200' :
+                          'bg-gray-50 text-gray-600 border-gray-200'}`}
+                    >
+                      {task.attributes.status}
+                    </Tag>
+                  </div>
+
+                  {/* 任务时间和客户 */}
+                  <div className="flex items-center gap-6 mb-4 text-sm text-gray-500 dark:text-gray-400">
+                    <span className="flex items-center gap-2">
+                      <ClockCircleOutlined />
+                      {task.attributes.timeRange ? 
+                        `${dayjs(task.attributes.timeRange[0]).format('YYYY-MM-DD')} 至 ${dayjs(task.attributes.timeRange[1]).format('YYYY-MM-DD')}` :
+                        '未设置时间'
+                      }
+                    </span>
+                    {/* <div className="flex items-center gap-2">
+                      <span>客户:</span>
+                      <div className="flex gap-1">
+                        {task.attributes.customers?.map((customer) => (
+                          <Tag 
+                            key={customer.id}
+                            className="bg-purple-50 text-purple-600 border-purple-200 dark:bg-purple-900/30 dark:text-purple-300"
+                          >
+                            {customer.name}
+                          </Tag>
+                        ))}
+                      </div>
+                    </div> */}
+                  </div>
+
+                  {/* 任务流程 */}
+                  <Collapse 
+                    ghost 
+                    className="bg-transparent border-none"
+                  >
+                    <Collapse.Panel 
+                      header="任务流程" 
+                      key="1"
+                      className="bg-gray-50/50 dark:bg-gray-800/50 rounded-xl px-4"
+                    >
+                      <div className="space-y-4">
+                        {task.attributes.sections?.map((section, sIndex) => (
+                          <div key={sIndex} className="space-y-2">
+                            <h4 className="font-medium text-gray-900 dark:text-white">
+                              {section.sectionName}
+                            </h4>
+                            <div className="pl-4 space-y-2">
+                              {section.items?.map((item, iIndex) => (
+                                <div 
+                                  key={iIndex}
+                                  className="flex items-start gap-4 p-3 rounded-lg
+                                           bg-white dark:bg-gray-800 border border-gray-100 dark:border-gray-700"
+                                >
+                                  <div className="flex-grow">
+                                    <div className="text-gray-900 dark:text-white font-medium">
+                                      {item.name}
+                                    </div>
+                                    {item.description && (
+                                      <div className="text-sm text-gray-500 dark:text-gray-400 mt-1">
+                                        {item.description}
+                                      </div>
+                                    )}
+                                  </div>
+                                  <Tag 
+                                    className={`flex-shrink-0 
+                                      ${item.unit === '已完成' ? 'bg-green-50 text-green-600 border-green-200' :
+                                        item.unit === '进行中' ? 'bg-blue-50 text-blue-600 border-blue-200' :
+                                        'bg-gray-50 text-gray-600 border-gray-200'}`}
+                                  >
+                                    {item.unit}
+                                  </Tag>
+                                </div>
+                              ))}
+                            </div>
+                          </div>
+                        ))}
+                      </div>
+                    </Collapse.Panel>
+                  </Collapse>
+                </div>
+              ))}
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  };
+
+  // 修改文件上传处理函数
+  const handleFileUpload = async (file) => {
+    try {
+      const fileExt = file.name.split('.').pop();
+      const fileName = `${Date.now()}.${fileExt}`;
+      const filePath = `${type}/${fileName}`;
+
+      const { data, error } = await supabase.storage
+        .from('file')
+        .upload(filePath, file);
+
+      if (error) throw error;
+
+      const { data: { publicUrl } } = supabase.storage
+        .from('file')
+        .getPublicUrl(filePath);
+
+      let fileType = '';
+      if (file.type.startsWith('image/')) {
+        fileType = '图片';
+      } else if (file.type.startsWith('video/')) {
+        fileType = '视频';
+      } else if (file.type.includes('pdf')) {
+        fileType = 'PDF文档';
+      } else {
+        fileType = '其他文件';
+      }
+
+      // 自动填充表单
+      form.setFieldsValue({
+        url: publicUrl,
+        title: `${fileType}-${file.name}`,
+        unit: fileType,
+        description: ''
+      });
+
+      return true;
+    } catch (error) {
+      console.error('文件上传失败:', error);
+      return false;
+    }
+  };
+
+  // 修改模态框内容
+  const renderModal = () => (
+    <Modal
+      title="添加资源"
+      open={isModalVisible}
+      onCancel={() => {
+        setIsModalVisible(false);
+        form.resetFields();
+      }}
+      destroyOnClose={true}
+      footer={null}
+    >
+      <Form
+        form={form}
+        layout="vertical"
+        onFinish={handleAddItem}
+        className="mt-4"
+        preserve={false}
+      >
+        <Upload.Dragger
+          multiple={false}
+          maxCount={1}
+          customRequest={async ({ file, onSuccess, onError }) => {
+            try {
+              const result = await handleFileUpload(file);
+              if (result) {
+                onSuccess();
+              } else {
+                onError();
+              }
+            } catch (err) {
+              onError();
+            }
+          }}
+          onChange={(info) => {
+            if (info.file.status === 'done') {
+              message.success(`${info.file.name} 上传成功`);
+            } else if (info.file.status === 'error') {
+              message.error(`${info.file.name} 上传失败`);
+            }
+          }}
+          onRemove={() => {
+            form.resetFields();
+          }}
+        >
+          <p className="ant-upload-drag-icon">
+            <InboxOutlined />
+          </p>
+          <p className="ant-upload-text">点击或拖拽文件到此区域上传</p>
+          <p className="ant-upload-hint">上传文件后可修改相关信息</p>
+        </Upload.Dragger>
+
+        <Form.Item
+          name="url"
+          label="资源链接"
+          rules={[{ required: true, message: '请输入资源链接' }]}
+          className="mt-4"
+        >
+          <Input placeholder="请输入资源链接" />
+        </Form.Item>
+
+        <Form.Item
+          name="title"
+          label="资源标题"
+          rules={[{ required: true, message: '请输入资源标题' }]}
+        >
+          <Input placeholder="请输入资源标题" />
+        </Form.Item>
+
+        <Form.Item
+          name="unit"
+          label="资源类型"
+        >
+          <Select
+            placeholder="请选择资源类型"
+            loading={loadingUnits}
+            showSearch
+            allowClear
+            options={units.map((unit) => ({
+              label: unit.attributes.name,
+              value: unit.attributes.name,
+            }))}
+            dropdownRender={(menu) => (
+              <>
+                {menu}
+                <Divider style={{ margin: '8px 0' }} />
+                <div style={{ padding: '4px' }}>
+                  <Input.Search
+                    placeholder="输入新类型"
+                    enterButton={<PlusOutlined />}
+                    onSearch={async (value) => {
+                      if (!value.trim()) return;
+                      if (await handleAddUnit(value.trim())) {
+                        form.setFieldValue('unit', value.trim());
+                      }
+                    }}
+                  />
+                </div>
+              </>
+            )}
+          />
+        </Form.Item>
+
+        <Form.Item
+          name="description"
+          label="资源描述"
+        >
+          <Input.TextArea rows={4} placeholder="请输入资源描述" />
+        </Form.Item>
+
+        <Form.Item className="mb-0 flex justify-end gap-3">
+          <Button 
+            onClick={() => {
+              setIsModalVisible(false);
+              form.resetFields();
+            }}
+          >
+            取消
+          </Button>
+          <Button type="primary" htmlType="submit">
+            确定
+          </Button>
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+
+  if (loading) {
+    return (
+      <div className="flex items-center justify-center min-h-screen">
+        <Spin tip="加载中..." />
+      </div>
+    );
+  }
+
+  if (!projectData) {
+    return (
+      <div className="flex items-center justify-center min-h-screen">
+        <Empty description="未找到项目信息" />
+      </div>
+    );
+  }
+
+  const { attributes } = projectData;
+
+  // 打开所有资源的函数
+  const openAllResources = (items) => {
+    items.forEach(item => {
+      if (item.url) {
+        window.open(item.url, '_blank');
+      }
+    });
+  };
+
+  return (
+    <div className="min-h-screen bg-gray-50/50 dark:bg-gray-900/95">
+      <div className="container mx-auto px-4 py-8">
+        <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
+        {renderTaskDetails()}
+          <div className="lg:col-span-1">
+            <div className="bg-white dark:bg-gray-800 rounded-2xl shadow-sm border border-gray-100 dark:border-gray-700 overflow-hidden">
+              <div className="p-6">
+                <h1 className="text-2xl font-bold text-gray-900 dark:text-white mb-6">
+                  {attributes.projectName}
+                </h1>
+                
+                <div className="space-y-8">
+                  <div>
+                    <h2 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-3">
+                      项目描述
+                    </h2>
+                    <p className="text-gray-700 dark:text-gray-300 leading-relaxed">
+                      {attributes.description || '暂无描述'}
+                    </p>
+                  </div>
+
+                  <div>
+                    <h2 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-3">
+                      项目周期
+                    </h2>
+                    <p className="text-gray-700 dark:text-gray-300">
+                      {attributes.startDate && attributes.endDate ? (
+                        <span className="inline-flex items-center px-3 py-1 rounded-full bg-blue-50 dark:bg-blue-900/30 text-blue-600 dark:text-blue-300">
+                          {dayjs(attributes.startDate).format('YYYY-MM-DD')} 至 {dayjs(attributes.endDate).format('YYYY-MM-DD')}
+                        </span>
+                      ) : '未设置'}
+                    </p>
+                  </div>
+
+                  <div>
+                    <h2 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-3">
+                      相关客户
+                    </h2>
+                    <div className="flex flex-wrap gap-2">
+                      {attributes.customers?.map((customer) => (
+                        <Tag 
+                          key={customer.id}
+                          className="px-3 py-1 rounded-full bg-purple-50 text-purple-600 border-purple-200 
+                                   dark:bg-purple-900/30 dark:text-purple-300 dark:border-purple-800"
+                        >
+                          {customer.name}
+                        </Tag>
+                      )) || '暂无客户'}
+                    </div>
+                  </div>
+
+                  <div>
+                    <h2 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-3">
+                      关联任务
+                    </h2>
+                    <div className="flex flex-wrap gap-2">
+                      {attributes.relatedTasks?.map((task) => (
+                        <Tag 
+                          key={task.id}
+                          className="px-3 py-1 rounded-full bg-green-50 text-green-600 border-green-200
+                                   dark:bg-green-900/30 dark:text-green-300 dark:border-green-800"
+                        >
+                          {task.name}
+                        </Tag>
+                      )) || '暂无任务'}
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div className="lg:col-span-2">
+            <div className="space-y-6">
+              {Object.entries(resourcesByUnit).map(([unit, items]) => (
+                <div 
+                  key={unit}
+                  className="bg-white dark:bg-gray-800 rounded-2xl shadow-sm border border-gray-100 dark:border-gray-700 overflow-hidden"
+                >
+                  <div className="p-6">
+                    <div className="flex justify-between items-center mb-6">
+                      <h2 className="text-xl font-semibold text-gray-900 dark:text-white flex items-center">
+                        <div className="w-1 h-6 bg-blue-500 rounded-full mr-3 shadow-lg shadow-blue-500/50"></div>
+                        {unit}
+                      </h2>
+                      <div className="flex gap-3">
+                        {items.length > 0 && (
+                          <Button
+                            type="default"
+                            icon={<FolderOpenOutlined />}
+                            onClick={() => openAllResources(items)}
+                            className="flex items-center hover:text-blue-600 hover:border-blue-600 transition-colors
+                                     dark:hover:text-blue-400 dark:hover:border-blue-400"
+                          >
+                            打开全部
+                          </Button>
+                        )}
+                        <Button
+                          type="primary"
+                          icon={<PlusOutlined />}
+                          onClick={() => {
+                            setCurrentUnit(unit);
+                            setIsModalVisible(true);
+                          }}
+                          className="flex items-center bg-blue-500 hover:bg-blue-600 border-none shadow-lg 
+                                   shadow-blue-500/30 transition-all hover:shadow-blue-500/50"
+                        >
+                          添加资源
+                        </Button>
+                      </div>
+                    </div>
+                    
+                    {items.length > 0 ? (
+                      <div className="grid gap-4">
+                        {items.map((item, itemIndex) => (
+                          <div 
+                            key={itemIndex}
+                            className="group relative p-4 rounded-xl border border-gray-100 dark:border-gray-700 
+                                     hover:border-blue-100 dark:hover:border-blue-900/50
+                                     hover:bg-gradient-to-r hover:from-blue-50 hover:to-transparent
+                                     dark:hover:from-blue-900/20 dark:hover:to-transparent
+                                     transition-all duration-300 bg-white dark:bg-gray-800/50"
+                          >
+                            <div className="flex items-start gap-4">
+                              {/* 资源图标 */}
+                              <div className="flex-shrink-0 w-10 h-10 flex items-center justify-center 
+                                            bg-gradient-to-br from-blue-50 to-blue-100 
+                                            dark:from-blue-900/30 dark:to-blue-800/30
+                                            rounded-lg text-xl shadow-sm">
+                                {item.url && getResourceIcon(item.url)}
+                              </div>
+
+                              {/* 资源内容 */}
+                              <div className="flex-grow min-w-0">
+                                <div className="flex items-start justify-between gap-4">
+                                  <div className="min-w-0">
+                                    <h3 className="text-lg font-medium text-gray-900 dark:text-white truncate">
+                                      {item.title}
+                                    </h3>
+                                    {item.url && (
+                                      <a
+                                        href={item.url}
+                                        target="_blank"
+                                        rel="noopener noreferrer"
+                                        className="inline-flex items-center text-blue-500 hover:text-blue-600 text-sm 
+                                                 hover:underline gap-1 transition-colors mt-1"
+                                      >
+                                        {getDomainFromUrl(item.url)}
+                                      </a>
+                                    )}
+                                  </div>
+                                  
+                                  {/* 快捷操作按钮 */}
+                                  <div className="flex-shrink-0 opacity-0 group-hover:opacity-100 transition-opacity">
+                                    {item.url && (
+                                      <a
+                                        href={item.url}
+                                        target="_blank"
+                                        rel="noopener noreferrer"
+                                        className="inline-flex items-center px-3 py-1 text-sm 
+                                                 bg-blue-500 hover:bg-blue-600 text-white rounded-full
+                                                 shadow-sm hover:shadow-md transition-all duration-200"
+                                      >
+                                        打开链接
+                                      </a>
+                                    )}
+                                  </div>
+                                </div>
+
+                                {/* 资源描述 */}
+                                {item.description && (
+                                  <div className="mt-2 relative">
+                                    <p className="text-gray-600 dark:text-gray-400 text-sm leading-relaxed
+                                               line-clamp-2 group-hover:line-clamp-none transition-all duration-200">
+                                      {item.description}
+                                    </p>
+                                    <div className="absolute inset-x-0 bottom-0 h-4 bg-gradient-to-t from-white dark:from-gray-800/50 
+                                                 to-transparent group-hover:opacity-0 transition-opacity"></div>
+                                  </div>
+                                )}
+
+                              
+                              </div>
+                            </div>
+
+                           
+                          </div>
+                        ))}
+                      </div>
+                    ) : (
+                      <div className="text-center py-12 px-4">
+                        <div className="inline-flex items-center justify-center w-16 h-16 rounded-full 
+                                      bg-gray-100 dark:bg-gray-800 mb-4">
+                          <span className="text-2xl">📂</span>
+                        </div>
+                        <h3 className="text-lg font-medium text-gray-900 dark:text-white mb-2">
+                          暂无资源
+                        </h3>
+                        <p className="text-gray-500 dark:text-gray-400 text-sm">
+                          点击"添加资源"按钮开始添加资源
+                        </p>
+                      </div>
+                    )}
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+        </div>
+      </div>
+
+      {renderModal()}
+    </div>
+  );
+}
diff --git a/src/pages/company/quotation/index.jsx b/src/pages/company/quotation/index.jsx
index 664ff7d..d75a358 100644
--- a/src/pages/company/quotation/index.jsx
+++ b/src/pages/company/quotation/index.jsx
@@ -353,6 +353,7 @@ useEffect(()=>{
           <Space>
           <Select
             allowClear
+            variant="filled"
             loading={loadingCustomers}
             placeholder="按客户筛选"
             style={{ width: 200 }}
diff --git a/src/pages/company/service/itemsManange/sections/index.jsx b/src/pages/company/service/itemsManange/sections/index.jsx
index ac4a4a7..9ba9f5a 100644
--- a/src/pages/company/service/itemsManange/sections/index.jsx
+++ b/src/pages/company/service/itemsManange/sections/index.jsx
@@ -1,7 +1,7 @@
 import React from "react";
 import QuataSections from "./quotation";
 import TaskSections from "./task";
-
+import Project from './project'
 export default function SectionComponent({ activeType }) { 
   const renderFn = (type) => { 
     switch (type) {
@@ -10,7 +10,7 @@ export default function SectionComponent({ activeType }) {
       case "task":
         return <TaskSections />; 
       default:
-        return <div></div>;
+        return <Project></Project>;
     }
   };
   return <>{renderFn(activeType)}</>;
diff --git a/src/pages/company/service/itemsManange/sections/project.jsx b/src/pages/company/service/itemsManange/sections/project.jsx
new file mode 100644
index 0000000..7133884
--- /dev/null
+++ b/src/pages/company/service/itemsManange/sections/project.jsx
@@ -0,0 +1,544 @@
+import React, { useState, useEffect } from 'react';
+import { 
+  Table, 
+  Button, 
+  Form, 
+  Input, 
+  Space, 
+  message, 
+  Popconfirm, 
+  Select,
+  Divider,
+  Card,
+  Typography,
+  Upload,
+  Modal
+} from 'antd';
+import { 
+  PlusOutlined, 
+  DeleteOutlined,
+  InboxOutlined,
+  UploadOutlined 
+} from '@ant-design/icons';
+import { supabaseService } from '@/hooks/supabaseService';
+import { v4 as uuidv4 } from 'uuid';
+import { supabase } from "@/config/supabase";
+
+const { Text } = Typography;
+const TYPE = 'project';
+
+const ProjectSections = () => {
+  const [data, setData] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [editingKey, setEditingKey] = useState('');
+  const [form] = Form.useForm();
+  const [loadingUnits, setLoadingUnits] = useState(false);
+  const [units, setUnits] = useState([]);
+  const [formValues, setFormValues] = useState({});
+  const [uploadModalVisible, setUploadModalVisible] = useState(false);
+  const [currentAddItem, setCurrentAddItem] = useState(null);
+
+  const fetchSections = async () => {
+    setLoading(true);
+    try {
+      const { data: sections } = await supabaseService.select('resources', {
+        filter: {
+          'type': { eq: 'sections' },
+          'attributes->>template_type': { eq: TYPE }
+        },
+        order: {
+          column: 'created_at',
+          ascending: false
+        }
+      });
+      setData(sections || []);
+    } catch (error) {
+      message.error('获取模块数据失败');
+      console.error(error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const fetchUnits = async () => {
+    setLoadingUnits(true);
+    try {
+      const { data: units } = await supabaseService.select("resources", {
+        filter: {
+          type: { eq: "units" },
+          "attributes->>template_type": { in: `(${TYPE})` },
+        },
+        order: {
+          column: "created_at",
+          ascending: false,
+        },
+      });
+      setUnits(units || []);
+    } catch (error) {
+      message.error("获取资源类型列表失败");
+      console.error(error);
+    } finally {
+      setLoadingUnits(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchSections();
+    fetchUnits();
+  }, []);
+
+  const handleAdd = () => {
+    const newData = {
+      id: Date.now().toString(),
+      attributes: {
+        name: '',
+        template_type: TYPE,
+        items: [{
+          key: uuidv4(),
+          url: '',
+          title: '',
+          unit: '',
+          description: ''
+        }]
+      },
+      isNew: true
+    };
+    setData([newData, ...data]);
+    setEditingKey(newData.id);
+    form.setFieldsValue(newData.attributes);
+  };
+
+  const handleSave = async (record) => {
+    try {
+      const values = await form.validateFields();
+      const items = form.getFieldValue(['items']) || [];
+      
+      if (!items.length || !items.some(item => item.title)) {
+        message.error('请至少添加一个有效的资源项目');
+        return;
+      }
+
+      const formattedItems = items.filter(item => item.title).map(item => ({
+        url: item.url,
+        title: item.title,
+        unit: item.unit,
+        description: item.description
+      }));
+
+      if (record.isNew) {
+        await supabaseService.insert('resources', {
+          type: 'sections',
+          attributes: {
+            name: values.name,
+            template_type: TYPE,
+            items: formattedItems,
+          },
+          schema_version: 1
+        });
+      } else {
+        await supabaseService.update('resources',
+          { id: record.id },
+          {
+            attributes: {
+              name: values.name,
+              template_type: TYPE,
+              items: formattedItems,
+            },
+            updated_at: new Date().toISOString()
+          }
+        );
+      }
+
+      message.success('保存成功');
+      setEditingKey('');
+      fetchSections();
+    } catch (error) {
+      message.error('保存失败');
+      console.error(error);
+    }
+  };
+
+  const handleDelete = async (record) => {
+    try {
+      await supabaseService.delete('resources', { id: record.id });
+      message.success('删除成功');
+      fetchSections();
+    } catch (error) {
+      message.error('删除失败');
+      console.error(error);
+    }
+  };
+
+  const handleAddUnit = async (unitName) => {
+    try {
+      await supabaseService.insert("resources", {
+        type: "units",
+        attributes: {
+          name: unitName,
+          template_type: TYPE,
+        },
+        schema_version: 1,
+      });
+
+      message.success("新增资源类型成功");
+      fetchUnits();
+      return true;
+    } catch (error) {
+      message.error("新增资源类型失败");
+      console.error(error);
+      return false;
+    }
+  };
+
+  const handleValuesChange = (changedValues, allValues) => {
+    setFormValues(allValues);
+  };
+
+  const handleFileUpload = async (file, addItem) => {
+    try {
+      const fileExt = file.name.split('.').pop();
+      const fileName = `${Date.now()}.${fileExt}`;
+
+      const { data, error } = await supabase.storage
+        .from('file')
+        .upload(filePath, file);
+
+      if (error) throw error;
+
+      const { data: { publicUrl } } = supabase.storage
+        .from('file')
+        .getPublicUrl(fileName);
+
+      let fileType = '';
+      if (file.type.startsWith('image/')) {
+        fileType = '图片';
+      } else if (file.type.startsWith('video/')) {
+        fileType = '视频';
+      } else if (file.type.includes('pdf')) {
+        fileType = 'PDF文档';
+      } else {
+        fileType = '其他文件';
+      }
+
+      addItem({
+        key: uuidv4(),
+        url: publicUrl,
+        title: `${fileType}-${file.name}`,
+        unit: fileType,
+        description: '',
+      });
+
+      return true;
+    } catch (error) {
+      message.error('文件上传失败');
+      console.error(error);
+      return false;
+    }
+  };
+
+  const renderUploadModal = () => (
+    <Modal
+      title="上传资源文件"
+      open={uploadModalVisible}
+      onCancel={() => setUploadModalVisible(false)}
+      footer={null}
+    >
+      <Upload.Dragger
+        multiple
+        customRequest={async ({ file, onSuccess, onError }) => {
+          try {
+            const result = await handleFileUpload(file, currentAddItem);
+            if (result) {
+              onSuccess();
+            } else {
+              onError();
+            }
+          } catch (err) {
+            onError();
+          }
+        }}
+        onChange={(info) => {
+          if (info.file.status === 'done') {
+            message.success(`${info.file.name} 上传成功`);
+          } else if (info.file.status === 'error') {
+            message.error(`${info.file.name} 上传失败`);
+          }
+        }}
+      >
+        <p className="ant-upload-drag-icon">
+          <InboxOutlined />
+        </p>
+        <p className="ant-upload-text">点击或拖拽文件到此区域上传</p>
+        <p className="ant-upload-hint">支持单个或批量上传</p>
+      </Upload.Dragger>
+    </Modal>
+  );
+
+  const columns = [
+    {
+      title: '模块名称',
+      dataIndex: ['attributes', 'name'],
+      width: 200,
+      render: (text, record) => {
+        const isEditing = record.id === editingKey;
+        return isEditing ? (
+          <Form.Item
+            name="name"
+            style={{ margin: 0 }}
+            rules={[{ required: true, message: '请输入模块名称!' }]}
+          >
+            <Input placeholder="请输入模块名称" />
+          </Form.Item>
+        ) : (
+          <span className="font-medium">{text}</span>
+        );
+      },
+    },
+    {
+      title: '资源项目',
+      dataIndex: ['attributes', 'items'],
+      render: (items, record) => {
+        const isEditing = record.id === editingKey;
+        if (isEditing) {
+          return (
+            <Form.List name="items">
+              {(fields, { add, remove }) => (
+                <div className="space-y-4">
+                  {fields.map((field, index) => (
+                    <Card key={field.key} size="small" className="bg-gray-50">
+                      <div className="grid grid-cols-5 gap-4">
+                        <Form.Item
+                          {...field}
+                          name={[field.name, 'url']}
+                          rules={[{ required: true, message: '请输入资源链接' }]}
+                          className="mb-0"
+                        >
+                          <Input placeholder="资源链接" />
+                        </Form.Item>
+
+                        <Form.Item
+                          {...field}
+                          name={[field.name, 'title']}
+                          rules={[{ required: true, message: '请输入资源标题' }]}
+                          className="mb-0"
+                        >
+                          <Input placeholder="资源标题" />
+                        </Form.Item>
+
+                        <Form.Item
+                          {...field}
+                          name={[field.name, 'unit']}
+                          className="mb-0"
+                        >
+                          <Select
+                            placeholder="资源类型"
+                            loading={loadingUnits}
+                            showSearch
+                            allowClear
+                            options={units.map((unit) => ({
+                              label: unit.attributes.name,
+                              value: unit.attributes.name,
+                            }))}
+                            dropdownRender={(menu) => (
+                              <>
+                                {menu}
+                                <Divider style={{ margin: '8px 0' }} />
+                                <div style={{ padding: '4px 8px' }}>
+                                  <Input.Search
+                                    placeholder="输入新类型"
+                                    enterButton={<PlusOutlined />}
+                                    onSearch={async (value) => {
+                                      if (!value.trim()) return;
+                                      if (await handleAddUnit(value.trim())) {
+                                        const currentItems = form.getFieldValue('items');
+                                        currentItems[index].unit = value.trim();
+                                        form.setFieldValue('items', currentItems);
+                                      }
+                                    }}
+                                  />
+                                </div>
+                              </>
+                            )}
+                          />
+                        </Form.Item>
+
+                        <Form.Item
+                          {...field}
+                          name={[field.name, 'description']}
+                          className="mb-0"
+                        >
+                          <Input placeholder="资源描述" />
+                        </Form.Item>
+
+                        <Button
+                          type="text"
+                          danger
+                          icon={<DeleteOutlined />}
+                          onClick={() => remove(field.name)}
+                          disabled={fields.length === 1}
+                        />
+                      </div>
+                    </Card>
+                  ))}
+
+                  <div className="flex gap-2">
+                    <Button
+                      type="dashed"
+                      onClick={() => add({
+                        key: uuidv4(),
+                        url: '',
+                        title: '',
+                        unit: '',
+                        description: ''
+                      })}
+                      icon={<PlusOutlined />}
+                      className="w-full hover:border-blue-400 hover:text-blue-500"
+                    >
+                      手动添加资源
+                    </Button>
+                    <Button
+                      type="dashed"
+                      onClick={() => {
+                        setCurrentAddItem(() => add);
+                        setUploadModalVisible(true);
+                      }}
+                      icon={<UploadOutlined />}
+                      className="w-full hover:border-blue-400 hover:text-blue-500"
+                    >
+                      上传文件
+                    </Button>
+                  </div>
+                </div>
+              )}
+            </Form.List>
+          );
+        }
+        
+        return (
+          <div className="space-y-2">
+            {(items || []).map((item, index) => (
+              <div key={index} className="flex items-center gap-4 text-sm">
+                <a href={item.url} target="_blank" rel="noopener noreferrer" className="text-blue-600">
+                  {item.title}
+                </a>
+                <span className="text-gray-500">{item.unit || '未设置类型'}</span>
+                {item.description && (
+                  <span className="text-gray-500">({item.description})</span>
+                )}
+              </div>
+            ))}
+          </div>
+        );
+      },
+    },
+    {
+      title: '操作',
+      width: 160,
+      fixed: 'right',
+      render: (_, record) => {
+        const isEditing = record.id === editingKey;
+        return isEditing ? (
+          <Space>
+            <Button
+              type="link"
+              className="text-green-600 hover:text-green-500 font-medium"
+              onClick={() => handleSave(record)}
+            >
+              保存
+            </Button>
+            <Button
+              type="link"
+              className="text-gray-600 hover:text-gray-500 font-medium"
+              onClick={() => {
+                setEditingKey('');
+                if (record.isNew) {
+                  setData(data.filter(item => item.id !== record.id));
+                }
+              }}
+            >
+              取消
+            </Button>
+          </Space>
+        ) : (
+          <Space>
+            <Button
+              type="link"
+              className="text-blue-600 hover:text-blue-500 font-medium"
+              disabled={editingKey !== ''}
+              onClick={() => {
+                setEditingKey(record.id);
+                form.setFieldsValue({
+                  name: record.attributes.name,
+                  items: record.attributes.items
+                });
+              }}
+            >
+              编辑
+            </Button>
+            <Popconfirm
+              title="确认删除"
+              description="确定要删除这个模块吗？"
+              onConfirm={() => handleDelete(record)}
+              okText="确定"
+              cancelText="取消"
+              okButtonProps={{
+                className: "bg-red-500 hover:bg-red-600 border-red-500"
+              }}
+            >
+              <Button
+                type="link"
+                className="text-red-600 hover:text-red-500 font-medium"
+                disabled={editingKey !== ''}
+              >
+                删除
+              </Button>
+            </Popconfirm>
+          </Space>
+        );
+      },
+    },
+  ];
+
+  return (
+    <div className="p-6">
+      <div className="rounded-lg shadow-sm mb-6 p-4">
+        <div className="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
+          <div className="flex items-center gap-2">
+            <Button
+              type="primary"
+              onClick={handleAdd}
+              icon={<PlusOutlined />}
+              className="bg-blue-600 hover:bg-blue-700 border-0 shadow-sm h-10"
+            >
+              新增模块
+            </Button>
+          </div>
+        </div>
+      </div>
+
+      <div className="rounded-lg shadow-sm">
+        <Form 
+          form={form}
+          onValuesChange={handleValuesChange}
+        >
+          <Table
+            scroll={{ x: 1200 }}
+            columns={columns}
+            dataSource={data}
+            rowKey="id"
+            loading={loading}
+            pagination={{
+              pageSize: 10,
+              showTotal: (total) => `共 ${total} 条`,
+              className: "px-4"
+            }}
+            className="rounded-lg"
+          />
+        </Form>
+      </div>
+      {renderUploadModal()}
+    </div>
+  );
+};
+
+export default ProjectSections;
diff --git a/src/pages/company/task/index.jsx b/src/pages/company/task/index.jsx
index 18e2e25..fb89a1b 100644
--- a/src/pages/company/task/index.jsx
+++ b/src/pages/company/task/index.jsx
@@ -313,7 +313,6 @@ const TaskPage = () => {
       ),
     });
 
-    // 按分类分组
     templates.forEach((template) => {
       if (template.attributes.category) {
         template.attributes.category.forEach((cat) => {
diff --git a/src/pages/resource/bucket/index.jsx b/src/pages/resource/bucket/index.jsx
index 2dfb88f..672bd50 100644
--- a/src/pages/resource/bucket/index.jsx
+++ b/src/pages/resource/bucket/index.jsx
@@ -362,7 +362,6 @@ const StorageManager = () => {
     setNewFileName(selectedFile.name);
     setIsRenaming(true);
   };
-  // 添加文件删除功能
   const handleDelete = async (fileName) => {
     try {
       const { error } = await supabase.storage.from("file").remove([fileName]);
@@ -370,29 +369,22 @@ const StorageManager = () => {
       
       message.success("文件删除成功");
       
-      // 直接从本地状态中移除被删除的文件
       setDisplayFiles(prev => prev.filter(file => file.name !== fileName));
       
-      // 如果删除的是当前选中的文件，清空预览
       if (selectedFile?.name === fileName) {
         setSelectedFile(null);
         setFileContent("");
       }
-
-      // 更新文件类型统计
-      // 注意：typeStats 是通过 useMemo 自动计算的，不需要手动更新
       
     } catch (error) {
       message.error(`删除失败: ${error.message}`);
     }
   };
 
-  // 判断是否有过滤条件
   const hasFilters = useMemo(() => {
     return searchText !== '' || selectedType !== '全部';
   }, [searchText, selectedType]);
 
-  // 加载更多数据
   const loadMoreFiles = () => {
     if (!hasMore || loading || hasFilters) return; // 有过滤条件不加载更多
     fetchAllFiles(false);
@@ -403,35 +395,17 @@ const StorageManager = () => {
     fetchAllFiles(true);
   }, []);
 
-  // 搜索或筛选时重新加载
-  const handleSearch = (value) => {
-    setSearchText(value);
-    // 不需要重新调用 fetchAllFiles，因为搜索是在前端过滤
-  };
+
 
   const handleTypeChange = (type) => {
     setSelectedType(type);
-    // 不需要重新调用 fetchAllFiles，因为类型筛选是在前端过滤
   };
 
-  // 处理文件名中的空格
   const handleFileName = (fileName) => {
-    // 替换空格为下划线或编码空格
     return fileName.replace(/\s+/g, '_');
   };
 
-  // 修改文件类型判断
-  const getFileType = (mimetype) => {
-    if (!mimetype) return '其他';
-    
-    for (const [type, mimetypes] of Object.entries(FILE_TYPES)) {
-      if (mimetypes.some(t => mimetype.startsWith(t) || mimetype === t)) {
-        return type;
-      }
-    }
-    
-    return '其他';
-  };
+
 
   // 渲染加载状态
   const LoadingSpinner = () => (
diff --git a/src/routes/routes.js b/src/routes/routes.js
index e08c3f7..4c191e3 100644
--- a/src/routes/routes.js
+++ b/src/routes/routes.js
@@ -43,6 +43,13 @@ const companyRoutes = [
     name: "报价单详情",
     icon: "file",
     roles: ["ADMIN", "OWNER"],
+  },
+  {
+    path: "project",
+    component: lazy(() => import("@/pages/company/project")),
+    name: "专案管理",
+    icon: "appstore",
+    roles: ["ADMIN", "OWNER"],
   },
     {
     path: "task",
@@ -119,13 +126,7 @@ const companyRoutes = [
     icon: "branches",
     roles: ["ADMIN", "OWNER"],
   },
-  {
-    path: "project",
-    component: lazy(() => import("@/pages/company/project")),
-    name: "专案管理",
-    icon: "appstore",
-    roles: ["ADMIN", "OWNER"],
-  },
+ 
   {
     path: "projectInfo/:id?",
     hidden: true,
@@ -133,6 +134,14 @@ const companyRoutes = [
     name: "专案管理详情",
     icon: "appstore",
     roles: ["ADMIN", "OWNER"],
+  },
+  {
+    path: "projectView/:id?",
+    hidden: true,
+    component: lazy(() => import("@/pages/company/project/info")),
+    name: "专案详情",
+    icon: "appstore",
+    roles: ["ADMIN", "OWNER"],
   }
 ];