Skip to content

Commit 7bc0ae7

Browse files
mydearxymmydearxym
committed
refactor(misc): user table improve & debug with server seeds
1 parent 63fe907 commit 7bc0ae7

File tree

17 files changed

+310
-203
lines changed

17 files changed

+310
-203
lines changed

‎components/UsersTable/index.js‎

Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
/*
2+
*
3+
* UsersTable
4+
*
5+
*/
6+
7+
import React from 'react'
8+
import PropTypes from 'prop-types'
9+
import { Table } from 'antd'
10+
11+
import Pagi from '../Pagi'
12+
import { TableLoading } from '../LoadingEffects'
13+
import MaybeCell from '../MaybeCell'
14+
import UserCell from '../UserCell'
15+
import TimeStampCell from '../TimeStampCell'
16+
import { makeDebugger } from '../../utils'
17+
18+
import PermissionCell from '../PermissionCell'
19+
import SexCell from '../SexCell'
20+
21+
// import { Wrapper } from './styles'
22+
23+
/* eslint-disable no-unused-vars */
24+
const debug = makeDebugger('c:UsersTable:index')
25+
/* eslint-enable no-unused-vars */
26+
27+
class UsersTable extends React.PureComponent {
28+
columns() {
29+
const { cmsPermisstionOnChange } = this.props
30+
31+
return [
32+
{
33+
title: 'id',
34+
dataIndex: 'id',
35+
align: 'center',
36+
fixed: 'left',
37+
width: 80,
38+
},
39+
{
40+
title: '头像',
41+
width: 180,
42+
dataIndex: '',
43+
align: 'center',
44+
fixed: 'left',
45+
render: record => {
46+
const user = { nickname: record.nickname, avatar: record.avatar }
47+
return <UserCell user={user} left="20px" />
48+
},
49+
},
50+
{
51+
title: '关注社区',
52+
dataIndex: 'subscribedCommunitiesCount',
53+
align: 'center',
54+
width: 150,
55+
},
56+
{
57+
title: 'bio',
58+
dataIndex: 'bio',
59+
align: 'center',
60+
width: 380,
61+
render: text => {
62+
return <div style={{ textAlign: 'left' }}>{text}</div>
63+
},
64+
},
65+
{
66+
title: 'sex',
67+
dataIndex: 'sex',
68+
align: 'center',
69+
width: 80,
70+
render: text => {
71+
return <SexCell sex={text} />
72+
},
73+
},
74+
{
75+
title: 'cms权限',
76+
dataIndex: 'cmsPassportString',
77+
align: 'center',
78+
width: 200,
79+
render: (text, record) => (
80+
<PermissionCell source={record} onMutate={cmsPermisstionOnChange} />
81+
),
82+
},
83+
{
84+
title: 'email',
85+
dataIndex: 'email',
86+
align: 'center',
87+
width: 100,
88+
render: text => <MaybeCell text={text} />,
89+
},
90+
{
91+
title: 'qq',
92+
dataIndex: 'qq',
93+
align: 'center',
94+
width: 100,
95+
render: text => <MaybeCell text={text} />,
96+
},
97+
{
98+
title: 'weixin',
99+
dataIndex: 'weixin',
100+
align: 'center',
101+
width: 150,
102+
render: text => <MaybeCell text={text} />,
103+
},
104+
{
105+
title: 'weibo',
106+
dataIndex: 'weibo',
107+
align: 'center',
108+
width: 100,
109+
render: text => <MaybeCell text={text} />,
110+
},
111+
{
112+
title: '位置',
113+
dataIndex: 'location',
114+
align: 'center',
115+
width: 220,
116+
render: text => <MaybeCell text={text} />,
117+
},
118+
{
119+
title: '时间戳',
120+
width: 120,
121+
align: 'center',
122+
render: (text, record) => <TimeStampCell data={record} />,
123+
},
124+
]
125+
}
126+
127+
render() {
128+
const { data, loading, pageChange } = this.props
129+
130+
return (
131+
<React.Fragment>
132+
{data ? (
133+
<React.Fragment>
134+
<Table
135+
columns={this.columns()}
136+
dataSource={data.entries}
137+
scroll={{ x: 2200 }}
138+
loading={TableLoading(loading)}
139+
pagination={false}
140+
/>
141+
<Pagi
142+
left="-10px"
143+
pageNumber={data.pageNumber}
144+
pageSize={data.pageSize}
145+
totalCount={data.totalCount}
146+
onChange={pageChange}
147+
/>
148+
</React.Fragment>
149+
) : null}
150+
</React.Fragment>
151+
)
152+
}
153+
}
154+
155+
UsersTable.propTypes = {
156+
data: PropTypes.any.isRequired,
157+
loading: PropTypes.bool,
158+
pageChange: PropTypes.func,
159+
cmsPermisstionOnChange: PropTypes.func,
160+
}
161+
162+
UsersTable.defaultProps = {
163+
loading: false,
164+
pageChange: debug,
165+
cmsPermisstionOnChange: debug,
166+
}
167+
168+
export default UsersTable

‎components/UsersTable/styles/index.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import styled from 'styled-components'
2+
3+
// import Img from '../../Img'
4+
// import { theme } from '../../../utils'
5+
6+
export const Wrapper = styled.div``
7+
export const Title = styled.div``

‎components/UsersTable/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 UsersTable from '../index'
5+
6+
describe('TODO <UsersTable />', () => {
7+
it('Expect to have unit tests specified', () => {
8+
expect(true).toEqual(true)
9+
})
10+
})

‎containers/CommunitiesContent/IndexContent.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ const columns = [
102102
},
103103
{
104104
title: '时间戳',
105-
width: 120,
105+
width: 140,
106106
align: 'center',
107107
render: (text, record) => <TimeStampCell data={record} />,
108108
},

‎containers/CommunityContent/UsersContent.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+
3+
import UsersTable from '../../components/UsersTable'
4+
// import * as logic from './logic'
5+
6+
const UsersContent = ({ data, restProps: { usersLoading } }) => (
7+
<UsersTable data={data} loading={usersLoading} />
8+
)
9+
10+
export default UsersContent

‎containers/CommunityContent/index.js‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import TagsContent from './TagsContent'
1717
import VideosContent from './VideosContent'
1818
import ReposContent from './ReposContent'
1919
import ThreadsContent from './ThreadsContent'
20+
import UsersContent from './UsersContent'
2021

2122
import { Wrapper } from './styles'
2223
import * as logic from './logic'
@@ -33,6 +34,7 @@ const ChildContent = ({
3334
pagedReposData,
3435
pagedTagsData,
3536
pagedThreadsData,
37+
pagedSubscribersData,
3638
restProps,
3739
}) => {
3840
switch (curRoute.subPath) {
@@ -54,6 +56,9 @@ const ChildContent = ({
5456
case ROUTE.THREADS: {
5557
return <ThreadsContent data={pagedThreadsData} restProps={restProps} />
5658
}
59+
case ROUTE.SUBSCRIBERS: {
60+
return <UsersContent data={pagedSubscribersData} restProps={restProps} />
61+
}
5762
case ROUTE.EDITORS: {
5863
return <h2>Editors Content</h2>
5964
}
@@ -83,10 +88,10 @@ class CommunityContentContainer extends React.Component {
8388
pagedReposData,
8489
pagedTagsData,
8590
pagedThreadsData,
91+
pagedSubscribersData,
8692
} = communityContent
8793
const restProps = { ...communityContent }
8894

89-
console.log('hello hello activeCommunityData: ', pagedThreadsData)
9095
return (
9196
<Wrapper>
9297
<ChildContent
@@ -97,6 +102,7 @@ class CommunityContentContainer extends React.Component {
97102
pagedReposData={pagedReposData}
98103
pagedTagsData={pagedTagsData}
99104
pagedThreadsData={pagedThreadsData}
105+
pagedSubscribersData={pagedSubscribersData}
100106
restProps={restProps}
101107
/>
102108
</Wrapper>

‎containers/CommunityContent/logic.js‎

Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,20 @@ export function loadRepos(page = 1) {
6464
sr71$.query(S.pagedRepos, commonFilter(page, community))
6565
}
6666

67+
export function loadSubscribers(page = 1) {
68+
scrollIntoEle(TYPE.APP_HEADER_ID)
69+
store.markState({ usersLoading: true })
70+
71+
const size = PAGE_SIZE.D
72+
const args = {
73+
id: store.activeCommunity.id,
74+
filter: { page, size },
75+
}
76+
console.log('preview args: ', args)
77+
78+
sr71$.query(S.communitySubscribers, args)
79+
}
80+
6781
export function loadTags() {
6882
scrollIntoEle(TYPE.APP_HEADER_ID)
6983
store.markState({ tagsLoading: true })
@@ -86,6 +100,7 @@ const cancleLoading = () => {
86100
videosLoading: false,
87101
reposLoading: false,
88102
tagsLoading: false,
103+
usersLoading: false,
89104
})
90105
}
91106

@@ -97,6 +112,15 @@ const DataSolver = [
97112
store.markState({ pagedPosts })
98113
},
99114
},
115+
{
116+
match: asyncRes('communitySubscribers'),
117+
action: ({ communitySubscribers: pagedSubscribers }) => {
118+
cancleLoading()
119+
console.log('communitySubscribers get: ', pagedSubscribers)
120+
121+
store.markState({ pagedSubscribers })
122+
},
123+
},
100124
{
101125
match: asyncRes('pagedJobs'),
102126
action: ({ pagedJobs }) => {
@@ -150,8 +174,11 @@ const DataSolver = [
150174
case ROUTE.VIDEOS: {
151175
return loadVideos()
152176
}
177+
case ROUTE.SUBSCRIBERS: {
178+
return loadSubscribers()
179+
}
153180
default: {
154-
return console.log('todo')
181+
return console.log('todo: ', subPath)
155182
}
156183
}
157184
},

‎containers/CommunityContent/schema.js‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import gql from 'graphql-tag'
2-
import { P } from '../schemas'
2+
import { P, F } from '../schemas'
33

44
const communities = gql`
55
query communities($filter: PagedFilter!) {
@@ -22,6 +22,17 @@ const communities = gql`
2222
}
2323
`
2424

25+
const communitySubscribers = gql`
26+
query($id: ID!, $filter: PagedFilter!) {
27+
communitySubscribers(id: $id, filter: $filter) {
28+
entries {
29+
${F.user}
30+
}
31+
${F.pagedCounts}
32+
}
33+
}
34+
`
35+
2536
const pagedCategories = gql`
2637
${P.pagedCategories}
2738
`
@@ -54,6 +65,7 @@ const schema = {
5465
pagedJobs,
5566
pagedRepos,
5667
pagedVideos,
68+
communitySubscribers,
5769
}
5870

5971
export default schema

‎containers/CommunityContent/store.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {
1111
PagedJobs,
1212
PagedRepos,
1313
PagedVideos,
14+
PagedUsers,
1415
Tag,
1516
PagedThreads,
1617
PagedCategories,
@@ -33,12 +34,15 @@ const CommunityContentStore = t
3334
pagedTags: t.optional(t.array(Tag), []),
3435
pagedThreads: t.optional(PagedThreads, emptyPagiData),
3536

37+
pagedSubscribers: t.optional(PagedUsers, emptyPagiData),
38+
3639
tagsLoading: t.optional(t.boolean, false),
3740
categoriesLoading: t.optional(t.boolean, false),
3841
postsLoading: t.optional(t.boolean, false),
3942
jobsLoading: t.optional(t.boolean, false),
4043
reposLoading: t.optional(t.boolean, false),
4144
videosLoading: t.optional(t.boolean, false),
45+
usersLoading: t.optional(t.boolean, false),
4246
})
4347
.views(self => ({
4448
get root() {
@@ -69,6 +73,12 @@ const CommunityContentStore = t
6973
get pagedThreadsData() {
7074
return { entries: self.root.sidebar.activeCommunityData.threads }
7175
},
76+
get pagedSubscribersData() {
77+
return stripMobx(self.pagedSubscribers)
78+
},
79+
get activeCommunity() {
80+
return self.root.sidebar.activeCommunityData
81+
},
7282
}))
7383
.actions(self => ({
7484
markState(sobj) {

‎containers/Sidebar/MenuList.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ const MenuList = ({
2424
/>
2525
<UsersRootMenuItem
2626
activeRaw={activeRaw}
27+
community={activeCommunityData}
2728
activeThread={activeThread}
2829
countsInfo={countsInfo}
2930
/>

0 commit comments

Comments
 (0)