Skip to content
This repository was archived by the owner on Nov 1, 2021. It is now read-only.

Commit 63fe907

Browse files
mydearxymmydearxym
committed
refactor: threads table to community table
1 parent 7f43729 commit 63fe907

File tree

16 files changed

+234
-141
lines changed

16 files changed

+234
-141
lines changed

‎components/Pagi/index.js‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -71,9 +71,9 @@ const Pagi = ({
7171
}
7272

7373
Pagi.propTypes = {
74-
pageNumber: PropTypes.number.isRequired,
75-
pageSize: PropTypes.number.isRequired,
76-
totalCount: PropTypes.number.isRequired,
74+
pageNumber: PropTypes.number,
75+
pageSize: PropTypes.number,
76+
totalCount: PropTypes.number,
7777
// showBottomMsg: PropTypes.bool,
7878
emptyMsg: PropTypes.string,
7979
noMoreMsg: PropTypes.string,
@@ -86,6 +86,10 @@ Pagi.propTypes = {
8686
}
8787

8888
Pagi.defaultProps = {
89+
pageNumber: 1,
90+
pageSize: 20,
91+
totalCount: 0,
92+
8993
emptyMsg: '还没有评论',
9094
noMoreMsg: '没有更多评论了',
9195
showBottomMsg: false,

‎components/ThreadsTable/index.js‎

Lines changed: 145 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
/*
2+
*
3+
* ThreadsTable
4+
*
5+
*/
6+
7+
import React from 'react'
8+
import PropTypes from 'prop-types'
9+
import { Table, Button } from 'antd'
10+
11+
import Pagi from '../Pagi'
12+
import { TableLoading } from '../LoadingEffects'
13+
import { Space } from '../BaseStyled'
14+
15+
import { OperationWrapper } from './styles'
16+
17+
import { makeDebugger, Trans } from '../../utils'
18+
19+
/* eslint-disable no-unused-vars */
20+
const debug = makeDebugger('c:ThreadsTable:index')
21+
/* eslint-enable no-unused-vars */
22+
23+
class ThreadsTable extends React.PureComponent {
24+
columns() {
25+
const {
26+
/*
27+
setCommunity,
28+
unsetCommunity,
29+
unsetTag,
30+
setTag,
31+
*/
32+
onEdit,
33+
onDelete,
34+
} = this.props
35+
36+
return [
37+
{
38+
title: 'id',
39+
dataIndex: 'id',
40+
align: 'center',
41+
width: 80,
42+
},
43+
{
44+
title: '标题',
45+
width: 300,
46+
dataIndex: 'title',
47+
align: 'center',
48+
render: text => (
49+
<div>
50+
{Trans(text)}({text})
51+
</div>
52+
),
53+
},
54+
{
55+
title: 'raw',
56+
width: 200,
57+
dataIndex: 'raw',
58+
align: 'center',
59+
},
60+
{
61+
title: '操作',
62+
width: 200,
63+
dataIndex: '',
64+
align: 'center',
65+
render: (text, record) => (
66+
<OperationWrapper>
67+
<Button
68+
size="small"
69+
type="primary"
70+
ghost
71+
onClick={onEdit.bind(this, record)}
72+
>
73+
编辑
74+
</Button>
75+
<Space right="10px" />
76+
<Button
77+
size="small"
78+
type="red"
79+
ghost
80+
onClick={onDelete.bind(this, record)}
81+
>
82+
删除
83+
</Button>
84+
</OperationWrapper>
85+
),
86+
},
87+
]
88+
}
89+
90+
render() {
91+
const { data, loading, pageChange } = this.props
92+
93+
return (
94+
<React.Fragment>
95+
{data ? (
96+
<div>
97+
<Table
98+
columns={this.columns()}
99+
dataSource={data.entries}
100+
scroll={{ x: 2000 }}
101+
loading={TableLoading(loading)}
102+
pagination={false}
103+
/>
104+
<Pagi
105+
left="-10px"
106+
pageNumber={data.pageNumber}
107+
pageSize={data.pageSize}
108+
totalCount={data.totalCount}
109+
onChange={pageChange}
110+
/>
111+
</div>
112+
) : null}
113+
</React.Fragment>
114+
)
115+
}
116+
}
117+
118+
ThreadsTable.propTypes = {
119+
data: PropTypes.any.isRequired,
120+
loading: PropTypes.bool,
121+
pageChange: PropTypes.func,
122+
/*
123+
setCommunity: PropTypes.func,
124+
unsetCommunity: PropTypes.func,
125+
unsetTag: PropTypes.func,
126+
setTag: PropTypes.func,
127+
*/
128+
onEdit: PropTypes.func,
129+
onDelete: PropTypes.func,
130+
}
131+
132+
ThreadsTable.defaultProps = {
133+
loading: false,
134+
pageChange: debug,
135+
/*
136+
setCommunity: debug,
137+
unsetCommunity: debug,
138+
unsetTag: debug,
139+
setTag: debug,
140+
*/
141+
onEdit: debug,
142+
onDelete: debug,
143+
}
144+
145+
export default ThreadsTable

‎components/ThreadsTable/styles/index.js‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import styled from 'styled-components'
2+
3+
import { Img } from '../..'
4+
import { theme } from '../../../utils'
5+
6+
export const Wrapper = styled.div`
7+
min-height: 800px;
8+
`
9+
export const CommunityIcon = styled(Img)`
10+
fill: ${theme('banner.title')};
11+
width: 30px;
12+
height: 30px;
13+
`
14+
export const OperationWrapper = styled.div`
15+
display: flex;
16+
justify-content: center;
17+
`

‎components/ThreadsTable/tests/index.test.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// import React from 'react'
2+
// import { shallow } from 'enzyme'
3+
4+
// import ThreadsTable from '../index'
5+
6+
describe('TODO <ThreadsTable />', () => {
7+
it('Expect to have unit tests specified', () => {
8+
expect(true).toEqual(true)
9+
})
10+
})

‎containers/CommunitiesContent/ThreadsContent.js‎

Lines changed: 10 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,16 @@
11
import React from 'react'
22

3-
import { Pagi, Table, TableLoading } from '../../components'
3+
import ThreadsTable from '../../components/ThreadsTable'
44

5-
/* import { OperationWrapper } from './styles' */
6-
import { Trans } from '../../utils'
7-
import * as logic from './logic'
5+
// import * as logic from './logic'
86

9-
/* eslint-disable react/display-name */
10-
const columns = [
11-
{
12-
title: 'id',
13-
dataIndex: 'id',
14-
align: 'center',
15-
width: 80,
16-
},
17-
{
18-
title: '标题',
19-
width: 300,
20-
dataIndex: 'title',
21-
align: 'center',
22-
render: text => (
23-
<div>
24-
{Trans(text)}({text})
25-
</div>
26-
),
27-
},
28-
{
29-
title: 'raw',
30-
width: 200,
31-
dataIndex: 'raw',
32-
align: 'center',
33-
},
34-
/*
35-
{
36-
title: '操作',
37-
width: 200,
38-
dataIndex: '',
39-
align: 'center',
40-
render: (text, record) => {
41-
return (
42-
<OperationWrapper>
43-
<Button
44-
size="small"
45-
type="primary"
46-
ghost
47-
onClick={logic.onEdit.bind(this, record)}
48-
>
49-
编辑
50-
</Button>
51-
<Space right="10px" />
52-
<Button
53-
size="small"
54-
type="red"
55-
ghost
56-
onClick={logic.onDelete.bind(this, record)}
57-
>
58-
删除
59-
</Button>
60-
</OperationWrapper>
61-
)
62-
},
63-
},
64-
*/
65-
]
66-
67-
const ThreadsContent = ({ data, restProps: { communitiesLoading } }) => (
68-
<React.Fragment>
69-
{data ? (
70-
<div>
71-
<Table
72-
columns={columns}
73-
dataSource={data.entries}
74-
scroll={{ x: 2000 }}
75-
loading={TableLoading(communitiesLoading)}
76-
pagination={false}
77-
/>
78-
<Pagi
79-
left="-10px"
80-
pageNumber={data.pageNumber}
81-
pageSize={data.pageSize}
82-
totalCount={data.totalCount}
83-
onChange={logic.loadJobs}
84-
/>
85-
</div>
86-
) : null}
87-
</React.Fragment>
7+
const ReposContent = ({ data, restProps: { threadsLoading } }) => (
8+
<ThreadsTable
9+
data={data}
10+
loading={threadsLoading}
11+
onDelete={console.log}
12+
onEdit={console.log}
13+
/>
8814
)
8915

90-
export default ThreadsContent
16+
export default ReposContent

‎containers/CommunityBanner/index.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ const ChildBanner = ({
3333
videosTotalCount,
3434
reposTotalCount,
3535
tagsTotalCount,
36+
threadsTotalCount,
3637
restProps,
3738
}) => {
3839
const {
@@ -87,7 +88,7 @@ const ChildBanner = ({
8788
)
8889
}
8990
case ROUTE.THREADS: {
90-
return <ThreadsBanner totalCount={301} filteredCount={100} />
91+
return <ThreadsBanner totalCount={threadsTotalCount} />
9192
}
9293
default: {
9394
return <h2>Index of Community</h2>
@@ -110,6 +111,7 @@ class CommunityBannerContainer extends React.Component {
110111
videosTotalCount,
111112
reposTotalCount,
112113
tagsTotalCount,
114+
threadsTotalCount,
113115
} = communityBanner
114116

115117
return (
@@ -121,6 +123,7 @@ class CommunityBannerContainer extends React.Component {
121123
videosTotalCount={videosTotalCount}
122124
reposTotalCount={reposTotalCount}
123125
tagsTotalCount={tagsTotalCount}
126+
threadsTotalCount={threadsTotalCount}
124127
restProps={stripMobx(communityBanner)}
125128
/>
126129
</BannerContainer>

‎containers/CommunityBanner/store.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,9 @@ const CommunityBannerStore = t
3939
get tagsTotalCount() {
4040
return self.root.communityContent.pagedTags.length
4141
},
42+
get threadsTotalCount() {
43+
return self.root.sidebar.activeCommunityData.threads.length
44+
},
4245
get curRoute() {
4346
const { mainPath, subPath } = self.root.route
4447
return {

‎containers/CommunityContent/ThreadsContent.js‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React from 'react'
2+
3+
import ThreadsTable from '../../components/ThreadsTable'
4+
5+
// import { OperationWrapper } from './styles'
6+
// import * as logic from './logic'
7+
8+
/* eslint-disable react/display-name */
9+
const PostsContent = ({ data, restProps: { threadsLoading } }) => (
10+
<ThreadsTable
11+
data={data}
12+
loading={threadsLoading}
13+
onDelete={console.log}
14+
onEdit={console.log}
15+
/>
16+
)
17+
18+
export default PostsContent

0 commit comments

Comments
 (0)