招聘会列表分页展示

pages/index/jobFair.vue

@@ -5,11 +5,14 @@
     <view class="box defaultBgc" :style="{'padding-top': navbarHeight + 'px', 'min-height': `calc(100vh - ${(navbarHeight + 100)}px)`}" style="padding-bottom: 100px;">
       <view v-if="items.length">
         <view class="commonBackground"></view>
-        <view v-for="val in items" :key="val.id" @tap="handleToJobFairEnterprises(val)" class="list-item defaultBgc default-border">
-          <image v-if="val?.previewImg" class="ss-m-t-10" :src="val.previewImg" mode="widthFix" style="width: 100%; height: auto; border-radius: 6px;"></image>
-          <view class="ss-m-t-20 MiSans-Normal">活动时间：{{ timesTampChange(val.startTime, 'Y-M-D') }}至{{ timesTampChange(val.endTime, 'Y-M-D') }}</view>
-          <button class="ss-m-t-20 ss-m-b-10 MiSans-Medium" style="background-color: #00B760; color: #fff;" type="primary">查看详情</button>
-        </view>
+        <scroll-view class="scrollBox" :scroll-y="true" @scrolltolower="loadingMore" style="position:relative;">
+          <view v-for="val in items" :key="val.id" @tap="handleToJobFairEnterprises(val)" class="list-item defaultBgc default-border">
+            <image v-if="val?.previewImg" class="ss-m-t-10" :src="val.previewImg" mode="widthFix" style="width: 100%; height: auto; border-radius: 6px;"></image>
+            <view class="ss-m-t-20 MiSans-Normal">活动时间：{{ timesTampChange(val.startTime, 'Y-M-D') }}至{{ timesTampChange(val.endTime, 'Y-M-D') }}</view>
+            <button class="ss-m-t-20 ss-m-b-10 MiSans-Medium" style="background-color: #00B760; color: #fff;" type="primary">查看详情</button>
+          </view>
+          <uni-load-more :status="more" />
+        </scroll-view>
       </view>
       <view v-else>
         <view class="commonBackground"></view>
@@ -30,22 +33,51 @@ import Navbar from '@/components/Navbar'
 
 const navbarHeight = ref(uni.getStorageSync('navbarHeight'))
 
-// 设置自定义tabbar选中值
-onShow(() => {
-  const currentPage = getCurrentPages()[0];  // 获取当前页面实例
-  const currentTabBar = currentPage?.getTabBar?.();
-  // 设置当前tab页的下标index
-  currentTabBar?.setData({ selected: 3 });
-})
-
 const items = ref([])
+const total = ref(0)
+const query = ref({
+	pageNo: 1,
+	pageSize: 10,
+	status: '0'
+})
+const more = ref('more')
 
 // 获得招聘会列表
 const getList = async () => {
-  const res = await getJobFairList()
-  items.value = res?.data || []
+	if (query.value.pageNo < 1) return
+	if (query.value.pageNo === 1) items.value = []
+  try {
+    more.value = 'loading'
+	  uni.showLoading({ title: '加载中...' })
+    const res = await getJobFairList(query.value)
+    const list = res?.data?.list || []
+    if (!list?.length) {
+      more.value = 'noMore'
+      return
+    }
+    items.value = items.value.concat(...list)
+    total.value = res.data.total
+    more.value = 'more'
+    if (items.value.length === +total.value) {
+      more.value = 'noMore'
+      return
+    }
+  } catch (error) {
+	  query.value.pageNo--
+	  more.value = 'more'
+  } finally {
+    uni.hideLoading()
+  }
+}
+
+// 加载更多
+const loadingMore = () => {
+  if (more.value === 'noMore') return
+
+  more.value = 'loading'
+  query.value.pageNo++
+  getList()
 }
-getList()
 
 //招聘会
 const handleToJobFairEnterprises = (val) => {
@@ -56,7 +88,6 @@ const handleToJobFairEnterprises = (val) => {
 	uni.navigateTo({url})
 }
 
-
 const getShareParams = () => {
   return {
     title: '门墩儿-招聘会',
@@ -64,6 +95,16 @@ const getShareParams = () => {
   }
 }
 
+// 设置自定义tabbar选中值
+onShow(() => {
+  const currentPage = getCurrentPages()[0];  // 获取当前页面实例
+  const currentTabBar = currentPage?.getTabBar?.();
+  // 设置当前tab页的下标index
+  currentTabBar?.setData({ selected: 3 });
+
+  getList()
+})
+
 // 转发朋友
 onShareAppMessage(() => {
   return getShareParams()
@@ -76,6 +117,10 @@ onShareTimeline(() => {
 </script>
 
 <style lang="scss" scoped>
+.scrollBox {
+	height: 100vh;
+	box-sizing: border-box;
+}
 .list-item {
   margin: 0 30rpx 30rpx 30rpx;
   border-radius: 20rpx;

pagesB/jobFair/jobFairEntShare.vue

@@ -53,6 +53,7 @@ const getEntPositionList = async () => {
       pageNo: 1,
       jobFairId,
       enterpriseId,
+      status: '0'
     }
     const res = await getJobFairEntJobPage(params)
     const list = res?.data?.list?.length ? res.data.list : []

pagesB/jobFair/positionClassification.vue

@@ -104,6 +104,7 @@ const query = reactive({
   pageSize: 20, 
   pageNo: 1,
   keyword: '',
+  status: '0',
   jobFairId: undefined,
 })
 
@@ -228,7 +229,7 @@ const getEntPositionList = async () => {
     // tab对应的职位类型id列表
     const idList = tabIndex.value !== -1 ? tabList.value[tabIndex.value]?.content : []
     idList?.length && idList.forEach((value, index) => { params[`positionId[${index}]`] = value.value })
-    //
+    
     const res = await getJobFairEntJobPage(params)
     const list = res?.data?.list || []
     list.forEach(e => {