feat: 信息中心相关

config/routes.js

@@ -153,6 +153,13 @@ export default [
         icon: 'icon-users',
         component: './Hr/Employee',
         access: 'authRouteFilter'
+      },
+      {
+        path: '/hr/notification',
+        name: 'notification',
+        icon: 'icon-commentingo',
+        component: './Hr/Notification'
+        // access: 'authRouteFilter'
       }
     ]
   },

package.json

@@ -68,6 +68,7 @@
     "react-copy-to-clipboard": "^5.0.4",
     "react-dom": "17.0.2",
     "react-helmet-async": "^1.0.4",
+    "react-infinite-scroll-component": "^6.1.0",
     "umi": "3.5.4"
   },
   "devDependencies": {

src/locales/zh-CN/menu.js

@@ -18,6 +18,7 @@ export default {
   'menu.product.cloud.gs': '大司空概算',
   'menu.hr': '人资',
   'menu.hr.employee': '部门与员工',
+  'menu.hr.notification': '信息中心',
   'menu.login': '登录',
   'menu.exception.403': '403',
   'menu.exception.404': '404',

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

@@ -0,0 +1,11 @@
+import React from 'react'
+
+const RighEditor = () => {
+  return (
+    <div>
+      <span>编辑</span>
+    </div>
+  )
+}
+
+export default RighEditor

src/pages/Hr/Notification/index.jsx

@@ -0,0 +1,98 @@
+import React, { useState, useEffect } from 'react'
+import { List, Avatar, Tag, Skeleton, Divider } from 'antd'
+import InfiniteScroll from 'react-infinite-scroll-component'
+import { queryMessage } from '@/services/staff'
+import consts from '@/consts'
+
+const Notification = () => {
+  const msgTypeEnum = {
+    message: '通知',
+    notification: '消息'
+  }
+  const [state, setState] = useState({
+    loading: false,
+    message: [],
+    hasMore: true,
+    current: 1,
+    pageSize: 10,
+    total: 0
+  })
+  setState()
+  // const loadMoreData = () => {
+  //   if (state.message.length >= 500) {
+  //     setState({ hasMore: false })
+  //     return
+  //   }
+  //   setTimeout(() => {
+  //     setState({
+  //       message: state.message.concat()
+  //     })
+  //   }, 500)
+  // }
+  const initData = async () => {
+    setState({ ...state, loading: true })
+    const {
+      data: { message = [] },
+      code = -1
+    } = await queryMessage()
+    if (code === consts.RET_CODE.SUCCESS) {
+      setState({ ...state, message, loading: false })
+    }
+  }
+  useEffect(() => {
+    initData()
+  }, [])
+  console.log(state.message.length)
+  const loadMoreData = () => {
+    if (state.total === state.message.length) {
+      return
+    }
+    setState(
+      {
+        loading: true,
+        current: state.current + 1
+      },
+      () => {
+        initData()
+      }
+    )
+  }
+  return (
+    <div className="bg-[#ffffff] rounded-md px-6 pb-6">
+      <div id="scrollableDiv" style={{ height: 700, overflow: 'auto' }}>
+        <InfiniteScroll
+          dataLength={state.message.length}
+          next={loadMoreData}
+          hasMore={state.hasMore}
+          loader={<Skeleton avatar paragraph={{ rows: 1 }} active />}
+          endMessage={<Divider plain>别再滚啦，已是尽头</Divider>}
+          scrollableTarget="scrollableDiv">
+          <List
+            header={<div>信息中心</div>}
+            itemLayout="horizontal"
+            // pagination={{ pageSize: 5 }}
+            dataSource={state.message}
+            renderItem={item => (
+              <List.Item key={item.id}>
+                <List.Item.Meta
+                  avatar={<Avatar src={item.avatar} />}
+                  title={<a href="#">{item.title}</a>}
+                  description={[
+                    <div className="mb-1">
+                      <Tag color="purple">{msgTypeEnum[item.msgType]}</Tag> '发布于',
+                      <span className="ml-2">全公司</span>
+                    </div>
+                  ]}
+                />
+                {item.content}
+                <div className="mt-1 text-hex-aaa">{item.createTime}</div>
+              </List.Item>
+            )}
+          />
+        </InfiniteScroll>
+      </div>
+    </div>
+  )
+}
+
+export default Notification

src/services/staff.js

@@ -27,3 +27,18 @@ export async function apiChangeSupervisor(postUrl, payload) {
   const data = await request.post(`/${postUrl}/change/supervisor`, { data: { ...payload } })
   return data
 }
+
+/** 信息中心列表 */
+export async function queryMessage(payload) {
+  const data = await request.get('/message/all', {
+    params: { ...payload }
+  })
+  return data
+}
+
+/** 发送通知 */
+export async function sendMessage(params) {
+  return request.post('/message/send', {
+    data: params
+  })
+}