1
1
import React , { useState , useEffect } from 'react'
2
2
import { Row , Col , Form , Table , Input , Button , Spin , Select } from 'antd'
3
3
import { listColumns } from './util'
4
- import { stockPageList , IStockQuery } from '../../services/stock'
4
+ import { stockPageList , StockQuery } from '../../services/stock'
5
5
import { data2PageData , pageData2Params } from '../../utils/tools'
6
- import { marketOpts , blockOpts } from '../../types/stock'
6
+ import { Stock , marketOpts , blockOpts } from '../../types/stock'
7
7
8
8
const ShareList : React . FC = ( ) => {
9
9
10
- const [ code , setCode ] = useState ( '' )
11
- const [ name , setName ] = useState ( '' )
10
+ const [ form ] = Form . useForm < StockQuery > ( )
11
+
12
12
const [ loading , setLoading ] = useState ( false )
13
- const [ pageData , setPageData ] = useState ( data2PageData ( ) )
13
+ const [ pageData , setPageData ] = useState ( data2PageData < Stock > ( ) )
14
14
15
- const onQuery = ( params : Partial < IStockQuery > = pageData2Params ( pageData . meta ) ) => {
15
+ const onQuery = ( params = pageData2Params ( pageData . meta ) ) => {
16
+ const vals = form . getFieldsValue ( )
16
17
setLoading ( true )
17
- stockPageList ( { ...params , code , name } ) . then ( res => {
18
+ stockPageList ( { ...params , ... vals } ) . then ( res => {
18
19
const data = data2PageData ( res )
19
20
setPageData ( data )
20
21
} ) . finally ( ( ) => setLoading ( false ) )
@@ -26,26 +27,26 @@ const ShareList: React.FC = () => {
26
27
27
28
28
29
return < Spin spinning = { loading } >
29
- < Form >
30
+ < Form form = { form } >
30
31
< Row gutter = { 16 } >
31
32
< Col span = { 6 } >
32
- < Form . Item >
33
- < Input placeholder = "代码" onChange = { ( { target : { value } } ) => setCode ( value ) } />
33
+ < Form . Item name = "code" >
34
+ < Input allowClear placeholder = "代码" />
34
35
</ Form . Item >
35
36
</ Col >
36
37
< Col span = { 6 } >
37
- < Form . Item >
38
- < Input placeholder = "名称" onChange = { ( { target : { value } } ) => setName ( value ) } />
38
+ < Form . Item name = "name" >
39
+ < Input allowClear placeholder = "名称" />
39
40
</ Form . Item >
40
41
</ Col >
41
42
< Col span = { 6 } >
42
- < Form . Item >
43
- < Select placeholder = "请选择市场" />
43
+ < Form . Item name = "market" >
44
+ < Select allowClear placeholder = "请选择市场" options = { marketOpts ( ) } />
44
45
</ Form . Item >
45
46
</ Col >
46
47
< Col span = { 6 } >
47
- < Form . Item >
48
- < Select placeholder = "请选择板块" />
48
+ < Form . Item name = "block" >
49
+ < Select allowClear placeholder = "请选择板块" options = { blockOpts ( ) } />
49
50
</ Form . Item >
50
51
</ Col >
51
52
</ Row >
@@ -58,6 +59,7 @@ const ShareList: React.FC = () => {
58
59
< Table
59
60
columns = { listColumns ( ) }
60
61
dataSource = { pageData . data }
62
+ key = "code"
61
63
pagination = { {
62
64
...pageData . meta ,
63
65
onChange : ( page , pageSize ) => onQuery ( { page, pageSize} )
0 commit comments