82 lines
2.9 KiB
TypeScript
82 lines
2.9 KiB
TypeScript
|
import './proj-new.css';
|
||
|
|
import {Link, useNavigate} from "react-router-dom";
|
||
|
|
import {Breadcrumb, Button, Flex, Form, type FormProps, Input} from "antd";
|
||
|
|
|
||
|
|
const {TextArea} = Input;
|
||
|
|
|
||
|
|
type FieldType = {
|
||
|
|
projTitle: string;
|
||
|
|
projDesc: string;
|
||
|
|
};
|
||
|
|
|
||
|
|
export default function ProjNew() {
|
||
|
|
const nav = useNavigate();
|
||
|
|
|
||
|
|
const onFinish: FormProps<FieldType>["onFinish"] = (values) => {
|
||
|
|
console.log('Success:', values);
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
const onFinishFailed: FormProps<FieldType>["onFinishFailed"] = (errorInfo) => {
|
||
|
|
console.log('Failed:', errorInfo);
|
||
|
|
};
|
||
|
|
|
||
|
|
const onBack = () => {
|
||
|
|
nav(-1);
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<Breadcrumb
|
||
|
|
items={[
|
||
|
|
{title: <Link to={'/'}>首页</Link>},
|
||
|
|
{title: <Link to={'/proj-create'}>创建项目</Link>},
|
||
|
|
{title: <Link to={'/proj-new'}>新建项目</Link>},
|
||
|
|
]}
|
||
|
|
/>
|
||
|
|
<div className="proj-new">
|
||
|
|
<div className="proj-title">请完善项目的基本信息</div>
|
||
|
|
<div className="proj-form">
|
||
|
|
<Form
|
||
|
|
name="basic"
|
||
|
|
layout={'vertical'}
|
||
|
|
labelCol={{span: 24}}
|
||
|
|
wrapperCol={{span: 24}}
|
||
|
|
style={{width: 500}}
|
||
|
|
initialValues={{remember: true}}
|
||
|
|
onFinish={onFinish}
|
||
|
|
onFinishFailed={onFinishFailed}
|
||
|
|
autoComplete="off"
|
||
|
|
>
|
||
|
|
<Form.Item<FieldType>
|
||
|
|
label="系统标题"
|
||
|
|
name="projTitle"
|
||
|
|
rules={[{required: true, message: '请输入系统标题'}]}
|
||
|
|
>
|
||
|
|
<Input placeholder="请输入系统标题"/>
|
||
|
|
</Form.Item>
|
||
|
|
|
||
|
|
<Form.Item<FieldType>
|
||
|
|
label="简单描述"
|
||
|
|
name="projDesc"
|
||
|
|
rules={[{required: true, message: '请输入简单描述'}]}
|
||
|
|
>
|
||
|
|
<TextArea rows={6} placeholder="请用一段话简单描述系统"/>
|
||
|
|
</Form.Item>
|
||
|
|
|
||
|
|
<Form.Item>
|
||
|
|
<Flex align="center" justify="center" gap="large">
|
||
|
|
<Button type="primary" htmlType="submit">
|
||
|
|
提交并付款
|
||
|
|
</Button>
|
||
|
|
<Button type="default" htmlType="button" onClick={onBack}>
|
||
|
|
返回上一级
|
||
|
|
</Button>
|
||
|
|
</Flex>
|
||
|
|
</Form.Item>
|
||
|
|
</Form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|