zhwl-miniapp/pages/notice/index.vue
2025-06-26 12:38:35 +08:00

70 lines
2.5 KiB
Vue

<template>
<view class="waper">
<u-navbar :autoBack="true" bgColor="#fff">
<view slot='center' class="navbar_title">通知公告</view>
</u-navbar>
<mescroll-body @init="mescrollInit" @down="downCallback" @up="upCallback" :down="downOption" :up="upOption" :top="paddingTop + 'px'">
<view class="list_waper">
<navigator hover-class="none" class="list" v-for="(item, index) in list" :url="'/pages/notice/detail?id=' + item.id" :key="index">
<view class="image">
<image :src="$utils.setImgUrl(item.image)" mode=""></image>
</view>
<view class="text">
<view>{{item.title}}</view>
<view>{{$utils.formatDate('Y-M-D h:m:s', item.publishtime * 1000)}}</view>
</view>
</navigator>
</view>
</mescroll-body>
</view>
</template>
<script>
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
export default {
mixins: [MescrollMixin],
data () {
return {
bgColor: '#fff',
paddingTop: 0,
list: []
}
},
onLoad(options) {
this.paddingTop = this.$paddingTop;
},
methods: {
async upCallback (page) {
let obj = { pageNum: page.num, pageSize: page.size };
let info = await this.$http.noticeList(obj);
if(page.num == 1) this.list = [];
this.list = this.list.concat(info.rows)
this.mescroll.endBySize(info.rows.length, info.total);
}
}
}
</script>
<style lang="scss">
.list_waper{
width: 100%; box-sizing: border-box; padding: 32rpx;
.list{
width: 100%; box-sizing: border-box; margin-bottom: 32rpx; padding-left: 242rpx; position: relative; height: 164rpx;
&:last-child{ margin-bottom: 0; }
.image{
width: 218rpx; height: 100%; position: absolute; left: 0; top: 0;
image{ border-radius: 12rpx; }
}
.text{
width: 100%;
view{
&:nth-child(1){
display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: 92rpx; line-height: 46rpx; color: #333; font-size: 32rpx; font-weight: 500;
}
&:nth-child(2){ margin-top: 36rpx; line-height: 34rpx; color: #999; font-size: 24rpx; }
}
}
}
}
</style>