Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit7329aff

Browse files
authored
refactor: adjust UsersThread (#1145)
1 parentd1283cc commit7329aff

File tree

12 files changed

+122
-112
lines changed

12 files changed

+122
-112
lines changed

‎src/components/TabBar/alias.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { TTabItem } from '@/spec'
44

55
constalias={
66
home:{
7-
user:'C友',
7+
user:'CPer',
88
},
99
javascript:{
1010
user:'JSer',

‎src/containers/content/CommunityContent/styles/classic_layout.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { WIDTH } from '@/utils/css/metric'
77
import{BaseWrapper,BaseInnerWrapper,BaseContentWrapper}from'./index'
88

99
exportconstWrapper=styled(BaseWrapper)`
10-
${css.flexColumn('align-both')};
10+
${css.flexColumn('justify-start','align-center')};
1111
`
1212
exportconstInnerWrapper=styled(BaseInnerWrapper)`
1313
${css.flexColumn()};

‎src/containers/thread/UsersThread/GeoMap.js‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,10 @@ import uid from '@/utils/uid'
55
import{buildLog}from'@/utils/logger'
66

77
import{Br}from'@/components/Common'
8+
importNoticeBarfrom'@/components/NoticeBar'
89
importfetchGeoDatafrom'./geo_data'
910

10-
import{MapWrapper}from'./styles'
11+
import{MapWrapper,RealMap,NoticeWrapper}from'./styles'
1112

1213
// TODO import it globaly, g2 is too big to load in time (> 400KB)
1314
// import G2 from 'g2'
@@ -171,8 +172,11 @@ class LocationMap extends React.Component {
171172
querySelector={`#${this.chartId}`}
172173
onResize={(width)=>this.onResize(width)}
173174
/>
174-
<divid={this.chartId}/>
175-
<Brbottom={10}/>
175+
<RealMapid={this.chartId}/>
176+
<NoticeWrapper>
177+
上图显示数据为本站已注册用户在中国境内的分布范围，数据由 IP
178+
地址根据第三方地图服务商获得，仅供参考。
179+
</NoticeWrapper>
176180
</MapWrapper>
177181
)
178182
}
Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
importReactfrom'react'
1+
import{FC,memo}from'react'
22

33
import{ICON_CMD}from'@/config'
44
import{Wrapper,LoadingIcon,Title,Desc}from'./styles/map_loading'
55

6-
constMapLoading=()=>(
6+
constMapLoading:FC=()=>(
77
<Wrapper>
88
<LoadingIconsrc={`${ICON_CMD}/geo_map.svg`}/>
99
<Title>正在加载, 请稍等</Title>
1010
<Desc>如果长时间未加载，请尝试刷新页面</Desc>
1111
</Wrapper>
1212
)
1313

14-
exportdefaultReact.memo(MapLoading)
14+
exportdefaultmemo(MapLoading)

‎src/containers/thread/UsersThread/NumDashboard.js‎

Lines changed: 0 additions & 62 deletions
This file was deleted.
Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import{FC,memo}from'react'
2+
import{sort,isEmpty}from'ramda'
3+
4+
importCustomScrollerfrom'@/components/CustomScroller'
5+
// import { ICON_CMD } from '../../config'
6+
importDotDividerfrom'@/components/DotDivider'
7+
8+
import{
9+
Wrapper,
10+
SumWrapper,
11+
DetailText,
12+
DashItem,
13+
Divider,
14+
Title,
15+
Num,
16+
Chart,
17+
ChartBar,
18+
}from'./styles/num_dashboard'
19+
20+
typeTMarker={
21+
city:string
22+
value:number
23+
long:number
24+
lant:number
25+
}
26+
27+
exportconstsortByValue=(source:TMarker[]):TMarker[]=>
28+
sort((a,b)=>b.value-a.value,source)
29+
30+
typeTProps={
31+
total:number
32+
geoData:TMarker[]
33+
}
34+
35+
constNumDashboard:FC<TProps>=({ total, geoData})=>{
36+
if(isEmpty(geoData))returnnull
37+
38+
constsortGeo=sortByValue(geoData)||[]
39+
constmaxValue=sortGeo[0].value||0
40+
41+
return(
42+
<Wrapper>
43+
{/* <SumWrapper>
44+
总人数: {total} <DotDivider />{' '}
45+
</SumWrapper> */}
46+
<CustomScroller
47+
direction="vertical"
48+
height="200px"
49+
showShadow={false}
50+
autoHide
51+
>
52+
{sortGeo.map((item,idx)=>(
53+
<divkey={item.value+item.city}>
54+
<DashItem>
55+
<Titleactive={idx<=2}>{item.city}</Title>
56+
{/* <DotDivider radius={3} space={3} />
57+
<Num>{item.value}人</Num> */}
58+
<Chart>
59+
<ChartBar
60+
width={`${Math.floor((item.value/maxValue)*100)}%`}
61+
active={idx<=2}
62+
/>
63+
</Chart>
64+
</DashItem>
65+
<Dividershow={idx===2}/>
66+
</div>
67+
))}
68+
</CustomScroller>
69+
</Wrapper>
70+
)
71+
}
72+
73+
exportdefaultmemo(NumDashboard)

‎src/containers/thread/UsersThread/RealMap.tsx‎

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -25,30 +25,22 @@ type TProps = {
2525
usersThread?:TStore
2626
}
2727

28-
constUsersThreadContainer:FC<TProps>=({ usersThread})=>{
28+
constUsersThreadContainer:FC<TProps>=({usersThread:store})=>{
2929
/* load g2 from CDN, it's too big for dynamic import, and i am poor ..' */
3030
const[g2ScriptLoaded]=useScript(
3131
'https://a.alipayobjects.com/g/datavis/g2/2.3.13/index.js',
3232
)
3333

34-
useInit(usersThread)
34+
useInit(store)
3535
consttheme=useTheme()
3636

37-
const{
38-
geoInfosData,
39-
geoDataLoading,
40-
curCommunity,
41-
curTheme,
42-
showNums,
43-
}=usersThread
44-
37+
const{ geoInfosData, geoDataLoading, curCommunity, curTheme}=store
4538
constready=g2ScriptLoaded&&!geoDataLoading
4639

4740
return(
4841
<Fragment>
4942
{ready&&(
5043
<NumDashboard
51-
expand={showNums}
5244
total={curCommunity.subscribersCount}
5345
geoData={geoInfosData}
5446
/>
File renamed without changes.

‎src/containers/thread/UsersThread/logic.js‎renamed to ‎src/containers/thread/UsersThread/logic.ts‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,26 +4,25 @@ import { ERR } from '@/constant'
44
importasyncSuitfrom'@/utils/async'
55
import{errRescue}from'@/utils/helper'
66
import{buildLog}from'@/utils/logger'
7+
78
importSfrom'./schema'
9+
importtype{TStore}from'./store'
810

911
/* eslint-disable-next-line */
1012
constlog=buildLog('L:UsersThread')
1113

1214
const{SR71, $solver, asyncRes, asyncErr}=asyncSuit
1315
constsr71$=newSR71()
1416

17+
letstore:TStore|undefined
1518
letsub$=null
16-
letstore=null
1719

18-
exportconstloadGeoData=()=>{
20+
exportconstloadGeoData=():void=>{
1921
markLoading(true)
2022
const{ id}=store.curCommunity
2123
sr71$.query(S.communityGeoInfo,{ id})
2224
}
2325

24-
exportconstToggleNumBashboard=()=>
25-
store.mark({showNums:!store.showNums})
26-
2726
constmarkLoading=(maybe=true)=>store.mark({geoDataLoading:maybe})
2827
// ###############################
2928
// Data & Error handlers
@@ -62,15 +61,15 @@ const ErrSolver = [
6261
// ###############################
6362
// init & uninit
6463
// ###############################
65-
exportconstuseInit=(_store)=>{
64+
exportconstuseInit=(_store:TStore)=>{
6665
useEffect(()=>{
6766
store=_store
6867

6968
sub$=sr71$.data().subscribe($solver(DataSolver,ErrSolver))
7069
loadGeoData()
7170

7271
return()=>{
73-
if(store.geoDataLoading)returnfalse
72+
if(store.geoDataLoading)return
7473
log('===== do uninit')
7574
sr71$.stop()
7675
sub$.unsubscribe()

‎src/containers/thread/UsersThread/store.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ const UsersThread = T.model('UsersThread', {
1919
geoInfos:T.optional(T.array(Geo),[]),
2020
geoDataLoading:T.optional(T.boolean,false),
2121
// { city: '成都', value: 1, long: 104.06, lant: 30.67 }
22-
showNums:T.optional(T.boolean,false),
2322
})
2423
.views((self)=>({
2524
getcurTheme():TTheme{

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp