Files
jobslink-user-clent/pages/recruit/subPage/index.vue
2024-03-13 11:03:46 +08:00

212 lines
7.1 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>
<view class="app_container">
<CustomNavbar @back="back" :titke="'招工列表'"></CustomNavbar>
<view class="guide">
<view class="guide_content" v-for="(item, index) in arrGuide" :key="index">
<view class="guide_item"> {{item}} </view>
<view class="guide_arrow" v-if="index !== arrGuide.length - 1"></view>
</view>
</view>
<view class="condition">
<view class="cond_list" v-if="pageType === 'enterprise'">
<view v-for="(item, index) in arrTitle" :key="index"
:class="['cond_item', index === currentArrTitleID ? 'activeButton' : '']"
@click="changeTab(item)">
{{ item.text }}
</view>
</view>
<view class="cond_list" v-else>
<view style="font-weight: 700;">个体招工</view>
</view>
<view
class="cond_item item_com"
@click="openPicker = true"
>{{ reviewStatus[currentReviewStatusID] }}</view>
</view>
<view class="container" v-if="dataSource.length">
<block v-for="(item, index) in dataSource" :key="item.id">
<userrecruitList :companyitem="item"></userrecruitList>
</block>
</view>
<empty v-else content="暂无数据" mr-top="200"></empty>
<CustomTabbar :currentpage="0"></CustomTabbar>
<u-picker :show="openPicker" :columns="pickerColumns" @cancel="openPicker = false" @confirm="changeReviewStatus"></u-picker>
</view>
</template>
<script>
import CustomNavbar from '@/components/CustomNavbar/navbar.vue';
import CustomTabbar from '@/components/CustomTabbar/custom_tabbar.vue';
import { getuserrecruitListApp } from '@/api/userrecruit.js'
import userrecruitList from '../components/userrecruitList.vue'
let arrGuide = ['在线填写招工需求', '后台审核沟通发布', '平台展示招工信息'];
let arrTitle = [
{
text: "发布任务",
id: 0
}, {
text: "发布岗位",
id: 1
}
// , {
// text: "个体招工",
// id: 2
// }
];
let reviewStatus = {
'-1': '全部',
'0': "待审",
'1': "已审",
'9': "驳回",
};
let pickerColumns = [Object.values(reviewStatus)]
import { mapState } from 'vuex'
export default {
components: {CustomTabbar, CustomNavbar, userrecruitList},
data() {
return {
pageType: null, // null 个人 enterprise 企业
arrGuide,
arrTitle,
reviewStatus,
pickerColumns,
openPicker: false,
currentArrTitleID: 2,
currentReviewStatusID: '-1',
pageNumber: 1,
dataSource: [],
}
},
onLoad({type}) {
if(this.enterprise){
this.pageType = 'enterprise'
this.currentArrTitleID = 0
}
this.getList('refresh')
},
onReachBottom() {
this.getList('add')
},
computed: {
...mapState({enterprise: (state) => state.user.seeEnterprise}),
},
methods: {
changeReviewStatus({value, index, values}) {
const val = Object.keys(reviewStatus).filter((item) => reviewStatus[item] === value[0])[0]
this.currentReviewStatusID = val
this.openPicker = false
this.getList('refresh')
},
changeTab(item) {
this.currentArrTitleID = item.id
this.getList('refresh')
},
back() {
uni.reLaunch({ url: '/pages/my/my' })
},
async getList(type = "add") {
if (type === "refresh") {
this.dataSource = [];
this.pageNumber = 1;
}
let params = {
current: this.pageNumber,
size: 10,
jobType: this.currentArrTitleID,
}
if(this.currentReviewStatusID !== '-1') {
params.reviewState = this.currentReviewStatusID
}
uni.showLoading({title: '加载中...' })
let resData = await getuserrecruitListApp(params);
uni.hideLoading()
if (resData.data?.code === 200) {
const { records, total, page, size } = resData.data.data;
if (!records.length) {
return this.$api.msg("没有更多数据");
}
switch (type) {
case "add":
this.dataSource = [...this.dataSource, ...records];
break;
case "refresh":
this.dataSource = records;
break;
}
this.pageNumber += 1;
}
}
}
}
</script>
<style lang="scss" scoped>
.app_container{
background-color: #f3f4f8;
min-height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
.container{
padding: 0 23rpx;
padding-bottom: calc(env(safe-area-inset-bottom) + 123rpx)
}
.condition{
display: flex;
flex-wrap: nowrap;
padding: 20rpx;
justify-content: space-between;
position: sticky;
top: 78rpx;
z-index: 999;
background-color: #f3f4f8;
.cond_list{
display: flex;
flex-wrap: nowrap;
flex: 1;
// justify-content: space-between;
}
.cond_item{
font-size: 14px;
padding: 10rpx 40rpx;
background: #fff;
border-radius: 50px;
margin-right: 10rpx;
white-space: nowrap;
}
.activeButton {
color: #4171f9;
background-color: #cfdaf8;
}
.item_com{
margin-right: 0;
padding: 10rpx 20rpx;
}
}
.guide{
padding: 20rpx;
display: flex;
align-items: center;
justify-content: space-between;
height: 200rpx;
color: #FFFFFF;
font-size: 28rpx;
background-color: #4071f8;
.guide_content{
display: flex;
align-items: center;
.guide_item{
width: 160rpx;
text-align: center;
background-color: rgba(76, 120, 249, 1);
border-radius: 10rpx;
padding: 10rpx;
}
.guide_arrow{
margin-left: 40rpx;
}
}
}
}
</style>