Skip to content

B
BCDH-APP
Commit 7af8103d authored by 胡占生's avatar 胡占生 🇨🇳
Browse files
Options

消息中心更改

parent 01410880
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1310 additions and 853 deletions
src/router/index.js
View file @ 7af8103d
This diff is collapsed.
src/service/message.js
View file @ 7af8103d
......@@ -9,17 +9,94 @@ import request from '@/utils/axios'
// })
// }
/* post请求 */
export function postMessgaelist(url,data) {
return request({
url: url,
method: 'post',
data
})
//消息信息列表
export function postMessgaelist(data) {
return request({
url: '/messageInfo/list',
method: 'post',
data
})
}
//未读消息变为已读
export function noticeRemove(data) {
return request({
url: '/messageInfo/changeRead',
method: 'post',
data
})
}
//清除未读消息列表
export function removeAllMessgae(data) {
return request({
url: "/messageInfo/changeStatus",
method: 'get',
data
})
}
//删除已读消息
export function removeMessgae(data) {
return request({
url: "/messageInfo/remove",
method: 'post',
data
})
}
export function noticeRemove(url,data) {
//待办事项列表
export function waitList(data) {
return request({
url: "/backlogInfo/list",
method: 'post',
data
})
}
//未读消息数
export function badgeNumber(data) {
return request({
url: "/backlogInfo/unReadCount",
method: 'get',
data
})
}
//删除已办事项
export function removeWaitList(data) {
return request({
url: "/backlogInfo/remove",
method: 'post',
data
})
}
//通知公告列表
export function notificationList(data) {
return request({
url: "/noticeInfo/list",
method: 'post',
data
})
}
//清除通知公告未读
export function removeAllNotification(data) {
return request({
url: "/noticeInfo/changeStatus",
method: 'get',
data
})
}
//清除通知未读改为已读
export function readNotification(data) {
return request({
url: "/noticeInfo/changeRead",
method: 'post',
data
})
}
//删除已读通知列表
export function removeNotification(data) {
return request({
url: url,
url: "/noticeInfo/remove",
method: 'post',
data
})
......
src/utils/axios.js
View file @ 7af8103d
......@@ -8,37 +8,37 @@
*/
import axios from 'axios'
import router from '../router'
import { Toast } from 'vant';
import { Toast } from 'vant';
import { Notify } from 'vant';
import { Dialog } from 'vant';
import { getToken ,removeToken} from '@/utils/auth' // get token from cookie
import { getToken, removeToken } from '@/utils/auth' // get token from cookie
const service = axios.create({
baseURL: '/hse/app-api', //前缀路径
baseURL: '/hse/app-api', //前缀路径
headers: {//请求头部
// "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8",
"content-type": "application/json",
"data-type": "json"
}
"data-type": "json"
}
})
//拦截接口请求
service.interceptors.request.use(config => {
if (getToken()) {
config.headers['token'] = getToken()
}
}
return config
},error => {
}, error => {
return Promise.reject(error)
})
service.interceptors.response.use(response => {
const res = response.data//获取请求返回数据
const code = response.status//获取请求响应码
if(code == 200) {//请求响应码200 代表已经请求到接口
if(res.code === 0) {//接口响应码0 代表接口代码运行正常
if (code == 200) {//请求响应码200 代表已经请求到接口
if (res.code === 0) {//接口响应码0 代表接口代码运行正常
return res
}else if(res.code === 301){
} else if (res.code === 301) {
// Notify({ type: 'danger', message: res.msg});
return res
}else if(res.code === 403){
} else if (res.code === 403) {
Dialog.alert({
title: '提示',
message: res.msg,
......@@ -47,14 +47,15 @@ service.interceptors.response.use(response => {
removeToken()
location.reload()
});
} else {
return res
}
}else{
} else {
Promise.reject(new Error('Error'))
}
},err=>{
}, err => {
Toast.fail('请求失败');
return Promise.reject(err)
})
export default service
\ No newline at end of file
})
export default service
src/views/messageCenter/index.vue
View file @ 7af8103d
......@@ -14,20 +14,28 @@
title-active-color="#000000"
sticky
offset-top="1.333333rem"
@click="onClick"
>
<van-tab
title="待办事项"
name="待办事项"
:badge="messageNewsNum.待办事项 > 0 ? messageNewsNum.待办事项 : ''"
>
<wait-event :actives="activeName"></wait-event>
</van-tab>
<van-tab
title="消息信息"
name="消息信息"
:badge="messageNewsNum > 0 ? messageNewsNum : ''"
:badge="messageNewsNum.消息信息 > 0 ? messageNewsNum.消息信息 : ''"
>
<message-news @messageLength="getMessageLength"></message-news>
</van-tab>
<van-tab title="" name="" disabled badge="">
<wait-event></wait-event>
<message-news :actives="activeName"></message-news>
</van-tab>
<van-tab title="" name="" disabled badge="">
<notice-info></notice-info>
<van-tab
title="通知公告"
name="通知公告"
:badge="messageNewsNum.通知公告 > 0 ? messageNewsNum.通知公告 : ''"
>
<notice-info :actives="activeName"></notice-info>
</van-tab>
</van-tabs>
</div>
......@@ -42,6 +50,7 @@ import messageNews from "./messageNews";
import waitEvent from "./waitEvent";
import noticeInfo from "./noticeInfo";
import tabBar from "@/components/TabBar";
import { badgeNumber } from "@/service/message";
export default {
components: {
messageNews,
......@@ -51,18 +60,34 @@ export default {
},
data() {
return {
activeName: "消息信息",
messageNewsNum: "",
searchValue:''
activeName: "",
messageNewsNum: {},
searchValue: "",
};
},
created() {
this.activeName = sessionStorage.getItem("activeNames")
? sessionStorage.getItem("activeNames")
: "";
// this.activeName = actives;
this.getBadgeNumber();
},
mounted() {},
methods: {
onSearch(){
onClick(e) {
this.activeName = e;
sessionStorage.setItem("activeNames", e);
sessionStorage.setItem("activeIndex", 0);
this.getBadgeNumber();
},
onSearch() {
console.log("[ 1111 ]", 1111);
},
getMessageLength(len) {
this.messageNewsNum = len;
//获取未读消息数
getBadgeNumber() {
badgeNumber().then((res) => {
this.messageNewsNum = res.data;
});
},
},
};
......
src/views/messageCenter/messageDetails/index.vue 0 → 100644
View file @ 7af8103d
<template>
<div>
<LHeader :text="text"></LHeader>
<van-cell-group inset>
<div class="messgae-title">
<span>{{ messageList.noticeTitle }}</span>
<span>{{ messageList.sendTime }}</span>
</div>
<div class="message-content">
{{ messageList.upcomingUserName }},您好！您有一条来自{{
messageList.createUserName
}}的{{ messageList.noticeTitle }}相关的待处理任务...
</div>
</van-cell-group>
</div>
</template>
<script>
import { Toast } from "vant";
import LHeader from "@/components/header.vue";
export default {
components: {
LHeader,
},
data() {
return {
messageList: {},
text: "消息详情",
messageCategory: [
{
key: "0",
category: "全部",
},
{
key: "1",
category: "已办",
},
{
key: "2",
category: "待办",
},
],
activeIndex: 0,
searchVal: "",
waitList: [], // 待办列表
// refreshing: false, // 下拉刷新开关
// loading: false, // 列表滚动到底部会触发load事件
// finished: false // 列表数据全部加载完成
};
},
mounted() {},
created() {
this.messageList = JSON.parse(this.$route.params.id);
console.log(
"%c [ this.messageList ]",
"font-size:13px; background:pink; color:#bf2c9f;",
this.messageList
);
},
methods: {
// 点击类别
selectCategory(index, data) {
this.activeIndex = index;
},
// 搜索事件
onSearch(val) {
if (val !== "") {
console.log(this.search);
}
},
// // 下拉刷新事件
// onRefresh() {
// // 清空列表数据
// this.finished = false;
// // 重新加载数据
// // 将 loading 设置为 true，表示处于加载状态
// this.loading = true;
// this.onLoad();
// },
// // 列表初始化函数
// onLoad() {
// setTimeout(() => {
// if (this.refreshing) {
// this.refreshing = false;
// }
// // 加载完成后将loading改成 false
// this.loading = false;
// // 为什么会连续触发 load 事件？ 先加上这句 this.finished = true; 以后再删
// // this.finished = true;
// // 如果列表数据全部加载完成 则将finished改为true
// // if (this.list.length >= 40) {
// // this.finished = true;
// // }
// }, 5000);
// }
},
};
</script>
<style lang="less" scoped>
/* @import url(); 引入css类 */
.message-wrap {
padding: 10px 10px 0;
background-color: #f0f1f5;
// 标签
.category-wrap {
.my-tag-style {
width: 75px;
height: 21px;
font-size: 13px;
border: 1px solid #1989fa;
border-radius: 4px;
color: #1989fa;
display: inline-block;
text-align: center;
line-height: 21px;
margin-right: 10px;
}
.active {
color: white;
background-color: #1989fa;
}
}
// 搜索
.search-wrap {
margin: 10px 0;
.van-search {
border-radius: 5px;
padding: 5px 12px;
}
.van-search__content {
background-color: #ffffff;
}
}
// 内容
.con-list {
.van-cell-group--inset {
margin: 0;
margin-bottom: 10px;
padding: 10px;
font-size: 13px;
.message-content {
margin-top: 10px;
}
}
}
}
</style>
src/views/messageCenter/noticeInfo/index.vue
View file @ 7af8103d
<template>
<div>
<div class="message-wrap">
<!-- 标签 -->
<div class="category-wrap">
<!-- <span class="my-tag-style active">全部</span>
<van-pull-refresh
v-model="isLoading"
success-text="刷新成功"
@refresh="onRefresh"
>
<div class="message-wrap">
<!-- 标签 -->
<div class="category-wrap">
<!-- <span class="my-tag-style active">全部</span>
<span class="my-tag-style">已读</span>
<span class="my-tag-style">未读</span> -->
<span
class="my-tag-style"
:class="index == activeIndex ? 'active' : ''"
v-for="(item, index) in messageCategory"
:key="item.key"
@click="selectCategory(index, item.category)"
>{{ item.category }}</span
>
</div>
<span
class="my-tag-style"
:class="index == activeIndex ? 'active' : ''"
v-for="(item, index) in messageCategory"
:key="item.key"
@click="selectCategory(index, item.category)"
>{{ item.category }}</span
>
<span class="my-tag-style" @click="clearNo()">清除未读</span>
</div>
<!-- 搜索 -->
<div class="search-wrap">
<!-- <van-search
<!-- 搜索 -->
<div class="search-wrap">
<!-- <van-search
v-model="searchVal"
show-action
placeholder="请输入检查名称"
......@@ -28,45 +34,63 @@
<div @click="onSearch">搜索</div>
</template>
</van-search> -->
<!-- <van-search
<!-- <van-search
v-model="searchVal"
placeholder="搜索"
@search="onSearch"
@confirm="onSearch"
/> -->
</div>
</div>
<!-- 内容列表 -->
<div class="con-list">
<!-- <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
> -->
<!-- <van-cell-group inset>
<div class="messgae-title">隐患确认信息</div>
<div class="message-content">
张大海已确认一般隐患B类，右万宝宝负责整改。
<!-- 内容列表 -->
<div class="con-list">
<van-cell-group
inset
v-for="(item, index) in notificationList"
:key="index"
@click="touchstart(index, item)"
>
<van-badge :dot="item.status == 0 ? true : false">
<div style="padding: 10px; min-width: calc(100vw - 1.6rem)">
<div class="messgae-title">
<span>{{ item.title }}</span>
<span>{{ item.createTime }}</span>
</div>
<div class="mse_title">
{{ item.title }}
</div>
<div class="message-content">
{{ item.content }}
</div>
</div>
</van-cell-group> -->
<!-- </van-list>
</van-pull-refresh> -->
</van-badge>
</van-cell-group>
</div>
</div>
</div>
</van-pull-refresh>
</div>
</template>
<script>
import { Toast } from "vant";
import {
notificationList,
removeAllNotification,
readNotification,
removeNotification,
} from "@/service/message";
export default {
props: {
actives: String,
default: () => "",
},
data() {
return {
isLoading: false,
messageCategory: [
{
key: "0",
category: "全部",
category: "未读",
},
{
key: "1",
......@@ -74,65 +98,148 @@ export default {
},
{
key: "2",
category: "未读",
category: "全部",
},
],
activeIndex: 0,
searchVal: "",
notificationList: [],
// refreshing: false, // 下拉刷新开关
// loading: false, // 列表滚动到底部会触发load事件
// finished: false // 列表数据全部加载完成
};
},
mounted() {},
created() {
this.activeIndex = sessionStorage.getItem("activeIndex")
? sessionStorage.getItem("activeIndex")
: 0;
this.getNotificationSort();
this.setMessage();
},
methods: {
//下拉刷新
onRefresh() {
setTimeout(() => {
this.$toast("刷新成功");
this.isLoading = false;
this.getNotificationSort();
this.$parent.$parent.$parent.$parent.getBadgeNumber();
}, 1000);
},
// 点击类别
selectCategory(index, data) {
this.activeIndex = index;
this.getNotificationSort();
this.setMessage();
},
// 搜索事件
onSearch(val) {
if (val !== "") {
console.log(this.searchVal);
if (this.activeIndex == 0) {
let formData = new FormData();
formData.append("status", 0);
formData.append("keyword", this.searchVal);
this.getNotificationList(formData);
} else if (this.activeIndex == 1) {
let formData = new FormData();
formData.append("status", 1);
formData.append("keyword", this.searchVal);
this.getNotificationList(formData);
} else if (this.activeIndex == 2) {
let formData = new FormData();
formData.append("keyword", this.searchVal);
this.getNotificationList(formData);
}
},
// // 下拉刷新事件
// onRefresh() {
// // 清空列表数据
// this.finished = false;
// // 重新加载数据
// // 将 loading 设置为 true，表示处于加载状态
// this.loading = true;
// this.onLoad();
// },
// // 列表初始化函数
// onLoad() {
// setTimeout(() => {
// if (this.refreshing) {
// this.refreshing = false;
// }
// // 加载完成后将loading改成 false
// this.loading = false;
// // 为什么会连续触发 load 事件？ 先加上这句 this.finished = true; 以后再删
// // this.finished = true;
// // 如果列表数据全部加载完成 则将finished改为true
// // if (this.list.length >= 40) {
// // this.finished = true;
// // }
// }, 5000);
// }
setMessage() {
sessionStorage.setItem("activeNames", this.actives);
sessionStorage.setItem("activeIndex", this.activeIndex);
},
//点击消息条目时的点击事件 变成已读
read(data) {
if (data.status == 0) {
let formData = new FormData();
formData.append("id", data.id);
readNotification(formData).then((res) => {
if (res.code == 0) {
this.getNotificationSort();
}
});
}
},
//根据类别请求接口
getNotificationSort() {
if (this.activeIndex == 0) {
let formData = new FormData();
formData.append("status", 0);
this.getNotificationList(formData);
} else if (this.activeIndex == 1) {
let formData = new FormData();
formData.append("status", 1);
this.getNotificationList(formData);
} else if (this.activeIndex == 2) {
this.getNotificationList();
}
},
//请求通知全部公告列表
getNotificationList(Data) {
notificationList(Data).then((res) => {
this.notificationList = res.rows;
});
},
touchstart(index, item) {
this.read(item);
this.$router.push({
name: "message-details",
params: {
id: JSON.stringify(item),
},
});
},
//清除未读
clearNo() {
this.$dialog
.confirm({
title: "提示",
message: "确定清楚所有未读内容内容",
confirmButtonColor: "#1989FA",
})
.then(() => {
removeAllNotification()
.then((res) => {
if (res.code == "0") {
this.$notify({ type: "success", message: "清楚成功" });
this.$parent.$parent.$parent.$parent.getBadgeNumber();
this.getNotificationSort();
} else {
this.$notify({
type: "primary",
message: "没有未读消息可以清除",
});
}
})
.catch((err) => {
console.log(
"%c [ err ]",
"font-size:13px; background:pink; color:#bf2c9f;",
err
);
});
})
.catch(() => {
// on cancel
});
},
},
};
</script>
<style lang="less" scoped>
/* @import url(); 引入css类 */
.message-wrap {
min-height: 58vh;
padding: 10px 10px 0;
background-color: #f0f1f5;
// 标签
......@@ -172,10 +279,22 @@ export default {
margin-bottom: 10px;
padding: 10px;
font-size: 13px;
.messgae-title {
.mse_title {
margin-top: 10px;
}
.message-content {
margin-top: 10px;
text-indent: 28px;
}
.messgae-title {
display: flex;
justify-content: space-between;
align-items: center;
}
.bot_but {
display: flex;
justify-content: right;
align-items: center;
}
}
}
......
src/views/messageCenter/waitEvent/index.vue
View file @ 7af8103d
<template>
<div>
<div class="message-wrap">
<!-- 标签 -->
<div class="category-wrap">
<!-- <span class="my-tag-style active">全部</span>
<van-pull-refresh
v-model="isLoading"
success-text="刷新成功"
@refresh="onRefresh"
>
<div class="message-wrap">
<!-- 标签 -->
<div class="category-wrap">
<!-- <span class="my-tag-style active">全部</span>
<span class="my-tag-style">已读</span>
<span class="my-tag-style">未读</span> -->
<span
class="my-tag-style"
:class="index == activeIndex ? 'active' : ''"
v-for="(item, index) in messageCategory"
:key="item.key"
@click="selectCategory(index, item.category)"
>{{ item.category }}</span
>
</div>
<span
class="my-tag-style"
:class="index == activeIndex ? 'active' : ''"
v-for="(item, index) in messageCategory"
:key="item.key"
@click="selectCategory(index, item.category)"
>{{ item.category }}</span
>
</div>
<!-- 搜索 -->
<div class="search-wrap">
<van-search
v-model="searchVal"
show-action
placeholder="请输入检查名称"
@search="onSearch"
>
<template #action>
<div @click="onSearch">搜索</div>
</template>
</van-search>
</div>
<!-- 搜索 -->
<div class="search-wrap">
<van-search
v-model="searchVal"
show-action
placeholder="请输入检查名称"
@search="onSearch"
>
<template #action>
<div @click="onSearch">搜索</div>
</template>
</van-search>
</div>
<!-- 内容列表 -->
<div class="con-list">
<!-- <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
> -->
<!-- <van-cell-group inset>
<div class="messgae-title">隐患确认信息</div>
<div class="message-content">
张大海已确认一般隐患B类，右万宝宝负责整改。
<!-- 内容列表 -->
<div class="con-list">
<van-cell-group
inset
v-for="(item, index) in waitList"
:key="index"
@click="touchstart(index, item)"
>
<van-badge :dot="item.status == 0 ? true : false">
<div style="padding: 10px; min-width: calc(100vw - 1.6rem)">
<div class="messgae-title">
<span>{{ item.title }}</span>
<span>{{ item.createTime }}</span>
</div>
<div class="message-content">{{ item.content }}</div>
<div class="bot_but">
<van-button color="#33CCFF" size="mini">立即处理</van-button>
</div>
</div>
</van-cell-group> -->
<!-- </van-list>
</van-pull-refresh> -->
</van-badge>
</van-cell-group>
</div>
</div>
</div>
</van-pull-refresh>
</div>
</template>
<script>
import { Toast } from "vant";
import { waitList, removeWaitList } from "@/service/message";
export default {
props: {
actives: String,
default: () => "",
},
data() {
return {
isLoading: false,
messageCategory: [
{
key: "0",
category: "全部",
category: "待办",
},
{
key: "1",
category: "已读",
category: "已办",
},
{
key: "2",
category: "未读",
category: "全部",
},
],
activeIndex: 0,
searchVal: "",
waitList: [], // 待办列表
// refreshing: false, // 下拉刷新开关
// loading: false, // 列表滚动到底部会触发load事件
// finished: false // 列表数据全部加载完成
};
},
mounted() {},
created() {
this.activeIndex = sessionStorage.getItem("activeIndex")
? sessionStorage.getItem("activeIndex")
: 0;
this.getWaitSort();
this.setMessage();
},
methods: {
//下拉刷新
onRefresh() {
setTimeout(() => {
this.$toast("刷新成功");
this.isLoading = false;
this.getWaitSort();
this.$parent.$parent.$parent.$parent.getBadgeNumber();
}, 1000);
},
// 点击类别
selectCategory(index, data) {
this.activeIndex = index;
this.getWaitSort();
this.setMessage();
},
// 搜索事件
onSearch(val) {
if (val !== "") {
console.log(this.search)
if (this.activeIndex == 0) {
let formData = new FormData();
formData.append("status", 0);
formData.append("keyword", this.searchVal);
this.getWaitList(formData);
} else if (this.activeIndex == 1) {
let formData = new FormData();
formData.append("status", 1);
formData.append("keyword", this.searchVal);
this.getWaitList(formData);
} else if (this.activeIndex == 2) {
let formData = new FormData();
formData.append("keyword", this.searchVal);
this.getWaitList(formData);
}
},
setMessage() {
sessionStorage.setItem("activeNames", this.actives);
sessionStorage.setItem("activeIndex", this.activeIndex);
},
//根据类别请求接口
getWaitSort() {
if (this.activeIndex == 0) {
let formData = new FormData();
formData.append("status", 0);
this.getWaitList(formData);
} else if (this.activeIndex == 1) {
let formData = new FormData();
formData.append("status", 1);
this.getWaitList(formData);
} else if (this.activeIndex == 2) {
this.getWaitList();
}
},
// // 下拉刷新事件
// onRefresh() {
// // 清空列表数据
// this.finished = false;
// // 重新加载数据
// // 将 loading 设置为 true，表示处于加载状态
// this.loading = true;
// this.onLoad();
// },
// // 列表初始化函数
// onLoad() {
// setTimeout(() => {
// if (this.refreshing) {
// this.refreshing = false;
// }
// 请求消息接口方法
getWaitList(Data) {
waitList(Data).then((res) => {
this.waitList = res.rows;
});
},
touchstart(index, item) {
this.$router.push({
path: item.appUrl,
query: {},
});
},
// // 加载完成后将loading改成 false
// this.loading = false;
// // 为什么会连续触发 load 事件？ 先加上这句 this.finished = true; 以后再删
......@@ -127,6 +187,7 @@ export default {
<style lang="less" scoped>
/* @import url(); 引入css类 */
.message-wrap {
min-height: 58vh;
padding: 10px 10px 0;
background-color: #f0f1f5;
// 标签
......@@ -164,11 +225,21 @@ export default {
.van-cell-group--inset {
margin: 0;
margin-bottom: 10px;
padding: 10px;
font-size: 13px;
padding: 10px;
.message-content {
margin-top: 10px;
}
.messgae-title {
display: flex;
justify-content: space-between;
align-items: center;
}
.bot_but {
display: flex;
justify-content: right;
align-items: center;
}
}
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment