提交 d328d22e1dbf24ecedede8d7b70a02402575afe8

作者 愚道
1 个父辈 b9482c0a

add search input to SearchListProjects

1 1 import React, { PureComponent } from 'react';
2 2 import moment from 'moment';
3 3 import { connect } from 'dva';
4   -import { Row, Col, Form, Card, Select, List } from 'antd';
  4 +import { Row, Col, Form, Card, Select, List, Input } from 'antd';
5 5
6 6 import { TagSelect, AvatarList, Ellipsis } from 'ant-design-pro';
7 7
8 8 import StandardFormRow from './components/StandardFormRow';
  9 +import PageHeaderWrapper from './components/PageHeaderWrapper';
9 10 import styles from './style.less';
10 11
11 12 const { Option } = Select;
... ... @@ -93,58 +94,75 @@ class CoverCardList extends PureComponent {
93 94 sm: { span: 16 },
94 95 },
95 96 };
  97 + const mainSearch = (
  98 + <div style={{ textAlign: 'center' }}>
  99 + <Input.Search
  100 + placeholder="请输入"
  101 + enterButton="搜索"
  102 + size="large"
  103 + onSearch={this.handleFormSubmit}
  104 + style={{ width: 522 }}
  105 + />
  106 + </div>
  107 + );
96 108
97 109 return (
98   - <div className={styles.coverCardList}>
99   - <Card bordered={false}>
100   - <Form layout="inline">
101   - <StandardFormRow title="所属类目" block style={{ paddingBottom: 11 }}>
102   - <FormItem>
103   - {getFieldDecorator('category')(
104   - <TagSelect expandable>
105   - <TagSelect.Option value="cat1">类目一</TagSelect.Option>
106   - <TagSelect.Option value="cat2">类目二</TagSelect.Option>
107   - <TagSelect.Option value="cat3">类目三</TagSelect.Option>
108   - <TagSelect.Option value="cat4">类目四</TagSelect.Option>
109   - <TagSelect.Option value="cat5">类目五</TagSelect.Option>
110   - <TagSelect.Option value="cat6">类目六</TagSelect.Option>
111   - <TagSelect.Option value="cat7">类目七</TagSelect.Option>
112   - <TagSelect.Option value="cat8">类目八</TagSelect.Option>
113   - <TagSelect.Option value="cat9">类目九</TagSelect.Option>
114   - <TagSelect.Option value="cat10">类目十</TagSelect.Option>
115   - <TagSelect.Option value="cat11">类目十一</TagSelect.Option>
116   - <TagSelect.Option value="cat12">类目十二</TagSelect.Option>
117   - </TagSelect>
118   - )}
119   - </FormItem>
120   - </StandardFormRow>
121   - <StandardFormRow title="其它选项" grid last>
122   - <Row gutter={16}>
123   - <Col lg={8} md={10} sm={10} xs={24}>
124   - <FormItem {...formItemLayout} label="作者">
125   - {getFieldDecorator('author', {})(
126   - <Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
127   - <Option value="lisa">王昭君</Option>
128   - </Select>
129   - )}
130   - </FormItem>
131   - </Col>
132   - <Col lg={8} md={10} sm={10} xs={24}>
133   - <FormItem {...formItemLayout} label="好评度">
134   - {getFieldDecorator('rate', {})(
135   - <Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
136   - <Option value="good">优秀</Option>
137   - <Option value="normal">普通</Option>
138   - </Select>
139   - )}
140   - </FormItem>
141   - </Col>
142   - </Row>
143   - </StandardFormRow>
144   - </Form>
145   - </Card>
146   - <div className={styles.cardList}>{cardList}</div>
147   - </div>
  110 + <PageHeaderWrapper
  111 + title="搜索列表"
  112 + content={mainSearch}
  113 + onTabChange={this.handleTabChange}
  114 + >
  115 + <div className={styles.coverCardList}>
  116 + <Card bordered={false}>
  117 + <Form layout="inline">
  118 + <StandardFormRow title="所属类目" block style={{ paddingBottom: 11 }}>
  119 + <FormItem>
  120 + {getFieldDecorator('category')(
  121 + <TagSelect expandable>
  122 + <TagSelect.Option value="cat1">类目一</TagSelect.Option>
  123 + <TagSelect.Option value="cat2">类目二</TagSelect.Option>
  124 + <TagSelect.Option value="cat3">类目三</TagSelect.Option>
  125 + <TagSelect.Option value="cat4">类目四</TagSelect.Option>
  126 + <TagSelect.Option value="cat5">类目五</TagSelect.Option>
  127 + <TagSelect.Option value="cat6">类目六</TagSelect.Option>
  128 + <TagSelect.Option value="cat7">类目七</TagSelect.Option>
  129 + <TagSelect.Option value="cat8">类目八</TagSelect.Option>
  130 + <TagSelect.Option value="cat9">类目九</TagSelect.Option>
  131 + <TagSelect.Option value="cat10">类目十</TagSelect.Option>
  132 + <TagSelect.Option value="cat11">类目十一</TagSelect.Option>
  133 + <TagSelect.Option value="cat12">类目十二</TagSelect.Option>
  134 + </TagSelect>
  135 + )}
  136 + </FormItem>
  137 + </StandardFormRow>
  138 + <StandardFormRow title="其它选项" grid last>
  139 + <Row gutter={16}>
  140 + <Col lg={8} md={10} sm={10} xs={24}>
  141 + <FormItem {...formItemLayout} label="作者">
  142 + {getFieldDecorator('author', {})(
  143 + <Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
  144 + <Option value="lisa">王昭君</Option>
  145 + </Select>
  146 + )}
  147 + </FormItem>
  148 + </Col>
  149 + <Col lg={8} md={10} sm={10} xs={24}>
  150 + <FormItem {...formItemLayout} label="好评度">
  151 + {getFieldDecorator('rate', {})(
  152 + <Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
  153 + <Option value="good">优秀</Option>
  154 + <Option value="normal">普通</Option>
  155 + </Select>
  156 + )}
  157 + </FormItem>
  158 + </Col>
  159 + </Row>
  160 + </StandardFormRow>
  161 + </Form>
  162 + </Card>
  163 + <div className={styles.cardList}>{cardList}</div>
  164 + </div>
  165 + </PageHeaderWrapper>
148 166 );
149 167 }
150 168 }
... ...
注册登录 后发表评论