watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-04 04:37:11 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

MySQL query optimization. Added loading component.

Browse source
This commit is contained in:
Mike Cao 2020-08-27 23:45:37 -07:00
parent a7e7469d22
commit ccb98f836f
13 changed files with 158 additions and 109 deletions
Download patch file Download diff file Expand all files Collapse all files

60
components/metrics/PageviewsChart.js
View file

@ -1,16 +1,15 @@
import React from 'react';
import CheckVisible from 'components/helpers/CheckVisible';
import BarChart from './BarChart';
export default function PageviewsChart({ websiteId, data, unit, className, animationDuration }) {
export default function PageviewsChart({ websiteId, data, unit, className }) {
const handleUpdate = chart => {
const {
data: { datasets },
options,
} = chart;
datasets[0].data = data.uniques;
datasets[1].data = data.pageviews;
options.animation.duration = animationDuration;
chart.update();
};
@ -20,30 +19,35 @@ export default function PageviewsChart({ websiteId, data, unit, className, anima
}
return (
<BarChart
className={className}
chartId={websiteId}
datasets={[
{
label: 'unique visitors',
data: data.uniques,
lineTension: 0,
backgroundColor: 'rgb(38, 128, 235, 0.4)',
borderColor: 'rgb(13, 102, 208, 0.4)',
borderWidth: 1,
},
{
label: 'page views',
data: data.pageviews,
lineTension: 0,
backgroundColor: 'rgb(38, 128, 235, 0.2)',
borderColor: 'rgb(13, 102, 208, 0.2)',
borderWidth: 1,
},
]}
unit={unit}
records={data.pageviews.length}
onUpdate={handleUpdate}
/>
<CheckVisible>
{visible => (
<BarChart
className={className}
chartId={websiteId}
datasets={[
{
label: 'unique visitors',
data: data.uniques,
lineTension: 0,
backgroundColor: 'rgb(38, 128, 235, 0.4)',
borderColor: 'rgb(13, 102, 208, 0.4)',
borderWidth: 1,
},
{
label: 'page views',
data: data.pageviews,
lineTension: 0,
backgroundColor: 'rgb(38, 128, 235, 0.2)',
borderColor: 'rgb(13, 102, 208, 0.2)',
borderWidth: 1,
},
]}
unit={unit}
records={data.pageviews.length}
animationDuration={visible ? 300 : 0}
onUpdate={handleUpdate}
/>
)}
</CheckVisible>
);
}