You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
101 lines
2.0 KiB
101 lines
2.0 KiB
<template>
|
|
<view style="padding-bottom: 30px;">
|
|
<view class="notify-panel" v-for="(item,index) in datas" :key="index" @click="toDetail(item)">
|
|
<view class="notify-panel-top">
|
|
<view class="notify-dot"></view>
|
|
<view class="notify-tips">收到一条新消息</view>
|
|
<view class="notify-time">{{item.create_time}}</view>
|
|
</view>
|
|
<view class="notify-panel-bottom">{{item.title}}</view>
|
|
</view>
|
|
<u-loadmore :status="status" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { notify } from '@/service/index.js';
|
|
|
|
export default {
|
|
onReachBottom(){
|
|
console.log("onReachBottom")
|
|
if(this.status == 'loadmore'){
|
|
this.fetchDatas(this.page + 1)
|
|
}
|
|
},
|
|
onLoad(){
|
|
this.fetchDatas()
|
|
},
|
|
data() {
|
|
return {
|
|
datas:[],
|
|
page:1,
|
|
status: 'nomore',
|
|
}
|
|
},
|
|
methods: {
|
|
async fetchDatas(page = 1){
|
|
let res = await notify(page)
|
|
if(res.data.datas.current_page == 1){
|
|
this.datas = res.data.datas.data
|
|
}else{
|
|
this.datas = this.datas.concat(res.data.datas.data)
|
|
}
|
|
if(res.data.datas.prev_page_url){
|
|
this.status ='loadmore'
|
|
}else{
|
|
this.status = 'nomore'
|
|
}
|
|
this.page = res.data.datas.current_page
|
|
console.log("fetchDatas",res)
|
|
},
|
|
toDetail(item){
|
|
this.$url('/packages/article/article?type=notify_detail&id='+item.id)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.notify-panel{
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: white;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
.notify-panel-top{
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 32rpx;
|
|
padding-top: 20rpx;
|
|
padding-bottom: 20rpx;
|
|
}
|
|
.notify-dot {
|
|
width: 12rpx;
|
|
height: 12rpx;
|
|
background-color: red;
|
|
border-radius: 6rpx;
|
|
margin-right: 10rpx;
|
|
|
|
}
|
|
.notify-panel-bottom{
|
|
margin-left: 32rpx;
|
|
margin-bottom: 30rpx;
|
|
font-size: 28rpx;
|
|
line-height: 40rpx;
|
|
color: #222222;
|
|
}
|
|
.notify-tips{
|
|
margin-right: 110rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
color: #222222;
|
|
line-height: 44rpx;
|
|
}
|
|
.notify-time{
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #777777;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
</style>
|