Files
ks-app-employment-service/packageRc/pages/needs/personNeeds.vue

518 lines
13 KiB
Vue
Raw Normal View History

2025-11-04 15:16:22 +08:00
<template>
<view>
<view class="page">
<view class="page-header">
<u-icon class="back-icon" name="arrow-left" color="#fff" size="16" @click="goBack()"></u-icon>
<view class="title">需求列表</view>
<view style="width: 16rpx;"></view> <!-- 占位保证左右对称 -->
</view>
<view class="input-outer-part"
style="padding-top: 12rpx;margin-top: 16rpx;padding-bottom: 0;max-height: unset;">
<!-- <view class="inner"
style="width: calc(100% + 64rpx);margin-left: -32rpx;height: 122rpx;position: relative;z-index: 2;">
<PopupList :checkData="checkData" @searchCheck="search" ref="PopupList"
@popupSearch="popupSearch" />
</view> -->
<scroll-view :scroll-y="true" style="height: calc(100vh - 242rpx);position: relative;z-index: 1;"
@scrolltolower="getBottomList">
<u-swipe-action>
<u-swipe-action-item @click="clickDelete(item)" v-for="(item, index) in tableData" :key="index"
style="margin-bottom: 24rpx;border-radius: 16rpx;" :options="options1">
<view @click="goNeedsDetail(item)" class="job-item">
<view class="title-line" v-if="queryParams.needsType==1">
<view class="type-tag qz">求职需求</view>
<view class="title">{{getJobWorkTypeName(item.jobWorkType)}}</view>
</view>
<view class="title-line" v-if="queryParams.needsType==2">
<view class="type-tag yz">援助需求</view>
<view class="title">{{ item.demandTitle }}</view>
</view>
<view class="title-line" v-if="queryParams.needsType==3">
<view class="type-tag cy">创业需求</view>
<view class="title">{{ item.personName }}的创业需求</view>
</view>
<view class="title-line" v-if="queryParams.needsType==4">
<view class="type-tag px">培训需求</view>
<view class="title">{{ item.personName }}的培训需求</view>
</view>
<view class="title-line" v-if="queryParams.needsType==5">
<view class="type-tag qt">其他需求</view>
<view class="title">{{ item.personName }}的其他需求</view>
</view>
<view class="info"><text>需求状态</text><text
:class="item.currentStatus == 1 ? 'not' : item.currentStatus == 2 ? 'ing' : item.currentStatus == 3 ? 'finish' : '' ">
{{ getDictLabel(item.currentStatus, currentStatusList) }}
</text></view>
<view class="bottom-line">
<view class="info"><text>提交时间</text>{{ item.createTime }}</view>
<view style="font-size:12px;">左划删除需求</view>
</view>
</view>
</u-swipe-action-item>
</u-swipe-action>
<img v-if="!total&&!loading" src="https://rc.jinan.gov.cn/qcwjyH5/static/images/person/empty.png"
style="width: 100%;display: block;margin: 0 auto;" />
<view v-if="loading"><u-loading-icon></u-loading-icon>
<view style="text-align: center;color: #8E8E8E;font-size: 24rpx;">加载中~</view>
</view>
<view v-else-if="showMorePage" style="text-align: center;color: #1A62CE;font-size: 24rpx;">加载更多
</view>
<view class="addNeeds" @click="goAddNeeds()">
<img src="https://rc.jinan.gov.cn/qcwjyH5/static/images/person/addNeeds.png" />
</view>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
import {
getPersonBase
} from "@/apiRc/person";
import PopupList from "../../components/PopupLists.vue";
import {
listJobService,
delJobService
} from '@/apiRc/needs/jobService'
import { listPersonDemand, delPersonDemand } from "@/apiRc/needs/personDemand";
import {
listAssistService,
delAssistService
} from '@/api/apiRc/assistService'
import {
listEntrepreneurshipService,
delEntrepreneurshipService
} from '@/api/apiRc/entrepreneurshipService'
import {
listTrainService,
delTrainService
} from '@/api/apiRc/trainService'
import { listJobType } from "@/apiRc/jobType/index";
import {
listOtherService,
delOtherService
} from '@/apiRc/needs/otherService'
export default {
components: {
PopupList,
},
onShow() {
this.search();
},
data() {
return {
checkData: [],
options1: [{
text: '删除'
}],
queryParams: {
pageNum: 1,
pageSize: 10,
needsType: 1,
userId: '',
},
jobTypeList:[],
total: 0,
showMorePage: true,
tableData: [],
person: {},
loading: false,
currentStatusList: [],
}
},
mounted() {
},
onLoad({
dictValue,userId
}) {
this.queryParams.needsType = dictValue
this.queryParams.userId = userId
this.getCheckData()
this.getDicts('qcjy_xqlc').then(res => {
this.currentStatusList = res.data;
})
this.workTypeRemoteMethod()
this.getDicts('qcjy_zgzpgz').then(res => {
this.salaryList = res.data;
})
getPersonBase(this.$store.state.user.userId).then(resp => {
this.person = resp.data
this.queryParams.personId = resp.data.id
})
},
methods: {
getJobWorkTypeName(data){
if (data) {
let arr = this.jobTypeList.filter((ele) => ele.id == data);
return arr[0].workTypeName;
}
},
workTypeRemoteMethod(key) {
listJobType({
workTypeName: key,
pageNum: 1,
pageSize: 50,
}).then((res) => {
this.jobTypeList = res.rows;
});
},
goAddNeeds() {
this.$tab.navigateTo(`/pages/needs/needDetail?activeType=${this.queryParams.needsType}&showTab=1`)
},
goBack() {
uni.navigateBack()
},
clickDelete(item) {
this.loading = true;
if (this.queryParams.needsType == 1) {
delJobService(item.id).then((res) => {
this.deleteFinish(res)
});
} else if (this.queryParams.needsType == 2) {
delAssistService(item.id).then((res) => {
this.deleteFinish(res)
});
} else if (this.queryParams.needsType == 3) {
delEntrepreneurshipService(item.id).then((res) => {
this.deleteFinish(res)
});
} else if (this.queryParams.needsType == 4) {
delTrainService(item.id).then((res) => {
this.deleteFinish(res)
});
} else if (this.queryParams.needsType == 5) {
delOtherService(item.id).then((res) => {
this.deleteFinish(res)
});
}
},
deleteFinish() {
uni.showToast({
title: '删除成功'
})
this.search()
},
goNeedsDetail(item) {
uni.navigateTo({
url: `/pages/needs/needDetail?id=${item.id}&type=${this.queryParams.needsType}&showTab=1`
})
},
getDictLabel(value, list) {
if (list) {
let arr = list.filter(ele => ele.dictValue == value)
if (arr.length) {
return arr[0].dictLabel
} else {
return '请选择'
}
}
},
async getCheckData() {
let workExperienceYears
await this.getDicts('qcjy_gznx').then(res => {
workExperienceYears = res.data
})
this.checkData = [
// {
// name: "需求类型",
// type: "needsType",
// data: [{dictLabel: '求职需求', dictValue: '1'},{dictLabel: '援助需求', dictValue: '2'},{dictLabel: '创业需求', dictValue: '3'},{dictLabel: '培训需求', dictValue: '4'},{dictLabel: '其他需求', dictValue: '5'}],
// activeIndex: 0,
// },
// {
// name: "工作经验",
// type: "workExperienceYears",
// data: [{
// dictLabel: '全部',
// dictValue: ''
// }].concat(workExperienceYears),
// activeIndex: 0,
// },
];
},
popupSearch(queryParams) {
queryParams.forEach((item, index) => {
if (item.data[item.activeIndex].dictLabel == "全部") {
this.queryParams[item.type] = "";
} else {
this.queryParams[item.type] = item.data[item.activeIndex].dictValue;
}
});
this.search()
},
search() {
this.showMorePage = true;
this.queryParams.pageNum = 1;
this.queryParams.pageSize = 10;
this.tableData = [];
this.total = 0;
this.getList();
},
// 触底加载
getBottomList() {
if (
this.queryParams.pageNum * this.queryParams.pageSize >=
this.total
) {
this.showMorePage = false;
} else if (
this.queryParams.pageNum * this.queryParams.pageSize <
this.total
) {
this.queryParams.pageNum++;
this.getList();
if (
this.queryParams.pageNum * this.queryParams.pageSize >=
this.total
) {
this.showMorePage = false;
}
}
},
// 获取列表
async getList() {
this.loading = true;
if (this.queryParams.needsType == 1) {
this.queryParams.demandType = 1
listPersonDemand(this.queryParams).then((res) => {
this.gettedData(res)
});
} else if (this.queryParams.needsType == 2) {
listAssistService(this.queryParams).then((res) => {
this.gettedData(res)
});
} else if (this.queryParams.needsType == 3) {
this.queryParams.demandType = 2
listPersonDemand(this.queryParams).then((res) => {
this.gettedData(res)
});
} else if (this.queryParams.needsType == 4) {
this.queryParams.demandType = 3
listPersonDemand(this.queryParams).then((res) => {
this.gettedData(res)
});
} else if (this.queryParams.needsType == 5) {
this.queryParams.demandType = 9
listPersonDemand(this.queryParams).then((res) => {
this.gettedData(res)
});
}
},
gettedData(res) {
if (res.code == 200) {
if (res.rows.length < 10) {
this.showMorePage = false;
}
this.loading = false;
this.tableData = this.tableData.concat(res.rows);
this.total = res.total;
} else {
this.loading = false;
uni.showToast({
title: res.msg,
icon: "none",
});
}
}
}
}
</script>
<style lang="scss" scoped>
.page {
background-color: #eef1f5 !important;
height: 100vh;
background-image: url('https://rc.jinan.gov.cn/qcwjyH5/static/images/top.png');
background-repeat: no-repeat;
background-size: 100% auto;
}
.search-line {
border-radius: 32px;
background: #FFFFFF;
box-sizing: border-box;
border: 1px solid #107AFD;
height: 64rpx;
border-radius: 32rpx;
padding: 0 32rpx;
display: flex;
align-items: center;
position: relative;
z-index: 1;
margin-top: 24rpx;
.search-icon {
width: 40rpx;
}
}
.job-item {
border-radius: 24rpx; /* 增大圆角,使界面更圆润 */
padding: 32rpx;
margin: 30rpx 30rpx 24rpx 30rpx; /* 添加左右30rpx边距 */
background-color: #FFFFFF; /* 设置白色背景,避免与底层背景重合 */
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); /* 添加轻微阴影增强层次感 */
.title-line {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 32rpx;
font-weight: bold;
margin-bottom: 16rpx;
.type-tag {
line-height: 40rpx;
width: 128rpx;
font-size: 24rpx;
color: #fff;
text-align: center;
&.qz {
background: #28CB5E;
}
&.yz {
background: #DD6728;
}
&.cy {
background: #23B5C5;
}
&.px {
background: #DDA728;
}
&.qt {
background: #2870DD;
}
}
.title {
color: #3D3D3D;
width: calc(100% - 137rpx);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 40rpx;
}
.salary {
width: 33%;
color: #FA6553;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: right
}
}
.info {
color: #3D3D3D;
margin-bottom: 7rpx;
font-size: 28rpx;
text {
color: #8E8E8E;
}
.not {
color: #EC7737;
font-weight: bold;
}
.ing {
color: #ECB83D;
font-weight: bold;
}
.finish {
color: #21C88D;
font-weight: bold;
}
}
.bottom-line {
display: flex;
justify-content: space-between;
margin-top: 21rpx;
.info {
margin-bottom: 0;
}
.toudi-btn {
background: linear-gradient(90deg, #1A62CE 0%, #1D8ACE 100%);
color: #fff;
width: 140rpx;
line-height: 40rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 28rpx;
border-radius: 20rpx;
img {
width: 22rpx;
margin-right: 10rpx;
}
}
}
}
.addNeeds {
position: fixed;
right: 10px;
bottom: 150rpx;
width: 150rpx; /* 改小一点,比如 100rpx */
height: 10vh; /* 新增高度 */
overflow: hidden;
z-index: 10;
border-radius: 50rpx; /* 圆角要和宽高一半一致,才能正圆 */
img {
display: block;
width: 100%;
height: 100%; /* 让图片填满容器 */
object-fit: cover; /* 保证图片不变形,裁剪多余部分 */
}
}
.page-header {
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
height: 80rpx; // 可根据实际调整
}
.back-icon {
flex-shrink: 0;
margin-left: 20rpx;
}
.title {
flex: 1;
text-align: center;
font-size: 32rpx;
color: #fff;
font-weight: bold;
}
</style>