仓库初始化+岗位相关页面

src/views/Resume.vue

@@ -0,0 +1,166 @@
+<template>
+  <div class="resume-page dflex">
+    <SideNav />
+    <div class="resume-page__content">
+      <!-- 页面标题 + 上传按钮 -->
+      <div class="resume-page__header">
+        <h2 class="resume-page__title">我的简历</h2>
+        <button class="resume-page__upload-btn" @click="handleUpload">
+          <svg viewBox="0 0 16 16" fill="none" class="resume-page__upload-icon">
+            <path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+          </svg>
+          上传简历
+        </button>
+      </div>
+
+      <!-- 简历表格 -->
+      <div class="resume-page__table-wrap">
+        <table class="resume-page__table">
+          <thead>
+            <tr>
+              <th class="resume-page__th">简历</th>
+              <th class="resume-page__th">目标岗位</th>
+              <th class="resume-page__th">最近修改</th>
+              <th class="resume-page__th">创建时间</th>
+              <th class="resume-page__th resume-page__th--action"></th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr
+              v-for="item in resumeList"
+              :key="item.id"
+              class="resume-page__row"
+              @click="goDetail(item.id)"
+            >
+              <td class="resume-page__td">
+                <div class="resume-page__name-cell">
+                  <span class="resume-page__avatar" :style="{ background: item.avatarColor }">
+                    {{ item.avatarLetter }}
+                  </span>
+                  <span class="resume-page__name">{{ item.name }}</span>
+                  <span v-if="item.isDefault" class="resume-page__default-tag">默认</span>
+                </div>
+              </td>
+              <td class="resume-page__td">{{ item.targetJob }}</td>
+              <td class="resume-page__td">{{ item.updatedAt }}</td>
+              <td class="resume-page__td">{{ item.createdAt }}</td>
+              <td class="resume-page__td resume-page__td--action">
+                <button
+                  class="resume-page__more-btn"
+                  aria-label="更多操作"
+                  @click.stop="toggleMenu(item.id)"
+                >
+                  <svg viewBox="0 0 16 16" fill="currentColor" class="resume-page__more-svg">
+                    <circle cx="3" cy="8" r="1.5"/>
+                    <circle cx="8" cy="8" r="1.5"/>
+                    <circle cx="13" cy="8" r="1.5"/>
+                  </svg>
+                </button>
+                <!-- 弹出菜单 -->
+                <div v-if="activeMenuId === item.id" class="resume-page__popup" @click.stop>
+                  <div
+                    v-for="action in popupActions"
+                    :key="action"
+                    class="resume-page__popup-item"
+                    @click="handleAction(action, item.id)"
+                  >
+                    {{ action }}
+                  </div>
+                </div>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import SideNav from '@/components/SideNav.vue'
+
+const router = useRouter()
+
+// ==================== 类型定义 ====================
+
+/** 简历列表项类型 */
+interface ResumeItem {
+  id: string
+  name: string
+  avatarLetter: string
+  avatarColor: string
+  isDefault: boolean
+  targetJob: string
+  updatedAt: string
+  createdAt: string
+}
+
+// ==================== 数据（模拟数据，后续对接接口） ====================
+
+/** 简历列表 */
+const resumeList = ref<ResumeItem[]>([
+  {
+    id: '1',
+    name: '李华_产品经理',
+    avatarLetter: 'D',
+    avatarColor: '#1A1A2E',
+    isDefault: true,
+    targetJob: '产品经理',
+    updatedAt: '1个月前',
+    createdAt: '1个月前',
+  },
+  {
+    id: '2',
+    name: '李华_产品运营',
+    avatarLetter: 'C',
+    avatarColor: '#4FC2C9',
+    isDefault: false,
+    targetJob: '产品运营',
+    updatedAt: '1个月前',
+    createdAt: '1个月前',
+  },
+  {
+    id: '3',
+    name: '李华_产品经理',
+    avatarLetter: '?',
+    avatarColor: '#BFBFBF',
+    isDefault: false,
+    targetJob: '',
+    updatedAt: '1个月前',
+    createdAt: '1个月前',
+  },
+])
+
+// ==================== 页面状态 ====================
+
+/** 当前打开弹出菜单的简历 ID */
+const activeMenuId = ref<string | null>(null)
+
+/** 弹出菜单操作项 */
+const popupActions = ['设为默认简历', '编辑', '导出简历', '删除']
+
+// ==================== 事件处理 ====================
+
+/** 切换弹出菜单的显示/隐藏 */
+function toggleMenu(id: string) {
+  activeMenuId.value = activeMenuId.value === id ? null : id
+}
+
+/** 弹出菜单操作点击 */
+function handleAction(action: string, id: string) {
+  activeMenuId.value = null
+  console.log(action, id)
+}
+
+/** 上传简历 */
+function handleUpload() {
+  console.log('上传简历')
+}
+
+/** 跳转到简历详情页 */
+function goDetail(id: string) {
+  router.push(`/resume/${id}`)
+}
+</script>