[Frontend] 靜態文件及套件整理
This commit is contained in:
parent
f32af4ecde
commit
006f100c9c
@ -1,185 +1,708 @@
|
||||
|
||||
<div class="row d-flex justify-content-between mx-3 mt-3">
|
||||
<!-- 天氣圖 -->
|
||||
<div class="col-sm-12 col-xl-4">
|
||||
<img src="..\assets\img\clouds.png"
|
||||
class="img-fluid"
|
||||
style="min-height: 520px; background-color: aquamarine" />
|
||||
</div>
|
||||
|
||||
<div class="col-sm-12 col-xl-4">
|
||||
<main id="js-page-content" role="main" class="page-content">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-xl-6">
|
||||
<div class="p-3 bg-info rounded position-relative text-white">
|
||||
<h3 class="display-6 d-block m-0">21.5k</h3>
|
||||
<small class="m-0">users signed up</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-6">
|
||||
<div class="p-3 bg-warning rounded position-relative text-white">
|
||||
<h3 class="display-6 d-block m-0">$10,203</h3>
|
||||
<small class="m-0">Visual Index Figure</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-12 mt-4">
|
||||
<div class="card text-white bg-dark" style="min-height: 390px">
|
||||
<div class="card-header">昨日/今日用電比較</div>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Dark card title</h5>
|
||||
<p class="card-text">
|
||||
Some quick example text to build on the card title and make up the
|
||||
bulk of the card's content.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12 col-xl-4">
|
||||
<img src="img/clouds.png" class="img-fluid" style="min-height: 520px;">
|
||||
</div>
|
||||
<div class="col-sm-12 col-xl-4">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-xl-6">
|
||||
<div class="p-3 bg-success rounded position-relative text-white">
|
||||
<h3 class="display-6 d-block m-0 fw-500">- 103.72</h3>
|
||||
<small class="m-0">Offset Balance Ratio</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-6">
|
||||
<div class="p-3 bg-secondary rounded position-relative text-white">
|
||||
<h3 class="display-6 d-block m-0 fw-500">+40%</h3>
|
||||
<small class="m-0">Product level increase</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-12 mt-4">
|
||||
<div class="card text-white bg-dark" style="min-height: 390px">
|
||||
<div class="card-header">本週/上週用電比較</div>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Dark card title</h5>
|
||||
<p class="card-text">
|
||||
Some quick example text to build on the card title and make up the
|
||||
bulk of the card's content.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 按鈕組 卡片組 -->
|
||||
<div class="row d-flex justify-content-between col mx-3 my-3">
|
||||
<!-- 按鈕組 -->
|
||||
<div class="col-sm-12 col-lg-8">
|
||||
<div class="row">
|
||||
<div class="btn-group btn-group-lg col-lg-3 mb-4"
|
||||
v-for="btn in btns"
|
||||
:key="btn">
|
||||
<button type="button" class="btn btn-secondary col-6">
|
||||
<i :class="btn.icon"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-secondary col-6">
|
||||
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 卡片組 -->
|
||||
<div class="col-sm-12 col-lg-4">
|
||||
<!-- 異常狀態 -->
|
||||
<div class="mb-1">
|
||||
<div class="card text-white bg-dark">
|
||||
<div class="card-header">異常狀態</div>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Dark card title</h5>
|
||||
<p class="card-text">
|
||||
Some quick example text to build on the card title and make up the
|
||||
bulk of the card's content.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 工單進度 -->
|
||||
<div class="p-3 bg-primary-300 rounded overflow-hidden position-relative text-white mb-g">
|
||||
<div class="">
|
||||
<div class="card text-white bg-dark">
|
||||
<div class="card-header">工單進度</div>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Dark card title</h5>
|
||||
<p class="card-text">
|
||||
Some quick example text to build on the card title and make up the
|
||||
bulk of the card's content.
|
||||
</p>
|
||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||
21.5k
|
||||
<small class="m-0 l-h-n">users signed up</small>
|
||||
</h3>
|
||||
</div>
|
||||
<i class="fal fa-user position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n1" style="font-size:6rem"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-6">
|
||||
<div class="p-3 bg-warning-400 rounded overflow-hidden position-relative text-white mb-g">
|
||||
<div class="">
|
||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||
$10,203
|
||||
<small class="m-0 l-h-n">Visual Index Figure</small>
|
||||
</h3>
|
||||
</div>
|
||||
<i class="fal fa-gem position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4" style="font-size: 6rem;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-12">
|
||||
<div id="panel-2" class="panel panel-locked" data-panel-sortable data-panel-collapsed data-panel-close>
|
||||
<div class="panel-hdr">
|
||||
<h2>
|
||||
昨日/今日用電比較
|
||||
</h2>
|
||||
</div>
|
||||
<div class="panel-container show">
|
||||
<div class="panel-content poisition-relative" style="min-height: 346.84px;">
|
||||
<div class="p-1 position-absolute pos-right pos-top mt-3 mr-3 z-index-cloud d-flex align-items-center justify-content-center">
|
||||
<div class="border-faded border-top-0 border-left-0 border-bottom-0 py-2 pr-4 mr-3 hidden-sm-down">
|
||||
<div class="text-right fw-500 l-h-n d-flex flex-column">
|
||||
<div class="h3 m-0 d-flex align-items-center justify-content-end">
|
||||
<div class='icon-stack mr-2'>
|
||||
<i class="base base-7 icon-stack-3x opacity-100 color-success-600"></i>
|
||||
<i class="base base-7 icon-stack-2x opacity-100 color-success-500"></i>
|
||||
<i class="fal fa-arrow-up icon-stack-1x opacity-100 color-white"></i>
|
||||
</div>
|
||||
$44.34 / GE
|
||||
</div>
|
||||
<span class="m-0 fs-xs text-muted">Increased Profit as per redux margins and estimates</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="js-easy-pie-chart color-info-400 position-relative d-inline-flex align-items-center justify-content-center" data-percent="35" data-piesize="95" data-linewidth="10" data-scalelength="5">
|
||||
<div class="js-easy-pie-chart color-success-400 position-relative position-absolute pos-left pos-right pos-top pos-bottom d-flex align-items-center justify-content-center" data-percent="65" data-piesize="60" data-linewidth="5" data-scalelength="1" data-scalecolor="#fff">
|
||||
<div class="position-absolute pos-top pos-left pos-right pos-bottom d-flex align-items-center justify-content-center fw-500 fs-xl text-dark">78%</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="flot-area" style="width:100%; height:300px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12 col-xl-4">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-xl-6">
|
||||
<div class="p-3 bg-success-200 rounded overflow-hidden position-relative text-white mb-g">
|
||||
<div class="">
|
||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||
- 103.72
|
||||
<small class="m-0 l-h-n">Offset Balance Ratio</small>
|
||||
</h3>
|
||||
</div>
|
||||
<i class="fal fa-lightbulb position-absolute pos-right pos-bottom opacity-15 mb-n5 mr-n6" style="font-size: 8rem;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-6">
|
||||
<div class="p-3 bg-info-200 rounded overflow-hidden position-relative text-white mb-g">
|
||||
<div class="">
|
||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||
+40%
|
||||
<small class="m-0 l-h-n">Product level increase</small>
|
||||
</h3>
|
||||
</div>
|
||||
<i class="fal fa-globe position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4" style="font-size: 6rem;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-12">
|
||||
<div id="panel-3" class="panel panel-locked" data-panel-sortable data-panel-collapsed data-panel-close>
|
||||
<div class="panel-hdr">
|
||||
<h2>
|
||||
本週/上週用電比較
|
||||
</h2>
|
||||
</div>
|
||||
<div class="panel-container show">
|
||||
<div class="panel-content poisition-relative">
|
||||
<div class="pb-5 pt-3">
|
||||
<div class="row">
|
||||
<div class="col-6 col-xl-3 d-sm-flex align-items-center">
|
||||
<div class="p-2 mr-3 bg-info-200 rounded">
|
||||
<span class="peity-bar" data-peity="{"fill": ["#fff"], "width": 27, "height": 27 }">3,4,5,8,2</span>
|
||||
</div>
|
||||
<div>
|
||||
<label class="fs-sm mb-0">Bounce Rate</label>
|
||||
<h4 class="font-weight-bold mb-0">37.56%</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-xl-3 d-sm-flex align-items-center">
|
||||
<div class="p-2 mr-3 bg-info-300 rounded">
|
||||
<span class="peity-bar" data-peity="{"fill": ["#fff"], "width": 27, "height": 27 }">5,3,1,7,9</span>
|
||||
</div>
|
||||
<div>
|
||||
<label class="fs-sm mb-0">Sessions</label>
|
||||
<h4 class="font-weight-bold mb-0">759</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-xl-3 d-sm-flex align-items-center">
|
||||
<div class="p-2 mr-3 bg-success-300 rounded">
|
||||
<span class="peity-bar" data-peity="{"fill": ["#fff"], "width": 27, "height": 27 }">3,4,3,5,5</span>
|
||||
</div>
|
||||
<div>
|
||||
<label class="fs-sm mb-0">New Sessions</label>
|
||||
<h4 class="font-weight-bold mb-0">12.17%</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-xl-3 d-sm-flex align-items-center">
|
||||
<div class="p-2 mr-3 bg-success-500 rounded">
|
||||
<span class="peity-bar" data-peity="{"fill": ["#fff"], "width": 27, "height": 27 }">6,4,7,5,6</span>
|
||||
</div>
|
||||
<div>
|
||||
<label class="fs-sm mb-0">Clickthrough</label>
|
||||
<h4 class="font-weight-bold mb-0">19.77%</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="flotVisit" style="width:100%; height:208px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-12 col-lg-4">
|
||||
<div class="row">
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-lightbulb-on fa-2x blink"></i></button>
|
||||
<button type="button" class="btn btn-secondary">照明系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-thermometer-full fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">環境感測系統</button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-car-battery fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">電錶系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-wind fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">空調系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-window-restore fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">電梯系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-door-closed fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">門禁系統 </button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12 col-lg-4">
|
||||
<div class="row">
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-lightbulb-on fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">照明系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-thermometer-full fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">環境感測系統</button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-car-battery fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">電錶系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-wind fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">空調系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-window-restore fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">電梯系統 </button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg col-lg-6 mb-4">
|
||||
<button type="button" class="btn btn-secondary"><i class="fal fa-door-closed fa-2x"></i></button>
|
||||
<button type="button" class="btn btn-secondary">門禁系統 </button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12 col-lg-4">
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<div id="panel-3" class="panel panel-locked" data-panel-sortable data-panel-collapsed data-panel-close>
|
||||
<div class="panel-hdr">
|
||||
<h2>
|
||||
異常狀態
|
||||
</h2>
|
||||
</div>
|
||||
<div class="panel-container show">
|
||||
<div class="panel-content poisition-relative">
|
||||
<div class="pb-5 pt-3">
|
||||
<div class="d-flex mr-4">
|
||||
<div class="mr-2">
|
||||
<span class="peity-donut" data-peity="{ "fill": ["#967bbd", "#ccbfdf"], "innerRadius": 14, "radius": 20 }">7/10</span>
|
||||
</div>
|
||||
<div>
|
||||
<label class="fs-sm mb-0 mt-2 mt-md-0">New Sessions</label>
|
||||
<h4 class="font-weight-bold mb-0">70.60%</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<div id="panel-3" class="panel panel-locked" data-panel-sortable data-panel-collapsed data-panel-close>
|
||||
<div class="panel-hdr">
|
||||
<h2>
|
||||
工單進度
|
||||
</h2>
|
||||
</div>
|
||||
<div class="panel-container show">
|
||||
<div class="panel-content poisition-relative">
|
||||
<div class="pb-5 pt-3">
|
||||
<div class="d-flex mr-0">
|
||||
<div class="mr-2">
|
||||
<span class="peity-donut" data-peity="{ "fill": ["#2196F3", "#9acffa"], "innerRadius": 14, "radius": 20 }">3/10</span>
|
||||
</div>
|
||||
<div>
|
||||
<label class="fs-sm mb-0 mt-2 mt-md-0">Page Views</label>
|
||||
<h4 class="font-weight-bold mb-0">14,134</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</main>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
import { useStore } from 'vuex';
|
||||
export default {
|
||||
setup() {
|
||||
const store = useStore();
|
||||
/* defined datas */
|
||||
var dataTargetProfit = [
|
||||
[1354586000000, 153],
|
||||
[1364587000000, 658],
|
||||
[1374588000000, 198],
|
||||
[1384589000000, 663],
|
||||
[1394590000000, 801],
|
||||
[1404591000000, 1080],
|
||||
[1414592000000, 353],
|
||||
[1424593000000, 749],
|
||||
[1434594000000, 523],
|
||||
[1444595000000, 258],
|
||||
[1454596000000, 688],
|
||||
[1464597000000, 364]
|
||||
]
|
||||
var dataProfit = [
|
||||
[1354586000000, 53],
|
||||
[1364587000000, 65],
|
||||
[1374588000000, 98],
|
||||
[1384589000000, 83],
|
||||
[1394590000000, 980],
|
||||
[1404591000000, 808],
|
||||
[1414592000000, 720],
|
||||
[1424593000000, 674],
|
||||
[1434594000000, 23],
|
||||
[1444595000000, 79],
|
||||
[1454596000000, 88],
|
||||
[1464597000000, 36]
|
||||
]
|
||||
var dataSignups = [
|
||||
[1354586000000, 647],
|
||||
[1364587000000, 435],
|
||||
[1374588000000, 784],
|
||||
[1384589000000, 346],
|
||||
[1394590000000, 487],
|
||||
[1404591000000, 463],
|
||||
[1414592000000, 479],
|
||||
[1424593000000, 236],
|
||||
[1434594000000, 843],
|
||||
[1444595000000, 657],
|
||||
[1454596000000, 241],
|
||||
[1464597000000, 341]
|
||||
]
|
||||
var dataSet1 = [
|
||||
[0, 10],
|
||||
[100, 8],
|
||||
[200, 7],
|
||||
[300, 5],
|
||||
[400, 4],
|
||||
[500, 6],
|
||||
[600, 3],
|
||||
[700, 2]
|
||||
];
|
||||
var dataSet2 = [
|
||||
[0, 9],
|
||||
[100, 6],
|
||||
[200, 5],
|
||||
[300, 3],
|
||||
[400, 3],
|
||||
[500, 5],
|
||||
[600, 2],
|
||||
[700, 1]
|
||||
];
|
||||
|
||||
return { store }
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
btns: [
|
||||
$(document).ready(function () {
|
||||
|
||||
/* init datatables */
|
||||
$('#dt-basic-example').dataTable(
|
||||
{
|
||||
name: "照明系統",
|
||||
icon: "fa-regular fa-lightbulb fa-2x",
|
||||
responsive: true,
|
||||
dom: "<'row mb-3'<'col-sm-12 col-md-6 d-flex align-items-center justify-content-start'f><'col-sm-12 col-md-6 d-flex align-items-center justify-content-end'B>>" +
|
||||
"<'row'<'col-sm-12'tr>>" +
|
||||
"<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
|
||||
buttons: [
|
||||
{
|
||||
extend: 'colvis',
|
||||
text: 'Column Visibility',
|
||||
titleAttr: 'Col visibility',
|
||||
className: 'btn-outline-default'
|
||||
},
|
||||
{
|
||||
name: "環境感測系統",
|
||||
icon: "fa-solid fa-temperature-three-quarters fa-2x",
|
||||
extend: 'csvHtml5',
|
||||
text: 'CSV',
|
||||
titleAttr: 'Generate CSV',
|
||||
className: 'btn-outline-default'
|
||||
},
|
||||
{
|
||||
name: "電表系統",
|
||||
icon: "fa-solid fa-bolt fa-2x",
|
||||
extend: 'copyHtml5',
|
||||
text: 'Copy',
|
||||
titleAttr: 'Copy to clipboard',
|
||||
className: 'btn-outline-default'
|
||||
},
|
||||
{
|
||||
name: "空調系統",
|
||||
icon: "fa-solid fa-wind fa-2x",
|
||||
},
|
||||
{
|
||||
name: "電梯系統",
|
||||
icon: "fa-solid fa-elevator fa-2x",
|
||||
},
|
||||
{
|
||||
name: "門禁系統",
|
||||
icon: "fa-sharp fa-solid fa-door-closed fa-2x",
|
||||
},
|
||||
{
|
||||
name: "照明系統",
|
||||
icon: "fa-regular fa-lightbulb fa-2x",
|
||||
},
|
||||
{
|
||||
name: "環境感測系統",
|
||||
icon: "fa-solid fa-temperature-three-quarters fa-2x",
|
||||
},
|
||||
{
|
||||
name: "電表系統",
|
||||
icon: "fa-solid fa-bolt fa-2x",
|
||||
},
|
||||
{
|
||||
name: "空調系統",
|
||||
icon: "fa-solid fa-wind fa-2x",
|
||||
},
|
||||
{
|
||||
name: "電梯系統",
|
||||
icon: "fa-solid fa-elevator fa-2x",
|
||||
},
|
||||
{
|
||||
name: "門禁系統",
|
||||
icon: "fa-sharp fa-solid fa-door-closed fa-2x",
|
||||
},
|
||||
extend: 'print',
|
||||
text: '<i class="fal fa-print"></i>',
|
||||
titleAttr: 'Print Table',
|
||||
className: 'btn-outline-default'
|
||||
}
|
||||
|
||||
],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
columnDefs: [
|
||||
{
|
||||
targets: -1,
|
||||
title: '',
|
||||
orderable: false,
|
||||
render: function (data, type, full, meta) {
|
||||
|
||||
/*
|
||||
-- ES6
|
||||
-- convert using https://babeljs.io online transpiler
|
||||
return `
|
||||
<a href='javascript:void(0);' class='btn btn-sm btn-icon btn-outline-danger rounded-circle mr-1' title='Delete Record'>
|
||||
<i class="fal fa-times"></i>
|
||||
</a>
|
||||
<div class='dropdown d-inline-block dropleft '>
|
||||
<a href='#'' class='btn btn-sm btn-icon btn-outline-primary rounded-circle shadow-0' data-toggle='dropdown' aria-expanded='true' title='More options'>
|
||||
<i class="fal fa-ellipsis-v"></i>
|
||||
</a>
|
||||
<div class='dropdown-menu'>
|
||||
<a class='dropdown-item' href='javascript:void(0);'>Change Status</a>
|
||||
<a class='dropdown-item' href='javascript:void(0);'>Generate Report</a>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
ES5 example below:
|
||||
|
||||
*/
|
||||
return "\n\t\t\t\t\t\t<a href='javascript:void(0);' class='btn btn-sm btn-icon btn-outline-danger rounded-circle mr-1' title='Delete Record'>\n\t\t\t\t\t\t\t<i class=\"fal fa-times\"></i>\n\t\t\t\t\t\t</a>\n\t\t\t\t\t\t<div class='dropdown d-inline-block dropleft'>\n\t\t\t\t\t\t\t<a href='#'' class='btn btn-sm btn-icon btn-outline-primary rounded-circle shadow-0' data-toggle='dropdown' aria-expanded='true' title='More options'>\n\t\t\t\t\t\t\t\t<i class=\"fal fa-ellipsis-v\"></i>\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<div class='dropdown-menu'>\n\t\t\t\t\t\t\t\t<a class='dropdown-item' href='javascript:void(0);'>Change Status</a>\n\t\t\t\t\t\t\t\t<a class='dropdown-item' href='javascript:void(0);'>Generate Report</a>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>";
|
||||
},
|
||||
},
|
||||
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
/* flot toggle example */
|
||||
var flot_toggle = function () {
|
||||
|
||||
var data = [
|
||||
{
|
||||
label: "Target Profit",
|
||||
data: dataTargetProfit,
|
||||
color: color.info._400,
|
||||
bars:
|
||||
{
|
||||
show: true,
|
||||
align: "center",
|
||||
barWidth: 30 * 30 * 60 * 1000 * 80,
|
||||
lineWidth: 0,
|
||||
/*fillColor: {
|
||||
colors: [color.primary._500, color.primary._900]
|
||||
},*/
|
||||
fillColor:
|
||||
{
|
||||
colors: [
|
||||
{
|
||||
opacity: 0.9
|
||||
},
|
||||
{
|
||||
opacity: 0.1
|
||||
}]
|
||||
}
|
||||
},
|
||||
highlightColor: 'rgba(255,255,255,0.3)',
|
||||
shadowSize: 0
|
||||
},
|
||||
{
|
||||
label: "Actual Profit",
|
||||
data: dataProfit,
|
||||
color: color.warning._500,
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2
|
||||
},
|
||||
shadowSize: 0,
|
||||
points:
|
||||
{
|
||||
show: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "User Signups",
|
||||
data: dataSignups,
|
||||
color: color.success._500,
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2
|
||||
},
|
||||
shadowSize: 0,
|
||||
points:
|
||||
{
|
||||
show: true
|
||||
}
|
||||
}]
|
||||
|
||||
var options = {
|
||||
grid:
|
||||
{
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
borderWidth: 1,
|
||||
borderColor: 'rgba(0,0,0,0.05)'
|
||||
},
|
||||
tooltip: true,
|
||||
tooltipOpts:
|
||||
{
|
||||
cssClass: 'tooltip-inner',
|
||||
defaultTheme: false
|
||||
},
|
||||
xaxis:
|
||||
{
|
||||
mode: "time",
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
},
|
||||
yaxes:
|
||||
{
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
tickFormatter: function (val, axis) {
|
||||
return "$" + val;
|
||||
},
|
||||
max: 1200
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
var plot2 = null;
|
||||
|
||||
function plotNow() {
|
||||
var d = [];
|
||||
$("#js-checkbox-toggles").find(':checkbox').each(function () {
|
||||
if ($(this).is(':checked')) {
|
||||
d.push(data[$(this).attr("name").substr(4, 1)]);
|
||||
}
|
||||
});
|
||||
if (d.length > 0) {
|
||||
if (plot2) {
|
||||
plot2.setData(d);
|
||||
plot2.draw();
|
||||
}
|
||||
else {
|
||||
plot2 = $.plot($("#flot-toggles"), d, options);
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
$("#js-checkbox-toggles").find(':checkbox').on('change', function () {
|
||||
plotNow();
|
||||
});
|
||||
plotNow()
|
||||
}
|
||||
flot_toggle();
|
||||
/* flot toggle example -- end*/
|
||||
|
||||
/* flot area */
|
||||
var flotArea = $.plot($('#flot-area'), [
|
||||
{
|
||||
data: dataSet1,
|
||||
label: 'New Customer',
|
||||
color: color.success._200
|
||||
},
|
||||
{
|
||||
data: dataSet2,
|
||||
label: 'Returning Customer',
|
||||
color: color.info._200
|
||||
}],
|
||||
{
|
||||
series:
|
||||
{
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2,
|
||||
fill: true,
|
||||
fillColor:
|
||||
{
|
||||
colors: [
|
||||
{
|
||||
opacity: 0
|
||||
},
|
||||
{
|
||||
opacity: 0.5
|
||||
}]
|
||||
}
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
points:
|
||||
{
|
||||
show: true,
|
||||
},
|
||||
legend:
|
||||
{
|
||||
noColumns: 1,
|
||||
position: 'nw'
|
||||
},
|
||||
grid:
|
||||
{
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
borderColor: '#ddd',
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
aboveData: true,
|
||||
borderWidth: 0,
|
||||
labelMargin: 5,
|
||||
backgroundColor: 'transparent'
|
||||
},
|
||||
yaxis:
|
||||
{
|
||||
tickLength: 1,
|
||||
min: 0,
|
||||
max: 15,
|
||||
color: '#eee',
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
font:
|
||||
{
|
||||
size: 0,
|
||||
color: '#999'
|
||||
}
|
||||
},
|
||||
xaxis:
|
||||
{
|
||||
tickLength: 1,
|
||||
color: '#eee',
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
font:
|
||||
{
|
||||
size: 10,
|
||||
color: '#999'
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
/* flot area -- end */
|
||||
|
||||
var flotVisit = $.plot('#flotVisit', [
|
||||
{
|
||||
data: [
|
||||
[3, 0],
|
||||
[4, 1],
|
||||
[5, 3],
|
||||
[6, 3],
|
||||
[7, 10],
|
||||
[8, 11],
|
||||
[9, 12],
|
||||
[10, 9],
|
||||
[11, 12],
|
||||
[12, 8],
|
||||
[13, 5]
|
||||
],
|
||||
color: color.success._200
|
||||
},
|
||||
{
|
||||
data: [
|
||||
[1, 0],
|
||||
[2, 0],
|
||||
[3, 1],
|
||||
[4, 2],
|
||||
[5, 2],
|
||||
[6, 5],
|
||||
[7, 8],
|
||||
[8, 12],
|
||||
[9, 9],
|
||||
[10, 11],
|
||||
[11, 5]
|
||||
],
|
||||
color: color.info._200
|
||||
}],
|
||||
{
|
||||
series:
|
||||
{
|
||||
shadowSize: 0,
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2,
|
||||
fill: true,
|
||||
fillColor:
|
||||
{
|
||||
colors: [
|
||||
{
|
||||
opacity: 0
|
||||
},
|
||||
{
|
||||
opacity: 0.12
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
grid:
|
||||
{
|
||||
borderWidth: 0
|
||||
},
|
||||
yaxis:
|
||||
{
|
||||
min: 0,
|
||||
max: 15,
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
ticks: [
|
||||
[0, ''],
|
||||
[5, '100K'],
|
||||
[10, '200K'],
|
||||
[15, '300K']
|
||||
],
|
||||
font:
|
||||
{
|
||||
color: '#444',
|
||||
size: 10
|
||||
}
|
||||
},
|
||||
xaxis:
|
||||
{
|
||||
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
ticks: [
|
||||
[2, '2am'],
|
||||
[3, '3am'],
|
||||
[4, '4am'],
|
||||
[5, '5am'],
|
||||
[6, '6am'],
|
||||
[7, '7am'],
|
||||
[8, '8am'],
|
||||
[9, '9am'],
|
||||
[10, '1pm'],
|
||||
[11, '2pm'],
|
||||
[12, '3pm'],
|
||||
[13, '4pm']
|
||||
],
|
||||
font:
|
||||
{
|
||||
color: '#999',
|
||||
size: 9
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
</script>
|
@ -21,15 +21,15 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
<!-- Remove Tap Highlight on Windows Phone IE -->
|
||||
<meta name="msapplication-tap-highlight" content="no">
|
||||
<!-- base css -->
|
||||
<link id="vendorsbundle" rel="stylesheet" media="screen, print" href="css/vendors.bundle.css">
|
||||
<link id="appbundle" rel="stylesheet" media="screen, print" href="css/app.bundle.css">
|
||||
<link id="vendorsbundle" rel="stylesheet" media="screen, print" href="lib/vendors.bundle.css">
|
||||
<link id="appbundle" rel="stylesheet" media="screen, print" href="lib/app.bundle.css">
|
||||
<link id="mytheme" rel="stylesheet" media="screen, print" href="#">
|
||||
<link id="myskin" rel="stylesheet" media="screen, print" href="css/skins/skin-master.css">
|
||||
<link id="myskin" rel="stylesheet" media="screen, print" href="lib/skins/skin-master.css">
|
||||
<!-- Place favicon.ico in the root directory -->
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="img/favicon/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon/favicon-32x32.png">
|
||||
<link rel="mask-icon" href="img/favicon/safari-pinned-tab.svg" color="#5bbad5">
|
||||
<link rel="stylesheet" media="screen, print" href="css/datagrid/datatables/datatables.bundle.css">
|
||||
<link rel="stylesheet" media="screen, print" href="lib/datagrid/datatables/datatables.bundle.css">
|
||||
</head>
|
||||
<!-- BEGIN Body -->
|
||||
<!-- Possible Classes
|
||||
@ -1247,7 +1247,9 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
<!-- BEGIN Page Content -->
|
||||
<!-- the #js-page-content id is needed for some plugins to initialize -->
|
||||
<!--@RenderBody()-->
|
||||
<div id="app"></div>
|
||||
<div id="app">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- this overlay is activated only when mobile menu is triggered -->
|
||||
<div class="page-content-overlay" data-action="toggle" data-class="mobile-nav-on"></div> <!-- END Page Content -->
|
||||
@ -2045,472 +2047,22 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
+ waves.js (extension)
|
||||
+ smartpanels.js (extension)
|
||||
+ src/../jquery-snippets.js (core) -->
|
||||
<script src="js/vendors.bundle.js"></script>
|
||||
<script src="js/app.bundle.js"></script>
|
||||
<script src="lib/vendors.bundle.js"></script>
|
||||
<script src="lib/app.bundle.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Activate smart panels */
|
||||
$('#js-page-content').smartPanel();
|
||||
|
||||
</script>
|
||||
<!-- The order of scripts is irrelevant. Please check out the plugin pages for more details about these plugins below: -->
|
||||
<script src="js/statistics/peity/peity.bundle.js"></script>
|
||||
<script src="js/statistics/flot/flot.bundle.js"></script>
|
||||
<script src="js/statistics/easypiechart/easypiechart.bundle.js"></script>
|
||||
<script src="js/datagrid/datatables/datatables.bundle.js"></script>
|
||||
<script src="lib/statistics/peity/peity.bundle.js"></script>
|
||||
<script src="lib/statistics/flot/flot.bundle.js"></script>
|
||||
<script src="lib/statistics/easypiechart/easypiechart.bundle.js"></script>
|
||||
<script src="lib/datagrid/datatables/datatables.bundle.js"></script>
|
||||
<script>
|
||||
/* defined datas */
|
||||
var dataTargetProfit = [
|
||||
[1354586000000, 153],
|
||||
[1364587000000, 658],
|
||||
[1374588000000, 198],
|
||||
[1384589000000, 663],
|
||||
[1394590000000, 801],
|
||||
[1404591000000, 1080],
|
||||
[1414592000000, 353],
|
||||
[1424593000000, 749],
|
||||
[1434594000000, 523],
|
||||
[1444595000000, 258],
|
||||
[1454596000000, 688],
|
||||
[1464597000000, 364]
|
||||
]
|
||||
var dataProfit = [
|
||||
[1354586000000, 53],
|
||||
[1364587000000, 65],
|
||||
[1374588000000, 98],
|
||||
[1384589000000, 83],
|
||||
[1394590000000, 980],
|
||||
[1404591000000, 808],
|
||||
[1414592000000, 720],
|
||||
[1424593000000, 674],
|
||||
[1434594000000, 23],
|
||||
[1444595000000, 79],
|
||||
[1454596000000, 88],
|
||||
[1464597000000, 36]
|
||||
]
|
||||
var dataSignups = [
|
||||
[1354586000000, 647],
|
||||
[1364587000000, 435],
|
||||
[1374588000000, 784],
|
||||
[1384589000000, 346],
|
||||
[1394590000000, 487],
|
||||
[1404591000000, 463],
|
||||
[1414592000000, 479],
|
||||
[1424593000000, 236],
|
||||
[1434594000000, 843],
|
||||
[1444595000000, 657],
|
||||
[1454596000000, 241],
|
||||
[1464597000000, 341]
|
||||
]
|
||||
var dataSet1 = [
|
||||
[0, 10],
|
||||
[100, 8],
|
||||
[200, 7],
|
||||
[300, 5],
|
||||
[400, 4],
|
||||
[500, 6],
|
||||
[600, 3],
|
||||
[700, 2]
|
||||
];
|
||||
var dataSet2 = [
|
||||
[0, 9],
|
||||
[100, 6],
|
||||
[200, 5],
|
||||
[300, 3],
|
||||
[400, 3],
|
||||
[500, 5],
|
||||
[600, 2],
|
||||
[700, 1]
|
||||
];
|
||||
$("#app").load("dashboard.html");
|
||||
$(document).ready(function()
|
||||
{
|
||||
|
||||
$("#app").load("dashboard.html");
|
||||
/* init datatables */
|
||||
$('#dt-basic-example').dataTable(
|
||||
{
|
||||
responsive: true,
|
||||
dom: "<'row mb-3'<'col-sm-12 col-md-6 d-flex align-items-center justify-content-start'f><'col-sm-12 col-md-6 d-flex align-items-center justify-content-end'B>>" +
|
||||
"<'row'<'col-sm-12'tr>>" +
|
||||
"<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
|
||||
buttons: [
|
||||
{
|
||||
extend: 'colvis',
|
||||
text: 'Column Visibility',
|
||||
titleAttr: 'Col visibility',
|
||||
className: 'btn-outline-default'
|
||||
},
|
||||
{
|
||||
extend: 'csvHtml5',
|
||||
text: 'CSV',
|
||||
titleAttr: 'Generate CSV',
|
||||
className: 'btn-outline-default'
|
||||
},
|
||||
{
|
||||
extend: 'copyHtml5',
|
||||
text: 'Copy',
|
||||
titleAttr: 'Copy to clipboard',
|
||||
className: 'btn-outline-default'
|
||||
},
|
||||
{
|
||||
extend: 'print',
|
||||
text: '<i class="fal fa-print"></i>',
|
||||
titleAttr: 'Print Table',
|
||||
className: 'btn-outline-default'
|
||||
}
|
||||
|
||||
],
|
||||
columnDefs: [
|
||||
{
|
||||
targets: -1,
|
||||
title: '',
|
||||
orderable: false,
|
||||
render: function(data, type, full, meta)
|
||||
{
|
||||
|
||||
/*
|
||||
-- ES6
|
||||
-- convert using https://babeljs.io online transpiler
|
||||
return `
|
||||
<a href='javascript:void(0);' class='btn btn-sm btn-icon btn-outline-danger rounded-circle mr-1' title='Delete Record'>
|
||||
<i class="fal fa-times"></i>
|
||||
</a>
|
||||
<div class='dropdown d-inline-block dropleft '>
|
||||
<a href='#'' class='btn btn-sm btn-icon btn-outline-primary rounded-circle shadow-0' data-toggle='dropdown' aria-expanded='true' title='More options'>
|
||||
<i class="fal fa-ellipsis-v"></i>
|
||||
</a>
|
||||
<div class='dropdown-menu'>
|
||||
<a class='dropdown-item' href='javascript:void(0);'>Change Status</a>
|
||||
<a class='dropdown-item' href='javascript:void(0);'>Generate Report</a>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
ES5 example below:
|
||||
|
||||
*/
|
||||
return "\n\t\t\t\t\t\t<a href='javascript:void(0);' class='btn btn-sm btn-icon btn-outline-danger rounded-circle mr-1' title='Delete Record'>\n\t\t\t\t\t\t\t<i class=\"fal fa-times\"></i>\n\t\t\t\t\t\t</a>\n\t\t\t\t\t\t<div class='dropdown d-inline-block dropleft'>\n\t\t\t\t\t\t\t<a href='#'' class='btn btn-sm btn-icon btn-outline-primary rounded-circle shadow-0' data-toggle='dropdown' aria-expanded='true' title='More options'>\n\t\t\t\t\t\t\t\t<i class=\"fal fa-ellipsis-v\"></i>\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<div class='dropdown-menu'>\n\t\t\t\t\t\t\t\t<a class='dropdown-item' href='javascript:void(0);'>Change Status</a>\n\t\t\t\t\t\t\t\t<a class='dropdown-item' href='javascript:void(0);'>Generate Report</a>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>";
|
||||
},
|
||||
},
|
||||
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
/* flot toggle example */
|
||||
var flot_toggle = function()
|
||||
{
|
||||
|
||||
var data = [
|
||||
{
|
||||
label: "Target Profit",
|
||||
data: dataTargetProfit,
|
||||
color: color.info._400,
|
||||
bars:
|
||||
{
|
||||
show: true,
|
||||
align: "center",
|
||||
barWidth: 30 * 30 * 60 * 1000 * 80,
|
||||
lineWidth: 0,
|
||||
/*fillColor: {
|
||||
colors: [color.primary._500, color.primary._900]
|
||||
},*/
|
||||
fillColor:
|
||||
{
|
||||
colors: [
|
||||
{
|
||||
opacity: 0.9
|
||||
},
|
||||
{
|
||||
opacity: 0.1
|
||||
}]
|
||||
}
|
||||
},
|
||||
highlightColor: 'rgba(255,255,255,0.3)',
|
||||
shadowSize: 0
|
||||
},
|
||||
{
|
||||
label: "Actual Profit",
|
||||
data: dataProfit,
|
||||
color: color.warning._500,
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2
|
||||
},
|
||||
shadowSize: 0,
|
||||
points:
|
||||
{
|
||||
show: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "User Signups",
|
||||
data: dataSignups,
|
||||
color: color.success._500,
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2
|
||||
},
|
||||
shadowSize: 0,
|
||||
points:
|
||||
{
|
||||
show: true
|
||||
}
|
||||
}]
|
||||
|
||||
var options = {
|
||||
grid:
|
||||
{
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
borderWidth: 1,
|
||||
borderColor: 'rgba(0,0,0,0.05)'
|
||||
},
|
||||
tooltip: true,
|
||||
tooltipOpts:
|
||||
{
|
||||
cssClass: 'tooltip-inner',
|
||||
defaultTheme: false
|
||||
},
|
||||
xaxis:
|
||||
{
|
||||
mode: "time",
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
},
|
||||
yaxes:
|
||||
{
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
tickFormatter: function(val, axis)
|
||||
{
|
||||
return "$" + val;
|
||||
},
|
||||
max: 1200
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
var plot2 = null;
|
||||
|
||||
function plotNow()
|
||||
{
|
||||
var d = [];
|
||||
$("#js-checkbox-toggles").find(':checkbox').each(function()
|
||||
{
|
||||
if ($(this).is(':checked'))
|
||||
{
|
||||
d.push(data[$(this).attr("name").substr(4, 1)]);
|
||||
}
|
||||
});
|
||||
if (d.length > 0)
|
||||
{
|
||||
if (plot2)
|
||||
{
|
||||
plot2.setData(d);
|
||||
plot2.draw();
|
||||
}
|
||||
else
|
||||
{
|
||||
plot2 = $.plot($("#flot-toggles"), d, options);
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
$("#js-checkbox-toggles").find(':checkbox').on('change', function()
|
||||
{
|
||||
plotNow();
|
||||
});
|
||||
plotNow()
|
||||
}
|
||||
flot_toggle();
|
||||
/* flot toggle example -- end*/
|
||||
|
||||
/* flot area */
|
||||
var flotArea = $.plot($('#flot-area'), [
|
||||
{
|
||||
data: dataSet1,
|
||||
label: 'New Customer',
|
||||
color: color.success._200
|
||||
},
|
||||
{
|
||||
data: dataSet2,
|
||||
label: 'Returning Customer',
|
||||
color: color.info._200
|
||||
}],
|
||||
{
|
||||
series:
|
||||
{
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2,
|
||||
fill: true,
|
||||
fillColor:
|
||||
{
|
||||
colors: [
|
||||
{
|
||||
opacity: 0
|
||||
},
|
||||
{
|
||||
opacity: 0.5
|
||||
}]
|
||||
}
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
points:
|
||||
{
|
||||
show: true,
|
||||
},
|
||||
legend:
|
||||
{
|
||||
noColumns: 1,
|
||||
position: 'nw'
|
||||
},
|
||||
grid:
|
||||
{
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
borderColor: '#ddd',
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
aboveData: true,
|
||||
borderWidth: 0,
|
||||
labelMargin: 5,
|
||||
backgroundColor: 'transparent'
|
||||
},
|
||||
yaxis:
|
||||
{
|
||||
tickLength: 1,
|
||||
min: 0,
|
||||
max: 15,
|
||||
color: '#eee',
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
font:
|
||||
{
|
||||
size: 0,
|
||||
color: '#999'
|
||||
}
|
||||
},
|
||||
xaxis:
|
||||
{
|
||||
tickLength: 1,
|
||||
color: '#eee',
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
font:
|
||||
{
|
||||
size: 10,
|
||||
color: '#999'
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
/* flot area -- end */
|
||||
|
||||
var flotVisit = $.plot('#flotVisit', [
|
||||
{
|
||||
data: [
|
||||
[3, 0],
|
||||
[4, 1],
|
||||
[5, 3],
|
||||
[6, 3],
|
||||
[7, 10],
|
||||
[8, 11],
|
||||
[9, 12],
|
||||
[10, 9],
|
||||
[11, 12],
|
||||
[12, 8],
|
||||
[13, 5]
|
||||
],
|
||||
color: color.success._200
|
||||
},
|
||||
{
|
||||
data: [
|
||||
[1, 0],
|
||||
[2, 0],
|
||||
[3, 1],
|
||||
[4, 2],
|
||||
[5, 2],
|
||||
[6, 5],
|
||||
[7, 8],
|
||||
[8, 12],
|
||||
[9, 9],
|
||||
[10, 11],
|
||||
[11, 5]
|
||||
],
|
||||
color: color.info._200
|
||||
}],
|
||||
{
|
||||
series:
|
||||
{
|
||||
shadowSize: 0,
|
||||
lines:
|
||||
{
|
||||
show: true,
|
||||
lineWidth: 2,
|
||||
fill: true,
|
||||
fillColor:
|
||||
{
|
||||
colors: [
|
||||
{
|
||||
opacity: 0
|
||||
},
|
||||
{
|
||||
opacity: 0.12
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
grid:
|
||||
{
|
||||
borderWidth: 0
|
||||
},
|
||||
yaxis:
|
||||
{
|
||||
min: 0,
|
||||
max: 15,
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
ticks: [
|
||||
[0, ''],
|
||||
[5, '100K'],
|
||||
[10, '200K'],
|
||||
[15, '300K']
|
||||
],
|
||||
font:
|
||||
{
|
||||
color: '#444',
|
||||
size: 10
|
||||
}
|
||||
},
|
||||
xaxis:
|
||||
{
|
||||
|
||||
tickColor: 'rgba(0,0,0,0.05)',
|
||||
ticks: [
|
||||
[2, '2am'],
|
||||
[3, '3am'],
|
||||
[4, '4am'],
|
||||
[5, '5am'],
|
||||
[6, '6am'],
|
||||
[7, '7am'],
|
||||
[8, '8am'],
|
||||
[9, '9am'],
|
||||
[10, '1pm'],
|
||||
[11, '2pm'],
|
||||
[12, '3pm'],
|
||||
[13, '4pm']
|
||||
],
|
||||
font:
|
||||
{
|
||||
color: '#999',
|
||||
size: 9
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
@ -741,7 +741,7 @@ html {
|
||||
text-decoration: none;
|
||||
background-color: transparent; }
|
||||
html body a:hover {
|
||||
color: #967bbd;
|
||||
color: #ffffff; /*#967bbd*/
|
||||
text-decoration: underline; }
|
||||
|
||||
/* app header */
|
||||
@ -885,7 +885,7 @@ html {
|
||||
min-height: 1px;
|
||||
padding: 0 2rem; }
|
||||
.page-logo img {
|
||||
width: 48px;
|
||||
/*width: 28px;*/
|
||||
height: 48px; }
|
||||
.page-logo .page-logo-link {
|
||||
-webkit-box-flex: 1;
|
||||
@ -894,9 +894,8 @@ html {
|
||||
|
||||
.page-logo-text {
|
||||
margin-left: 0.5rem;
|
||||
margin-top: 0.75rem;
|
||||
font-weight: 300;
|
||||
font-size: 1.5rem;
|
||||
font-size: 1rem;
|
||||
color: #fff;
|
||||
display: block;
|
||||
-webkit-box-flex: 1;
|
||||
@ -1746,7 +1745,7 @@ html {
|
||||
.nav-function-top .page-header .header-icon:not(.btn)[data-toggle="dropdown"] + .dropdown-menu {
|
||||
top: 4.125rem !important; }
|
||||
.nav-function-top .page-content-wrapper {
|
||||
margin-top: 7.625rem; }
|
||||
margin-top: 4.125rem; }
|
||||
.nav-function-top .page-wrapper {
|
||||
padding-left: 0; }
|
||||
.nav-function-top .page-wrapper .page-footer {
|
||||
@ -4356,11 +4355,7 @@ th {
|
||||
|
||||
.nav .nav-link:not([class^="btn-"]):not([class*=" btn-"]) {
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
color: #fff;}
|
||||
|
||||
.nav-link:hover {
|
||||
color: #ffc800!important; }
|
||||
font-size: 0.8125rem; }
|
||||
|
||||
.nav-tabs .nav-link.active,
|
||||
.nav-tabs .nav-item.show .nav-link {
|
||||
@ -7916,4 +7911,28 @@ body:not(.mobile-detected).modal-open .modal::-webkit-scrollbar-thumb:vertical:h
|
||||
/* #OVERRIDE - You can override any of the variables through this file
|
||||
========================================================================== */
|
||||
|
||||
.blink {
|
||||
animation-duration: 1200ms;
|
||||
animation-name: blink;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
-webkit-animation:blink 1200ms infinite; /* Safari and Chrome */
|
||||
}
|
||||
@keyframes blink {
|
||||
from {
|
||||
color:red;
|
||||
}
|
||||
to {
|
||||
color:white;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes blink {
|
||||
from {
|
||||
color:red;
|
||||
}
|
||||
to {
|
||||
color:white;
|
||||
}
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=app.bundle.css.map */
|
17
Frontend/lib/fa-brands.css
Normal file
17
Frontend/lib/fa-brands.css
Normal file
@ -0,0 +1,17 @@
|
||||
/*!
|
||||
* Font Awesome Pro 5.13.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 5 Brands';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: block;
|
||||
src: url("../webfonts/fa-brands-400.eot");
|
||||
src: url("../webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-brands-400.woff2") format("woff2"), url("../webfonts/fa-brands-400.woff") format("woff"), url("../webfonts/fa-brands-400.ttf") format("truetype"), url("../webfonts/fa-brands-400.svg#fontawesome") format("svg"); }
|
||||
|
||||
.fab {
|
||||
font-family: 'Font Awesome 5 Brands';
|
||||
font-weight: 400; }
|
||||
|
||||
/*# sourceMappingURL=fa-brands.css.map */
|
1
Frontend/lib/fa-brands.css.map
Normal file
1
Frontend/lib/fa-brands.css.map
Normal file
File diff suppressed because one or more lines are too long
5605
Frontend/lib/fa-duotone.css
Normal file
5605
Frontend/lib/fa-duotone.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/fa-duotone.css.map
Normal file
1
Frontend/lib/fa-duotone.css.map
Normal file
File diff suppressed because one or more lines are too long
17
Frontend/lib/fa-light.css
Normal file
17
Frontend/lib/fa-light.css
Normal file
@ -0,0 +1,17 @@
|
||||
/*!
|
||||
* Font Awesome Pro 5.13.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 5 Pro';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-display: block;
|
||||
src: url("../webfonts/fa-light-300.eot");
|
||||
src: url("../webfonts/fa-light-300.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-light-300.woff2") format("woff2"), url("../webfonts/fa-light-300.woff") format("woff"), url("../webfonts/fa-light-300.ttf") format("truetype"), url("../webfonts/fa-light-300.svg#fontawesome") format("svg"); }
|
||||
|
||||
.fal {
|
||||
font-family: 'Font Awesome 5 Pro';
|
||||
font-weight: 300; }
|
||||
|
||||
/*# sourceMappingURL=fa-light.css.map */
|
1
Frontend/lib/fa-light.css.map
Normal file
1
Frontend/lib/fa-light.css.map
Normal file
File diff suppressed because one or more lines are too long
17
Frontend/lib/fa-regular.css
Normal file
17
Frontend/lib/fa-regular.css
Normal file
@ -0,0 +1,17 @@
|
||||
/*!
|
||||
* Font Awesome Pro 5.13.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 5 Pro';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: block;
|
||||
src: url("../webfonts/fa-regular-400.eot");
|
||||
src: url("../webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.woff") format("woff"), url("../webfonts/fa-regular-400.ttf") format("truetype"), url("../webfonts/fa-regular-400.svg#fontawesome") format("svg"); }
|
||||
|
||||
.far {
|
||||
font-family: 'Font Awesome 5 Pro';
|
||||
font-weight: 400; }
|
||||
|
||||
/*# sourceMappingURL=fa-regular.css.map */
|
1
Frontend/lib/fa-regular.css.map
Normal file
1
Frontend/lib/fa-regular.css.map
Normal file
File diff suppressed because one or more lines are too long
18
Frontend/lib/fa-solid.css
Normal file
18
Frontend/lib/fa-solid.css
Normal file
@ -0,0 +1,18 @@
|
||||
/*!
|
||||
* Font Awesome Pro 5.13.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 5 Pro';
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: block;
|
||||
src: url("../webfonts/fa-solid-900.eot");
|
||||
src: url("../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.woff") format("woff"), url("../webfonts/fa-solid-900.ttf") format("truetype"), url("../webfonts/fa-solid-900.svg#fontawesome") format("svg"); }
|
||||
|
||||
.fa,
|
||||
.fas {
|
||||
font-family: 'Font Awesome 5 Pro';
|
||||
font-weight: 900; }
|
||||
|
||||
/*# sourceMappingURL=fa-solid.css.map */
|
1
Frontend/lib/fa-solid.css.map
Normal file
1
Frontend/lib/fa-solid.css.map
Normal file
File diff suppressed because one or more lines are too long
83
Frontend/lib/page-invoice.css
Normal file
83
Frontend/lib/page-invoice.css
Normal file
@ -0,0 +1,83 @@
|
||||
@media print {
|
||||
html,
|
||||
body {
|
||||
width: 210mm;
|
||||
height: 297mm; }
|
||||
.invoice-page {
|
||||
-webkit-print-color-adjust: exact; }
|
||||
.col-sm-1,
|
||||
.col-sm-2,
|
||||
.col-sm-3,
|
||||
.col-sm-4,
|
||||
.col-sm-5,
|
||||
.col-sm-6,
|
||||
.col-sm-7,
|
||||
.col-sm-8,
|
||||
.col-sm-9,
|
||||
.col-sm-10,
|
||||
.col-sm-11,
|
||||
.col-sm-12 {
|
||||
float: left;
|
||||
padding: 0; }
|
||||
.col-sm-12 {
|
||||
width: 100%; }
|
||||
.col-sm-11 {
|
||||
width: 91.66666667%; }
|
||||
.col-sm-10 {
|
||||
width: 83.33333333%; }
|
||||
.col-sm-9 {
|
||||
width: 75%; }
|
||||
.col-sm-8 {
|
||||
width: 66.66666667%; }
|
||||
.col-sm-7 {
|
||||
width: 58.33333333%; }
|
||||
.col-sm-6 {
|
||||
width: 50%; }
|
||||
.col-sm-5 {
|
||||
width: 41.66666667%; }
|
||||
.col-sm-4 {
|
||||
width: 33.33333333%; }
|
||||
.col-sm-3 {
|
||||
width: 25%; }
|
||||
.col-sm-2 {
|
||||
width: 16.66666667%; }
|
||||
.col-sm-1 {
|
||||
width: 8.33333333%; }
|
||||
div[data-size="A4"] {
|
||||
margin: 0;
|
||||
-webkit-box-shadow: 0;
|
||||
box-shadow: 0;
|
||||
padding: 3em 5em !important; }
|
||||
.breadcrumb,
|
||||
.subheader {
|
||||
display: none; }
|
||||
*:not(.keep-print-font) {
|
||||
font-family: Arial, Helvetica, sans-serif !important;
|
||||
font-size: 11pt !important; }
|
||||
table {
|
||||
font-size: 100% !important; } }
|
||||
|
||||
@page {
|
||||
size: auto;
|
||||
margin: 0; }
|
||||
|
||||
div[data-size="A4"] {
|
||||
background: white;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 0.5cm;
|
||||
-webkit-box-shadow: 0 0 0.5cm rgba(0, 0, 0, 0.5);
|
||||
box-shadow: 0 0 0.5cm rgba(0, 0, 0, 0.5);
|
||||
background: url(../img/svg/pattern-1.svg) no-repeat center bottom;
|
||||
background-size: cover;
|
||||
padding: 4rem;
|
||||
position: relative; }
|
||||
|
||||
@media only screen and (max-width: 992px) {
|
||||
div[data-size="A4"],
|
||||
.container {
|
||||
padding: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none; } }
|
||||
|
||||
/*# sourceMappingURL=page-invoice.css.map */
|
1
Frontend/lib/page-invoice.css.map
Normal file
1
Frontend/lib/page-invoice.css.map
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"sources":["page-invoice.css"],"names":[],"mappings":"AAAA;EACC;;IAEC,YAAY;IACZ,aAAa,EAAA;EAEd;IACC,iCAAiC,EAAA;EAElC;;;;;;;;;;;;IAYC,WAAW;IACX,UAAU,EAAA;EAEX;IACC,WAAW,EAAA;EAEZ;IACC,mBAAmB,EAAA;EAEpB;IACC,mBAAmB,EAAA;EAEpB;IACC,UAAU,EAAA;EAEX;IACC,mBAAmB,EAAA;EAEpB;IACC,mBAAmB,EAAA;EAEpB;IACC,UAAU,EAAA;EAEX;IACC,mBAAmB,EAAA;EAEpB;IACC,mBAAmB,EAAA;EAEpB;IACC,UAAU,EAAA;EAEX;IACC,mBAAmB,EAAA;EAEpB;IACC,kBAAkB,EAAA;EAEnB;IACC,SAAS;IACT,qBAAa;YAAb,aAAa;IACb,2BAA2B,EAAA;EAE5B;;IAEC,aAAa,EAAA;EAEd;IACC,oDAAoD;IACpD,0BAA0B,EAAA;EAE3B;IACC,0BAA0B,EAAA,EAC1B;;AAGF;EACC,UAAU;EACV,SAAS,EAAA;;AAGV;EACC,iBAAiB;EACjB,cAAc;EACd,cAAc;EACd,oBAAoB;EACpB,gDAAwC;UAAxC,wCAAwC;EACxC,iEAAiE;EACjE,sBAAsB;EACtB,aAAa;EACb,kBAAkB,EAAA;;AAGnB;EACC;;IAEC,UAAU;IACV,wBAAgB;YAAhB,gBAAgB,EAAA,EAChB","file":"page-invoice.css","sourcesContent":["@media print {\r\n\thtml,\r\n\tbody {\r\n\t\twidth: 210mm;\r\n\t\theight: 297mm;\r\n\t}\r\n\t.invoice-page {\r\n\t\t-webkit-print-color-adjust: exact;\r\n\t}\r\n\t.col-sm-1,\r\n\t.col-sm-2,\r\n\t.col-sm-3,\r\n\t.col-sm-4,\r\n\t.col-sm-5,\r\n\t.col-sm-6,\r\n\t.col-sm-7,\r\n\t.col-sm-8,\r\n\t.col-sm-9,\r\n\t.col-sm-10,\r\n\t.col-sm-11,\r\n\t.col-sm-12 {\r\n\t\tfloat: left;\r\n\t\tpadding: 0;\r\n\t}\r\n\t.col-sm-12 {\r\n\t\twidth: 100%;\r\n\t}\r\n\t.col-sm-11 {\r\n\t\twidth: 91.66666667%;\r\n\t}\r\n\t.col-sm-10 {\r\n\t\twidth: 83.33333333%;\r\n\t}\r\n\t.col-sm-9 {\r\n\t\twidth: 75%;\r\n\t}\r\n\t.col-sm-8 {\r\n\t\twidth: 66.66666667%;\r\n\t}\r\n\t.col-sm-7 {\r\n\t\twidth: 58.33333333%;\r\n\t}\r\n\t.col-sm-6 {\r\n\t\twidth: 50%;\r\n\t}\r\n\t.col-sm-5 {\r\n\t\twidth: 41.66666667%;\r\n\t}\r\n\t.col-sm-4 {\r\n\t\twidth: 33.33333333%;\r\n\t}\r\n\t.col-sm-3 {\r\n\t\twidth: 25%;\r\n\t}\r\n\t.col-sm-2 {\r\n\t\twidth: 16.66666667%;\r\n\t}\r\n\t.col-sm-1 {\r\n\t\twidth: 8.33333333%;\r\n\t}\r\n\tdiv[data-size=\"A4\"] {\r\n\t\tmargin: 0;\r\n\t\tbox-shadow: 0;\r\n\t\tpadding: 3em 5em !important;\r\n\t}\r\n\t.breadcrumb,\r\n\t.subheader {\r\n\t\tdisplay: none;\r\n\t}\r\n\t*:not(.keep-print-font) {\r\n\t\tfont-family: Arial, Helvetica, sans-serif !important;\r\n\t\tfont-size: 11pt !important;\r\n\t}\r\n\ttable {\r\n\t\tfont-size: 100% !important;\r\n\t}\r\n}\r\n\r\n@page {\r\n\tsize: auto;\r\n\tmargin: 0;\r\n}\r\n\r\ndiv[data-size=\"A4\"] {\r\n\tbackground: white;\r\n\tdisplay: block;\r\n\tmargin: 0 auto;\r\n\tmargin-bottom: 0.5cm;\r\n\tbox-shadow: 0 0 0.5cm rgba(0, 0, 0, 0.5);\r\n\tbackground: url(../img/svg/pattern-1.svg) no-repeat center bottom;\r\n\tbackground-size: cover;\r\n\tpadding: 4rem;\r\n\tposition: relative;\r\n}\r\n\r\n@media only screen and ( max-width: 992px ){\r\n\tdiv[data-size=\"A4\"],\r\n\t.container {\r\n\t\tpadding: 0;\r\n\t\tbox-shadow: none;\r\n\t}\r\n}"]}
|
4
Frontend/lib/skins/_notes/dwsync.xml
Normal file
4
Frontend/lib/skins/_notes/dwsync.xml
Normal file
@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<dwsync>
|
||||
<file name="skin-master.css" server="//mnas/web/wsp/" local="132338994700000000" remote="132338994700000000" Dst="0" />
|
||||
</dwsync>
|
11979
Frontend/lib/statistics/c3/c3.js
Normal file
11979
Frontend/lib/statistics/c3/c3.js
Normal file
File diff suppressed because it is too large
Load Diff
4516
Frontend/lib/statistics/chartist/chartist.js
Normal file
4516
Frontend/lib/statistics/chartist/chartist.js
Normal file
File diff suppressed because it is too large
Load Diff
20755
Frontend/lib/statistics/chartjs/chartjs.bundle.js
Normal file
20755
Frontend/lib/statistics/chartjs/chartjs.bundle.js
Normal file
File diff suppressed because it is too large
Load Diff
18568
Frontend/lib/statistics/d3/d3.js
vendored
Normal file
18568
Frontend/lib/statistics/d3/d3.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
265
Frontend/lib/statistics/demo-data/demo-c3.js
Normal file
265
Frontend/lib/statistics/demo-data/demo-c3.js
Normal file
@ -0,0 +1,265 @@
|
||||
var chart = c3.generate({
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250, 50, 100, 250]
|
||||
],
|
||||
type: 'spline',
|
||||
selection: {
|
||||
enabled: true
|
||||
}
|
||||
},
|
||||
color: {
|
||||
pattern: [color.primary._500, color.info._500, color.success._500, color.danger._500, color.warning._500]
|
||||
},
|
||||
grid: {
|
||||
x: {
|
||||
show: false
|
||||
},
|
||||
y: {
|
||||
show: true
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
var defaultMessage = $('#message').html(),
|
||||
currentIndex = 0,
|
||||
timer, duration = 1500,
|
||||
demos = [
|
||||
function () {
|
||||
chart.load({
|
||||
columns: [
|
||||
['data2', 100, 30, 200, 320, 50, 150, 230, 80, 150]
|
||||
],
|
||||
type: 'spline'
|
||||
})
|
||||
setMessage('Load data2');
|
||||
setProgressBar('4')
|
||||
},
|
||||
function () {
|
||||
chart.load({
|
||||
columns: [
|
||||
['data3', 70, 90, 170, 220, 100, 110, 130, 40, 50]
|
||||
]
|
||||
})
|
||||
setMessage('Load data3');
|
||||
setProgressBar('8')
|
||||
},
|
||||
function () {
|
||||
chart.select(['data1'], [2]);
|
||||
setMessage('Select point for index 2 of data1');
|
||||
setProgressBar('12')
|
||||
},
|
||||
function () {
|
||||
chart.select(['data1'], [4, 6]);
|
||||
setMessage('Select point for index 4,6 of data1');
|
||||
setProgressBar('16')
|
||||
},
|
||||
function () {
|
||||
chart.unselect();
|
||||
setMessage('Unselect points');
|
||||
setProgressBar('20')
|
||||
},
|
||||
function () {
|
||||
chart.focus('data2');
|
||||
setMessage('Focus on data2');
|
||||
setProgressBar('24')
|
||||
},
|
||||
function () {
|
||||
chart.focus('data3');
|
||||
setMessage('Focus on data3');
|
||||
setProgressBar('28')
|
||||
},
|
||||
function () {
|
||||
chart.revert();
|
||||
setMessage('Defocus');
|
||||
setProgressBar('32')
|
||||
},
|
||||
function () {
|
||||
chart.load({
|
||||
columns: [
|
||||
['data1', 300, 230, 400, 520, 230, 250, 330, 280, 250]
|
||||
]
|
||||
})
|
||||
setMessage('Update data1');
|
||||
setProgressBar('36')
|
||||
},
|
||||
function () {
|
||||
chart.load({
|
||||
columns: [
|
||||
['data2', 30, 50, 90, 120, 40, 50, 80, 70, 50]
|
||||
]
|
||||
})
|
||||
setMessage('Update data2');
|
||||
setProgressBar('40')
|
||||
},
|
||||
function () {
|
||||
chart.regions([{
|
||||
start: 1,
|
||||
end: 3
|
||||
}]);
|
||||
setMessage('Add region from 1 to 3');
|
||||
setProgressBar('44')
|
||||
},
|
||||
function () {
|
||||
chart.regions.add([{
|
||||
start: 6
|
||||
}]);
|
||||
setMessage('Add region from 6 to end');
|
||||
setProgressBar('48')
|
||||
},
|
||||
function () {
|
||||
chart.regions([]);
|
||||
setMessage('Clear regions');
|
||||
setProgressBar('52')
|
||||
},
|
||||
function () {
|
||||
chart.xgrids([{
|
||||
value: 1,
|
||||
text: 'Label 1'
|
||||
}, {
|
||||
value: 4,
|
||||
text: 'Label 4'
|
||||
}]);
|
||||
setMessage('Add x grid lines for 1, 4');
|
||||
setProgressBar('56')
|
||||
},
|
||||
function () {
|
||||
chart.ygrids.add([{
|
||||
value: 450,
|
||||
text: 'Label 450'
|
||||
}]);
|
||||
setMessage('Add y grid lines for 450');
|
||||
setProgressBar('60')
|
||||
},
|
||||
function () {
|
||||
chart.xgrids.remove({
|
||||
value: 1
|
||||
});
|
||||
chart.xgrids.remove({
|
||||
value: 4
|
||||
});
|
||||
setMessage('Remove grid lines for 1, 4');
|
||||
setProgressBar('64')
|
||||
},
|
||||
function () {
|
||||
chart.ygrids.remove({
|
||||
value: 450
|
||||
});
|
||||
setMessage('Remove grid line for 450');
|
||||
setProgressBar('68')
|
||||
},
|
||||
function () {
|
||||
chart.transform('bar');
|
||||
setMessage('Show as bar chart');
|
||||
setProgressBar('72')
|
||||
},
|
||||
function () {
|
||||
chart.groups([
|
||||
['data2', 'data3']
|
||||
]);
|
||||
setMessage('Grouping data2 and data3');
|
||||
setProgressBar('76')
|
||||
},
|
||||
function () {
|
||||
chart.groups([
|
||||
['data1', 'data2', 'data3']
|
||||
]);
|
||||
setMessage('Grouping data1, data2 and data3');
|
||||
},
|
||||
function () {
|
||||
chart.groups([
|
||||
['data2', 'data3']
|
||||
]);
|
||||
chart.transform('spline', 'data1');
|
||||
setMessage('Show data1 as spline');
|
||||
setProgressBar('80')
|
||||
},
|
||||
function () {
|
||||
chart.unload({
|
||||
ids: 'data3'
|
||||
});
|
||||
setMessage('Unload data3');
|
||||
setProgressBar('84')
|
||||
},
|
||||
function () {
|
||||
chart.unload({
|
||||
ids: 'data2'
|
||||
});
|
||||
setMessage('Unload data2');
|
||||
setProgressBar('88')
|
||||
},
|
||||
function () {
|
||||
chart.flow({
|
||||
columns: [
|
||||
['data1', 390, 400, 200, 500]
|
||||
],
|
||||
duration: 1000,
|
||||
});
|
||||
setMessage('Flow 4 data');
|
||||
setProgressBar('92')
|
||||
},
|
||||
function () {
|
||||
// wait for end of transition for flow
|
||||
},
|
||||
function () {
|
||||
chart.flow({
|
||||
columns: [
|
||||
['data1', 190, 230]
|
||||
],
|
||||
});
|
||||
setMessage('Flow 2 data');
|
||||
setProgressBar('96')
|
||||
},
|
||||
function () {
|
||||
// wait for end of transition for flow
|
||||
},
|
||||
function () {
|
||||
chart.transform('spline', ['data1', 'data2', 'data3']);
|
||||
chart.groups([
|
||||
['data1'],
|
||||
['data2'],
|
||||
['data3']
|
||||
]);
|
||||
chart.load({
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250, 50, 100, 250]
|
||||
]
|
||||
})
|
||||
setMessage('Finishing demo..');
|
||||
setProgressBar('100')
|
||||
stopDemo()
|
||||
}
|
||||
];
|
||||
|
||||
function setMessage(message) {
|
||||
document.getElementById('message').innerHTML = '<div id="demoMessage" class="shadow-lg fs-xl p-3 rounded fadeinup">' + message + '</div>';
|
||||
}
|
||||
|
||||
function setProgressBar(percentage) {
|
||||
$('#demo-progress').css("width", percentage + "%");
|
||||
}
|
||||
|
||||
function startDemo() {
|
||||
setMessage('Starting Demo...');
|
||||
timer = setInterval(function () {
|
||||
if (currentIndex == demos.length) currentIndex = 0;
|
||||
demos[currentIndex++]();
|
||||
}, duration);
|
||||
$('#playDemo').hide();
|
||||
$('#pauseDemo').show();
|
||||
}
|
||||
|
||||
function stopDemo() {
|
||||
clearInterval(timer);
|
||||
document.getElementById('message').innerHTML = '<div id="demoMessage" class="shadow-lg fs-xl p-3 rounded fadeinup bg-success-500 text-center">Thanks for watching! <br> <button class="btn btn-xs btn-dark mt-2" onclick="startDemo();">Play again</button> </div>';
|
||||
$('#playDemo').hide();
|
||||
$('#pauseDemo').hide();
|
||||
};
|
||||
|
||||
function pauseDemo() {
|
||||
clearInterval(timer);
|
||||
document.getElementById('message').innerHTML = '<div id="demoMessage" class="shadow-lg fs-xl p-3 rounded highlight"> Demo Paused </div>';
|
||||
$('#playDemo').show();
|
||||
$('#pauseDemo').hide();
|
||||
};
|
3
Frontend/lib/statistics/demo-data/demo-data-dygraph.js
Normal file
3
Frontend/lib/statistics/demo-data/demo-data-dygraph.js
Normal file
File diff suppressed because one or more lines are too long
6
Frontend/lib/statistics/dygraph/dygraph.js
Normal file
6
Frontend/lib/statistics/dygraph/dygraph.js
Normal file
File diff suppressed because one or more lines are too long
4
Frontend/lib/statistics/easypiechart/_notes/dwsync.xml
Normal file
4
Frontend/lib/statistics/easypiechart/_notes/dwsync.xml
Normal file
@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<dwsync>
|
||||
<file name="easypiechart.bundle.js" server="//mnas/web/wsp/" local="132338994720000000" remote="132338994720000000" Dst="0" />
|
||||
</dwsync>
|
401
Frontend/lib/statistics/easypiechart/easypiechart.bundle.js
Normal file
401
Frontend/lib/statistics/easypiechart/easypiechart.bundle.js
Normal file
@ -0,0 +1,401 @@
|
||||
/**!
|
||||
* easy-pie-chart
|
||||
* Lightweight plugin to render simple, animated and retina optimized pie charts
|
||||
*
|
||||
* @license
|
||||
* @author Robert Fleischmann <rendro87@gmail.com> (http://robert-fleischmann.de)
|
||||
* @version 2.1.7
|
||||
**/
|
||||
|
||||
(function (root, factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD. Register as an anonymous module unless amdModuleId is set
|
||||
define(["jquery"], function (a0) {
|
||||
return (factory(a0));
|
||||
});
|
||||
} else if (typeof exports === 'object') {
|
||||
// Node. Does not work with strict CommonJS, but
|
||||
// only CommonJS-like environments that support module.exports,
|
||||
// like Node.
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
factory(jQuery);
|
||||
}
|
||||
}(this, function ($) {
|
||||
|
||||
/**
|
||||
* Renderer to render the chart on a canvas object
|
||||
* @param {DOMElement} el DOM element to host the canvas (root of the plugin)
|
||||
* @param {object} options options object of the plugin
|
||||
*/
|
||||
var CanvasRenderer = function(el, options) {
|
||||
var cachedBackground;
|
||||
var canvas = document.createElement('canvas');
|
||||
|
||||
el.appendChild(canvas);
|
||||
|
||||
if (typeof(G_vmlCanvasManager) === 'object') {
|
||||
G_vmlCanvasManager.initElement(canvas);
|
||||
}
|
||||
|
||||
var ctx = canvas.getContext('2d');
|
||||
|
||||
canvas.width = canvas.height = options.size;
|
||||
|
||||
// canvas on retina devices
|
||||
var scaleBy = 1;
|
||||
if (window.devicePixelRatio > 1) {
|
||||
scaleBy = window.devicePixelRatio;
|
||||
canvas.style.width = canvas.style.height = [options.size, 'px'].join('');
|
||||
canvas.width = canvas.height = options.size * scaleBy;
|
||||
ctx.scale(scaleBy, scaleBy);
|
||||
}
|
||||
|
||||
// move 0,0 coordinates to the center
|
||||
ctx.translate(options.size / 2, options.size / 2);
|
||||
|
||||
// rotate canvas -90deg
|
||||
ctx.rotate((-1 / 2 + options.rotate / 180) * Math.PI);
|
||||
|
||||
var radius = (options.size - options.lineWidth) / 2;
|
||||
if (options.scaleColor && options.scaleLength) {
|
||||
radius -= options.scaleLength + 2; // 2 is the distance between scale and bar
|
||||
}
|
||||
|
||||
// IE polyfill for Date
|
||||
Date.now = Date.now || function() {
|
||||
return +(new Date());
|
||||
};
|
||||
|
||||
/**
|
||||
* Draw a circle around the center of the canvas
|
||||
* @param {strong} color Valid CSS color string
|
||||
* @param {number} lineWidth Width of the line in px
|
||||
* @param {number} percent Percentage to draw (float between -1 and 1)
|
||||
*/
|
||||
var drawCircle = function(color, lineWidth, percent) {
|
||||
percent = Math.min(Math.max(-1, percent || 0), 1);
|
||||
var isNegative = percent <= 0 ? true : false;
|
||||
|
||||
ctx.beginPath();
|
||||
ctx.arc(0, 0, radius, 0, Math.PI * 2 * percent, isNegative);
|
||||
|
||||
ctx.strokeStyle = color;
|
||||
ctx.lineWidth = lineWidth;
|
||||
|
||||
ctx.stroke();
|
||||
};
|
||||
|
||||
/**
|
||||
* Draw the scale of the chart
|
||||
*/
|
||||
var drawScale = function() {
|
||||
var offset;
|
||||
var length;
|
||||
|
||||
ctx.lineWidth = 1;
|
||||
ctx.fillStyle = options.scaleColor;
|
||||
|
||||
ctx.save();
|
||||
for (var i = 24; i > 0; --i) {
|
||||
if (i % 6 === 0) {
|
||||
length = options.scaleLength;
|
||||
offset = 0;
|
||||
} else {
|
||||
length = options.scaleLength * 0.6;
|
||||
offset = options.scaleLength - length;
|
||||
}
|
||||
ctx.fillRect(-options.size/2 + offset, 0, length, 1);
|
||||
ctx.rotate(Math.PI / 12);
|
||||
}
|
||||
ctx.restore();
|
||||
};
|
||||
|
||||
/**
|
||||
* Request animation frame wrapper with polyfill
|
||||
* @return {function} Request animation frame method or timeout fallback
|
||||
*/
|
||||
var reqAnimationFrame = (function() {
|
||||
return window.requestAnimationFrame ||
|
||||
window.webkitRequestAnimationFrame ||
|
||||
window.mozRequestAnimationFrame ||
|
||||
function(callback) {
|
||||
window.setTimeout(callback, 1000 / 60);
|
||||
};
|
||||
}());
|
||||
|
||||
/**
|
||||
* Draw the background of the plugin including the scale and the track
|
||||
*/
|
||||
var drawBackground = function() {
|
||||
if(options.scaleColor) drawScale();
|
||||
if(options.trackColor) drawCircle(options.trackColor, options.trackWidth || options.lineWidth, 1);
|
||||
};
|
||||
|
||||
/**
|
||||
* Canvas accessor
|
||||
*/
|
||||
this.getCanvas = function() {
|
||||
return canvas;
|
||||
};
|
||||
|
||||
/**
|
||||
* Canvas 2D context 'ctx' accessor
|
||||
*/
|
||||
this.getCtx = function() {
|
||||
return ctx;
|
||||
};
|
||||
|
||||
/**
|
||||
* Clear the complete canvas
|
||||
*/
|
||||
this.clear = function() {
|
||||
ctx.clearRect(options.size / -2, options.size / -2, options.size, options.size);
|
||||
};
|
||||
|
||||
/**
|
||||
* Draw the complete chart
|
||||
* @param {number} percent Percent shown by the chart between -100 and 100
|
||||
*/
|
||||
this.draw = function(percent) {
|
||||
// do we need to render a background
|
||||
if (!!options.scaleColor || !!options.trackColor) {
|
||||
// getImageData and putImageData are supported
|
||||
if (ctx.getImageData && ctx.putImageData) {
|
||||
if (!cachedBackground) {
|
||||
drawBackground();
|
||||
cachedBackground = ctx.getImageData(0, 0, options.size * scaleBy, options.size * scaleBy);
|
||||
} else {
|
||||
ctx.putImageData(cachedBackground, 0, 0);
|
||||
}
|
||||
} else {
|
||||
this.clear();
|
||||
drawBackground();
|
||||
}
|
||||
} else {
|
||||
this.clear();
|
||||
}
|
||||
|
||||
ctx.lineCap = options.lineCap;
|
||||
|
||||
// if barcolor is a function execute it and pass the percent as a value
|
||||
var color;
|
||||
if (typeof(options.barColor) === 'function') {
|
||||
color = options.barColor(percent);
|
||||
} else {
|
||||
color = options.barColor;
|
||||
}
|
||||
|
||||
// draw bar
|
||||
drawCircle(color, options.lineWidth, percent / 100);
|
||||
}.bind(this);
|
||||
|
||||
/**
|
||||
* Animate from some percent to some other percentage
|
||||
* @param {number} from Starting percentage
|
||||
* @param {number} to Final percentage
|
||||
*/
|
||||
this.animate = function(from, to) {
|
||||
var startTime = Date.now();
|
||||
options.onStart(from, to);
|
||||
var animation = function() {
|
||||
var process = Math.min(Date.now() - startTime, options.animate.duration);
|
||||
var currentValue = options.easing(this, process, from, to - from, options.animate.duration);
|
||||
this.draw(currentValue);
|
||||
options.onStep(from, to, currentValue);
|
||||
if (process >= options.animate.duration) {
|
||||
options.onStop(from, to);
|
||||
} else {
|
||||
reqAnimationFrame(animation);
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
reqAnimationFrame(animation);
|
||||
}.bind(this);
|
||||
};
|
||||
|
||||
var EasyPieChart = function(el, opts) {
|
||||
var defaultOptions = {
|
||||
barColor: '#ef1e25',
|
||||
trackColor: '#f9f9f9',
|
||||
scaleColor: '#dfe0e0',
|
||||
scaleLength: 5,
|
||||
lineCap: 'round',
|
||||
lineWidth: 3,
|
||||
trackWidth: undefined,
|
||||
size: 110,
|
||||
rotate: 0,
|
||||
animate: {
|
||||
duration: 1000,
|
||||
enabled: true
|
||||
},
|
||||
easing: function (x, t, b, c, d) { // more can be found here: http://gsgd.co.uk/sandbox/jquery/easing/
|
||||
t = t / (d/2);
|
||||
if (t < 1) {
|
||||
return c / 2 * t * t + b;
|
||||
}
|
||||
return -c/2 * ((--t)*(t-2) - 1) + b;
|
||||
},
|
||||
onStart: function(from, to) {
|
||||
return;
|
||||
},
|
||||
onStep: function(from, to, currentValue) {
|
||||
return;
|
||||
},
|
||||
onStop: function(from, to) {
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
// detect present renderer
|
||||
if (typeof(CanvasRenderer) !== 'undefined') {
|
||||
defaultOptions.renderer = CanvasRenderer;
|
||||
} else if (typeof(SVGRenderer) !== 'undefined') {
|
||||
defaultOptions.renderer = SVGRenderer;
|
||||
} else {
|
||||
throw new Error('Please load either the SVG- or the CanvasRenderer');
|
||||
}
|
||||
|
||||
var options = {};
|
||||
var currentValue = 0;
|
||||
|
||||
/**
|
||||
* Initialize the plugin by creating the options object and initialize rendering
|
||||
*/
|
||||
var init = function() {
|
||||
this.el = el;
|
||||
this.options = options;
|
||||
|
||||
// merge user options into default options
|
||||
for (var i in defaultOptions) {
|
||||
if (defaultOptions.hasOwnProperty(i)) {
|
||||
options[i] = opts && typeof(opts[i]) !== 'undefined' ? opts[i] : defaultOptions[i];
|
||||
if (typeof(options[i]) === 'function') {
|
||||
options[i] = options[i].bind(this);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// check for jQuery easing
|
||||
if (typeof(options.easing) === 'string' && typeof(jQuery) !== 'undefined' && jQuery.isFunction(jQuery.easing[options.easing])) {
|
||||
options.easing = jQuery.easing[options.easing];
|
||||
} else {
|
||||
options.easing = defaultOptions.easing;
|
||||
}
|
||||
|
||||
// process earlier animate option to avoid bc breaks
|
||||
if (typeof(options.animate) === 'number') {
|
||||
options.animate = {
|
||||
duration: options.animate,
|
||||
enabled: true
|
||||
};
|
||||
}
|
||||
|
||||
if (typeof(options.animate) === 'boolean' && !options.animate) {
|
||||
options.animate = {
|
||||
duration: 1000,
|
||||
enabled: options.animate
|
||||
};
|
||||
}
|
||||
|
||||
// create renderer
|
||||
this.renderer = new options.renderer(el, options);
|
||||
|
||||
// initial draw
|
||||
this.renderer.draw(currentValue);
|
||||
|
||||
// initial update
|
||||
if (el.dataset && el.dataset.percent) {
|
||||
this.update(parseFloat(el.dataset.percent));
|
||||
} else if (el.getAttribute && el.getAttribute('data-percent')) {
|
||||
this.update(parseFloat(el.getAttribute('data-percent')));
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
/**
|
||||
* Update the value of the chart
|
||||
* @param {number} newValue Number between 0 and 100
|
||||
* @return {object} Instance of the plugin for method chaining
|
||||
*/
|
||||
this.update = function(newValue) {
|
||||
newValue = parseFloat(newValue);
|
||||
if (options.animate.enabled) {
|
||||
this.renderer.animate(currentValue, newValue);
|
||||
} else {
|
||||
this.renderer.draw(newValue);
|
||||
}
|
||||
currentValue = newValue;
|
||||
return this;
|
||||
}.bind(this);
|
||||
|
||||
/**
|
||||
* Disable animation
|
||||
* @return {object} Instance of the plugin for method chaining
|
||||
*/
|
||||
this.disableAnimation = function() {
|
||||
options.animate.enabled = false;
|
||||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
* Enable animation
|
||||
* @return {object} Instance of the plugin for method chaining
|
||||
*/
|
||||
this.enableAnimation = function() {
|
||||
options.animate.enabled = true;
|
||||
return this;
|
||||
};
|
||||
|
||||
init();
|
||||
};
|
||||
|
||||
$.fn.easyPieChart = function(options) {
|
||||
return this.each(function() {
|
||||
var instanceOptions;
|
||||
|
||||
if (!$.data(this, 'easyPieChart')) {
|
||||
instanceOptions = $.extend({}, options, $(this).data());
|
||||
$.data(this, 'easyPieChart', new EasyPieChart(this, instanceOptions));
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
}));
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
/* Easy pie chart Snippet
|
||||
DOC: make sure to include this snippet in your project to be able to use the easy
|
||||
configurations without any jquery implementations
|
||||
*/
|
||||
$('.js-easy-pie-chart').each(function() {
|
||||
|
||||
var $this = $(this),
|
||||
barcolor = $this.css('color') || color.primary._700,
|
||||
trackcolor = $this.data('trackcolor') || 'rgba(0,0,0,0.04)',
|
||||
size = parseInt($this.data('piesize')) || 50,
|
||||
scalecolor = $this.data('scalecolor') || $this.css('color'),
|
||||
scalelength = parseInt($this.data('scalelength')) || 0,
|
||||
linewidth = parseInt($this.data('linewidth')) || parseInt(size / 8.5),
|
||||
linecap = $this.data('linecap') || 'butt'; //butt, round and square.
|
||||
|
||||
$this.easyPieChart({
|
||||
size : size,
|
||||
barColor : barcolor,
|
||||
trackColor : trackcolor,
|
||||
scaleColor: scalecolor,
|
||||
scaleLength: scalelength, //Length of the scale lines (reduces the radius of the chart).
|
||||
lineCap : linecap, //Defines how the ending of the bar line looks like. Possible values are: butt, round and square.
|
||||
lineWidth : linewidth,
|
||||
animate: {
|
||||
duration: 1500,
|
||||
enabled: true
|
||||
},
|
||||
onStep: function(from, to, percent) {
|
||||
$(this.el).find('.js-percent').text(Math.round(percent));
|
||||
}
|
||||
});
|
||||
|
||||
$this = null;
|
||||
});
|
||||
});
|
4
Frontend/lib/statistics/flot/_notes/dwsync.xml
Normal file
4
Frontend/lib/statistics/flot/_notes/dwsync.xml
Normal file
@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<dwsync>
|
||||
<file name="flot.bundle.js" server="//mnas/web/wsp/" local="132338994720000000" remote="132338994720000000" Dst="0" />
|
||||
</dwsync>
|
8132
Frontend/lib/statistics/flot/flot.bundle.js
Normal file
8132
Frontend/lib/statistics/flot/flot.bundle.js
Normal file
File diff suppressed because it is too large
Load Diff
4
Frontend/lib/statistics/peity/_notes/dwsync.xml
Normal file
4
Frontend/lib/statistics/peity/_notes/dwsync.xml
Normal file
@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<dwsync>
|
||||
<file name="peity.bundle.js" server="//mnas/web/wsp/" local="132338994720000000" remote="132338994720000000" Dst="0" />
|
||||
</dwsync>
|
397
Frontend/lib/statistics/peity/peity.bundle.js
Normal file
397
Frontend/lib/statistics/peity/peity.bundle.js
Normal file
@ -0,0 +1,397 @@
|
||||
// Peity jQuery plugin version 3.3.0
|
||||
// (c) 2018 Ben Pickles
|
||||
//
|
||||
// http://benpickles.github.io/peity
|
||||
//
|
||||
// Released under MIT license.
|
||||
(function($, document, Math, undefined) {
|
||||
var peity = $.fn.peity = function(type, options) {
|
||||
if (svgSupported) {
|
||||
this.each(function() {
|
||||
var $this = $(this)
|
||||
var chart = $this.data('_peity')
|
||||
|
||||
if (chart) {
|
||||
if (type) chart.type = type
|
||||
$.extend(chart.opts, options)
|
||||
} else {
|
||||
chart = new Peity(
|
||||
$this,
|
||||
type,
|
||||
$.extend({},
|
||||
peity.defaults[type],
|
||||
$this.data('peity'),
|
||||
options)
|
||||
)
|
||||
|
||||
$this
|
||||
.change(function() { chart.draw() })
|
||||
.data('_peity', chart)
|
||||
}
|
||||
|
||||
chart.draw()
|
||||
});
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
var Peity = function($el, type, opts) {
|
||||
this.$el = $el
|
||||
this.type = type
|
||||
this.opts = opts
|
||||
}
|
||||
|
||||
var PeityPrototype = Peity.prototype
|
||||
|
||||
var svgElement = PeityPrototype.svgElement = function(tag, attrs) {
|
||||
return $(
|
||||
document.createElementNS('http://www.w3.org/2000/svg', tag)
|
||||
).attr(attrs)
|
||||
}
|
||||
|
||||
// https://gist.github.com/madrobby/3201472
|
||||
var svgSupported = 'createElementNS' in document && svgElement('svg', {})[0].createSVGRect
|
||||
|
||||
PeityPrototype.draw = function() {
|
||||
var opts = this.opts
|
||||
peity.graphers[this.type].call(this, opts)
|
||||
if (opts.after) opts.after.call(this, opts)
|
||||
}
|
||||
|
||||
PeityPrototype.fill = function() {
|
||||
var fill = this.opts.fill
|
||||
|
||||
return $.isFunction(fill)
|
||||
? fill
|
||||
: function(_, i) { return fill[i % fill.length] }
|
||||
}
|
||||
|
||||
PeityPrototype.prepare = function(width, height) {
|
||||
if (!this.$svg) {
|
||||
this.$el.hide().after(
|
||||
this.$svg = svgElement('svg', {
|
||||
"class": "peity"
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
return this.$svg
|
||||
.empty()
|
||||
.data('_peity', this)
|
||||
.attr({
|
||||
height: height,
|
||||
width: width
|
||||
})
|
||||
}
|
||||
|
||||
PeityPrototype.values = function() {
|
||||
return $.map(this.$el.text().split(this.opts.delimiter), function(value) {
|
||||
return parseFloat(value)
|
||||
})
|
||||
}
|
||||
|
||||
peity.defaults = {}
|
||||
peity.graphers = {}
|
||||
|
||||
peity.register = function(type, defaults, grapher) {
|
||||
this.defaults[type] = defaults
|
||||
this.graphers[type] = grapher
|
||||
}
|
||||
|
||||
peity.register(
|
||||
'pie',
|
||||
{
|
||||
fill: ['#ff9900', '#fff4dd', '#ffc66e'],
|
||||
radius: 8
|
||||
},
|
||||
function(opts) {
|
||||
if (!opts.delimiter) {
|
||||
var delimiter = this.$el.text().match(/[^0-9\.]/)
|
||||
opts.delimiter = delimiter ? delimiter[0] : ","
|
||||
}
|
||||
|
||||
var values = $.map(this.values(), function(n) {
|
||||
return n > 0 ? n : 0
|
||||
})
|
||||
|
||||
if (opts.delimiter == "/") {
|
||||
var v1 = values[0]
|
||||
var v2 = values[1]
|
||||
values = [v1, Math.max(0, v2 - v1)]
|
||||
}
|
||||
|
||||
var i = 0
|
||||
var length = values.length
|
||||
var sum = 0
|
||||
|
||||
for (; i < length; i++) {
|
||||
sum += values[i]
|
||||
}
|
||||
|
||||
if (!sum) {
|
||||
length = 2
|
||||
sum = 1
|
||||
values = [0, 1]
|
||||
}
|
||||
|
||||
var diameter = opts.radius * 2
|
||||
|
||||
var $svg = this.prepare(
|
||||
opts.width || diameter,
|
||||
opts.height || diameter
|
||||
)
|
||||
|
||||
var width = $svg.width()
|
||||
, height = $svg.height()
|
||||
, cx = width / 2
|
||||
, cy = height / 2
|
||||
|
||||
var radius = Math.min(cx, cy)
|
||||
, innerRadius = opts.innerRadius
|
||||
|
||||
if (this.type == 'donut' && !innerRadius) {
|
||||
innerRadius = radius * 0.5
|
||||
}
|
||||
|
||||
var pi = Math.PI
|
||||
var fill = this.fill()
|
||||
|
||||
var scale = this.scale = function(value, radius) {
|
||||
var radians = value / sum * pi * 2 - pi / 2
|
||||
|
||||
return [
|
||||
radius * Math.cos(radians) + cx,
|
||||
radius * Math.sin(radians) + cy
|
||||
]
|
||||
}
|
||||
|
||||
var cumulative = 0
|
||||
|
||||
for (i = 0; i < length; i++) {
|
||||
var value = values[i]
|
||||
, portion = value / sum
|
||||
, $node
|
||||
|
||||
if (portion == 0) continue
|
||||
|
||||
if (portion == 1) {
|
||||
if (innerRadius) {
|
||||
var x2 = cx - 0.01
|
||||
, y1 = cy - radius
|
||||
, y2 = cy - innerRadius
|
||||
|
||||
$node = svgElement('path', {
|
||||
d: [
|
||||
'M', cx, y1,
|
||||
'A', radius, radius, 0, 1, 1, x2, y1,
|
||||
'L', x2, y2,
|
||||
'A', innerRadius, innerRadius, 0, 1, 0, cx, y2
|
||||
].join(' '),
|
||||
'data-value': value,
|
||||
})
|
||||
} else {
|
||||
$node = svgElement('circle', {
|
||||
cx: cx,
|
||||
cy: cy,
|
||||
'data-value': value,
|
||||
r: radius
|
||||
})
|
||||
}
|
||||
} else {
|
||||
var cumulativePlusValue = cumulative + value
|
||||
|
||||
var d = ['M'].concat(
|
||||
scale(cumulative, radius),
|
||||
'A', radius, radius, 0, portion > 0.5 ? 1 : 0, 1,
|
||||
scale(cumulativePlusValue, radius),
|
||||
'L'
|
||||
)
|
||||
|
||||
if (innerRadius) {
|
||||
d = d.concat(
|
||||
scale(cumulativePlusValue, innerRadius),
|
||||
'A', innerRadius, innerRadius, 0, portion > 0.5 ? 1 : 0, 0,
|
||||
scale(cumulative, innerRadius)
|
||||
)
|
||||
} else {
|
||||
d.push(cx, cy)
|
||||
}
|
||||
|
||||
cumulative += value
|
||||
|
||||
$node = svgElement('path', {
|
||||
d: d.join(" "),
|
||||
'data-value': value,
|
||||
})
|
||||
}
|
||||
|
||||
$node.attr('fill', fill.call(this, value, i, values))
|
||||
|
||||
$svg.append($node)
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
peity.register(
|
||||
'donut',
|
||||
$.extend(true, {}, peity.defaults.pie),
|
||||
function(opts) {
|
||||
peity.graphers.pie.call(this, opts)
|
||||
}
|
||||
)
|
||||
|
||||
peity.register(
|
||||
"line",
|
||||
{
|
||||
delimiter: ",",
|
||||
fill: "#c6d9fd",
|
||||
height: 16,
|
||||
min: 0,
|
||||
stroke: "#4d89f9",
|
||||
strokeWidth: 1,
|
||||
width: 32
|
||||
},
|
||||
function(opts) {
|
||||
var values = this.values()
|
||||
if (values.length == 1) values.push(values[0])
|
||||
var max = Math.max.apply(Math, opts.max == undefined ? values : values.concat(opts.max))
|
||||
, min = Math.min.apply(Math, opts.min == undefined ? values : values.concat(opts.min))
|
||||
|
||||
var $svg = this.prepare(opts.width, opts.height)
|
||||
, strokeWidth = opts.strokeWidth
|
||||
, width = $svg.width()
|
||||
, height = $svg.height() - strokeWidth
|
||||
, diff = max - min
|
||||
|
||||
var xScale = this.x = function(input) {
|
||||
return input * (width / (values.length - 1))
|
||||
}
|
||||
|
||||
var yScale = this.y = function(input) {
|
||||
var y = height
|
||||
|
||||
if (diff) {
|
||||
y -= ((input - min) / diff) * height
|
||||
}
|
||||
|
||||
return y + strokeWidth / 2
|
||||
}
|
||||
|
||||
var zero = yScale(Math.max(min, 0))
|
||||
, coords = [0, zero]
|
||||
|
||||
for (var i = 0; i < values.length; i++) {
|
||||
coords.push(
|
||||
xScale(i),
|
||||
yScale(values[i])
|
||||
)
|
||||
}
|
||||
|
||||
coords.push(width, zero)
|
||||
|
||||
if (opts.fill) {
|
||||
$svg.append(
|
||||
svgElement('polygon', {
|
||||
fill: opts.fill,
|
||||
points: coords.join(' ')
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
if (strokeWidth) {
|
||||
$svg.append(
|
||||
svgElement('polyline', {
|
||||
fill: 'none',
|
||||
points: coords.slice(2, coords.length - 2).join(' '),
|
||||
stroke: opts.stroke,
|
||||
'stroke-width': strokeWidth,
|
||||
'stroke-linecap': 'square'
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
peity.register(
|
||||
'bar',
|
||||
{
|
||||
delimiter: ",",
|
||||
fill: ["#4D89F9"],
|
||||
height: 16,
|
||||
min: 0,
|
||||
padding: 0.1,
|
||||
width: 32
|
||||
},
|
||||
function(opts) {
|
||||
var values = this.values()
|
||||
, max = Math.max.apply(Math, opts.max == undefined ? values : values.concat(opts.max))
|
||||
, min = Math.min.apply(Math, opts.min == undefined ? values : values.concat(opts.min))
|
||||
|
||||
var $svg = this.prepare(opts.width, opts.height)
|
||||
, width = $svg.width()
|
||||
, height = $svg.height()
|
||||
, diff = max - min
|
||||
, padding = opts.padding
|
||||
, fill = this.fill()
|
||||
|
||||
var xScale = this.x = function(input) {
|
||||
return input * width / values.length
|
||||
}
|
||||
|
||||
var yScale = this.y = function(input) {
|
||||
return height - (
|
||||
diff
|
||||
? ((input - min) / diff) * height
|
||||
: 1
|
||||
)
|
||||
}
|
||||
|
||||
for (var i = 0; i < values.length; i++) {
|
||||
var x = xScale(i + padding)
|
||||
, w = xScale(i + 1 - padding) - x
|
||||
, value = values[i]
|
||||
, valueY = yScale(value)
|
||||
, y1 = valueY
|
||||
, y2 = valueY
|
||||
, h
|
||||
|
||||
if (!diff) {
|
||||
h = 1
|
||||
} else if (value < 0) {
|
||||
y1 = yScale(Math.min(max, 0))
|
||||
} else {
|
||||
y2 = yScale(Math.max(min, 0))
|
||||
}
|
||||
|
||||
h = y2 - y1
|
||||
|
||||
if (h == 0) {
|
||||
h = 1
|
||||
if (max > 0 && diff) y1--
|
||||
}
|
||||
|
||||
$svg.append(
|
||||
svgElement('rect', {
|
||||
'data-value': value,
|
||||
fill: fill.call(this, value, i, values),
|
||||
x: x,
|
||||
y: y1,
|
||||
width: w,
|
||||
height: h
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
);
|
||||
})(jQuery, document, Math);
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
/* Starts peity
|
||||
DOC: searches for the class and init. peity based on class
|
||||
*/
|
||||
$(".peity-pie").peity("pie");
|
||||
$('.peity-donut').peity('donut');
|
||||
$(".peity-line").peity("line");
|
||||
$(".peity-bar").peity("bar");
|
||||
});
|
3113
Frontend/lib/statistics/sparkline/sparkline.bundle.js
Normal file
3113
Frontend/lib/statistics/sparkline/sparkline.bundle.js
Normal file
File diff suppressed because it is too large
Load Diff
383
Frontend/lib/theme-demo.css
Normal file
383
Frontend/lib/theme-demo.css
Normal file
@ -0,0 +1,383 @@
|
||||
/* THEME COLORs
|
||||
========================================================================== */
|
||||
/* Looks good on chrome default color profile */
|
||||
/* We will manually convert these primary colors to rgb for the dark mode option of the theme */
|
||||
/* looks good in sRGB but washed up on chrome default
|
||||
$color-primary: #826bb0;
|
||||
$color-success: #31cb55;
|
||||
$color-info: #5e93ec;
|
||||
$color-warning: #eec559;
|
||||
$color-danger: #dc4b92;
|
||||
$color-fusion: darken(desaturate(adjust-hue($color-primary, 5), 80%), 25%); */
|
||||
/* Color Polarity
|
||||
========================================================================== */
|
||||
/* PAINTBUCKET MIXER
|
||||
========================================================================== */
|
||||
/* the grays */
|
||||
/* the sapphires */
|
||||
/* the emeralds */
|
||||
/* the amethyths */
|
||||
/* the topaz */
|
||||
/* the rubies */
|
||||
/* the graphites */
|
||||
/* Define universal border difition (div outlines, etc)
|
||||
========================================================================== */
|
||||
/* MOBILE BREAKPOINT & GUTTERS (contains some bootstrap responsive overrides)
|
||||
========================================================================== */
|
||||
/* define when mobile menu activates, here we are declearing (lg) so it targets the one after it */
|
||||
/* bootstrap reference xs: 0, sm: 544px, md: 768px, lg: 992px, xl: 1200px*/
|
||||
/* global var used for spacing*/
|
||||
/* Uniform Padding variable */
|
||||
/* Heads up! This is a global scoped variable - changing may impact the whole template */
|
||||
/* BOOTSTRAP OVERRIDES (bootstrap variables)
|
||||
========================================================================== */
|
||||
/* usage: theme-colors("primary"); */
|
||||
/* forms */
|
||||
/*$input-height: calc(2.25rem + 1px); //I had to add this because the input gruops was having improper height for some reason... */
|
||||
/* links */
|
||||
/* checkbox */
|
||||
/*$custom-file-height-inner: calc(2.25rem - 1px);*/
|
||||
/* not part of bootstrap variable */
|
||||
/* custom checkbox */
|
||||
/* custom range */
|
||||
/* custom file */
|
||||
/* badge */
|
||||
/* cards */
|
||||
/*border radius*/
|
||||
/* alert */
|
||||
/* toast */
|
||||
/* breadcrumb */
|
||||
/* input button */
|
||||
/* nav link */
|
||||
/* nav, tabs, pills */
|
||||
/* tables */
|
||||
/* dropdowns */
|
||||
/* dropdowns sizes */
|
||||
/* popovers */
|
||||
/* tooltips */
|
||||
/* modal */
|
||||
/* reference guide
|
||||
http://www.standardista.com/px-to-rem-conversion-if-root-font-size-is-16px/
|
||||
8px = 0.5rem
|
||||
9px = 0.5625rem
|
||||
10px = 0.625rem
|
||||
11px = 0.6875rem
|
||||
12px = 0.75rem
|
||||
13px = 0.8125rem
|
||||
14px = 0.875rem
|
||||
15px = 0.9375rem
|
||||
16px = 1rem (base)
|
||||
17px = 1.0625rem
|
||||
18px = 1.125rem
|
||||
19px = 1.1875rem
|
||||
20px = 1.25rem
|
||||
21px = 1.3125rem
|
||||
22px = 1.375rem
|
||||
24px = 1.5rem
|
||||
25px = 1.5625rem
|
||||
26px = 1.625rem
|
||||
28px = 1.75rem
|
||||
30px = 1.875rem
|
||||
32px = 2rem
|
||||
34px = 2.125rem
|
||||
36px = 2.25rem
|
||||
38px = 2.375rem
|
||||
40px = 2.5rem
|
||||
*/
|
||||
/* Fonts */
|
||||
/* carousel */
|
||||
/* BASE VARS
|
||||
========================================================================== */
|
||||
/* font vars below will auto change to rem values using function rem($value)*/
|
||||
/* 11px */
|
||||
/* 12px */
|
||||
/* 12.5px */
|
||||
/* 14px */
|
||||
/* 15px */
|
||||
/* 16px */
|
||||
/* 28px */
|
||||
/* Font Family
|
||||
========================================================================== */
|
||||
/*hint: you can also try the font called 'Poppins' by replacing the font 'Roboto' */
|
||||
/* ANIMATIONS
|
||||
========================================================================== */
|
||||
/* this addresses all animation related to nav hide to nav minify */
|
||||
/* Z-INDEX declearation
|
||||
========================================================================== */
|
||||
/* we adjust bootstrap z-index to be higher than our higest z-index*/
|
||||
/* CUSTOM ICON PREFIX
|
||||
========================================================================== */
|
||||
/* PRINT CSS (landscape or portrait)
|
||||
========================================================================== */
|
||||
/* landscape or portrait */
|
||||
/* auto, letter */
|
||||
/* Common Element Variables
|
||||
========================================================================== */
|
||||
/* Z-index decleartion "birds eye view"
|
||||
========================================================================== */
|
||||
/* Components
|
||||
========================================================================== */
|
||||
/* PAGE HEADER STUFF
|
||||
========================================================================== */
|
||||
/* colors */
|
||||
/* height */
|
||||
/* logo */
|
||||
/* try not to go beywond the width of $main_nav_width value */
|
||||
/* you may need to change this depending on your logo design */
|
||||
/* adjust this as you see fit : left, right, center */
|
||||
/* icon font size (not button) */
|
||||
/* search input box */
|
||||
/* suggestion: #ccced0*/
|
||||
/* btn */
|
||||
/* dropdown: app list */
|
||||
/* badge */
|
||||
/* COMPONENTS & MODS */
|
||||
/* NAVIGATION STUFF
|
||||
|
||||
Guide:
|
||||
|
||||
aside.page-sidebar ($nav-width, $nav-background)
|
||||
.page-logo
|
||||
.primary-nav
|
||||
.info-card
|
||||
ul.nav-menu
|
||||
li
|
||||
a (parent level-0..., $nav-link-color, $nav-link-hover-color, $nav-link-hover-bg-color, $nav-link-hover-left-border-color)
|
||||
icon
|
||||
span
|
||||
collapse-sign
|
||||
|
||||
ul.nav-menu-sub-one
|
||||
li
|
||||
a ($nav-level-1... $nav-sub-link-height)
|
||||
span
|
||||
collapse-sign
|
||||
|
||||
ul.nav-menu-sub-two
|
||||
li
|
||||
a ($nav-level-2... $nav-sub-link-height)
|
||||
span
|
||||
|
||||
p.nav-title ($nav-title-*...)
|
||||
|
||||
|
||||
========================================================================== */
|
||||
/* main navigation */
|
||||
/* left panel */
|
||||
/* nav footer */
|
||||
/* nav parent level-0 */
|
||||
/* nav link level-1 */
|
||||
/* nav level-1 bg */
|
||||
/* nav icon sizes */
|
||||
/* badge default */
|
||||
/* all child */
|
||||
/* nav title */
|
||||
/* nav Minify */
|
||||
/* when the menu pops on hover */
|
||||
/* navigation Width */
|
||||
/* partial visibility of the menu */
|
||||
/* top navigation */
|
||||
/* nav Info Card (appears below the logo) */
|
||||
/* width is auto */
|
||||
/* nav DL labels for all child */
|
||||
/* will be pulled to left as a negative value */
|
||||
/* MISC Settings
|
||||
========================================================================== */
|
||||
/* List Table */
|
||||
/* PAGE SETTINGS
|
||||
========================================================================== */
|
||||
/* PAGE BREADCRUMB
|
||||
========================================================================== */
|
||||
/* PAGE COMPONENT PANELS
|
||||
========================================================================== */
|
||||
/* PAGE COMPONENT PROGRESSBARS
|
||||
========================================================================== */
|
||||
/* PAGE COMPONENT MESSENGER
|
||||
========================================================================== */
|
||||
/* FOOTER
|
||||
========================================================================== */
|
||||
/* GLOBALS
|
||||
========================================================================== */
|
||||
/* ACCESSIBILITIES */
|
||||
/* SHORTCUT BUTTON (appears on bottom right of the page) */
|
||||
/* GULP WARNINGS */
|
||||
.app-body-demo {
|
||||
height: 350px;
|
||||
max-width: 550px;
|
||||
margin: 0 auto;
|
||||
background-color: #fff;
|
||||
border: 1px solid rgba(0, 0, 0, 0.125); }
|
||||
.app-body-demo .app-nav-demo:not(.app-nav-demo-minify) {
|
||||
width: 20%; }
|
||||
.app-body-demo .app-nav-demo-minify {
|
||||
width: 7%;
|
||||
padding: 3px; }
|
||||
.app-body-demo .app-nav-demo-minify .page-logo {
|
||||
width: auto; }
|
||||
.app-body-demo .app-nav-demo-hidden {
|
||||
width: 10px; }
|
||||
.app-body-demo .app-header-demo {
|
||||
height: 30px; }
|
||||
.app-body-demo .app-nav-demo-top {
|
||||
height: 26px; }
|
||||
.app-body-demo .app-header-btn-demo {
|
||||
width: 26px;
|
||||
height: 18px;
|
||||
border-radius: 2px;
|
||||
padding: 0 !important;
|
||||
font-size: 10px; }
|
||||
.app-body-demo .app-hematite-demo {
|
||||
background: #434a51; }
|
||||
.app-body-demo .app-amethyst-demo {
|
||||
background: #5c4581; }
|
||||
.app-body-demo .app-aquamarine-demo {
|
||||
background: #476f85; }
|
||||
.app-body-demo .app-sapphire-demo {
|
||||
background: #334768; }
|
||||
|
||||
#app-eventlog {
|
||||
height: 260px;
|
||||
min-height: 260px;
|
||||
max-height: 300px;
|
||||
overflow: auto;
|
||||
display: block;
|
||||
/*> div:last-child {
|
||||
background:#f9f4b5;
|
||||
}
|
||||
|
||||
> div:nth-last-child(2) {
|
||||
background:#fffde1;
|
||||
}*/ }
|
||||
#app-eventlog > div:not(:last-child) {
|
||||
border-bottom: 1px solid #eaeaea; }
|
||||
#app-eventlog:empty {
|
||||
background: #eee; }
|
||||
#app-eventlog:empty:before {
|
||||
content: "Event Logs";
|
||||
font-size: 28px;
|
||||
font-weight: 300;
|
||||
color: #c7c7c7;
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0; }
|
||||
#app-eventlog .fs-base .badge {
|
||||
font-size: 90% !important;
|
||||
font-weight: 400 !important;
|
||||
background: #a9a9a9;
|
||||
text-align: left;
|
||||
min-width: 50px; }
|
||||
|
||||
.prettyprint {
|
||||
overflow: auto;
|
||||
background: #f7f9fa;
|
||||
font-size: 100%;
|
||||
padding: 1rem 1rem !important;
|
||||
border: 0 !important; }
|
||||
|
||||
/*! Color themes for Google Code Prettify | MIT License | github.com/jmblog/color-themes-for-google-code-prettify */
|
||||
.prettyprint {
|
||||
background: #efecf4;
|
||||
background: rgba(var(--theme-rgb-primary), 0.1);
|
||||
font-family: Menlo,Bitstream Vera Sans Mono,DejaVu Sans Mono,Monaco,Consolas,monospace;
|
||||
border: 0 !important; }
|
||||
|
||||
.pln {
|
||||
color: #19171c; }
|
||||
|
||||
ol.linenums {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
color: #7e7887; }
|
||||
|
||||
li.L0 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L1 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L2 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L3 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L4 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L5 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L6 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L7 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L8 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
li.L9 {
|
||||
padding-left: 1em;
|
||||
background-color: #efecf4;
|
||||
list-style-type: decimal; }
|
||||
|
||||
@media screen {
|
||||
.str {
|
||||
color: #2a9292; }
|
||||
.kwd {
|
||||
color: #955ae7; }
|
||||
.com {
|
||||
color: #7e7887; }
|
||||
.typ {
|
||||
color: #576ddb; }
|
||||
.lit {
|
||||
color: #aa573c; }
|
||||
.pun {
|
||||
color: #19171c; }
|
||||
.opn {
|
||||
color: #19171c; }
|
||||
.clo {
|
||||
color: #19171c; }
|
||||
.tag {
|
||||
color: #be4678; }
|
||||
.atn {
|
||||
color: #aa573c; }
|
||||
.atv {
|
||||
color: #398bc6; }
|
||||
.dec {
|
||||
color: #aa573c; }
|
||||
.var {
|
||||
color: #be4678; }
|
||||
.fun {
|
||||
color: #576ddb; } }
|
||||
|
||||
/*# sourceMappingURL=theme-demo.css.map */
|
1
Frontend/lib/theme-demo.css.map
Normal file
1
Frontend/lib/theme-demo.css.map
Normal file
File diff suppressed because one or more lines are too long
3026
Frontend/lib/themes/cust-theme-1.css
Normal file
3026
Frontend/lib/themes/cust-theme-1.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-1.css.map
Normal file
1
Frontend/lib/themes/cust-theme-1.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-10.css
Normal file
3021
Frontend/lib/themes/cust-theme-10.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-10.css.map
Normal file
1
Frontend/lib/themes/cust-theme-10.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-11.css
Normal file
3021
Frontend/lib/themes/cust-theme-11.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-11.css.map
Normal file
1
Frontend/lib/themes/cust-theme-11.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-12.css
Normal file
3021
Frontend/lib/themes/cust-theme-12.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-12.css.map
Normal file
1
Frontend/lib/themes/cust-theme-12.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-13.css
Normal file
3021
Frontend/lib/themes/cust-theme-13.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-13.css.map
Normal file
1
Frontend/lib/themes/cust-theme-13.css.map
Normal file
File diff suppressed because one or more lines are too long
3037
Frontend/lib/themes/cust-theme-14.css
Normal file
3037
Frontend/lib/themes/cust-theme-14.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-14.css.map
Normal file
1
Frontend/lib/themes/cust-theme-14.css.map
Normal file
File diff suppressed because one or more lines are too long
3024
Frontend/lib/themes/cust-theme-2.css
Normal file
3024
Frontend/lib/themes/cust-theme-2.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-2.css.map
Normal file
1
Frontend/lib/themes/cust-theme-2.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-3.css
Normal file
3021
Frontend/lib/themes/cust-theme-3.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-3.css.map
Normal file
1
Frontend/lib/themes/cust-theme-3.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-4.css
Normal file
3021
Frontend/lib/themes/cust-theme-4.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-4.css.map
Normal file
1
Frontend/lib/themes/cust-theme-4.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-5.css
Normal file
3021
Frontend/lib/themes/cust-theme-5.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-5.css.map
Normal file
1
Frontend/lib/themes/cust-theme-5.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-6.css
Normal file
3021
Frontend/lib/themes/cust-theme-6.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-6.css.map
Normal file
1
Frontend/lib/themes/cust-theme-6.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-7.css
Normal file
3021
Frontend/lib/themes/cust-theme-7.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-7.css.map
Normal file
1
Frontend/lib/themes/cust-theme-7.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-8.css
Normal file
3021
Frontend/lib/themes/cust-theme-8.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-8.css.map
Normal file
1
Frontend/lib/themes/cust-theme-8.css.map
Normal file
File diff suppressed because one or more lines are too long
3021
Frontend/lib/themes/cust-theme-9.css
Normal file
3021
Frontend/lib/themes/cust-theme-9.css
Normal file
File diff suppressed because it is too large
Load Diff
1
Frontend/lib/themes/cust-theme-9.css.map
Normal file
1
Frontend/lib/themes/cust-theme-9.css.map
Normal file
File diff suppressed because one or more lines are too long
@ -6,8 +6,8 @@
|
||||
<title>登入 | 全方位監控系統</title>
|
||||
|
||||
<!-- base css -->
|
||||
<link id="vendorsbundle" rel="stylesheet" media="screen, print" href="css/vendors.bundle.css">
|
||||
<link id="appbundle" rel="stylesheet" media="screen, print" href="css/app.bundle.css">
|
||||
<link id="vendorsbundle" rel="stylesheet" media="screen, print" href="lib/vendors.bundle.css">
|
||||
<link id="appbundle" rel="stylesheet" media="screen, print" href="lib/app.bundle.css">
|
||||
<link id="mytheme" rel="stylesheet" media="screen, print" href="css/themes/cust-theme-15.css">
|
||||
<link id="myskin" rel="stylesheet" media="screen, print" href="css/skins/skin-master.css">
|
||||
<!-- Place favicon.ico in the root directory -->
|
||||
@ -69,14 +69,14 @@
|
||||
</video>
|
||||
<!--Base JS-->
|
||||
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
|
||||
<script src="js/vendors.bundle.js"></script>
|
||||
<script src="js/app.bundle.js"></script>
|
||||
<script src="lib//vendors.bundle.js"></script>
|
||||
<script src="lib//app.bundle.js"></script>
|
||||
<!-- JQuery Validate -->
|
||||
<script src="lib/jquery-validation/dist/jquery.validate.js"></script>
|
||||
<script src="lib/jquery-validation/dist/additional-methods.min.js"></script>
|
||||
<script src="lib/jquery-validation/dist/localization/messages_zh_TW.js"></script>
|
||||
<script src="js/notifications/sweetalert2/sweetalert2.bundle.js"></script>
|
||||
<script src="js/notifications/toastr/toastr.js"></script>
|
||||
<script src="lib/notifications/sweetalert2/sweetalert2.bundle.js"></script>
|
||||
<script src="lib/notifications/toastr/toastr.js"></script>
|
||||
<script src="js/toast.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
Loading…
Reference in New Issue
Block a user