<template>
|
<view>
|
<view class="tips" :class="{ 'tips-ani': tipShow }">刷新成功</view>
|
|
<view class="newsTab">
|
<view class="content">
|
<view>
|
<!-- 基于 uni-list 的页面布局 -->
|
<uni-list>
|
<!-- to 属性携带参数跳转详情页面，当前只为参考 ?title=新标题 -->
|
<!-- <uni-list-item style="margin-top: 10px;background-color:#EFEFF4;border-radius: 5px;"-->
|
<!-- v-for="item in data" :key="item.id" :to="'msgDetail?id='+item.id+'&title='+item.title"-->
|
<!-- :showBadge="item.dealWith == 0" :title="item.title" badge-text="1"-->
|
<!-- :note="item.createDate" badge-type="error">-->
|
<!-- </uni-list-item>-->
|
<uni-list-item style="margin-top: 10px;background-color:#EFEFF4;border-radius: 5px;"
|
v-for="item in data" :key="item.id"
|
:showBadge="item.dealWith == 0" :title="item.title" badge-text="1" :note="item.createDate"
|
badge-type="error" showExtraIcon=true clickable @click="to(item)">
|
<template slot="header" v-if="item.isMessage == 0">
|
<image src="../../static/img/imgMenu/error.png"></image>
|
</template>
|
<template slot="header" v-else-if="item.isMessage == 2">
|
<image src="../../static/img/imgMenu/treated.png"></image>
|
</template>
|
<template slot="header" v-else>
|
<image src="../../static/img/imgMenu/mail.png"></image>
|
</template>
|
</uni-list-item>
|
</uni-list>
|
</view>
|
</view>
|
</view>
|
|
|
</view>
|
</template>
|
|
<script>
|
import msgDetail from "./msgDetail.vue";
|
|
export default {
|
computed: {
|
msgDetail() {
|
return msgDetail
|
}
|
},
|
components: {},
|
data() {
|
return {
|
data: [],
|
tipShow: false, // 是否显示顶部提示框
|
pageIndex: 1,
|
limit: 20,
|
totalPage: 0,
|
totalCount: 0,
|
noData: false, // 没有更多数据了
|
isLoading: false, // 是否正在加载
|
};
|
},
|
onLoad() {
|
//页面加载时调用的事件
|
this.init();
|
},
|
methods: {
|
init() {
|
//页面加载时调用的事件
|
this.$post({
|
url: "/MessageCenter/getPushFailed",
|
data: {
|
pageIndex: this.pageIndex,
|
limit: this.limit,
|
createBy: this.$loginInfo.account,
|
},
|
}).then(res => {
|
if (this.pageIndex === 1) {
|
// 如果是第一页，直接覆盖原数据
|
this.data = res.data.tbBillList;
|
} else {
|
|
if (res.data.tbBillList.length > 0) {
|
// 如果是下一页，追加新数据
|
this.data = [...this.data, ...res.data.tbBillList];
|
}
|
|
}
|
this.totalCount = res.data.totalCount;
|
this.totalPage = Math.ceil(this.totalCount / this.limit);
|
|
this.noData = this.pageIndex >= this.totalPage;
|
this.isLoading = false; // 结束加载
|
}).catch(() => {
|
this.isLoading = false; // 出现错误时结束加载
|
});
|
},
|
to(item) {
|
if (item.isMessage == 0) {
|
uni.navigateTo({
|
url: 'msgDetail?id=' + item.id + '&title=' + item.title
|
});
|
} else if (item.isMessage == 2) {
|
uni.navigateTo({
|
url: 'treated?id=' + item.id + '&title=' + item.title
|
});
|
} else {
|
uni.navigateTo({
|
url: 'information?id=' + item.id + '&title=' + item.title
|
});
|
}
|
|
}
|
},
|
/**
|
* 下拉刷新回调函数
|
*/
|
onPullDownRefresh() {
|
this.pageIndex = 1;
|
//重新执行一遍查询
|
this.init();
|
this.tipShow = true;
|
//关闭动画
|
uni.stopPullDownRefresh();
|
|
setTimeout(function () {
|
this.tipShow = false;
|
}, 3000);
|
},
|
/**
|
* 上拉加载回调函数
|
*/
|
onReachBottom() {
|
if (this.noData || this.isLoading) return;
|
this.pageIndex++;
|
this.init(); // 加载更多数据
|
},
|
onShow() {
|
//每次进入页面都会执行的方法
|
this.pageIndex = 1;
|
this.data = [];
|
//this.current = 0
|
this.init();
|
}
|
};
|
</script>
|
|
<style lang="scss">
|
.form-group {
|
display: flex;
|
align-items: center;
|
}
|
|
.tips {
|
color: #67c23a;
|
font-size: 14px;
|
line-height: 40px;
|
text-align: center;
|
background-color: #f0f9eb;
|
height: 0;
|
opacity: 0;
|
transform: translateY(-100%);
|
transition: all 0.3s;
|
}
|
|
.tips-ani {
|
transform: translateY(0);
|
height: 40px;
|
opacity: 1;
|
}
|
|
.italic-bold {
|
font-style: italic;
|
font-weight: bold;
|
}
|
|
uni-image {
|
width: 50px;
|
height: 50px;
|
display: inline-block;
|
overflow: hidden;
|
position: relative;
|
}
|
</style>
|
