emis-sapp/pages/service/list.vue
2023-12-11 01:10:09 +08:00

135 lines
3.1 KiB
Vue

<template>
<tpx-layout>
<template v-slot:body>
<scroll-view :scroll-y="true" @scrolltolower="onScrollBottom()" class="pos-abt-all"
>
<view class="pgb-header">
<view class="com-jianju">
<!-- 关键字搜索框 -->
<tpx-search placeholder="选择省市区" v-model:value="searchParam.keyword" @change="handleSearchParamChange()" ></tpx-search>
</view>
</view>
<view class="pgb-cont">
<!-- 列表数据 -->
<!-- -->
<view>
<view v-for="(item) in dataList" class="blcok-white radius-20 mb-20" style="margin-top: 0;"
@click="handleTODetail(item)"
>
<u-text :text="'各国邮政新规'" size="30" :bold="true" lines="1"></u-text>
<u-text margin="10rpx 0 0 0" :text="'根据萨尔瓦多邮政通知,为了使萨尔瓦多邮政能在邮件抵达时,致电或'" size="28" color="#999" lines="2"></u-text>
</view>
</view>
<!-- 加载更多 -->
<u-loadmore icon-size="28" font-size="28" margin-top="30" v-if="showLoadMore || loadedAll"
:status="loadedAll ? 'nomore' : 'loading'" />
<!-- 空数据页 -->
<view v-if="dataList.length == 0" style="padding-top: 100rpx;">
<u-empty text="无数据" :icon="getCdnUrl('kong.png')" textSize="28" width="86" height="97">
</u-empty>
</view>
</view>
</scroll-view>
</template>
</tpx-layout>
</template>
<script>
import getCdnUrl from "@/common/getCdnUrl"
import { goto, goBack, setClipboardData, confirmModal, showLoading } from "@/common/untool"
export default {
props: {
// hasLeftWin: {
// type: Boolean
// }
},
computed: {
},
data() {
return {
searchParam: {
keyword: '',
},
queryOption: {},
dataList: [
{},{},{},{},{},{},{},{}
],
showLoadMore: false,
loadedAll: false
}
},
onShareAppMessage() {
return {
// title: '',
// path: 'TODO'
}
},
onLoad(queryOption) {
this.queryOption = queryOption
this.searchParam.tabType = queryOption.tab || tabList[0].val
this.initData();
},
onUnload() {
},
methods: {
getCdnUrl,
initData(){
// showLoading()
setTimeout(() => {
uni.stopPullDownRefresh();
}, 300);
},
setListData() {
},
onScrollBottom() {
console.log("onScrollBottom");
if (this.loadedAll) {
return;
}
this.showLoadMore = true;
setTimeout(() => {
this.setListData();
}, 300);
},
handleSearchMoreBtn(){
if(!this.showLoadMore) {
// 回显更多条件
Object.keys(this.tmpSearchParam).map(t=> {
this.tmpSearchParam[t] = this.searchParam[t] || ''
})
}
this.showSearchMore = !this.showSearchMore
},
}
}
</script>
<style lang="scss">
@import '@/common/uni-nvue.scss';
page {
background-color: #F6F6F6;
height: 100% !important;
}
</style>
<style scoped lang="scss">
.pgb-header {
// padding-top: --status-bar-height;
padding-top: 30rpx;
padding-bottom: 30rpx;
background-color: #FFF;
position: relative;
}
.pgb-cont{
padding: 30rpx;
}
</style>