From fbcd98dc46b1c56b511acc1afdb3fec596a26fb9 Mon Sep 17 00:00:00 2001
From: TianyangZhang <zty18395607196@163.com>
Date: Wed, 25 Mar 2026 16:19:19 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=8A=95=E9=80=92=E5=90=8E=E7=A6=81?=
 =?UTF-8?q?=E7=94=A8=E9=87=8D=E5=A4=8D=E7=82=B9=E5=87=BB=EF=BC=8C=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E5=B7=B2=E6=8A=95=E9=80=92=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

改动：
- 页面加载时检查用户是否已投递该职位
- 已投递的职位禁用投递按钮
- 按钮显示'已投递'而非'立即投递'
- 用户重复点击时显示警告提示'您已投递过该职位'
- 样式：禁用按钮改为灰色，cursor 改为 not-allowed

效果：
- 防止用户误操作或恶意重复投递
- 清晰提示用户已投递状态
- 即使刷新页面也能显示正确的投递状态

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 .../src/views/portal/JobDetailView.vue        | 60 +++++++++++++++----
 1 file changed, 50 insertions(+), 10 deletions(-)

diff --git a/offer_frontend/src/views/portal/JobDetailView.vue b/offer_frontend/src/views/portal/JobDetailView.vue
index 628a305..267e3f8 100644
--- a/offer_frontend/src/views/portal/JobDetailView.vue
+++ b/offer_frontend/src/views/portal/JobDetailView.vue
@@ -25,8 +25,13 @@
               <el-icon><Star /></el-icon>
               {{ collected ? '已收藏' : '收藏' }}
             </el-button>
-            <el-button class="btn-apply" @click="handleApply" :loading="applying">
-              立即投递
+            <el-button
+              class="btn-apply"
+              @click="handleApply"
+              :loading="applying"
+              :disabled="applied"
+            >
+              {{ applied ? '已投递' : '立即投递' }}
             </el-button>
           </div>
           <p class="apply-hint" v-if="!auth.isLoggedIn">登录后才能投递</p>
@@ -107,8 +112,14 @@
               <el-icon><Message /></el-icon>
               <span>{{ job.organization.email }}</span>
             </div>
-            <el-button class="btn-apply-sm" @click="handleApply" :loading="applying" style="margin-top:12px;width:100%">
-              立即投递
+            <el-button
+              class="btn-apply-sm"
+              @click="handleApply"
+              :loading="applying"
+              :disabled="applied"
+              style="margin-top:12px;width:100%"
+            >
+              {{ applied ? '已投递' : '立即投递' }}
             </el-button>
             <p class="apply-hint-sm" v-if="applied">已投递成功</p>
           </div>
@@ -122,7 +133,7 @@
 import { ref, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { getJob, toggleFavorite } from '@/api/jobs'
-import { applyJob } from '@/api/applications'
+import { applyJob, getMyApplications } from '@/api/applications'
 import { useAuthStore } from '@/stores/auth'
 import { ElMessage } from 'element-plus'
 import { Location, OfficeBuilding, Star, Message } from '@element-plus/icons-vue'
@@ -138,9 +149,23 @@ const collected = ref(false)
 
 onMounted(async () => {
   loading.value = true
-  const { data } = await getJob(route.params.id)
-  job.value = data
-  loading.value = false
+  try {
+    const { data } = await getJob(route.params.id)
+    job.value = data
+
+    // 如果用户已登录，检查是否已投递
+    if (auth.isLoggedIn && auth.isSeeker) {
+      try {
+        const { data: applications } = await getMyApplications()
+        // 检查该职位是否已在已投递列表中
+        applied.value = applications.results?.some(app => app.job.id === parseInt(route.params.id)) || false
+      } catch (e) {
+        console.error('Failed to fetch applications:', e)
+      }
+    }
+  } finally {
+    loading.value = false
+  }
 })
 
 function formatDate(dt) {
@@ -159,6 +184,8 @@ async function toggleCollect() {
 async function handleApply() {
   if (!auth.isLoggedIn) return router.push({ name: 'Login', query: { redirect: route.fullPath } })
   if (!auth.isSeeker) return ElMessage.warning('管理员账号无法投递职位')
+  if (applied.value) return ElMessage.warning('您已投递过该职位')
+
   applying.value = true
   try {
     await applyJob(job.value.id)
@@ -166,6 +193,7 @@ async function handleApply() {
     ElMessage.success('投递成功！')
   } catch (e) {
     if (e.response?.status === 400) {
+      applied.value = true
       ElMessage.warning(e.response.data?.detail || '您已投递过该职位')
     } else {
       ElMessage.error('投递失败，请先完善简历')
@@ -255,10 +283,16 @@ async function handleApply() {
   padding: 10px 28px;
   font-size: 15px;
 }
-.btn-apply:hover {
+.btn-apply:hover:not(:disabled) {
   background: #c42820 !important;
   border-color: #c42820 !important;
 }
+.btn-apply:disabled {
+  background: #ccc !important;
+  border-color: #ccc !important;
+  color: #fff !important;
+  cursor: not-allowed !important;
+}
 .apply-hint {
   font-size: 12px;
   color: #999;
@@ -445,10 +479,16 @@ async function handleApply() {
   color: #fff !important;
   font-weight: 600;
 }
-.btn-apply-sm:hover {
+.btn-apply-sm:hover:not(:disabled) {
   background: #c42820 !important;
   border-color: #c42820 !important;
 }
+.btn-apply-sm:disabled {
+  background: #ccc !important;
+  border-color: #ccc !important;
+  color: #fff !important;
+  cursor: not-allowed !important;
+}
 .apply-hint-sm {
   text-align: center;
   font-size: 12px;