|
|
|
@ -8,20 +8,27 @@ |
|
|
|
</ul> |
|
|
|
<div class="process-right"> |
|
|
|
<div class="head-container"> |
|
|
|
<el-input v-model="search" clearable size="small" placeholder="输入标题关键字搜索" prefix-icon="el-icon-search" class="filter-item" style="width: 225px;" /> |
|
|
|
<el-input v-model="search" clearable size="small" placeholder="输入标题关键字搜索" prefix-icon="el-icon-search" class="filter-item" style="width: 225px;" @clear="handleSearch" @keyup.enter.native="handleSearch" /> |
|
|
|
<date-range-picker v-model="blurryTime" class="date-item" /> |
|
|
|
<el-button icon="el-icon-search" size="mini" class="user-search-btn">搜索</el-button> |
|
|
|
<el-button icon="el-icon-search" size="mini" class="user-search-btn" @click="handleSearch">搜索</el-button> |
|
|
|
<el-button class="iconfont icon-quanbuyidu" size="mini" @click="handleAllRead">全部已读</el-button> |
|
|
|
<el-select v-model="unread" placeholder="请选择" style="width: 90px; margin-left: 10px;" @change="handleSearch"> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<!-- <MessageList :list-index="listIndex" :items="items" /> --> |
|
|
|
<div v-loading="loading" class="message-center-list"> |
|
|
|
<div v-if="hasMore" class="more-btn" @click="loadMore"><i class="iconfont icon-jiazaigengduo" />点击加载更多</div> |
|
|
|
<div v-if="hasMore && loading===false" class="more-btn" @click="loadMore"><i class="iconfont icon-jiazaigengduo" />点击加载更多</div> |
|
|
|
<div v-for="(item,index) in items" :key="index" class="message-item" @click="handleDetail(item)"> |
|
|
|
<div class="message-date">{{ item.createTime | parseTime }}</div> |
|
|
|
<div class="message-cont"> |
|
|
|
<div class="message-cont-info"> |
|
|
|
<span :class="['message-type-title',{'type-title1': listIndex === 0 },{'type-title2': listIndex === 1 },{'type-title3': listIndex === 2 },{'type-title4': listIndex === 3 }]">{{ titleType }}</span> |
|
|
|
<span class="is-read-tip">{{ item.isRead === 0 ? '未读' : '已读' }}</span> |
|
|
|
<span :class="[ item.isRead === 0 ? 'unread-tip' : 'unread-tip read-tip']">{{ item.isRead === 0 ? '未读' : '已读' }}</span> |
|
|
|
<div class="message-title">{{ item.noticeTitle }}</div> |
|
|
|
<ul class="message-list-info"> |
|
|
|
<li>创建人：{{ item.createBy }}</li> |
|
|
|
@ -31,8 +38,9 @@ |
|
|
|
<div class="message-more">查看详情<i class="iconfont icon-chakan" /></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<el-empty v-if="items.length === 0 && loading===false" :image-size="200" /> |
|
|
|
|
|
|
|
<el-dialog :visible.sync="messageVisible" :modal-append-to-body="false" :close-on-click-modal="false" append-to-body title="消息详情"> |
|
|
|
<el-dialog :visible.sync="messageVisible" :modal-append-to-body="false" :close-on-click-modal="false" append-to-body title="消息详情" @closed="closeDialog"> |
|
|
|
<div class="setting-dialog"> |
|
|
|
<div class="message-detail"> |
|
|
|
<span :class="['message-type-title',{'type-title1': listIndex === 0 },{'type-title2': listIndex === 1 },{'type-title3': listIndex === 2 },{'type-title4': listIndex === 3 }]">{{ titleType }}</span> |
|
|
|
@ -42,7 +50,7 @@ |
|
|
|
</div> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
<el-button v-if="detailInfo.noticeType === 1" @click="dealWithCont">流程处理</el-button> |
|
|
|
<el-button type="primary" @click="messageVisible=false">确定</el-button> |
|
|
|
<el-button type="primary" @click="closeDialog">确定</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
@ -56,42 +64,39 @@ |
|
|
|
|
|
|
|
<script> |
|
|
|
import DateRangePicker from '@/components/DateRangePicker' |
|
|
|
import { FetchMySystemNotice, FetchInitNoticeDetails } from '@/api/system/new' |
|
|
|
import { getUserNotice, isread } from '@/api/system/logs' |
|
|
|
// import CRUD, { presenter, header, crud } from '@crud/crud' |
|
|
|
// import MessageList from './module/list.vue' |
|
|
|
import { FetchMySystemNotice, FetchInitNoticeDetails, FetchReadedAll } from '@/api/system/new' |
|
|
|
import detail from '../processCenter/module/form' |
|
|
|
|
|
|
|
export default { |
|
|
|
name: 'MessageCenter', |
|
|
|
inject: ['reload'], |
|
|
|
components: { DateRangePicker, detail }, |
|
|
|
// mixins: [presenter(), crud(), header()], |
|
|
|
// cruds() { |
|
|
|
// return CRUD({ |
|
|
|
// url: 'api/news/mySystemNotice', |
|
|
|
// sort: ['createTime,desc'], |
|
|
|
// optShow: {} |
|
|
|
// }) |
|
|
|
// }, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
selections: [], |
|
|
|
blurryTime: [], |
|
|
|
search: null, |
|
|
|
unread: null, |
|
|
|
options: [{ |
|
|
|
value: 0, |
|
|
|
label: '未读' |
|
|
|
}, { |
|
|
|
value: null, |
|
|
|
label: '全部' |
|
|
|
}], |
|
|
|
listIndex: 0, |
|
|
|
titleType: '系统通知', |
|
|
|
items: [], |
|
|
|
page: { |
|
|
|
total: 0, |
|
|
|
size: 2, |
|
|
|
page: 10, |
|
|
|
size: 10, |
|
|
|
page: 0, |
|
|
|
totalPages: 0 |
|
|
|
}, |
|
|
|
loading: false, |
|
|
|
messageVisible: false, |
|
|
|
detailInfo: {}, |
|
|
|
opinionTxt: '', |
|
|
|
currentMessage: null, |
|
|
|
hasMore: true // 是否还有更多数据 |
|
|
|
} |
|
|
|
}, |
|
|
|
@ -103,25 +108,23 @@ export default { |
|
|
|
this.listIndex = index |
|
|
|
this.getIndex() |
|
|
|
}, |
|
|
|
getParams() { |
|
|
|
const params = { |
|
|
|
search: this.search, |
|
|
|
page: this.page.page - 1, |
|
|
|
size: this.page.size, |
|
|
|
startTime: this.blurryTime[0], |
|
|
|
endTime: this.blurryTime[1], |
|
|
|
sort: 'createTime,desc' |
|
|
|
} |
|
|
|
return params |
|
|
|
handleSearch() { |
|
|
|
this.page.page = 0 |
|
|
|
this.page.totalPages = 0 |
|
|
|
this.items = [] |
|
|
|
this.loadData() |
|
|
|
}, |
|
|
|
getListMessage() { |
|
|
|
this.loading = true |
|
|
|
FetchMySystemNotice(this.getParams()).then(res => { |
|
|
|
const params = { |
|
|
|
'search': this.search, |
|
|
|
'page': this.page.page, |
|
|
|
'size': this.page.size, |
|
|
|
'unread': this.unread, |
|
|
|
'startTime': this.blurryTime[0], |
|
|
|
'endTime': this.blurryTime[1] |
|
|
|
} |
|
|
|
FetchMySystemNotice(params).then(res => { |
|
|
|
const listData = res.content |
|
|
|
// table.forEach(item => { |
|
|
|
// item.pushUserName = item.noticeUsers[0].pushUserName |
|
|
|
// item.isRead = item.noticeUsers[0].isRead |
|
|
|
// }) |
|
|
|
if (listData.length === 0) { |
|
|
|
this.loading = false |
|
|
|
} else { |
|
|
|
@ -129,8 +132,12 @@ export default { |
|
|
|
} |
|
|
|
this.page.total = res.totalElements |
|
|
|
this.page.totalPages = res.totalPages |
|
|
|
// this.items = this.items.concat(table) |
|
|
|
this.items = [...listData, ...this.items] |
|
|
|
if (this.page.page >= this.page.totalPages) { |
|
|
|
this.hasMore = false |
|
|
|
} else { |
|
|
|
this.hasMore = true |
|
|
|
} |
|
|
|
this.loading = false |
|
|
|
}) |
|
|
|
}, |
|
|
|
@ -139,10 +146,6 @@ export default { |
|
|
|
setTimeout(() => { |
|
|
|
this.getListMessage() |
|
|
|
this.page.page++ |
|
|
|
this.loading = false |
|
|
|
if (this.page.page > this.page.totalPages) { |
|
|
|
this.hasMore = false |
|
|
|
} |
|
|
|
}, 1000) |
|
|
|
}, |
|
|
|
loadMore() { |
|
|
|
@ -152,28 +155,22 @@ export default { |
|
|
|
this.loadData() |
|
|
|
}, |
|
|
|
handleDetail(item) { |
|
|
|
switch (item.noticaType) { |
|
|
|
case 0: |
|
|
|
this.opinionTxt = '这是一条系统通知' |
|
|
|
break |
|
|
|
case 1: |
|
|
|
this.opinionTxt = '这是一条有流程达到提醒' |
|
|
|
break |
|
|
|
case 2: |
|
|
|
this.opinionTxt = '这是一条流程完成提醒' |
|
|
|
break |
|
|
|
case 3: |
|
|
|
this.opinionTxt = '这是一条赋权到期提醒' |
|
|
|
break |
|
|
|
this.currentMessage = this.items.find(i => i.noticeId === item.noticeId) |
|
|
|
const params = { |
|
|
|
'newsType': item.noticeType, |
|
|
|
'noticeId': item.noticeId |
|
|
|
} |
|
|
|
FetchInitNoticeDetails({ 'noticeId': item.noticeId }).then((res) => { |
|
|
|
console.log(res) |
|
|
|
FetchInitNoticeDetails(params).then((res) => { |
|
|
|
this.detailInfo = res |
|
|
|
this.messageVisible = true |
|
|
|
}).catch(err => { |
|
|
|
console.log(err) |
|
|
|
}) |
|
|
|
}, |
|
|
|
closeDialog() { |
|
|
|
this.messageVisible = false |
|
|
|
this.currentMessage.isRead = 1 |
|
|
|
}, |
|
|
|
getIndex() { |
|
|
|
switch (this.listIndex) { |
|
|
|
case 0: |
|
|
|
@ -194,35 +191,28 @@ export default { |
|
|
|
break |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
// 标记已读 |
|
|
|
handleRead() { |
|
|
|
isread(this.getUserMsgId(this.selections)).then(res => { |
|
|
|
if (res) { |
|
|
|
// this.getListMessage() |
|
|
|
this.reload() |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 全部标记已读 |
|
|
|
async handleAllRead() { |
|
|
|
const params = { |
|
|
|
page: 0, |
|
|
|
size: 10, |
|
|
|
sort: 'createTime,desc' |
|
|
|
} |
|
|
|
const list = [] |
|
|
|
const allList = await this.getAllNoRead(params, list) |
|
|
|
isread(this.getUserMsgId(allList)).then(res => { |
|
|
|
// const params = { |
|
|
|
// page: 0, |
|
|
|
// size: 10, |
|
|
|
// sort: 'createTime,desc' |
|
|
|
// } |
|
|
|
// const list = [] |
|
|
|
// const allList = await this.getAllNoRead(params, list) |
|
|
|
FetchReadedAll({ 'newsType': 0 }).then(res => { |
|
|
|
console.log(res) |
|
|
|
if (res) { |
|
|
|
this.reload() |
|
|
|
this.items.forEach(item => { |
|
|
|
item.isRead = 1 |
|
|
|
}) |
|
|
|
// this.getListMessage() |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 递归获取所有列表 |
|
|
|
async getAllNoRead(params, list) { |
|
|
|
const allList = await getUserNotice(params).then(res => { |
|
|
|
const allList = await FetchMySystemNotice(params).then(res => { |
|
|
|
list = list.concat(res.content) |
|
|
|
if ((list.length) < res.totalElements) { |
|
|
|
params.page++ |
|
|
|
@ -248,7 +238,7 @@ export default { |
|
|
|
background-color: #02255f; |
|
|
|
.message-cont-info{ |
|
|
|
color: #fff; |
|
|
|
.is-read-tip{ |
|
|
|
.unread-tip{ |
|
|
|
color: #1890ff; |
|
|
|
border: 1px solid #339cff; |
|
|
|
background-color: #02255f; |
|
|
|
@ -301,7 +291,7 @@ export default { |
|
|
|
padding: 16px 20px; |
|
|
|
color: #545B65; |
|
|
|
|
|
|
|
.is-read-tip{ |
|
|
|
.unread-tip{ |
|
|
|
position: absolute; |
|
|
|
right: 20px; |
|
|
|
top: 16px; |
|
|
|
@ -312,6 +302,11 @@ export default { |
|
|
|
color: #ED4A41; |
|
|
|
background-color: #FDEFEE; |
|
|
|
border-radius: 3px; |
|
|
|
&.read-tip{ |
|
|
|
color: #a6adb6; |
|
|
|
border: 1px solid #e6e8ed; |
|
|
|
background-color: #f3f5f9; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.message-list-info{ |
|
|
|
|
