feat: 优化教务系统多项功能

主要更新：
1. 项目库功能优化
   - 添加项目效果图点击预览功能，支持图片放大查看和切换
   - 新增ImagePreviewModal组件，提供完整的图片预览体验

2. 企业内推岗位页面改进
   - 右侧岗位面试状态卡片支持点击查看岗位详情
   - 从企业内推岗位库直接导入岗位数据
   - 面试状态查看的岗位详情隐藏投递按钮
   - 岗位要求显示优化，添加数字编号格式

3. 课堂作业板块完善
   - 修复垂直能力课只显示4个单元的问题，现可显示全部12个单元
   - 为"展会主题与品牌定位"课程添加"可试看"标签
   - 调整"可试看"标签位置，避免遮挡课程名称
   - 在全部视图中将"展会主题与品牌定位"课程置顶

4. 课程直播间页面优化
   - 为复合能力课添加文字虚线分割线，与垂直能力课保持一致
   - 删除页面顶部的进度条，简化界面

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>

src/pages/ProjectLibraryPage/index.jsx

@@ -109,6 +109,89 @@ const ProjectLibrary = () => {
   };
 
   const myProjects = processMyProjects();
+
+  // 三个可点击查看的特殊项目
+  const clickableProjects = [
+    {
+      id: "clickable-1",
+      name: "宝可梦品牌青春治愈系全场景视觉与周边设计策划方案",
+      unitName: "商业空间与文创产品设计",
+      isClickable: true,
+      content: {
+        title: "宝可梦品牌青春治愈系全场景视觉与周边设计策划方案",
+        description: "本套设计围绕让品牌成为可触摸的生活伙伴核心理念，打造视觉统一+场景沉浸的全链路品牌表达系统。",
+        images: [
+          { url: "/images/project-library/29aab970-92d1-4a79-84d3-5a29d9e299eb.jpeg", title: "奶茶杯设计" },
+          { url: "/images/project-library/20250824-121446.jpg", title: "品牌海报设计" },
+          { url: "/images/project-library/outputs_20250824_3k4iaqnnbt.jpeg", title: "线下空间设计" },
+          { url: "/images/project-library/img_v3_02pf_f256578f-91f0-43f6-9e25-37fe423fd23g.jpg", title: "帽子周边设计" }
+        ],
+        sections: [
+          {
+            title: "一、设计说明",
+            content: "本套设计围绕让品牌成为可触摸的生活伙伴核心理念，打造视觉统一+场景沉浸的全链路品牌表达系统。整体风格融合清新潮酷与温暖治愈，以马卡龙渐变色系+软萌IP符号为核心视觉语言，串联周边产品（奶茶杯、帽子）、线下空间、视觉海报三大场景，核心方向聚焦从视觉符号到情感连接——通过产品的实用性、空间的体验感、海报的传播力，将品牌年轻、治愈、有温度的认知，转化为用户可感知、可参与、可分享的生活场景，强化品牌=青春治愈伙伴的心智联想。"
+          },
+          {
+            title: "二、设计亮点", 
+            content: `1. 全场景视觉闭环：从周边产品的细节图案（如奶茶杯的渐变花纹、帽子的IP刺绣），到空间设计的元素延续（如墙面装饰呼应杯子造型），再到海报的色彩体系，所有设计均源于同一IP视觉库，实现看海报→逛空间→买周边的认知连贯，让品牌记忆点在不同场景中反复强化。
+
+2. 情感化仪式感植入：奶茶杯内置温度感应隐藏图案（倒入热饮后浮现IP符号），将喝奶茶变成解锁小惊喜的仪式；空间设计预留奶茶杯打卡墙（与周边杯子1:10比例的巨型装置），满足用户拍美照、晒社交的需求；帽子采用可拆卸IP徽章，让用户通过DIY搭配，将品牌元素融入个人风格，增加互动感。
+
+3. 年轻群体精准共鸣：色彩选择（浅粉、淡蓝、奶黄）契合Z世代治愈系审美，图案设计用简笔奶茶泡、软萌云朵等拟态符号，降低认知门槛；所有产品均兼顾潮流性与实用性（如帽子的软顶版型适配日常穿搭、杯子的防烫材质适合高频使用），让设计不仅好看，更好用。`
+          }
+        ]
+      }
+    },
+    {
+      id: "clickable-2", 
+      name: "四川大熊猫扇子文创产品设计",
+      unitName: "文旅衍生文创产品设计",
+      isClickable: true,
+      content: {
+        title: "四川大熊猫扇子文创产品设计",
+        description: "以\"熊猫·蜀韵\"为核心主题，聚焦\"四川文化的当代表达\"，将\"大熊猫、蜀绣、传统折扇\"三大符号融合为兼具文化意味与日常实用的文创产品。",
+        images: [
+          { url: "/images/project-library/四川大熊猫扇子设计图.jpeg", title: "熊猫扇子效果图" }
+        ],
+        sections: [
+          {
+            title: "一、项目介绍",
+            content: "本方案以\"熊猫·蜀韵\"为核心主题，聚焦\"四川文化的当代表达\"，旨在将\"大熊猫、蜀绣、传统折扇\"三大符号，融合为兼具文化意味与日常实用的文创产品。整体风格定位为「熊猫蜀绣·新雅致」——既保留四川非遗的文化内核（如蜀绣的精细针法、大熊猫的国宝形象、川地传统折扇），又摒弃单纯\"符号拼贴\"的套路，转而用简洁的线条、精细的工艺和舒适的材质，让熊猫与蜀韵真正走进日常场景。"
+          },
+          {
+            title: "二、设计策划案",
+            content: "以 \"新中式非遗美学\" 为核心风格，融合四川 \"自然生态\" 与 \"非遗技艺\" 双重属性 —— 扇面以柔和雅致的 \"竹绿 + 浅金 + 淡青\" 为基调，搭配双宫绸的温润光泽与蜀绣的细腻针脚，营造 \"雅致不张扬、精致不堆砌\" 的视觉质感；扇骨采用四川楠竹碳化工艺，浅褐色自然纹理与浅青色棉麻流苏呼应，整体呈现 \"自然材质承载非遗文化\" 的和谐氛围。"
+          }
+        ]
+      }
+    },
+    {
+      id: "clickable-3",
+      name: "戴森吹风机：科技护发新风尚品牌运营策划案", 
+      unitName: "短视频与自媒体运营",
+      isClickable: true,
+      content: {
+        title: "《戴森吹风机：科技护发新风尚》品牌运营策划案",
+        description: "通过整合营销文案、宣传方案、活动策划及私域运营方案，全面提升戴森吹风机在目标消费群体中的品牌影响力与市场转化率。",
+        images: [
+          { url: "/images/project-library/1.png", title: "品牌视觉设计" },
+          { url: "/images/project-library/2.png", title: "产品展示设计" },
+          { url: "/images/project-library/3.png", title: "营销物料设计" },
+          { url: "/images/project-library/4.png", title: "活动策划方案" }
+        ],
+        sections: [
+          {
+            title: "一、项目介绍", 
+            content: "本项目旨在通过整合营销文案、宣传方案、活动策划及私域运营方案，全面提升戴森吹风机在目标消费群体中的品牌影响力与市场转化率。项目以\"高端科技+精致生活\"为核心定位，既关注产品性能优势的突出，也注重用户体验的细腻塑造。通过线上线下结合的多渠道传播，项目将实现从品牌认知、兴趣激发、消费决策到复购沉淀的闭环路径。"
+          },
+          {
+            title: "二、品牌运营策略",
+            content: "以\"高端科技美学\"为核心风格，融合\"科技感\"与\"人性化\"双重属性——文案以简洁、专业、富有科技感的语言为基础，搭配生动、贴近生活的案例和情感化表达，营造\"科技不冰冷、高端亦亲和\"的语言质感；视觉设计上，以戴森标志性的蓝色为主色调，搭配简洁的线条和现代感的排版，整体呈现\"科技与人文融合\"的和谐氛围。"
+          }
+        ]
+      }
+    }
+  ];
   const [modalData, setModalData] = useState(undefined);
   const [projectList, setProjectList] = useState([]);
   const [projectCasesModalVisible, setProjectCasesModalVisible] =
@@ -119,8 +202,15 @@ const ProjectLibrary = () => {
 
 
   const handleProjectClick = async (item) => {
-    // 如果是我的项目，不允许点击
-    if (item?.isMyProject) {
+    // 如果是我的普通项目，不允许点击
+    if (item?.isMyProject && !item?.isClickable) {
+      return;
+    }
+    
+    // 如果是可点击的特殊项目，直接显示内容
+    if (item?.isClickable && item?.content) {
+      setModalData(item.content);
+      setProjectCasesModalVisible(true);
       return;
     }
     
@@ -190,6 +280,22 @@ const ProjectLibrary = () => {
       <div className="project-library-wrapper my-project-library">
         <p className="project-library-title">我完成的项目库</p>
         <div className="project-library-list">
+          {/* 可点击的特殊项目 */}
+          {clickableProjects.map((item) => (
+            <li 
+              key={item.id} 
+              className="project-library-item clickable-project-item"
+              onClick={() => handleProjectClick(item)}
+            >
+              <p className="project-library-item-title">{item.unitName}</p>
+              <div>
+                <p>{item.name}</p>
+                <span>详情 &gt;</span>
+              </div>
+            </li>
+          ))}
+          
+          {/* 普通的灰色项目 */}
           {myProjects.map((item) => (
             <Tooltip 
               key={item.id}