我的通知

This commit is contained in:
谢思 2021-09-15 13:09:52 +08:00
parent 9050c5ca2b
commit f6a98e4169
6 changed files with 68 additions and 81 deletions

View File

@ -226,7 +226,7 @@ function NoticeContent({ visible, showNotification, resetUserInfo, current_user:
)
}) : "暂无数据" : ""} */}
<div className="hoverNotice-buttom">
<Link to="/settings/notice/myNotice">全部消息</Link>
<Link to="/settings/mynotice">全部消息</Link>
<a onClick={readAll}>所有{noticeType === "notification" ? "系统消息" : noticeType === "letter" ? "私信" : "@我"}一键已读</a>
</div>
</div>

View File

@ -10,10 +10,6 @@ const Apply = Loadable({
loader: () => import("./Apply"),
loading: Loading,
});
const Notify = Loadable({
loader: () => import("./Notify"),
loading: Loading,
});
const UndoEvent = Loadable({
loader: () => import("./UndoEvent"),
loading: Loading,
@ -23,7 +19,7 @@ function Index(props){
const pathname = props.history.location.pathname;
const user = props.user;
const [ menu , setMenu ] = useState("notify");
const [ menu , setMenu ] = useState("undo");
const [ messagesCount , setMessagesCount ] = useState(0);
const [ transferCount , setTransferCount ] = useState(0);
const [ applyCount , setApplyCount ] = useState(0);
@ -48,10 +44,6 @@ function Index(props){
useEffect(()=>{
if(pathname && username){
if(pathname === `/${username}/notice`){
setMenu("notify");
changeNum(user.undo_messages);
}
if(pathname === `/${username}/notice/undo`){
setMenu("undo");
}
if(pathname === `/${username}/notice/apply`){
@ -83,14 +75,8 @@ function Index(props){
return (
<div>
<ul className="noticeMenu">
<li className={menu === "notify" ? "active":""}>
<Link to={`/${username}/notice`} onClick={changeNum}>
<span>通知</span>
{messagesCount ? <span className="unNum">{messagesCount}</span>:""}
</Link>
</li>
<li className={menu === "undo" ? "active":""}>
<Link to={`/${username}/notice/undo`}>
<Link to={`/${username}/notice`}>
<span>接收仓库</span>
{transferCount ? <span className="unNum">{transferCount}</span>:""}
</Link>
@ -109,16 +95,10 @@ function Index(props){
return <Apply {...props} {...p} deleteEvent={deleteEvent}/>;
}}
></Route>
<Route
path="/:username/notice/undo"
render={(p) => {
return <UndoEvent {...props} {...p} deleteEvent={deleteEvent}/>;
}}
></Route>
<Route
path="/:username/notice"
render={(p) => {
return <Notify {...props} {...p} deleteEvent={deleteEvent}/>;
return <UndoEvent {...props} {...p} deleteEvent={deleteEvent}/>;
}}
></Route>
</Switch>

View File

@ -61,7 +61,7 @@ function Index(props){
</ul>
<ul className="securityUl ul-border-buttom">
<li>消息通知</li>
<li className={pathname.indexOf("/settings/notice/myNotice")>-1 || pathname.indexOf("/settings/notice/privateLetter")>-1 ?"active":""}><Link to={`/settings/notice/myNotice`}><i className="iconfont icon-wodetongzhi"></i><span className="text-shodow-bold">我的通知</span></Link></li>
<li className={pathname.indexOf("/settings/mynotice")>-1 || pathname.indexOf("/settings/notice/privateLetter")>-1 ?"active":""}><Link to={`/settings/mynotice`}><i className="iconfont icon-wodetongzhi"></i><span className="text-shodow-bold">我的通知</span></Link></li>
{/* <li className={pathname.indexOf("/settings/notice/noticeManager")>-1 ?"active":""}><Link to={`/settings/notice/noticeManager`}><i className="iconfont icon-tongzhiguanli"></i><span className="text-shodow-bold">通知管理</span></Link></li> */}
</ul>
<ul className="securityUl">
@ -73,7 +73,7 @@ function Index(props){
<Gap>
<Switch>
<Route
path="/settings/notice/myNotice"
path="/settings/mynotice"
render={(p) => (
<MyNoticeIndex {...props} {...p}/>
)}

View File

@ -10,7 +10,8 @@ import '../manager/Index.scss'
function MyNotice(props) {
let current_user = props.current_user;
let pageSize = 20;
let resetUserInfo = props.resetUserInfo;
let pageSize = 15;
const [noticeType, setNoticeType] = useState("0");//tab
const [selectedNum, setSelectedNum] = useState(0);//@
@ -61,7 +62,10 @@ function MyNotice(props) {
ids:id,
};
axios.post(`/users/${current_user.login}/messages/read.json`,params).then((response)=>{
response.status === 0 && getMessageList();
if(response.status === 200){
getMessageList();
resetUserInfo();
}
});
}
}
@ -101,33 +105,41 @@ function MyNotice(props) {
}
function deleteNotice(id) {
const ids = [];
console.log(messageList);
if(!id){
messageList.map(item=>{
item.checkedBatch && ids.push(item.id);
});
}
console.log(ids);
DelModal({
title: noticeType === "1" ? '删除私信' : '删除与我相关',
contentTitle: noticeType === "1" ? '您确定要删除与 xxx 的聊天吗?' : id ? '您确定要删除这条@我消息吗?' : '您确定要删除选中的' + selectedNum + '条消息吗?',
content: noticeType === "1" ? '此操作将删除与xxx的聊天框和xxx的所有聊天记录请进行确认以防数据的丢失' : id ? '此操作将删除这条消息,请进行确认以防数据的丢失' : '此操作将删除选中的' + selectedNum + '条消息,请进行确认以防数据的丢失',
onOk: () => {
const params = {
type: noticeType === "0" ? "notification" : noticeType === "2" ? "atme" : "",
ids:id?id:ids,
};
console.log(params);
axios.delete(`/users/${current_user.login}/messages.json`,{
data:params,
}).then((response)=>{
response.status === 0 && getMessageList();
});
}
});
DelModal({
title: noticeType === "1" ? '删除私信用户' : id ? '删除消息' : '批量删除',
contentTitle: noticeType === "1" ? '您确定要删除与 xxx 的聊天吗?' : id ? '您确定要删除这条@我消息吗?' : '您确定要删除选中的' + selectedNum + '条消息吗?',
content: noticeType === "1" ? '此操作将删除与xxx的聊天框和xxx的所有聊天记录请进行确认以防数据的丢失' : id ? '此操作将删除这条消息,请进行确认以防数据的丢失' : '此操作将删除选中的' + selectedNum + '条消息,请进行确认以防数据的丢失',
onOk: () => {
const params = {
type: noticeType === "0" ? "notification" : noticeType === "2" ? "atme" : "",
ids:id?id:ids,
};
axios.delete(`/users/${current_user.login}/messages.json`,{
data:params,
}).then((response)=>{
response.status === 200 && getMessageList();
});
},
onCancel: cancelBatchDelete
});
}
function cancelBatchDelete(){
setIsBatchDelete(false);
setSelectedNum(0);
//
let messageListNew=messageList.slice();
messageListNew.map((item)=>{
item.checkedBatch = false;
});
setMessageList(messageListNew);
setBatchDeleteCheckAll(false);
}
return (
@ -138,14 +150,14 @@ function MyNotice(props) {
{/* <Menu.Item key="1" id="item-private"><Badge count={0}>私信</Badge></Menu.Item> */}
<Menu.Item key="2"><Badge count={atUnreadCount}>@</Badge></Menu.Item>
</Menu>
<button onClick={()=>{readNotice([-1])}}>所有{noticeType === "0" ? "系统通知" : noticeType === "1" ? "私信" : "@我"}一键已读</button>
{(noticeType==="0" && noticeUnreadCount>0) || (noticeType==="2"&& atUnreadCount>0) ? <button className="but25" onClick={()=>{readNotice([-1])}}>所有{noticeType === "0" ? "系统通知" : noticeType === "1" ? "私信" : "@我"}一键已读</button>:""}
</div>
<div className={isBatchDelete ? "invisible " : "visible"}>
<div className="vertical-center-style">
<Checkbox checked={onlyUnread === 1?true:false} onChange={(e) => e.target.checked ? setOnlyUnread(1) : setOnlyUnread()}>仅看未读{noticeType === "1" ? `私信12` : noticeType === "0" ? `消息(${noticeUnreadCount}` : `消息(${atUnreadCount}`}</Checkbox>
{onlyUnread===1 || messageList.length>0 ? <Checkbox checked={onlyUnread} onChange={(e) => e.target.checked ? setOnlyUnread(1) : setOnlyUnread()}>仅看未读{noticeType === "1" ? `私信12` : noticeType === "0" ? `消息(${noticeUnreadCount}` : `消息(${atUnreadCount}`}</Checkbox>:""}
</div>
{noticeType === "2" && messageList.length > 0 ? <button onClick={() => { setIsBatchDelete(true); }}>批量删除</button> : ""}
{noticeType === "2" && messageList.length > 0 ? <button className="batchDeleteBut" onClick={() => { setIsBatchDelete(true); }}>批量删除</button> : ""}
</div>
{messageList.length===0 ? <NoneData _html="暂无相关消息"/>:""}
@ -157,7 +169,7 @@ function MyNotice(props) {
&nbsp;&nbsp;&nbsp;已选择&nbsp;<span id="numberSpan">{selectedNum}</span>&nbsp;
</div>
<div>
<button onClick={() => { setIsBatchDelete(false); setSelectedNum(0); }}>取消</button>&nbsp;&nbsp;&nbsp;&nbsp;
<button onClick={cancelBatchDelete}>取消</button>&nbsp;&nbsp;&nbsp;&nbsp;
<button className="deleteBut" onClick={selectedNum > 0 ? ()=>deleteNotice() : () => { }}>删除</button>
</div>
</div>}
@ -171,7 +183,7 @@ function MyNotice(props) {
<div className="mynotice-cont stretch-style">
{item.status === 1 ? <Badge color="#FA2020" /> : <span className="system-notice-blank"></span>}
<i className={"iconfont "+noticeSourceType[item.source]}></i>
<span className="sysNotice-length highlightSpan" onClick={() => window.open("https://"+`${item.notification_url}`)}>{item.content}</span>
<span className={item.notification_url?"sysNotice-length highlightSpan":"sysNotice-length"} onClick={() => {item.notification_url && window.open("https://"+`${item.notification_url}`)}} dangerouslySetInnerHTML={{__html: item.content}}></span>
</div>
<div className="mynotice-cont vertical-center-style float-left-little">
<span className={item.status === 1?"timeSpan":""}>{item.time_ago}</span>
@ -189,7 +201,7 @@ function MyNotice(props) {
{item.sender && <img src={`https://testforgeplus.trustie.net//${item.sender.image_url}`} className="currentImg" />}
<div className="atme-notice-text">
<div className="at-badge">{item.status === 1 ? <Badge color="#FA2020" /> : <span className="system-notice-blank"></span>}</div>
<div className="highlightSpan">{item.content}</div>
<div className={item.notification_url?"highlightSpan float-right-little":"float-right-little"} onClick={() => {item.notification_url && window.open("https://"+`${item.notification_url}`)}} dangerouslySetInnerHTML={{__html: item.content}}></div>
</div>
</div>
<div className="mynotice-cont vertical-center-style">
@ -203,7 +215,7 @@ function MyNotice(props) {
})}
{/* 分页 */}
<div className="paging">
{!isBatchDelete && <div className="paging">
<Pagination
simple
current = {currentPage}
@ -212,7 +224,7 @@ function MyNotice(props) {
total = {messTotalCount}
hideOnSinglePage
></Pagination>
</div>
</div>}
{/* 私信 */}
{/* <div className="mynotice-content vertical-center-style">

View File

@ -138,12 +138,17 @@ button:active {
position: relative;
margin-left: 12px;
max-width: 48rem;
word-break: break-all;
& .at-badge{
position:absolute;
}
& .highlightSpan{
margin-left: 12px;
// margin-left: 12px;
&:hover{
color: #466AFF;
cursor: pointer;
}
}
}
}
@ -180,6 +185,10 @@ button:active {
button{
padding:0px 12px;
}
.batchDeleteBut{
border:1px solid #466AFF;
color: #466AFF;
}
}
.private-letter-right {
@ -191,13 +200,6 @@ button:active {
}
}
.highlightSpan{
&:hover{
color: #466AFF;
cursor: pointer;
}
}
.letter-length-limit{
max-width: 50rem;
overflow: hidden;
@ -207,6 +209,7 @@ button:active {
.sysNotice-length{
max-width: 52rem;
word-break: break-all;
}
@ -228,19 +231,11 @@ button:active {
margin-right: 10px;
}
.paging{
float: right;
margin: 12px;
.float-right-little{
margin-left: 12px;
}
// .invisible_checkGroup{
// & .ant-checkbox-inner{
// display: none;
// }
// }
// .notice01{
// & .ant-checkbox-group{
// display: flex;
// flex-direction: column;
// }
// }
.paging{
text-align: center;
margin: 12px;
}

View File

@ -1,10 +1,10 @@
import React , { useEffect , useState } from 'react';
import './Index.scss';
import '../../SecuritySetting/notice/manager/Index.scss'
import { Menu } from 'antd';
import { Link } from 'react-router-dom';
import Base from './Base';
import Password from './Password';
import './Index.scss';
import '../../SecuritySetting/notice/manager/Index.scss';
function Index(props){
// const { username } = props && props.match && props.match.params;