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.

Commitea9e2f3

Browse files
committed
Merge branch 'billing' into dev
2 parents728ddff +95c13a7 commitea9e2f3

File tree

17 files changed

+377
-133
lines changed

17 files changed

+377
-133
lines changed

‎components/SectionLabel/index.js‎

Lines changed: 5 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -18,33 +18,20 @@ import {
1818
Desc,
1919
Divider,
2020
LabelIcon,
21-
AdderWrapper,
22-
AdderText,
23-
AdderIcon,
21+
AddonWrapper,
2422
}from'./styles'
2523

2624
import{makeDebugger}from'../../utils'
2725
/* eslint-disable no-unused-vars */
2826
constdebug=makeDebugger('c:SectionLabel:index')
2927
/* eslint-enable no-unused-vars */
3028

31-
constSectionLabel=({
32-
title,
33-
iconSrc,
34-
desc,
35-
node,
36-
withAdder,
37-
onAdd,
38-
adderText,
39-
})=>(
29+
constSectionLabel=({ title, iconSrc, desc, node, addonNode})=>(
4030
<Wrapper>
4131
<Label>
4232
<LabelIconsrc={iconSrc}/>
4333
<Title>{title}</Title>
44-
<AdderWrappershow={withAdder}onClick={onAdd}>
45-
<AdderIconsrc={`${ICON_CMD}/add_circle.svg`}/>
46-
<AdderText>{adderText}</AdderText>
47-
</AdderWrapper>
34+
<AddonWrappershow={addonNode!==''}>{addonNode}</AddonWrapper>
4835
</Label>
4936
<Divider/>
5037
<Maybetest={desc}>
@@ -62,18 +49,14 @@ SectionLabel.propTypes = {
6249
iconSrc:PropTypes.string,
6350
desc:PropTypes.string,
6451
node:PropTypes.oneOfType([PropTypes.string,PropTypes.node]),
65-
withAdder:PropTypes.bool,
66-
onAdd:PropTypes.func,
67-
adderText:PropTypes.string,
52+
addonNode:PropTypes.oneOfType([PropTypes.string,PropTypes.node]),
6853
}
6954

7055
SectionLabel.defaultProps={
7156
iconSrc:`${ICON_CMD}/setting_theme.svg`,
7257
desc:'',
7358
node:'',
74-
withAdder:false,
75-
onAdd:debug,
76-
adderText:'添加',
59+
addonNode:'',
7760
}
7861

7962
exportdefaultSectionLabel

‎components/SectionLabel/styles/index.js‎

Lines changed: 1 addition & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -16,40 +16,13 @@ export const Title = styled.div`
1616
font-size: 0.9rem;
1717
flex-grow: 1;
1818
`
19-
exportconstAdderWrapper=styled.div`
19+
exportconstAddonWrapper=styled.div`
2020
margin-right: 5%;
2121
display:${({ show})=>(show ?'flex' :'none')};
2222
&:active {
2323
animation:${Animate.pulse} 0.3s linear;
2424
}
2525
`
26-
exportconstAdderText=styled.div`
27-
font-size: 0.9rem;
28-
color:${theme('tabs.header')};
29-
margin-top: -2px;
30-
${Label}:hover & {
31-
color:${theme('tabs.headerActive')};
32-
}
33-
&:hover {
34-
cursor: pointer;
35-
font-weight: bold;
36-
}
37-
transition: color 0.3s linear;
38-
`
39-
exportconstAdderIcon=styled(Img)`
40-
fill:${theme('tabs.header')};
41-
width: 17px;
42-
height: 17px;
43-
margin-right: 3px;
44-
${Label}:hover & {
45-
fill:${theme('tabs.headerActive')};
46-
}
47-
&:hover {
48-
cursor: pointer;
49-
fill:${theme('tabs.headerActive')};
50-
}
51-
`
52-
5326
exportconstDivider=styled.div`
5427
border-bottom: 1px solid;
5528
border-color:${theme('banner.desc')};

‎containers/FavoritesCats/index.js‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,13 @@
66

77
importReactfrom'react'
88
importPropTypesfrom'prop-types'
9-
109
import{inject,observer}from'mobx-react'
1110

1211
import{ICON_CMD}from'../../config'
13-
1412
import{Modal,SectionLabel}from'../../components'
13+
14+
import{AdderWrapper,AdderText,AdderIcon}from'./styles'
15+
1516
importBoxViewfrom'./BoxView'
1617
importCreatorfrom'./Creator'
1718
importUpdaterfrom'./Updater'
@@ -55,9 +56,12 @@ class FavoritesCatsContainer extends React.Component {
5556
title="收藏夹"
5657
iconSrc={`${ICON_CMD}/folder.svg`}
5758
desc={`当前共有收藏夹${totalCount} 个。`}
58-
withAdder
59-
onAdd={logic.changeViewTo.bind(this,'creator')}
60-
adderText="创建"
59+
addonNode={
60+
<AdderWrapperonClick={logic.changeViewTo.bind(this,'creator')}>
61+
<AdderIconsrc={`${ICON_CMD}/add_circle.svg`}/>
62+
<AdderText>创建</AdderText>
63+
</AdderWrapper>
64+
}
6165
/>
6266
) :null}
6367
<Modal
Lines changed: 22 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,85 +1,34 @@
11
importstyledfrom'styled-components'
22

33
importImgfrom'../../../components/Img'
4-
import{theme}from'../../../utils'
4+
import{theme,Animate}from'../../../utils'
55

6-
exportconstWrapper=styled.div`
6+
exportconstAdderWrapper=styled.div`
77
display: flex;
8-
flex-wrap: wrap;
8+
width: 80px;
9+
text-align: right;
10+
justify-content: flex-end;
11+
&:active {
12+
animation:${Animate.pulse} 0.3s linear;
13+
}
914
`
10-
11-
exportconstBoxWrapper=styled.div`
12-
display: flex;
13-
flex-direction: column;
14-
border: 1px solid;
15-
border:${({ active})=>(active ?'2px solid' :'1px dashed')};
16-
border-color:${theme('banner.desc')};
17-
margin-right: 15px;
18-
margin-bottom: 18px;
19-
height: 130px;
20-
width: 210px;
21-
padding: 10px;
22-
border-radius: 5px;
15+
exportconstAdderText=styled.div`
16+
font-size: 0.9rem;
17+
color:${theme('tabs.header')};
18+
margin-top: -2px;
2319
&:hover {
24-
border-top: 2px solid;
25-
border-bottom: 2px solid;
26-
border-color:${theme('banner.desc')};
20+
cursor: pointer;
21+
font-weight: bold;
2722
}
23+
transition: color 0.3s linear;
2824
`
29-
30-
exportconstHeader=styled.div`
31-
display: flex;
32-
align-items: center;
33-
`
34-
35-
exportconstFooter=styled.div`
36-
display: flex;
37-
`
38-
39-
exportconstTitle=styled.div`
40-
display: flex;
41-
align-items: center;
42-
flex-grow: 1;
43-
`
44-
45-
exportconstEditIcon=styled(Img)`
46-
fill:${theme('banner.desc')};
47-
width: 20px;
48-
height: 20px;
49-
display: none;
50-
51-
${BoxWrapper}:hover & {
52-
display: block;
25+
exportconstAdderIcon=styled(Img)`
26+
fill:${theme('tabs.header')};
27+
width: 17px;
28+
height: 17px;
29+
margin-right: 3px;
30+
&:hover {
5331
cursor: pointer;
54-
fill:${theme('banner.title')};
32+
fill:${theme('tabs.headerActive')};
5533
}
5634
`
57-
58-
exportconstTitleText=styled.div`
59-
font-size: 1rem;
60-
color:${theme('banner.title')};
61-
`
62-
63-
exportconstLockIcon=styled(Img)`
64-
width: 18px;
65-
height: 18px;
66-
fill:${theme('banner.desc')};
67-
margin-left: 5px;
68-
margin-top: 5px;
69-
`
70-
71-
exportconstDesc=styled.div`
72-
color:${theme('banner.desc')};
73-
flex-grow: 1;
74-
margin-top: 5px;
75-
`
76-
77-
exportconstFooterCounter=styled.div`
78-
color:${theme('banner.desc')};
79-
flex-grow: 1;
80-
font-size: 0.8rem;
81-
`
82-
exportconstFooterUpdate=styled.div`
83-
color:${theme('banner.desc')};
84-
font-size: 0.8rem;
85-
`

‎containers/UpgradePackges/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ class UpgradePackgesContainer extends React.Component {
9797
<Supportnotitems={platinumUserItems}/>
9898
</ItemsWrapper>
9999
<TitleDivider/>
100-
<Buttontype="red">软妹 69/98 元</Button>
100+
<Buttontype="red">￥69 元</Button>
101101
</Dashboard>
102102
<Dashboard>
103103
<PkgTitle>赞助商</PkgTitle>
@@ -108,7 +108,7 @@ class UpgradePackgesContainer extends React.Component {
108108
<Supportitems={platinumUserItems}/>
109109
</ItemsWrapper>
110110
<TitleDivider/>
111-
<Buttontype="red">软妹 997 元</Button>
111+
<Buttontype="red">￥1999 元</Button>
112112
</Dashboard>
113113
</ContentWrapper>
114114
</Wrapper>

‎containers/UserBilling/index.js‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
/*
2+
*
3+
* UserBilling
4+
*
5+
*/
6+
7+
importReactfrom'react'
8+
import{inject,observer}from'mobx-react'
9+
10+
import{ICON_CMD}from'../../config'
11+
12+
import{SectionLabel,Button}from'../../components'
13+
import{
14+
Wrapper,
15+
PlanWrapper,
16+
PlanDivider,
17+
PlanTitle,
18+
PlanDesc,
19+
PurchaseButton,
20+
DescLine,
21+
BadPrice,
22+
GoodPrice,
23+
}from'./styles'
24+
25+
import{makeDebugger,storePlug}from'../../utils'
26+
import*aslogicfrom'./logic'
27+
28+
/* eslint-disable no-unused-vars */
29+
constdebug=makeDebugger('C:UserBilling')
30+
/* eslint-enable no-unused-vars */
31+
32+
classUserBillingContainerextendsReact.Component{
33+
componentWillMount(){
34+
const{ userBilling}=this.props
35+
logic.init(userBilling)
36+
}
37+
38+
render(){
39+
return(
40+
<Wrapper>
41+
<SectionLabel
42+
title="账单概况"
43+
iconSrc={`${ICON_CMD}/bill.svg`}
44+
desc="当前账户为免费账户，欢迎升级账户以获得更好的体验/服务, 同时支持社区的发展。"
45+
/>
46+
47+
<PlanWrapper>
48+
<PlanTitle>高级用户</PlanTitle>
49+
<PlanDesc>
50+
<DescLine>
51+
<BadPrice>￥102.4</BadPrice> /<GoodPrice>￥69</GoodPrice>
52+
无限期有效
53+
</DescLine>
54+
<DescLine>将获得区别于免费用户的 10+ 项功能/服务</DescLine>
55+
</PlanDesc>
56+
<PurchaseButton>
57+
<Buttontype="primary"ghostonClick={logic.upgradeHepler}>
58+
升级成高级用户
59+
</Button>
60+
</PurchaseButton>
61+
</PlanWrapper>
62+
<PlanDivider/>
63+
<PlanWrapper>
64+
<PlanTitle>赞助商</PlanTitle>
65+
<PlanDesc>
66+
<DescLine>
67+
<BadPrice>￥2999起</BadPrice> /<GoodPrice>￥1999起</GoodPrice>
68+
无限期有效
69+
</DescLine>
70+
<DescLine>高级用户所有功能，以及企业/产品推广等</DescLine>
71+
</PlanDesc>
72+
<PurchaseButton>
73+
<Buttontype="primary"ghostonClick={logic.upgradeHepler}>
74+
升级成赞助商
75+
</Button>
76+
</PurchaseButton>
77+
</PlanWrapper>
78+
<PlanDivider/>
79+
<PlanWrapper>
80+
<PlanTitle>打赏用户</PlanTitle>
81+
<PlanDesc>
82+
<DescLine>
83+
<BadPrice>￥15</BadPrice> /<GoodPrice>￥10.24</GoodPrice>
84+
无限期有效
85+
</DescLine>
86+
<DescLine>打赏任意金额可解锁全部主题</DescLine>
87+
</PlanDesc>
88+
<PurchaseButton>
89+
<Buttontype="primary"ghostonClick={logic.sponsorHepler}>
90+
打赏一下
91+
</Button>
92+
</PurchaseButton>
93+
</PlanWrapper>
94+
95+
<br/>
96+
<SectionLabel
97+
title="付费历史"
98+
iconSrc={`${ICON_CMD}/bill_history.svg`}
99+
desc="没有查询到付费记录, 欢迎升级体验。"
100+
/>
101+
</Wrapper>
102+
)
103+
}
104+
}
105+
106+
exportdefaultinject(storePlug('userBilling'))(observer(UserBillingContainer))

0 commit comments

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