tyler.durden
/
opensupports
mirror of https://github.com/opensupports/opensupports.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Max Red - Added all functionality to the component [skip ci]

This commit is contained in:
ivan 2017-01-14 21:31:02 -03:00
parent 19f25657ef
commit fd2c20ac9f
4 changed files with 50 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
client/src/app/admin/panel/dashboard/admin-panel-stats-chart.js
View File

@ -8,19 +8,19 @@ class StatsChart extends React.Component {
static propTypes = {
strokes: React.PropTypes.arrayOf(React.PropTypes.shape({
name: React.PropTypes.string,
show: React.PropTypes.bool,
values: React.PropTypes.arrayOf(React.PropTypes.shape({
date: React.PropTypes.string,
value: React.PropTypes.number
}))
})),
//showed: React.PropTypes.arrayOf(React.PropTypes.bool),
period: React.PropTypes.number
};
render() {
return (
<div>
<Line data={this.getChartData()} options={this.getChartOptions()} width={800} height={400} />
<Line data={this.getChartData()} options={this.getChartOptions()} width={800} height={400} redraw/>
</div>
);
}
@ -48,10 +48,10 @@ class StatsChart extends React.Component {
borderColor: color[stroke.name],
pointBorderColor: color[stroke.name],
pointRadius: 0,
pointHoverRadius: 3,
lineTension: 0.2,
pointHoverBackgroundColor: color[stroke.name],
hitRadius: this.hitRadius(),
showLine: stroke.show
hitRadius: this.hitRadius(i)
};
datasets.push(dataset);
@ -72,6 +72,10 @@ class StatsChart extends React.Component {
let labels = [];
for (let i = 0; i < this.props.period; i++) {
if (!this.props.strokes.length){
labels.push('');
continue;
}
let firstList = this.props.strokes[0];
let idx = firstList.values[i].date.slice(4, 6) - 1;
labels.push( firstList.values[i].date.slice(6, 8) + ' ' + months[idx]);
@ -80,11 +84,12 @@ class StatsChart extends React.Component {
return labels;
}
hitRadius() {
hitRadius(index) {
//if (!this.props.showed[index]) return 0;
if (this.props.period <= 7) return 20;
if (this.props.period <= 30) return 15;
if (this.props.period <= 90) return 10;
return 1;
return 3;
}
getChartOptions() {

59
client/src/app/admin/panel/dashboard/admin-panel-stats.js
View File

@ -14,33 +14,30 @@ class AdminPanelStats extends React.Component {
state = {
stats: {
'CLOSE': 0,
'CREATE_TICKET': 0,
'CLOSE': 0,
'SIGNUP': 0,
'COMMENT': 0
},
strokes: [
{
name: 'CLOSE',
show: true,
name: 'CREATE_TICKET',
values: []
},
{
name: 'CREATE_TICKET',
show: true,
name: 'CLOSE',
values: []
},
{
name: 'SIGNUP',
show: true,
values: []
},
{
name: 'COMMENT',
show: true,
values: []
}
],
showed: [0],
period: 0
};
@ -61,6 +58,7 @@ class AdminPanelStats extends React.Component {
getToggleListProps() {
return {
values: this.state.showed,
items: [
{
content:
@ -95,8 +93,10 @@ class AdminPanelStats extends React.Component {
};
}
onToggleListChange(data) {
onToggleListChange(event) {
this.setState({
showed: event.target.value
});
}
getDropDownProps() {
@ -124,22 +124,23 @@ class AdminPanelStats extends React.Component {
}
onDropDownChange(event) {
console.log('DROP DOWN HAS CHANGED');
let val = [7, 30, 90, 365];
this.retrieve(val[event.index]);
}
getStatsChartProps() {
let showed = this.getShowedArray();
return {
period: this.state.period,
strokes: this.state.strokes
}
strokes: _.filter(this.state.strokes, (s, i) => showed[i])
//strokes: this.state.strokes,
//showed: this.getShowedArray()
};
}
retrieve(period) {
console.log('THIS SHOULD NOT BE DISPLAYED');
let periodName;
switch (period) {
case 30:
@ -155,9 +156,6 @@ class AdminPanelStats extends React.Component {
periodName = 'WEEK';
}
console.log('--------------------------------------------period: ' + this.state.period);
console.log('--------------------------------------------PERIOD NAME: ' + periodName);
API.call({
path: '/system/get-stats',
data: {
@ -168,42 +166,35 @@ class AdminPanelStats extends React.Component {
onRetrieveSuccess(period, result) {
console.log('This is the shit you SHOULD look at!');
console.log(result);
let newState = {
'CLOSE': 0,
'CREATE_TICKET': 0,
'CLOSE': 0,
'SIGNUP': 0,
'COMMENT': 0
};
let ID = {
'CLOSE': 0,
'CREATE_TICKET': 1,
'CREATE_TICKET': 0,
'CLOSE': 1,
'SIGNUP': 2,
'COMMENT': 3
};
let newStrokes = [
{
name: 'CLOSE',
show: true,
name: 'CREATE_TICKET',
values: []
},
{
name: 'CREATE_TICKET',
show: true,
name: 'CLOSE',
values: []
},
{
name: 'SIGNUP',
show: true,
values: []
},
{
name: 'COMMENT',
show: true,
values: []
}
];
@ -221,6 +212,16 @@ class AdminPanelStats extends React.Component {
this.setState({stats: newState, strokes: newStrokes, period: realPeriod});
}
getShowedArray() {
let showed = [false, false, false, false];
for (let i = 0; i < showed.length; i++) {
showed[this.state.showed[i]] = true;
}
return showed;
}
}
export default AdminPanelStats;

10
client/src/core-components/toggle-list.js
View File

@ -35,16 +35,16 @@ class ToggleList extends React.Component {
let classes = {
'toggle-list__item': true,
'toggle-list__first-item': (index === 0),
'toggle-list__selected': _.includes(this.state.selected, index)
'toggle-list__selected': _.includes(this.getSelectedList(), index)
};
return classNames(classes);
}
selectItem(index) {
let newSelected = _.clone(this.state.selected);
let newSelected = _.clone(this.getSelectedList());
_.includes(this.state.selected, index) ? _.remove(newSelected, _index => _index == index) : newSelected.push(index);
_.includes(this.getSelectedList(), index) ? _.remove(newSelected, _index => _index == index) : newSelected.push(index);
this.setState({
selected: newSelected
@ -58,6 +58,10 @@ class ToggleList extends React.Component {
});
}
}
getSelectedList() {
return (this.props.values === undefined) ? this.state.selected : this.props.values;
}
}
export default ToggleList;

4
client/src/data/fixtures/system-fixtures.js
View File

@ -182,13 +182,13 @@ module.exports = [
date: '201701' + (i + 10) % 100,
type: 'SIGNUP',
general: 1,
value: (9 + i + Math.floor(Math.random() * (i / 15))).toString()
value: (9 + i + Math.floor(Math.random() * (i * 15))).toString()
});
DATA.push({
date: '201701' + (i + 10) % 100,
type: 'CLOSE',
general: 1,
value: (8 + i + Math.floor(Math.random() * i)).toString()
value: (8 + i + Math.floor(Math.random() * i * i * i * i)).toString()
});
DATA.push({
date: '201701' + (i + 10) % 100,