add analytics in assets
This commit is contained in:
parent
690e117b0b
commit
b32509401c
|
@ -23,3 +23,4 @@ require('./modules/sortable.js')()
|
|||
require('./modules/batch.js')()
|
||||
require('./modules/file-manager.js')()
|
||||
require('./modules/file-picker.js')()
|
||||
require('./modules/analytics.js')()
|
||||
|
|
53
assets/js/admin/modules/analytics.js
Normal file
53
assets/js/admin/modules/analytics.js
Normal file
|
@ -0,0 +1,53 @@
|
|||
const $ = require('jquery')
|
||||
const Chart = require('chart.js/auto').default
|
||||
|
||||
const drawChart = () => {
|
||||
const ctx = document.getElementById('analytic-chart')
|
||||
const options = {
|
||||
type: 'bar',
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
scales: {
|
||||
y: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}
|
||||
},
|
||||
data: {
|
||||
labels: JSON.parse(ctx.getAttribute('data-labels')),
|
||||
datasets: [{
|
||||
label: ctx.getAttribute('data-label'),
|
||||
data: JSON.parse(ctx.getAttribute('data-values')),
|
||||
backgroundColor: 'rgba(54, 162, 235, 0.2)',
|
||||
borderColor: 'rgb(54, 162, 235)',
|
||||
borderWidth: 1
|
||||
}]
|
||||
}
|
||||
}
|
||||
|
||||
const chart = new Chart(ctx, options)
|
||||
|
||||
const resize = () => {
|
||||
const width = ctx.parentNode.parentNode.offsetWidth
|
||||
const height = 250
|
||||
|
||||
chart.resize(width, height)
|
||||
}
|
||||
|
||||
resize()
|
||||
|
||||
window.addEventListener('resize', resize)
|
||||
}
|
||||
|
||||
module.exports = () => {
|
||||
const body = $('body')
|
||||
|
||||
body.on('shown.bs.modal', '.modal', (e) => {
|
||||
window.setTimeout(() => {
|
||||
if (document.getElementById('analytic-chart')) {
|
||||
drawChart()
|
||||
}
|
||||
}, 500)
|
||||
})
|
||||
}
|
Loading…
Reference in a new issue