diff --git a/src/forge/Nodata.js b/src/forge/Nodata.js index 3147e5601..ccc74ac54 100644 --- a/src/forge/Nodata.js +++ b/src/forge/Nodata.js @@ -1,7 +1,7 @@ import React , { Component } from 'react'; import nodata from './Images/nodata.png'; - +import './css/index.scss'; class Nodata extends Component{ render(){ const { _html , small } = this.props; diff --git a/src/forge/SecuritySetting/notice/myNotice/Index.jsx b/src/forge/SecuritySetting/notice/myNotice/Index.jsx index 9a2f9e5ba..967ba0bf9 100644 --- a/src/forge/SecuritySetting/notice/myNotice/Index.jsx +++ b/src/forge/SecuritySetting/notice/myNotice/Index.jsx @@ -1,142 +1,95 @@ import React, { useState, useEffect } from 'react'; -import { Badge, Button, Checkbox, Menu } from 'antd'; +import { Badge, Button, Checkbox, Menu, Pagination } from 'antd'; import './Index.scss'; import '../manager/Index.scss' import DelModal from '../../../Wiki/components/ModalFun'; import axios from 'axios'; import { Link } from 'react-router-dom'; +import NoneData from '../../../Nodata.js'; function MyNotice(props) { + let current_user = props.current_user; + let pageSize = 20; const [noticeType, setNoticeType] = useState("2");//消息类别tab栏选择 const [selectedNum, setSelectedNum] = useState(0);//@我批量删除选择消息条数 const [isBatchDelete, setIsBatchDelete] = useState(false);//@我是否批量删除 const [batchDeleteCheckedAll, setBatchDeleteCheckAll] = useState(false);//@我批量删除--全选 - const [batchDeleteList, setBatchDeleteList] = useState([]);//@我批量删除--选中 - const [atmeIds, setAtmeIds] = useState([]); const [noticeUnreadCount, setNoticeUnreadCount] = useState();//未读系统通知数量 - const [letterUnreadCount, setLetterUnreadCount] = useState(0);//未读私信数量 - const [atUnreadCount, setAtUnreadCount] = useState(2);//未读@我数量 - const [messageList, setMessageList] = useState([ - { - "id": 1, - "status": 1, - "content": "Atme Message Content 1", - "notification_url": "http://www.baidu.com", - "source": "PullRequestAtme", - "time_ago": "1天前", - "type": "atme", - "sender": { - "id": 5, - "type": "User", - "name": "testforge2", - "login": "testforge2", - "image_url": "system/lets/letter_avatars/2/T/236_177_85/120.png" - } - }, - { - "id": 2, - "status": 0, - "content": "Atme Message Content 2", - "notification_url": "http://www.baidu.com", - "source": "IssueAtme", - "time_ago": "1天前", - "type": "atme", - "sender": { - "id": 4, - "type": "User", - "name": "testforge1", - "login": "testforge1", - "image_url": "system/lets/letter_avatars/2/T/19_237_174/120.png" - } - }, - { - "id": 3, - "status": 1, - "content": "Notification Message Content 1", - "notification_url": "http://www.baidu.com", - "source": "IssueDelete", - "time_ago": "1天前", - "type": "notification" - }, - { - "id": 4, - "status": 0, - "content": "Notification Message Content 2", - "notification_url": "http://www.baidu.com", - "source": "IssueChanged", - "time_ago": "1天前", - "type": "notification" - }, - { - "id": 5, - "status": 0, - "content": "Notification Message Content 3", - "notification_url": "http://www.baidu.com", - "source": "ProjectJoined", - "time_ago": "1天前", - "type": "notification" - } -]); + // const [letterUnreadCount, setLetterUnreadCount] = useState(0);//未读私信数量 + const [atUnreadCount, setAtUnreadCount] = useState();//未读@我数量 + const [messageList, setMessageList] = useState([]); + const [messTotalCount, setMessTotalCount] = useState();//消息总数 + const [currentPage, setCurrentPage] = useState(1);//当前页数 const [onlyUnread, setOnlyUnread] = useState(); - const noticeType = { + const noticeSourceType = { // 易修 - IssueAssigned:1, // 有新指派给我的易修 - IssueAssignerExpire:1, // 我负责的易修截止日期到达最后一天 - IssueAtme:1, // 在易修中@我 - IssueChanged:1, // 我创建或负责的易修状态变更 - IssueCreatorExpire:1, // 我创建的易修截止日期到达最后一天 - IssueDeleted:1, // 我创建或负责的易修删除 - IssueJournal:1, // 我创建或负责的易修有新的评论 + IssueAssigned:"icon-yixiuicon1", // 有新指派给我的易修 + IssueAssignerExpire:"icon-yixiuicon1", // 我负责的易修截止日期到达最后一天 + IssueAtme:"icon-yixiuicon1", // 在易修中@我 + IssueChanged:"icon-yixiuicon1", // 我创建或负责的易修状态变更 + IssueCreatorExpire:"icon-yixiuicon1", // 我创建的易修截止日期到达最后一天 + IssueDelete:"icon-yixiuicon1", // 我创建或负责的易修删除 + IssueDeleted:"icon-yixiuicon1", // 我创建或负责的易修删除 + IssueJournal:"icon-yixiuicon1", // 我创建或负责的易修有新的评论 //平台通知 - LoginIpTip:2, //登录异常提示 + LoginIpTip:"icon-xitongtongzhiicon", //登录异常提示 //个人状态类通知 - OrganizationJoined:3, // 账号被拉入组织 - OrganizationLeft:3, // 账号被移出组织 - rganizationRole:3, // 账号组织权限变更 - ProjectJoined:3, // 账号被拉入项目 - ProjectLeft:3, // 账号被移出项目 - ProjectRole:3, // 账号仓库权限变更 + OrganizationJoined:"icon-xiaoxi2", // 账号被拉入组织 + OrganizationLeft:"icon-xiaoxi2", // 账号被移出组织 + rganizationRole:"icon-xiaoxi2", // 账号组织权限变更 + ProjectJoined:"icon-xiaoxi2", // 账号被拉入项目 + ProjectLeft:"icon-xiaoxi2", // 账号被移出项目 + ProjectRole:"icon-xiaoxi2", // 账号仓库权限变更 //其他仓库通知 - ProjectDelete:4, // 我关注的仓库被删除 - ProjectFollowed:4, // 我管理的仓库被关注 - ProjectForked:4, // 我管理的仓库被复刻 - ProjectIssue:4, // 我管理/关注的仓库有新的易修 - ProjectSettingChanged:4, // 我管理的仓库项目设置被更改 - ProjectTransfer:4, // 我关注的仓库被转移 - ProjectVersion:4, // 我关注的仓库有新的发行版 + ProjectDelete:"icon-daimakuicon1", // 我关注的仓库被删除 + ProjectFollowed:"icon-daimakuicon1", // 我管理的仓库被关注 + ProjectForked:"icon-daimakuicon1", // 我管理的仓库被复刻 + ProjectIssue:"icon-daimakuicon1", // 我管理/关注的仓库有新的易修 + ProjectSettingChanged:"icon-daimakuicon1", // 我管理的仓库项目设置被更改 + ProjectTransfer:"icon-daimakuicon1", // 我关注的仓库被转移 + ProjectVersion:"icon-daimakuicon1", // 我关注的仓库有新的发行版 + ProjectMemberJoined:"icon-daimakuicon1", // 我管理的仓库有成员加入 + ProjectMemberLeft:"icon-daimakuicon1", // 我管理的仓库有成员移出 + ProjectPraised:"icon-daimakuicon1", // 我管理的仓库被点赞 //合并请求类通知 - ProjectPullRequest:5, // 我管理/关注的仓库有新的合并请求 - PullRequestAssigned:5, // 有新指派给我的合并请求 - PullReuqestAtme:5, // 在合并请求中@我 - PullRequestChanged:5, // 我创建或负责的合并请求状态变更 - PullRequestJournal:5, // 我创建或负责的合并请求有新的评论 + ProjectPullRequest:"icon-hebingqingqiuicon", // 我管理/关注的仓库有新的合并请求 + PullRequestAssigned:"icon-hebingqingqiuicon", // 有新指派给我的合并请求 + PullRequestAtme:"icon-hebingqingqiuicon", // 在合并请求中@我 + PullRequestChanged:"icon-hebingqingqiuicon", // 我创建或负责的合并请求状态变更 + PullRequestJournal:"icon-hebingqingqiuicon", // 我创建或负责的合并请求有新的评论 //里程碑 - ProjectMilestone:6, // 我管理的仓库有新的里程碑 + ProjectMilestone:"icon-lichengbeiicon", // 我管理的仓库有新的里程碑 }; - // useEffect(() => { - // const params = { - // type: noticeType === "0" ? "notification" : noticeType === "2" ? "atme" : "", - // status: onlyUnread ? onlyUnread : "", - // limit: 20, - // page: 0, - // } - // getMessageList(params); - // }, [noticeType, onlyUnread]) + useEffect(() => { + // const params = { + // type: noticeType === "0" ? "notification" : noticeType === "2" ? "atme" : "", + // status: onlyUnread ? onlyUnread : "", + // limit: pageSize, + // page: currentPage, + // } + getMessageList(); + }, [noticeType, onlyUnread, currentPage]) - function getMessageList(params) { - axios.get(`/users/yystopf/messages.json`, { + function getMessageList() { + const params = { + type: noticeType === "0" ? "notification" : noticeType === "2" ? "atme" : "", + status: onlyUnread ? onlyUnread : "", + limit: pageSize, + page: currentPage, + }; + axios.get(`/users/${current_user.login}/messages.json`, { params: params, }).then((response) => { - setNoticeUnreadCount(response.data.unread_notification); - setAtUnreadCount(response.data.unread_atme); - setMessageList(response.data.messages); - }) - console.log(messageList); - //@我消息列表ids - const atmeIds = new Array(); + if(response && response.data){ + setNoticeUnreadCount(response.data.unread_notification); + setAtUnreadCount(response.data.unread_atme); + setMessageList(response.data.messages); + setMessTotalCount(response.data.total_count); + } + }); } function readNotice(id){ @@ -145,17 +98,15 @@ function MyNotice(props) { type: noticeType === "0" ? "notification" : noticeType === "2" ? "atme" : "", ids:id, }; - console.log(params); - axios.post(`/users/yystopf/messages/read.json`,{ - params:params, - }).then((response)=>{ - console.log(response); - }) + axios.post(`/users/${current_user.login}/messages/read.json`,params); + getMessageList; } } function handleClick(e) { setNoticeType(e.key); + setCurrentPage(1); + setOnlyUnread(); if (e.key != "2") { setIsBatchDelete(false); } @@ -172,7 +123,7 @@ function MyNotice(props) { }); setMessageList(messageListNew); setSelectedNum(checkboxNum); - setBatchDeleteCheckAll(checkboxNum === atUnreadCount); + setBatchDeleteCheckAll(checkboxNum === messageList.length); } @@ -187,29 +138,36 @@ function MyNotice(props) { } function deleteNotice(id) { + console.log(id); + const ids = new Array(); + if(id[0] == 0){ + messageList.map((item)=>{ + item.bacheckedBatch ? ids.push(item.id):""; + }) + } + console.log(ids); if(id){ DelModal({ title: noticeType === "1" ? '删除私信' : '删除与我相关', - contentTitle: noticeType === "1" ? '您确定要删除与 xxx 的聊天吗？' : id[0] != -1 ? '您确定要删除这条@我消息吗？' : '您确定要删除选中的' + selectedNum + '条消息吗？', - content: noticeType === "1" ? '此操作将删除与xxx的聊天框和xxx的所有聊天记录，请进行确认以防数据的丢失' : id[0] != -1 ? '此操作将删除这条消息，请进行确认以防数据的丢失' : '此操作将删除选中的' + selectedNum + '条消息，请进行确认以防数据的丢失', + contentTitle: noticeType === "1" ? '您确定要删除与 xxx 的聊天吗？' : id[0] != 0 ? '您确定要删除这条@我消息吗？' : '您确定要删除选中的' + selectedNum + '条消息吗？', + content: noticeType === "1" ? '此操作将删除与xxx的聊天框和xxx的所有聊天记录，请进行确认以防数据的丢失' : id[0] != 0 ? '此操作将删除这条消息，请进行确认以防数据的丢失' : '此操作将删除选中的' + selectedNum + '条消息，请进行确认以防数据的丢失', onOk: () => { const params = { type: noticeType === "0" ? "notification" : noticeType === "2" ? "atme" : "", - ids:id, + ids:id[0]===0?ids:id, }; - // console.log(params); - axios.delete(`/users/yystopf/messages.json`,{ + console.log(params); + axios.delete(`/users/${current_user.login}/messages.json`,{ data:params, }).then((response)=>{ - // console.log(response); - }) + console.log(response); + }); + getMessageList(); } }); } } - - return (
@@ -223,12 +181,14 @@ function MyNotice(props) {
- e.target.checked ? setOnlyUnread(1) : setOnlyUnread(2)}>仅看未读{noticeType === "1" ? `私信（12）` : noticeType === "0" ? `消息（${noticeUnreadCount}）` : `消息（${atUnreadCount}）`} + e.target.checked ? setOnlyUnread(1) : setOnlyUnread()}>仅看未读{noticeType === "1" ? `私信（12）` : noticeType === "0" ? `消息（${noticeUnreadCount}）` : `消息（${atUnreadCount}）`}
- {noticeType === "2" ? : ""} + {noticeType === "2" && messageList.length > 0 ? : ""}
-
+ {messageList.length===0 ? :""} + + {messageList && messageList.length>0 &&
{/*   */} 全选 @@ -236,21 +196,20 @@ function MyNotice(props) {
     - +
-
+
} {messageList.map(item => { // 系统消息 - // 消息类别 - // const iconName = item.source.startsWith("Issue")?"icon-yixiuicon1":item.source.startsWith("Project")?"icon-daimakuicon1":item.source.startsWith("Project")?"icon-daimakuicon1": - if (noticeType === "0" && item.type === "notification") { + if (noticeType === "0") { + // 消息类别 return (
-
+
{item.status === 1 ? : } - - window.location.href = (`${item.notification_url}`)}>{item.content} + + window.open("https://"+`${item.notification_url}`)}>{item.content}
{item.time_ago} @@ -258,29 +217,41 @@ function MyNotice(props) {
) - } else if (noticeType === "2" && item.type === "atme") { + } else if (noticeType === "2") { //@我 return (
{/* */} - - - {item.status === 1 ? : } - {item.content} - + {item.sender && } +
+
{item.status === 1 ? : }
+
{item.content}
+
{item.time_ago} {item.status === 1 && readNotice([item.id])}>标记为已读}    - deleteNotice([item.id])}>删除 + deleteNotice([item.id])}>删除
) } })} + {/* 分页 */} +
+ {setCurrentPage(page)}} + total = {messTotalCount} + hideOnSinglePage + > +
+ {/* 私信 */} {/*
diff --git a/src/forge/SecuritySetting/notice/myNotice/Index.scss b/src/forge/SecuritySetting/notice/myNotice/Index.scss index 2632f62bf..b4a02b351 100644 --- a/src/forge/SecuritySetting/notice/myNotice/Index.scss +++ b/src/forge/SecuritySetting/notice/myNotice/Index.scss @@ -82,7 +82,6 @@ button:active { padding: 15px 0 15px 10px; border-bottom: 1px solid #EEEEEE; color: #333333; - &:hover{ background: #F3F4F6; } @@ -135,6 +134,18 @@ button:active { & .invisible-checkbox{ display: none; } + .atme-notice-text{ + position: relative; + margin-left: 12px; + max-width: 48rem; + & .at-badge{ + position:absolute; + } + + & .highlightSpan{ + margin-left: 12px; + } + } } & .ant-badge-count, .ant-badge-dot, .ant-badge .ant-scroll-number-custom-component { @@ -198,10 +209,7 @@ button:active { max-width: 52rem; } -.at-length{ - max-width: 48rem; - margin-left: 12px; -} + #numberSpan{ color: #466AFF; } @@ -211,10 +219,20 @@ button:active { align-items: center; } +.stretch-style{ + display: flex; + align-items: baseline; +} + .float-left-little{ margin-right: 10px; } +.paging{ + float: right; + margin: 12px; +} + // .invisible_checkGroup{ // & .ant-checkbox-inner{ // display: none;