Merge branch 'feature/483' of https://github.com/tainacan/tainacan into feature/483
This commit is contained in:
commit
c196b510b8
|
@ -13,7 +13,7 @@ sass -E 'UTF-8' --cache-location .tmp/sass-cache-1 src/views/admin/scss/tainacan
|
||||||
|
|
||||||
sass -E 'UTF-8' --cache-location .tmp/sass-cache-2 src/views/roles/tainacan-roles.scss:src/assets/css/tainacan-roles.css
|
sass -E 'UTF-8' --cache-location .tmp/sass-cache-2 src/views/roles/tainacan-roles.scss:src/assets/css/tainacan-roles.css
|
||||||
|
|
||||||
sass -E 'UTF-8' --cache-location .tmp/sass-cache-3 src/views/roles/tainacan-roles.scss:src/assets/css/tainacan-reports.css
|
sass -E 'UTF-8' --cache-location .tmp/sass-cache-3 src/views/reports/tainacan-reports.scss:src/assets/css/tainacan-reports.css
|
||||||
|
|
||||||
sass -E 'UTF-8' --cache-location .tmp/sass-cache-4 src/views/gutenberg-blocks/tainacan-collections/collections-list/collections-list.scss:src/assets/css/tainacan-gutenberg-block-collections-list.css
|
sass -E 'UTF-8' --cache-location .tmp/sass-cache-4 src/views/gutenberg-blocks/tainacan-collections/collections-list/collections-list.scss:src/assets/css/tainacan-gutenberg-block-collections-list.css
|
||||||
|
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
#tainacan-reports-app .tainacan-icon::before {
|
||||||
|
opacity: 0.0; }
|
||||||
|
|
||||||
/*# sourceMappingURL=tainacan-reports.css.map */
|
/*# sourceMappingURL=tainacan-reports.css.map */
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{
|
{
|
||||||
"version": 3,
|
"version": 3,
|
||||||
"mappings": "",
|
"mappings": "AAEI,4CAAuB;EACnB,OAAO,EAAE,GAAG",
|
||||||
"sources": [],
|
"sources": ["../../views/reports/tainacan-reports.scss"],
|
||||||
"names": [],
|
"names": [],
|
||||||
"file": "tainacan-reports.css"
|
"file": "tainacan-reports.css"
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,25 +1,5 @@
|
||||||
import axios from '../../../axios';
|
import axios from '../../../axios';
|
||||||
|
|
||||||
export const fetchReports = ({ commit }, {} ) => {
|
|
||||||
|
|
||||||
let endpoint = `/reports`;
|
|
||||||
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
axios.tainacan.get(endpoint)
|
|
||||||
.then(res => {
|
|
||||||
let reports = res.data;
|
|
||||||
|
|
||||||
commit('setReports', reports);
|
|
||||||
|
|
||||||
resolve({
|
|
||||||
reports: reports,
|
|
||||||
total: res.headers['x-wp-total']
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch(error => reject(error));
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
export const fetchSummary = ({ commit }, { collectionId } ) => {
|
export const fetchSummary = ({ commit }, { collectionId } ) => {
|
||||||
|
|
||||||
let endpoint = '/reports';
|
let endpoint = '/reports';
|
||||||
|
@ -41,6 +21,27 @@ export const fetchSummary = ({ commit }, { collectionId } ) => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const fetchMetadata = ({ commit }, { collectionId } ) => {
|
||||||
|
|
||||||
|
let endpoint = '/reports';
|
||||||
|
|
||||||
|
if (collectionId && collectionId != 'default')
|
||||||
|
endpoint += '/collection/' + collectionId + '/metadata';
|
||||||
|
else
|
||||||
|
endpoint += '/repository/metadata';
|
||||||
|
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
axios.tainacan.get(endpoint)
|
||||||
|
.then(res => {
|
||||||
|
let metadata = res.data;
|
||||||
|
|
||||||
|
commit('setMetadata', metadata);
|
||||||
|
resolve(metadata);
|
||||||
|
})
|
||||||
|
.catch(error => reject(error));
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
export const fetchTaxonomiesList = ({ commit }, ) => {
|
export const fetchTaxonomiesList = ({ commit }, ) => {
|
||||||
|
|
||||||
let endpoint = '/reports/taxonomies/list'
|
let endpoint = '/reports/taxonomies/list'
|
||||||
|
|
|
@ -1,11 +1,23 @@
|
||||||
export const getReports = state => {
|
|
||||||
return state.reports;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const getSummary = state => {
|
export const getSummary = state => {
|
||||||
return state.summary;
|
return state.summary;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const getMetadata = state => {
|
||||||
|
return state.metadata;
|
||||||
|
};
|
||||||
|
|
||||||
export const getTaxonomiesList = state => {
|
export const getTaxonomiesList = state => {
|
||||||
return state.taxonomiesList;
|
return state.taxonomiesList;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const getStackedBarChartOptions = state => {
|
||||||
|
return state.stackedBarChartOptions;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const getHorizontalBarChartOptions = state => {
|
||||||
|
return state.horizontalBarChartOptions;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const getDonutChartOptions = state => {
|
||||||
|
return state.donutChartOptions;
|
||||||
|
};
|
||||||
|
|
|
@ -3,668 +3,131 @@ import * as getters from './getters';
|
||||||
import * as mutations from './mutations';
|
import * as mutations from './mutations';
|
||||||
|
|
||||||
const state = {
|
const state = {
|
||||||
reports: [
|
|
||||||
{
|
|
||||||
chartSeries: [44, 55, 13, 43, 22],
|
|
||||||
chartOptions: {
|
|
||||||
chart: {
|
|
||||||
width: 200,
|
|
||||||
type: 'pie',
|
|
||||||
toolbar: {
|
|
||||||
show: true
|
|
||||||
},
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
position: 'bottom'
|
|
||||||
},
|
|
||||||
labels: ['Team A', 'Team B', 'Team C', 'Team D', 'Team E'],
|
|
||||||
title: {
|
|
||||||
text: 'Pie chart'
|
|
||||||
},
|
|
||||||
responsive: [{
|
|
||||||
breakpoint: 1216,
|
|
||||||
options: {
|
|
||||||
chart: {
|
|
||||||
width: 380
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
position: 'left'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chartSeries: [
|
|
||||||
{
|
|
||||||
name: 'Marine Sprite',
|
|
||||||
data: [44, 55, 41, 37, 22]
|
|
||||||
}, {
|
|
||||||
name: 'Striking Calf',
|
|
||||||
data: [53, 32, 33, 52, 13]
|
|
||||||
}, {
|
|
||||||
name: 'Tank Picture',
|
|
||||||
data: [12, 17, 11, 9, 15]
|
|
||||||
}, {
|
|
||||||
name: 'Bucket Slope',
|
|
||||||
data: [9, 7, 5, 8, 6]
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartOptions: {
|
|
||||||
chart: {
|
|
||||||
type: 'bar',
|
|
||||||
height: 350,
|
|
||||||
stacked: true,
|
|
||||||
stackType: '100%',
|
|
||||||
},
|
|
||||||
plotOptions: {
|
|
||||||
bar: {
|
|
||||||
horizontal: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
stroke: {
|
|
||||||
width: 1,
|
|
||||||
colors: ['#fff']
|
|
||||||
},
|
|
||||||
title: {
|
|
||||||
text: '100% Stacked Bar'
|
|
||||||
},
|
|
||||||
xaxis: {
|
|
||||||
categories: [2008, 2009, 2010, 2011, 2012],
|
|
||||||
},
|
|
||||||
tooltip: {
|
|
||||||
y: {
|
|
||||||
formatter: function (val) {
|
|
||||||
return val + "K"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
fill: {
|
|
||||||
opacity: 1
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
position: 'top',
|
|
||||||
horizontalAlign: 'left',
|
|
||||||
offsetX: 40
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chartSeries: [
|
|
||||||
{
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
x: 'New Delhi',
|
|
||||||
y: 218
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Kolkata',
|
|
||||||
y: 149
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Mumbai',
|
|
||||||
y: 184
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Ahmedabad',
|
|
||||||
y: 55
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Bangaluru',
|
|
||||||
y: 84
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Pune',
|
|
||||||
y: 31
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Chennai',
|
|
||||||
y: 70
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Jaipur',
|
|
||||||
y: 30
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Surat',
|
|
||||||
y: 44
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Hyderabad',
|
|
||||||
y: 68
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Lucknow',
|
|
||||||
y: 28
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Indore',
|
|
||||||
y: 19
|
|
||||||
},
|
|
||||||
{
|
|
||||||
x: 'Kanpur',
|
|
||||||
y: 29
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartOptions: {
|
|
||||||
legend: {
|
|
||||||
show: false
|
|
||||||
},
|
|
||||||
chart: {
|
|
||||||
height: 350,
|
|
||||||
type: 'treemap'
|
|
||||||
},
|
|
||||||
title: {
|
|
||||||
text: 'Basic Treemap'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chartSeries: [
|
|
||||||
{
|
|
||||||
name: 'Net Profit',
|
|
||||||
data: [44, 55, 57, 56, 61, 58, 63, 60, 66]
|
|
||||||
}, {
|
|
||||||
name: 'Revenue',
|
|
||||||
data: [76, 85, 101, 98, 87, 105, 91, 114, 94]
|
|
||||||
}, {
|
|
||||||
name: 'Free Cash Flow',
|
|
||||||
data: [35, 41, 36, 26, 45, 48, 52, 53, 41]
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartOptions: {
|
|
||||||
chart: {
|
|
||||||
type: 'bar',
|
|
||||||
height: 350
|
|
||||||
},
|
|
||||||
plotOptions: {
|
|
||||||
bar: {
|
|
||||||
horizontal: false,
|
|
||||||
columnWidth: '55%',
|
|
||||||
endingShape: 'rounded'
|
|
||||||
},
|
|
||||||
},
|
|
||||||
dataLabels: {
|
|
||||||
enabled: false
|
|
||||||
},
|
|
||||||
stroke: {
|
|
||||||
show: true,
|
|
||||||
width: 2,
|
|
||||||
colors: ['transparent']
|
|
||||||
},
|
|
||||||
xaxis: {
|
|
||||||
categories: ['Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct'],
|
|
||||||
},
|
|
||||||
yaxis: {
|
|
||||||
title: {
|
|
||||||
text: '$ (thousands)'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
title: {
|
|
||||||
text: 'Vertical columns'
|
|
||||||
},
|
|
||||||
fill: {
|
|
||||||
opacity: 1
|
|
||||||
},
|
|
||||||
tooltip: {
|
|
||||||
y: {
|
|
||||||
formatter: function (val) {
|
|
||||||
return "$ " + val + " thousands"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chartSeries: [
|
|
||||||
{
|
|
||||||
data: [
|
|
||||||
[1327359600000,30.95],
|
|
||||||
[1327446000000,31.34],
|
|
||||||
[1327532400000,31.18],
|
|
||||||
[1327618800000,31.05],
|
|
||||||
[1327878000000,31.00],
|
|
||||||
[1327964400000,30.95],
|
|
||||||
[1328050800000,31.24],
|
|
||||||
[1328137200000,31.29],
|
|
||||||
[1328223600000,31.85],
|
|
||||||
[1328482800000,31.86],
|
|
||||||
[1328569200000,32.28],
|
|
||||||
[1328655600000,32.10],
|
|
||||||
[1328742000000,32.65],
|
|
||||||
[1328828400000,32.21],
|
|
||||||
[1329087600000,32.35],
|
|
||||||
[1329174000000,32.44],
|
|
||||||
[1329260400000,32.46],
|
|
||||||
[1329346800000,32.86],
|
|
||||||
[1329433200000,32.75],
|
|
||||||
[1329778800000,32.54],
|
|
||||||
[1329865200000,32.33],
|
|
||||||
[1329951600000,32.97],
|
|
||||||
[1330038000000,33.41],
|
|
||||||
[1330297200000,33.27],
|
|
||||||
[1330383600000,33.27],
|
|
||||||
[1330470000000,32.89],
|
|
||||||
[1330556400000,33.10],
|
|
||||||
[1330642800000,33.73],
|
|
||||||
[1330902000000,33.22],
|
|
||||||
[1330988400000,31.99],
|
|
||||||
[1331074800000,32.41],
|
|
||||||
[1331161200000,33.05],
|
|
||||||
[1331247600000,33.64],
|
|
||||||
[1331506800000,33.56],
|
|
||||||
[1331593200000,34.22],
|
|
||||||
[1331679600000,33.77],
|
|
||||||
[1331766000000,34.17],
|
|
||||||
[1331852400000,33.82],
|
|
||||||
[1332111600000,34.51],
|
|
||||||
[1332198000000,33.16],
|
|
||||||
[1332284400000,33.56],
|
|
||||||
[1332370800000,33.71],
|
|
||||||
[1332457200000,33.81],
|
|
||||||
[1332712800000,34.40],
|
|
||||||
[1332799200000,34.63],
|
|
||||||
[1332885600000,34.46],
|
|
||||||
[1332972000000,34.48],
|
|
||||||
[1333058400000,34.31],
|
|
||||||
[1333317600000,34.70],
|
|
||||||
[1333404000000,34.31],
|
|
||||||
[1333490400000,33.46],
|
|
||||||
[1333576800000,33.59],
|
|
||||||
[1333922400000,33.22],
|
|
||||||
[1334008800000,32.61],
|
|
||||||
[1334095200000,33.01],
|
|
||||||
[1334181600000,33.55],
|
|
||||||
[1334268000000,33.18],
|
|
||||||
[1334527200000,32.84],
|
|
||||||
[1334613600000,33.84],
|
|
||||||
[1334700000000,33.39],
|
|
||||||
[1334786400000,32.91],
|
|
||||||
[1334872800000,33.06],
|
|
||||||
[1335132000000,32.62],
|
|
||||||
[1335218400000,32.40],
|
|
||||||
[1335304800000,33.13],
|
|
||||||
[1335391200000,33.26],
|
|
||||||
[1335477600000,33.58],
|
|
||||||
[1335736800000,33.55],
|
|
||||||
[1335823200000,33.77],
|
|
||||||
[1335909600000,33.76],
|
|
||||||
[1335996000000,33.32],
|
|
||||||
[1336082400000,32.61],
|
|
||||||
[1336341600000,32.52],
|
|
||||||
[1336428000000,32.67],
|
|
||||||
[1336514400000,32.52],
|
|
||||||
[1336600800000,31.92],
|
|
||||||
[1336687200000,32.20],
|
|
||||||
[1336946400000,32.23],
|
|
||||||
[1337032800000,32.33],
|
|
||||||
[1337119200000,32.36],
|
|
||||||
[1337205600000,32.01],
|
|
||||||
[1337292000000,31.31],
|
|
||||||
[1337551200000,32.01],
|
|
||||||
[1337637600000,32.01],
|
|
||||||
[1337724000000,32.18],
|
|
||||||
[1337810400000,31.54],
|
|
||||||
[1337896800000,31.60],
|
|
||||||
[1338242400000,32.05],
|
|
||||||
[1338328800000,31.29],
|
|
||||||
[1338415200000,31.05],
|
|
||||||
[1338501600000,29.82],
|
|
||||||
[1338760800000,30.31],
|
|
||||||
[1338847200000,30.70],
|
|
||||||
[1338933600000,31.69],
|
|
||||||
[1339020000000,31.32],
|
|
||||||
[1339106400000,31.65],
|
|
||||||
[1339365600000,31.13],
|
|
||||||
[1339452000000,31.77],
|
|
||||||
[1339538400000,31.79],
|
|
||||||
[1339624800000,31.67],
|
|
||||||
[1339711200000,32.39],
|
|
||||||
[1339970400000,32.63],
|
|
||||||
[1340056800000,32.89],
|
|
||||||
[1340143200000,31.99],
|
|
||||||
[1340229600000,31.23],
|
|
||||||
[1340316000000,31.57],
|
|
||||||
[1340575200000,30.84],
|
|
||||||
[1340661600000,31.07],
|
|
||||||
[1340748000000,31.41],
|
|
||||||
[1340834400000,31.17],
|
|
||||||
[1340920800000,32.37],
|
|
||||||
[1341180000000,32.19],
|
|
||||||
[1341266400000,32.51],
|
|
||||||
[1341439200000,32.53],
|
|
||||||
[1341525600000,31.37],
|
|
||||||
[1341784800000,30.43],
|
|
||||||
[1341871200000,30.44],
|
|
||||||
[1341957600000,30.20],
|
|
||||||
[1342044000000,30.14],
|
|
||||||
[1342130400000,30.65],
|
|
||||||
[1342389600000,30.40],
|
|
||||||
[1342476000000,30.65],
|
|
||||||
[1342562400000,31.43],
|
|
||||||
[1342648800000,31.89],
|
|
||||||
[1342735200000,31.38],
|
|
||||||
[1342994400000,30.64],
|
|
||||||
[1343080800000,30.02],
|
|
||||||
[1343167200000,30.33],
|
|
||||||
[1343253600000,30.95],
|
|
||||||
[1343340000000,31.89],
|
|
||||||
[1343599200000,31.01],
|
|
||||||
[1343685600000,30.88],
|
|
||||||
[1343772000000,30.69],
|
|
||||||
[1343858400000,30.58],
|
|
||||||
[1343944800000,32.02],
|
|
||||||
[1344204000000,32.14],
|
|
||||||
[1344290400000,32.37],
|
|
||||||
[1344376800000,32.51],
|
|
||||||
[1344463200000,32.65],
|
|
||||||
[1344549600000,32.64],
|
|
||||||
[1344808800000,32.27],
|
|
||||||
[1344895200000,32.10],
|
|
||||||
[1344981600000,32.91],
|
|
||||||
[1345068000000,33.65],
|
|
||||||
[1345154400000,33.80],
|
|
||||||
[1345413600000,33.92],
|
|
||||||
[1345500000000,33.75],
|
|
||||||
[1345586400000,33.84],
|
|
||||||
[1345672800000,33.50],
|
|
||||||
[1345759200000,32.26],
|
|
||||||
[1346018400000,32.32],
|
|
||||||
[1346104800000,32.06],
|
|
||||||
[1346191200000,31.96],
|
|
||||||
[1346277600000,31.46],
|
|
||||||
[1346364000000,31.27],
|
|
||||||
[1346709600000,31.43],
|
|
||||||
[1346796000000,32.26],
|
|
||||||
[1346882400000,32.79],
|
|
||||||
[1346968800000,32.46],
|
|
||||||
[1347228000000,32.13],
|
|
||||||
[1347314400000,32.43],
|
|
||||||
[1347400800000,32.42],
|
|
||||||
[1347487200000,32.81],
|
|
||||||
[1347573600000,33.34],
|
|
||||||
[1347832800000,33.41],
|
|
||||||
[1347919200000,32.57],
|
|
||||||
[1348005600000,33.12],
|
|
||||||
[1348092000000,34.53],
|
|
||||||
[1348178400000,33.83],
|
|
||||||
[1348437600000,33.41],
|
|
||||||
[1348524000000,32.90],
|
|
||||||
[1348610400000,32.53],
|
|
||||||
[1348696800000,32.80],
|
|
||||||
[1348783200000,32.44],
|
|
||||||
[1349042400000,32.62],
|
|
||||||
[1349128800000,32.57],
|
|
||||||
[1349215200000,32.60],
|
|
||||||
[1349301600000,32.68],
|
|
||||||
[1349388000000,32.47],
|
|
||||||
[1349647200000,32.23],
|
|
||||||
[1349733600000,31.68],
|
|
||||||
[1349820000000,31.51],
|
|
||||||
[1349906400000,31.78],
|
|
||||||
[1349992800000,31.94],
|
|
||||||
[1350252000000,32.33],
|
|
||||||
[1350338400000,33.24],
|
|
||||||
[1350424800000,33.44],
|
|
||||||
[1350511200000,33.48],
|
|
||||||
[1350597600000,33.24],
|
|
||||||
[1350856800000,33.49],
|
|
||||||
[1350943200000,33.31],
|
|
||||||
[1351029600000,33.36],
|
|
||||||
[1351116000000,33.40],
|
|
||||||
[1351202400000,34.01],
|
|
||||||
[1351638000000,34.02],
|
|
||||||
[1351724400000,34.36],
|
|
||||||
[1351810800000,34.39],
|
|
||||||
[1352070000000,34.24],
|
|
||||||
[1352156400000,34.39],
|
|
||||||
[1352242800000,33.47],
|
|
||||||
[1352329200000,32.98],
|
|
||||||
[1352415600000,32.90],
|
|
||||||
[1352674800000,32.70],
|
|
||||||
[1352761200000,32.54],
|
|
||||||
[1352847600000,32.23],
|
|
||||||
[1352934000000,32.64],
|
|
||||||
[1353020400000,32.65],
|
|
||||||
[1353279600000,32.92],
|
|
||||||
[1353366000000,32.64],
|
|
||||||
[1353452400000,32.84],
|
|
||||||
[1353625200000,33.40],
|
|
||||||
[1353884400000,33.30],
|
|
||||||
[1353970800000,33.18],
|
|
||||||
[1354057200000,33.88],
|
|
||||||
[1354143600000,34.09],
|
|
||||||
[1354230000000,34.61],
|
|
||||||
[1354489200000,34.70],
|
|
||||||
[1354575600000,35.30],
|
|
||||||
[1354662000000,35.40],
|
|
||||||
[1354748400000,35.14],
|
|
||||||
[1354834800000,35.48],
|
|
||||||
[1355094000000,35.75],
|
|
||||||
[1355180400000,35.54],
|
|
||||||
[1355266800000,35.96],
|
|
||||||
[1355353200000,35.53],
|
|
||||||
[1355439600000,37.56],
|
|
||||||
[1355698800000,37.42],
|
|
||||||
[1355785200000,37.49],
|
|
||||||
[1355871600000,38.09],
|
|
||||||
[1355958000000,37.87],
|
|
||||||
[1356044400000,37.71],
|
|
||||||
[1356303600000,37.53],
|
|
||||||
[1356476400000,37.55],
|
|
||||||
[1356562800000,37.30],
|
|
||||||
[1356649200000,36.90],
|
|
||||||
[1356908400000,37.68],
|
|
||||||
[1357081200000,38.34],
|
|
||||||
[1357167600000,37.75],
|
|
||||||
[1357254000000,38.13],
|
|
||||||
[1357513200000,37.94],
|
|
||||||
[1357599600000,38.14],
|
|
||||||
[1357686000000,38.66],
|
|
||||||
[1357772400000,38.62],
|
|
||||||
[1357858800000,38.09],
|
|
||||||
[1358118000000,38.16],
|
|
||||||
[1358204400000,38.15],
|
|
||||||
[1358290800000,37.88],
|
|
||||||
[1358377200000,37.73],
|
|
||||||
[1358463600000,37.98],
|
|
||||||
[1358809200000,37.95],
|
|
||||||
[1358895600000,38.25],
|
|
||||||
[1358982000000,38.10],
|
|
||||||
[1359068400000,38.32],
|
|
||||||
[1359327600000,38.24],
|
|
||||||
[1359414000000,38.52],
|
|
||||||
[1359500400000,37.94],
|
|
||||||
[1359586800000,37.83],
|
|
||||||
[1359673200000,38.34],
|
|
||||||
[1359932400000,38.10],
|
|
||||||
[1360018800000,38.51],
|
|
||||||
[1360105200000,38.40],
|
|
||||||
[1360191600000,38.07],
|
|
||||||
[1360278000000,39.12],
|
|
||||||
[1360537200000,38.64],
|
|
||||||
[1360623600000,38.89],
|
|
||||||
[1360710000000,38.81],
|
|
||||||
[1360796400000,38.61],
|
|
||||||
[1360882800000,38.63],
|
|
||||||
[1361228400000,38.99],
|
|
||||||
[1361314800000,38.77],
|
|
||||||
[1361401200000,38.34],
|
|
||||||
[1361487600000,38.55],
|
|
||||||
[1361746800000,38.11],
|
|
||||||
[1361833200000,38.59],
|
|
||||||
[1361919600000,39.60],
|
|
||||||
]
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartOptions: {
|
|
||||||
chart: {
|
|
||||||
id: 'area-datetime',
|
|
||||||
type: 'area',
|
|
||||||
height: 350,
|
|
||||||
zoom: {
|
|
||||||
autoScaleYaxis: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
annotations: {
|
|
||||||
yaxis: [{
|
|
||||||
y: 30,
|
|
||||||
borderColor: '#999',
|
|
||||||
label: {
|
|
||||||
show: true,
|
|
||||||
text: 'Support',
|
|
||||||
style: {
|
|
||||||
color: "#fff",
|
|
||||||
background: '#00E396'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
xaxis: [{
|
|
||||||
x: new Date('14 Nov 2012').getTime(),
|
|
||||||
borderColor: '#999',
|
|
||||||
yAxisIndex: 0,
|
|
||||||
label: {
|
|
||||||
show: true,
|
|
||||||
text: 'Rally',
|
|
||||||
style: {
|
|
||||||
color: "#fff",
|
|
||||||
background: '#775DD0'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
dataLabels: {
|
|
||||||
enabled: false
|
|
||||||
},
|
|
||||||
markers: {
|
|
||||||
size: 0,
|
|
||||||
style: 'hollow',
|
|
||||||
},
|
|
||||||
xaxis: {
|
|
||||||
type: 'datetime',
|
|
||||||
min: new Date('01 Mar 2012').getTime(),
|
|
||||||
tickAmount: 6,
|
|
||||||
},
|
|
||||||
tooltip: {
|
|
||||||
x: {
|
|
||||||
format: 'dd MMM yyyy'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
fill: {
|
|
||||||
type: 'gradient',
|
|
||||||
gradient: {
|
|
||||||
shadeIntensity: 1,
|
|
||||||
opacityFrom: 0.7,
|
|
||||||
opacityTo: 0.9,
|
|
||||||
stops: [0, 100]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chartSeries:
|
|
||||||
[
|
|
||||||
{
|
|
||||||
name: 'Metric1',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric2',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric3',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric4',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric5',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric6',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric7',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric8',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Metric9',
|
|
||||||
data: generateData(20, {
|
|
||||||
min: 0,
|
|
||||||
max: 90
|
|
||||||
})
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartOptions: {
|
|
||||||
chart: {
|
|
||||||
height: 350,
|
|
||||||
type: 'heatmap',
|
|
||||||
},
|
|
||||||
dataLabels: {
|
|
||||||
enabled: false
|
|
||||||
},
|
|
||||||
colors: ["#298596"],
|
|
||||||
xaxis: {
|
|
||||||
type: 'category',
|
|
||||||
},
|
|
||||||
title: {
|
|
||||||
text: 'HeatMap Chart (Single color)'
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
],
|
|
||||||
summary: {},
|
summary: {},
|
||||||
taxonomiesList: {}
|
taxonomiesList: {},
|
||||||
};
|
metadata: {},
|
||||||
function generateData (count, yrange) {
|
stackedBarChartOptions: {
|
||||||
var i = 0;
|
chart: {
|
||||||
var series = [];
|
type: 'bar',
|
||||||
while (i < count) {
|
height: 350,
|
||||||
var x = (i + 1).toString();
|
stacked: true,
|
||||||
var y = Math.floor(Math.random() * (yrange.max - yrange.min + 1)) + yrange.min;
|
toolbar: {
|
||||||
series.push({
|
show: true
|
||||||
x: x,
|
},
|
||||||
y: y
|
zoom: {
|
||||||
});
|
enabled: true,
|
||||||
i++;
|
autoScaleYaxis: true,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
text: ''
|
||||||
|
},
|
||||||
|
responsive: [{
|
||||||
|
breakpoint: 480,
|
||||||
|
options: {
|
||||||
|
legend: {
|
||||||
|
position: 'bottom',
|
||||||
|
offsetX: -10,
|
||||||
|
offsetY: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
plotOptions: {
|
||||||
|
bar: {
|
||||||
|
borderRadius: 0,
|
||||||
|
horizontal: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
xaxis: {
|
||||||
|
type: 'category',
|
||||||
|
tickPlacement: 'on',
|
||||||
|
categories: []
|
||||||
|
},
|
||||||
|
yaxis: {
|
||||||
|
title: {
|
||||||
|
text: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
position: 'right',
|
||||||
|
offsetY: 40
|
||||||
|
},
|
||||||
|
fill: {
|
||||||
|
opacity: 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
donutChartOptions: {
|
||||||
|
chart: {
|
||||||
|
type: 'donut',
|
||||||
|
toolbar: {
|
||||||
|
show: true
|
||||||
|
},
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
text: ''
|
||||||
|
},
|
||||||
|
stroke: {
|
||||||
|
width: 0
|
||||||
|
},
|
||||||
|
labels: [],
|
||||||
|
responsive: [{
|
||||||
|
breakpoint: 480,
|
||||||
|
options: {
|
||||||
|
chart: {
|
||||||
|
width: 200
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
position: 'bottom'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
horizontalBarChartOptions: {
|
||||||
|
chart: {
|
||||||
|
type: 'bar',
|
||||||
|
height: 350,
|
||||||
|
stacked: true,
|
||||||
|
stackType: '100%',
|
||||||
|
toolbar: {
|
||||||
|
show: true
|
||||||
|
},
|
||||||
|
zoom: {
|
||||||
|
enabled: true,
|
||||||
|
autoScaleYaxis: true,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
plotOptions: {
|
||||||
|
bar: {
|
||||||
|
horizontal: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
text: ''
|
||||||
|
},
|
||||||
|
xaxis: {
|
||||||
|
type: 'category',
|
||||||
|
tickPlacement: 'on',
|
||||||
|
categories: [],
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
y: {
|
||||||
|
formatter: function (val) {
|
||||||
|
return val + "%"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fill: {
|
||||||
|
opacity: 1
|
||||||
|
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
position: 'top',
|
||||||
|
horizontalAlign: 'left',
|
||||||
|
offsetX: 40,
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return series;
|
};
|
||||||
}
|
|
||||||
export default {
|
export default {
|
||||||
namespaced: true,
|
namespaced: true,
|
||||||
state,
|
state,
|
||||||
|
|
|
@ -1,11 +1,23 @@
|
||||||
export const setReports = (state, reports) => {
|
|
||||||
state.reports = reports;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const setSummary = (state, summary) => {
|
export const setSummary = (state, summary) => {
|
||||||
state.summary = summary;
|
state.summary = summary;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const setMetadata = (state, metadata) => {
|
||||||
|
state.metadata = metadata;
|
||||||
|
};
|
||||||
|
|
||||||
export const setTaxonomiesList = (state, taxonomiesList) => {
|
export const setTaxonomiesList = (state, taxonomiesList) => {
|
||||||
state.taxonomiesList = taxonomiesList;
|
state.taxonomiesList = taxonomiesList;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const setStackedBarChartOptions = (state, stackedBarChartOptions) => {
|
||||||
|
state.stackedBarChartOptions = stackedBarChartOptions;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const setHorizontalBarChartOptions = (state, horizontalBarChartOptions) => {
|
||||||
|
state.horizontalBarChartOptions = horizontalBarChartOptions;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const setDonutChartOptions = (state, donutChartOptions) => {
|
||||||
|
state.donutChartOptions = donutChartOptions;
|
||||||
|
};
|
|
@ -1,16 +0,0 @@
|
||||||
<template>
|
|
||||||
<apexchart
|
|
||||||
height="380px"
|
|
||||||
:options="chartOptions"
|
|
||||||
:series="chartSeries" />
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
chartTitle: String,
|
|
||||||
chartOptions: Object,
|
|
||||||
chartSeries: Array
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
|
@ -1,9 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="number-block">
|
||||||
<p class="title is-2">
|
<p class="title is-2">
|
||||||
<i-count-up
|
<i-count-up
|
||||||
:delay="750"
|
:delay="750"
|
||||||
:end-val="total" />
|
:end-val="total"
|
||||||
|
:options="{ separator: ' ' }" />
|
||||||
</p>
|
</p>
|
||||||
<p class="subtitle is-3">
|
<p class="subtitle is-3">
|
||||||
<span class="icon has-text-gray">
|
<span class="icon has-text-gray">
|
||||||
|
@ -21,7 +22,8 @@
|
||||||
<span class="value">
|
<span class="value">
|
||||||
<i-count-up
|
<i-count-up
|
||||||
:delay="750"
|
:delay="750"
|
||||||
:end-val="totalByStatus[statusOption.slug]" />
|
:end-val="totalByStatus[statusOption.slug]"
|
||||||
|
:options="{ separator: ' ' }" />
|
||||||
|
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
|
@ -57,9 +59,9 @@ export default {
|
||||||
totalByStatus() {
|
totalByStatus() {
|
||||||
return {
|
return {
|
||||||
'publish': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].publish : 0,
|
'publish': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].publish : 0,
|
||||||
'private': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].private : 0,
|
'private': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].private : 0,
|
||||||
'draft': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].draft : 0,
|
'draft': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].draft : 0,
|
||||||
'trash': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].trash : 0
|
'trash': this.summary && this.summary.totals && this.summary.totals[this.entityType] ? this.summary.totals[this.entityType].trash : 0
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -67,9 +69,20 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
.number-block {
|
||||||
|
min-height: 226px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-content
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
margin-top: 0.25em;
|
margin-top: 0.25em;
|
||||||
}
|
}
|
||||||
|
.subtitle {
|
||||||
|
padding-left: 0;
|
||||||
|
padding-right: 0;
|
||||||
|
}
|
||||||
.status-list {
|
.status-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
@ -78,4 +91,5 @@ export default {
|
||||||
margin: 0 1em;
|
margin: 0 1em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
|
@ -15,7 +15,6 @@ import {
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
|
||||||
import ReportsPage from '../reports.vue';
|
import ReportsPage from '../reports.vue';
|
||||||
import ChartBlock from '../components/chart-block.vue';
|
|
||||||
import NumberBlock from '../components/number-block.vue';
|
import NumberBlock from '../components/number-block.vue';
|
||||||
|
|
||||||
Vue.use(VueApexCharts)
|
Vue.use(VueApexCharts)
|
||||||
|
@ -37,7 +36,6 @@ Vue.use(VTooltip);
|
||||||
Vue.use(Snackbar);
|
Vue.use(Snackbar);
|
||||||
Vue.use(Modal);
|
Vue.use(Modal);
|
||||||
|
|
||||||
Vue.component('chart-block', ChartBlock);
|
|
||||||
Vue.component('number-block', NumberBlock);
|
Vue.component('number-block', NumberBlock);
|
||||||
Vue.component('apexchart', VueApexCharts);
|
Vue.component('apexchart', VueApexCharts);
|
||||||
|
|
||||||
|
@ -58,7 +56,7 @@ new Vue({
|
||||||
listen("load", window, function() {
|
listen("load", window, function() {
|
||||||
var iconsStyle = document.createElement("style");
|
var iconsStyle = document.createElement("style");
|
||||||
iconsStyle.setAttribute('type', 'text/css');
|
iconsStyle.setAttribute('type', 'text/css');
|
||||||
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
iconsStyle.innerText = '.tainacan-icon::before{ opacity: 1.0 !important; }';
|
||||||
document.head.appendChild(iconsStyle);
|
document.head.appendChild(iconsStyle);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -76,11 +74,11 @@ function listen(evnt, elem, func) {
|
||||||
return r;
|
return r;
|
||||||
} else if (document.head) {
|
} else if (document.head) {
|
||||||
var iconHideStyle = document.createElement("style");
|
var iconHideStyle = document.createElement("style");
|
||||||
iconHideStyle.innerText = '.tainacan-icon{ font-size: 0px !important; }';
|
iconHideStyle.innerText = '.tainacan-icon::before{ opacity: 0.0 !important; }';
|
||||||
document.head.appendChild(iconHideStyle);
|
document.head.appendChild(iconHideStyle);
|
||||||
} else {
|
} else {
|
||||||
var iconHideStyle = document.createElement("style");
|
var iconHideStyle = document.createElement("style");
|
||||||
iconHideStyle.innerText = '.tainacan-icon{ font-size: 0px !important; }';
|
iconHideStyle.innerText = '.tainacan-icon::before{ opacity: 0.0 !important; }';
|
||||||
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
|
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -25,7 +25,7 @@
|
||||||
class="postbox"
|
class="postbox"
|
||||||
:source-collection="selectedCollection"
|
:source-collection="selectedCollection"
|
||||||
:summary="summary"
|
:summary="summary"
|
||||||
entity-type="collections"/>
|
entity-type="collections" />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
:class="{ 'is-one-third-tablet': !selectedCollection || selectedCollection == 'default' }"
|
:class="{ 'is-one-third-tablet': !selectedCollection || selectedCollection == 'default' }"
|
||||||
|
@ -45,44 +45,68 @@
|
||||||
class="postbox"
|
class="postbox"
|
||||||
:source-collection="selectedCollection"
|
:source-collection="selectedCollection"
|
||||||
:summary="summary"
|
:summary="summary"
|
||||||
entity-type="taxonomies"/>
|
entity-type="taxonomies" />
|
||||||
</div>
|
</div>
|
||||||
<div class="column is-full">
|
<div
|
||||||
<chart-block
|
v-if="!selectedCollection || selectedCollection == 'default'"
|
||||||
:class="{ 'skeleton': isFetchingTaxonomiesList}"
|
class="column is-full">
|
||||||
|
<apexchart
|
||||||
|
v-if="!isFetchingTaxonomiesList"
|
||||||
|
height="380px"
|
||||||
class="postbox"
|
class="postbox"
|
||||||
:chart-series="taxonomiesListChartSeries"
|
:series="taxonomiesListChartSeries"
|
||||||
:chart-options="taxonomiesListChartOptions" />
|
:options="taxonomiesListChartOptions" />
|
||||||
</div>
|
<div
|
||||||
<div class="column is-half is-one-quarter-widescreen">
|
v-else
|
||||||
<chart-block
|
style="min-height=380px"
|
||||||
class="postbox"
|
class="skeleton postbox" />
|
||||||
:chart-series="reports[0].chartSeries"
|
|
||||||
:chart-options="reports[0].chartOptions" />
|
|
||||||
</div>
|
|
||||||
<div class="column is-half is-one-quarter-widescreen">
|
|
||||||
<chart-block
|
|
||||||
class="postbox"
|
|
||||||
:chart-series="reports[1].chartSeries"
|
|
||||||
:chart-options="reports[1].chartOptions" />
|
|
||||||
</div>
|
</div>
|
||||||
|
<template v-else>
|
||||||
|
<div class="column is-full is-half-desktop">
|
||||||
|
<apexchart
|
||||||
|
v-if="!isFetchingMetadata"
|
||||||
|
height="380px"
|
||||||
|
class="postbox"
|
||||||
|
:series="metadataTypeChartSeries"
|
||||||
|
:options="metadataTypeChartOptions" />
|
||||||
|
<div
|
||||||
|
v-else
|
||||||
|
style="min-height=380px"
|
||||||
|
class="skeleton postbox" />
|
||||||
|
</div>
|
||||||
|
<div class="column is-full is-half-desktop">
|
||||||
|
<apexchart
|
||||||
|
v-if="!isFetchingMetadata"
|
||||||
|
height="380px"
|
||||||
|
class="postbox"
|
||||||
|
:series="metadataDistributionChartSeries"
|
||||||
|
:options="metadataDistributionChartOptions" />
|
||||||
|
<div
|
||||||
|
v-else
|
||||||
|
style="min-height=380px"
|
||||||
|
class="skeleton postbox" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
<div class="column is-full is-half-widescreen">
|
<div class="column is-full is-half-widescreen">
|
||||||
<chart-block
|
<!-- <apexchart
|
||||||
|
height="380px"
|
||||||
class="postbox"
|
class="postbox"
|
||||||
:chart-series="reports[2].chartSeries"
|
:series="reports[2].chartSeries"
|
||||||
:chart-options="reports[2].chartOptions" />
|
:options="reports[2].chartOptions" /> -->
|
||||||
</div>
|
</div>
|
||||||
<div class="column is-full is-half-desktop">
|
<div class="column is-full is-half-desktop">
|
||||||
<chart-block
|
<!-- <apexchart
|
||||||
|
height="380px"
|
||||||
class="postbox"
|
class="postbox"
|
||||||
:chart-series="reports[4].chartSeries"
|
:series="reports[4].chartSeries"
|
||||||
:chart-options="reports[4].chartOptions" />
|
:options="reports[4].chartOptions" /> -->
|
||||||
</div>
|
</div>
|
||||||
<div class="column is-full is-half-desktop">
|
<div class="column is-full is-half-desktop">
|
||||||
<chart-block
|
<!-- <apexchart
|
||||||
|
height="380px"
|
||||||
class="postbox"
|
class="postbox"
|
||||||
:chart-series="reports[5].chartSeries"
|
:series="reports[5].chartSeries"
|
||||||
:chart-options="reports[5].chartOptions" />
|
:options="reports[5].chartOptions" /> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -99,8 +123,13 @@ export default {
|
||||||
isFetchingCollections: false,
|
isFetchingCollections: false,
|
||||||
isFetchingSummary: false,
|
isFetchingSummary: false,
|
||||||
isFetchingTaxonomiesList: false,
|
isFetchingTaxonomiesList: false,
|
||||||
|
isFetchingMetadata: false,
|
||||||
taxonomiesListChartSeries: [],
|
taxonomiesListChartSeries: [],
|
||||||
taxonomiesListChartOptions: {}
|
taxonomiesListChartOptions: {},
|
||||||
|
metadataTypeChartSeries: [],
|
||||||
|
metadataTypeChartOptions: {},
|
||||||
|
metadataDistributionChartSeries: [],
|
||||||
|
metadataDistributionChartOptions: {}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -108,9 +137,12 @@ export default {
|
||||||
collections: 'getCollections',
|
collections: 'getCollections',
|
||||||
}),
|
}),
|
||||||
...mapGetters('report', {
|
...mapGetters('report', {
|
||||||
reports: 'getReports',
|
|
||||||
summary: 'getSummary',
|
summary: 'getSummary',
|
||||||
taxonomiesList: 'getTaxonomiesList'
|
metadata: 'getMetadata',
|
||||||
|
taxonomiesList: 'getTaxonomiesList',
|
||||||
|
stackedBarChartOptions: 'getStackedBarChartOptions',
|
||||||
|
donutChartOptions: 'getDonutChartOptions',
|
||||||
|
horizontalBarChartOptions: 'getHorizontalBarChartOptions'
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
@ -118,6 +150,11 @@ export default {
|
||||||
handler(to) {
|
handler(to) {
|
||||||
this.selectedCollection = to['collection'] ? to['collection'] : 'default';
|
this.selectedCollection = to['collection'] ? to['collection'] : 'default';
|
||||||
this.loadSummary();
|
this.loadSummary();
|
||||||
|
|
||||||
|
if (this.selectedCollection && this.selectedCollection != 'default')
|
||||||
|
this.loadMetadata();
|
||||||
|
else
|
||||||
|
this.loadTaxonomiesList();
|
||||||
},
|
},
|
||||||
immediate: true
|
immediate: true
|
||||||
}
|
}
|
||||||
|
@ -127,15 +164,7 @@ export default {
|
||||||
this.selectedCollection = this.$route.query['collection'] ? this.$route.query['collection'] : 'default';
|
this.selectedCollection = this.$route.query['collection'] ? this.$route.query['collection'] : 'default';
|
||||||
|
|
||||||
// Loads collection for the select input
|
// Loads collection for the select input
|
||||||
this.isFetchingCollections = true;
|
this.loadCollections();
|
||||||
this.fetchAllCollectionNames()
|
|
||||||
.then(() => {
|
|
||||||
this.loadSummary();
|
|
||||||
this.isFetchingCollections = false;
|
|
||||||
})
|
|
||||||
.catch(() => this.isFetchingCollections = false);
|
|
||||||
|
|
||||||
this.loadTaxonomiesList();
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions('collection', [
|
...mapActions('collection', [
|
||||||
|
@ -143,29 +172,99 @@ export default {
|
||||||
]),
|
]),
|
||||||
...mapActions('report', [
|
...mapActions('report', [
|
||||||
'fetchSummary',
|
'fetchSummary',
|
||||||
'fetchTaxonomiesList'
|
'fetchTaxonomiesList',
|
||||||
]),
|
'fetchMetadata'
|
||||||
...mapGetters('report', [
|
|
||||||
'getTaxonomiesList'
|
|
||||||
]),
|
]),
|
||||||
|
loadCollections() {
|
||||||
|
this.isFetchingCollections = true;
|
||||||
|
this.fetchAllCollectionNames()
|
||||||
|
.then(() => this.isFetchingCollections = false)
|
||||||
|
.catch(() => this.isFetchingCollections = false);
|
||||||
|
},
|
||||||
loadSummary() {
|
loadSummary() {
|
||||||
this.isFetchingSummary = true;
|
this.isFetchingSummary = true;
|
||||||
this.fetchSummary({ collectionId: this.selectedCollection })
|
this.fetchSummary({ collectionId: this.selectedCollection })
|
||||||
.then(() => this.isFetchingSummary = false)
|
.then(() => this.isFetchingSummary = false)
|
||||||
.catch(() => this.isFetchingSummary = false);
|
.catch(() => this.isFetchingSummary = false);
|
||||||
},
|
},
|
||||||
|
loadMetadata() {
|
||||||
|
this.isFetchingMetadata = true;
|
||||||
|
this.fetchMetadata({ collectionId: this.selectedCollection })
|
||||||
|
.then(() => {
|
||||||
|
|
||||||
|
// Building Metadata Type Donut Chart
|
||||||
|
let metadataTypeValues = [];
|
||||||
|
let metadataTypeLabels = [];
|
||||||
|
|
||||||
|
for (const metadataType in this.metadata.totals.metadata_per_type) {
|
||||||
|
metadataTypeValues.push(this.metadata.totals.metadata_per_type[metadataType]);
|
||||||
|
metadataTypeLabels.push(metadataType);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.metadataTypeChartSeries = metadataTypeValues;
|
||||||
|
this.metadataTypeChartOptions = {
|
||||||
|
...this.donutChartOptions,
|
||||||
|
...{
|
||||||
|
title: {
|
||||||
|
text: this.$i18n.get('metadata_types')
|
||||||
|
},
|
||||||
|
labels: metadataTypeLabels,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Building Metadata Distribution Bar chart
|
||||||
|
const orderedMetadataDistributions = Object.values(this.metadata.distribution).sort((a, b) => b.fill_percentage - a.fill_percentage);
|
||||||
|
let metadataDistributionValues = [];
|
||||||
|
let metadataDistributionValuesInverted = [];
|
||||||
|
let metadataDistributionLabels = [];
|
||||||
|
|
||||||
|
orderedMetadataDistributions.forEach(metadataDistribution => {
|
||||||
|
metadataDistributionValues.push(parseFloat(metadataDistribution.fill_percentage));
|
||||||
|
metadataDistributionValuesInverted.push(100.0000 - parseFloat(metadataDistribution.fill_percentage).toFixed(4));
|
||||||
|
metadataDistributionLabels.push(metadataDistribution.name);
|
||||||
|
})
|
||||||
|
|
||||||
|
this.metadataDistributionChartSeries = [
|
||||||
|
{
|
||||||
|
name: this.$i18n.get('label_filled'),
|
||||||
|
data: metadataDistributionValues
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: this.$i18n.get('label_not_filled'),
|
||||||
|
data: metadataDistributionValuesInverted
|
||||||
|
}
|
||||||
|
];
|
||||||
|
this.metadataDistributionChartOptions = {
|
||||||
|
...this.horizontalBarChartOptions,
|
||||||
|
...{
|
||||||
|
title: {
|
||||||
|
text: this.$i18n.get('label_metadata_fill_distribution')
|
||||||
|
},
|
||||||
|
labels: metadataDistributionLabels,
|
||||||
|
colors: ['#25a189', '#a23939']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.isFetchingMetadata = false;
|
||||||
|
})
|
||||||
|
.catch(() => this.isFetchingMetadata = false);
|
||||||
|
},
|
||||||
loadTaxonomiesList() {
|
loadTaxonomiesList() {
|
||||||
this.isFetchingTaxonomiesList = true;
|
this.isFetchingTaxonomiesList = true;
|
||||||
this.fetchTaxonomiesList()
|
this.fetchTaxonomiesList()
|
||||||
.then(() => {
|
.then(() => {
|
||||||
|
|
||||||
|
// Building Taxonomy term usage chart
|
||||||
|
const orderedTaxonomies = Object.values(this.taxonomiesList).sort((a, b) => a.total_terms - b.total_terms);
|
||||||
let termsUsed = [];
|
let termsUsed = [];
|
||||||
let termsNotUsed = [];
|
let termsNotUsed = [];
|
||||||
let taxonomiesLabels = [];
|
let taxonomiesLabels = [];
|
||||||
for (const taxonomy in this.taxonomiesList) {
|
|
||||||
termsUsed.push(this.taxonomiesList[taxonomy].total_terms_used);
|
orderedTaxonomies.forEach(taxonomy => {
|
||||||
termsNotUsed.push(this.taxonomiesList[taxonomy].total_terms_not_used);
|
termsUsed.push(taxonomy.total_terms_used);
|
||||||
taxonomiesLabels.push(this.taxonomiesList[taxonomy].name);
|
termsNotUsed.push(taxonomy.total_terms_not_used);
|
||||||
}
|
taxonomiesLabels.push(taxonomy.name);
|
||||||
|
});
|
||||||
|
|
||||||
this.taxonomiesListChartSeries = [
|
this.taxonomiesListChartSeries = [
|
||||||
{
|
{
|
||||||
|
@ -179,53 +278,21 @@ export default {
|
||||||
];
|
];
|
||||||
|
|
||||||
this.taxonomiesListChartOptions = {
|
this.taxonomiesListChartOptions = {
|
||||||
chart: {
|
...this.stackedBarChartOptions,
|
||||||
type: 'bar',
|
...{
|
||||||
height: 350,
|
title: {
|
||||||
stacked: true,
|
text: this.$i18n.get('label_usage_of_terms_per_taxonomy')
|
||||||
toolbar: {
|
|
||||||
show: true
|
|
||||||
},
|
},
|
||||||
zoom: {
|
xaxis: {
|
||||||
enabled: true,
|
type: 'category',
|
||||||
autoScaleYaxis: true,
|
tickPlacement: 'on',
|
||||||
}
|
categories: taxonomiesLabels,
|
||||||
},
|
},
|
||||||
title: {
|
yaxis: {
|
||||||
text: this.$i18n.get('label_usage_of_terms_per_taxonomy')
|
title: {
|
||||||
},
|
text: this.$i18n.get('label_number of terms')
|
||||||
responsive: [{
|
|
||||||
breakpoint: 480,
|
|
||||||
options: {
|
|
||||||
legend: {
|
|
||||||
position: 'bottom',
|
|
||||||
offsetX: -10,
|
|
||||||
offsetY: 0
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}],
|
|
||||||
plotOptions: {
|
|
||||||
bar: {
|
|
||||||
borderRadius: 0,
|
|
||||||
horizontal: false,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
xaxis: {
|
|
||||||
type: 'category',
|
|
||||||
tickPlacement: 'on',
|
|
||||||
categories: taxonomiesLabels,
|
|
||||||
},
|
|
||||||
yaxis: {
|
|
||||||
title: {
|
|
||||||
text: this.$i18n.get('label_number of terms')
|
|
||||||
}
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
position: 'right',
|
|
||||||
offsetY: 40
|
|
||||||
},
|
|
||||||
fill: {
|
|
||||||
opacity: 1
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -242,5 +309,6 @@ export default {
|
||||||
padding: 1.125rem 1.25rem;
|
padding: 1.125rem 1.25rem;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
min-height: 380px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
|
@ -1,6 +1,6 @@
|
||||||
#tainacan-reports-app {
|
#tainacan-reports-app {
|
||||||
// Tainacan Loading
|
// Tainacan Loading
|
||||||
.tainacan-icon {
|
.tainacan-icon::before {
|
||||||
font-size: inherit; // Will make it 1 once window.load is done;
|
opacity: 0.0; // Will make it 1 once window.load is done;
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -21,6 +21,7 @@ return apply_filters( 'tainacan-admin-i18n', [
|
||||||
'collections' => __( 'Collections', 'tainacan' ),
|
'collections' => __( 'Collections', 'tainacan' ),
|
||||||
'items' => __( 'Items', 'tainacan' ),
|
'items' => __( 'Items', 'tainacan' ),
|
||||||
'metadata' => __( 'Metadata', 'tainacan' ),
|
'metadata' => __( 'Metadata', 'tainacan' ),
|
||||||
|
'metadata_types' => __( 'Metadata types', 'tainacan' ),
|
||||||
'filters' => __( 'Filters', 'tainacan' ),
|
'filters' => __( 'Filters', 'tainacan' ),
|
||||||
'taxonomies' => __( 'Taxonomies', 'tainacan' ),
|
'taxonomies' => __( 'Taxonomies', 'tainacan' ),
|
||||||
'activities' => __( 'Activities', 'tainacan' ),
|
'activities' => __( 'Activities', 'tainacan' ),
|
||||||
|
@ -496,6 +497,9 @@ return apply_filters( 'tainacan-admin-i18n', [
|
||||||
'label_number of terms' => __( 'Number of terms', 'tainacan' ),
|
'label_number of terms' => __( 'Number of terms', 'tainacan' ),
|
||||||
'label_usage_of_terms_per_taxonomy' => __( 'Usage of terms per taxonomy', 'tainacan' ),
|
'label_usage_of_terms_per_taxonomy' => __( 'Usage of terms per taxonomy', 'tainacan' ),
|
||||||
'label_loading_report' => __( 'Loading report...', 'tainacan' ),
|
'label_loading_report' => __( 'Loading report...', 'tainacan' ),
|
||||||
|
'label_metadata_fill_distribution' => __( 'Metadata fill distribution', 'tainacan' ),
|
||||||
|
'label_not_filled' => __( 'Not filled yet', 'tainacan' ),
|
||||||
|
'label_filled' => __( 'Already filled', 'tainacan' ),
|
||||||
|
|
||||||
// Instructions. More complex sentences to guide user and placeholders
|
// Instructions. More complex sentences to guide user and placeholders
|
||||||
'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),
|
'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),
|
||||||
|
|
Loading…
Reference in New Issue