offerpai/offerpai_web
7
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

左侧菜单，邀请，设置，和会员相关

Browse Source
This commit is contained in:
xuxin
2026-07-07 23:40:20 +08:00
parent b740e0cd39
commit 851310a901
18 changed files with 2090 additions and 2169 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/JobDetail.vue
+53 -2
View File
@@ -18,6 +18,39 @@
<!-- 内容区域（可滚动） -->
<div class="job-detail__body scrollbar-thin">
<!-- 加载中骨架屏 -->
<el-skeleton :loading="loading" animated :count="1">
<template #template>
<div class="job-detail__skeleton">
<!-- 模拟岗位标题行 -->
<el-skeleton-item variant="h1" style="width: 40%; height: 0.28rem; margin-bottom: 0.16rem;" />
<!-- 模拟标签行 -->
<div style="display: flex; gap: 0.1rem; margin-bottom: 0.2rem;">
<el-skeleton-item variant="text" style="width: 0.6rem; height: 0.2rem;" />
<el-skeleton-item variant="text" style="width: 0.8rem; height: 0.2rem;" />
<el-skeleton-item variant="text" style="width: 0.5rem; height: 0.2rem;" />
</div>
<!-- 模拟信息区 -->
<el-skeleton-item variant="text" style="width: 80%; height: 0.16rem; margin-bottom: 0.12rem;" />
<el-skeleton-item variant="text" style="width: 60%; height: 0.16rem; margin-bottom: 0.24rem;" />
<!-- 模拟描述区 -->
<el-skeleton-item variant="h3" style="width: 20%; height: 0.2rem; margin-bottom: 0.16rem;" />
<el-skeleton-item variant="text" style="width: 100%; height: 0.14rem; margin-bottom: 0.1rem;" />
<el-skeleton-item variant="text" style="width: 95%; height: 0.14rem; margin-bottom: 0.1rem;" />
<el-skeleton-item variant="text" style="width: 90%; height: 0.14rem; margin-bottom: 0.1rem;" />
<el-skeleton-item variant="text" style="width: 85%; height: 0.14rem; margin-bottom: 0.1rem;" />
<el-skeleton-item variant="text" style="width: 70%; height: 0.14rem; margin-bottom: 0.24rem;" />
<!-- 模拟公司信息区 -->
<el-skeleton-item variant="h3" style="width: 25%; height: 0.2rem; margin-bottom: 0.16rem;" />
<div style="display: flex; align-items: center; gap: 0.12rem; margin-bottom: 0.12rem;">
<el-skeleton-item variant="circle" style="width: 0.4rem; height: 0.4rem;" />
<el-skeleton-item variant="text" style="width: 1.2rem; height: 0.18rem;" />
</div>
<el-skeleton-item variant="text" style="width: 100%; height: 0.14rem; margin-bottom: 0.1rem;" />
<el-skeleton-item variant="text" style="width: 80%; height: 0.14rem;" />
</div>
</template>
<template #default>
<!-- 岗位基本信息区 -->
<div class="job-detail__header-section">
<!-- 左侧：岗位信息 -->
@@ -49,10 +82,10 @@
</div>
<!-- 右侧：匹配度卡片 -->
<div class="job-detail__match-card">
<div class="job-detail__match-card" :class="matchCardClass">
<div class="job-detail__match-top">
<span class="job-detail__match-score">{{ job.matchScore }}%</span>
<span class="job-detail__match-label">高匹配度</span>
<span class="job-detail__match-label">{{ matchLevelText }}</span>
</div>
<div class="job-detail__match-list">
<div class="job-detail__match-row" v-for="m in matchItems" :key="m.label">
@@ -119,6 +152,8 @@
<p class="job-detail__company-desc">{{ job.companyInfo.description }}</p>
</div>
</div>
</template>
</el-skeleton>
</div>
</div>
@@ -214,6 +249,22 @@ const matchItems = ref([
{ label: '过往经历', score: 0 },
])
/** 匹配度卡片动态class：根据分数区间切换高/中/低样式 */
const matchCardClass = computed(() => {
const score = job.matchScore
if (score >= 80) return 'job-detail__match-card--high'
if (score >= 40) return 'job-detail__match-card--medium'
return 'job-detail__match-card--low'
})
/** 匹配度等级文字 */
const matchLevelText = computed(() => {
const score = job.matchScore
if (score >= 80) return '高匹配度'
if (score >= 40) return '中匹配度'
return '低匹配度'
})
/** 技能标签项（matched 表示用户是否具备该技能，可点击切换） */
interface SkillTag {
/** 技能名称 */