Commit dcb5f767 authored by nikogu's avatar nikogu

update antd3.0

parent e6d23aed
@import '~antd/lib/style/v2-compatible-reset.less';
html, body, :global(#root) {
height: 100%;
}
......
......@@ -119,25 +119,23 @@ export default class BasicList extends PureComponent {
<Icon type="plus" /> ๆทปๅŠ 
</Button>
<List
rowKey="id"
loading={loading}
pagination={paginationProps}
>
{
list && list.map(item => (
<List.Item
key={item.id}
actions={[<a>็ผ–่พ‘</a>, <MoreBtn />]}
>
<List.Item.Meta
avatar={<Avatar src={item.logo} shape="square" size="large" />}
title={<a href={item.href}>{item.title}</a>}
description={item.subDescription}
/>
<ListContent data={item} />
</List.Item>
))
}
</List>
dataSource={list}
renderItem={item => (
<List.Item
actions={[<a>็ผ–่พ‘</a>, <MoreBtn />]}
>
<List.Item.Meta
avatar={<Avatar src={item.logo} shape="square" size="large" />}
title={<a href={item.href}>{item.title}</a>}
description={item.subDescription}
/>
<ListContent data={item} />
</List.Item>
)}
/>
</Card>
</div>
</PageHeaderLayout>
......
......@@ -55,34 +55,35 @@ export default class CardList extends PureComponent {
>
<div className={styles.cardList}>
<List
rowKey="id"
loading={loading}
grid={{ gutter: 16, lg: 3, md: 2, sm: 1, xs: 1 }}
>
<List.Item>
<Button type="dashed" className={styles.newButton}>
<Icon type="plus" /> ๆ–ฐๅขžไบงๅ“
</Button>
</List.Item>
{
list && list.map(item => (
<List.Item key={item.id}>
<Link to="/list/card-list">
<Card actions={[<a>ๆ“ไฝœไธ€</a>, <a>ๆ“ไฝœไบŒ</a>]}>
<Card.Meta
avatar={<Avatar size="large" src={item.avatar} />}
title={item.title}
description={(
<p className={styles.cardDescription}>
<span>{item.description}</span>
</p>
)}
/>
</Card>
</Link>
dataSource={['', ...list]}
renderItem={item => (item ? (
<List.Item key={item.id}>
<Link to="/list/card-list">
<Card actions={[<a>ๆ“ไฝœไธ€</a>, <a>ๆ“ไฝœไบŒ</a>]}>
<Card.Meta
avatar={<Avatar size="large" src={item.avatar} />}
title={item.title}
description={(
<p className={styles.cardDescription}>
<span>{item.description}</span>
</p>
)}
/>
</Card>
</Link>
</List.Item>
) : (
<List.Item>
<Button type="dashed" className={styles.newButton}>
<Icon type="plus" /> ๆ–ฐๅขžไบงๅ“
</Button>
</List.Item>
))
}
</List>
)
)}
/>
</div>
</PageHeaderLayout>
);
......
......@@ -73,40 +73,39 @@ export default class CoverCardList extends PureComponent {
const cardList = list ? (
<List
rowKey="id"
loading={loading}
grid={{ gutter: 16, lg: 4, md: 3, sm: 2, xs: 1 }}
>
{
list.map(item => (
<List.Item key={item.id}>
<Card
cover={<img alt={item.title} src={item.cover} />}
>
<Card.Meta
title={item.title}
description={item.subDescription}
/>
<div className={styles.cardItemContent}>
<span>{moment(item.updatedAt).fromNow()}</span>
<div className={styles.avatarList}>
<AvatarList size="small">
{
item.members.map((member, i) => (
<AvatarList.Item
key={`${item.id}-avatar-${i}`}
src={member.avatar}
tips={member.name}
/>
))
}
</AvatarList>
</div>
dataSource={list}
renderItem={item => (
<List.Item>
<Card
cover={<img alt={item.title} src={item.cover} />}
>
<Card.Meta
title={item.title}
description={item.subDescription}
/>
<div className={styles.cardItemContent}>
<span>{moment(item.updatedAt).fromNow()}</span>
<div className={styles.avatarList}>
<AvatarList size="small">
{
item.members.map((member, i) => (
<AvatarList.Item
key={`${item.id}-avatar-${i}`}
src={member.avatar}
tips={member.name}
/>
))
}
</AvatarList>
</div>
</Card>
</List.Item>
))
}
</List>
</div>
</Card>
</List.Item>
)}
/>
) : null;
const tabList = [
......
......@@ -195,36 +195,35 @@ export default class FilterCardList extends PureComponent {
</Form>
</Card>
<List
rowKey="id"
style={{ marginTop: 16 }}
grid={{ gutter: 16, xl: 4, lg: 3, md: 3, sm: 2, xs: 1 }}
loading={loading}
>
{
list && list.map(item => (
<List.Item key={item.id}>
<Card
actions={[
<Tooltip title="ๅคๅˆถ"><Icon type="copy" /></Tooltip>,
<Tooltip title="็”จๆˆท"><Icon type="solution" /></Tooltip>,
<Tooltip title="่ฎพ็ฝฎ"><Icon type="setting" /></Tooltip>,
<Tooltip title="ๅˆ ้™ค"><Icon type="delete" /></Tooltip>,
]}
>
<Card.Meta
avatar={<Avatar size="large" src={item.avatar} />}
title={item.title}
dataSource={list}
renderItem={item => (
<List.Item key={item.id}>
<Card
actions={[
<Tooltip title="ๅคๅˆถ"><Icon type="copy" /></Tooltip>,
<Tooltip title="็”จๆˆท"><Icon type="solution" /></Tooltip>,
<Tooltip title="่ฎพ็ฝฎ"><Icon type="setting" /></Tooltip>,
<Tooltip title="ๅˆ ้™ค"><Icon type="delete" /></Tooltip>,
]}
>
<Card.Meta
avatar={<Avatar size="large" src={item.avatar} />}
title={item.title}
/>
<div className={styles.cardItemContent}>
<CardInfo
activeUser={formatWan(item.activeUser)}
newUser={numeral(item.newUser).format('0,0')}
/>
<div className={styles.cardItemContent}>
<CardInfo
activeUser={formatWan(item.activeUser)}
newUser={numeral(item.newUser).format('0,0')}
/>
</div>
</Card>
</List.Item>
))
}
</List>
</div>
</Card>
</List.Item>
)}
/>
</div>
</PageHeaderLayout>
);
......
......@@ -2,7 +2,7 @@ import React, { Component } from 'react';
import moment from 'moment';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import { Form, Card, Select, List, Tag, Icon, Avatar, Row, Col } from 'antd';
import { Form, Card, Select, List, Tag, Icon, Avatar, Row, Col, Button } from 'antd';
import PageHeaderLayout from '../../layouts/PageHeaderLayout';
import StandardFormRow from '../../components/StandardFormRow';
......@@ -90,7 +90,7 @@ export default class SearchList extends Component {
render() {
const { showLoadMore, loadingMore } = this.state;
const { form, list: { list } } = this.props;
const { form, list: { list, loading } } = this.props;
const { getFieldDecorator } = form;
const owners = [
......@@ -161,6 +161,15 @@ export default class SearchList extends Component {
},
};
const loadMore = showLoadMore ? (
<div style={{ textAlign: 'center', marginTop: 8 }}>
<Button onClick={this.handleLoadMore}>
{loadingMore && (<span><Icon type="loading" /> ๅŠ ่ฝฝไธญ...</span>)}
{!loadingMore && (<span>ๅŠ ่ฝฝๆ›ดๅคš</span>)}
</Button>
</div>
) : null;
return (
<PageHeaderLayout
title="ๆœ็ดขๅˆ—่กจ"
......@@ -264,27 +273,25 @@ export default class SearchList extends Component {
</Card>
<Card style={{ marginTop: 16 }} bordered={false}>
<List
loadingMore={loadingMore}
showLoadMore={(list.length > 0) && showLoadMore}
onLoadMore={this.handleLoadMore}
loading={loading}
rowKey="id"
itemLayout="vertical"
>
{
list && list.map(item => (
<List.Item
key={item.id}
actions={[<IconText type="star-o" text={item.star} />, <IconText type="like-o" text={item.like} />, <IconText type="message" text={item.message} />]}
extra={<div className={styles.listItemExtra} />}
>
<List.Item.Meta
title={<a href={item.href}>{item.title}</a>}
description={<span><Tag>Ant Design</Tag><Tag>่ฎพ่ฎก่ฏญ่จ€</Tag><Tag>่š‚่š้‡‘ๆœ</Tag></span>}
/>
<ListContent data={item} />
</List.Item>
))
}
</List>
loadMore={loadMore}
dataSource={list}
renderItem={item => (
<List.Item
key={item.id}
actions={[<IconText type="star-o" text={item.star} />, <IconText type="like-o" text={item.like} />, <IconText type="message" text={item.message} />]}
extra={<div className={styles.listItemExtra} />}
>
<List.Item.Meta
title={<a href={item.href}>{item.title}</a>}
description={<span><Tag>Ant Design</Tag><Tag>่ฎพ่ฎก่ฏญ่จ€</Tag><Tag>่š‚่š้‡‘ๆœ</Tag></span>}
/>
<ListContent data={item} />
</List.Item>
)}
/>
</Card>
</div>
</PageHeaderLayout>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment