反馈联调和职位列表交互bug

src/components/SettingsDeleteAccountDialog.vue

@@ -0,0 +1,211 @@
+<template>
+  <!-- 注销账号弹窗 — 多步骤流程 -->
+  <Teleport to="body">
+    <div v-if="modelValue" class="delete-account-overlay" @click="$emit('update:modelValue', false)">
+      <div class="delete-account-dialog" @click.stop>
+        <!-- 右上角关闭按钮 -->
+        <span class="delete-account-dialog__close" @click="$emit('update:modelValue', false)">✕</span>
+
+        <!-- 顶部步骤条 -->
+        <div class="delete-account-dialog__steps">
+          <div class="delete-account-dialog__step" :class="{ 'delete-account-dialog__step--active': currentStep === 1, 'delete-account-dialog__step--done': currentStep > 1 }">
+            <span class="delete-account-dialog__step-num">1</span>
+            <span class="delete-account-dialog__step-label">须知确认</span>
+          </div>
+          <div class="delete-account-dialog__step-line"></div>
+          <div class="delete-account-dialog__step" :class="{ 'delete-account-dialog__step--active': currentStep === 2, 'delete-account-dialog__step--done': currentStep > 2 }">
+            <span class="delete-account-dialog__step-num">2</span>
+            <span class="delete-account-dialog__step-label">安全验证</span>
+          </div>
+          <div class="delete-account-dialog__step-line"></div>
+          <div class="delete-account-dialog__step" :class="{ 'delete-account-dialog__step--active': currentStep === 3 }">
+            <span class="delete-account-dialog__step-num">3</span>
+            <span class="delete-account-dialog__step-label">完成</span>
+          </div>
+        </div>
+
+        <!-- 步骤1：须知确认 -->
+        <template v-if="currentStep === 1">
+          <h2 class="delete-account-dialog__title">注销账号前，请确认以下事项</h2>
+          <p class="delete-account-dialog__subtitle">注销账号为不可撤回操作。请在继续前认真阅读以下内容，确认你已了解注销后的影响。</p>
+
+          <div class="delete-account-dialog__body">
+            <!-- 左侧警告列表 -->
+            <div class="delete-account-dialog__warnings">
+              <!-- 注销后不能撤回 -->
+              <div class="delete-account-dialog__warning-item delete-account-dialog__warning-item--danger">
+                <div class="delete-account-dialog__warning-icon delete-account-dialog__warning-icon--danger">!</div>
+                <div class="delete-account-dialog__warning-content">
+                  <div class="delete-account-dialog__warning-title delete-account-dialog__warning-title--danger">注销后不能撤回</div>
+                  <p class="delete-account-dialog__warning-desc">账号注销完成后，你将无法再使用该账号登录 Offer 派，账号也无法由你自行恢复。</p>
+                </div>
+              </div>
+              <!-- 权益清零 -->
+              <div class="delete-account-dialog__warning-item">
+                <div class="delete-account-dialog__warning-icon delete-account-dialog__warning-icon--orange">●</div>
+                <div class="delete-account-dialog__warning-content">
+                  <div class="delete-account-dialog__warning-title">权益清零</div>
+                  <p class="delete-account-dialog__warning-desc">账号内的 AI 简历优化、岗位匹配、投递追踪、内推码、求职信草稿、面试准备记录等数据与权益将被清空。</p>
+                </div>
+              </div>
+              <!-- 会员权益不退款 -->
+              <div class="delete-account-dialog__warning-item">
+                <div class="delete-account-dialog__warning-icon delete-account-dialog__warning-icon--orange">●</div>
+                <div class="delete-account-dialog__warning-content">
+                  <div class="delete-account-dialog__warning-title">会员权益不退款</div>
+                  <p class="delete-account-dialog__warning-desc">如你的账号仍有会员有效期或已购买权益，注销账号后视为你主动放弃继续使用，已开通会员权益不做退款处理；法律法规另有规定的除外。</p>
+                </div>
+              </div>
+
+              <!-- 确认勾选 -->
+              <div class="delete-account-dialog__confirm-check">
+                <label class="delete-account-dialog__checkbox-label">
+                  <input type="checkbox" v-model="hasConfirmed" class="delete-account-dialog__checkbox" />
+                  <span>我已阅读并确认《账号注销须知》，理解注销后不能撤回、权益清零、会员权益不退款。</span>
+                </label>
+              </div>
+
+              <!-- 底部按钮 -->
+              <div class="delete-account-dialog__actions">
+                <button class="delete-account-dialog__btn delete-account-dialog__btn--outline" disabled>
+                  {{ hasConfirmed ? '已勾选确认注销须知' : '请先勾选确认注销须知' }}
+                </button>
+                <button class="delete-account-dialog__btn delete-account-dialog__btn--danger" :disabled="!hasConfirmed" @click="goToStep2">
+                  继续注销
+                </button>
+              </div>
+            </div>
+
+            <!-- 右侧账户状态卡片 -->
+            <div class="delete-account-dialog__account-status">
+              <h3 class="delete-account-dialog__status-title">当前账户状态</h3>
+              <div class="delete-account-dialog__status-row">
+                <span class="delete-account-dialog__status-label">当前会员</span>
+                <span class="delete-account-dialog__status-value">{{ memberType }}</span>
+              </div>
+              <div class="delete-account-dialog__status-row">
+                <span class="delete-account-dialog__status-label">有效期至</span>
+                <span class="delete-account-dialog__status-value">{{ expireDate }}</span>
+              </div>
+              <div class="delete-account-dialog__status-row">
+                <span class="delete-account-dialog__status-label">处理规则</span>
+                <span class="delete-account-dialog__status-value delete-account-dialog__status-value--danger">剩余权益将清零</span>
+              </div>
+              <div class="delete-account-dialog__status-notice">
+                注销后剩余会员权益将清零，不做退款处理。
+              </div>
+            </div>
+          </div>
+        </template>
+
+        <!-- 步骤2：安全验证 -->
+        <template v-if="currentStep === 2">
+          <h2 class="delete-account-dialog__title">安全验证</h2>
+          <p class="delete-account-dialog__subtitle">为保护账号安全，请完成身份验证后继续注销流程。</p>
+          <div class="delete-account-dialog__verify">
+            <div class="delete-account-dialog__verify-card">
+              <h3 class="delete-account-dialog__verify-card-title">验证手机号</h3>
+              <p class="delete-account-dialog__verify-card-desc">验证码将发送至 +86 138****8888</p>
+              <div class="delete-account-dialog__verify-input-row">
+                <input v-model="verifyCode" type="text" maxlength="6" placeholder="请输入验证码" class="delete-account-dialog__verify-input" />
+                <button class="delete-account-dialog__verify-send" :disabled="countdown > 0" @click="sendCode">
+                  {{ countdown > 0 ? `${countdown}s 后重发` : '获取验证码' }}
+                </button>
+              </div>
+              <button class="delete-account-dialog__verify-next-btn" :disabled="verifyCode.length < 4" @click="handleConfirmDelete">下一步</button>
+              <p class="delete-account-dialog__verify-tip">完成验证后进入最终确认。</p>
+            </div>
+          </div>
+        </template>
+
+        <!-- 步骤3：完成 -->
+        <template v-if="currentStep === 3">
+          <div class="delete-account-dialog__done">
+            <div class="delete-account-dialog__done-icon">✓</div>
+            <h2 class="delete-account-dialog__title">账号注销申请已提交</h2>
+            <p class="delete-account-dialog__subtitle">你的账号将在 7 个工作日内完成注销处理。在此期间如需撤回，请联系客服。</p>
+            <button class="delete-account-dialog__btn delete-account-dialog__btn--primary" @click="handleFinish">我知道了</button>
+          </div>
+        </template>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import { useRouter } from 'vue-router'
+import { useStore } from 'vuex'
+
+/** 组件 Props */
+const props = defineProps<{ modelValue: boolean }>()
+
+/** 组件 Emits */
+const emit = defineEmits<{ (e: 'update:modelValue', value: boolean): void }>()
+
+const router = useRouter()
+const store = useStore()
+
+/** 当前步骤 */
+const currentStep = ref(1)
+
+/** 是否已勾选确认 */
+const hasConfirmed = ref(false)
+
+/** 验证码 */
+const verifyCode = ref('')
+
+/** 倒计时秒数 */
+const countdown = ref(0)
+
+/** 倒计时定时器 */
+let timer: ReturnType<typeof setInterval> | null = null
+
+/** 会员类型 */
+const memberType = ref('季度会员')
+
+/** 到期日期 */
+const expireDate = ref('2026-xx-xx')
+
+/** 弹窗打开时重置状态 */
+watch(() => props.modelValue, (val) => {
+  if (val) {
+    currentStep.value = 1
+    hasConfirmed.value = false
+    verifyCode.value = ''
+    countdown.value = 0
+  }
+  document.body.style.overflow = val ? 'hidden' : ''
+})
+
+/** 进入步骤2 */
+const goToStep2 = () => {
+  currentStep.value = 2
+}
+
+/** 发送验证码 */
+const sendCode = () => {
+  countdown.value = 60
+  timer = setInterval(() => {
+    countdown.value--
+    if (countdown.value <= 0 && timer) {
+      clearInterval(timer)
+      timer = null
+    }
+  }, 1000)
+  ElMessage.success('验证码已发送')
+}
+
+/** 确认注销 */
+const handleConfirmDelete = () => {
+  // TODO: 调用注销接口
+  currentStep.value = 3
+}
+
+/** 完成 — 关闭弹窗并退出登录 */
+const handleFinish = () => {
+  emit('update:modelValue', false)
+  store.commit('SET_AUTHENTICATED', false)
+  router.push('/')
+}
+</script>

src/components/SettingsDialog.vue

@@ -227,6 +227,9 @@
 
     <!-- 求职目标设置弹窗 -->
     <JobGoalDialog v-model="showGoalDialog" />
+
+    <!-- 注销账号弹窗 -->
+    <SettingsDeleteAccountDialog v-model="showDeleteAccount" />
   </Teleport>
 </template>
 
@@ -239,6 +242,7 @@ import JobGoalDialog from './JobGoalDialog.vue'
 import { resolveRegionName } from '@/utils/region'
 import { resolveIndustryName } from '@/utils/industry'
 import { resolveJobCategoryName } from '@/utils/jobCategory'
+import SettingsDeleteAccountDialog from './SettingsDeleteAccountDialog.vue'
 
 /** 组件 Props — 控制弹窗显示/隐藏 */
 const props = defineProps<{ modelValue: boolean }>()
@@ -277,6 +281,9 @@ const reminders = reactive({
 /** 求职目标弹窗显示状态 */
 const showGoalDialog = ref(false)
 
+/** 注销账号弹窗显示状态 */
+const showDeleteAccount = ref(false)
+
 /** 岗位名称列表 */
 const intentionCategoryNames = computed(() => {
   const ids = store.state.jobIntention.categoryIds || []
@@ -313,15 +320,9 @@ watch(() => props.modelValue, (val) => {
   }
 })
 
-/** 注销账号 — 弹出二次确认 */
+/** 注销账号 — 打开注销账号弹窗 */
 const handleDeleteAccount = () => {
-  ElMessageBox.confirm('此操作将永久删除你的账号及所有数据，是否继续？', '注销账号', {
-    confirmButtonText: '确认注销',
-    cancelButtonText: '取消',
-    type: 'warning',
-  }).then(() => {
-    ElMessage.success('账号已注销')
-  }).catch(() => {})
+  showDeleteAccount.value = true
 }
 
 /** 管理订阅 */

src/components/SideNav.vue

@@ -83,11 +83,11 @@
             <div class="feedback-dialog__label">*你想向我们反馈什么问题？</div>
             <div class="feedback-dialog__options">
               <div
-                v-for="opt in feedbackOptions"
-                :key="opt"
+                v-for="(opt,index) in feedbackOptions"
+                :key="index"
                 class="feedback-dialog__option"
                 :class="{ 'feedback-dialog__option--active': feedbackType === opt }"
-                @click="feedbackType = opt"
+                @click="feedbackType = opt, feedbackTypeIndex = index+1"
               >
                 {{ opt }}
               </div>
@@ -123,6 +123,7 @@ import { useStore } from 'vuex'
 import SettingsDialog from '@/components/SettingsDialog.vue'
 import { checkLogin } from '@/api/auth'
 import { fetchMessageList, fetchUnreadCount, markMessageRead } from '@/api/message'
+import {userFeedback} from '@/api/setting'
 import type { MessageDto } from '@/api/message'
 import navJobsIcon from '@/assets/images/nav/nav-jobs-icon.png'
 import navResumeIcon from '@/assets/images/nav/nav-resume-icon.png'
@@ -193,7 +194,9 @@ const showMessageDialog = ref(false)
 const showFeedbackDialog = ref(false)
 const showSettingsDialog = ref(false)
 const feedbackType = ref('')
+const feedbackTypeIndex = ref(0)
 const feedbackDetail = ref('')
+import { ElMessage } from 'element-plus'
 
 // ==================== 站内信相关 ====================
 /** 未读消息数量 */
@@ -328,12 +331,30 @@ watch(showMessageDialog, (val) => {
 
 const feedbackOptions = ['Bug反馈', '功能建议', '使用体验', '订阅及会员权益相关问题', '其它']
 
-function handleFeedbackSubmit() {
-  // TODO: 调用反馈提交接口
-  console.log('反馈类型:', feedbackType.value, '详情:', feedbackDetail.value)
-  feedbackType.value = ''
-  feedbackDetail.value = ''
-  showFeedbackDialog.value = false
+
+/**
+ * 提交反馈
+ */
+async function handleFeedbackSubmit() {
+
+  console.log('反馈类型:', feedbackType.value,'类型index：', feedbackTypeIndex.value, '详情:', feedbackDetail.value)
+  if(feedbackTypeIndex.value<1||feedbackDetail.value.trim()==''){
+    ElMessage.warning('请选择问题并填写反馈内容')
+  }else{
+
+    //反馈接口
+    await userFeedback({
+      type: feedbackTypeIndex.value,
+      content: feedbackDetail.value
+    })
+    ElMessage.success('提交成功')
+    feedbackType.value = ''
+    feedbackDetail.value = ''
+    feedbackTypeIndex.value = 0
+    showFeedbackDialog.value = false
+  }
+
+
 }
 
 /**