Files
ks-app-employment-service/packageB/priority/smartRecommend.vue
2026-03-10 17:13:38 +08:00

598 lines
15 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<AppLayout :title="title" :show-bg-image="false" >
<view class="tab-list" >
<view class="tab" :class="{active: activeType == 1}" @click="tabChange(1)">岗位推荐
</view>
<view class="tab" :class="{active: activeType == 2}" @click="tabChange(2)">政策推荐
</view>
<view class="tab" :class="{active: activeType == 3}" @click="tabChange(3)">培训推荐
</view>
</view>
<view class="page-container" >
<scroll-view :scroll-y="true" class="nearby-scroll" @scrolltolower="scrollBottom" lower-threshold="50">
<view class="main-list" :style="getBackgroundStyle('k.png')" v-if="activeType==1">
<view class="list-top">
<view class="list-title">
<text>推荐岗位列表</text>
<view class="title-line" style="left: 70rpx;"></view>
</view>
<view class="title-total">
<text class="total-num">{{totalNum}}</text>
</view>
</view>
<view class="list-box" v-if="dataList.length>0">
<view class="con-box" v-for="(item,index) in dataList" :key="index">
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/person.png'" mode=""></image>
<view class="item-label">
岗位名称
</view>
</view>
<view class="item-right">
{{item.jobTitle}}
</view>
</view>
<view class="form-item">
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/help.png'" mode=""></image>
<view class="item-label">
公司名称
</view>
</view>
<view class="item-right">
{{item.companyName}}
</view>
</view>
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/base.png'" mode=""></image>
<view class="item-label">
薪资待遇
</view>
</view>
<view class="item-right">
{{item.minSalary}}-{{item.maxSalary}}
</view>
</view>
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/num.png'" mode=""></image>
<view class="item-label">
工作地点
</view>
</view>
<view class="item-right">
{{item.jobLocation}}
</view>
</view>
</view>
</view>
<empty v-else pdTop="200"></empty>
</view>
<view class="main-list" :style="getBackgroundStyle('k.png')" v-if="activeType==2">
<view class="list-top">
<view class="list-title">
<text>推荐政策列表</text>
<view class="title-line" style="left: 70rpx;"></view>
</view>
<view class="title-total">
<text class="total-num">{{totalNum}}</text>
</view>
</view>
<view class="list-box" v-if="dataList.length>0">
<view class="con-box" v-for="(item,index) in dataList" :key="index">
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/person.png'" mode=""></image>
<view class="item-label">
政策名称
</view>
</view>
<view class="item-right">
{{item.zcmc}}
</view>
</view>
<view class="form-item">
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/help.png'" mode=""></image>
<view class="item-label">
政策类型
</view>
</view>
<view class="item-right">
{{ item.type === '3' ? '个人就业政策' : '单位就业政策' }}
</view>
</view>
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/base.png'" mode=""></image>
<view class="item-label">
政策级别
</view>
</view>
<view class="item-right">
{{ item.zcLevel }}
</view>
</view>
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/num.png'" mode=""></image>
<view class="item-label">
发文单位
</view>
</view>
<view class="item-right">
{{item.sourceUnit}}
</view>
</view>
<view class="form-item">
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/date.png'" mode=""></image>
<view class="item-label">
发布时间
</view>
</view>
<view class="item-right">
{{item.publishTime}}
</view>
</view>
</view>
</view>
<empty v-else pdTop="200"></empty>
</view>
<view class="main-list" :style="getBackgroundStyle('k.png')" v-if="activeType==3">
<view class="list-top">
<view class="list-title">
<text>推荐培训列表</text>
<view class="title-line" style="left: 70rpx;"></view>
</view>
<view class="title-total">
<text class="total-num">{{totalNum}}</text>
</view>
</view>
<view class="list-box" v-if="dataList.length>0">
<view class="con-box" v-for="(item,index) in dataList" :key="index">
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/person.png'" mode=""></image>
<view class="item-label">
课程标题
</view>
</view>
<view class="item-right">
{{item.videoTitle}}
</view>
</view>
<view class="form-item">
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/help.png'" mode=""></image>
<view class="item-label">
课程分类
</view>
</view>
<view class="item-right">
{{getabelByValue(item.category,classificationOptions)}}
</view>
</view>
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/base.png'" mode=""></image>
<view class="item-label">
讲师
</view>
</view>
<view class="item-right">
{{item.teacherName}}
</view>
</view>
<view class="form-item" >
<view class="item-left">
<image class="item-img" :src="baseUrl+'/dispatch/num.png'" mode=""></image>
<view class="item-label">
时长
</view>
</view>
<view class="item-right">
{{formatDuration(item.hour)}}
</view>
</view>
</view>
</view>
<empty v-else pdTop="200"></empty>
</view>
</scroll-view>
</view>
</AppLayout>
</template>
<script setup>
import { inject, ref, reactive, onMounted } from 'vue';
import { onLoad,onShow } from '@dcloudio/uni-app';
const { $api, navTo, navBack } = inject('globalFunction');
import config from "@/config.js"
const title = ref('');
const activeType = ref(1)
const pageNum = ref(1)
const pageSize = ref(10)
const totalNum=ref(0)
const dataList=ref([])
const classificationOptions=ref([])
const goalPersonId=ref([])
const baseUrl = config.imgBaseUrl
const getBackgroundStyle = (imageName) => ({
backgroundImage: `url(${baseUrl}/dispatch/${imageName})`,
backgroundSize: 'cover', // 覆盖整个容器
backgroundPosition: 'center', // 居中
backgroundRepeat: 'no-repeat'
});
function tabChange(val){
activeType.value=val
getDataList()
}
function formatDuration(duration) {
// 如果已经是字符串格式,直接返回
if (typeof duration === 'string') {
return duration
}
// 如果是数字(秒数),格式化为时间字符串
if (typeof duration === 'number') {
const hours = Math.floor(duration / 3600)
const minutes = Math.floor((duration % 3600) / 60)
const secs = duration % 60
if (hours > 0) {
return `${hours}:${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`
} else {
return `${minutes}:${secs.toString().padStart(2, '0')}`
}
}
return duration
}
function getDictionary(){
$api.myRequest('/system/public/dict/data/type/question_classification').then((resData) => {
if(resData && resData.code == 200){
resData.data.forEach(item=>{
const obj = {
value: item.dictValue,
text: item.dictLabel
}
classificationOptions.value.push(obj)
})
}
});
}
function getabelByValue(value,arr) {
if (!Array.isArray(arr)) {
return ''
}
const item = arr.find(item => item.value === String(value))
return item ? item.text : '暂无'
}
function getDataList(){
dataList.value=[]
let header={
'Authorization':uni.getStorageSync('Padmin-Token'),
'Content-Type': "application/x-www-form-urlencoded"
}
if(activeType.value==1){
let params={
goalPersonId: goalPersonId.value,
pageNum: 1,
pageSize: 1
}
$api.myRequest('/dispatch/job/willingness/list',params,'get',9100,header).then((resData) => {
if(resData.rows&&resData.rows.length>0){
const education = resData.rows[0].education?resData.rows[0].education:''
const jobType = resData.rows[0].jobType?resData.rows[0].jobType:''
const type = resData.rows[0].type?resData.rows[0].type:''
const jobParams = {
education,
jobType,
type
};
$api.myRequest('/ks/cms/job/recommend?education',jobParams,'get',9100,header,false,'jobRecommend').then((resData) => {
dataList.value=resData.data
if(dataList.value.length>10){
dataList.value=dataList.value.slice(0,10)
}
})
}else{
$api.myRequest('/ks/cms/job/recommend?education',{},'get',9100,header,false,'jobRecommend').then((resData) => {
dataList.value=resData.data
if(dataList.value.length>10){
dataList.value=dataList.value.slice(0,10)
}
})
}
});
}else if(activeType.value==2){
let policyParams={
pageNum: 1,
pageSize: 5
}
$api.myRequest('/portal/policyInfo/portalList',policyParams,'get',9100,header,false,'policyRecommend').then((resData) => {
dataList.value=resData.rows
})
}else if(activeType.value==3){
let willingParams = {
goalPersonId: goalPersonId.value,
pageNum: 1,
pageSize: 1
}
$api.myRequest('/dispatch/train/willingness/list',willingParams,'get',9100,header).then((resData) => {
if(resData.code==200){
let train = {};
if (resData.rows && resData.rows.length > 0) {
train = resData.rows[0];
}
let trainParams = {
category: train.courseType || '',
pageNum: 1,
pageSize: 5
};
$api.myRequest('/dispatch/train/trainVideo/table',trainParams,'get',9100,header).then((resData) => {
dataList.value=resData.rows
})
}else{
}
});
}
}
function scrollBottom(){
// if(pageNum.value<totalNum.value/pageSize.value){
// pageNum.value++
// getDataList()
// }
}
onLoad((options) => {
goalPersonId.value=options.goalPersonId
});
const runAsyncTasks = async () => {
await getDictionary()
await getDataList()
}
onShow(()=>{
dataList.value=[]
pageNum.value=1
runAsyncTasks()
})
</script>
<style lang="stylus" scoped>
.tab-list
display: flex
margin: 16rpx 30rpx 0rpx
text-align: center
border-radius: 16rpx
background: #fff
align-items: center
justify-content: space-between
padding:20rpx 40rpx 0rpx
.tab
padding-bottom: 10rpx
font-size: 30rpx
.active
color: #1A62CE
border-bottom: 4rpx solid #1A62CE
position: relative
font-weight: bold
image
height: 100%
width: 100%
.page-container {
display: flex;
flex-direction: column;
height: calc(100vh - var(--window-top)); /* 如果 AppLayout 有 header需减去 */
/* 或者简单用height: 100vh; */
padding-bottom: 140rpx
}
.nearby-scroll
// 使用flex布局让scroll-view自适应高度占据剩余空间
flex: 1
// overflow: hidden;
.task-box
display: flex
align-items: center
.task-label
font-size: 30rpx
color: #6E7E9B
.task-name
font-weight: bold
font-size: 30rpx
color: #3D61AC
.main-list
background-color: #ffffff
padding: 20rpx 20rpx 28rpx 20rpx
margin: 30rpx 30rpx
box-shadow: 0px 3px 20px 0px rgba(0,105,234,0.1)
border-radius: 12px
.list-top
display: flex
align-items: center
justify-content: space-between
.list-title
font-weight: bold
font-size: 36rpx
color: #404040
position: relative
.title-line
position: absolute
bottom: -10rpx
left: 70rpx
width: 70rpx
height: 8rpx
background: linear-gradient(90deg, #FFAD58 0%, #FF7A5B 100%)
border-radius: 4rpx
.title-total
font-size: 24rpx
color: #999999
.total-num
color: #3088FF
margin-left: 4rpx
margin-right: 4rpx
font-weight: bold
font-size: 26rpx
.list-box
margin-top: 40rpx
:deep(.uni-forms-item__label)
width: 194rpx !important
font-size: 28rpx;
color: #404040;
.search-container
padding: 20rpx 0rpx 0rpx 0rpx
.title-total
font-size: 24rpx
color: #999999
.total-num
color: #3088FF
margin-left: 4rpx
margin-right: 4rpx
font-weight: bold
font-size: 26rpx
.search-item
display: flex
align-items: center
margin-bottom: 30rpx
.label
width: 160rpx
font-size: 28rpx
color: #404040
flex-shrink: 0
.input,
.picker
background: #FFFFFF
flex: 1
min-width: 0
.search-box-btn
border-radius: 32rpx !important
background: #3088FF !important
margin-right: 16rpx
.reset-box-btn
border-radius: 32rpx !important
background: #02B44D
color: #fff
.con-box
background: #fff
padding: 20rpx
box-shadow: 0px 0px 6rpx 0px rgba(0,71,200,0.16)
border-radius: 24rpx
border: 1rpx solid #EDF5FF
margin-top: 30rpx
.form-title
display: flex
align-items: center
.form-name
font-weight: bold
font-size: 30rpx
color: #595959
margin-right:16rpx
.form-type
border-radius: 8rpx;
border: 2rpx solid #FF7D26;
font-size: 24rpx
color: #F1690E
padding: 4rpx 10rpx
.form-item
display: flex
align-items: center
justify-content: space-between
margin-top: 30rpx
.item-left
display: flex
align-items: center
.item-img
width: 26rpx
height: 26rpx
margin-right: 10rpx
.item-label
font-size: 26rpx
color: #B3B3B3
width: 190rpx
.item-right
font-size: 26rpx
color: #737373
// overflow: hidden
// text-overflow: ellipsis
// white-space: nowrap
word-wrap: break-word
overflow-wrap: break-word
white-space: normal
.form-btns
margin-top:30rpx
.form-box-btn
border-radius: 50rpx !important
margin-right: 24rpx
padding: 0rpx 40rpx
.detail-btn
background: #EDF5FF
border: 1px solid #3088FF
font-size: 28rpx
color: #3088FF
.follow-btn
background: #EEF9F3
border: 1px solid #00933E
font-size: 28rpx
color: #00933E
.recommend-btn
background: linear-gradient(92deg, #0DCCFF 0%, #4760FF 100%)
font-size: 28rpx
color: #FFFFFF
.button-group
position: fixed
bottom: 0
left: 0
width: 100%
height: 120rpx
background: #fff
.btns
height: 120rpx
width: 100%
line-height: 120px
display: flex
align-items: center
justify-content: space-between
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1)
.btn {
width: 45%;
height: 80rpx;
font-size: 30rpx;
border-radius: 8rpx;
}
.reset-btn {
background-color: #D8E9FF;
color: #1176FF;
}
.submit-btn {
background-color: #368BFF;
color: white;
}
.float-btn{
position: fixed;
bottom: 100rpx;
right: 50rpx;
background: #368BFF;
width: 100rpx;
height: 100rpx;
border-radius: 50%;
line-height: 100rpx;
text-align: center;
color: #fff;
}
</style>