From f050d38140e567fdf149fbd5667725512c5e46e1 Mon Sep 17 00:00:00 2001
From: dmy <dmy@dmy.com>
Date: Tue, 13 Jan 2026 21:16:23 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=9E=E7=8E=B0=20PinnedProject=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E4=B8=8E=E7=88=B6=E7=BB=84=E4=BB=B6=E7=9A=84?=
 =?UTF-8?q?=E5=8F=8C=E5=90=91=E4=BA=A4=E4=BA=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

添加 PinnedProject 组件引用和 pin-changed 事件处理
在 Dashboard 和 Dashboard-AI 中同步 pin 状态
暴露 loadPinnedBids 方法供父组件调用
---
 frontend/src/components/Dashboard-AI.vue  | 18 ++++++++-
 frontend/src/components/Dashboard.vue     | 46 ++++++++++++++++++++++-
 frontend/src/components/PinnedProject.vue | 11 ++++++
 3 files changed, 72 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/Dashboard-AI.vue b/frontend/src/components/Dashboard-AI.vue
index d7f6e1a..a737d3b 100644
--- a/frontend/src/components/Dashboard-AI.vue
+++ b/frontend/src/components/Dashboard-AI.vue
@@ -7,7 +7,7 @@
         获取 AI 推荐
       </el-button>
     </div>
-    <PinnedProject />
+    <PinnedProject ref="pinnedProjectRef" @pin-changed="handlePinChanged" />
     <el-row :gutter="20">
       <el-col :span="24">
         <el-card class="box-card" shadow="hover">
@@ -328,6 +328,18 @@ const getConfidenceType = (confidence: number) => {
   return 'info'
 }
 
+// PinnedProject 组件引用
+const pinnedProjectRef = ref<any>(null)
+
+// 处理 PinnedProject 组件的 pin 状态改变事件
+const handlePinChanged = async (title: string) => {
+  // 更新对应推荐项目的 pin 状态
+  const rec = aiRecommendations.value.find(r => r.title === title)
+  if (rec) {
+    rec.pin = false
+  }
+}
+
 // 切换 AI 推荐项目的 Pin 状态
 const togglePin = async (item: AIRecommendation) => {
   try {
@@ -335,6 +347,10 @@ const togglePin = async (item: AIRecommendation) => {
     await axios.patch(`/api/bids/${encodeURIComponent(item.title)}/pin`, { pin: newPinStatus })
     item.pin = newPinStatus
     ElMessage.success(newPinStatus ? '已置顶' : '已取消置顶')
+    // 刷新 PinnedProject 组件的数据
+    if (pinnedProjectRef.value) {
+      pinnedProjectRef.value.loadPinnedBids()
+    }
   } catch (error) {
     ElMessage.error('操作失败')
   }
diff --git a/frontend/src/components/Dashboard.vue b/frontend/src/components/Dashboard.vue
index 7f19648..982be19 100644
--- a/frontend/src/components/Dashboard.vue
+++ b/frontend/src/components/Dashboard.vue
@@ -7,7 +7,7 @@
         立刻抓取
       </el-button>
     </div>
-    <PinnedProject />
+    <PinnedProject ref="pinnedProjectRef" @pin-changed="handlePinChanged" />
     <el-divider />
     <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
       <h3 style="margin: 0;">Today's Bids</h3>
@@ -48,6 +48,20 @@
       </div>
     </div>
     <el-table :data="filteredTodayBids" v-loading="loading" style="width: 100%">
+      <el-table-column label="Pin" width="60" align="center">
+        <template #default="scope">
+          <el-icon
+            :style="{
+              color: scope.row.pin ? '#f56c6c' : '#909399',
+              cursor: 'pointer',
+              fontSize: '18px'
+            }"
+            @click="togglePin(scope.row)"
+          >
+            <Paperclip />
+          </el-icon>
+        </template>
+      </el-table-column>
       <el-table-column prop="title" label="Title">
         <template #default="scope">
           <a :href="scope.row.url" target="_blank">{{ scope.row.title }}</a>
@@ -65,7 +79,7 @@
 import { ref, computed, watch } from 'vue'
 import axios from 'axios'
 import { ElMessage } from 'element-plus'
-import { Refresh, ArrowDown } from '@element-plus/icons-vue'
+import { Refresh, ArrowDown, Paperclip } from '@element-plus/icons-vue'
 import PinnedProject from './PinnedProject.vue'
 
 interface Props {
@@ -271,6 +285,34 @@ const handleCrawl = async () => {
   }
 }
 
+// PinnedProject 组件引用
+const pinnedProjectRef = ref<any>(null)
+
+// 处理 PinnedProject 组件的 pin 状态改变事件
+const handlePinChanged = async (title: string) => {
+  // 更新 todayBids 中对应项目的 pin 状态
+  const bid = props.todayBids.find(b => b.title === title)
+  if (bid) {
+    bid.pin = false
+  }
+}
+
+// 切换 Today's Bids 的 Pin 状态
+const togglePin = async (item: any) => {
+  try {
+    const newPinStatus = !item.pin
+    await axios.patch(`/api/bids/${encodeURIComponent(item.title)}/pin`, { pin: newPinStatus })
+    item.pin = newPinStatus
+    ElMessage.success(newPinStatus ? '已置顶' : '已取消置顶')
+    // 刷新 PinnedProject 组件的数据
+    if (pinnedProjectRef.value) {
+      pinnedProjectRef.value.loadPinnedBids()
+    }
+  } catch (error) {
+    ElMessage.error('操作失败')
+  }
+}
+
 // 初始化时加载保存的关键字和日期范围
 loadSavedKeywords()
 loadSavedDateRange()
diff --git a/frontend/src/components/PinnedProject.vue b/frontend/src/components/PinnedProject.vue
index adff2a2..6939dc2 100644
--- a/frontend/src/components/PinnedProject.vue
+++ b/frontend/src/components/PinnedProject.vue
@@ -52,6 +52,10 @@ import axios from 'axios'
 import { ElMessage } from 'element-plus'
 import { Loading, InfoFilled, Paperclip } from '@element-plus/icons-vue'
 
+const emit = defineEmits<{
+  pinChanged: [title: string]
+}>()
+
 const pinnedBids = ref<any[]>([])
 const pinnedLoading = ref(false)
 
@@ -77,6 +81,8 @@ const togglePin = async (item: any) => {
       pinnedBids.value.splice(index, 1)
     }
     ElMessage.success('已取消置顶')
+    // 通知父组件 pin 状态已改变，传递 title
+    emit('pinChanged', item.title)
   } catch (error) {
     ElMessage.error('操作失败')
   }
@@ -96,6 +102,11 @@ const formatDate = (dateStr: string) => {
 onMounted(() => {
   loadPinnedBids()
 })
+
+// 暴露方法给父组件调用
+defineExpose({
+  loadPinnedBids
+})
 </script>
 
 <style scoped>