Initial Commit
This commit is contained in:
36
public/back/vendors/scripts/advanced-components.js
vendored
Normal file
36
public/back/vendors/scripts/advanced-components.js
vendored
Normal file
@@ -0,0 +1,36 @@
|
||||
// Switchery
|
||||
var elems = Array.prototype.slice.call(document.querySelectorAll('.switch-btn'));
|
||||
$('.switch-btn').each(function() {
|
||||
new Switchery($(this)[0], $(this).data());
|
||||
});
|
||||
|
||||
// Bootstrap Touchspin
|
||||
$("input[name='demo_vertical2']").TouchSpin({
|
||||
verticalbuttons: true,
|
||||
// verticalupclass: 'fa fa-plus',
|
||||
// verticaldownclass: 'fa fa-minus'
|
||||
});
|
||||
$("input[name='demo3']").TouchSpin();
|
||||
$("input[name='demo1']").TouchSpin({
|
||||
min: 0,
|
||||
max: 100,
|
||||
step: 0.1,
|
||||
decimals: 2,
|
||||
boostat: 5,
|
||||
maxboostedstep: 10,
|
||||
postfix: '%'
|
||||
});
|
||||
$("input[name='demo2']").TouchSpin({
|
||||
min: -1000000000,
|
||||
max: 1000000000,
|
||||
stepinterval: 50,
|
||||
maxboostedstep: 10000000,
|
||||
prefix: '$'
|
||||
});
|
||||
$("input[name='demo3_22']").TouchSpin({
|
||||
initval: 40
|
||||
});
|
||||
$("input[name='demo5']").TouchSpin({
|
||||
prefix: "pre",
|
||||
postfix: "post"
|
||||
});
|
||||
668
public/back/vendors/scripts/apexcharts-setting.js
vendored
Normal file
668
public/back/vendors/scripts/apexcharts-setting.js
vendored
Normal file
@@ -0,0 +1,668 @@
|
||||
var options = {
|
||||
series: [{
|
||||
name: 'Likes',
|
||||
data: [4, 3, 10, 9, 29, 19, 22, 9, 12, 7, 19, 5, 13, 9, 17, 2, 7, 5]
|
||||
}],
|
||||
chart: {
|
||||
height: 350,
|
||||
type: 'line',
|
||||
toolbar: {
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
show: false,
|
||||
padding: {
|
||||
left: 0,
|
||||
right: 0
|
||||
}
|
||||
},
|
||||
stroke: {
|
||||
width: 7,
|
||||
curve: 'smooth'
|
||||
},
|
||||
xaxis: {
|
||||
type: 'datetime',
|
||||
categories: ['1/11/2020', '2/11/2020', '3/11/2020', '4/11/2020', '5/11/2020', '6/11/2020', '7/11/2020', '8/11/2020', '9/11/2020', '10/11/2020', '11/11/2020', '12/11/2020', '1/11/2021', '2/11/2021', '3/11/2021','4/11/2021' ,'5/11/2021' ,'6/11/2021'],
|
||||
},
|
||||
title: {
|
||||
text: 'Social Media',
|
||||
align: 'left',
|
||||
style: {
|
||||
fontSize: "16px",
|
||||
color: '#666'
|
||||
}
|
||||
},
|
||||
fill: {
|
||||
type: 'gradient',
|
||||
gradient: {
|
||||
shade: 'dark',
|
||||
gradientToColors: [ '#1b00ff'],
|
||||
shadeIntensity: 1,
|
||||
type: 'horizontal',
|
||||
opacityFrom: 1,
|
||||
opacityTo: 1,
|
||||
stops: [0, 100, 100, 100]
|
||||
},
|
||||
},
|
||||
markers: {
|
||||
size: 4,
|
||||
colors: ["#FFA41B"],
|
||||
strokeColors: "#fff",
|
||||
strokeWidth: 2,
|
||||
hover: {
|
||||
size: 7,
|
||||
}
|
||||
},
|
||||
yaxis: {
|
||||
min: -10,
|
||||
max: 40,
|
||||
title: {
|
||||
text: 'Engagement',
|
||||
},
|
||||
}
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart1"), options);
|
||||
chart.render();
|
||||
|
||||
var options2 = {
|
||||
series: [{
|
||||
name: 'series1',
|
||||
data: [31, 40, 28, 51, 42, 109, 100]
|
||||
}, {
|
||||
name: 'series2',
|
||||
data: [11, 32, 45, 32, 34, 52, 41]
|
||||
}],
|
||||
chart: {
|
||||
height: 350,
|
||||
type: 'area',
|
||||
toolbar: {
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
show: false,
|
||||
padding: {
|
||||
left: 0,
|
||||
right: 0
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
stroke: {
|
||||
curve: 'smooth'
|
||||
},
|
||||
xaxis: {
|
||||
type: 'datetime',
|
||||
categories: ["2020-09-19T00:00:00.000Z", "2020-09-19T01:30:00.000Z", "2020-09-19T02:30:00.000Z", "2020-09-19T03:30:00.000Z", "2020-09-19T04:30:00.000Z", "2020-09-19T05:30:00.000Z", "2020-09-19T06:30:00.000Z"]
|
||||
},
|
||||
tooltip: {
|
||||
x: {
|
||||
format: 'dd/MM/yy HH:mm'
|
||||
},
|
||||
},
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart2"), options2);
|
||||
chart.render();
|
||||
|
||||
var options3 = {
|
||||
series: [{
|
||||
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]
|
||||
}],
|
||||
chart: {
|
||||
type: 'bar',
|
||||
height: 350,
|
||||
toolbar: {
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: false,
|
||||
columnWidth: '25%',
|
||||
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)'
|
||||
}
|
||||
},
|
||||
fill: {
|
||||
opacity: 1
|
||||
},
|
||||
tooltip: {
|
||||
y: {
|
||||
formatter: function (val) {
|
||||
return "$" + val + "thousands"
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart3"), options3);
|
||||
chart.render();
|
||||
|
||||
var options4 = {
|
||||
series: [{
|
||||
data: [44, 55, 41, 64, 22, 43, 21]
|
||||
}, {
|
||||
data: [53, 32, 33, 52, 13, 44, 32]
|
||||
}],
|
||||
chart: {
|
||||
type: 'bar',
|
||||
height: 430,
|
||||
toolbar: {
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
show: false,
|
||||
padding: {
|
||||
left: 0,
|
||||
right: 0
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: true,
|
||||
dataLabels: {
|
||||
position: 'top',
|
||||
},
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
offsetX: -6,
|
||||
style: {
|
||||
fontSize: '12px',
|
||||
colors: ['#fff']
|
||||
}
|
||||
},
|
||||
stroke: {
|
||||
show: true,
|
||||
width: 1,
|
||||
colors: ['#fff']
|
||||
},
|
||||
xaxis: {
|
||||
categories: [2014, 2015, 2016, 2017, 2018, 2019, 2020],
|
||||
},
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart4"), options4);
|
||||
chart.render();
|
||||
|
||||
var options5 = {
|
||||
series: [{
|
||||
name: 'Team A',
|
||||
type: 'column',
|
||||
data: [23, 11, 22, 27, 13, 22, 37, 21, 44, 22, 30]
|
||||
}, {
|
||||
name: 'Team B',
|
||||
type: 'area',
|
||||
data: [44, 55, 41, 67, 22, 43, 21, 41, 56, 27, 43]
|
||||
}, {
|
||||
name: 'Team C',
|
||||
type: 'line',
|
||||
data: [30, 25, 36, 30, 45, 35, 64, 52, 59, 36, 39]
|
||||
}],
|
||||
chart: {
|
||||
height: 350,
|
||||
type: 'line',
|
||||
stacked: false,
|
||||
toolbar: {
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
show: false,
|
||||
padding: {
|
||||
left: 0,
|
||||
right: 0
|
||||
}
|
||||
},
|
||||
stroke: {
|
||||
width: [0, 2, 5],
|
||||
curve: 'smooth'
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
columnWidth: '20%'
|
||||
}
|
||||
},
|
||||
|
||||
fill: {
|
||||
opacity: [0.85, 0.25, 1],
|
||||
gradient: {
|
||||
inverseColors: false,
|
||||
shade: 'light',
|
||||
type: "vertical",
|
||||
opacityFrom: 0.85,
|
||||
opacityTo: 0.55,
|
||||
stops: [0, 100, 100, 100]
|
||||
}
|
||||
},
|
||||
labels: ['01/01/2020', '02/01/2020', '03/01/2020', '04/01/2020', '05/01/2020', '06/01/2020', '07/01/2020',
|
||||
'08/01/2020', '09/01/2020', '10/01/2020', '11/01/2020'
|
||||
],
|
||||
markers: {
|
||||
size: 0
|
||||
},
|
||||
xaxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
yaxis: {
|
||||
title: {
|
||||
text: 'Points',
|
||||
},
|
||||
min: 0
|
||||
},
|
||||
tooltip: {
|
||||
shared: true,
|
||||
intersect: false,
|
||||
y: {
|
||||
formatter: function (y) {
|
||||
if (typeof y !== "undefined") {
|
||||
return y.toFixed(0) + " points";
|
||||
}
|
||||
return y;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart5"), options5);
|
||||
chart.render();
|
||||
|
||||
var options6 = {
|
||||
series: [
|
||||
{
|
||||
name: 'Bob',
|
||||
data: [
|
||||
{
|
||||
x: 'Design',
|
||||
y: [
|
||||
new Date('2020-03-05').getTime(),
|
||||
new Date('2020-03-08').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Code',
|
||||
y: [
|
||||
new Date('2020-03-02').getTime(),
|
||||
new Date('2020-03-05').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Code',
|
||||
y: [
|
||||
new Date('2020-03-05').getTime(),
|
||||
new Date('2020-03-07').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Test',
|
||||
y: [
|
||||
new Date('2020-03-03').getTime(),
|
||||
new Date('2020-03-09').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Test',
|
||||
y: [
|
||||
new Date('2020-03-08').getTime(),
|
||||
new Date('2020-03-11').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Validation',
|
||||
y: [
|
||||
new Date('2020-03-11').getTime(),
|
||||
new Date('2020-03-16').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Design',
|
||||
y: [
|
||||
new Date('2020-03-01').getTime(),
|
||||
new Date('2020-03-03').getTime()
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Joe',
|
||||
data: [
|
||||
{
|
||||
x: 'Design',
|
||||
y: [
|
||||
new Date('2020-03-02').getTime(),
|
||||
new Date('2020-03-05').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Test',
|
||||
y: [
|
||||
new Date('2020-03-06').getTime(),
|
||||
new Date('2020-03-16').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Code',
|
||||
y: [
|
||||
new Date('2020-03-03').getTime(),
|
||||
new Date('2020-03-07').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Deployment',
|
||||
y: [
|
||||
new Date('2020-03-20').getTime(),
|
||||
new Date('2020-03-22').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Design',
|
||||
y: [
|
||||
new Date('2020-03-10').getTime(),
|
||||
new Date('2020-03-16').getTime()
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Dan',
|
||||
data: [
|
||||
{
|
||||
x: 'Code',
|
||||
y: [
|
||||
new Date('2020-03-10').getTime(),
|
||||
new Date('2020-03-17').getTime()
|
||||
]
|
||||
},
|
||||
{
|
||||
x: 'Validation',
|
||||
y: [
|
||||
new Date('2020-03-05').getTime(),
|
||||
new Date('2020-03-09').getTime()
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
],
|
||||
chart: {
|
||||
height: 450,
|
||||
type: 'rangeBar',
|
||||
toolbar: {
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
show: false,
|
||||
padding: {
|
||||
left: 0,
|
||||
right: 0
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: true,
|
||||
barHeight: '80%'
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
stroke: {
|
||||
width: 1
|
||||
},
|
||||
fill: {
|
||||
type: 'solid',
|
||||
opacity: 0.6
|
||||
},
|
||||
legend: {
|
||||
position: 'top',
|
||||
horizontalAlign: 'left'
|
||||
}
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart6"), options6);
|
||||
chart.render();
|
||||
|
||||
var options7 = {
|
||||
series: [{
|
||||
data: [{
|
||||
x: new Date(1538778600000),
|
||||
y: [6629.81, 6650.5, 6623.04, 6633.33]
|
||||
},
|
||||
{
|
||||
x: new Date(1538780400000),
|
||||
y: [6632.01, 6643.59, 6620, 6630.11]
|
||||
},
|
||||
{
|
||||
x: new Date(1538782200000),
|
||||
y: [6630.71, 6648.95, 6623.34, 6635.65]
|
||||
},
|
||||
{
|
||||
x: new Date(1538784000000),
|
||||
y: [6635.65, 6651, 6629.67, 6638.24]
|
||||
},
|
||||
{
|
||||
x: new Date(1538785800000),
|
||||
y: [6638.24, 6640, 6620, 6624.47]
|
||||
},
|
||||
{
|
||||
x: new Date(1538787600000),
|
||||
y: [6624.53, 6636.03, 6621.68, 6624.31]
|
||||
},
|
||||
{
|
||||
x: new Date(1538789400000),
|
||||
y: [6624.61, 6632.2, 6617, 6626.02]
|
||||
},
|
||||
{
|
||||
x: new Date(1538791200000),
|
||||
y: [6627, 6627.62, 6584.22, 6603.02]
|
||||
},
|
||||
{
|
||||
x: new Date(1538793000000),
|
||||
y: [6605, 6608.03, 6598.95, 6604.01]
|
||||
},
|
||||
{
|
||||
x: new Date(1538794800000),
|
||||
y: [6604.5, 6614.4, 6602.26, 6608.02]
|
||||
},
|
||||
{
|
||||
x: new Date(1538796600000),
|
||||
y: [6608.02, 6610.68, 6601.99, 6608.91]
|
||||
},
|
||||
{
|
||||
x: new Date(1538798400000),
|
||||
y: [6608.91, 6618.99, 6608.01, 6612]
|
||||
},
|
||||
{
|
||||
x: new Date(1538800200000),
|
||||
y: [6612, 6615.13, 6605.09, 6612]
|
||||
},
|
||||
{
|
||||
x: new Date(1538802000000),
|
||||
y: [6612, 6624.12, 6608.43, 6622.95]
|
||||
},
|
||||
{
|
||||
x: new Date(1538803800000),
|
||||
y: [6623.91, 6623.91, 6615, 6615.67]
|
||||
},
|
||||
{
|
||||
x: new Date(1538805600000),
|
||||
y: [6618.69, 6618.74, 6610, 6610.4]
|
||||
},
|
||||
{
|
||||
x: new Date(1538807400000),
|
||||
y: [6611, 6622.78, 6610.4, 6614.9]
|
||||
},
|
||||
{
|
||||
x: new Date(1538809200000),
|
||||
y: [6614.9, 6626.2, 6613.33, 6623.45]
|
||||
},
|
||||
{
|
||||
x: new Date(1538811000000),
|
||||
y: [6623.48, 6627, 6618.38, 6620.35]
|
||||
},
|
||||
{
|
||||
x: new Date(1538812800000),
|
||||
y: [6619.43, 6620.35, 6610.05, 6615.53]
|
||||
},
|
||||
{
|
||||
x: new Date(1538814600000),
|
||||
y: [6615.53, 6617.93, 6610, 6615.19]
|
||||
},
|
||||
{
|
||||
x: new Date(1538816400000),
|
||||
y: [6615.19, 6621.6, 6608.2, 6620]
|
||||
},
|
||||
{
|
||||
x: new Date(1538818200000),
|
||||
y: [6619.54, 6625.17, 6614.15, 6620]
|
||||
},
|
||||
{
|
||||
x: new Date(1538820000000),
|
||||
y: [6620.33, 6634.15, 6617.24, 6624.61]
|
||||
},
|
||||
{
|
||||
x: new Date(1538821800000),
|
||||
y: [6625.95, 6626, 6611.66, 6617.58]
|
||||
},
|
||||
{
|
||||
x: new Date(1538823600000),
|
||||
y: [6619, 6625.97, 6595.27, 6598.86]
|
||||
},
|
||||
{
|
||||
x: new Date(1538825400000),
|
||||
y: [6598.86, 6598.88, 6570, 6587.16]
|
||||
},
|
||||
{
|
||||
x: new Date(1538827200000),
|
||||
y: [6588.86, 6600, 6580, 6593.4]
|
||||
},
|
||||
]
|
||||
}],
|
||||
chart: {
|
||||
type: 'candlestick',
|
||||
height: 350,
|
||||
toolbar: {
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
show: false, },
|
||||
title: {
|
||||
text: 'CandleStick Chart',
|
||||
align: 'left'
|
||||
},
|
||||
xaxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
yaxis: {
|
||||
tooltip: {
|
||||
enabled: true
|
||||
}
|
||||
}
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart7"), options7);
|
||||
chart.render();
|
||||
|
||||
var options8 = {
|
||||
series: [44, 55, 41, 17, 15],
|
||||
chart: {
|
||||
type: 'donut',
|
||||
},
|
||||
responsive: [{
|
||||
breakpoint: 480,
|
||||
options: {
|
||||
chart: {
|
||||
width: 200
|
||||
},
|
||||
legend: {
|
||||
position: 'bottom'
|
||||
}
|
||||
}
|
||||
}]
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart8"), options8);
|
||||
chart.render();
|
||||
|
||||
var options9 = {
|
||||
series: [76, 67, 61, 90],
|
||||
chart: {
|
||||
height: 390,
|
||||
type: 'radialBar',
|
||||
},
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
offsetY: 0,
|
||||
startAngle: 0,
|
||||
endAngle: 270,
|
||||
hollow: {
|
||||
margin: 5,
|
||||
size: '40%',
|
||||
background: 'transparent',
|
||||
image: undefined,
|
||||
},
|
||||
dataLabels: {
|
||||
name: {
|
||||
show: false,
|
||||
},
|
||||
value: {
|
||||
show: false,
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
colors: ['#1ab7ea', '#0084ff', '#39539E', '#0077B5'],
|
||||
labels: ['Vimeo', 'Messenger', 'Facebook', 'LinkedIn'],
|
||||
legend: {
|
||||
show: true,
|
||||
floating: true,
|
||||
fontSize: '14px',
|
||||
position: 'left',
|
||||
offsetX: 40,
|
||||
offsetY: 15,
|
||||
labels: {
|
||||
useSeriesColors: true,
|
||||
},
|
||||
markers: {
|
||||
size: 0
|
||||
},
|
||||
formatter: function(seriesName, opts) {
|
||||
return seriesName + ": " + opts.w.globals.series[opts.seriesIndex]
|
||||
},
|
||||
itemMargin: {
|
||||
vertical: 3
|
||||
}
|
||||
},
|
||||
responsive: [{
|
||||
breakpoint: 480,
|
||||
options: {
|
||||
legend: {
|
||||
show: false
|
||||
}
|
||||
}
|
||||
}]
|
||||
};
|
||||
var chart = new ApexCharts(document.querySelector("#chart9"), options9);
|
||||
chart.render();
|
||||
158
public/back/vendors/scripts/calendar-setting.js
vendored
Normal file
158
public/back/vendors/scripts/calendar-setting.js
vendored
Normal file
@@ -0,0 +1,158 @@
|
||||
jQuery(document).ready(function () {
|
||||
jQuery("#add-event").submit(function () {
|
||||
alert("Submitted");
|
||||
var values = {};
|
||||
$.each($("#add-event").serializeArray(), function (i, field) {
|
||||
values[field.name] = field.value;
|
||||
});
|
||||
console.log(values);
|
||||
});
|
||||
});
|
||||
|
||||
(function () {
|
||||
"use strict";
|
||||
// ------------------------------------------------------- //
|
||||
// Calendar
|
||||
// ------------------------------------------------------ //
|
||||
jQuery(function () {
|
||||
// page is ready
|
||||
jQuery("#calendar").fullCalendar({
|
||||
themeSystem: "bootstrap4",
|
||||
// emphasizes business hours
|
||||
businessHours: false,
|
||||
defaultView: "month",
|
||||
// event dragging & resizing
|
||||
editable: true,
|
||||
// header
|
||||
header: {
|
||||
left: "title",
|
||||
center: "month,agendaWeek,agendaDay",
|
||||
right: "today prev,next",
|
||||
},
|
||||
events: [
|
||||
{
|
||||
title: "Barber",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2023-05-05",
|
||||
end: "2023-05-05",
|
||||
className: "fc-bg-default",
|
||||
icon: "circle",
|
||||
},
|
||||
{
|
||||
title: "Flight Paris",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-08-08T14:00:00",
|
||||
end: "2022-08-08T20:00:00",
|
||||
className: "fc-bg-deepskyblue",
|
||||
icon: "cog",
|
||||
allDay: false,
|
||||
},
|
||||
{
|
||||
title: "Team Meeting",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-07-10T13:00:00",
|
||||
end: "2022-07-10T16:00:00",
|
||||
className: "fc-bg-pinkred",
|
||||
icon: "group",
|
||||
allDay: false,
|
||||
},
|
||||
{
|
||||
title: "Meeting",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-08-12",
|
||||
className: "fc-bg-lightgreen",
|
||||
icon: "suitcase",
|
||||
},
|
||||
{
|
||||
title: "Conference",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-08-13",
|
||||
end: "2022-08-15",
|
||||
className: "fc-bg-blue",
|
||||
icon: "calendar",
|
||||
},
|
||||
{
|
||||
title: "Baby Shower",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-07-13",
|
||||
end: "2022-07-14",
|
||||
className: "fc-bg-default",
|
||||
icon: "child",
|
||||
},
|
||||
{
|
||||
title: "Birthday",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-09-13",
|
||||
end: "2022-09-14",
|
||||
className: "fc-bg-default",
|
||||
icon: "birthday-cake",
|
||||
},
|
||||
{
|
||||
title: "Restaurant",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-10-15T09:30:00",
|
||||
end: "2022-10-15T11:45:00",
|
||||
className: "fc-bg-default",
|
||||
icon: "glass",
|
||||
allDay: false,
|
||||
},
|
||||
{
|
||||
title: "Dinner",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-11-15T20:00:00",
|
||||
end: "2022-11-15T22:30:00",
|
||||
className: "fc-bg-default",
|
||||
icon: "cutlery",
|
||||
allDay: false,
|
||||
},
|
||||
{
|
||||
title: "Shooting",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-08-25",
|
||||
end: "2022-08-25",
|
||||
className: "fc-bg-blue",
|
||||
icon: "camera",
|
||||
},
|
||||
{
|
||||
title: "Go Space :)",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-12-27",
|
||||
end: "2022-12-27",
|
||||
className: "fc-bg-default",
|
||||
icon: "rocket",
|
||||
},
|
||||
{
|
||||
title: "Dentist",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu pellentesque nibh. In nisl nulla, convallis ac nulla eget, pellentesque pellentesque magna.",
|
||||
start: "2022-12-29T11:30:00",
|
||||
end: "2022-12-29T012:30:00",
|
||||
className: "fc-bg-blue",
|
||||
icon: "medkit",
|
||||
allDay: false,
|
||||
},
|
||||
],
|
||||
dayClick: function () {
|
||||
jQuery("#modal-view-event-add").modal();
|
||||
},
|
||||
eventClick: function (event, jsEvent, view) {
|
||||
jQuery(".event-icon").html("<i class='fa fa-" + event.icon + "'></i>");
|
||||
jQuery(".event-title").html(event.title);
|
||||
jQuery(".event-body").html(event.description);
|
||||
jQuery(".eventUrl").attr("href", event.url);
|
||||
jQuery("#modal-view-event").modal();
|
||||
},
|
||||
});
|
||||
});
|
||||
})(jQuery);
|
||||
7
public/back/vendors/scripts/colorpicker.js
vendored
Normal file
7
public/back/vendors/scripts/colorpicker.js
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
$(".colorpicker").asColorPicker();
|
||||
$(".complex-colorpicker").asColorPicker({
|
||||
mode: 'complex'
|
||||
});
|
||||
$(".gradient-colorpicker").asColorPicker({
|
||||
mode: 'gradient'
|
||||
});
|
||||
26252
public/back/vendors/scripts/core.js
vendored
Normal file
26252
public/back/vendors/scripts/core.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
public/back/vendors/scripts/core.min.js
vendored
Normal file
1
public/back/vendors/scripts/core.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
467
public/back/vendors/scripts/dashboard.js
vendored
Normal file
467
public/back/vendors/scripts/dashboard.js
vendored
Normal file
@@ -0,0 +1,467 @@
|
||||
var options = {
|
||||
series: [80],
|
||||
grid: {
|
||||
padding: {
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
left: 0
|
||||
},
|
||||
},
|
||||
chart: {
|
||||
height: 100,
|
||||
width: 70,
|
||||
type: 'radialBar',
|
||||
},
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
hollow: {
|
||||
size: '50%',
|
||||
},
|
||||
dataLabels: {
|
||||
name: {
|
||||
show: false,
|
||||
color: '#fff'
|
||||
},
|
||||
value: {
|
||||
show: true,
|
||||
color: '#333',
|
||||
offsetY: 5,
|
||||
fontSize: '15px'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
colors: ['#ecf0f4'],
|
||||
fill: {
|
||||
type: 'gradient',
|
||||
gradient: {
|
||||
shade: 'dark',
|
||||
type: 'diagonal1',
|
||||
shadeIntensity: 0.8,
|
||||
gradientToColors: ['#1b00ff'],
|
||||
inverseColors: false,
|
||||
opacityFrom: [1, 0.2],
|
||||
opacityTo: 1,
|
||||
stops: [0, 100],
|
||||
}
|
||||
},
|
||||
states: {
|
||||
normal: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
hover: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
active: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
var options2 = {
|
||||
series: [70],
|
||||
grid: {
|
||||
padding: {
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
left: 0
|
||||
},
|
||||
},
|
||||
chart: {
|
||||
height: 100,
|
||||
width: 70,
|
||||
type: 'radialBar',
|
||||
},
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
hollow: {
|
||||
size: '50%',
|
||||
},
|
||||
dataLabels: {
|
||||
name: {
|
||||
show: false,
|
||||
color: '#fff'
|
||||
},
|
||||
value: {
|
||||
show: true,
|
||||
color: '#333',
|
||||
offsetY: 5,
|
||||
fontSize: '15px'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
colors: ['#ecf0f4'],
|
||||
fill: {
|
||||
type: 'gradient',
|
||||
gradient: {
|
||||
shade: 'dark',
|
||||
type: 'diagonal1',
|
||||
shadeIntensity: 1,
|
||||
gradientToColors: ['#009688'],
|
||||
inverseColors: false,
|
||||
opacityFrom: [1, 0.2],
|
||||
opacityTo: 1,
|
||||
stops: [0, 100],
|
||||
}
|
||||
},
|
||||
states: {
|
||||
normal: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
hover: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
active: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
var options3 = {
|
||||
series: [75],
|
||||
grid: {
|
||||
padding: {
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
left: 0
|
||||
},
|
||||
},
|
||||
chart: {
|
||||
height: 100,
|
||||
width: 70,
|
||||
type: 'radialBar',
|
||||
},
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
hollow: {
|
||||
size: '50%',
|
||||
},
|
||||
dataLabels: {
|
||||
name: {
|
||||
show: false,
|
||||
color: '#fff'
|
||||
},
|
||||
value: {
|
||||
show: true,
|
||||
color: '#333',
|
||||
offsetY: 5,
|
||||
fontSize: '15px'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
colors: ['#ecf0f4'],
|
||||
fill: {
|
||||
type: 'gradient',
|
||||
gradient: {
|
||||
shade: 'dark',
|
||||
type: 'diagonal1',
|
||||
shadeIntensity: 0.8,
|
||||
gradientToColors: ['#f56767'],
|
||||
inverseColors: false,
|
||||
opacityFrom: [1, 0.2],
|
||||
opacityTo: 1,
|
||||
stops: [0, 100],
|
||||
}
|
||||
},
|
||||
states: {
|
||||
normal: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
hover: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
active: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
var options4 = {
|
||||
series: [85],
|
||||
grid: {
|
||||
padding: {
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
left: 0
|
||||
},
|
||||
},
|
||||
chart: {
|
||||
height: 100,
|
||||
width: 70,
|
||||
type: 'radialBar',
|
||||
},
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
hollow: {
|
||||
size: '50%',
|
||||
},
|
||||
dataLabels: {
|
||||
name: {
|
||||
show: false,
|
||||
color: '#fff'
|
||||
},
|
||||
value: {
|
||||
show: true,
|
||||
color: '#333',
|
||||
offsetY: 5,
|
||||
fontSize: '15px'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
colors: ['#ecf0f4'],
|
||||
fill: {
|
||||
type: 'gradient',
|
||||
gradient: {
|
||||
shade: 'dark',
|
||||
type: 'diagonal1',
|
||||
shadeIntensity: 0.8,
|
||||
gradientToColors: ['#2979ff'],
|
||||
inverseColors: false,
|
||||
opacityFrom: [1, 0.5],
|
||||
opacityTo: 1,
|
||||
stops: [0, 100],
|
||||
}
|
||||
},
|
||||
states: {
|
||||
normal: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
hover: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
active: {
|
||||
filter: {
|
||||
type: 'none',
|
||||
value: 0,
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
var options5 = {
|
||||
chart: {
|
||||
height: 350,
|
||||
type: 'bar',
|
||||
parentHeightOffset: 0,
|
||||
fontFamily: 'Poppins, sans-serif',
|
||||
toolbar: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
colors: ['#1b00ff', '#f56767'],
|
||||
grid: {
|
||||
borderColor: '#c7d2dd',
|
||||
strokeDashArray: 5,
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: false,
|
||||
columnWidth: '25%',
|
||||
endingShape: 'rounded'
|
||||
},
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
stroke: {
|
||||
show: true,
|
||||
width: 2,
|
||||
colors: ['transparent']
|
||||
},
|
||||
series: [{
|
||||
name: 'In Progress',
|
||||
data: [40, 28, 47, 22, 34, 25]
|
||||
}, {
|
||||
name: 'Complete',
|
||||
data: [30, 20, 37, 10, 28, 11]
|
||||
}],
|
||||
xaxis: {
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
|
||||
labels: {
|
||||
style: {
|
||||
colors: ['#353535'],
|
||||
fontSize: '16px',
|
||||
},
|
||||
},
|
||||
axisBorder: {
|
||||
color: '#8fa6bc',
|
||||
}
|
||||
},
|
||||
yaxis: {
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
labels: {
|
||||
style: {
|
||||
colors: '#353535',
|
||||
fontSize: '16px',
|
||||
},
|
||||
},
|
||||
axisBorder: {
|
||||
color: '#f00',
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
horizontalAlign: 'right',
|
||||
position: 'top',
|
||||
fontSize: '16px',
|
||||
offsetY: 0,
|
||||
labels: {
|
||||
colors: '#353535',
|
||||
},
|
||||
markers: {
|
||||
width: 10,
|
||||
height: 10,
|
||||
radius: 15,
|
||||
},
|
||||
itemMargin: {
|
||||
vertical: 0
|
||||
},
|
||||
},
|
||||
fill: {
|
||||
opacity: 1
|
||||
|
||||
},
|
||||
tooltip: {
|
||||
style: {
|
||||
fontSize: '15px',
|
||||
fontFamily: 'Poppins, sans-serif',
|
||||
},
|
||||
y: {
|
||||
formatter: function (val) {
|
||||
return val
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var options6 = {
|
||||
series: [73],
|
||||
chart: {
|
||||
height: 350,
|
||||
type: 'radialBar',
|
||||
offsetY: 0
|
||||
},
|
||||
colors: ['#0B132B', '#222222'],
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
startAngle: -135,
|
||||
endAngle: 135,
|
||||
dataLabels: {
|
||||
name: {
|
||||
fontSize: '16px',
|
||||
color: undefined,
|
||||
offsetY: 120
|
||||
},
|
||||
value: {
|
||||
offsetY: 76,
|
||||
fontSize: '22px',
|
||||
color: undefined,
|
||||
formatter: function (val) {
|
||||
return val + "%";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
fill: {
|
||||
type: 'gradient',
|
||||
gradient: {
|
||||
shade: 'dark',
|
||||
shadeIntensity: 0.15,
|
||||
inverseColors: false,
|
||||
opacityFrom: 1,
|
||||
opacityTo: 1,
|
||||
stops: [0, 50, 65, 91]
|
||||
},
|
||||
},
|
||||
stroke: {
|
||||
dashArray: 4
|
||||
},
|
||||
labels: ['Achieve Goals'],
|
||||
};
|
||||
|
||||
var chart = new ApexCharts(document.querySelector("#chart"), options);
|
||||
chart.render();
|
||||
|
||||
var chart2 = new ApexCharts(document.querySelector("#chart2"), options2);
|
||||
chart2.render();
|
||||
|
||||
var chart3 = new ApexCharts(document.querySelector("#chart3"), options3);
|
||||
chart3.render();
|
||||
|
||||
var chart4 = new ApexCharts(document.querySelector("#chart4"), options4);
|
||||
chart4.render();
|
||||
|
||||
var chart5 = new ApexCharts(document.querySelector("#chart5"), options5);
|
||||
chart5.render();
|
||||
|
||||
var chart6 = new ApexCharts(document.querySelector("#chart6"), options6);
|
||||
chart6.render();
|
||||
|
||||
|
||||
// datatable init
|
||||
$('document').ready(function(){
|
||||
$('.data-table').DataTable({
|
||||
scrollCollapse: true,
|
||||
autoWidth: true,
|
||||
responsive: true,
|
||||
searching: false,
|
||||
bLengthChange: false,
|
||||
bPaginate: false,
|
||||
bInfo: false,
|
||||
columnDefs: [{
|
||||
targets: "datatable-nosort",
|
||||
orderable: false,
|
||||
}],
|
||||
"lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
|
||||
"language": {
|
||||
"info": "_START_-_END_ of _TOTAL_ entries",
|
||||
searchPlaceholder: "Search",
|
||||
paginate: {
|
||||
next: '<i class="ion-chevron-right"></i>',
|
||||
previous: '<i class="ion-chevron-left"></i>'
|
||||
}
|
||||
},
|
||||
});
|
||||
});
|
||||
207
public/back/vendors/scripts/dashboard2.js
vendored
Normal file
207
public/back/vendors/scripts/dashboard2.js
vendored
Normal file
@@ -0,0 +1,207 @@
|
||||
$(".dial1").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 80}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial1").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
|
||||
$(".dial2").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 70}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial2").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
|
||||
$(".dial3").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 90}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial3").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
|
||||
$(".dial4").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 65}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial4").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
// map
|
||||
jQuery('#browservisit').vectorMap({
|
||||
map: 'world_mill_en',
|
||||
backgroundColor: '#fff',
|
||||
borderWidth: 1,
|
||||
zoomOnScroll : false,
|
||||
color: '#ddd',
|
||||
regionStyle: {
|
||||
initial: {
|
||||
fill: '#fff'
|
||||
}
|
||||
},
|
||||
enableZoom: true,
|
||||
normalizeFunction: 'linear',
|
||||
showTooltip: true
|
||||
});
|
||||
// chart
|
||||
Highcharts.chart('chart', {
|
||||
chart: {
|
||||
type: 'line'
|
||||
},
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['jan 01', 'jan 05', 'jan 10', 'jan 15', 'jan 20', 'jan 25', 'jan 30'],
|
||||
labels: {
|
||||
style: {
|
||||
color: '#1b00ff',
|
||||
fontSize: '12px',
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value;
|
||||
},
|
||||
style: {
|
||||
color: '#1b00ff',
|
||||
fontSize: '14px'
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
tooltip: {
|
||||
crosshairs: true,
|
||||
shared: true
|
||||
},
|
||||
plotOptions: {
|
||||
spline: {
|
||||
marker: {
|
||||
radius: 10,
|
||||
lineColor: '#1b00ff',
|
||||
lineWidth: 2
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
align: 'center',
|
||||
x: 0,
|
||||
y: 0
|
||||
},
|
||||
series: [{
|
||||
name: 'Twitter',
|
||||
color: '#00789c',
|
||||
marker: {
|
||||
symbol: 'circle'
|
||||
},
|
||||
data: [0, 10, 5, 30, 40, 20, 10]
|
||||
},
|
||||
{
|
||||
name: 'Facebook',
|
||||
color: '#236adc',
|
||||
marker: {
|
||||
symbol: 'circle'
|
||||
},
|
||||
data: [40, 20, 10, 40, 15, 15, 20]
|
||||
},
|
||||
{
|
||||
name: 'Chat',
|
||||
color: '#ff686b',
|
||||
marker: {
|
||||
symbol: 'circle'
|
||||
},
|
||||
data: [0, 15, 5, 30, 40, 30, 28]
|
||||
},
|
||||
{
|
||||
name: 'Forum',
|
||||
color: '#264653',
|
||||
marker: {
|
||||
symbol: 'circle'
|
||||
},
|
||||
data: [35, 25, 10, 40, 15, 5, 38]
|
||||
}]
|
||||
});
|
||||
Highcharts.chart('compliance-trend', {
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
colors: ['#0051bd', '#00eccf', '#d11372'],
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['1th Sep', '2th Sep', '3th Sep', '4th Sep', '5th Sep', '6th Sep', '7th Sep', '8th Sep', '9th Sep', '10th Sep'],
|
||||
crosshair: true,
|
||||
lineWidth:1,
|
||||
lineColor: '#979797',
|
||||
labels: {
|
||||
style: {
|
||||
fontSize: '10px',
|
||||
color: '#5a5a5a'
|
||||
}
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
max: 100,
|
||||
gridLineWidth: 0,
|
||||
lineWidth:1,
|
||||
lineColor: '#979797',
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
stackLabels: {
|
||||
enabled: false,
|
||||
style: {
|
||||
fontWeight: 'bold',
|
||||
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: true
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<b>{point.x}</b><br/>',
|
||||
pointFormat: '{series.name}: {point.y}'
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
stacking: 'normal',
|
||||
dataLabels: {
|
||||
enabled: false,
|
||||
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
|
||||
},
|
||||
borderWidth: 0
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Success',
|
||||
maxPointWidth: 10,
|
||||
data: [50, 30, 40, 70, 20, 50, 30, 40, 70, 20,]
|
||||
}, {
|
||||
name: 'Warning',
|
||||
maxPointWidth: 10,
|
||||
data: [0, 20, 30, 20, 10, 50, 30, 40, 10, 20,]
|
||||
}, {
|
||||
name: 'Error',
|
||||
maxPointWidth: 10,
|
||||
data: [50, 50, 30, 10, 70, 0, 40, 20, 20, 60,]
|
||||
}]
|
||||
});
|
||||
298
public/back/vendors/scripts/dashboard3.js
vendored
Normal file
298
public/back/vendors/scripts/dashboard3.js
vendored
Normal file
@@ -0,0 +1,298 @@
|
||||
var options = {
|
||||
series: [
|
||||
{
|
||||
name: "Patients",
|
||||
data: [10, 15, 12, 20, 18, 26, 24, 25, 20, 25, 22, 30]
|
||||
},
|
||||
{
|
||||
name: "Consultations",
|
||||
data: [15, 10, 17, 15, 23, 21, 30, 20, 26, 20, 28, 25]
|
||||
}
|
||||
],
|
||||
chart: {
|
||||
height: 300,
|
||||
type: 'line',
|
||||
zoom: {
|
||||
enabled: false,
|
||||
},
|
||||
dropShadow: {
|
||||
enabled: true,
|
||||
color: '#000',
|
||||
top: 18,
|
||||
left: 7,
|
||||
blur: 16,
|
||||
opacity: 0.2
|
||||
},
|
||||
toolbar: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
colors: ['#f0746c', '#255cd3'],
|
||||
dataLabels: {
|
||||
enabled: false,
|
||||
},
|
||||
stroke: {
|
||||
width: [3,3],
|
||||
curve: 'smooth'
|
||||
},
|
||||
grid: {
|
||||
show: false,
|
||||
},
|
||||
markers: {
|
||||
colors: ['#f0746c', '#255cd3'],
|
||||
size: 5,
|
||||
strokeColors: '#ffffff',
|
||||
strokeWidth: 2,
|
||||
hover: {
|
||||
sizeOffset: 2
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
|
||||
labels:{
|
||||
style:{
|
||||
colors: '#8c9094'
|
||||
}
|
||||
}
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 35,
|
||||
labels:{
|
||||
style:{
|
||||
colors: '#8c9094'
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
position: 'top',
|
||||
horizontalAlign: 'right',
|
||||
floating: true,
|
||||
offsetY: 0,
|
||||
labels: {
|
||||
useSeriesColors: true
|
||||
},
|
||||
markers: {
|
||||
width: 10,
|
||||
height: 10,
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var options2 = {
|
||||
series: [{
|
||||
name: 'Week',
|
||||
data: [{
|
||||
x: 'Monday',
|
||||
y: 21
|
||||
}, {
|
||||
x: 'Tuesday',
|
||||
y: 22
|
||||
}, {
|
||||
x: 'Wednesday',
|
||||
y: 10
|
||||
}, {
|
||||
x: 'Thursday',
|
||||
y: 28
|
||||
}, {
|
||||
x: 'Friday',
|
||||
y: 16
|
||||
}, {
|
||||
x: 'Saturday',
|
||||
y: 21
|
||||
}, {
|
||||
x: 'Sunday',
|
||||
y: 13
|
||||
}],
|
||||
}],
|
||||
chart: {
|
||||
height: 70,
|
||||
type: 'bar',
|
||||
toolbar: {
|
||||
show: false,
|
||||
},
|
||||
sparkline: {
|
||||
enabled: true
|
||||
},
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
columnWidth: '25px',
|
||||
distributed: true,
|
||||
endingShape: 'rounded',
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
legend: {
|
||||
show: false
|
||||
},
|
||||
xaxis: {
|
||||
type: 'category',
|
||||
lines: {
|
||||
show: false,
|
||||
},
|
||||
axisBorder: {
|
||||
show: false,
|
||||
},
|
||||
labels: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
yaxis: [{
|
||||
y: 0,
|
||||
offsetX: 0,
|
||||
offsetY: 0,
|
||||
labels: {
|
||||
show: false,
|
||||
},
|
||||
padding: {
|
||||
left: 0,
|
||||
right: 0
|
||||
},
|
||||
}],
|
||||
};
|
||||
|
||||
var options3 = {
|
||||
series: [{
|
||||
name: 'Week',
|
||||
data: [{
|
||||
x: 'Monday',
|
||||
y: 10
|
||||
}, {
|
||||
x: 'Tuesday',
|
||||
y: 8
|
||||
}, {
|
||||
x: 'Wednesday',
|
||||
y: 15
|
||||
}, {
|
||||
x: 'Thursday',
|
||||
y: 12
|
||||
}, {
|
||||
x: 'Friday',
|
||||
y: 20
|
||||
}, {
|
||||
x: 'Saturday',
|
||||
y: 14
|
||||
}, {
|
||||
x: 'Sunday',
|
||||
y: 7
|
||||
}],
|
||||
}],
|
||||
colors: ['#ffffff', '#ffffff', '#ffffff', '#ffffff', '#ffffff', '#ffffff', '#ffffff'],
|
||||
chart: {
|
||||
height: 70,
|
||||
type: 'bar',
|
||||
toolbar: {
|
||||
show: false,
|
||||
},
|
||||
sparkline: {
|
||||
enabled: true
|
||||
},
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
columnWidth: '25px',
|
||||
distributed: true,
|
||||
endingShape: 'rounded',
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
legend: {
|
||||
show: false
|
||||
},
|
||||
xaxis: {
|
||||
type: 'category',
|
||||
lines: {
|
||||
show: false,
|
||||
},
|
||||
axisBorder: {
|
||||
show: false,
|
||||
},
|
||||
labels: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
yaxis: [{
|
||||
y: 0,
|
||||
offsetX: 0,
|
||||
offsetY: 0,
|
||||
labels: {
|
||||
show: false,
|
||||
},
|
||||
padding: {
|
||||
left: 0,
|
||||
right: 0
|
||||
},
|
||||
}],
|
||||
};
|
||||
|
||||
var options4 = {
|
||||
series: [50, 60, 70, 80],
|
||||
chart: {
|
||||
height: 350,
|
||||
type: 'radialBar',
|
||||
},
|
||||
colors: ['#003049', '#d62828', '#f77f00', '#fcbf49', '#e76f51'],
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
dataLabels: {
|
||||
name: {
|
||||
fontSize: '22px',
|
||||
},
|
||||
value: {
|
||||
fontSize: '16px',
|
||||
},
|
||||
total: {
|
||||
show: true,
|
||||
label: 'Total',
|
||||
formatter: function (w) {
|
||||
return 260
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
labels: ['Flu', 'Covid-19', 'Pheumoniae', 'Diabeties'],
|
||||
};
|
||||
|
||||
var chart = new ApexCharts(document.querySelector("#activities-chart"), options);
|
||||
chart.render();
|
||||
|
||||
var chart2 = new ApexCharts(document.querySelector("#appointment-chart"), options2);
|
||||
chart2.render();
|
||||
|
||||
var chart3 = new ApexCharts(document.querySelector("#surgery-chart"), options3);
|
||||
chart3.render();
|
||||
|
||||
var chart4 = new ApexCharts(document.querySelector("#diseases-chart"), options4);
|
||||
chart4.render();
|
||||
|
||||
// datatable init
|
||||
$('document').ready(function(){
|
||||
$('.data-table').DataTable({
|
||||
scrollCollapse: false,
|
||||
autoWidth: false,
|
||||
responsive: true,
|
||||
searching: false,
|
||||
bLengthChange: false,
|
||||
bPaginate: true,
|
||||
bInfo: false,
|
||||
columnDefs: [{
|
||||
targets: "datatable-nosort",
|
||||
orderable: false,
|
||||
}],
|
||||
"lengthMenu": [[5, 25, 50, -1], [5, 25, 50, "All"]],
|
||||
"language": {
|
||||
"info": "_START_-_END_ of _TOTAL_ entries",
|
||||
searchPlaceholder: "Search",
|
||||
paginate: {
|
||||
next: '<i class="ion-chevron-right"></i>',
|
||||
previous: '<i class="ion-chevron-left"></i>'
|
||||
}
|
||||
},
|
||||
});
|
||||
});
|
||||
97
public/back/vendors/scripts/datatable-setting.js
vendored
Normal file
97
public/back/vendors/scripts/datatable-setting.js
vendored
Normal file
@@ -0,0 +1,97 @@
|
||||
$('document').ready(function(){
|
||||
$('.data-table').DataTable({
|
||||
scrollCollapse: true,
|
||||
autoWidth: false,
|
||||
responsive: true,
|
||||
columnDefs: [{
|
||||
targets: "datatable-nosort",
|
||||
orderable: false,
|
||||
}],
|
||||
"lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
|
||||
"language": {
|
||||
"info": "_START_-_END_ of _TOTAL_ entries",
|
||||
searchPlaceholder: "Search",
|
||||
paginate: {
|
||||
next: '<i class="ion-chevron-right"></i>',
|
||||
previous: '<i class="ion-chevron-left"></i>'
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
$('.data-table-export').DataTable({
|
||||
scrollCollapse: true,
|
||||
autoWidth: false,
|
||||
responsive: true,
|
||||
columnDefs: [{
|
||||
targets: "datatable-nosort",
|
||||
orderable: false,
|
||||
}],
|
||||
"lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
|
||||
"language": {
|
||||
"info": "_START_-_END_ of _TOTAL_ entries",
|
||||
searchPlaceholder: "Search",
|
||||
paginate: {
|
||||
next: '<i class="ion-chevron-right"></i>',
|
||||
previous: '<i class="ion-chevron-left"></i>'
|
||||
}
|
||||
},
|
||||
dom: 'Bfrtp',
|
||||
buttons: [
|
||||
'copy', 'csv', 'pdf', 'print'
|
||||
]
|
||||
});
|
||||
|
||||
var table = $('.select-row').DataTable();
|
||||
$('.select-row tbody').on('click', 'tr', function () {
|
||||
if ($(this).hasClass('selected')) {
|
||||
$(this).removeClass('selected');
|
||||
}
|
||||
else {
|
||||
table.$('tr.selected').removeClass('selected');
|
||||
$(this).addClass('selected');
|
||||
}
|
||||
});
|
||||
|
||||
var multipletable = $('.multiple-select-row').DataTable();
|
||||
$('.multiple-select-row tbody').on('click', 'tr', function () {
|
||||
$(this).toggleClass('selected');
|
||||
});
|
||||
var table = $('.checkbox-datatable').DataTable({
|
||||
'scrollCollapse': true,
|
||||
'autoWidth': false,
|
||||
'responsive': true,
|
||||
"lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
|
||||
"language": {
|
||||
"info": "_START_-_END_ of _TOTAL_ entries",
|
||||
searchPlaceholder: "Search",
|
||||
paginate: {
|
||||
next: '<i class="ion-chevron-right"></i>',
|
||||
previous: '<i class="ion-chevron-left"></i>'
|
||||
}
|
||||
},
|
||||
'columnDefs': [{
|
||||
'targets': 0,
|
||||
'searchable': false,
|
||||
'orderable': false,
|
||||
'className': 'dt-body-center',
|
||||
'render': function (data, type, full, meta){
|
||||
return '<div class="dt-checkbox"><input type="checkbox" name="id[]" value="' + $('<div/>').text(data).html() + '"><span class="dt-checkbox-label"></span></div>';
|
||||
}
|
||||
}],
|
||||
'order': [[1, 'asc']]
|
||||
});
|
||||
|
||||
$('#example-select-all').on('click', function(){
|
||||
var rows = table.rows({ 'search': 'applied' }).nodes();
|
||||
$('input[type="checkbox"]', rows).prop('checked', this.checked);
|
||||
});
|
||||
|
||||
$('.checkbox-datatable tbody').on('change', 'input[type="checkbox"]', function(){
|
||||
if(!this.checked){
|
||||
var el = $('#example-select-all').get(0);
|
||||
if(el && el.checked && ('indeterminate' in el)){
|
||||
el.indeterminate = true;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
494
public/back/vendors/scripts/highchart-setting.js
vendored
Normal file
494
public/back/vendors/scripts/highchart-setting.js
vendored
Normal file
@@ -0,0 +1,494 @@
|
||||
// chart 1
|
||||
Highcharts.chart('chart1', {
|
||||
title: {
|
||||
text: 'Solar Employment Growth by Sector, 2010-2016'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: thesolarfoundation.com'
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Number of Employees'
|
||||
}
|
||||
},
|
||||
chart: {
|
||||
type: 'spline',
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
label: {
|
||||
connectorAllowed: false
|
||||
},
|
||||
pointStart: 2010
|
||||
},
|
||||
spline: {
|
||||
marker: {
|
||||
enabled: false
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Installation',
|
||||
data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
|
||||
}, {
|
||||
name: 'Manufacturing',
|
||||
data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]
|
||||
}, {
|
||||
name: 'Sales & Distribution',
|
||||
data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387]
|
||||
}, {
|
||||
name: 'Project Development',
|
||||
data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227]
|
||||
}, {
|
||||
name: 'Other',
|
||||
data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]
|
||||
}],
|
||||
responsive: {
|
||||
rules: [{
|
||||
condition: {
|
||||
maxWidth: 500
|
||||
}
|
||||
}]
|
||||
}
|
||||
});
|
||||
|
||||
// chart 2
|
||||
$.getJSON(
|
||||
'https://cdn.rawgit.com/highcharts/highcharts/057b672172ccc6c08fe7dbb27fc17ebca3f5b770/samples/data/usdeur.json',
|
||||
function (data) {
|
||||
|
||||
Highcharts.chart('chart2', {
|
||||
chart: {
|
||||
zoomType: 'x'
|
||||
},
|
||||
title: {
|
||||
text: 'USD to EUR exchange rate over time'
|
||||
},
|
||||
subtitle: {
|
||||
text: document.ontouchstart === undefined ?
|
||||
'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Exchange rate'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
fillColor: {
|
||||
linearGradient: {
|
||||
x1: 0,
|
||||
y1: 0,
|
||||
x2: 0,
|
||||
y2: 1
|
||||
},
|
||||
stops: [
|
||||
[0, Highcharts.getOptions().colors[0]],
|
||||
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
|
||||
]
|
||||
},
|
||||
marker: {
|
||||
radius: 2
|
||||
},
|
||||
lineWidth: 1,
|
||||
states: {
|
||||
hover: {
|
||||
lineWidth: 1
|
||||
}
|
||||
},
|
||||
threshold: null
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
type: 'area',
|
||||
name: 'USD to EUR',
|
||||
data: data
|
||||
}]
|
||||
});
|
||||
}
|
||||
);
|
||||
|
||||
// chart 3
|
||||
Highcharts.chart('chart3', {
|
||||
chart: {
|
||||
type: 'area'
|
||||
},
|
||||
title: {
|
||||
text: 'US and USSR nuclear stockpiles'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Sources: <a href="https://thebulletin.org/2006/july/global-nuclear-stockpiles-1945-2006">' +
|
||||
'thebulletin.org</a> & <a href="https://www.armscontrol.org/factsheets/Nuclearweaponswhohaswhat">' +
|
||||
'armscontrol.org</a>'
|
||||
},
|
||||
xAxis: {
|
||||
allowDecimals: false,
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value;
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Nuclear weapon states'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value / 1000 + 'k';
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name} had stockpiled <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
pointStart: 1940,
|
||||
marker: {
|
||||
enabled: false,
|
||||
symbol: 'circle',
|
||||
radius: 2,
|
||||
states: {
|
||||
hover: {
|
||||
enabled: true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'USA',
|
||||
data: [
|
||||
null, null, null, null, null, 6, 11, 32, 110, 235,
|
||||
369, 640, 1005, 1436, 2063, 3057, 4618, 6444, 9822, 15468,
|
||||
20434, 24126, 27387, 29459, 31056, 31982, 32040, 31233, 29224, 27342,
|
||||
26662, 26956, 27912, 28999, 28965, 27826, 25579, 25722, 24826, 24605,
|
||||
24304, 23464, 23708, 24099, 24357, 24237, 24401, 24344, 23586, 22380,
|
||||
21004, 17287, 14747, 13076, 12555, 12144, 11009, 10950, 10871, 10824,
|
||||
10577, 10527, 10475, 10421, 10358, 10295, 10104, 9914, 9620, 9326,
|
||||
5113, 5113, 4954, 4804, 4761, 4717, 4368, 4018
|
||||
]
|
||||
}, {
|
||||
name: 'USSR/Russia',
|
||||
data: [null, null, null, null, null, null, null, null, null, null,
|
||||
5, 25, 50, 120, 150, 200, 426, 660, 869, 1060,
|
||||
1605, 2471, 3322, 4238, 5221, 6129, 7089, 8339, 9399, 10538,
|
||||
11643, 13092, 14478, 15915, 17385, 19055, 21205, 23044, 25393, 27935,
|
||||
30062, 32049, 33952, 35804, 37431, 39197, 45000, 43000, 41000, 39000,
|
||||
37000, 35000, 33000, 31000, 29000, 27000, 25000, 24000, 23000, 22000,
|
||||
21000, 20000, 19000, 18000, 18000, 17000, 16000, 15537, 14162, 12787,
|
||||
12600, 11400, 5500, 4512, 4502, 4502, 4500, 4500
|
||||
]
|
||||
}]
|
||||
});
|
||||
|
||||
// chart 4
|
||||
Highcharts.chart('chart4', {
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Monthly Average Rainfall'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: WorldClimate.com'
|
||||
},
|
||||
xAxis: {
|
||||
categories: [
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'May',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Aug',
|
||||
'Sep',
|
||||
'Oct',
|
||||
'Nov',
|
||||
'Dec'
|
||||
],
|
||||
crosshair: true
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Rainfall (mm)'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
|
||||
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
|
||||
'<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
|
||||
footerFormat: '</table>',
|
||||
shared: true,
|
||||
useHTML: true
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
pointPadding: 0.2,
|
||||
borderWidth: 0
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Tokyo',
|
||||
data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
|
||||
|
||||
}, {
|
||||
name: 'New York',
|
||||
data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3]
|
||||
|
||||
}, {
|
||||
name: 'London',
|
||||
data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2]
|
||||
|
||||
}, {
|
||||
name: 'Berlin',
|
||||
data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1]
|
||||
|
||||
}]
|
||||
});
|
||||
|
||||
// chart 5
|
||||
Highcharts.chart('chart5', {
|
||||
title: {
|
||||
text: 'Pie point CSS'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
|
||||
},
|
||||
series: [{
|
||||
type: 'pie',
|
||||
allowPointSelect: true,
|
||||
keys: ['name', 'y', 'selected', 'sliced'],
|
||||
data: [
|
||||
['Apples', 29.9, false],
|
||||
['Pears', 71.5, false],
|
||||
['Oranges', 106.4, false],
|
||||
['Plums', 129.2, false],
|
||||
['Bananas', 144.0, false],
|
||||
['Peaches', 176.0, false],
|
||||
['Prunes', 135.6, true, true],
|
||||
['Avocados', 148.5, false]
|
||||
],
|
||||
showInLegend: true
|
||||
}]
|
||||
});
|
||||
|
||||
// chart 6
|
||||
Highcharts.chart('chart6', {
|
||||
chart: {
|
||||
type: 'pie',
|
||||
options3d: {
|
||||
enabled: true,
|
||||
alpha: 45
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Contents of Highsoft\'s weekly fruit delivery'
|
||||
},
|
||||
subtitle: {
|
||||
text: '3D donut in Highcharts'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
innerSize: 100,
|
||||
depth: 45
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Delivered amount',
|
||||
data: [
|
||||
['Bananas', 8],
|
||||
['Kiwi', 3],
|
||||
['Mixed nuts', 1],
|
||||
['Oranges', 6],
|
||||
['Apples', 8],
|
||||
['Pears', 4],
|
||||
['Clementines', 4],
|
||||
['Reddish (bag)', 1],
|
||||
['Grapes (bunch)', 1]
|
||||
]
|
||||
}]
|
||||
});
|
||||
|
||||
// chart 7
|
||||
Highcharts.chart('chart7', {
|
||||
chart: {
|
||||
type: 'gauge',
|
||||
plotBackgroundColor: null,
|
||||
plotBackgroundImage: null,
|
||||
plotBorderWidth: 0,
|
||||
plotShadow: false
|
||||
},
|
||||
title: {
|
||||
text: 'Speedometer'
|
||||
},
|
||||
pane: {
|
||||
startAngle: -150,
|
||||
endAngle: 150,
|
||||
background: [{
|
||||
backgroundColor: {
|
||||
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
|
||||
stops: [
|
||||
[0, '#FFF'],
|
||||
[1, '#333']
|
||||
]
|
||||
},
|
||||
borderWidth: 0,
|
||||
outerRadius: '109%'
|
||||
}, {
|
||||
backgroundColor: {
|
||||
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
|
||||
stops: [
|
||||
[0, '#333'],
|
||||
[1, '#FFF']
|
||||
]
|
||||
},
|
||||
borderWidth: 1,
|
||||
outerRadius: '107%'
|
||||
}, {
|
||||
}, {
|
||||
backgroundColor: '#DDD',
|
||||
borderWidth: 0,
|
||||
outerRadius: '105%',
|
||||
innerRadius: '103%'
|
||||
}]
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
max: 200,
|
||||
|
||||
minorTickInterval: 'auto',
|
||||
minorTickWidth: 1,
|
||||
minorTickLength: 10,
|
||||
minorTickPosition: 'inside',
|
||||
minorTickColor: '#666',
|
||||
|
||||
tickPixelInterval: 30,
|
||||
tickWidth: 2,
|
||||
tickPosition: 'inside',
|
||||
tickLength: 10,
|
||||
tickColor: '#666',
|
||||
labels: {
|
||||
step: 2,
|
||||
rotation: 'auto'
|
||||
},
|
||||
title: {
|
||||
text: 'km/h'
|
||||
},
|
||||
plotBands: [{
|
||||
from: 0,
|
||||
to: 120,
|
||||
color: '#55BF3B'
|
||||
}, {
|
||||
from: 120,
|
||||
to: 160,
|
||||
color: '#DDDF0D'
|
||||
}, {
|
||||
from: 160,
|
||||
to: 200,
|
||||
color: '#DF5353'
|
||||
}]
|
||||
},
|
||||
series: [{
|
||||
name: 'Speed',
|
||||
data: [80],
|
||||
tooltip: {
|
||||
valueSuffix: ' km/h'
|
||||
}
|
||||
}]
|
||||
},
|
||||
function (chart) {
|
||||
if (!chart.renderer.forExport) {
|
||||
setInterval(function () {
|
||||
var point = chart.series[0].points[0],
|
||||
newVal,
|
||||
inc = Math.round((Math.random() - 0.5) * 20);
|
||||
|
||||
newVal = point.y + inc;
|
||||
if (newVal < 0 || newVal > 200) {
|
||||
newVal = point.y - inc;
|
||||
}
|
||||
|
||||
point.update(newVal);
|
||||
|
||||
}, 3000);
|
||||
}
|
||||
});
|
||||
|
||||
// chart 8
|
||||
Highcharts.chart('chart8', {
|
||||
chart: {
|
||||
type: 'boxplot'
|
||||
},
|
||||
title: {
|
||||
text: 'Highcharts Box Plot Example'
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['1', '2', '3', '4', '5'],
|
||||
title: {
|
||||
text: 'Experiment No.'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Observations'
|
||||
},
|
||||
plotLines: [{
|
||||
value: 932,
|
||||
color: 'red',
|
||||
width: 1,
|
||||
label: {
|
||||
text: 'Theoretical mean: 932',
|
||||
align: 'center',
|
||||
style: {
|
||||
color: 'gray'
|
||||
}
|
||||
}
|
||||
}]
|
||||
},
|
||||
series: [{
|
||||
name: 'Observations',
|
||||
data: [
|
||||
[760, 801, 848, 895, 965],
|
||||
[733, 853, 939, 980, 1080],
|
||||
[714, 762, 817, 870, 918],
|
||||
[724, 802, 806, 871, 950],
|
||||
[834, 836, 864, 882, 910]
|
||||
],
|
||||
tooltip: {
|
||||
headerFormat: '<em>Experiment No {point.key}</em><br/>'
|
||||
}
|
||||
}, {
|
||||
name: 'Outlier',
|
||||
color: Highcharts.getOptions().colors[0],
|
||||
type: 'scatter',
|
||||
data: [
|
||||
[0, 644],
|
||||
[4, 718],
|
||||
[4, 951],
|
||||
[4, 969]
|
||||
],
|
||||
marker: {
|
||||
fillColor: 'white',
|
||||
lineWidth: 1,
|
||||
lineColor: Highcharts.getOptions().colors[0]
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: 'Observation: {point.y}'
|
||||
}
|
||||
}]
|
||||
|
||||
});
|
||||
15
public/back/vendors/scripts/jvectormap-setting.js
vendored
Normal file
15
public/back/vendors/scripts/jvectormap-setting.js
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
jQuery('#chart1').vectorMap({
|
||||
map: 'world_mill_en',
|
||||
backgroundColor: '#1b00ff',
|
||||
borderWidth: 1,
|
||||
zoomOnScroll : false,
|
||||
color: '#ddd',
|
||||
regionStyle: {
|
||||
initial: {
|
||||
fill: '#fff'
|
||||
}
|
||||
},
|
||||
enableZoom: true,
|
||||
normalizeFunction: 'linear',
|
||||
showTooltip: true
|
||||
});
|
||||
33
public/back/vendors/scripts/knob-chart-setting.js
vendored
Normal file
33
public/back/vendors/scripts/knob-chart-setting.js
vendored
Normal file
@@ -0,0 +1,33 @@
|
||||
$(".dial1").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 66}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial1").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
$(".dial2").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 75}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial2").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
$(".dial3").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 90}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial3").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
$(".dial4").knob();
|
||||
$({animatedVal: 0}).animate({animatedVal: 35}, {
|
||||
duration: 3000,
|
||||
easing: "swing",
|
||||
step: function() {
|
||||
$(".dial4").val(Math.ceil(this.animatedVal)).trigger("change");
|
||||
}
|
||||
});
|
||||
$(".dial5").knob();
|
||||
229
public/back/vendors/scripts/layout-settings.js
vendored
Normal file
229
public/back/vendors/scripts/layout-settings.js
vendored
Normal file
@@ -0,0 +1,229 @@
|
||||
(function () {
|
||||
"use strict";
|
||||
$(document).ready(function () {
|
||||
// Store object for local storage data
|
||||
var currentOptions = {
|
||||
headerBackground: "header-white",
|
||||
navigationBackground: "sidebar-light",
|
||||
menuDropdownIcon: "icon-style-1",
|
||||
menuListIcon: "icon-list-style-1",
|
||||
welcomemodal: "show",
|
||||
};
|
||||
|
||||
/**
|
||||
* Get local storage value
|
||||
*/
|
||||
function getOptions() {
|
||||
return JSON.parse(localStorage.getItem("optionsObject"));
|
||||
}
|
||||
|
||||
/**
|
||||
* Set local storage property value
|
||||
*/
|
||||
function setOptions(propertyName, propertyValue) {
|
||||
//Store in local storage
|
||||
var optionsCopy = Object.assign({}, currentOptions);
|
||||
optionsCopy[propertyName] = propertyValue;
|
||||
|
||||
//Store in local storage
|
||||
localStorage.setItem("optionsObject", JSON.stringify(optionsCopy));
|
||||
}
|
||||
|
||||
if (getOptions() != null) {
|
||||
currentOptions = getOptions();
|
||||
} else {
|
||||
localStorage.setItem("optionsObject", JSON.stringify(currentOptions));
|
||||
}
|
||||
|
||||
/**
|
||||
* Clear local storage
|
||||
*/
|
||||
function clearOptions() {
|
||||
localStorage.removeItem("optionsObject");
|
||||
}
|
||||
|
||||
// Set localstorage value to variable
|
||||
if (getOptions() != null) {
|
||||
currentOptions = getOptions();
|
||||
} else {
|
||||
localStorage.setItem("optionsObject", JSON.stringify(currentOptions));
|
||||
}
|
||||
|
||||
//Layout settings visible
|
||||
$('[data-toggle="right-sidebar"]').on("click", function () {
|
||||
jQuery(".right-sidebar").addClass("right-sidebar-visible");
|
||||
});
|
||||
|
||||
//THEME OPTION CLOSE BUTTON
|
||||
$('[data-toggle="right-sidebar-close"]').on("click", function () {
|
||||
jQuery(".right-sidebar").removeClass("right-sidebar-visible");
|
||||
});
|
||||
|
||||
//VARIABLE
|
||||
var body = jQuery("body");
|
||||
var left_sidebar = jQuery(".left-side-bar");
|
||||
|
||||
// Header Background
|
||||
var header_dark = jQuery(".header-dark");
|
||||
var header_light = jQuery(".header-white");
|
||||
|
||||
header_dark.click(function () {
|
||||
"use strict";
|
||||
jQuery(this).addClass("active");
|
||||
header_light.removeClass("active");
|
||||
body.removeClass("header-white").addClass("header-dark");
|
||||
|
||||
//Store in local storage
|
||||
setOptions("headerBackground", "header-dark");
|
||||
});
|
||||
|
||||
//Click for current options
|
||||
if (currentOptions.headerBackground === "header-dark") {
|
||||
header_dark.trigger("click");
|
||||
}
|
||||
|
||||
header_light.click(function () {
|
||||
"use strict";
|
||||
jQuery(this).addClass("active");
|
||||
header_dark.removeClass("active");
|
||||
body.removeClass("header-dark").addClass("header-white");
|
||||
|
||||
//Store in local storage
|
||||
setOptions("headerBackground", "header-white");
|
||||
});
|
||||
|
||||
//Click for current options
|
||||
if (currentOptions.headerBackground === "header-white") {
|
||||
header_light.trigger("click");
|
||||
}
|
||||
|
||||
// Sidebar Background
|
||||
var sidebar_dark = jQuery(".sidebar-dark");
|
||||
var sidebar_light = jQuery(".sidebar-light");
|
||||
|
||||
sidebar_dark.click(function () {
|
||||
"use strict";
|
||||
jQuery(this).addClass("active");
|
||||
sidebar_light.removeClass("active");
|
||||
body.removeClass("sidebar-light").addClass("sidebar-dark");
|
||||
|
||||
//Store in local storage
|
||||
setOptions("navigationBackground", "sidebar-dark");
|
||||
});
|
||||
|
||||
//Click for current options
|
||||
if (currentOptions.navigationBackground === "sidebar-dark") {
|
||||
sidebar_dark.trigger("click");
|
||||
}
|
||||
|
||||
sidebar_light.click(function () {
|
||||
"use strict";
|
||||
jQuery(this).addClass("active");
|
||||
sidebar_dark.removeClass("active");
|
||||
body.removeClass("sidebar-dark").addClass("sidebar-light");
|
||||
|
||||
//Store in local storage
|
||||
setOptions("navigationBackground", "sidebar-light");
|
||||
});
|
||||
|
||||
//Click for current options
|
||||
if (currentOptions.navigationBackground === "sidebar-light") {
|
||||
sidebar_light.trigger("click");
|
||||
}
|
||||
|
||||
// Menu Dropdown Icon
|
||||
$("input:radio[name=menu-dropdown-icon]").change(function () {
|
||||
// var className = $('input:radio[name=menu-dropdown-icon]:checked').val().toLowerCase().replace(/\s+/, "-");
|
||||
// $(".sidebar-menu").attr('class', 'sidebar-menu ' + className);
|
||||
// setOptions("menuDropdownIcon", className);
|
||||
var newClass1 = ["sidebar-menu"];
|
||||
newClass1.push(
|
||||
$("input:radio[name=menu-dropdown-icon]:checked")
|
||||
.val()
|
||||
.toLowerCase()
|
||||
.replace(/\s+/, "-")
|
||||
);
|
||||
newClass1.push(
|
||||
$("input:radio[name=menu-list-icon]:checked")
|
||||
.val()
|
||||
.toLowerCase()
|
||||
.replace(/\s+/, "-")
|
||||
);
|
||||
$(".sidebar-menu").attr("class", newClass1.join(" "));
|
||||
setOptions("menuDropdownIcon", newClass1.slice(-2)[0]);
|
||||
});
|
||||
if (currentOptions.menuDropdownIcon === "icon-style-1") {
|
||||
$("input:radio[value=icon-style-1]").trigger("click");
|
||||
}
|
||||
if (currentOptions.menuDropdownIcon === "icon-style-2") {
|
||||
$("input:radio[value=icon-style-2]").trigger("click");
|
||||
}
|
||||
if (currentOptions.menuDropdownIcon === "icon-style-3") {
|
||||
$("input:radio[value=icon-style-3]").trigger("click");
|
||||
}
|
||||
|
||||
// Menu List Icon
|
||||
$("input:radio[name=menu-list-icon]").change(function () {
|
||||
var newClass = ["sidebar-menu"];
|
||||
newClass.push(
|
||||
$("input:radio[name=menu-dropdown-icon]:checked")
|
||||
.val()
|
||||
.toLowerCase()
|
||||
.replace(/\s+/, "-")
|
||||
);
|
||||
newClass.push(
|
||||
$("input:radio[name=menu-list-icon]:checked")
|
||||
.val()
|
||||
.toLowerCase()
|
||||
.replace(/\s+/, "-")
|
||||
);
|
||||
$(".sidebar-menu").attr("class", newClass.join(" "));
|
||||
setOptions("menuListIcon", newClass.slice(-1)[0]);
|
||||
});
|
||||
if (currentOptions.menuListIcon === "icon-list-style-1") {
|
||||
$("input:radio[value=icon-list-style-1]").trigger("click");
|
||||
}
|
||||
if (currentOptions.menuListIcon === "icon-list-style-2") {
|
||||
$("input:radio[value=icon-list-style-2]").trigger("click");
|
||||
}
|
||||
if (currentOptions.menuListIcon === "icon-list-style-3") {
|
||||
$("input:radio[value=icon-list-style-3]").trigger("click");
|
||||
}
|
||||
if (currentOptions.menuListIcon === "icon-list-style-4") {
|
||||
$("input:radio[value=icon-list-style-4]").trigger("click");
|
||||
}
|
||||
if (currentOptions.menuListIcon === "icon-list-style-5") {
|
||||
$("input:radio[value=icon-list-style-5]").trigger("click");
|
||||
}
|
||||
if (currentOptions.menuListIcon === "icon-list-style-6") {
|
||||
$("input:radio[value=icon-list-style-6]").trigger("click");
|
||||
}
|
||||
|
||||
$("#reset-settings").click(function () {
|
||||
clearOptions();
|
||||
location.reload();
|
||||
});
|
||||
|
||||
jQuery(".welcome-modal-btn").click(function () {
|
||||
"use strict";
|
||||
jQuery(this).addClass("active");
|
||||
jQuery(".welcome-modal").show();
|
||||
//Store in local storage
|
||||
setOptions("welcomemodal", "show");
|
||||
});
|
||||
if (currentOptions.welcomemodal === "show") {
|
||||
jQuery(".welcome-modal-btn").trigger("click").addClass("active");
|
||||
}
|
||||
jQuery(".welcome-modal-close").click(function () {
|
||||
"use strict";
|
||||
jQuery(".welcome-modal-btn").removeClass("active");
|
||||
jQuery(".welcome-modal").slideToggle();
|
||||
//Store in local storage
|
||||
setOptions("welcomemodal", "hide");
|
||||
});
|
||||
if (currentOptions.welcomemodal === "hide") {
|
||||
jQuery(".welcome-modal-close").trigger("click");
|
||||
jQuery(".welcome-modal-btn").removeClass("active");
|
||||
}
|
||||
});
|
||||
})();
|
||||
35
public/back/vendors/scripts/process.js
vendored
Normal file
35
public/back/vendors/scripts/process.js
vendored
Normal file
@@ -0,0 +1,35 @@
|
||||
var width = 100,
|
||||
perfData = window.performance.timing, // The PerformanceTiming interface represents timing-related performance information for the given page.
|
||||
EstimatedTime = -(perfData.loadEventEnd - perfData.navigationStart),
|
||||
time = parseInt((EstimatedTime/1000)%60)*100;
|
||||
|
||||
// Percentage Increment Animation
|
||||
var PercentageID = $("#percent1"),
|
||||
start = 0,
|
||||
end = 100,
|
||||
durataion = time;
|
||||
animateValue(PercentageID, start, end, durataion);
|
||||
|
||||
function animateValue(id, start, end, duration) {
|
||||
|
||||
var range = end - start,
|
||||
current = start,
|
||||
increment = end > start? 1 : -1,
|
||||
stepTime = Math.abs(Math.floor(duration / range)),
|
||||
obj = $(id);
|
||||
|
||||
var timer = setInterval(function() {
|
||||
current += increment;
|
||||
$(obj).text(current + "%");
|
||||
$("#bar1").css('width', current+"%");
|
||||
//obj.innerHTML = current;
|
||||
if (current == end) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
}, stepTime);
|
||||
}
|
||||
|
||||
// Fading Out Loadbar on Finised
|
||||
setTimeout(function(){
|
||||
$('.pre-loader').fadeOut(300);
|
||||
}, time);
|
||||
105
public/back/vendors/scripts/range-slider-setting.js
vendored
Normal file
105
public/back/vendors/scripts/range-slider-setting.js
vendored
Normal file
@@ -0,0 +1,105 @@
|
||||
$("#range_01").ionRangeSlider({
|
||||
min: 0,
|
||||
max: 100,
|
||||
from: 50,
|
||||
type: "single",
|
||||
grid: true,
|
||||
prefix: "$"
|
||||
});
|
||||
$("#range_01_1").ionRangeSlider({
|
||||
min: 0,
|
||||
max: 100,
|
||||
from: 25,
|
||||
to: 75,
|
||||
to_min: 60,
|
||||
to_max: 90,
|
||||
to_shadow: true,
|
||||
type: "double",
|
||||
grid: true,
|
||||
prefix: "$"
|
||||
});
|
||||
$("#range_02").ionRangeSlider({
|
||||
type: "double",
|
||||
grid: true,
|
||||
min: -1000,
|
||||
max: 1000,
|
||||
from: -500,
|
||||
to: 500,
|
||||
prefix: "$",
|
||||
skin: "round",
|
||||
type: "single",
|
||||
});
|
||||
$("#range_02_1").ionRangeSlider({
|
||||
type: "double",
|
||||
grid: true,
|
||||
min: -1000,
|
||||
max: 1000,
|
||||
from: -500,
|
||||
to: 500,
|
||||
prefix: "$",
|
||||
skin: "round"
|
||||
});
|
||||
$("#range_03").ionRangeSlider({
|
||||
type: "double",
|
||||
grid: true,
|
||||
from: 1,
|
||||
to: 5,
|
||||
skin: "modern",
|
||||
type: "single",
|
||||
values: [0, 10, 100, 500, 1000, 10000]
|
||||
});
|
||||
$("#range_03_1").ionRangeSlider({
|
||||
type: "double",
|
||||
grid: true,
|
||||
from: 1,
|
||||
to: 5,
|
||||
skin: "modern",
|
||||
values: [0, 10, 100, 500, 1000, 10000]
|
||||
});
|
||||
$("#range_04").ionRangeSlider({
|
||||
grid: true,
|
||||
min: 1000,
|
||||
max: 1000000,
|
||||
from: 400000,
|
||||
step: 1000,
|
||||
skin: "sharp",
|
||||
type: "single",
|
||||
prettify_enabled: true,
|
||||
prettify: function (num) {
|
||||
return (Math.random() * num).toFixed(0);
|
||||
}
|
||||
});
|
||||
$("#range_04_1").ionRangeSlider({
|
||||
grid: true,
|
||||
min: 1000,
|
||||
max: 1000000,
|
||||
from: 400000,
|
||||
step: 1000,
|
||||
skin: "sharp",
|
||||
prettify_enabled: true,
|
||||
prettify: function (num) {
|
||||
return (Math.random() * num).toFixed(0);
|
||||
}
|
||||
});
|
||||
$("#range_05").ionRangeSlider({
|
||||
type: "single",
|
||||
min: 1000,
|
||||
max: 2000,
|
||||
from: 1200,
|
||||
to: 1800,
|
||||
skin: "square",
|
||||
hide_min_max: true,
|
||||
hide_from_to: false,
|
||||
grid: false
|
||||
});
|
||||
$("#range_05_1").ionRangeSlider({
|
||||
type: "double",
|
||||
min: 1000,
|
||||
max: 2000,
|
||||
from: 1200,
|
||||
to: 1800,
|
||||
skin: "square",
|
||||
hide_min_max: true,
|
||||
hide_from_to: false,
|
||||
grid: false
|
||||
});
|
||||
360
public/back/vendors/scripts/script.js
vendored
Normal file
360
public/back/vendors/scripts/script.js
vendored
Normal file
@@ -0,0 +1,360 @@
|
||||
jQuery(window).on("load", function () {
|
||||
"use strict";
|
||||
// bootstrap wysihtml5
|
||||
$(".textarea_editor").wysihtml5({
|
||||
html: true,
|
||||
});
|
||||
});
|
||||
jQuery(window).on("load resize", function () {
|
||||
// custom scrollbar
|
||||
$(".customscroll").mCustomScrollbar({
|
||||
theme: "dark-2",
|
||||
scrollInertia: 300,
|
||||
autoExpandScrollbar: true,
|
||||
advanced: { autoExpandHorizontalScroll: true },
|
||||
});
|
||||
});
|
||||
jQuery(document).ready(function () {
|
||||
"use strict";
|
||||
// Background Image
|
||||
jQuery(".bg_img").each(function (i, elem) {
|
||||
var img = jQuery(elem);
|
||||
jQuery(this).hide();
|
||||
jQuery(this)
|
||||
.parent()
|
||||
.css({
|
||||
background: "url(" + img.attr("src") + ") no-repeat center center",
|
||||
});
|
||||
});
|
||||
|
||||
/*==============================================================*/
|
||||
// Image to svg convert start
|
||||
/*==============================================================*/
|
||||
jQuery("img.svg").each(function () {
|
||||
var $img = jQuery(this);
|
||||
var imgID = $img.attr("id");
|
||||
var imgClass = $img.attr("class");
|
||||
var imgURL = $img.attr("src");
|
||||
jQuery.get(
|
||||
imgURL,
|
||||
function (data) {
|
||||
var $svg = jQuery(data).find("svg");
|
||||
if (typeof imgID !== "undefined") {
|
||||
$svg = $svg.attr("id", imgID);
|
||||
}
|
||||
if (typeof imgClass !== "undefined") {
|
||||
$svg = $svg.attr("class", imgClass + " replaced-svg");
|
||||
}
|
||||
$svg = $svg.removeAttr("xmlns:a");
|
||||
if (
|
||||
!$svg.attr("viewBox") &&
|
||||
$svg.attr("height") &&
|
||||
$svg.attr("width")
|
||||
) {
|
||||
$svg.attr(
|
||||
"viewBox",
|
||||
"0 0 " + $svg.attr("height") + " " + $svg.attr("width")
|
||||
);
|
||||
}
|
||||
$img.replaceWith($svg);
|
||||
},
|
||||
"xml"
|
||||
);
|
||||
});
|
||||
/*==============================================================*/
|
||||
// Image to svg convert end
|
||||
/*==============================================================*/
|
||||
|
||||
// click to scroll
|
||||
// $('.collapse-box').on('shown.bs.collapse', function () {
|
||||
// $(".customscroll").mCustomScrollbar("scrollTo",$(this));
|
||||
// });
|
||||
|
||||
// code split
|
||||
var entityMap = {
|
||||
"&": "&",
|
||||
"<": "<",
|
||||
">": ">",
|
||||
'"': """,
|
||||
"'": "'",
|
||||
"/": "/",
|
||||
};
|
||||
function escapeHtml(string) {
|
||||
return String(string).replace(/[&<>"'\/]/g, function (s) {
|
||||
return entityMap[s];
|
||||
});
|
||||
}
|
||||
//document.addEventListener("DOMContentLoaded", init, false);
|
||||
window.onload = function init() {
|
||||
var codeblock = document.querySelectorAll("pre code");
|
||||
if (codeblock.length) {
|
||||
for (var i = 0, len = codeblock.length; i < len; i++) {
|
||||
var dom = codeblock[i];
|
||||
var html = dom.innerHTML;
|
||||
html = escapeHtml(html);
|
||||
dom.innerHTML = html;
|
||||
}
|
||||
$("pre code").each(function (i, block) {
|
||||
hljs.highlightBlock(block);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// Search Icon
|
||||
$("#filter_input").on("keyup", function () {
|
||||
var value = $(this).val().toLowerCase();
|
||||
$("#filter_list .fa-hover").filter(function () {
|
||||
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1);
|
||||
});
|
||||
});
|
||||
|
||||
// custom select 2 init
|
||||
$(".custom-select2").select2();
|
||||
|
||||
// Bootstrap Select
|
||||
//$('.selectpicker').selectpicker();
|
||||
|
||||
// tooltip init
|
||||
$('[data-toggle="tooltip"]').tooltip();
|
||||
|
||||
// popover init
|
||||
$('[data-toggle="popover"]').popover();
|
||||
|
||||
// form-control on focus add class
|
||||
$(".form-control").on("focus", function () {
|
||||
$(this).parent().addClass("focus");
|
||||
});
|
||||
$(".form-control").on("focusout", function () {
|
||||
$(this).parent().removeClass("focus");
|
||||
});
|
||||
|
||||
// sidebar menu icon
|
||||
$('.menu-icon, [data-toggle="left-sidebar-close"]').on("click", function () {
|
||||
//$(this).toggleClass('open');
|
||||
$("body").toggleClass("sidebar-shrink");
|
||||
$(".left-side-bar").toggleClass("open");
|
||||
$(".mobile-menu-overlay").toggleClass("show");
|
||||
});
|
||||
$('[data-toggle="header_search"]').on("click", function () {
|
||||
jQuery(".header-search").slideToggle();
|
||||
});
|
||||
|
||||
var w = $(window).width();
|
||||
$(document).on("touchstart click", function (e) {
|
||||
if (
|
||||
$(e.target).parents(".left-side-bar").length == 0 &&
|
||||
!$(e.target).is(".menu-icon, .menu-icon img")
|
||||
) {
|
||||
$(".left-side-bar").removeClass("open");
|
||||
$(".menu-icon").removeClass("open");
|
||||
$(".mobile-menu-overlay").removeClass("show");
|
||||
}
|
||||
});
|
||||
// $(window).on("resize", function () {
|
||||
// var w = $(window).width();
|
||||
// if ($(window).width() > 1200) {
|
||||
// $(".left-side-bar").removeClass("open");
|
||||
// $(".menu-icon").removeClass("open");
|
||||
// $(".mobile-menu-overlay").removeClass("show");
|
||||
// }
|
||||
// });
|
||||
|
||||
// sidebar menu Active Class
|
||||
$("#accordion-menu").each(function () {
|
||||
var vars = window.location.href.split("/").pop();
|
||||
$(this)
|
||||
.find('a[href="' + vars + '"]')
|
||||
.addClass("active");
|
||||
});
|
||||
|
||||
// click to copy icon
|
||||
$(".fa-hover").click(function (event) {
|
||||
event.preventDefault();
|
||||
var $html = $(this).find(".icon-copy").first();
|
||||
var str = $html.prop("outerHTML");
|
||||
CopyToClipboard(str, true, "Copied");
|
||||
});
|
||||
var clipboard = new ClipboardJS(".code-copy");
|
||||
clipboard.on("success", function (e) {
|
||||
CopyToClipboard("", true, "Copied");
|
||||
e.clearSelection();
|
||||
});
|
||||
|
||||
// date picker
|
||||
$(".date-picker").datepicker({
|
||||
language: "en",
|
||||
autoClose: true,
|
||||
dateFormat: "dd MM yyyy",
|
||||
});
|
||||
$(".datetimepicker").datepicker({
|
||||
timepicker: true,
|
||||
language: "en",
|
||||
autoClose: true,
|
||||
dateFormat: "dd MM yyyy",
|
||||
});
|
||||
$(".datetimepicker-range").datepicker({
|
||||
language: "en",
|
||||
range: true,
|
||||
multipleDates: true,
|
||||
multipleDatesSeparator: " - ",
|
||||
});
|
||||
$(".month-picker").datepicker({
|
||||
language: "en",
|
||||
minView: "months",
|
||||
view: "months",
|
||||
autoClose: true,
|
||||
dateFormat: "MM yyyy",
|
||||
});
|
||||
|
||||
// only time picker
|
||||
$(".time-picker").timeDropper({
|
||||
mousewheel: true,
|
||||
meridians: true,
|
||||
init_animation: "dropdown",
|
||||
setCurrentTime: false,
|
||||
});
|
||||
$(".time-picker-default").timeDropper();
|
||||
|
||||
// var color = $('.btn').data('color');
|
||||
// console.log(color);
|
||||
// $('.btn').style('color'+color);
|
||||
$("[data-color]").each(function () {
|
||||
$(this).css("color", $(this).attr("data-color"));
|
||||
});
|
||||
$("[data-bgcolor]").each(function () {
|
||||
$(this).css("background-color", $(this).attr("data-bgcolor"));
|
||||
});
|
||||
$("[data-border]").each(function () {
|
||||
$(this).css("border", $(this).attr("data-border"));
|
||||
});
|
||||
|
||||
$("#accordion-menu").vmenuModule({
|
||||
Speed: 400,
|
||||
autostart: false,
|
||||
autohide: true,
|
||||
});
|
||||
});
|
||||
|
||||
// sidebar menu accordion
|
||||
(function ($) {
|
||||
$.fn.vmenuModule = function (option) {
|
||||
var obj, item;
|
||||
var options = $.extend(
|
||||
{
|
||||
Speed: 220,
|
||||
autostart: true,
|
||||
autohide: 1,
|
||||
},
|
||||
option
|
||||
);
|
||||
obj = $(this);
|
||||
|
||||
item = obj.find("ul").parent("li").children("a");
|
||||
item.attr("data-option", "off");
|
||||
|
||||
item.unbind("click").on("click", function () {
|
||||
var a = $(this);
|
||||
if (options.autohide) {
|
||||
a.parent()
|
||||
.parent()
|
||||
.find("a[data-option='on']")
|
||||
.parent("li")
|
||||
.children("ul")
|
||||
.slideUp(options.Speed / 1.2, function () {
|
||||
$(this).parent("li").children("a").attr("data-option", "off");
|
||||
$(this).parent("li").removeClass("show");
|
||||
});
|
||||
}
|
||||
if (a.attr("data-option") == "off") {
|
||||
a.parent("li")
|
||||
.children("ul")
|
||||
.slideDown(options.Speed, function () {
|
||||
a.attr("data-option", "on");
|
||||
a.parent("li").addClass("show");
|
||||
});
|
||||
}
|
||||
if (a.attr("data-option") == "on") {
|
||||
a.attr("data-option", "off");
|
||||
a.parent("li").children("ul").slideUp(options.Speed);
|
||||
a.parent("li").removeClass("show");
|
||||
}
|
||||
});
|
||||
if (options.autostart) {
|
||||
obj.find("a").each(function () {
|
||||
$(this)
|
||||
.parent("li")
|
||||
.parent("ul")
|
||||
.slideDown(options.Speed, function () {
|
||||
$(this).parent("li").children("a").attr("data-option", "on");
|
||||
});
|
||||
});
|
||||
} else {
|
||||
obj.find("a.active").each(function () {
|
||||
$(this)
|
||||
.parent("li")
|
||||
.parent("ul")
|
||||
.slideDown(options.Speed, function () {
|
||||
$(this).parent("li").children("a").attr("data-option", "on");
|
||||
$(this).parent("li").addClass("show");
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
})(window.jQuery || window.Zepto);
|
||||
|
||||
// copy to clipboard function
|
||||
function CopyToClipboard(value, showNotification, notificationText) {
|
||||
var $temp = $("<input>");
|
||||
if (value != "") {
|
||||
var $temp = $("<input>");
|
||||
$("body").append($temp);
|
||||
$temp.val(value).select();
|
||||
document.execCommand("copy");
|
||||
$temp.remove();
|
||||
}
|
||||
if (typeof showNotification === "undefined") {
|
||||
showNotification = true;
|
||||
}
|
||||
if (typeof notificationText === "undefined") {
|
||||
notificationText = "Copied to clipboard";
|
||||
}
|
||||
var notificationTag = $("div.copy-notification");
|
||||
if (showNotification && notificationTag.length == 0) {
|
||||
notificationTag = $("<div/>", {
|
||||
class: "copy-notification",
|
||||
text: notificationText,
|
||||
});
|
||||
$("body").append(notificationTag);
|
||||
|
||||
notificationTag.fadeIn("slow", function () {
|
||||
setTimeout(function () {
|
||||
notificationTag.fadeOut("slow", function () {
|
||||
notificationTag.remove();
|
||||
});
|
||||
}, 1000);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// detectIE Browser
|
||||
(function detectIE() {
|
||||
var ua = window.navigator.userAgent;
|
||||
|
||||
var msie = ua.indexOf("MSIE ");
|
||||
if (msie > 0) {
|
||||
// IE 10 or older => return version number
|
||||
var ieV = parseInt(ua.substring(msie + 5, ua.indexOf(".", msie)), 10);
|
||||
document.querySelector("body").className += " IE";
|
||||
}
|
||||
|
||||
var trident = ua.indexOf("Trident/");
|
||||
if (trident > 0) {
|
||||
// IE 11 => return version number
|
||||
var rv = ua.indexOf("rv:");
|
||||
var ieV = parseInt(ua.substring(rv + 3, ua.indexOf(".", rv)), 10);
|
||||
document.querySelector("body").className += " IE";
|
||||
}
|
||||
|
||||
// other browser
|
||||
return false;
|
||||
})();
|
||||
1
public/back/vendors/scripts/script.min.js
vendored
Normal file
1
public/back/vendors/scripts/script.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
33
public/back/vendors/scripts/steps-setting.js
vendored
Normal file
33
public/back/vendors/scripts/steps-setting.js
vendored
Normal file
@@ -0,0 +1,33 @@
|
||||
$(".tab-wizard").steps({
|
||||
headerTag: "h5",
|
||||
bodyTag: "section",
|
||||
transitionEffect: "fade",
|
||||
titleTemplate: '<span class="step">#index#</span> #title#',
|
||||
labels: {
|
||||
finish: "Submit"
|
||||
},
|
||||
onStepChanged: function (event, currentIndex, priorIndex) {
|
||||
$('.steps .current').prevAll().addClass('disabled');
|
||||
},
|
||||
onFinished: function (event, currentIndex) {
|
||||
$('#success-modal').modal('show');
|
||||
}
|
||||
});
|
||||
|
||||
$(".tab-wizard2").steps({
|
||||
headerTag: "h5",
|
||||
bodyTag: "section",
|
||||
transitionEffect: "fade",
|
||||
titleTemplate: '<span class="step">#index#</span> <span class="info">#title#</span>',
|
||||
labels: {
|
||||
finish: "Submit",
|
||||
next: "Next",
|
||||
previous: "Previous",
|
||||
},
|
||||
onStepChanged: function(event, currentIndex, priorIndex) {
|
||||
$('.steps .current').prevAll().addClass('disabled');
|
||||
},
|
||||
onFinished: function(event, currentIndex) {
|
||||
$('#success-modal-btn').trigger('click');
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user