Files
ks-app-employment-service/packageA/pages/newJobPosition/newJobPosition.vue
2025-05-15 14:17:51 +08:00

148 lines
4.1 KiB
Vue

<template>
<view class="reser-content">
<scroll-view :scroll-x="true" :show-scrollbar="false" class="tab-scroll">
<view class="content-top">
<view
class="top-item button-click"
:class="{ active: state.tabIndex === 'all' }"
@click="changeOption('all')"
>
全部
</view>
<view
class="top-item button-click"
:class="{ active: state.tabIndex === index }"
v-for="(item, index) in userInfo.jobTitle"
:key="index"
@click="changeOption(index)"
>
{{ item }}
</view>
</view>
</scroll-view>
<view class="main">
<scroll-view class="scroll-view" scroll-y @scrolltolower="scrollBottom">
<view class="list">
<renderJobs
:list="pageState.list"
v-if="pageState.list.length"
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="200"></empty>
</view>
</scroll-view>
</view>
</view>
</template>
<script setup>
import { reactive, inject, watch, ref, onMounted, onBeforeUnmount } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
const { $api, navTo, debounce, customSystem } = inject('globalFunction');
import { storeToRefs } from 'pinia';
import useLocationStore from '@/stores/useLocationStore';
import useUserStore from '@/stores/useUserStore';
const { userInfo } = storeToRefs(useUserStore());
const { longitudeVal, latitudeVal } = storeToRefs(useLocationStore());
const pageState = reactive({
page: 0,
list: [],
total: 0,
maxPage: 1,
pageSize: 10,
search: {},
lastDate: '',
});
const state = reactive({
tabIndex: 'all',
});
onLoad(() => {
getList('refresh');
});
function scrollBottom() {
getList();
}
function changeOption(index) {
state.tabIndex = index;
if (index === 'all') {
pageState.search = {};
getList('refresh');
} else {
pageState.search.jobTitle = userInfo.value.jobTitle[index];
getList('refresh');
}
}
function getList(type = 'add', loading = true) {
if (type === 'refresh') {
pageState.page = 1;
pageState.maxPage = 1;
}
if (type === 'add' && pageState.page < pageState.maxPage) {
pageState.page += 1;
}
let params = {
current: pageState.page,
pageSize: pageState.pageSize,
...pageState.search,
};
$api.createRequest('/app/notice/recommend', params).then((resData) => {
const { rows, total } = resData;
if (type === 'add') {
const str = pageState.pageSize * (pageState.page - 1);
const end = pageState.list.length;
const reslist = rows;
pageState.list.splice(str, end, ...reslist);
} else {
pageState.list = rows;
}
pageState.total = resData.total;
pageState.maxPage = Math.ceil(pageState.total / pageState.pageSize);
});
}
</script>
<style lang="stylus" scoped>
.reser-content{
width: 100%;
height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
display: flex;
flex-direction: column;
.content-top{
display: flex
padding: 28rpx
.top-item{
font-weight: 400;
font-size: 32rpx;
margin-right: 48rpx
color: #666D7F;
white-space: nowrap
}
.top-item:last-child{
padding-right: 38rpx
}
.active{
font-weight: 500;
font-size: 32rpx;
color: #000000;
}
}
.main{
flex: 1
overflow: hidden
background: #F4F4F4
.scroll-view{
height: 100%
.list{
padding: 0 28rpx 28rpx 28rpx
}
}
}
}
</style>