Skip to content

M
mr-julyedu
Commit c768c3b5 by FE
Options

rank length is 0

parent ee2358a8
Showing with 64 additions and 57 deletions
src/components/activity/newyear-2019/treasure-box/rank.js
...@@ -21,18 +21,20 @@ class TreasureRank extends Component { ...@@ -21,18 +21,20 @@ class TreasureRank extends Component {
http.get(`${API.home}/sys/treasure/ranking`).then(res => { http.get(`${API.home}/sys/treasure/ranking`).then(res => {
const { code, data } = res.data; const { code, data } = res.data;
if(code === 200) { if(code === 200) {
if(data.length > 5) { if(JSON.stringify(data) !== '{}') {
this.setState({ if(data.length > 5) {
rank: data.filter((item, index) => index < 5), this.setState({
rankList: data, rank: data.filter((item, index) => index < 5),
isMore: true, rankList: data,
}); isMore: true,
}else { });
this.setState({ }else if() {
rank: data, this.setState({
rankList: data, rank: data,
isMore: false, rankList: data,
}); isMore: false,
});
}
} }
} }
}); });
...@@ -56,52 +58,57 @@ class TreasureRank extends Component { ...@@ -56,52 +58,57 @@ class TreasureRank extends Component {
render() { render() {
const { rank, isMore } = this.state; const { rank, isMore } = this.state;
return ( return (
<div data-skip="rank"> <>
<div className="rank-title"> {
<i className="rank-title__decorate"></i> rank.length !== 0 &&
<h2 className="rank-title__txt">宝箱达人榜</h2> <div data-skip="rank">
<i className="rank-title__decorate"></i> <div className="rank-title">
</div> <i className="rank-title__decorate"></i>
<p className="rank-desc">宝箱数量前50名可额外获得一份奖品，数量相同的用时短者排名在前</p> <h2 className="rank-title__txt">宝箱达人榜</h2>
<dl className="rank-header"> <i className="rank-title__decorate"></i>
<dd className="rank-column">排名</dd> </div>
<dd className="rank-column">用户</dd> <p className="rank-desc">宝箱数量前50名可额外获得一份奖品，数量相同的用时短者排名在前</p>
<dd className="rank-column">宝箱数量</dd> <dl className="rank-header">
<dd className="rank-column">奖品</dd> <dd className="rank-column">排名</dd>
</dl> <dd className="rank-column">用户</dd>
<div className="rank-body"> <dd className="rank-column">宝箱数量</dd>
{ <dd className="rank-column">奖品</dd>
rank.map((item, index) => ( </dl>
<dl className="rank-item" key={index}> <div className="rank-body">
<dd className="rank-column"> {
{ rank.map((item, index) => (
index <= 2 <dl className="rank-item" key={index}>
? <span className="rank-column__number" data-num={index}></span> <dd className="rank-column">
: <span>{index+1}</span> {
} index <= 2
</dd> ? <span className="rank-column__number" data-num={index}></span>
<dd className="rank-column"> : <span>{index+1}</span>
<span className="rank-column__name">{item.user_name}</span> }
</dd> </dd>
<dd className="rank-column"> <dd className="rank-column">
<span>{item.num}</span> <span className="rank-column__name">{item.user_name}</span>
</dd> </dd>
<dd className="rank-column"> <dd className="rank-column">
{ <span>{item.num}</span>
item.url </dd>
? <a className="rank-column__txt" href={item.url}>{item.prize_name}</a> <dd className="rank-column">
: <span className="rank-column__txt">{item.prize_name}</span> {
} item.url
</dd> ? <a className="rank-column__txt" href={item.url}>{item.prize_name}</a>
</dl> : <span className="rank-column__txt">{item.prize_name}</span>
)) }
} </dd>
<div className="rank-more" onClick={this.switchMoreRank}> </dl>
<span className="rank-more__txt">{isMore? '展开' : '收起'}</span> ))
<i className="rank-more__icon" data-more={isMore}></i> }
<div className="rank-more" onClick={this.switchMoreRank}>
<span className="rank-more__txt">{isMore? '展开' : '收起'}</span>
<i className="rank-more__icon" data-more={isMore}></i>
</div>
</div>
</div> </div>
</div> }
</div> </>
) )
} }
} }
......
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