diff --git a/frontend/src/components/Bids.vue b/frontend/src/components/Bids.vue
index a8fe8cf..06747cf 100644
--- a/frontend/src/components/Bids.vue
+++ b/frontend/src/components/Bids.vue
@@ -12,6 +12,20 @@
       </el-select>
     </div>
     <el-table :data="bids" 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>
@@ -37,6 +51,9 @@
 
 <script setup lang="ts">
 import { ref } from 'vue'
+import axios from 'axios'
+import { ElMessage } from 'element-plus'
+import { Paperclip } from '@element-plus/icons-vue'
 
 interface Props {
   bids: any[]
@@ -75,6 +92,18 @@ const handleSizeChange = (size: number) => {
   currentPage.value = 1
   emit('fetch', currentPage.value, pageSize.value, selectedSource.value || undefined)
 }
+
+// 切换 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 ? '已置顶' : '已取消置顶')
+  } catch (error) {
+    ElMessage.error('操作失败')
+  }
+}
 </script>
 
 <style scoped>