forked from Gitlink/forgeplus-react
127 lines
3.5 KiB
JavaScript
127 lines
3.5 KiB
JavaScript
import React, { useEffect, useState } from 'react';
|
|
import './Index.scss';
|
|
import 'echarts/lib/component/tooltip';
|
|
import 'echarts/lib/component/title';
|
|
import 'echarts/lib/component/legend'
|
|
import 'echarts/lib/component/markPoint';
|
|
|
|
import { Select , Pagination } from 'antd';
|
|
|
|
import { FlexAJ } from '../../Component/layout';
|
|
import Line from '../Echart/Line';
|
|
import Calendar from '../Echart/Calendar';
|
|
import ConcentrateProject from './ConcentrateProject';
|
|
import Activity from './Activity';
|
|
import moment from 'moment';
|
|
import Axios from 'axios';
|
|
|
|
const { Option } = Select;
|
|
const aLimit = 5;
|
|
function Index(props) {
|
|
const [ page , setPage ] = useState(1);
|
|
const [ total , setTotal ] = useState(0);
|
|
const [ projectTrends , setProjectTrends ] = useState(undefined);
|
|
|
|
const [ year , setYear ] = useState("0");
|
|
const [ yearList , setYearList ] = useState(undefined);
|
|
const [ activityDate , setActivityDate ] = useState(undefined);
|
|
|
|
const [ statisticData , setStatisticData ] = useState(undefined);
|
|
|
|
const username = props.match.params.username;
|
|
const current_user = props.current_user;
|
|
const user = props.user;
|
|
|
|
useEffect(()=>{
|
|
if(user){
|
|
let c = user.created_time && user.created_time.split("-")[0];
|
|
let y = moment().get('year');
|
|
let array = []
|
|
for(var i = y ; i >= parseInt(c,0);i--){
|
|
array.push(i);
|
|
}
|
|
setYearList(array);
|
|
}
|
|
},[user])
|
|
|
|
// 在贡献度日历表中选择一个时间
|
|
function chooseTime(data) {
|
|
if(data){
|
|
setActivityDate(data[0]);
|
|
}
|
|
}
|
|
|
|
// 年份下拉框option
|
|
function renderYear(list){
|
|
return list.map((i,k)=>{
|
|
return(
|
|
<Option key={i}>{i}</Option>
|
|
)
|
|
})
|
|
}
|
|
|
|
useEffect(()=>{
|
|
getActivity();
|
|
},[activityDate,page])
|
|
|
|
// 获取动态列表
|
|
function getActivity() {
|
|
const url = `/users/${username}/project_trends.json`;
|
|
Axios.get(url,{
|
|
params:{
|
|
date:activityDate,
|
|
limit:aLimit,page
|
|
}
|
|
}).then(result=>{
|
|
if(result && result.data){
|
|
setProjectTrends(result.data.project_trends);
|
|
setTotal(result.data.total_count);
|
|
}
|
|
}).catch(error=>{})
|
|
}
|
|
|
|
// 获取近期活动统计
|
|
useEffect(()=>{
|
|
getStatistics();
|
|
},[])
|
|
|
|
function getStatistics() {
|
|
const url = `/users/${username}/statistics/activity.json`;
|
|
Axios.get(url).then(result=>{
|
|
if(result && result.data){
|
|
setStatisticData(result.data);
|
|
}
|
|
}).catch(error=>{})
|
|
}
|
|
|
|
return(
|
|
<div>
|
|
<div>
|
|
<ConcentrateProject
|
|
{...props}
|
|
userLogin={username}
|
|
current={current_user && (current_user.login === username)}
|
|
/>
|
|
</div>
|
|
<div className="recentStatic">
|
|
<Line data={statisticData}/>
|
|
</div>
|
|
<div className="calendarStatic">
|
|
<FlexAJ>
|
|
<span className="font-18">贡献度</span>
|
|
<Select style={{width:"200px"}} placeholder="选择年份" value={year} onSelect={(e)=>setYear(e)}>
|
|
<Option key={"0"}>选择年份</Option>
|
|
{ yearList && renderYear(yearList) }
|
|
</Select>
|
|
</FlexAJ>
|
|
<Calendar time={year} userLogin={username} chooseTime={chooseTime}/>
|
|
</div>
|
|
<div className="activeStatic">
|
|
<span className="font-18">动态</span>
|
|
{ projectTrends && projectTrends.length > 0 && <Activity list = {projectTrends}/> }
|
|
{ total > aLimit && <div style={{textAlign:'center',paddingBottom:"30px"}}><Pagination pageSize={aLimit} current={page} total={total} onChange={(p)=>setPage(p)}/></div> }
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
export default Index; |