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

2026-03-24 21:06:00 +08:00
commit 0468339d23
113 changed files with 18644 additions and 0 deletions
@@ -0,0 +1,434 @@
+<template>
+  <!-- 求职助手页面 — 准备阶段 -->
+  <div class="agent-page dflex">
+    <!-- 左侧导航栏 -->
+    <SideNav />
+
+    <!-- 主内容区域 -->
+    <div class="agent-page__content">
+      <!-- 个人资料编辑抽屉 -->
+      <ProfileEditDrawer
+        v-model="showEditDrawer"
+        :module="editModule"
+        :initial-data="editInitialData"
+        @save="handleSaveEdit"
+      />
+
+      <!-- 顶部步骤导航条 -->
+      <div class="agent-page__steps">
+        <template v-for="(step, index) in steps" :key="index">
+          <!-- 单个步骤项 -->
+          <div
+            class="agent-page__step"
+            :class="{ 'agent-page__step--active': currentStep === index + 1 }"
+          >
+            <span class="agent-page__step-number">{{ index + 1 }}</span>
+            <span class="agent-page__step-label">{{ step }}</span>
+          </div>
+          <!-- 步骤间分隔箭头 -->
+          <span v-if="index < steps.length - 1" class="agent-page__step-arrow">
+            <svg viewBox="0 0 16 16" fill="none">
+              <path d="M6 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+            </svg>
+          </span>
+        </template>
+      </div>
+
+      <!-- 主体内容区域 — 左右两栏布局 -->
+      <div class="agent-page__main">
+        <!-- ========== 第1步：确认个人资料 ========== -->
+        <template v-if="currentStep === 1">
+          <!-- 左侧：说明引导卡片 -->
+          <div class="agent-page__left">
+            <div class="agent-page__intro-card">
+              <!-- 图标 + 标题 -->
+              <div class="agent-page__intro-header">
+                <div class="agent-page__intro-icon">
+                  <svg viewBox="0 0 24 24" fill="none">
+                    <path d="M12 12c2.7 0 5-2.3 5-5s-2.3-5-5-5-5 2.3-5 5 2.3 5 5 5zm0 2c-3.3 0-10 1.7-10 5v2h20v-2c0-3.3-6.7-5-10-5z" fill="currentColor"/>
+                  </svg>
+                </div>
+                <h2 class="agent-page__intro-title">在开始之前请先确认你的个人资料是否无误</h2>
+              </div>
+
+              <!-- 说明文字 -->
+              <p class="agent-page__intro-desc">
+                请仔细对你的资料评估（包括个人信息、教育背景、工作履历及技能），确保资料齐全，让我能顺利为你开启求职之旅。
+              </p>
+
+              <!-- 导入个人资料入口 -->
+              <div class="agent-page__import-row">
+                <div class="agent-page__import-icon">
+                  <svg viewBox="0 0 24 24" fill="none">
+                    <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+                    <path d="M14 2v6h6M16 13H8M16 17H8M10 9H8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+                  </svg>
+                </div>
+                <span class="agent-page__import-text">李华的个人资料</span>
+              </div>
+
+              <!-- 确认并进入按钮 -->
+              <button class="agent-page__confirm-btn" @click="handleNext">
+                确认并进入
+              </button>
+            </div>
+          </div>
+
+          <!-- 右侧：个人档案预览 -->
+          <div class="agent-page__right">
+            <div class="agent-page__profile-wrapper">
+              <!-- 个人档案标题 -->
+              <div class="agent-page__profile-title">个人档案</div>
+              <!-- 引用 ProfilePageContent 组件 -->
+              <ProfilePageContent
+                :profile="profile"
+                @edit="handleEdit"
+              />
+            </div>
+          </div>
+        </template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import SideNav from '@/components/SideNav.vue'
+import ProfilePageContent from '@/components/ProfilePageContent.vue'
+import ProfileEditDrawer from '@/components/ProfileEditDrawer.vue'
+
+// ==================== 步骤导航数据 ====================
+
+/** 求职助手准备阶段的5个步骤名称 */
+const steps = [
+  '确认个人资料',
+  '确认目标',
+  '竞争力评估',
+  '开启自动申请',
+  '配置求职助手',
+]
+
+/** 当前激活的步骤序号（1-5） */
+const currentStep = ref(1)
+
+// ==================== 编辑抽屉状态 ====================
+
+/** 编辑抽屉是否显示 */
+const showEditDrawer = ref(false)
+
+/** 当前编辑的模块名称（info / education / work 等） */
+const editModule = ref('info')
+
+/** 当前编辑模块的初始数据 */
+const editInitialData = ref<Record<string, any>>({})
+
+// ==================== 个人档案数据 ====================
+
+// ==================== 模拟数据 ====================
+const profile = ref({
+  name: '李华',
+  phone: '13600008888',
+  email: '[email]',
+  idNumber: '510201420040328',
+  location: '北京',
+  wechat: '15100001232',
+  /** 教育经历 — 对应数据库 bg_user_profile_education */
+  education: [
+    {
+      /** 学校名称 */
+      school: '华南科技大学',
+      /** 专业 */
+      major: '会计学/工商管理',
+      /** 学历类型（0=全日制 1=非全日制） */
+      studyType: 0,
+      /** 学历（1=大专 2=本科 3=硕士 4=博士） */
+      degree: 2,
+      /** 入学年份 */
+      startYear: 2017,
+      /** 毕业年份 */
+      endYear: 2021,
+      /** 描述段落，格式：[{id, text}] */
+      description: [
+        { id: 'e1d1', text: 'GPA 3.8/4.0，主要课程包括金融工程、风险管理、量化投资等。' },
+      ],
+    },
+    {
+      school: '北京理工大学',
+      major: '金融学/应用经济学',
+      studyType: 0,
+      degree: 3,
+      startYear: 2021,
+      endYear: 2024,
+      description: [
+        { id: 'e2d1', text: 'GPA 3.7/4.0，研究方向为金融科技与量化交易。' },
+      ],
+    },
+  ],
+  /** 工作经历 — 对应数据库 bg_user_profile_work */
+  works: [
+    {
+      /** 公司名称 */
+      companyName: '华泰证券',
+      /** 职位 */
+      position: '投资经理',
+      /** 开始时间 */
+      startDate: '2024-07-01',
+      /** 结束时间 */
+      endDate: '',
+      /** 描述段落，格式：[{id, text}] */
+      description: [
+        { id: 'w1d1', text: '负责新能源行业投资研究，独立完成多份行业深度研究报告，为投资决策提供数据支持。' },
+        { id: 'w1d2', text: '管理投资组合，跟踪市场动态，定期输出投资策略建议和风险评估报告。' },
+      ],
+    },
+  ],
+  internships: [
+    {
+      /** 公司名称 */
+      companyName: '中信证券',
+      /** 职位 */
+      position: '投资分析师实习生',
+      /** 开始时间 */
+      startDate: '2022-06-01',
+      /** 结束时间 */
+      endDate: '2022-09-30',
+      /** 描述段落，格式：[{id, text}] */
+      description: [
+        { id: 'i1d1', text: '参与编制行业研究报告，协助产品经理进行市场分析，完成多项行业深度研究报告。' },
+        { id: 'i1d2', text: '参与公司新产品的市场调研，独立完成3份产品市场调研报告，为新产品策略提供数据支持。' },
+        { id: 'i1d3', text: '参与团队投资研究项目的数据清洗工作，运用Python进行数据分析和可视化。' },
+      ],
+    },
+    {
+      companyName: '招商证券',
+      position: '研究部实习生',
+      startDate: '2022-01-01',
+      endDate: '2022-05-31',
+      description: [
+        { id: 'i2d1', text: '协助分析师研究TMT行业趋势，参与公司研究报告撰写，深入了解行业发展动态。' },
+        { id: 'i2d2', text: '参与公司研究部门的数据整理，负责维护和更新行业数据库及金融模型数据。' },
+        { id: 'i2d3', text: '参与量化模型的搭建与优化测试，加深了对研究分析、定量分析的理解和应用能力。' },
+      ],
+    },
+  ],
+  projects: [
+    {
+      /** 项目名称 */
+      projectName: '中石化项目',
+      /** 所属公司 */
+      companyName: '中石化集团',
+      /** 担任角色 */
+      role: '数据分析师',
+      /** 开始时间 */
+      startDate: '2023-04-01',
+      /** 结束时间 */
+      endDate: '2023-09-30',
+      /** 描述段落，格式：[{id, text}] */
+      description: [
+        { id: 'p1d1', text: '参与石化行业数据分析研究，搭建行业数据监控系统，完善数据可视化展示方案。' },
+        { id: 'p1d2', text: '负责行业关键指标监测，数据驱动业务决策，协助完成3份产品研究报告。' },
+        { id: 'p1d3', text: '运用Python进行数据分析与可视化，加深了对行业研究、数据分析的理解。' },
+      ],
+    },
+    {
+      projectName: '综合运营',
+      companyName: '',
+      role: 'TMTV运营实习',
+      startDate: '2022-07-01',
+      endDate: '2022-12-31',
+      description: [
+        { id: 'p2d1', text: '分析市场数据并进行TMT行业深度分析，参与产品运营策略制定，完善运营数据分析体系。' },
+        { id: 'p2d2', text: '负责公司新媒体平台内容策划，负责维护和更新行业数据及金融模型数据。' },
+        { id: 'p2d3', text: '参与运营团队的数据分析和报告撰写，进行了深度分析，深刻认识到行业趋势的重要性。' },
+      ],
+    },
+  ],
+  skills: ['CET 6', 'Photoshop', 'Python'],
+  /** 竞赛经历 — 对应数据库 bg_user_profile_competition */
+  competitions: [
+    {
+      /** 竞赛名称 */
+      competitionName: '全国大学生创新创业大赛',
+      /** 获奖情况 */
+      award: '全国二等奖',
+      /** 获奖时间 */
+      awardDate: '2023.07.12',
+      /** 描述段落，格式：[{id, text}] */
+      description: [
+        { id: 'c1d1', text: '负责中央财经大学TMT产业研究，参与研究报告撰写，负责数据分析与模型搭建。参与公司新媒体平台内容策划，与公司媒体部门协作完成多个品牌营销方案。' },
+      ],
+    },
+    {
+      competitionName: '商业分析大赛',
+      award: '全国一等奖',
+      awardDate: '2023.07.12',
+      description: [
+        { id: 'c2d1', text: '' },
+      ],
+    },
+  ],
+  certificates: ['CFA', 'CMA'],
+})
+
+// ==================== 事件处理方法 ====================
+
+/** 打开编辑抽屉 — 根据模块名提取对应的初始数据传给抽屉 */
+function handleEdit(section: string) {
+  editModule.value = section
+
+  if (section === 'info') {
+    // 基本信息
+    editInitialData.value = {
+      name: profile.value.name,
+      email: profile.value.email,
+      phone: profile.value.phone,
+      location: profile.value.location,
+      wechat: profile.value.wechat,
+    }
+  } else if (section === 'education') {
+    // 教育经历 — 深拷贝 description 避免引用污染
+    editInitialData.value = {
+      education: profile.value.education.map(edu => ({
+        school: edu.school,
+        major: edu.major,
+        studyType: edu.studyType,
+        degree: edu.degree,
+        startYear: edu.startYear,
+        endYear: edu.endYear,
+        description: edu.description.map(d => ({ ...d })),
+      })),
+    }
+  } else if (section === 'work') {
+    // 工作经历
+    editInitialData.value = {
+      works: profile.value.works.map(exp => ({
+        companyName: exp.companyName,
+        position: exp.position,
+        startDate: exp.startDate,
+        endDate: exp.endDate,
+        description: exp.description.map(d => ({ ...d })),
+      })),
+    }
+  } else if (section === 'internship') {
+    // 实习经历
+    editInitialData.value = {
+      internships: (profile.value.internships || []).map(exp => ({
+        companyName: exp.companyName,
+        position: exp.position,
+        startDate: exp.startDate,
+        endDate: exp.endDate,
+        description: exp.description.map(d => ({ ...d })),
+      })),
+    }
+  } else if (section === 'project') {
+    // 项目经历
+    editInitialData.value = {
+      projects: (profile.value.projects || []).map(proj => ({
+        projectName: proj.projectName,
+        companyName: proj.companyName,
+        role: proj.role,
+        startDate: proj.startDate,
+        endDate: proj.endDate,
+        description: proj.description.map(d => ({ ...d })),
+      })),
+    }
+  } else if (section === 'competition') {
+    // 竞赛经历
+    editInitialData.value = {
+      competitions: profile.value.competitions.map(comp => ({
+        competitionName: comp.competitionName,
+        award: comp.award,
+        awardDate: comp.awardDate,
+        description: comp.description.map(d => ({ ...d })),
+      })),
+    }
+  } else if (section === 'skills') {
+    // 技能
+    editInitialData.value = {
+      skills: [...profile.value.skills],
+    }
+  } else if (section === 'certificate') {
+    // 证书
+    editInitialData.value = {
+      certificates: [...(profile.value.certificates || [])],
+    }
+  } else {
+    editInitialData.value = {}
+  }
+
+  showEditDrawer.value = true
+}
+
+/** 保存编辑数据 — 将抽屉返回的数据按模块回写到 profile */
+function handleSaveEdit(data: Record<string, any>) {
+  if (editModule.value === 'info') {
+    // 基本信息 — 直接合并
+    Object.assign(profile.value, data)
+  } else if (editModule.value === 'education') {
+    // 教育经历
+    profile.value.education = data.education.map((edu: any) => ({
+      school: edu.school,
+      major: edu.major,
+      studyType: edu.studyType,
+      degree: edu.degree,
+      startYear: edu.startYear,
+      endYear: edu.endYear,
+      description: edu.description.map((d: any) => ({ ...d })),
+    }))
+  } else if (editModule.value === 'work') {
+    // 工作经历
+    profile.value.works = data.works.map((work: any) => ({
+      companyName: work.companyName,
+      position: work.position,
+      startDate: work.startDate,
+      endDate: work.endDate,
+      description: work.description.map((d: any) => ({ ...d })),
+    }))
+  } else if (editModule.value === 'internship') {
+    // 实习经历
+    profile.value.internships = data.internships.map((intern: any) => ({
+      companyName: intern.companyName,
+      position: intern.position,
+      startDate: intern.startDate,
+      endDate: intern.endDate,
+      description: intern.description.map((d: any) => ({ ...d })),
+    }))
+  } else if (editModule.value === 'project') {
+    // 项目经历
+    profile.value.projects = data.projects.map((proj: any) => ({
+      projectName: proj.projectName,
+      companyName: proj.companyName,
+      role: proj.role,
+      startDate: proj.startDate,
+      endDate: proj.endDate,
+      description: proj.description.map((d: any) => ({ ...d })),
+    }))
+  } else if (editModule.value === 'competition') {
+    // 竞赛经历
+    profile.value.competitions = data.competitions.map((comp: any) => ({
+      competitionName: comp.competitionName,
+      award: comp.award,
+      awardDate: comp.awardDate,
+      description: comp.description.map((d: any) => ({ ...d })),
+    }))
+  } else if (editModule.value === 'skills') {
+    // 技能
+    profile.value.skills = [...data.skills]
+  } else if (editModule.value === 'certificate') {
+    // 证书
+    profile.value.certificates = [...data.certificates]
+  }
+}
+
+/** 处理"确认并进入"按钮点击 — 进入下一步 */
+function handleNext() {
+  if (currentStep.value < steps.length) {
+    currentStep.value++
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@use '../assets/styles/pages/agent';
+</style>