Merge pull request '我的通知' (#17) from durian/forgeplus-react:feature_notification_xiesi into feature_notification

2021-09-15 13:16:35 +08:00 · 2021-09-15 13:16:35 +08:00 · 9b6ad6340f
parent 0e31deb88c f6a98e4169
commit 9b6ad6340f
6 changed files with 68 additions and 81 deletions
--- a/src/forge/Head/NoticeContent.jsx
+++ b/src/forge/Head/NoticeContent.jsx
@ -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>
--- a/src/forge/Notice/Index.jsx
+++ b/src/forge/Notice/Index.jsx
@ -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>
--- a/src/forge/SecuritySetting/Index.jsx
+++ b/src/forge/SecuritySetting/Index.jsx
@ -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}/>
                  )}
--- a/src/forge/SecuritySetting/notice/myNotice/Index.jsx
+++ b/src/forge/SecuritySetting/notice/myNotice/Index.jsx
@ -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">
--- a/src/forge/SecuritySetting/notice/myNotice/Index.scss
+++ b/src/forge/SecuritySetting/notice/myNotice/Index.scss
@ -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;
+}
--- a/src/forge/users/Material/Index.jsx
+++ b/src/forge/users/Material/Index.jsx
@ -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;