|
@@ -34,6 +34,10 @@
|
|
|
@select="handleSelect"
|
|
|
></el-autocomplete>
|
|
|
</div> -->
|
|
|
+ <div style="margin-right: 20px;cursor: pointer;" @click="getList();isShow = true">
|
|
|
+ <i class="el-icon-message-solid"></i>
|
|
|
+ <el-badge is-dot></el-badge>
|
|
|
+ </div>
|
|
|
<shortcut />
|
|
|
<template v-if="device !== 'mobile'">
|
|
|
<!-- 全屏控制 -->
|
|
@@ -58,6 +62,110 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<notice-bar />
|
|
|
+ <el-drawer
|
|
|
+ title="系统消息"
|
|
|
+ :visible.sync="isShow"
|
|
|
+ :append-to-body="true"
|
|
|
+ :with-header="false"
|
|
|
+ direction="rtl"
|
|
|
+ size="25%">
|
|
|
+ <div class="message">
|
|
|
+ <div class="head">
|
|
|
+ <div class="flex_asb">
|
|
|
+ <el-radio-group size="small" v-model="messageType" @change="getList">
|
|
|
+ <el-radio-button :label="['WBI','WBK','CRE_ORDER','SEND_MALL','RP_MALL','CR_SALES']">系统消息</el-radio-button>
|
|
|
+ <el-radio-button :label="['NOTICE']">平台公告</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ <el-switch
|
|
|
+ v-model="isOpen"
|
|
|
+ @change="updateIsNotice"
|
|
|
+ inactive-text="消息弹窗"
|
|
|
+ active-color="#13ce66"
|
|
|
+ inactive-color="#ff4949">
|
|
|
+ </el-switch>
|
|
|
+ </div>
|
|
|
+ <el-radio-group size="mini" v-model="dateType" @change="getList" style="margin: 10px 0;">
|
|
|
+ <el-radio-button label="">全部</el-radio-button>
|
|
|
+ <el-radio-button :label="0">今天</el-radio-button>
|
|
|
+ <el-radio-button :label="1">昨天</el-radio-button>
|
|
|
+ <el-radio-button :label="6">近7天</el-radio-button>
|
|
|
+ <el-radio-button :label="29">近30天</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ <div class="flex_asb">
|
|
|
+ <el-radio-group size="mini" v-model="readFlag" @change="getList">
|
|
|
+ <el-radio-button label="">全部</el-radio-button>
|
|
|
+ <el-radio-button label="NO">未读</el-radio-button>
|
|
|
+ <el-radio-button label="YES">已读</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ <div style="color: #409EFF;cursor: pointer;" @click="confirmRead">
|
|
|
+ <i class="el-icon-message-solid"></i>
|
|
|
+ <span style="font-size: 14px;">全部已读</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-card class="box-card" v-for="(item,index) in messageData" style="margin-top: 10px;">
|
|
|
+ <div @click="isShow = false;toDetail(item.adminNoticeType,item.paidType,(item.adminNoticeType=='NOTICE'?item.noticeId:item.orderId))">
|
|
|
+ <div class="flex_asb item">
|
|
|
+ <div v-if="messageType == ['NOTICE']">
|
|
|
+ <span>公告类型:</span>
|
|
|
+ <span>{{statusFilter(item.adminNoticeType)}}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <span>消息类型:</span>
|
|
|
+ <span>{{statusFilter(item.adminNoticeType)}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="read1" v-if="item.readFlag == 'NO'">未读</div>
|
|
|
+ <div class="read2" v-if="item.readFlag == 'YES'">已读</div>
|
|
|
+ </div>
|
|
|
+ <div class="item">
|
|
|
+ <div v-if="messageType == ['NOTICE']">
|
|
|
+ <span>文件标题:</span>
|
|
|
+ <span style="color: #409Eff">{{item.title}}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <span>订单编号:</span>
|
|
|
+ <span style="color: #409Eff">{{item.orderId}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="item">
|
|
|
+ <div v-if="messageType == ['NOTICE']">
|
|
|
+ <span>发布人:</span>
|
|
|
+ <span>{{item.issueNickName | ''}}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <span>消息内容:</span>
|
|
|
+ <span>{{item.content}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="item">
|
|
|
+ <div v-if="messageType == ['NOTICE']">
|
|
|
+ <span>发布时间:</span>
|
|
|
+ <span>{{item.issueTime}}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <span>创建时间:</span>
|
|
|
+ <span>{{item.createTime}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.readFlag == 'YES'" class="item">
|
|
|
+ <span>阅读人:</span>
|
|
|
+ <span>{{item.adminNickName }} {{item.readTime}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ <el-empty v-if="messageData.length == 0" description="暂无数据"></el-empty>
|
|
|
+ <div class="flex_ac bottom">
|
|
|
+ <el-pagination
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-size="pageSize"
|
|
|
+ layout="prev, pager, next"
|
|
|
+ background
|
|
|
+ :total="listTotal"
|
|
|
+ ></el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -70,6 +178,7 @@ import NavMenu from '@/components/NavMenu'
|
|
|
import vScrollView from 'v-scroll-view'
|
|
|
import NoticeBar from '@/components/NoticeBar'
|
|
|
import { pages } from '@/settings'
|
|
|
+import request from '@/utils/request'
|
|
|
function getc(obj) {
|
|
|
if (!obj.children || !obj.children.length) {
|
|
|
return obj
|
|
@@ -91,7 +200,18 @@ export default {
|
|
|
pathurl: '',
|
|
|
visible: false,
|
|
|
noticeCount: 0,
|
|
|
- path: `/${this.$route.path.split('/')[1] || ''}`
|
|
|
+ path: `/${this.$route.path.split('/')[1] || ''}`,
|
|
|
+ isShow: false,
|
|
|
+ isOpen: true,
|
|
|
+ checked: false,
|
|
|
+ messageType: ['WBI','WBK','CRE_ORDER','SEND_MALL','RP_MALL','CR_SALES'],
|
|
|
+ messageData: [],
|
|
|
+ dateType: '',
|
|
|
+ readFlag: '',
|
|
|
+ timer: null,
|
|
|
+ listTotal: 0,
|
|
|
+ currentPage: 1, // 当前页码
|
|
|
+ pageSize: 10, // 每页数量
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
@@ -101,7 +221,61 @@ export default {
|
|
|
noticeVisible() {
|
|
|
return this.noticeCount > 0
|
|
|
},
|
|
|
- ...mapGetters(['sidebar', 'avatar', 'device', 'name', 'isNotice'])
|
|
|
+ ...mapGetters([
|
|
|
+ 'userid'
|
|
|
+ ]),
|
|
|
+ ...mapGetters(['sidebar', 'avatar', 'device', 'name', 'isNotice']),
|
|
|
+ filterTime(){
|
|
|
+ if(this.dateType === ''){
|
|
|
+ return ['','']
|
|
|
+ }else{
|
|
|
+ var date = new Date();
|
|
|
+ var base = Date.parse(date); // 转换为时间戳
|
|
|
+ var year = date.getFullYear(); //获取当前年份
|
|
|
+ var mon = date.getMonth() + 1; //获取当前月份
|
|
|
+ var day = date.getDate(); //获取当前日
|
|
|
+ var oneDay = 24 * 3600 *1000
|
|
|
+
|
|
|
+ var daytimeArr = []
|
|
|
+ var now = new Date((base - oneDay*this.dateType));
|
|
|
+ var myear = now.getFullYear();
|
|
|
+ var month = now.getMonth() + 1;
|
|
|
+ var mday = now.getDate()
|
|
|
+ if(this.dateType == 1){
|
|
|
+ return [`${myear}-${month>9?month:'0'+month}-${mday>9?mday:'0'+mday} 00:00:00`,`${myear}-${month>9?month:'0'+month}-${mday>9?mday:'0'+mday} 23:59:59`]
|
|
|
+ }else{
|
|
|
+ return [`${myear}-${month>9?month:'0'+month}-${mday>9?mday:'0'+mday} 00:00:00`,`${year}-${mon>9?mon:'0'+mon}-${day>9?day:'0'+day} 23:59:59`]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ statusFilter() {
|
|
|
+ return function(val){
|
|
|
+ const MAP = {
|
|
|
+ NOTICE: '平台公告',
|
|
|
+ WBI: '维保消息费用申请',
|
|
|
+ WBK: '维保费用申请审批',
|
|
|
+ CRE_ORDER: '创建工单',
|
|
|
+ SEND_MALL: '商城订单发货',
|
|
|
+ RP_MALL: '商城订单维权',
|
|
|
+ CR_SALES: '支付订单'
|
|
|
+ }
|
|
|
+ return MAP[val]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ typeFilter() {
|
|
|
+ return function(val,paidType){
|
|
|
+ const MAP = {
|
|
|
+ NOTICE: 'announcement',
|
|
|
+ WBI: 'applicationWithoutFee',
|
|
|
+ WBK: 'applicationWithoutFee',
|
|
|
+ CRE_ORDER: 'workOrderPool',
|
|
|
+ SEND_MALL: 'order_list',
|
|
|
+ RP_MALL: 'order_refund',
|
|
|
+ CR_SALES: (paidType=='M'?'auxiliarySalesOrder':paidType=='P'?'attachmentSalesOrder':paidType=='YB'?'orderSettleManag':paidType=='MALL'?'order_list':'')
|
|
|
+ }
|
|
|
+ return MAP[val]
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
watch: {
|
|
|
$route() {
|
|
@@ -122,6 +296,9 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
+ created(){
|
|
|
+ this.getUserInfo()
|
|
|
+ },
|
|
|
mounted() {
|
|
|
this.$store.commit('app/SET_L1_PATH', this.path)
|
|
|
},
|
|
@@ -160,7 +337,148 @@ export default {
|
|
|
},
|
|
|
toggleSideBar() {
|
|
|
this.$store.dispatch('app/toggleSideBar')
|
|
|
- }
|
|
|
+ },
|
|
|
+ //获取最新消息并弹窗
|
|
|
+ getMessageTips(){
|
|
|
+ const that = this
|
|
|
+ request({
|
|
|
+ url: `/notice/list/out`,
|
|
|
+ method: 'get',
|
|
|
+ params: {
|
|
|
+ num: 20,
|
|
|
+ }
|
|
|
+ }).then(res=>{
|
|
|
+ res.data.forEach(item=>{
|
|
|
+ this.$notify({
|
|
|
+ title: '新消息',
|
|
|
+ position: 'bottom-right',
|
|
|
+ duration: 3000,
|
|
|
+ message: that.$createElement(
|
|
|
+ "div",
|
|
|
+ {
|
|
|
+ style: 'cursor: pointer;',
|
|
|
+ on: {
|
|
|
+ click: that.toDetail.bind(that,item.adminNoticeType,item.paidType,item.orderId)
|
|
|
+ },
|
|
|
+ },[
|
|
|
+ that.$createElement(
|
|
|
+ "span",
|
|
|
+ null,
|
|
|
+ that.statusFilter(item.adminNoticeType)
|
|
|
+ ),
|
|
|
+ that.$createElement(
|
|
|
+ "span",
|
|
|
+ {
|
|
|
+ style: 'color: #409EFF;',
|
|
|
+ },
|
|
|
+ item.orderId
|
|
|
+ ),
|
|
|
+ that.$createElement(
|
|
|
+ "span",
|
|
|
+ null,
|
|
|
+ item.content
|
|
|
+ ),
|
|
|
+ // that.$createElement(
|
|
|
+ // "el-checkbox",
|
|
|
+ // {
|
|
|
+ // on: {
|
|
|
+ // change: that.updateIsNotice.bind(that)
|
|
|
+ // },
|
|
|
+ // }, '不再弹窗新消息'
|
|
|
+ // )
|
|
|
+ ])
|
|
|
+ });
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getUserInfo(){
|
|
|
+ request({
|
|
|
+ url: `/admin/user/detail`,
|
|
|
+ method: 'get',
|
|
|
+ params: {
|
|
|
+ adminUserId: this.userid
|
|
|
+ }
|
|
|
+ }).then(res=>{
|
|
|
+ this.isOpen = res.data.isNotice=='YES'?true:false
|
|
|
+ if(res.data.isNotice=='YES'){
|
|
|
+ this.timer = setInterval(()=>{
|
|
|
+ this.getMessageTips()
|
|
|
+ },20000)
|
|
|
+ }else{
|
|
|
+ clearInterval(this.timer)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //全部已读
|
|
|
+ confirmRead(){
|
|
|
+ this.$confirm('是否全部设为已读, 是否继续?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ request({
|
|
|
+ url: `/notice/mark/read/all`,
|
|
|
+ method: 'post',
|
|
|
+ data: {}
|
|
|
+ }).then(res=>{
|
|
|
+ if(res.code == 200){
|
|
|
+ this.getList()
|
|
|
+ this.$message.success('全部已读成功!');
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消'
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //点击不再弹窗新消息
|
|
|
+ updateIsNotice(e){
|
|
|
+ request({
|
|
|
+ url: `/notice/updateIsNotice`,
|
|
|
+ method: 'post',
|
|
|
+ params: {
|
|
|
+ isNotice: e?'YES':'NO',
|
|
|
+ }
|
|
|
+ }).then(res=>{
|
|
|
+ if(res.code == 200){
|
|
|
+ this.getUserInfo()
|
|
|
+ this.$message.success(e?'已开启弹窗消息提醒':'已关闭弹窗消息提醒');
|
|
|
+ if(!e){
|
|
|
+ clearInterval(this.timer)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getList(){
|
|
|
+ request({
|
|
|
+ url: `/notice/list`,
|
|
|
+ method: 'post',
|
|
|
+ data: {
|
|
|
+ pageNum: this.currentPage,
|
|
|
+ pageSize: this.pageSize,
|
|
|
+ params: [{param: "nr.read_flag", compare: "=", value: this.readFlag},{param: 'nr.admin_notice_type', compare: "=", value: this.messageType},{param: 'nr.issue_time', compare: ">=", value: this.filterTime[0]},{param: 'nr.issue_time', compare: "<=", value: this.filterTime[1]}]
|
|
|
+ }
|
|
|
+ }).then(res=>{
|
|
|
+ this.messageData = res.data.records
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 更改当前页
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.currentPage = val;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ toDetail(type,paidType,id){
|
|
|
+ console.log(type,id)
|
|
|
+ this.$router.push({
|
|
|
+ name: this.typeFilter(type,paidType),
|
|
|
+ query: {
|
|
|
+ id,
|
|
|
+ activeName: "workOrderInfo",
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
@@ -180,6 +498,44 @@ export default {
|
|
|
::v-deep .slidingBlockClassName {
|
|
|
background: rgba(0, 0, 0, 0.05) !important;
|
|
|
}
|
|
|
+.flex_asb{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex_ac{
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.message{
|
|
|
+ padding: 20px;position: relative;min-height: 100%;padding-bottom:60px;padding-top: 150px;box-sizing: border-box;
|
|
|
+ .head{
|
|
|
+ width:25%;position: fixed;top: 0;right:0;background: #ffffff;padding: 20px;
|
|
|
+ }
|
|
|
+ .bottom{
|
|
|
+ width:25%;position: fixed;bottom: 0;right:0;background: #ffffff;padding: 10px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+.box-card{
|
|
|
+ .item{
|
|
|
+ cursor: pointer;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ }
|
|
|
+ .read1{
|
|
|
+ color: #f5680e;
|
|
|
+ background: #fff2da;
|
|
|
+ padding: 2px 4px;
|
|
|
+ border-radius: 4px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .read2{
|
|
|
+ color: #42b983;
|
|
|
+ background: #d7fdde;
|
|
|
+ padding: 2px 4px;
|
|
|
+ border-radius: 4px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+}
|
|
|
.navbar {
|
|
|
width: 100%;
|
|
|
height: 50px;
|