解决目前已知问题
This commit is contained in:
@@ -13,7 +13,7 @@ const CatePage = () => {
|
||||
const [list, setList] = useState<Cate[]>([]);
|
||||
const [isMethod, setIsMethod] = useState<'create' | 'edit'>('create');
|
||||
const [form] = Form.useForm();
|
||||
|
||||
|
||||
const getCateList = async () => {
|
||||
const { data } = await getCateListAPI();
|
||||
setList(data as Cate[]);
|
||||
@@ -130,8 +130,8 @@ const CatePage = () => {
|
||||
<Tree defaultExpandAll={true} treeData={treeData(list)} />
|
||||
</Spin>
|
||||
|
||||
<Modal title={isMethod === "edit" ? "编辑分类" : "新增分类"} open={isModelOpen} onCancel={closeModel} footer={null}>
|
||||
<Form form={form} layout="vertical" initialValues={cate} size='large' className='mt-6'>
|
||||
<Modal title={isMethod === "edit" ? "编辑分类" : "新增分类"} open={isModelOpen} onCancel={closeModel} destroyOnClose footer={null}>
|
||||
<Form form={form} layout="vertical" initialValues={cate} size='large' preserve={false} className='mt-6'>
|
||||
<Form.Item label="名称" name="name" rules={[{ required: true, message: '分类名称不能为空' }]}>
|
||||
<Input placeholder="大前端" />
|
||||
</Form.Item>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { Form, Input, Button, Table, notification, Card, message, Popconfirm } from 'antd';
|
||||
import { TagOutlined, SettingOutlined } from '@ant-design/icons';
|
||||
import { Form, Input, Button, Table, Card, message, Popconfirm, Spin } from 'antd';
|
||||
import { addTagDataAPI, delTagDataAPI, editTagDataAPI, getTagListAPI } from '@/api/Tag';
|
||||
import Title from '@/components/Title';
|
||||
|
||||
@@ -18,50 +17,49 @@ const TagManagement: React.FC = () => {
|
||||
|
||||
// 获取标签列表
|
||||
const getTagList = async () => {
|
||||
const { data } = await getTagListAPI()
|
||||
const { data } = await getTagListAPI();
|
||||
setList(data as Tag[]);
|
||||
setLoading(false)
|
||||
}
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
setLoading(true)
|
||||
getTagList()
|
||||
setLoading(true);
|
||||
getTagList();
|
||||
}, []);
|
||||
|
||||
const delTagData = async (id: number) => {
|
||||
setLoading(true);
|
||||
await delTagDataAPI(id);
|
||||
message.success('🎉 删除标签成功');
|
||||
getTagList()
|
||||
getTagList();
|
||||
};
|
||||
|
||||
const editTagData = (data: Tag) => {
|
||||
setLoading(true);
|
||||
setTag(data);
|
||||
form.setFieldsValue(data)
|
||||
setTitle('编辑标签');
|
||||
};
|
||||
|
||||
const submit = () => {
|
||||
form.validateFields().then(async (values) => {
|
||||
const fn = (message: string) => {
|
||||
setLoading(true);
|
||||
const fn = (value: string) => {
|
||||
form.resetFields();
|
||||
|
||||
notification.success({
|
||||
message: '成功',
|
||||
description: message,
|
||||
});
|
||||
getTagList()
|
||||
form.setFieldsValue({ name: '' })
|
||||
setTag({} as Tag)
|
||||
message.success(value);
|
||||
getTagList();
|
||||
};
|
||||
|
||||
if (tag.id) {
|
||||
await editTagDataAPI(tag);
|
||||
await editTagDataAPI({ ...tag, ...values });
|
||||
setTitle('新增标签');
|
||||
fn('🎉 编辑标签成功');
|
||||
} else {
|
||||
await addTagDataAPI(values);
|
||||
fn('🎉 新增标签成功');
|
||||
}
|
||||
})
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -69,49 +67,51 @@ const TagManagement: React.FC = () => {
|
||||
<Title value="标签管理" />
|
||||
|
||||
<Card className="mt-2">
|
||||
<div className="w-8/12 flex justify-between px-8 mx-auto">
|
||||
<div className="flex flex-col w-[40%]">
|
||||
<h2 className="text-xl pb-4 text-center">{title}</h2>
|
||||
<Spin spinning={loading}>
|
||||
<div className="w-8/12 flex justify-between px-8 mx-auto">
|
||||
<div className="flex flex-col w-[40%]">
|
||||
<h2 className="text-xl pb-4 text-center">{title}</h2>
|
||||
|
||||
<Form form={form} size="large" layout="vertical" initialValues={tag}>
|
||||
<Form.Item
|
||||
label="标签名称"
|
||||
name="name"
|
||||
rules={[{ required: true, message: '标签不能为空' }]}
|
||||
>
|
||||
<Input placeholder="大前端" />
|
||||
</Form.Item>
|
||||
<Form form={form} size="large" layout="vertical" initialValues={tag}>
|
||||
<Form.Item
|
||||
label="标签名称"
|
||||
name="name"
|
||||
rules={[{ required: true, message: '标签不能为空' }]}
|
||||
>
|
||||
<Input placeholder="大前端" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
<Button type="primary" size="large" onClick={submit} className="w-full">{title}</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
<Form.Item>
|
||||
<Button type="primary" size="large" onClick={submit} className="w-full">{title}</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col w-[50%]">
|
||||
<h2 className="text-xl pb-4 text-center">标签列表</h2>
|
||||
|
||||
<Table dataSource={list} rowKey="id">
|
||||
<Table.Column title="ID" dataIndex="id" />
|
||||
<Table.Column title="名称" dataIndex="name" align="center" />
|
||||
<Table.Column
|
||||
title="操作"
|
||||
align="center"
|
||||
render={(text, record: Tag) => (
|
||||
<>
|
||||
<div className='flex justify-center space-x-4'>
|
||||
<Button size="small" onClick={() => editTagData(record)}>编辑</Button>
|
||||
|
||||
<Popconfirm title="警告" description="你确定要删除吗" okText="确定" cancelText="取消" onConfirm={() => delTagData(record.id!)}>
|
||||
<Button size="small" type="primary" danger>删除</Button>
|
||||
</Popconfirm>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col w-[50%]">
|
||||
<h2 className="text-xl pb-4 text-center">标签列表</h2>
|
||||
|
||||
<Table dataSource={list} rowKey="id">
|
||||
<Table.Column title="ID" dataIndex="id" />
|
||||
<Table.Column title="名称" dataIndex="name" align="center" />
|
||||
<Table.Column
|
||||
title="操作"
|
||||
align="center"
|
||||
render={(text, record: Tag) => (
|
||||
<>
|
||||
<div className='flex justify-center space-x-4'>
|
||||
<Button size="small" onClick={() => editTagData(record)}>编辑</Button>
|
||||
|
||||
<Popconfirm title="警告" description="你确定要删除吗" okText="确定" cancelText="取消" onConfirm={() => delTagData(record.id!)}>
|
||||
<Button size="small" type="primary" danger>删除</Button>
|
||||
</Popconfirm>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
</Spin>
|
||||
</Card>
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user