解决目前已知问题

This commit is contained in:
宇阳
2024-08-09 14:35:26 +08:00
parent 805ea3b99f
commit ffc2260d39
2 changed files with 61 additions and 61 deletions

View File

@@ -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>

View File

@@ -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>
</>
);