完成发布文章基本布局
This commit is contained in:
@@ -1,3 +1,3 @@
|
||||
.ant-drawer-content-wrapper {
|
||||
width: 50% !important;
|
||||
}
|
||||
// .ant-drawer-content-wrapper {
|
||||
// width: 50% !important;
|
||||
// }
|
||||
@@ -1,9 +1,82 @@
|
||||
import { Form, Input, Button, Select, DatePicker, SelectProps } from "antd";
|
||||
import "./index.scss"
|
||||
import TextArea from "antd/es/input/TextArea";
|
||||
|
||||
const PublishForm = () => {
|
||||
const options: SelectProps['options'] = [];
|
||||
|
||||
for (let i = 10; i < 36; i++) {
|
||||
options.push({
|
||||
label: i.toString(36) + i,
|
||||
value: i.toString(36) + i,
|
||||
});
|
||||
}
|
||||
|
||||
const onSubmit = () => {
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<h1>Hello World!</h1>
|
||||
<Form
|
||||
name="basic"
|
||||
size="large"
|
||||
layout="vertical"
|
||||
onFinish={onSubmit}
|
||||
autoComplete="off"
|
||||
>
|
||||
<Form.Item
|
||||
label="选择发布时间"
|
||||
name="createTime"
|
||||
>
|
||||
<DatePicker placeholder="选择文章发布时间" className="w-full" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label="选择分类"
|
||||
name="cate"
|
||||
rules={[{ required: true, message: '请选择文章分类' }]}
|
||||
>
|
||||
<Select placeholder="请选择文章分类">
|
||||
<Select.Option value="demo">Demo</Select.Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label="选择标签"
|
||||
name="tag"
|
||||
rules={[{ required: true, message: '请选择文章标签' }]}
|
||||
>
|
||||
<Select
|
||||
allowClear
|
||||
mode="multiple"
|
||||
options={options}
|
||||
// defaultValue={['a10', 'c12']}
|
||||
placeholder="请选择文章标签"
|
||||
className="w-full"
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label="文章封面"
|
||||
name="cover"
|
||||
rules={[{ required: true, message: '请输入文章封面' }]}
|
||||
>
|
||||
<Input placeholder="请输入文章封面" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label="文章简介"
|
||||
name="description"
|
||||
rules={[{ required: true, message: '请输入文章简介' }]}
|
||||
>
|
||||
<TextArea autoSize={{ minRows: 2, maxRows: 5 }} showCount placeholder="请输入文章简介" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit" className="w-6/12">发布文章</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -39,6 +39,7 @@ const CreatePage = () => {
|
||||
<Drawer
|
||||
title="发布文章"
|
||||
placement="right"
|
||||
size='large'
|
||||
closable={false}
|
||||
onClose={() => setPublishOpen(false)}
|
||||
open={publishOpen}
|
||||
|
||||
@@ -32,7 +32,7 @@ const UserPage = () => {
|
||||
setLoading(false)
|
||||
await editUserDataAPI({ id: store.user.id, ...values });
|
||||
message.success("🎉 修改用户信息成功");
|
||||
store.setUser(values as User); // 假设你有一个setUser方法
|
||||
store.setUser(values as User);
|
||||
getUserData();
|
||||
};
|
||||
|
||||
|
||||
@@ -39,7 +39,7 @@ const WebPage = () => {
|
||||
layout="vertical"
|
||||
onFinish={onSubmit}
|
||||
initialValues={web}
|
||||
className="w-5/12 mx-auto"
|
||||
className="w-6/12 mx-auto"
|
||||
>
|
||||
<Form.Item
|
||||
label="网站名称"
|
||||
|
||||
Reference in New Issue
Block a user