msgList.vue 1.15 KB
<template>
	<view>
		<z-paging ref="paging" v-model="dataList" @query="queryList">
			<!-- z-paging默认铺满全屏,此时页面所有view都应放在z-paging标签内,否则会被盖住 -->
			<!-- 需要固定在页面顶部的view请通过slot="top"插入,包括自定义的导航栏 -->
			<uni-section title="待办提醒" padding>
				<view class="msglist">
					<view class="msgitem" v-for="n in dataList">
						<text class="dot" :class="n.isRead?'done':''"></text>
						<view class="tt esp">你有一条会员缴费等待审批,点击前去处理!</view>
						<view class="date">2023-09-23</view>
					</view>
				</view>
			</uni-section>
		</z-paging>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'
	const dataList = ref([])
	const paging = ref(null)
	const total = ref(50)
	const current = ref(2)
	function queryList(pageNo, pageSize){
		paging.value.complete([{},{},{},{},{},{},{},{},{}]);
	}
</script>

<style lang="scss" scoped>
	:deep(.uni-section) {
		background-color: transparent;
	}

	:deep(.uni-section .uni-section-header__content) {
		font-size: 36rpx;
		color: #29343C;
	}
</style>