=【职业图谱】职业推荐 - 携参跳转

This commit is contained in:
2026-06-17 09:48:42 +08:00
parent 6153e9e38b
commit c4e1f7585a
3 changed files with 89 additions and 49 deletions

View File

@@ -46,6 +46,7 @@ const store = useCareerRecommendationStore();
<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 class="job-search" @click="store.eventJobSearch(job)">职位搜索</div>
</div>
<div class="job-header">
<span>职业相似度{{ job.percentage }}%</span>
@@ -157,6 +158,29 @@ const store = useCareerRecommendationStore();
width: 100%;
}
.job-search {
position: absolute;
top: 5px;
right: 5px;
padding: 6px 20px;
border-radius: 5px;
font-size: 16px;
font-weight: 500;
color: #333333;
background: #ffd4b8;
border: none;
cursor: pointer;
transition: all 0.2s ease;
&:hover {
background: #ffc9a3;
}
&:active {
transform: scale(0.98);
}
}
.job-skills {
display: flex;
flex-wrap: wrap;

View File

@@ -74,11 +74,16 @@ async function choosePosition(index) {
getJobList('add');
}
onLoad(() => {
onLoad((query) => {
let arr = uni.getStorageSync('searchList');
if (arr) {
historyList.value = uni.getStorageSync('searchList');
}
const {job} = query;
if (job) {
searchValue.value = job;
searchBtn();
}
});
function changeType(type) {
@@ -192,14 +197,14 @@ function dataToImg(data) {
padding: 0 28rpx 28rpx 28rpx
}
.Detailscroll-view{
flex: 1
overflow: hidden
flex: 1;
overflow: hidden;
}
.container{
display: flex
flex-direction: column
background: #F4f4f4
display: flex;
flex-direction: column;
background: #F4f4f4;
height: 100vh;
.custom-header {
background-color: #fff;
@@ -214,7 +219,7 @@ function dataToImg(data) {
.top {
display: flex;
align-items: center;
justify-content: space-between
justify-content: space-between;
background-color: #fff;
padding: 20rpx 20rpx;
.btnback{
@@ -224,11 +229,9 @@ function dataToImg(data) {
.search-box{
flex: 1;
padding: 0 24rpx 0 6rpx;
position: relative
position: relative;
.inputed {
padding-left: 30rpx
width: 100%;
background: #F8F8F8;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 400;
@@ -241,9 +244,9 @@ function dataToImg(data) {
border-radius: 75rpx 75rpx 75rpx 75rpx;
}
.iconsearch{
position: absolute
top: 50%
left: 36rpx
position: absolute;
top: 50%;
left: 36rpx;
transform: translate(0, -50%)
}
}
@@ -258,14 +261,14 @@ function dataToImg(data) {
}
}
.main-content{
background: #FFFFFF
height: 100%
background: #FFFFFF;
height: 100%;
margin-top: 140rpx;
.content-top{
padding: 28rpx
display: flex
justify-content: space-between
align-items: center
padding: 28rpx;
display: flex;
justify-content: space-between;
align-items: center;
.top-left{
font-weight: 600;
font-size: 36rpx;
@@ -275,12 +278,12 @@ function dataToImg(data) {
}
.content-history{
padding: 0 28rpx;
display: flex
flex-wrap: wrap
display: flex;
flex-wrap: wrap;
.history-tag{
margin-right: 40rpx
margin-bottom: 20rpx
white-space: nowrap
margin-right: 40rpx;
margin-bottom: 20rpx;
white-space: nowrap;
font-weight: 400;
font-size: 28rpx;
color: #333333;
@@ -292,17 +295,17 @@ function dataToImg(data) {
}
}
.Detailscroll-view{
flex: 1
overflow: hidden
flex: 1;
overflow: hidden;
margin-top: 140rpx;
}
}
.slot-item
.slot-item {
// background: #f4f4f4;
background: #FFFFFF;
.job-info{
padding: 10rpx 24rpx 24rpx 24rpx
padding: 10rpx 24rpx 24rpx 24rpx;
}
.job-image{
width: 100%;
@@ -319,14 +322,14 @@ function dataToImg(data) {
.cover-triangle{
position: absolute;
right: 20rpx;
top: 20rpx
width: 36rpx
height: 36rpx
border-radius: 50%
background: rgba(0,0,0,0.3)
top: 20rpx;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
background: rgba(0,0,0,0.3);
}
.cover-triangle::after {
content: '';
content: "";
position: absolute;
top: 50%;
left: 50%;
@@ -338,26 +341,32 @@ function dataToImg(data) {
border-bottom: 12rpx solid #fff;
}
}
.salary
.salary {
color: #4C6EFB;
font-size: 28rpx
display: flex
align-items: flex-start
justify-content: space-between
.flame
margin-top: 4rpx
margin-right: 4rpx
width: 24rpx
height: 31rpx
.title
font-size: 28rpx;
display: flex;
align-items: flex-start;
justify-content: space-between;
.flame {
margin-top: 4rpx;
margin-right: 4rpx;
width: 24rpx;
height: 31rpx;
}
}
.title {
font-weight: 500;
font-size: 32rpx;
color: #333333;
margin-top: 6rpx;
white-space: pre-wrap
.desc
white-space: pre-wrap;
}
.desc {
font-weight: 400;
font-size: 24rpx;
color: #6C7282;
margin-top: 6rpx;
}
}
</style>

View File

@@ -1,10 +1,11 @@
import { computed, ref, watch } from 'vue';
import { computed, ref, watch, inject } from 'vue';
import { defineStore, storeToRefs } from 'pinia';
import useUserStore from '@/stores/useUserStore';
import { getProfessions, getRecommend, getSkillTags } from '@/apiRc/service/careerRecommendation';
export const useCareerRecommendationStore = defineStore('career-recommendation', () => {
const { navTo } = inject('globalFunction');
const { userInfo: ui } = storeToRefs(useUserStore());
const userInfo = ref({
userName: '',
@@ -161,6 +162,11 @@ export const useCareerRecommendationStore = defineStore('career-recommendation',
void fetchData();
const eventJobSearch = (job) => {
console.log(job);
navTo('/pages/search/search?job=' + job.title);
};
watch(
() => profession.value,
() => {
@@ -192,6 +198,7 @@ export const useCareerRecommendationStore = defineStore('career-recommendation',
skillTags,
result,
eventProfession,
eventSearch
eventSearch,
eventJobSearch
};
});