From b01cdf9b8aeeccdfe7d8002063efb1c43b19961b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=87=E9=98=B3?= <3311118881@qq.com> Date: Mon, 2 Sep 2024 16:58:20 +0800 Subject: [PATCH] =?UTF-8?q?=E5=81=9A=E4=BA=86=E5=BE=88=E5=A4=9A=E4=BA=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/Article.ts | 14 +++--- src/components/FileUpload/index.tsx | 4 +- src/pages/Article/index.tsx | 9 ++-- src/pages/Comment/index.tsx | 66 +++++++++++++++++++++-------- 4 files changed, 63 insertions(+), 30 deletions(-) diff --git a/src/api/Article.ts b/src/api/Article.ts index ea38870..4b338ed 100644 --- a/src/api/Article.ts +++ b/src/api/Article.ts @@ -17,12 +17,14 @@ export const editArticleDataAPI = (data: Article) => export const getArticleDataAPI = (id?: number) => Request
("GET", `/article/${id}`) // 获取文章列表 -export const getArticleListAPI = (data?: QueryData) => Request("POST", `/article/list`, { - data: { ...data?.query }, - params: { - sort: data?.sort, - } -}) +export const getArticleListAPI = (data?: QueryData) => { + return Request("POST", `/article/list`, { + data: { ...data?.query }, + params: { + sort: data?.sort, + } + }) +} // 分页获取文章列表 export const getArticlePagingAPI = (data?: QueryData) => Request>("POST", `/article/paging`, { diff --git a/src/components/FileUpload/index.tsx b/src/components/FileUpload/index.tsx index 1fc7ccf..1823f04 100644 --- a/src/components/FileUpload/index.tsx +++ b/src/components/FileUpload/index.tsx @@ -1,10 +1,10 @@ -import { FileDir } from '@/types/app/file'; +import { useRef, useState } from 'react'; import { InboxOutlined } from '@ant-design/icons'; import { message, Modal, Radio, Select, Spin } from 'antd'; import { useUserStore } from '@/stores'; +import { FileDir } from '@/types/app/file'; import { baseURL } from '@/utils/request'; import Compressor from 'compressorjs'; -import { useRef, useState } from 'react'; interface UploadFileProps { dir: FileDir, diff --git a/src/pages/Article/index.tsx b/src/pages/Article/index.tsx index 5eacbaf..f9cd5ab 100644 --- a/src/pages/Article/index.tsx +++ b/src/pages/Article/index.tsx @@ -59,15 +59,16 @@ const ArticlePage = () => { dataIndex: 'title', key: 'title', align: 'center', - width: 250, + width: 300, + render: (text: string) =>
{text}
, }, { title: '摘要', dataIndex: 'description', key: 'description', align: 'center', - width: 400, - render: (text: string) => (text ? text : '该文章暂未设置文章摘要'), + width: 350, + render: (text: string) =>
{text ? text : '该文章暂未设置文章摘要'}
, }, { title: '分类', @@ -201,7 +202,7 @@ const ArticlePage = () => { scroll={{ x: 'max-content' }} pagination={{ position: ['bottomCenter'], - pageSize: 8 + defaultPageSize: 8, }} /> diff --git a/src/pages/Comment/index.tsx b/src/pages/Comment/index.tsx index 3f25d29..20fd444 100644 --- a/src/pages/Comment/index.tsx +++ b/src/pages/Comment/index.tsx @@ -1,5 +1,5 @@ import { useState, useEffect } from 'react'; -import { Spin, Card, message, Table, Popconfirm, Button, Tag, Modal } from 'antd'; +import { Spin, Card, message, Table, Popconfirm, Button, Tag, Modal, Form, Input, DatePicker } from 'antd'; import { getCommentListAPI } from '@/api/Comment'; import { auditCommentDataAPI, delCommentDataAPI } from '@/api/Comment'; import { ColumnsType } from 'antd/es/table'; @@ -17,9 +17,10 @@ const CommentPage = () => { const getCommentList = async () => { const { data } = await getCommentListAPI(); + // 根据时间排序：最新时间在前 - const sortedData = (data as Comment[]).sort((a, b) => +b.createTime - +a.createTime); - setList(sortedData as Comment[]) + // const sortedData = (data as Comment[]).sort((a, b) => +b.createTime - +a.createTime); + setList(data) setLoading(false) } @@ -74,7 +75,8 @@ const CommentPage = () => { title: '内容', dataIndex: 'content', key: 'content', - render: (text: string, record) => { + width: 400, + render: (text: string, record) => { setComment(record) setIsModalOpen(true) }}>{text} @@ -89,12 +91,13 @@ const CommentPage = () => { title: '所属文章', dataIndex: 'articleTitle', key: 'articleTitle', + render: (text: string) => (text ? text : '该评论暂未绑定文章'), }, { title: '评论时间', dataIndex: 'createTime', key: 'createTime', - render: (date: string) => dayjs(date).format('YYYY-MM-DD HH:mm:ss'), + render: (date: string) => dayjs(+date).format('YYYY-MM-DD HH:mm:ss'), }, { title: '操作', @@ -123,24 +126,51 @@ const CommentPage = () => { }, ]; + const { RangePicker } = DatePicker; + + const onSubmit = async (values: FilterForm) => { + const query: FilterData = { + key: values.title ? values.title : null, + startDate: values.createTime ? values.createTime[0].valueOf() + '' : null, + endDate: values.createTime ? values.createTime[1].valueOf() + '' : null, + } + + const { data } = await getCommentListAPI({ query }); + } + return ( <> + <Card className='my-2 overflow-scroll'> + <Form layout="inline" onFinish={onSubmit} autoComplete="off" className='flex-nowrap'> + <Form.Item label="标题" name="title" className='w-2/12'> + <Input placeholder='请输入关键词' /> + </Form.Item> + + <Form.Item label="时间范围" name="createTime" className='w-3/12'> + <RangePicker placeholder={["选择起始时间", "选择结束时间"]} /> + </Form.Item> + + <Form.Item className='pr-6'> + <Button type="primary" htmlType="submit">查询</Button> + </Form.Item> + </Form> + </Card> + <Card className={`${titleSty} mt-2`}> - <Spin spinning={loading} indicator={<svg />}> - {list.length && <Table - rowKey="id" - dataSource={list} - columns={columns} - expandable={{ defaultExpandAllRows: true }} - scroll={{ x: 'max-content' }} - pagination={{ - position: ['bottomCenter'], - pageSize: 8 - }} - />} - </Spin> + <Table + rowKey="id" + dataSource={list} + columns={columns} + loading={loading} + expandable={{ defaultExpandAllRows: true }} + scroll={{ x: 'max-content' }} + pagination={{ + position: ['bottomCenter'], + defaultPageSize: 8, + }} + /> </Card> <Modal title='评论详情' open={isModalOpen} onCancel={() => setIsModalOpen(false)} footer={null}>