From b2a0e96fbd6975d73b103d5100683e071864f3bd Mon Sep 17 00:00:00 2001 From: Daniel GarcĂ­a Moreno Date: Tue, 1 Jun 2021 11:40:51 +0200 Subject: Add initial AdminLTE template files Add the open source AdminLTE bootstrap dashboard template to the static folder, and some plugins that we'll use in the following changes to the templates. Plugins: * jquery * bootstrap * font-awesome https://adminlte.io/ --- ogcp/static/AdminLTE/dist/js/pages/dashboard3.js | 147 +++++++++++++++++++++++ 1 file changed, 147 insertions(+) create mode 100644 ogcp/static/AdminLTE/dist/js/pages/dashboard3.js (limited to 'ogcp/static/AdminLTE/dist/js/pages/dashboard3.js') diff --git a/ogcp/static/AdminLTE/dist/js/pages/dashboard3.js b/ogcp/static/AdminLTE/dist/js/pages/dashboard3.js new file mode 100644 index 0000000..c4895eb --- /dev/null +++ b/ogcp/static/AdminLTE/dist/js/pages/dashboard3.js @@ -0,0 +1,147 @@ +/* global Chart:false */ + +$(function () { + 'use strict' + + var ticksStyle = { + fontColor: '#495057', + fontStyle: 'bold' + } + + var mode = 'index' + var intersect = true + + var $salesChart = $('#sales-chart') + // eslint-disable-next-line no-unused-vars + var salesChart = new Chart($salesChart, { + type: 'bar', + data: { + labels: ['JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'], + datasets: [ + { + backgroundColor: '#007bff', + borderColor: '#007bff', + data: [1000, 2000, 3000, 2500, 2700, 2500, 3000] + }, + { + backgroundColor: '#ced4da', + borderColor: '#ced4da', + data: [700, 1700, 2700, 2000, 1800, 1500, 2000] + } + ] + }, + options: { + maintainAspectRatio: false, + tooltips: { + mode: mode, + intersect: intersect + }, + hover: { + mode: mode, + intersect: intersect + }, + legend: { + display: false + }, + scales: { + yAxes: [{ + // display: false, + gridLines: { + display: true, + lineWidth: '4px', + color: 'rgba(0, 0, 0, .2)', + zeroLineColor: 'transparent' + }, + ticks: $.extend({ + beginAtZero: true, + + // Include a dollar sign in the ticks + callback: function (value) { + if (value >= 1000) { + value /= 1000 + value += 'k' + } + + return '$' + value + } + }, ticksStyle) + }], + xAxes: [{ + display: true, + gridLines: { + display: false + }, + ticks: ticksStyle + }] + } + } + }) + + var $visitorsChart = $('#visitors-chart') + // eslint-disable-next-line no-unused-vars + var visitorsChart = new Chart($visitorsChart, { + data: { + labels: ['18th', '20th', '22nd', '24th', '26th', '28th', '30th'], + datasets: [{ + type: 'line', + data: [100, 120, 170, 167, 180, 177, 160], + backgroundColor: 'transparent', + borderColor: '#007bff', + pointBorderColor: '#007bff', + pointBackgroundColor: '#007bff', + fill: false + // pointHoverBackgroundColor: '#007bff', + // pointHoverBorderColor : '#007bff' + }, + { + type: 'line', + data: [60, 80, 70, 67, 80, 77, 100], + backgroundColor: 'tansparent', + borderColor: '#ced4da', + pointBorderColor: '#ced4da', + pointBackgroundColor: '#ced4da', + fill: false + // pointHoverBackgroundColor: '#ced4da', + // pointHoverBorderColor : '#ced4da' + }] + }, + options: { + maintainAspectRatio: false, + tooltips: { + mode: mode, + intersect: intersect + }, + hover: { + mode: mode, + intersect: intersect + }, + legend: { + display: false + }, + scales: { + yAxes: [{ + // display: false, + gridLines: { + display: true, + lineWidth: '4px', + color: 'rgba(0, 0, 0, .2)', + zeroLineColor: 'transparent' + }, + ticks: $.extend({ + beginAtZero: true, + suggestedMax: 200 + }, ticksStyle) + }], + xAxes: [{ + display: true, + gridLines: { + display: false + }, + ticks: ticksStyle + }] + } + } + }) +}) + +// lgtm [js/unused-local-variable] -- cgit v1.2.3-18-g5258