forked from Gitlink/forgeplus-react
git cherry-pick 975d49
This commit is contained in:
parent
6f8a8e099c
commit
bca1102b58
|
@ -1,8 +1,8 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 2340181 */
|
||||
src: url('iconfont.woff2?t=1622190934982') format('woff2'),
|
||||
url('iconfont.woff?t=1622190934982') format('woff'),
|
||||
url('iconfont.ttf?t=1622190934982') format('truetype');
|
||||
src: url('iconfont.woff2?t=1622517296245') format('woff2'),
|
||||
url('iconfont.woff?t=1622517296245') format('woff'),
|
||||
url('iconfont.ttf?t=1622517296245') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
|
@ -13,6 +13,46 @@
|
|||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-youxiang:before {
|
||||
content: "\e8b2";
|
||||
}
|
||||
|
||||
.icon-danwei:before {
|
||||
content: "\e8a7";
|
||||
}
|
||||
|
||||
.icon-daibanshixiang:before {
|
||||
content: "\e8a8";
|
||||
}
|
||||
|
||||
.icon-gailan:before {
|
||||
content: "\e8ab";
|
||||
}
|
||||
|
||||
.icon-nan:before {
|
||||
content: "\e8ac";
|
||||
}
|
||||
|
||||
.icon-nv:before {
|
||||
content: "\e8ad";
|
||||
}
|
||||
|
||||
.icon-gongzuoliu1:before {
|
||||
content: "\e8ae";
|
||||
}
|
||||
|
||||
.icon-shujutongji:before {
|
||||
content: "\e8b1";
|
||||
}
|
||||
|
||||
.icon-xiangmu:before {
|
||||
content: "\e8b3";
|
||||
}
|
||||
|
||||
.icon-zuzhi:before {
|
||||
content: "\e8b4";
|
||||
}
|
||||
|
||||
.icon-arrowRight:before {
|
||||
content: "\e863";
|
||||
}
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -5,6 +5,76 @@
|
|||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "21936935",
|
||||
"name": "邮箱",
|
||||
"font_class": "youxiang",
|
||||
"unicode": "e8b2",
|
||||
"unicode_decimal": 59570
|
||||
},
|
||||
{
|
||||
"icon_id": "21936924",
|
||||
"name": "单位",
|
||||
"font_class": "danwei",
|
||||
"unicode": "e8a7",
|
||||
"unicode_decimal": 59559
|
||||
},
|
||||
{
|
||||
"icon_id": "21936925",
|
||||
"name": "待办事项",
|
||||
"font_class": "daibanshixiang",
|
||||
"unicode": "e8a8",
|
||||
"unicode_decimal": 59560
|
||||
},
|
||||
{
|
||||
"icon_id": "21936928",
|
||||
"name": "概览",
|
||||
"font_class": "gailan",
|
||||
"unicode": "e8ab",
|
||||
"unicode_decimal": 59563
|
||||
},
|
||||
{
|
||||
"icon_id": "21936929",
|
||||
"name": "男",
|
||||
"font_class": "nan",
|
||||
"unicode": "e8ac",
|
||||
"unicode_decimal": 59564
|
||||
},
|
||||
{
|
||||
"icon_id": "21936930",
|
||||
"name": "女",
|
||||
"font_class": "nv",
|
||||
"unicode": "e8ad",
|
||||
"unicode_decimal": 59565
|
||||
},
|
||||
{
|
||||
"icon_id": "21936931",
|
||||
"name": "工作流",
|
||||
"font_class": "gongzuoliu1",
|
||||
"unicode": "e8ae",
|
||||
"unicode_decimal": 59566
|
||||
},
|
||||
{
|
||||
"icon_id": "21936934",
|
||||
"name": "数据统计",
|
||||
"font_class": "shujutongji",
|
||||
"unicode": "e8b1",
|
||||
"unicode_decimal": 59569
|
||||
},
|
||||
{
|
||||
"icon_id": "21936936",
|
||||
"name": "项目",
|
||||
"font_class": "xiangmu",
|
||||
"unicode": "e8b3",
|
||||
"unicode_decimal": 59571
|
||||
},
|
||||
{
|
||||
"icon_id": "21936937",
|
||||
"name": "组织",
|
||||
"font_class": "zuzhi",
|
||||
"unicode": "e8b4",
|
||||
"unicode_decimal": 59572
|
||||
},
|
||||
{
|
||||
"icon_id": "14835599",
|
||||
"name": "右箭头",
|
||||
|
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -91,6 +91,7 @@
|
|||
display: flex;
|
||||
border-bottom:1px solid rgba(238,238,238,1);
|
||||
padding:22px 0px;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.boxShandow{
|
||||
box-shadow:0px 2px 20px 10px rgba(0,0,0,0.03);
|
||||
|
@ -100,6 +101,7 @@
|
|||
height: 60px;
|
||||
border-radius: 50%;
|
||||
margin-right: 22px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.p-r-Infos{
|
||||
flex: 1;
|
||||
|
@ -108,6 +110,7 @@
|
|||
.p-r-name{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.p-r-name > p{
|
||||
flex: 1;
|
||||
|
|
|
@ -77,7 +77,7 @@ function UndoEvent(props){
|
|||
</p>
|
||||
<FlexAJ>
|
||||
<p className="color-grey-6">请求将仓库【<Link to={`/projects/${i.project && i.project.owner && i.project.owner.login}/${i.project && i.project.identifier}`}>{i.project && i.project.name}</Link>】
|
||||
转移给【<Link to={`/users/${i.owner && i.owner.login}`}>{i.owner && i.owner.name}</Link>】,是否接受?</p>
|
||||
转移给【<Link to={`/users/${i.owner && i.owner.login}`}>{i.owner && i.owner.name}</Link>】,是否接受?</p>
|
||||
{
|
||||
i.status === "common" &&
|
||||
<span>
|
||||
|
|
|
@ -97,7 +97,7 @@ class ForkUsers extends Component {
|
|||
<div>
|
||||
<Link
|
||||
to={`/projects/${item.login}/${item.identifier}`}
|
||||
className="font-16 text-primary hide-1 task-hide max-w-200"
|
||||
className="font-16 text-primary task-hide max-w-200"
|
||||
>
|
||||
{item.name}
|
||||
</Link>
|
||||
|
|
|
@ -27,7 +27,7 @@ class UserList extends Component {
|
|||
<div>
|
||||
<a
|
||||
href={`/users/${item.login}`}
|
||||
className="font-16 text-primary hide-1 task-hide max-w-200"
|
||||
className="font-16 text-primary task-hide max-w-200"
|
||||
>
|
||||
{item.name}
|
||||
</a>
|
||||
|
|
|
@ -10,7 +10,7 @@ function Calendar({ userLogin , time , chooseTime }) {
|
|||
useEffect(()=>{
|
||||
if(time){
|
||||
let e,b = "";
|
||||
if(time === "0"){
|
||||
if(parseInt(time,0) === parseInt(moment().get('year'),0)){
|
||||
let y = moment().get('year');
|
||||
let m = moment().get('month');
|
||||
let d = moment().get('date');
|
||||
|
@ -52,13 +52,30 @@ function Calendar({ userLogin , time , chooseTime }) {
|
|||
}
|
||||
|
||||
function getVirtulData(data) {
|
||||
var date = +echarts.number.parseDate(baginT);
|
||||
var end = +echarts.number.parseDate(endT);
|
||||
var dayTime = 3600 * 24 * 1000;
|
||||
var array = [];
|
||||
for(var i=0;i<data.length;i++){
|
||||
array.push([data[i].date,data[i].contributions]);
|
||||
for (var time = date; time <= end; time += dayTime) {
|
||||
let stamp = timestampToTime(time);
|
||||
let stampFilter = data.filter(i=>i.date === stamp);
|
||||
if(stampFilter && stampFilter.length > 0){
|
||||
array.push([stampFilter[0].date,stampFilter[0].contributions]);
|
||||
}else{
|
||||
array.push([stamp,0]);
|
||||
}
|
||||
}
|
||||
return array;
|
||||
}
|
||||
|
||||
function timestampToTime(timestamp) {
|
||||
var date = new Date(timestamp);
|
||||
var Y = date.getFullYear() + '-';
|
||||
var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
|
||||
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
|
||||
return Y+M+D;
|
||||
}
|
||||
|
||||
function Init(data,max) {
|
||||
var huan_val = document.getElementById("Calendar");
|
||||
var myEcharts = echarts.init(huan_val);
|
||||
|
@ -66,7 +83,11 @@ function Calendar({ userLogin , time , chooseTime }) {
|
|||
title: {
|
||||
show:false
|
||||
},
|
||||
tooltip: {},
|
||||
tooltip: {
|
||||
formatter:function(params){
|
||||
return params.data[0] + ': ' + params.data[1] + '个贡献';
|
||||
}
|
||||
},
|
||||
visualMap: {
|
||||
min: 0,
|
||||
max: max,
|
||||
|
@ -75,15 +96,23 @@ function Calendar({ userLogin , time , chooseTime }) {
|
|||
left: 'center',
|
||||
bottom: 40,
|
||||
inRange:{
|
||||
color:['#C7DBFF', '#5291FF']
|
||||
color:['#fafafa', '#216e39']
|
||||
}
|
||||
},
|
||||
calendar: {
|
||||
top: 60,
|
||||
left: 30,
|
||||
right: 0,
|
||||
top: 50,
|
||||
left: 40,
|
||||
right: 30,
|
||||
cellSize: ['auto', 13],
|
||||
range: [baginT, endT],
|
||||
splitLine:{
|
||||
show:false,
|
||||
lineStyle:{
|
||||
color:"#fff",
|
||||
width:1,
|
||||
type:"solid"
|
||||
}
|
||||
},
|
||||
itemStyle: {
|
||||
borderWidth: 0.5
|
||||
},
|
||||
|
@ -92,7 +121,8 @@ function Calendar({ userLogin , time , chooseTime }) {
|
|||
nameMap:"cn"
|
||||
},
|
||||
dayLabel:{
|
||||
nameMap:"cn"
|
||||
nameMap:"cn",
|
||||
firstDay:1
|
||||
}
|
||||
},
|
||||
series: {
|
||||
|
@ -108,7 +138,7 @@ function Calendar({ userLogin , time , chooseTime }) {
|
|||
}
|
||||
|
||||
return(
|
||||
<div id="Calendar" style={{height:"230px"}}></div>
|
||||
<div id="Calendar" style={{height:"210px"}}></div>
|
||||
)
|
||||
}
|
||||
export default Calendar;
|
|
@ -15,22 +15,20 @@ function Line({data}) {
|
|||
let option = {
|
||||
color: ["#f8e367", "#58c0f0", "#ff9e48"],
|
||||
title: {
|
||||
text: '近期活动统计',
|
||||
left: '3%',
|
||||
top:"3%"
|
||||
show:false
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
data: ['commits', 'issues', 'pull_requests'],
|
||||
data: ['提交数', '易修数', '合并请求数'],
|
||||
right: 'center',
|
||||
bottom: '0',
|
||||
bottom: '4%',
|
||||
},
|
||||
grid: {
|
||||
left: '4%',
|
||||
right: '4%',
|
||||
bottom: '12%',
|
||||
right: '5%',
|
||||
bottom: '16%',
|
||||
containLabel: true
|
||||
},
|
||||
toolbox: {
|
||||
|
@ -53,21 +51,23 @@ function Line({data}) {
|
|||
},
|
||||
axisTick:{
|
||||
show:false
|
||||
}
|
||||
},
|
||||
minInterval:1,
|
||||
splitNumber: 5,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'commits',
|
||||
name: '提交数',
|
||||
type: 'line',
|
||||
data: d.commits_count
|
||||
},
|
||||
{
|
||||
name: 'issues',
|
||||
name: '易修数',
|
||||
type: 'line',
|
||||
data: d.issues_count
|
||||
},
|
||||
{
|
||||
name: 'pull_requests',
|
||||
name: '合并请求数',
|
||||
type: 'line',
|
||||
data: d.pull_requests_count
|
||||
}
|
||||
|
|
|
@ -51,7 +51,7 @@ function Radar({data}) {
|
|||
}
|
||||
]
|
||||
}]
|
||||
};
|
||||
};
|
||||
myEcharts.setOption(option);
|
||||
}
|
||||
|
||||
|
|
|
@ -1,30 +1,49 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { Modal , Checkbox , Pagination , Button , Spin } from 'antd';
|
||||
import { Modal , Checkbox , Spin , Input } from 'antd';
|
||||
import Axios from 'axios';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { FlexAJ } from '../../Component/layout';
|
||||
|
||||
const { Search } = Input;
|
||||
const limit = 20;
|
||||
function ConcentrateBox({ visible , onCancel , onSure , username , choosed }) {
|
||||
const [ page , setPage ]= useState(1);
|
||||
const [ total , setTotal ]= useState(0);
|
||||
const [ list , setList ]= useState(undefined);
|
||||
const [ pageSize , setPageSize ] = useState(false);
|
||||
const [ search , setSearch ] = useState(undefined);
|
||||
|
||||
const [ list , setList ]= useState([]);
|
||||
const [ value , setValue ]= useState([]);
|
||||
const [ isSpin , setIsSpin ]= useState(true);
|
||||
const [ disable , setDisable ] = useState(false);
|
||||
const [ loadCount , setLoadCount ]= useState(0);
|
||||
|
||||
useEffect(()=>{
|
||||
if(visible){
|
||||
if(visible && loadCount === 0){
|
||||
setLoadCount(loadCount+1);
|
||||
setIsSpin(true);
|
||||
getProjectList();
|
||||
}
|
||||
},[visible,page])
|
||||
},[visible])
|
||||
|
||||
useEffect(()=>{
|
||||
if(choosed && choosed.length >0 ){
|
||||
if(page>1){
|
||||
setIsSpin(true);
|
||||
getProjectList(page,undefined);
|
||||
}
|
||||
},[page])
|
||||
|
||||
useEffect(()=>{
|
||||
if(search !== undefined){
|
||||
setIsSpin(true);
|
||||
getProjectList(1,search);
|
||||
}
|
||||
},[search])
|
||||
|
||||
useEffect(()=>{
|
||||
if(visible && choosed && choosed.length >0 ){
|
||||
setValue(choosed);
|
||||
}
|
||||
},[choosed])
|
||||
},[visible,choosed])
|
||||
|
||||
useEffect(()=>{
|
||||
if(value && value.length === 6){
|
||||
|
@ -34,63 +53,91 @@ function ConcentrateBox({ visible , onCancel , onSure , username , choosed }) {
|
|||
}
|
||||
},[value])
|
||||
|
||||
function getProjectList() {
|
||||
function getProjectList(p,s) {
|
||||
const url = `/users/${username}/projects.json`;
|
||||
Axios.get(url,{
|
||||
params:{
|
||||
page,limit,is_public: "public"
|
||||
page:p,limit,is_public: "public",search:s
|
||||
}
|
||||
}).then(result=>{
|
||||
if(result && result.data){
|
||||
let e = mergeArrayMerge(list,result.data.projects);
|
||||
setTotal(result.data.count);
|
||||
setList(result.data.projects);
|
||||
setList(page > 1 ? e : result.data.projects);
|
||||
setIsSpin(false);
|
||||
|
||||
let s = parseInt(result.data.count/limit,0);
|
||||
let y = result.data.count%limit;
|
||||
setPageSize(y>0?s+1:s);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function mergeArrayMerge (array1, array2) {
|
||||
array1.map((v, index) => {
|
||||
if (v !== '') {
|
||||
let idx = array2.indexOf(v);
|
||||
if (idx > -1) {
|
||||
array2.splice(idx, 1)
|
||||
}
|
||||
}
|
||||
});
|
||||
array1 = array1.concat(array2);
|
||||
return array1
|
||||
}
|
||||
|
||||
function onOk() {
|
||||
onSure && onSure(value);
|
||||
setValue([]);
|
||||
}
|
||||
|
||||
function chooseProject(params) {
|
||||
setValue(params);
|
||||
function chooseProject(e) {
|
||||
setValue(e);
|
||||
}
|
||||
|
||||
// 搜索
|
||||
function onSearch(params) {
|
||||
setSearch(params);
|
||||
}
|
||||
|
||||
return(
|
||||
<Modal
|
||||
visible={visible}
|
||||
title={'选择精选项目'}
|
||||
closable={false}
|
||||
closable={true}
|
||||
width={500}
|
||||
className="ConcentrateBox"
|
||||
footer={
|
||||
<FlexAJ>
|
||||
{total > limit &&
|
||||
<Pagination size={"small"} simple current={page} pageSize={limit} onChange={(p)=>setPage(p)} total={total}/>
|
||||
}
|
||||
<span>
|
||||
<Button onClick={onCancel}>取消</Button>
|
||||
<Button type={"primary"} className="ml20" onClick={onOk}>确定</Button>
|
||||
</span>
|
||||
</FlexAJ>
|
||||
}
|
||||
onCancel={onCancel}
|
||||
onOk={onOk}
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
>
|
||||
<Spin spinning={isSpin}>
|
||||
{
|
||||
list && list.length > 0 &&
|
||||
<Checkbox.Group value={value} onChange={chooseProject} style={{width:"100%"}}>
|
||||
{
|
||||
list.map((i,k)=>{
|
||||
return(
|
||||
<Checkbox value={i.id} disabled={disable && (value.filter(j=>j === i.id).length===0)}>{i.name}</Checkbox>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Checkbox.Group>
|
||||
}
|
||||
{ list && list.length === 0 && <div style={{textAlign:"center"}}>您还没有公开的项目,先去<Link to={`/projects/deposit/new`} className="color-blue">新建项目</Link></div> }
|
||||
<div className="operateDiv">
|
||||
<p>最多可选取6个公开仓库</p>
|
||||
<Search
|
||||
placeholder="请输入项目名称进行搜索"
|
||||
onSearch={onSearch}
|
||||
enterButton="搜索"
|
||||
allowClear
|
||||
/>
|
||||
</div>
|
||||
<div className="listbox">
|
||||
{
|
||||
list && list.length > 0 &&
|
||||
<Checkbox.Group value={value} onChange={chooseProject} style={{width:"100%"}}>
|
||||
{
|
||||
list.map((i,k)=>{
|
||||
return(
|
||||
<Checkbox value={i.id} disabled={disable && (value.filter(j=>j === i.id).length===0)}>{i.name}</Checkbox>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Checkbox.Group>
|
||||
}
|
||||
</div>
|
||||
{ total > limit && page < pageSize && <div className="morelist" onClick={()=>setPage(page+1)}>查看更多</div> }
|
||||
{ list && list.length === 0 && <div style={{textAlign:"center"}}>您还没有公开的{search && `“${search}”`}项目,先去<Link to={`/projects/deposit/new`} className="color-blue">新建项目</Link></div> }
|
||||
</Spin>
|
||||
</Modal>
|
||||
)
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { AlignAJBottom , AlignCenter } from '../../Component/layout';
|
||||
import { FlexAJ , AlignCenter } from '../../Component/layout';
|
||||
import { Link } from 'react-router-dom';
|
||||
import axios from 'axios';
|
||||
|
||||
|
@ -22,7 +22,7 @@ function ConcentrateProject({userLogin,current}) {
|
|||
setList(p);
|
||||
if(p && p.length > 0){
|
||||
let array = p.map(i=>{
|
||||
return i.id
|
||||
return i.project_id
|
||||
})
|
||||
setValue(array);
|
||||
}
|
||||
|
@ -47,17 +47,17 @@ function ConcentrateProject({userLogin,current}) {
|
|||
{
|
||||
list && list.length>0 &&
|
||||
<div className="concentrate">
|
||||
<AlignAJBottom>
|
||||
<FlexAJ>
|
||||
<span className="font-18">精选项目</span>
|
||||
{ current && <a className="color-blue" onClick={()=>setVisible(true)}>自定义精选项目</a> }
|
||||
</AlignAJBottom>
|
||||
</FlexAJ>
|
||||
<div>
|
||||
<ul className="concentrateUl">
|
||||
{
|
||||
list.map((i,k)=>{
|
||||
return(
|
||||
<li>
|
||||
<Link to={`/projects/${userLogin}/${i.identifier}`} className="name">{i.name}</Link>
|
||||
<Link to={`/projects/${i.author && i.author.login}/${i.identifier}`} className="name">{i.name}</Link>
|
||||
<p className="task-hide desc">{i.description}</p>
|
||||
<AlignCenter>
|
||||
{ i.category && <span className="tagName">{i.category.name}</span> }
|
||||
|
|
|
@ -14,6 +14,7 @@ import ConcentrateProject from './ConcentrateProject';
|
|||
import Activity from './Activity';
|
||||
import moment from 'moment';
|
||||
import Axios from 'axios';
|
||||
import Nodata from '../../Nodata';
|
||||
|
||||
const { Option } = Select;
|
||||
const aLimit = 5;
|
||||
|
@ -22,7 +23,7 @@ function Index(props) {
|
|||
const [ total , setTotal ] = useState(0);
|
||||
const [ projectTrends , setProjectTrends ] = useState(undefined);
|
||||
|
||||
const [ year , setYear ] = useState("0");
|
||||
const [ year , setYear ] = useState(moment().get('year'));
|
||||
const [ yearList , setYearList ] = useState(undefined);
|
||||
const [ activityDate , setActivityDate ] = useState(undefined);
|
||||
|
||||
|
@ -100,21 +101,24 @@ function Index(props) {
|
|||
<ConcentrateProject userLogin={username} current={current_user && (current_user.login === username)}/>
|
||||
</div>
|
||||
<div className="recentStatic">
|
||||
<Line data={statisticData}/>
|
||||
<p className="font-18 mb15">近期活动统计</p>
|
||||
<div className="echartBox"><Line data={statisticData}/></div>
|
||||
</div>
|
||||
<div className="calendarStatic">
|
||||
<FlexAJ>
|
||||
<FlexAJ style={{marginBottom:"15px"}}>
|
||||
<span className="font-18">贡献度</span>
|
||||
<Select style={{width:"200px"}} placeholder="选择年份" value={year} onSelect={(e)=>setYear(e)}>
|
||||
<Option key={"0"}>选择年份</Option>
|
||||
<Select style={{width:"200px"}} placeholder="选择年份" value={year} onSelect={(e)=>{setYear(e);setActivityDate(undefined)}}>
|
||||
{ yearList && renderYear(yearList) }
|
||||
</Select>
|
||||
</FlexAJ>
|
||||
<Calendar time={year} userLogin={username} chooseTime={chooseTime}/>
|
||||
<div className="echartBox">
|
||||
<Calendar time={year} userLogin={username} chooseTime={chooseTime}/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="activeStatic">
|
||||
<span className="font-18">动态</span>
|
||||
{ projectTrends && projectTrends.length > 0 && <Activity list = {projectTrends}/> }
|
||||
{ projectTrends && projectTrends.length === 0 && <Nodata _html="暂无动态" />}
|
||||
{ total > aLimit && <div style={{textAlign:'center',paddingBottom:"30px"}}><Pagination pageSize={aLimit} current={page} total={total} onChange={(p)=>setPage(p)}/></div> }
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,17 +1,16 @@
|
|||
.concentrate{
|
||||
padding:20px 30px;
|
||||
padding:20px 0px 0px;
|
||||
.concentrateUl{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 15px;
|
||||
li{
|
||||
width: 48.5%;
|
||||
margin-right: 3%;
|
||||
margin-bottom: 20px;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
background-color: #fafafa;
|
||||
border:1px solid #dedede;
|
||||
padding:15px 20px;
|
||||
cursor: default ;
|
||||
&:nth-child(2n){
|
||||
|
@ -46,7 +45,7 @@
|
|||
}
|
||||
}
|
||||
.ConcentrateTip{
|
||||
margin:20px 30px;
|
||||
margin:0px 30px;
|
||||
padding:5px 20px;
|
||||
border:1px solid rgb(248, 56, 56);
|
||||
border-radius: 4px;
|
||||
|
@ -65,6 +64,21 @@
|
|||
.ConcentrateBox{
|
||||
.ant-modal-body{
|
||||
min-height: 258px;
|
||||
padding:0px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.listbox{
|
||||
max-height: 210px;
|
||||
overflow-y: auto;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.operateDiv{
|
||||
padding:20px 30px
|
||||
}
|
||||
.morelist{
|
||||
text-align: center;
|
||||
padding-top:15px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ant-checkbox-group{
|
||||
display: flex;
|
||||
|
@ -85,12 +99,10 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.recentStatic{
|
||||
padding-bottom: 30px;
|
||||
padding: 30px 0px;
|
||||
}
|
||||
.calendarStatic,.activeStatic{
|
||||
padding:0px 30px;
|
||||
.infosActivity{
|
||||
padding-bottom: 30px;
|
||||
&>li{
|
||||
|
@ -128,4 +140,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.activeStatic{
|
||||
padding-top: 20px;
|
||||
}
|
|
@ -24,6 +24,15 @@ $flex:flex;
|
|||
margin-right: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.echartBox{
|
||||
border:1px solid #DEDEDE;
|
||||
&>p{
|
||||
color: #999;
|
||||
padding:15px 20px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.contentBox{
|
||||
padding:20px 30px 0px 30px;
|
||||
& > div{
|
||||
|
@ -139,15 +148,20 @@ ul.ant-menu.menuStyle{
|
|||
}
|
||||
|
||||
.infosRightMenu{
|
||||
padding:0px 10px;
|
||||
.ant-menu-item{
|
||||
padding:0px;
|
||||
margin:0px 20px!important;
|
||||
font-size: 17px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
height: 32px;
|
||||
line-height: 0px;
|
||||
border-bottom: 2px solid transparent!important;
|
||||
position: relative;
|
||||
a{
|
||||
& >i{
|
||||
font-size: 15px!important;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
.menuNum{
|
||||
font-size: 12px;
|
||||
margin-left: 3px;
|
||||
|
@ -155,8 +169,8 @@ ul.ant-menu.menuStyle{
|
|||
}
|
||||
&.ant-menu-item-selected::before{
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
bottom: 7px;
|
||||
width: 100%;
|
||||
bottom: -1px;
|
||||
height: 2px;
|
||||
left: 0px;
|
||||
background-color: #1890ff;
|
||||
|
|
|
@ -71,17 +71,21 @@ class Infos extends Component {
|
|||
renderPath=(pathname)=>{
|
||||
const { username } = this.props.match.params;
|
||||
if(pathname === `/users/${username}`){
|
||||
this.setState({menuKey:"0"});
|
||||
this.setState({menuKey:"0",route_type:undefined});
|
||||
}else if(pathname === `/users/${username}/statistics`){
|
||||
this.setState({menuKey:"1"});
|
||||
this.setState({menuKey:"1",route_type:undefined});
|
||||
}else if(pathname.indexOf(`/users/${username}/projects`)>-1){
|
||||
this.setState({menuKey:"2"});
|
||||
this.setState({menuKey:"2",route_type:undefined});
|
||||
}else if(pathname === `/users/${username}/notice`){
|
||||
this.setState({menuKey:"3"});
|
||||
this.setState({menuKey:"3",route_type:undefined});
|
||||
}else if(pathname.indexOf(`/users/${username}/devops`)>-1){
|
||||
this.setState({menuKey:"4"});
|
||||
this.setState({menuKey:"4",route_type:undefined});
|
||||
}else if(pathname === `/users/${username}/organizes`){
|
||||
this.setState({menuKey:"5"});
|
||||
this.setState({menuKey:"5",route_type:undefined});
|
||||
}else if(pathname === `/users/${username}/watchers`){
|
||||
this.setState({menuKey:undefined,route_type:"watchers"});
|
||||
}else if(pathname === `/users/${username}/fan_users`){
|
||||
this.setState({menuKey:undefined,route_type:"fan_users"});
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -262,103 +266,26 @@ class Infos extends Component {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="bgcF">
|
||||
<div className="list-l-Menu">
|
||||
<li className={project_type && project_type === "notice" ? "active" : ""}>
|
||||
<p onClick={() => this.undo_link()}>
|
||||
<span className="font-16 color-grey-3">
|
||||
<i className="iconfont icon-dahuizhongzuo3x font-15 mr5"></i>
|
||||
待办事项
|
||||
</span>
|
||||
<span className="text-yellow font-16">
|
||||
{undo_events}
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bgcF">
|
||||
<ul className="list-l-Menu">
|
||||
<li className="MenuTitle" onClick={() => this.change_project_type(undefined)}>
|
||||
<i className="iconfont icon-xiangmuleixing font-15 mr5"></i>
|
||||
项目类型
|
||||
<i className="iconfont icon-youjiantou font-15 mr20 color-grey-9 pull-right"></i>
|
||||
</li>
|
||||
<li className={project_type && project_type === "common" ? "active" : ""} onClick={() => this.change_project_type("common")}>
|
||||
<p>
|
||||
<span className="font-16">开源托管项目</span>
|
||||
<span className="color-blue">
|
||||
{user && user.common_projects_count}
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
<li className={project_type && project_type === "mirror" ? "active" : ""} onClick={() => this.change_project_type("mirror")}>
|
||||
<p>
|
||||
<span className="font-16">开源镜像项目</span>
|
||||
<span className="color-blue">
|
||||
{user && user.mirror_projects_count}
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
<li className={project_type && project_type === "sync_mirror" ? "active" : ""} onClick={() => this.change_project_type("sync_mirror")}>
|
||||
<p>
|
||||
<span className="font-16">镜像托管项目</span>
|
||||
<span className="color-blue">
|
||||
{user && user.sync_mirror_projects_count}
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="bgcF">
|
||||
<ul className="list-l-Menu">
|
||||
<li className="MenuTitle">
|
||||
<i className="iconfont icon-gongzuoliu font-15 mr5"></i>
|
||||
DevOps工作流
|
||||
<i className="iconfont icon-youjiantou font-15 mr20 color-grey-9 pull-right"></i>
|
||||
</li>
|
||||
<li className={project_type && project_type === "CIService" ? "active" : ""} onClick={() => this.change_devops_type("CIService")}>
|
||||
<p>
|
||||
<span className="font-16 color-grey-3">CI服务</span>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="bgcF">
|
||||
<div className="list-l-Menu">
|
||||
<li className={project_type && project_type === "organizes" ? "active" : ""}>
|
||||
<p onClick={() => this.organize_link()} >
|
||||
<span className="font-16 color-grey-3">
|
||||
<i className="iconfont icon-itsm-liuchengguanli font-15 mr5"></i>
|
||||
组织
|
||||
</span>
|
||||
<span className="color-blue font-16">
|
||||
{user && user.user_org_count}
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
<div className="list-right">
|
||||
<Menu selectedKeys={[menuKey]} mode={`horizontal`} className="infosRightMenu">
|
||||
<Menu.Item key="0"><Link to={`/users/${user && user.login}`}>概览</Link></Menu.Item>
|
||||
<Menu.Item key="1"><Link to={`/users/${user && user.login}/statistics`}>数据统计</Link></Menu.Item>
|
||||
<Menu.Item key="2"><Link to={`/users/${user && user.login}/projects/common`}>项目</Link></Menu.Item>
|
||||
{
|
||||
current_user && user && user.login === current_user.login ?
|
||||
<Menu.Item key="3"><Link to={`/users/${user && user.login}/notice`}>待办事项<span className="menuNum">({undo_events})</span></Link></Menu.Item>
|
||||
:""
|
||||
}
|
||||
{
|
||||
current_user && current_user.login && current_user.login === username ?
|
||||
<Menu.Item key="4"><Link to={`/users/${user && user.login}/devops/CIService`}>DevOps工作流</Link></Menu.Item>
|
||||
:""
|
||||
}
|
||||
<Menu.Item key="5"><Link to={`/users/${user && user.login}/organizes`}>组织<span className="menuNum">({user && user.user_org_count})</span></Link></Menu.Item>
|
||||
</Menu>
|
||||
{ !route_type &&
|
||||
<Menu selectedKeys={[menuKey]} mode={`horizontal`} className="infosRightMenu">
|
||||
<Menu.Item key="0"><Link to={`/users/${user && user.login}`}><i className="iconfont icon-gailan"></i>概览</Link></Menu.Item>
|
||||
<Menu.Item key="1"><Link to={`/users/${user && user.login}/statistics`}><i className="iconfont icon-shujutongji"></i>数据统计</Link></Menu.Item>
|
||||
<Menu.Item key="2"><Link to={`/users/${user && user.login}/projects/common`}><i className="iconfont icon-xiangmu"></i>项目</Link></Menu.Item>
|
||||
{
|
||||
current_user && user && user.login === current_user.login ?
|
||||
<Menu.Item key="3"><Link to={`/users/${user && user.login}/notice`}><i className="iconfont icon-daibanshixiang"></i>待办事项<span className="menuNum">({undo_events})</span></Link></Menu.Item>
|
||||
:""
|
||||
}
|
||||
{
|
||||
current_user && current_user.login && current_user.login === username ?
|
||||
<Menu.Item key="4"><Link to={`/users/${user && user.login}/devops/CIService`}><i className="iconfont icon-gongzuoliu1"></i>DevOps工作流</Link></Menu.Item>
|
||||
:""
|
||||
}
|
||||
<Menu.Item key="5"><Link to={`/users/${user && user.login}/organizes`}><i className="iconfont icon-zuzhi"></i>组织<span className="menuNum">({user && user.user_org_count})</span></Link></Menu.Item>
|
||||
</Menu>
|
||||
}
|
||||
{user && (
|
||||
<Switch {...this.props}>
|
||||
<Route
|
||||
|
|
|
@ -70,14 +70,16 @@ function Index(props) {
|
|||
if(result && result.data){
|
||||
setRadarData(result.data);
|
||||
let score = result.data.user && result.data.user.each_language_score;
|
||||
var sortData = []
|
||||
for (var item in score) {
|
||||
sortData.push([item, score[item]])
|
||||
if(score){
|
||||
var sortData = [];
|
||||
for (var item in score) {
|
||||
sortData.push([item, score[item]])
|
||||
}
|
||||
sortData.sort(function(a, b) {
|
||||
return b[1] - a[1];
|
||||
});
|
||||
setTopThree(sortData.slice(0,3));
|
||||
}
|
||||
sortData.sort(function(a, b) {
|
||||
return b[1] - a[1];
|
||||
});
|
||||
setTopThree(sortData.slice(0,3));
|
||||
|
||||
let percent = result.data.user && result.data.user.languages_percent;
|
||||
let arr = [];
|
||||
|
@ -107,8 +109,8 @@ function Index(props) {
|
|||
const url = `/users/${username}/statistics/major.json`;
|
||||
Axios.get(url,{
|
||||
params:{
|
||||
start_time:rDates && rDates[0],
|
||||
end_time:rDates && rDates[1]
|
||||
start_time:cData && cData[0],
|
||||
end_time:cData && cData[1]
|
||||
}
|
||||
}).then(result=>{
|
||||
if(result && result.data){
|
||||
|
@ -120,7 +122,7 @@ function Index(props) {
|
|||
return(
|
||||
<div>
|
||||
<div className="boxes">
|
||||
<FlexAJ>
|
||||
<FlexAJ style={{marginBottom:"15px"}}>
|
||||
<span className="font-18">开发能力</span>
|
||||
<RangePicker
|
||||
disabledDate={disabledDate}
|
||||
|
@ -128,44 +130,47 @@ function Index(props) {
|
|||
format={dateFormat}
|
||||
/>
|
||||
</FlexAJ>
|
||||
<Radar data={radarData}/>
|
||||
{
|
||||
topThree &&
|
||||
<div className="roundBox">
|
||||
<Round num={topThree[0][1]} color="#FF7F69" name={topThree[0][0]}/>
|
||||
<Round num={topThree[1][1]} color="#99dfff" name={topThree[1][0]}/>
|
||||
<Round num={topThree[2][1]} color="#ff9e48" name={topThree[2][0]}/>
|
||||
</div>
|
||||
}
|
||||
{
|
||||
percentData &&
|
||||
<div className="pBox">
|
||||
<div class="progress">
|
||||
{
|
||||
percentData.map((i,k)=>{
|
||||
return(
|
||||
<span style={{width: `${i.p}%`, backgroundColor:`${i.color}`}}></span>
|
||||
)
|
||||
})
|
||||
}
|
||||
<div className="echartBox">
|
||||
<p>从五个维度刻画你的开发能力:语言能力、影响力、贡献度、活跃度、项目经验,同时可以查看社区平均数据。</p>
|
||||
<Radar data={radarData}/>
|
||||
{
|
||||
topThree && topThree.length > 0 &&
|
||||
<div className="roundBox">
|
||||
<Round num={topThree[0][1]} color="#FF7F69" name={topThree[0][0]}/>
|
||||
<Round num={topThree[1][1]} color="#99dfff" name={topThree[1][0]}/>
|
||||
<Round num={topThree[2][1]} color="#ff9e48" name={topThree[2][0]}/>
|
||||
</div>
|
||||
<div className="progresstip">
|
||||
{
|
||||
percentData.map((i,k)=>{
|
||||
return(
|
||||
<span>
|
||||
<i class="zero" style={{backgroundColor: `${i.color}`}}></i><span>{i.name}</span>
|
||||
<span>{`${i.p}%`}</span>
|
||||
</span>
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
{
|
||||
percentData &&
|
||||
<div className="pBox">
|
||||
<div class="progress">
|
||||
{
|
||||
percentData.map((i,k)=>{
|
||||
return(
|
||||
<span style={{width: `${i.p}%`, backgroundColor:`${i.color}`}}></span>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
<div className="progresstip">
|
||||
{
|
||||
percentData.map((i,k)=>{
|
||||
return(
|
||||
<span>
|
||||
<i class="zero" style={{backgroundColor: `${i.color}`}}></i><span>{i.name}</span>
|
||||
<span>{`${i.p}%`}</span>
|
||||
</span>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div className="boxes">
|
||||
<FlexAJ>
|
||||
<FlexAJ style={{marginBottom:"15px"}}>
|
||||
<span className="font-18">角色定位</span>
|
||||
<RangePicker
|
||||
disabledDate={disabledDate}
|
||||
|
@ -173,10 +178,13 @@ function Index(props) {
|
|||
format={dateFormat}
|
||||
/>
|
||||
</FlexAJ>
|
||||
<Pie data={pieData}/>
|
||||
<div className="echartBox">
|
||||
<p>根据你在项目开发过程中的工作,对你在项目中扮演的角色进行定位,包括:创建者、管理者、开发者、测试者、文档工作者等。</p>
|
||||
<Pie data={pieData}/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="boxes">
|
||||
<FlexAJ>
|
||||
<FlexAJ style={{marginBottom:"15px"}}>
|
||||
<span className="font-18">专业定位</span>
|
||||
<RangePicker
|
||||
disabledDate={disabledDate}
|
||||
|
@ -184,7 +192,10 @@ function Index(props) {
|
|||
format={dateFormat}
|
||||
/>
|
||||
</FlexAJ>
|
||||
<Cloud data={cloudData}/>
|
||||
<div className="echartBox">
|
||||
<p>展示你擅长、关注、感兴趣的专业范围,通过你参与项目、收藏项目、关注项目、复刻项目等数据来统计。</p>
|
||||
<Cloud data={cloudData}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
.boxes{
|
||||
padding:20px 30px;
|
||||
padding:15px 0px;
|
||||
.roundBox{
|
||||
margin:20px auto;
|
||||
display: flex;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import React, { Component } from "react";
|
||||
import { Input, Spin, Pagination } from "antd";
|
||||
|
||||
import { Link } from 'react-router-dom';
|
||||
import axios from "axios";
|
||||
import Nodata from "../Nodata";
|
||||
import UserList from "../UsersList/user_list";
|
||||
|
@ -87,7 +87,7 @@ class CommonList extends Component {
|
|||
<Spin spinning={isSpin}>
|
||||
<div className="pd20 minH-670">
|
||||
<div className="grid-item pb20 bbt">
|
||||
<h3 style={{marginBottom:"0px"}}>{userType === "watchers" ? `${title_type}关注的` : `关注${title_type}的`}</h3>
|
||||
<h3 style={{marginBottom:"0px"}}><Link to={`/users/${login}`} ><i className="iconfont icon-zuojiantou color-grey-9 font-16 mr8"></i></Link>{userType === "watch_users" ? `${title_type}关注的` : `关注${title_type}的`}</h3>
|
||||
<div className="text-right">
|
||||
<Search
|
||||
placeholder="输入名称进行搜索"
|
||||
|
@ -103,7 +103,7 @@ class CommonList extends Component {
|
|||
|
||||
{users && users.length > 0 ? (
|
||||
<div className="w-100 inline-block">
|
||||
<UserList users={users} userClass={"w-33"} current_user={current_user} successFunc={this.get_watchers}></UserList>
|
||||
<UserList users={users} userClass={"w-33"} type_title={'关注列表'} current_user={current_user} successFunc={this.get_watchers}></UserList>
|
||||
</div>
|
||||
) : (
|
||||
<Nodata _html={`暂时没有数据~`} />
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
}
|
||||
.list-left{
|
||||
width: 26%;
|
||||
padding-right: 20px;
|
||||
padding-right: 30px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
@ -22,7 +22,7 @@
|
|||
width:74%;
|
||||
background: #fff;
|
||||
padding:0px !important;
|
||||
border:1px solid #eee;
|
||||
border:none!important;
|
||||
}
|
||||
|
||||
.text-center{text-align: center;}
|
||||
|
|
Loading…
Reference in New Issue