494 lines
11 KiB
Vue
494 lines
11 KiB
Vue
|
|
<template>
|
||
|
|
<view class="container">
|
||
|
|
<headersVue :titles="titles" style=" position: static !important;">
|
||
|
|
<u-icon name="arrow-left" color="#fff" size="18" v-if="!showTabBar"></u-icon>
|
||
|
|
<template #right>
|
||
|
|
<image src="/static/icons/clearNotice.png" style="height: 40rpx;width: 40rpx;" @click="clearAll()">
|
||
|
|
</image>
|
||
|
|
</template>
|
||
|
|
</headersVue>
|
||
|
|
<view class="content">
|
||
|
|
<view class="top_">
|
||
|
|
<view class="top_box" v-for="(item,index) in taplist" :key="index" @click="tapqh(index)">
|
||
|
|
<view class="">{{ item }}</view>
|
||
|
|
<view class="gang" v-if="tapindex == index"></view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="lsit_">
|
||
|
|
<scroll-view class="school-scroll-view" scroll-y @scrolltolower="onReachBottomCus"
|
||
|
|
:style="{ height: scrollHeight + 'px' }" refresher-enabled @refresherrefresh="onRefresherrefresh"
|
||
|
|
:refresher-triggered="isTriggered">
|
||
|
|
<view class="lsit_box" v-for="(item,index) in arrlist" :key="index">
|
||
|
|
<view v-if="tapindex === 0" @click="readNotice(item)">
|
||
|
|
<view class="d_s" style="position: relative;">
|
||
|
|
<!-- 红色 * 角标 -->
|
||
|
|
<view style="position: absolute; top: 0rpx; left: 0rpx; color: red; font-size: 44rpx;"
|
||
|
|
v-if="!item.readStatus">*
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="t-zi" style="margin-left: 20rpx;" v-html="item.templateContent"></view>
|
||
|
|
</view>
|
||
|
|
<view v-if="tapindex === 1">
|
||
|
|
<view class="d_s" @click="getdetails(item.id)">
|
||
|
|
<view class="touxiang_">
|
||
|
|
<image :src="baseImageUrl+getUrl(item.newsCover)" mode=""></image>
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<view class="title_">{{ item.newsTitle }}</view>
|
||
|
|
<view class="num_">{{ getDate(item.createTime || new Date()) }}</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="t-zi" v-html="item.newsContent"></view>
|
||
|
|
</view>
|
||
|
|
<view v-if="tapindex === 2">
|
||
|
|
<view class="d_s" @click="getdetails(item.id)">
|
||
|
|
<view class="item-container">
|
||
|
|
<view class="title_">{{ item.title }}</view>
|
||
|
|
<view class="num_">{{ getDate(item.createTime || new Date()) }}</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="t-zi" v-html="item.content"></view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</scroll-view>
|
||
|
|
</view>
|
||
|
|
<!-- <view style="width: 100%; height: 88rpx;"></view> -->
|
||
|
|
|
||
|
|
</view>
|
||
|
|
<!-- 普通弹窗 -->
|
||
|
|
<uni-popup ref="popup" background-color="#fff">
|
||
|
|
<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
|
||
|
|
<text class="text popup-content-text">{{ nowReadItem.templateContent }}</text>
|
||
|
|
<button class="button popup-info" @click="dialogToggle"><text
|
||
|
|
class="button-text info-text">知道了</text></button>
|
||
|
|
</view>
|
||
|
|
</uni-popup>
|
||
|
|
|
||
|
|
<!-- 底部 -->
|
||
|
|
<!-- <view style="width: 100%; height: 50px;"></view> -->
|
||
|
|
<tabBar :msg="msg " v-if="showTabBar"></tabBar>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import headersVue from '../../components/header/headers.vue';
|
||
|
|
import request from "@/utils/request";
|
||
|
|
import {
|
||
|
|
formatDate
|
||
|
|
} from "@/utils/utils";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
titles: "通知",
|
||
|
|
type: "center",
|
||
|
|
nowReadItem: {},
|
||
|
|
tapindex: 0,
|
||
|
|
taplist: ["站内信", "监管通知", "内部通知"],
|
||
|
|
show: false,
|
||
|
|
status: 'loading',
|
||
|
|
msg: '2',
|
||
|
|
chuan: '',
|
||
|
|
roles: [],
|
||
|
|
jcshopRole: false,
|
||
|
|
jcgfRole: false,
|
||
|
|
isOpen: false,
|
||
|
|
fab: false,
|
||
|
|
imgs: '',
|
||
|
|
type: 'zflm',
|
||
|
|
animationData: {},
|
||
|
|
isRote: false,
|
||
|
|
animation: null,
|
||
|
|
actindex: 0,
|
||
|
|
partnerId: '',
|
||
|
|
arrlist: [],
|
||
|
|
pageNum: 1, //第几页
|
||
|
|
pageSize: 10, //一页多少张
|
||
|
|
totalPages: 0, //总数
|
||
|
|
baseImageUrl: this.$baseImageUrl,
|
||
|
|
showTabBar: true,
|
||
|
|
isTriggered: false,
|
||
|
|
scrollHeight: 0,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
components: {
|
||
|
|
headersVue
|
||
|
|
},
|
||
|
|
onShow() {
|
||
|
|
console.log('this.tapindex', this.tapindex);
|
||
|
|
if (this.tapindex === 2) {
|
||
|
|
this.getwarnMsglist()
|
||
|
|
} else if (this.tapindex == 1) {
|
||
|
|
this.getlistindex()
|
||
|
|
this.getIfSend()
|
||
|
|
} else if (this.tapindex == 0) {
|
||
|
|
this.getNoticeList()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad(data) {
|
||
|
|
this.partnerId = uni.getStorageSync('partnerId')
|
||
|
|
// if (data && data.index) {
|
||
|
|
// this.tapindex = parseInt(data.index)
|
||
|
|
// this.getwarnMsglist()
|
||
|
|
// } else {
|
||
|
|
// this.getlistindex()
|
||
|
|
// this.getIfSend()
|
||
|
|
// }
|
||
|
|
if (data.type && data.type === 'staff') {
|
||
|
|
this.showTabBar = false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onReady() {
|
||
|
|
// 动态计算滚动区域高度
|
||
|
|
this.calculateScrollHeight();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
setIndex(num) {
|
||
|
|
this.tapindex = num
|
||
|
|
},
|
||
|
|
calculateScrollHeight() {
|
||
|
|
// 获取屏幕高度
|
||
|
|
const screenHeight = uni.getSystemInfoSync().windowHeight;
|
||
|
|
// 获取顶部区域高度
|
||
|
|
let topHeight = 270;
|
||
|
|
if (!this.showTabBar) {
|
||
|
|
topHeight = 200
|
||
|
|
}
|
||
|
|
// 计算滚动区域高度
|
||
|
|
this.scrollHeight = screenHeight - topHeight;
|
||
|
|
},
|
||
|
|
getUrl(value) {
|
||
|
|
if (!value) {
|
||
|
|
return ""
|
||
|
|
}
|
||
|
|
if (value[0] === '/') {
|
||
|
|
return value
|
||
|
|
} else {
|
||
|
|
return "/" + value
|
||
|
|
}
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 上滑加载数据
|
||
|
|
*/
|
||
|
|
onReachBottomCus() {
|
||
|
|
//判断 如果页码*页容量大于等于总条数,提示该页数据加载完毕
|
||
|
|
if (this.pageNum >= this.totalPages) {
|
||
|
|
uni.$u.toast('没有更多数据了')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
//页码+1,调用获取数据的方法获取第二页数据
|
||
|
|
this.pageNum++
|
||
|
|
//此处调用自己获取数据列表的方法
|
||
|
|
if (this.tapindex === 2) {
|
||
|
|
this.getwarnMsglist()
|
||
|
|
} else if (this.tapindex == 1) {
|
||
|
|
this.getlistindex()
|
||
|
|
this.getIfSend()
|
||
|
|
} else if (this.tapindex == 0) {
|
||
|
|
this.getNoticeList()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 下拉刷新数据
|
||
|
|
*/
|
||
|
|
onRefresherrefresh() {
|
||
|
|
this.isTriggered = true
|
||
|
|
this.pageNum = 1
|
||
|
|
this.total = 0
|
||
|
|
this.schoolList = []
|
||
|
|
if (this.tapindex === 2) {
|
||
|
|
this.getwarnMsglist()
|
||
|
|
} else if (this.tapindex == 1) {
|
||
|
|
this.getlistindex()
|
||
|
|
this.getIfSend()
|
||
|
|
} else if (this.tapindex == 0) {
|
||
|
|
this.getNoticeList()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 消息设置为已读
|
||
|
|
*/
|
||
|
|
dialogToggle() {
|
||
|
|
this.$refs.popup.close()
|
||
|
|
},
|
||
|
|
toAdd() {
|
||
|
|
uni.navigateTo({
|
||
|
|
url: '/pages/authority/newadd?type=' + null
|
||
|
|
})
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 点击阅读消息
|
||
|
|
*/
|
||
|
|
async readNotice(item) {
|
||
|
|
this.nowReadItem = item
|
||
|
|
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
||
|
|
this.$refs.popup.open(this.type)
|
||
|
|
//直接请求后台已读
|
||
|
|
await request({
|
||
|
|
url: "/system/notify-message/update-read",
|
||
|
|
method: "PUT",
|
||
|
|
params: {
|
||
|
|
ids: this.nowReadItem.id
|
||
|
|
},
|
||
|
|
}).then((res) => {
|
||
|
|
if (res.code == 200) {
|
||
|
|
item.readStatus = true
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
async clearAllNew() {
|
||
|
|
//直接请求后台已读
|
||
|
|
const res = await request({
|
||
|
|
url: "/system/notify-message/update-all-read",
|
||
|
|
method: "PUT",
|
||
|
|
})
|
||
|
|
this.onRefresherrefresh()
|
||
|
|
},
|
||
|
|
getIfSend() {
|
||
|
|
request({
|
||
|
|
url: '/system/inspectionNews/ifSend',
|
||
|
|
method: 'get'
|
||
|
|
}).then(res => {
|
||
|
|
this.ifSend = res.data
|
||
|
|
})
|
||
|
|
},
|
||
|
|
clearAll() {
|
||
|
|
let that = this
|
||
|
|
uni.showModal({
|
||
|
|
title: '确认',
|
||
|
|
content: '确认全部已读吗?',
|
||
|
|
success: function(res) {
|
||
|
|
if (res.confirm) {
|
||
|
|
that.clearAllNew()
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
},
|
||
|
|
async getwarnMsglist() {
|
||
|
|
let res = await request({
|
||
|
|
url: '/warnMsg/warnMsg/list',
|
||
|
|
method: 'get',
|
||
|
|
})
|
||
|
|
this.arrlist = res.data
|
||
|
|
let total = res.total
|
||
|
|
this.totalPages = Math.ceil(total / this.pageSize);
|
||
|
|
this.isTriggered = false
|
||
|
|
},
|
||
|
|
getDate(value) {
|
||
|
|
return formatDate(value)
|
||
|
|
},
|
||
|
|
tapqh(index) {
|
||
|
|
this.tapindex = index
|
||
|
|
this.arrlist = []
|
||
|
|
this.pageNum = 1
|
||
|
|
if (index === 0) {
|
||
|
|
this.getNoticeList()
|
||
|
|
} else if (index === 1) {
|
||
|
|
this.getlistindex()
|
||
|
|
} else if (index === 2) {
|
||
|
|
this.getwarnMsglist()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
getdetails(id) {
|
||
|
|
const url = this.tapindex === 0 ? '/pages/xiaoxi/details?id=' + id : '/pages/xiaoxi/details?id=' + id +
|
||
|
|
"&index=1"
|
||
|
|
uni.navigateTo({
|
||
|
|
url: url
|
||
|
|
})
|
||
|
|
},
|
||
|
|
getback() {
|
||
|
|
uni.navigateBack({
|
||
|
|
delta: 1,
|
||
|
|
})
|
||
|
|
},
|
||
|
|
async getlistindex() {
|
||
|
|
let res = await request({
|
||
|
|
url: '/appInspection/news/msgList',
|
||
|
|
method: 'get',
|
||
|
|
data: {
|
||
|
|
partnerId: this.partnerId,
|
||
|
|
pageSize: this.pageSize,
|
||
|
|
pageNum: this.pageNum
|
||
|
|
}
|
||
|
|
})
|
||
|
|
// this.arrlist = res.rows
|
||
|
|
if (this.pageNum != 1) {
|
||
|
|
this.arrlist = this.arrlist.concat(res.data.records)
|
||
|
|
} else {
|
||
|
|
this.arrlist = res.data.records
|
||
|
|
}
|
||
|
|
let total = res.total
|
||
|
|
this.totalPages = Math.ceil(total / this.pageSize);
|
||
|
|
this.isTriggered = false
|
||
|
|
},
|
||
|
|
async getNoticeList() {
|
||
|
|
let res = await request({
|
||
|
|
url: '/system/notify-message/my-page',
|
||
|
|
method: 'get',
|
||
|
|
data: {
|
||
|
|
pageSize: this.pageSize,
|
||
|
|
pageNo: this.pageNum,
|
||
|
|
systemCode: 'jiance'
|
||
|
|
}
|
||
|
|
})
|
||
|
|
// this.arrlist = res.rows
|
||
|
|
if (this.pageNum != 1) {
|
||
|
|
this.arrlist = this.arrlist.concat(res.data.list)
|
||
|
|
} else {
|
||
|
|
this.arrlist = res.data.list
|
||
|
|
}
|
||
|
|
let total = res.data.total
|
||
|
|
this.totalPages = Math.ceil(total / this.pageSize);
|
||
|
|
this.isTriggered = false
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
.container {
|
||
|
|
background: #F7F8FC;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content {
|
||
|
|
background: #F7F8FC;
|
||
|
|
width: 100%;
|
||
|
|
|
||
|
|
box-sizing: border-box;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.top_ {
|
||
|
|
margin-top: 20rpx;
|
||
|
|
height: 98rpx;
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
background: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.top_box {
|
||
|
|
width: 50%;
|
||
|
|
height: 98rpx;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 28rpx;
|
||
|
|
color: #8D90A6;
|
||
|
|
box-sizing: border-box;
|
||
|
|
padding: 30rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gang {
|
||
|
|
width: 112rpx;
|
||
|
|
height: 8rpx;
|
||
|
|
background: linear-gradient(90deg, #366FFF 0%, #5DA0FC 100%);
|
||
|
|
margin: 5px auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.lsit_ {
|
||
|
|
background: #F7F8FC;
|
||
|
|
box-sizing: border-box;
|
||
|
|
padding: 30rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.lsit_box {
|
||
|
|
width: 100%;
|
||
|
|
border-radius: 8rpx;
|
||
|
|
box-sizing: border-box;
|
||
|
|
padding: 30rpx;
|
||
|
|
background: #fff;
|
||
|
|
margin-bottom: 20rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.d_s {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.touxiang_ {
|
||
|
|
width: 40%;
|
||
|
|
height: 100px;
|
||
|
|
margin-right: 10px;
|
||
|
|
overflow: hidden;
|
||
|
|
|
||
|
|
image {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.title_ {
|
||
|
|
font-size: 32rpx;
|
||
|
|
color: #101A3E;
|
||
|
|
overflow: hidden;
|
||
|
|
//white-space: nowrap;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
|
||
|
|
.num_ {
|
||
|
|
font-size: 24rpx;
|
||
|
|
color: #327DFB;
|
||
|
|
}
|
||
|
|
|
||
|
|
.text_ {
|
||
|
|
font-size: 24rpx;
|
||
|
|
color: #8D90A6;
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
display: -webkit-box;
|
||
|
|
-webkit-box-orient: vertical;
|
||
|
|
-webkit-line-clamp: 2;
|
||
|
|
margin-top: 20rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.t-zi {
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: 400;
|
||
|
|
color: #666666;
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
display: -webkit-box;
|
||
|
|
-webkit-line-clamp: 3;
|
||
|
|
-webkit-box-orient: vertical;
|
||
|
|
}
|
||
|
|
|
||
|
|
.item-container {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
width: 100%;
|
||
|
|
/* 确保容器占满父级 */
|
||
|
|
}
|
||
|
|
|
||
|
|
.popup-content {
|
||
|
|
padding: 15px;
|
||
|
|
height: auto;
|
||
|
|
margin: auto;
|
||
|
|
width: 90%;
|
||
|
|
background-color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.popup-content-text {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.text {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
|
||
|
|
.popup-info {
|
||
|
|
margin-top: 30rpx;
|
||
|
|
color: #fff;
|
||
|
|
background-color: #f2f6fc;
|
||
|
|
}
|
||
|
|
|
||
|
|
.info-text {
|
||
|
|
color: #909399;
|
||
|
|
}
|
||
|
|
</style>
|