sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

= 职业规划推荐

Browse Source
This commit is contained in:
danchaotaiyang
2026-01-21 16:12:19 +08:00
parent 3f7664f017
commit 7480651af2
25 changed files with 2270 additions and 284 deletions
Download Patch File Download Diff File Expand all files Collapse all files

227
pages/service/components/CareerRecommend.vue
View File

@@ -1,172 +1,15 @@
<!--suppress JSFileReferences, NpmUsedModulesInstalled, VueMissingComponentImportInspection -->
<!--suppress JSFileReferences, NpmUsedModulesInstalled, VueMissingComponentImportInspection, HtmlUnknownTag -->
<script setup>
import { computed, onMounted, ref, watch } from 'vue';
import { useCareerRecommendationStore } from './store';
import { recommendJob } from '@/apiRc/service/jobRecommend.js';
import { appUserInfo } from '@/apiRc/user/user.js';
import { ref } from 'vue';
import { useCareerRecommendationStore } from '@/stores/useCareerRecommendationStore';
import uniList from '@/uni_modules/uni-list/components/uni-list/uni-list.vue';
import uniListItem from '@/uni_modules/uni-list/components/uni-list-item/uni-list-item.vue';
const props = defineProps({
currentJobId: {
type: [ Number, String ],
default: null
},
currentJobName: {
type: String,
default: ''
}
});
const store = useCareerRecommendationStore();
const emit = defineEmits([ 'job-card-click', 'skills-updated' ]);
const popupRef = ref();
// 数据状态
const skillTags = ref([]);
const recommendedJobs = ref([]);
const isLoadingSkillTags = ref(false);
const isLoadingRecommend = ref(false);
// 计算属性
const currentJobDisplay = computed(() => props.currentJobName || '市场专员');
// 从 appSkillsList 中提取技能名称
function extractSkillsFromAppSkillsList(appSkillsList = []) {
return (Array.isArray(appSkillsList) ? appSkillsList : [])
.map(item => item?.name || item?.nameStr || '')
.filter(name => !!name && name.trim().length > 0);
}
// 从技能列表中提取技能名称用于显示（用于推荐职位数据）
function extractSkillNames(skillList = []) {
return (Array.isArray(skillList) ? skillList : [])
.map(item => item?.skillName || '')
.filter(name => !!name && name.trim().length > 0);
}
// 获取当前职位的技能标签
async function fetchCurrentJobSkills() {
isLoadingSkillTags.value = true;
try {
// 优先从 appUserInfo 接口获取技能标签
const response = await appUserInfo();
const userInfo = response?.data || {};
// 从 appSkillsList 中提取技能名称
const appSkillsList = Array.isArray(userInfo?.appSkillsList) ? userInfo.appSkillsList : [];
const apiSkills = extractSkillsFromAppSkillsList(appSkillsList);
// 如果接口返回了技能数据，使用接口数据
if (apiSkills.length > 0) {
skillTags.value = apiSkills;
} else {
// 如果接口没有返回技能数据，从缓存中读取
const cachedUserInfo = uni.getStorageSync('userInfo') || {};
const cachedAppSkills = Array.isArray(cachedUserInfo?.appSkillsList) ? cachedUserInfo.appSkillsList : [];
const cachedSkills = extractSkillsFromAppSkillsList(cachedAppSkills);
if (cachedSkills.length > 0) {
skillTags.value = cachedSkills;
} else {
skillTags.value = [];
}
}
// 通知父组件技能数据已更新
emit('skills-updated', {
currentJobSkills: skillTags.value,
recommendedJobs: recommendedJobs.value
});
} catch (error) {
// appUserInfo 接口调用失败时，从缓存中读取
const cachedUserInfo = uni.getStorageSync('userInfo') || {};
const cachedAppSkills = Array.isArray(cachedUserInfo?.appSkillsList) ? cachedUserInfo.appSkillsList : [];
const cachedSkills = extractSkillsFromAppSkillsList(cachedAppSkills);
if (cachedSkills.length > 0) {
skillTags.value = cachedSkills;
} else {
skillTags.value = [];
}
emit('skills-updated', {
currentJobSkills: skillTags.value,
recommendedJobs: recommendedJobs.value
});
} finally {
isLoadingSkillTags.value = false;
}
}
// 获取推荐职位列表
async function fetchRecommendedJobs() {
isLoadingRecommend.value = true;
try {
const response = await recommendJob({
jobName: props.currentJobName
});
const list = Array.isArray(response?.data) ? response.data : [];
recommendedJobs.value = list.map((item, index) => {
const skillList = Array.isArray(item?.skillList) ? item.skillList : [];
const skillNames = extractSkillNames(skillList);
return {
id: item?.jobId ?? index,
jobId: item?.jobId ?? null,
title: item?.jobName || `推荐职位${ index + 1 }`,
jobName: item?.jobName || '',
skills: skillNames,
rawSkills: skillList
};
});
// 通知父组件推荐职位数据已更新
emit('skills-updated', {
currentJobSkills: skillTags.value,
recommendedJobs: recommendedJobs.value
});
} catch (error) {
recommendedJobs.value = [];
emit('skills-updated', {
currentJobSkills: skillTags.value,
recommendedJobs: []
});
} finally {
isLoadingRecommend.value = false;
}
}
// 组件挂载时检查并调用
onMounted(() => {
setTimeout(() => {
if (props.currentJobName) {
fetchCurrentJobSkills();
fetchRecommendedJobs();
}
}, 100);
});
// 监听 props 变化，自动获取推荐职位和技能标签
watch(
() => [ props.currentJobId, props.currentJobName ],
() => {
if (props.currentJobName) {
fetchCurrentJobSkills();
fetchRecommendedJobs();
}
},
{ immediate: true }
);
// 事件处理
function handleJobCardClick(job) {
emit('job-card-click', job);
}
const eventSelectCurrentJob = () => {
popupRef.value?.open('bottom');
};
@@ -174,52 +17,62 @@ const eventSelectCurrentJob = () => {
const eventCloseCurrentJob = () => {
popupRef.value?.close('bottom');
};
const eventProfession = (item) => {
store.eventProfession(item);
store.eventSearch();
popupRef.value?.close('bottom');
};
</script>
<template>
<div class="career-recommend">
<!-- 当前职位信息卡片 -->
<div class="info-card">
<div class="card-title">当前职位信息</div>
<div class="card-content">
<span class="label">当前职位</span>
<span class="value" @click="eventSelectCurrentJob">{{ currentJobDisplay }}</span>
<div class="card-content" @click="eventSelectCurrentJob">
<span class="label">当前职位</span> <span class="value">{{ store.professionLabel }}</span>
</div>
</div>
<!-- 我的技能标签卡片 -->
<div class="info-card">
<div class="card-title">我的技能标签</div>
<div class="skill-tags">
<div v-for="(skill, index) in skillTags" :key="index" class="skill-tag">
<div v-for="(skill, index) in store.skillTags" :key="index" class="skill-tag">
{{ skill }}
</div>
<span v-if="!skillTags.length && !isLoadingSkillTags" class="empty-text">暂无技能数据</span>
<span v-if="isLoadingSkillTags" class="empty-text">加载中...</span>
<span v-if="!store.skillTags.length" class="empty-text">暂无技能数据</span>
</div>
</div>
<!-- 相似推荐职位 -->
<div class="section-title">
相似推荐职位
</div>
<div v-if="!isLoadingRecommend && recommendedJobs.length === 0" class="empty-text">暂无推荐职位</div>
<div v-for="(job, index) in recommendedJobs" :key="index" class="job-item-card" @click="handleJobCardClick(job)">
<div v-if="!store.result && store.result.length === 0" class="empty-text">暂无推荐职位</div>
<div v-for="(job, index) in store.result" :key="index" class="job-item-card">
<div class="job-header">
<span class="job-title">{{ job.title }}</span>
</div>
<div class="job-header">
<span>职业相似度：{{ job.percentage }}%</span>
</div>
<div class="job-skills">
<div v-for="(skill, skillIndex) in job.skills" :key="skillIndex" class="job-skill-tag">
{{ skill }}
<div v-for="tag in job.tags" :key="tag" class="job-skill-tag">
{{ tag }}
</div>
</div>
</div>
<uni-popup ref="popupRef" :border-radius="'20rpx 20rpx 0 0'" :is-mask-click="true" background-color="#FFFFFF" mask-background-color="rgba(255, 255, 255, 0.6)" type="bottom" @mask-click="eventCloseCurrentJob">
<div class="professions">
<scroll-view scroll-y style="height: 100%;">
<div class="professions-list">
<uni-list>
<template v-for="item in store.professionsRef" :key="item.label">
<uni-list-item :title="item.label" clickable showArrow @click="eventProfession(item)" />
</template>
</uni-list>
</div>
</scroll-view>
</div>
</uni-popup>
</div>
<uni-popup ref="popupRef" :border-radius="'20rpx 20rpx 0 0'" :is-mask-click="true" background-color="#FFFFFF" mask-background-color="rgba(255, 255, 255, 0.6)" type="bottom" @mask-click="eventCloseCurrentJob">
<div class="">
</div>
</uni-popup>
</template>
<style lang="scss" scoped>
@@ -297,7 +150,6 @@ const eventCloseCurrentJob = () => {
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
border-left: 6rpx solid #409EFF;
position: relative;
cursor: pointer;
}
.job-header {
@@ -354,4 +206,13 @@ const eventCloseCurrentJob = () => {
button::after {
border: none;
}
.professions {
width: 100vw;
height: 80vh;
.professions-list {
padding-left: 20px;
}
}
</style>

188
pages/service/store/career-path.js
View File

@@ -1,188 +0,0 @@
import { computed, ref, watch } from 'vue';
import { defineStore } from 'pinia';
import { useAuthUserStore, useBasicStore } from './index';
import { getCurrentPosition, getPath, getPathDetail } from '@/apiRc/service';
export const useCareerPathStore = defineStore('career-path', () => {
const storeBasic = useBasicStore();
const storeUser = useAuthUserStore();
const profession = ref('');
const professions = ref([]);
const professionsRef = computed(() => {
const userInfo = storeUser.userInfo;
if (!userInfo || !userInfo.professions || userInfo.professions.length === 0) {
return professions.value;
}
const userProfessionsLabels = userInfo.professions.map((d) => d.label);
let professionsA = [];
let professionsB = [];
professions.value.filter((d) => userProfessionsLabels.includes(d.label));
for (const d of professions.value) {
if (userProfessionsLabels.includes(d.label)) {
professionsA.push(d);
} else {
professionsB.push(d);
}
}
if (professionsA.length === 0) {
professionsA = userInfo.professions;
professionsB = professions.value;
}
return [...professionsA, ...professionsB];
});
const targetCareer = ref('');
const paths = ref([]);
const pathsRef = computed(() => {
return paths.value.filter((d) => {
return `${d.startJobId}` === profession.value;
});
});
const result = ref([]);
const fetchData = async () => {
try {
const { code, msg, data } = await getCurrentPosition();
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
professions.value = data.map((d) => {
return {
label: d.name,
value: `${d.jobId}`
};
});
} catch (e) {
console.warn(e);
}
};
const fetchDataPath = async () => {
try {
const { code, msg, data } = await getPath();
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
paths.value = data.map((d) => {
return {
label: d.endJob,
value: `${d.startJobId}-${d.endJobId}`,
startJobId: d.startJobId
};
});
} catch (e) {
console.warn(e);
}
};
const fetchResult = async () => {
if (!targetCareer.value) {
return;
}
const [startJobId, endJobId] = targetCareer.value.split('-');
const params = {
startJobId: Number(startJobId),
endJobId: Number(endJobId)
};
try {
const { code, msg, data } = await getPathDetail(params);
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
result.value = data.map((d, i) => {
return {
type: i === 0 ? 'start' : i === data.length - 1 ? 'end' : 'normal',
step: i,
title: d.name,
tags: d.skillNameList.split(',')
};
});
} catch (e) {
console.warn(e);
}
};
const eventChange = () => {
targetCareer.value = '';
};
const eventSearch = () => {
if (pathsRef.value.length === 0) {
ElMessage.warning({
message: '当前职业暂无发展路径，敬请期待！',
duration: 5000
});
return;
}
if (!profession.value) {
ElMessage.warning({
message: '请选择当前职位！',
duration: 5000
});
return;
}
if (!targetCareer.value) {
ElMessage.warning({
message: '请选择目标职业！',
duration: 5000
});
return;
}
void fetchResult();
};
watch(
() => storeBasic.loaded,
() => {
if (storeBasic.loaded) {
void fetchData();
void fetchDataPath();
}
}
);
watch(
() => professionsRef.value,
() => {
if (typeof professionsRef.value[0] !== 'undefined') {
if (professionsRef.value[0].value) {
profession.value = professionsRef.value[0].value;
}
}
}
);
watch(
() => profession.value,
() => {
const userInfo = storeUser.userInfo;
if (userInfo.professions[0] && profession.value === userInfo.professions[0].value) {
targetCareer.value = '';
}
}
);
return {
profession,
professionsRef,
targetCareer,
pathsRef,
result,
eventChange,
eventSearch
};
});

154
pages/service/store/career-recommendation.js
View File

@@ -1,154 +0,0 @@
import { computed, ref, watch } from 'vue';
import { defineStore } from 'pinia';
import { useBasicStore, useAuthUserStore } from './index';
import { getProfessions, getSkillTags, getRecommend } from '@/apiRc/service';
export const useCareerRecommendationStore = defineStore('career-recommendation', () => {
const storeBasic = useBasicStore();
const storeUser = useAuthUserStore();
const profession = ref('');
const professions = ref([]);
const professionsRef = computed(() => {
const userInfo = storeUser.userInfo;
if (!userInfo || !userInfo.professions || userInfo.professions.length === 0) {
return professions.value;
}
const userProfessionsLabels = userInfo.professions.map((d) => d.label);
let professionsA = [];
let professionsB = [];
professions.value.filter((d) => userProfessionsLabels.includes(d.label));
for (const d of professions.value) {
if (userProfessionsLabels.includes(d.label)) {
professionsA.push(d);
} else {
professionsB.push(d);
}
}
if (professionsA.length === 0) {
professionsA = userInfo.professions;
professionsB = professions.value;
}
return [...professionsA, ...professionsB];
});
const skills = ref([]);
const skillTags = computed(() => {
const userInfo = storeUser.userInfo;
if (userInfo.professions[0] && profession.value === userInfo.professions[0].value) {
return userInfo.skills.map((d) => d.label);
}
return skills.value;
});
const result = ref([]);
const fetchData = async () => {
try {
const { code, msg, data } = await getProfessions();
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
professions.value = data.map((d) => {
return {
label: d.name,
value: `${d.jobId}`
};
});
} catch (e) {
console.warn(e);
}
};
const fetchSkillTags = async () => {
const params = {
jobName: profession.value
};
try {
const { code, msg, data } = await getSkillTags(params);
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (typeof data !== 'undefined' && Array.isArray(data) && data.length > 0 && data[0]) {
skills.value = data[0].skillDetList.map((d) => d.skillName);
}
} catch (e) {
console.warn(e);
}
};
const fetchRecommend = async () => {
const params = {
jobName: profession.value
};
try {
const { code, msg, data } = await getRecommend(params);
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
result.value = data.map((d) => {
return {
title: d.jobName,
tags: d.skillList.map((d) => d.skillName),
percentage: d.similarityScore ?? 0
};
});
} catch (e) {
console.warn(e);
}
};
const eventSearch = () => {
void fetchRecommend();
};
watch(
() => storeBasic.loaded,
() => {
if (storeBasic.loaded) {
void fetchData();
}
}
);
watch(
() => profession.value,
() => {
if (profession.value) {
void fetchSkillTags();
}
},
{
immediate: true
}
);
watch(
() => professionsRef.value,
() => {
if (professionsRef.value[0]) {
profession.value = professionsRef.value[0].label;
}
}
);
return {
profession,
professions,
professionsRef,
skillTags,
result,
eventSearch
};
});

4
pages/service/store/index.js
View File

@@ -1,4 +0,0 @@
export * from './user';
export * from './career-recommendation';
export * from './career-path';
export * from './skill-development';

192
pages/service/store/skill-development.js
View File

@@ -1,192 +0,0 @@
import { computed, ref, watch } from 'vue';
import { defineStore } from 'pinia';
import { useAuthUserStore, useBasicStore } from './index';
import { getCurrentPosition, getPath, getSkill } from '@/apiRc/service';
export const useSkillDevelopmentStore = defineStore('skill-development', () => {
const storeBasic = useBasicStore();
const storeUser = useAuthUserStore();
const profession = ref('');
const professions = ref([]);
const professionsRef = computed(() => {
const userInfo = storeUser.userInfo;
if (!userInfo || !userInfo.professions || userInfo.professions.length === 0) {
return professions.value;
}
const userProfessionsLabels = userInfo.professions.map((d) => d.label);
let professionsA = [];
let professionsB = [];
professions.value.filter((d) => userProfessionsLabels.includes(d.label));
for (const d of professions.value) {
if (userProfessionsLabels.includes(d.label)) {
professionsA.push(d);
} else {
professionsB.push(d);
}
}
if (professionsA.length === 0) {
professionsA = userInfo.professions;
professionsB = professions.value;
}
return [...professionsA, ...professionsB];
});
const targetCareer = ref('');
const paths = ref([]);
const pathsRef = computed(() => {
return paths.value.filter((d) => {
return `${d.startJobId}` === profession.value;
});
});
const result = ref([]);
const fetchData = async () => {
try {
const { code, msg, data } = await getCurrentPosition();
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
professions.value = data.map((d) => {
return {
label: d.name,
value: `${d.jobId}`
};
});
} catch (e) {
console.warn(e);
}
};
const fetchDataPath = async () => {
try {
const { code, msg, data } = await getPath();
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
paths.value = data.map((d) => {
return {
label: d.endJob,
value: d.endJob,
startJobId: d.startJobId
};
});
} catch (e) {
console.warn(e);
}
};
const fetchResult = async () => {
const current = professionsRef.value.find((d) => d.value === profession.value);
const target = pathsRef.value.find((d) => d.value === targetCareer.value);
if (!current || !target) {
return;
}
const params = {
currentJobName: current.label,
targetJobName: target.label
};
try {
const { code, msg, data } = await getSkill(params);
if (code !== 0) {
$emitter.emit('error-message', msg);
return;
}
if (typeof data !== 'undefined' && Array.isArray(data) && data.length > 0 && data[0]) {
const excludes = data[0].currentSkillDetList.map((d) => d.skillId);
result.value = data[0].targetSkillDetList
.filter((d) => !excludes.includes(d.skillId))
.map((d) => {
return {
type: d.skillType,
title: d.skillName,
name: d.skillName,
weight: d.skillWeight,
score: d.skillScore
};
});
}
} catch (e) {
console.warn(e);
}
};
const eventChange = () => {
targetCareer.value = '';
};
const eventSearch = () => {
if (pathsRef.value.length === 0) {
ElMessage.warning({
message: '当前职业暂无发展路径，敬请期待！',
duration: 5000
});
return;
}
if (!profession.value) {
ElMessage.warning({
message: '请选择当前职位！',
duration: 5000
});
return;
}
if (!targetCareer.value) {
ElMessage.warning({
message: '请选择目标职业！',
duration: 5000
});
return;
}
void fetchResult();
};
watch(
() => storeBasic.loaded,
() => {
if (storeBasic.loaded) {
void fetchData();
void fetchDataPath();
}
}
);
watch(
() => professionsRef.value,
() => {
if (typeof professionsRef.value[0] !== 'undefined') {
if (professionsRef.value[0].value) {
profession.value = professionsRef.value[0].value;
}
}
}
);
watch(
() => profession.value,
() => {
const userInfo = storeUser.userInfo;
if (userInfo.professions[0] && profession.value === userInfo.professions[0].value) {
targetCareer.value = '';
}
}
);
return {
profession,
professionsRef,
targetCareer,
pathsRef,
result,
eventChange,
eventSearch
};
});

66
pages/service/store/user.js
View File

@@ -1,66 +0,0 @@
import { ref } from 'vue';
import { defineStore } from 'pinia';
import { getUserInfo, getUserName } from '@/apiRc/service';
export const useAuthUserStore = defineStore('auth-user', () => {
const token = ref('');
const userLoaded = ref(false);
const userInfoRef = ref({
userName: '',
professions: [],
skills: []
});
const fetchUserInfo = async () => {
const tokenA = await $getItem('tokenA');
const cryptogram = await $getItem('cryptogram');
if (!cryptogram) {
return;
}
token.value = cryptogram;
try {
const { code, msg, data } = await getUserInfo(cryptogram);
if (code !== 200) {
$emitter.emit('error-message', msg);
return;
}
if (!data) {
return;
}
userInfoRef.value.professions = data.jobTitles.map((d) => {
return {
label: d,
value: d
};
});
userInfoRef.value.skills = data.appSkillsList.map((d) => {
return {
label: d.name,
value: d.name
};
});
} catch (e) {
console.warn(e);
}
try {
const { code: c, msg: m, data: userName } = await getUserName({ accessToken: tokenA });
if (c !== 0 || !userName) {
$emitter.emit('error-message', m);
return;
}
userInfoRef.value.userName = userName.name;
userLoaded.value = true;
} catch (e) {
console.warn(e);
}
};
return {
token,
userInfo: userInfoRef,
userLoaded,
fetchUserInfo
};
});