Browse Source

Merge branch 'feature_addGZHdaliyTab' of Web/contentCooper into master

jihuaqiang 4 tuần trước cách đây
mục cha
commit
4d6aa79a2a
1 tập tin đã thay đổi với 7 bổ sung4 xóa
  1. 7 4
      src/views/messages/messages.tsx

+ 7 - 4
src/views/messages/messages.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react'
-import { Button, Pagination } from 'antd'
+import { Button, Empty, Pagination, Spin } from 'antd'
 import { getNoticeList, readAllNotice, readNotice } from '@src/http/api'
 import request from '@src/http'
 import useMessageStore from '@src/store/message'
@@ -25,12 +25,14 @@ const Messages = () => {
 	const [messages, setMessages] = useState<Message[]>([])
 	const [page, setPage] = useState(1)
 	const [total, setTotal] = useState(0)
+	const [loading, setLoading] = useState(true)
 
 	useEffect(() => {
 		getMessages()
 	}, [page])
 
 	const getMessages = async () => {
+		setLoading(true)
 		const response = await request.post<{ objs: Message[], totalSize	: number }>(getNoticeList,{
 			pageNum: page,
 			pageSize: PAGE_SIZE,
@@ -38,6 +40,7 @@ const Messages = () => {
 		const { objs, totalSize } = response.data
 		setMessages(objs)
 		setTotal(totalSize)
+		setLoading(false)
 	}
 
 	const handleReadMessage = async (id: number, status: MessageStatus) => {
@@ -67,8 +70,8 @@ const Messages = () => {
 					handleReadAllMessage()
 				}}>一键全部已读</Button>
 			</div>
-			<div className='px-4 py-2 max-h-[calc(100vh-200px)] overflow-y-auto'>
-				{ 
+			<div className='px-4 py-2 max-h-[calc(100vh-200px)] h-[calc(100vh-200px)] overflow-y-auto'>
+				{ loading ? <div className='flex justify-center items-center h-full'><Spin /></div> : messages.length > 0 ?
 					messages.map((message) => (
 						<div onClick={() => {
 							handleReadMessage(message.id, message.status)
@@ -83,7 +86,7 @@ const Messages = () => {
 							<div className='text-sm text-gray-500'>{message.createTimestamp ? new Date(message.createTimestamp).toLocaleString() : ''}</div>
 						</div>
 					))
-				}
+				: <div className='flex justify-center items-center h-full'><Empty description="暂无消息" /></div>}
 			</div>
 			<Pagination
 				className='w-full justify-end fixed bottom-5 right-15'