|
|
@@ -1,8 +1,9 @@
|
|
|
-import { Card, Tabs, Input, Typography, Space } from 'antd';
|
|
|
+import { Card, Tabs, Input, Typography, Space, Form, Button } from 'antd';
|
|
|
|
|
|
import React from 'react';
|
|
|
import { useState } from 'react';
|
|
|
import { postData, getData } from '@/services/demo';
|
|
|
+import { ReloadOutlined, SearchOutlined } from '@ant-design/icons';
|
|
|
|
|
|
const { Text } = Typography;
|
|
|
const { Search } = Input;
|
|
|
@@ -12,6 +13,7 @@ const DemoPage: React.FC = () => {
|
|
|
const [tabText1, setTabText1] = useState('Tab1');
|
|
|
const [tabText2, setTabText2] = useState('Tab2');
|
|
|
const [tabText3, setTabText3] = useState('Tab3');
|
|
|
+ const [form] = Form.useForm();
|
|
|
|
|
|
const handleOnChange = (key: string) => {
|
|
|
console.log('handleOnChange: ' + key);
|
|
|
@@ -48,7 +50,27 @@ const DemoPage: React.FC = () => {
|
|
|
}
|
|
|
return (
|
|
|
<div className="site-card-border-less-wrapper">
|
|
|
- <Card title="demo_page">
|
|
|
+ <Card title="demo">
|
|
|
+ <Form form={form} layout="inline">
|
|
|
+ <Form.Item name="first" label="第一个">
|
|
|
+ <Input placeholder="请输入..." />
|
|
|
+ </Form.Item>
|
|
|
+ <Form.Item name="first" label="第二个">
|
|
|
+ <Input placeholder="请输入..." />
|
|
|
+ </Form.Item>
|
|
|
+ <Form.Item style={{ marginBottom: '10px' }}>
|
|
|
+ <Space>
|
|
|
+ <Button type="primary" htmlType="submit">
|
|
|
+ <SearchOutlined />
|
|
|
+ 查询
|
|
|
+ </Button>
|
|
|
+ <Button htmlType="button">
|
|
|
+ <ReloadOutlined />
|
|
|
+ 重置
|
|
|
+ </Button>
|
|
|
+ </Space>
|
|
|
+ </Form.Item>
|
|
|
+ </Form>
|
|
|
<Tabs defaultActiveKey="1" activeKey={currentKey} onChange={handleOnChange}>
|
|
|
<Tabs.TabPane tab="Demo_Tab_1" key="1" />
|
|
|
<Tabs.TabPane tab="Demo_Tab_2" key="2" />
|
lizhiqi