sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

附近页面滚动问题修复

Browse Source
This commit is contained in:
francis_fh
2025-12-05 13:31:15 +08:00
parent ed077fd93c
commit 0fbba1d868
5 changed files with 503 additions and 390 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
pages/nearby/components/four.vue
View File

@@ -1,5 +1,5 @@
<template>
<scroll-view :scroll-y="true" class="nearby-scroll" @scrolltolower="scrollBottom">
<view class="nearby-container">
<view class="two-head">
<view
class="head-item"
@@ -11,66 +11,68 @@
{{ item.commercialAreaName }}
</view>
</view>
<view class="nearby-list">
<view class="nav-filter" @touchmove.stop.prevent>
<view class="filter-top">
<scroll-view :scroll-x="true" :show-scrollbar="false" class="tab-scroll">
<view class="jobs-left">
<view
class="job button-click"
:class="{ active: state.tabIndex === 'all' }"
@click="choosePosition('all')"
>
全部
<scroll-view :scroll-y="true" class="nearby-scroll" @scrolltolower="scrollBottom" lower-threshold="50">
<view class="nearby-list">
<view class="nav-filter" @touchmove.stop.prevent>
<view class="filter-top">
<scroll-view :scroll-x="true" :show-scrollbar="false" class="tab-scroll">
<view class="jobs-left">
<view
class="job button-click"
:class="{ active: state.tabIndex === 'all' }"
@click="choosePosition('all')"
>
全部
</view>
<view
class="job button-click"
:class="{ active: state.tabIndex === index }"
v-for="(item, index) in userInfo.jobTitle"
:key="index"
@click="choosePosition(index)"
>
{{ item }}
</view>
</view>
<view
class="job button-click"
:class="{ active: state.tabIndex === index }"
v-for="(item, index) in userInfo.jobTitle"
:key="index"
@click="choosePosition(index)"
>
{{ item }}
</view>
</view>
</scroll-view>
<view class="jobs-add button-click" @click="navTo('/packageA/pages/addPosition/addPosition')">
<uni-icons class="iconsearch" color="#666D7F" type="plusempty" size="18"></uni-icons>
<text>添加</text>
</view>
</view>
<view class="filter-bottom">
<view class="btm-left">
<view
class="button-click filterbtm"
:class="{ active: pageState.search.order === item.value }"
v-for="item in rangeOptions"
@click="handelHostestSearch(item)"
:key="item.value"
>
{{ item.text }}
</scroll-view>
<view class="jobs-add button-click" @click="navTo('/packageA/pages/addPosition/addPosition')">
<uni-icons class="iconsearch" color="#666D7F" type="plusempty" size="18"></uni-icons>
<text>添加</text>
</view>
</view>
<view class="btm-right button-click" @click="openFilter">
筛选
<image class="right-sx" :class="{ active: showFilter }" src="@/static/icon/shaixun.png"></image>
<view class="filter-bottom">
<view class="btm-left">
<view
class="button-click filterbtm"
:class="{ active: pageState.search.order === item.value }"
v-for="item in rangeOptions"
@click="handelHostestSearch(item)"
:key="item.value"
>
{{ item.text }}
</view>
</view>
<view class="btm-right button-click" @click="openFilter">
筛选
<image class="right-sx" :class="{ active: showFilter }" src="@/static/icon/shaixun.png"></image>
</view>
</view>
</view>
<view class="one-cards">
<renderJobs
v-if="list.length"
:list="list"
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="60"></empty>
<loadmore ref="loadmoreRef"></loadmore>
</view>
</view>
<view class="one-cards">
<renderJobs
v-if="list.length"
:list="list"
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="60"></empty>
<loadmore ref="loadmoreRef"></loadmore>
</view>
</view>
</scroll-view>
<!-- 筛选 -->
<select-filter ref="selectFilterModel"></select-filter>
</scroll-view>
</view>
</template>
<script setup>
@@ -273,9 +275,20 @@ defineExpose({ loadData, handleFilterConfirm });
<style lang="stylus" scoped>
.tabchecked
color: #4778EC !important
.nearby-scroll
.nearby-container
// 确保容器占据整个可用视口高度，包括安全区域
height: calc(100vh - var(--window-top));
display: flex;
flex-direction: column;
overflow: hidden;
.two-head
.nearby-scroll
// 使用flex布局让scroll-view自适应高度，占据剩余空间
flex: 1;
overflow: hidden;
.two-head
margin: 22rpx;
display: flex;
flex-wrap: wrap
@@ -303,7 +316,6 @@ defineExpose({ loadData, handleFilterConfirm });
border-radius: 12rpx 12rpx 12rpx 12rpx;
.nearby-list
border-top: 2rpx solid #EBEBEB;
height: 100%
.one-cards{
display: flex;
flex-direction: column;