feat: 替换通知中心富文本编译器以及开放用户消息

package.json

@@ -60,10 +60,8 @@
     "classnames": "^2.2.6",
     "crypto-js": "^4.0.0",
     "dayjs": "^1.10.4",
-    "easymde": "^2.15.0",
     "install": "^0.13.0",
     "lodash-es": "^4.17.21",
-    "markdown-it": "^12.2.0",
     "omit.js": "^2.0.2",
     "qs": "^6.9.4",
     "react": "17.0.2",
@@ -71,9 +69,9 @@
     "react-dom": "17.0.2",
     "react-helmet-async": "^1.0.4",
     "react-infinite-scroll-component": "^6.1.0",
-    "react-markdown": "^7.0.1",
-    "react-simplemde-editor": "^5.0.2",
-    "umi": "3.5.4"
+    "react-markdown": "^7.1.0",
+    "umi": "3.5.4",
+    "vditor": "^3.8.7"
   },
   "devDependencies": {
     "@ant-design/pro-cli": "^1.0.18",

src/components/RightContent/NoticeIcon/index.tsx

@@ -76,7 +76,7 @@ const NoticeIconView = () => {
   const { currentUser } = initialState || {}
   const [notices, setNotices] = useState([])
   const getNotices = useCallback(async () => {
-    const { code = -1, data } = await queryNoticeList()
+    const { code = -1, data } = await queryNoticeList({ current: 1, pageSize: 50 })
     if (code === consts.RET_CODE.SUCCESS) {
       setNotices(data.message)
     }

src/components/RightContent/index.tsx

@@ -63,7 +63,7 @@ const GlobalHeaderRight: React.FC = () => {
       </span> */}
       {!isMobile() && <Book />}
 
-      {/* <Notify /> */}
+      <Notify />
       <Avatar />
       {REACT_APP_ENV && REACT_APP_ENV !== 'prod' && (
         <span>

src/pages/Hr/Notification/components/RighEditor.jsx

@@ -1,7 +1,9 @@
-import React, { useState } from 'react'
-import SimpleMDE from 'react-simplemde-editor'
-import 'easymde/dist/easymde.min.css'
-import styles from '@/pages/Hr/Notification/index.less'
+import React, { useState, useEffect } from 'react'
+// import SimpleMDE from 'react-simplemde-editor'
+// import MarkDown from 'react-markdown'
+// import 'easymde/dist/easymde.min.css'
+import Vditor from 'vditor'
+import 'vditor/src/assets/scss/index.scss'
 
 const RighEditor = ({ value, onChange }) => {
   const [cValue, setValue] = useState(value)
@@ -10,14 +12,38 @@ const RighEditor = ({ value, onChange }) => {
     setValue(content)
     onChange(content)
   }
+  useEffect(() => {
+    const vditor = new Vditor('vditor', {
+      height: 200,
+      toolbarConfig: {
+        pin: true
+      },
+      value: cValue,
+      input(val) {
+        handleEditorChange(val)
+      },
+      cache: {
+        enable: false
+      },
+      after() {
+        vditor.setValue('请输入通知内容')
+      }
+    })
+  }, [])
   return (
+    // <MarkDown />
+    <div id="vditor" />
     // <MdEditor
     //   style={{ height: '300px' }}
     //   value={cValue}
     //   renderHTML={text => mdParser.render(text)}
     //   onChange={handleEditorChange}
     // />
-    <SimpleMDE className={styles.SimpleCont} value={cValue} onChange={handleEditorChange} />
+    // <SimpleMDE
+    //   value={cValue}
+    //   onChange={handleEditorChange}
+    //   options={{ maxHeight: '250px', previewClass: 'mu-preview-class' }}
+    // />
   )
 }
 

src/pages/Hr/Notification/index.jsx

@@ -7,14 +7,15 @@ import consts from '@/consts'
 import { useRequest } from 'umi'
 import { useModal } from '@/components/Modal'
 import MessageDrawer from './components/MessageDrawer'
+import ws, { CmdType } from '@/utils/ws'
 // import MarkDown from 'react-markdown'
 
 const Notification = () => {
   const { toggleDrawer, setDrawerProps } = useModal()
   // const { sendMsg } = useWebSocketFn()
   const msgTypeEnum = {
-    message: '通知',
-    notification: '消息'
+    message: '消息',
+    notification: '通知'
   }
   const [state, setState] = useState({
     loading: false,
@@ -53,10 +54,13 @@ const Notification = () => {
 
   const { run: trySendMessage } = useRequest(sendMessage, {
     manual: true,
-    onSuccess: () => {
+    onSuccess: result => {
       initData({ current: state.current })
       // tRef.current?.reload()
-      // sendMsg(cmdType.Notice, result)
+      ws.sendMessage({
+        cmd: CmdType.NoticeOrMessage,
+        ...result
+      })
     },
     onError: e => {
       message.error(e.message)
@@ -90,7 +94,8 @@ const Notification = () => {
           hasMore={state.hasMore}
           loader={<Skeleton avatar paragraph={{ rows: 1 }} active />}
           endMessage={<Divider plain>别再滚啦，已是尽头</Divider>}
-          scrollableTarget="scrollableDiv">
+          scrollableTarget="scrollableDiv"
+        >
           <List
             itemLayout="horizontal"
             // pagination={{ pageSize: 5 }}
@@ -102,7 +107,8 @@ const Notification = () => {
                   title={
                     <span
                       className="cursor-pointer text-primary"
-                      onClick={() => showMessageDrawer(item)}>
+                      onClick={() => showMessageDrawer(item)}
+                    >
                       {item.title}
                     </span>
                   }