feat: 通知中心增加点击显示详情，去掉底部查看更多和清空消息

src/components/RightContent/NoticeIcon/NoticeIcon.tsx

@@ -110,8 +110,7 @@ const NoticeIcon: React.FC<NoticeIconProps> & {
       overlayClassName={styles.popover}
       trigger={['click']}
       visible={visible}
-      onVisibleChange={setVisible}
-    >
+      onVisibleChange={setVisible}>
       {trigger}
     </HeaderDropdown>
   )

src/components/RightContent/NoticeIcon/NoticeList.tsx

@@ -22,14 +22,14 @@ export type NoticeIconTabProps = {
 const NoticeList: React.FC<NoticeIconTabProps> = ({
   list = [],
   onClick,
-  onClear,
-  title,
-  onViewMore,
-  emptyText,
-  showClear = true,
-  clearText,
-  viewMoreText,
-  showViewMore = false
+  // onClear,
+  // title,
+  // onViewMore,
+  emptyText
+  // showClear = true,
+  // clearText,
+  // viewMoreText,
+  // showViewMore = false
 }) => {
   if (!list || list.length === 0) {
     return (
@@ -66,8 +66,7 @@ const NoticeList: React.FC<NoticeIconTabProps> = ({
               key={item.key || i}
               onClick={() => {
                 onClick?.(item)
-              }}
-            >
+              }}>
               <List.Item.Meta
                 className={styles.meta}
                 avatar={leftIcon}
@@ -88,7 +87,7 @@ const NoticeList: React.FC<NoticeIconTabProps> = ({
           )
         }}
       />
-      <div className={styles.bottomBar}>
+      {/* <div className={styles.bottomBar}>
         {showClear ? (
           <div onClick={onClear}>
             {clearText} {title}
@@ -105,7 +104,7 @@ const NoticeList: React.FC<NoticeIconTabProps> = ({
             {viewMoreText}
           </div>
         ) : null}
-      </div>
+      </div> */}
     </div>
   )
 }

src/components/RightContent/NoticeIcon/index.tsx

@@ -2,12 +2,13 @@ import { useCallback, useEffect, useState } from 'react'
 import { Tag, message } from 'antd'
 import { groupBy } from 'lodash-es'
 import { useModel, history } from 'umi'
-
+import { useModal } from '@/components/Modal'
 import NoticeIcon from './NoticeIcon'
 import styles from './index.less'
 import dayjs from 'dayjs'
 import { queryNoticeList, updateNotice } from '@/services/login'
 import consts from '@/consts'
+import MessageDrawer from '@/pages/Hr/Notification/components/MessageDrawer'
 
 export type GlobalHeaderRightProps = {
   fetchingNotices?: boolean
@@ -74,6 +75,7 @@ const NoticeIconView = () => {
   const { initialState, setInitialState } = useModel('@@initialState')
   const { currentUser } = initialState || {}
   const [notices, setNotices] = useState([])
+  const { toggleDrawer, setDrawerProps } = useModal()
   const getNotices = useCallback(async () => {
     const { code = -1, data } = await queryNoticeList({ current: 1, pageSize: 50 })
     if (code === consts.RET_CODE.SUCCESS) {
@@ -105,6 +107,16 @@ const NoticeIconView = () => {
         currentUser: { ...currentUser, unreadCount: currentUser.unreadCount - 1 }
       })
     }
+    setDrawerProps({
+      zIndex: 1056,
+      closable: true,
+      onClose: () => toggleDrawer(),
+      bodyStyle: {
+        height: '100vh'
+      },
+      children: <MessageDrawer item={item} />
+    })
+    toggleDrawer()
   }
 
   const clearReadState = async (title: string, key: string) => {