Merge branch 'SPM-12'
This commit is contained in:
commit
24d68319b9
|
@ -1,4 +1,5 @@
|
||||||
*.iml
|
*.iml
|
||||||
.idea
|
.idea
|
||||||
.project
|
.project
|
||||||
target
|
target
|
||||||
|
.vscode
|
|
@ -0,0 +1,26 @@
|
||||||
|
{
|
||||||
|
"labels": [
|
||||||
|
"Insgesamt",
|
||||||
|
"Gruppe 1",
|
||||||
|
"Gruppe 2",
|
||||||
|
"Gruppe 3"
|
||||||
|
],
|
||||||
|
"data1": [
|
||||||
|
50,
|
||||||
|
10,
|
||||||
|
20,
|
||||||
|
30
|
||||||
|
],
|
||||||
|
"data2": [
|
||||||
|
30,
|
||||||
|
5,
|
||||||
|
20,
|
||||||
|
5
|
||||||
|
],
|
||||||
|
"data3": [
|
||||||
|
80,
|
||||||
|
20,
|
||||||
|
30,
|
||||||
|
30
|
||||||
|
]
|
||||||
|
}
|
|
@ -0,0 +1,26 @@
|
||||||
|
{
|
||||||
|
"labels": [
|
||||||
|
"1 Jan",
|
||||||
|
"2 Jan",
|
||||||
|
"3 Jan",
|
||||||
|
"4 Jan",
|
||||||
|
"5 Jan",
|
||||||
|
"6 Jan"
|
||||||
|
],
|
||||||
|
"data1": [
|
||||||
|
200,
|
||||||
|
150,
|
||||||
|
190,
|
||||||
|
99,
|
||||||
|
142,
|
||||||
|
222
|
||||||
|
],
|
||||||
|
"data2": [
|
||||||
|
434,
|
||||||
|
300,
|
||||||
|
324,
|
||||||
|
198,
|
||||||
|
349,
|
||||||
|
353
|
||||||
|
]
|
||||||
|
}
|
|
@ -0,0 +1,18 @@
|
||||||
|
{
|
||||||
|
"labels": [
|
||||||
|
"8-9",
|
||||||
|
"9-10",
|
||||||
|
"10-11",
|
||||||
|
"11-12",
|
||||||
|
"12-13",
|
||||||
|
"13-14"
|
||||||
|
],
|
||||||
|
"data1": [
|
||||||
|
12,
|
||||||
|
19,
|
||||||
|
3,
|
||||||
|
5,
|
||||||
|
2,
|
||||||
|
3
|
||||||
|
]
|
||||||
|
}
|
|
@ -0,0 +1,12 @@
|
||||||
|
{
|
||||||
|
"labels": [
|
||||||
|
"Gruppe 1",
|
||||||
|
"Gruppe 2",
|
||||||
|
"Gruppe 3"
|
||||||
|
],
|
||||||
|
"data1": [
|
||||||
|
2055,
|
||||||
|
816,
|
||||||
|
953
|
||||||
|
]
|
||||||
|
}
|
|
@ -0,0 +1,30 @@
|
||||||
|
{
|
||||||
|
"labels": [
|
||||||
|
"Insgesamt",
|
||||||
|
"Gruppe 1",
|
||||||
|
"Gruppe 2",
|
||||||
|
"Gruppe 3"
|
||||||
|
],
|
||||||
|
"label1": "Gartengeräte",
|
||||||
|
"data1": [
|
||||||
|
150,
|
||||||
|
50,
|
||||||
|
50,
|
||||||
|
50
|
||||||
|
],
|
||||||
|
"label2": "Eisenwaren",
|
||||||
|
"data2": [
|
||||||
|
120,
|
||||||
|
10,
|
||||||
|
80,
|
||||||
|
30
|
||||||
|
],
|
||||||
|
"label3": "Baumaterialien",
|
||||||
|
"data3": [
|
||||||
|
200,
|
||||||
|
102,
|
||||||
|
53,
|
||||||
|
45
|
||||||
|
]
|
||||||
|
|
||||||
|
}
|
|
@ -0,0 +1,301 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>BauDas</title>
|
||||||
|
<!--Import Google Icon Font-->
|
||||||
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||||
|
<!--Import materialize.css-->
|
||||||
|
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" media="screen,projection" />
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css" integrity="sha256-aa0xaJgmK/X74WM224KMQeNQC2xYKwlAt08oZqjeF0E=" crossorigin="anonymous" />
|
||||||
|
|
||||||
|
<!--Let browser know website is optimized for mobile-->
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="blue-grey lighten-5">
|
||||||
|
<!--Navbar-->
|
||||||
|
<div class="navbar-fixed">
|
||||||
|
<nav class="nav-extended blue-grey lighten-3 white-text row">
|
||||||
|
<a href="#" class="brand-logo hide-on-small-and-down center">BauDas</a>
|
||||||
|
<!--Navbar Tabs-->
|
||||||
|
<div class="nav-content col 12 ">
|
||||||
|
<ul class="tabs tabs-transparent blue-grey lighten-3 white-text">
|
||||||
|
<li class="tab"><a class="active" href="#analysis"><i class="material-icons left">poll</i>Analyse</a></li>
|
||||||
|
<li class="tab"><a href="#marketing"><i class="material-icons left">public</i>Marketing</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<!--Navbar Items-->
|
||||||
|
<div class="nav-wrapper col 2 right">
|
||||||
|
<ul class="right hide-on-med-and-down">
|
||||||
|
<li><a data-target="slide-out" class="sidenav-trigger show-on-large"><i class="material-icons left">menu</i>Menü</a></li><!--Sidenav-->
|
||||||
|
<li><a href="login.html"><i class="material-icons left">person_outline</i>Logout</a></li><!--Logout-->
|
||||||
|
</ul>
|
||||||
|
<ul class="right">
|
||||||
|
<li><a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a></li><!--Sidenav-->
|
||||||
|
<li><a href="login.html" class="sidenav-trigger"><i class="material-icons">person_outline</i></a></li><!--Logout-->
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<!--Sidenav Content-->
|
||||||
|
<ul id="slide-out" class="sidenav">
|
||||||
|
<li><div class="user-view">
|
||||||
|
<div class="background">
|
||||||
|
<img style="width: 100%" src="logoOrginal.gif">
|
||||||
|
</div>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
</div></li>
|
||||||
|
<li><div class="divider"></div></li>
|
||||||
|
<li><div class="input-field container">
|
||||||
|
<label>Gruppenauswahl</label>
|
||||||
|
<br>
|
||||||
|
<select>
|
||||||
|
<option value="0">alle</option>
|
||||||
|
<option value="1">Gruppe 1</option>
|
||||||
|
<option value="2">Gruppe 2</option>
|
||||||
|
<option value="3">Gruppe 3</option>
|
||||||
|
</select>
|
||||||
|
</div></li>
|
||||||
|
<li><div class="input-field container">
|
||||||
|
<label>Datensatzauswahl</label>
|
||||||
|
<br>
|
||||||
|
<select>
|
||||||
|
<option value="0">aktuell</option>
|
||||||
|
<option value="1">Datensatz 1</option>
|
||||||
|
<option value="2">Datensatz 2</option>
|
||||||
|
<option value="3">Datensatz 3</option>
|
||||||
|
<option value="4">Datensatz 4</option>
|
||||||
|
<option value="5">Datensatz 5</option>
|
||||||
|
</select>
|
||||||
|
<br>
|
||||||
|
</div></li>
|
||||||
|
<li><div class="divider"></div></li>
|
||||||
|
<li><form action="upload">
|
||||||
|
<br>
|
||||||
|
<div class="file-field input-field container">
|
||||||
|
<div class="btn blue-grey lighten-2">
|
||||||
|
<span>File</span>
|
||||||
|
<input type="file">
|
||||||
|
</div>
|
||||||
|
<div class="file-path-wrapper">
|
||||||
|
<input class="file-path validate" type="text" placeholder="Datei hochladen">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form></li>
|
||||||
|
<li><div class="container">
|
||||||
|
<a class="waves-effect waves-light btn blue-grey lighten-2 right"><i class="material-icons left">file_upload</i>Hochladen</a>
|
||||||
|
</div></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<!--Cards-->
|
||||||
|
<!--Analyse-Cards-->
|
||||||
|
<div id="analysis" class="row container">
|
||||||
|
<!--Übersicht-->
|
||||||
|
<div class="col s12 m12">
|
||||||
|
<div id="overview" class="card white">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Übersicht</span>
|
||||||
|
</div>
|
||||||
|
<div class="card-action center">
|
||||||
|
<a href="#">Tagesübersicht</a>
|
||||||
|
<a href="#">Wochenübersicht</a>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div>
|
||||||
|
<canvas id="overview_chart" width="1000" height="400"></canvas>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Einkaufszeiten-->
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="shoping_times" class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title">Einkaufszeiten</span>
|
||||||
|
</div>
|
||||||
|
<div class="center">
|
||||||
|
<div class="input-field col s12">
|
||||||
|
<select>
|
||||||
|
<option value="0">Montag</option>
|
||||||
|
<option value="1">Dienstag</option>
|
||||||
|
<option value="2">Mittwoch</option>
|
||||||
|
<option value="3">Donnerstag</option>
|
||||||
|
<option value="4">Freitag</option>
|
||||||
|
<option value="5">Samstag</option>
|
||||||
|
<option value="6">Sonntag</option>
|
||||||
|
</select>
|
||||||
|
<label>Wochentag</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<canvas id="shoping_times_chart" width="1000" height="400"></canvas>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Verkaufte Artikel-->
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="sold_articles" class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Verkaufte Artikel</span>
|
||||||
|
</div>
|
||||||
|
<div class="center">
|
||||||
|
<div class="input-field col s12">
|
||||||
|
<select>
|
||||||
|
<option value="0">Artikel 1</option>
|
||||||
|
<option value="1">Artikel 2</option>
|
||||||
|
<option value="2">Artikel 3</option>
|
||||||
|
</select>
|
||||||
|
<label>Artikel</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<canvas id="sold_articles_cake" width="1000" height="400"></canvas>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Top Artikel-->
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="top_articles" class="card white">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Top Artikel</span>
|
||||||
|
</div>
|
||||||
|
<div class="card-action center">
|
||||||
|
<a href="#">Umsatz</a>
|
||||||
|
<a href="#">Stückzahl</a>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div>
|
||||||
|
<canvas id="top_articles_chart" width="1000" height="400"></canvas>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!--Flop Artikel-->
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="flop_articles" class="card white">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Flop Artikel</span>
|
||||||
|
</div>
|
||||||
|
<div class="card-action center">
|
||||||
|
<a href="#">Umsatz</a>
|
||||||
|
<a href="#">Stückzahl</a>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div>
|
||||||
|
<canvas id="flop_articles_chart" width="1000" height="400"></canvas>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Warenkorbanlyse-->
|
||||||
|
<div id="shopping_card_analysis" class="col s12 m6">
|
||||||
|
<div class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Warenkorbanalyse</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>Coming Soon</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Gruppenübersicht-->
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="group_overview" class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Gruppenübersicht</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>Coming Soon</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Marketing-Cards-->
|
||||||
|
<div id="marketing" class="row container">
|
||||||
|
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="marketing_tip_1" class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Marketingmaßnahme 1</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>Coming Soon</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="marketing_tip_2" class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Marketingmaßnahme 2</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>Coming Soon</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="marketing_tip_3" class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Marketingmaßnahme 3</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>Coming Soon</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col s12 m6">
|
||||||
|
<div id="marketing_tip_4" class="card white">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Marketingmaßnahme 4</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>Coming Soon</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Anfang Skriptbereich-->
|
||||||
|
|
||||||
|
<!--Script für Diagramme-->
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.min.js" integrity="sha256-xKeoJ50pzbUGkpQxDYHD7o7hxe0LaOGeguUidbq6vis=" crossorigin="anonymous"></script>
|
||||||
|
<script src="js/overview.js"></script>
|
||||||
|
<script src="js/shoping_times.js"></script>
|
||||||
|
<script src="js/sold_articles.js"></script>
|
||||||
|
<script src="js/top_articles.js"></script>
|
||||||
|
<script src="js/flop_articles.js"></script>
|
||||||
|
|
||||||
|
<!--Script für Materlialize-->
|
||||||
|
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
|
||||||
|
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
|
||||||
|
<script type="text/javascript" src="js/materialize_components.js"></script>
|
||||||
|
|
||||||
|
<!--Ende Skriptbereich-->
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,47 @@
|
||||||
|
$.ajax({
|
||||||
|
url: 'data/flop_articles.json',
|
||||||
|
dataType: 'json'
|
||||||
|
}).done(function (results) {
|
||||||
|
new Chart(document.getElementById("flop_articles_chart"), {
|
||||||
|
type: 'horizontalBar',
|
||||||
|
data: {
|
||||||
|
labels: results.labels,
|
||||||
|
datasets: [{
|
||||||
|
label: 'Holz',
|
||||||
|
backgroundColor: 'rgba(244, 177, 131, 1)',
|
||||||
|
stack: 'Stack 0',
|
||||||
|
data: results.data1
|
||||||
|
}, {
|
||||||
|
label: 'Eisenwaren',
|
||||||
|
backgroundColor: 'rgba(255, 217, 102, 1)',
|
||||||
|
stack: 'Stack 1',
|
||||||
|
data: results.data2
|
||||||
|
}, {
|
||||||
|
label: 'Baumaterialien',
|
||||||
|
backgroundColor: 'rgba(196, 209, 142, 1)',
|
||||||
|
stack: 'Stack 2',
|
||||||
|
data: results.data3
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
responsive: true,
|
||||||
|
title: {
|
||||||
|
display: false,
|
||||||
|
text: 'Flop Artikel'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
position: 'bottom',
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
beginAtZero: true
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,14 @@
|
||||||
|
$(".dropdown-trigger").dropdown();
|
||||||
|
$('.tabs').tabs();
|
||||||
|
$(document).ready(function(){
|
||||||
|
$('.sidenav').sidenav();
|
||||||
|
});
|
||||||
|
$(document).ready(function(){
|
||||||
|
$('select').formSelect();
|
||||||
|
});
|
||||||
|
$(document).ready(function(){
|
||||||
|
$('.collapsible').collapsible();
|
||||||
|
});
|
||||||
|
$(document).ready(function() {
|
||||||
|
M.updateTextFields();
|
||||||
|
});
|
|
@ -0,0 +1,58 @@
|
||||||
|
$.ajax({
|
||||||
|
url: 'data/overview.json',
|
||||||
|
dataType: 'json'
|
||||||
|
}).done(function (results) {
|
||||||
|
new Chart(document.getElementById("overview_chart"), {
|
||||||
|
type: 'line',
|
||||||
|
data: {
|
||||||
|
labels: results.labels,
|
||||||
|
datasets: [{
|
||||||
|
label: "Warenanzahl",
|
||||||
|
data: results.data1,
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: 'rgba(113, 114, 231, 0.7)',
|
||||||
|
lineTension: 0,
|
||||||
|
}, {
|
||||||
|
label: "Einnahmen in €",
|
||||||
|
data: results.data2,
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: 'rgba(104, 216, 154, 0.8)',
|
||||||
|
lineTension: 0,
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
responsive: true,
|
||||||
|
title: {
|
||||||
|
display: false,
|
||||||
|
text: 'Übersicht'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
tooltips: {
|
||||||
|
mode: 'index',
|
||||||
|
intersect: false,
|
||||||
|
},
|
||||||
|
hover: {
|
||||||
|
mode: 'nearest',
|
||||||
|
intersect: true
|
||||||
|
},
|
||||||
|
elements: {
|
||||||
|
point: {
|
||||||
|
radius: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
xAxes: [{
|
||||||
|
display: true,
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
yAxes: [{
|
||||||
|
display: true,
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,57 @@
|
||||||
|
|
||||||
|
$.ajax({
|
||||||
|
url: 'data/shoping_times.json',
|
||||||
|
dataType: 'json'
|
||||||
|
}).done(function (results) {
|
||||||
|
new Chart(document.getElementById("shoping_times_chart"), {
|
||||||
|
type: 'bar',
|
||||||
|
data: {
|
||||||
|
labels: results.labels,
|
||||||
|
datasets: [{
|
||||||
|
label: 'Anzahl verkaufter Artikel',
|
||||||
|
data: results.data1,
|
||||||
|
backgroundColor: [
|
||||||
|
'rgba(143, 170, 220, 0.9)',
|
||||||
|
'rgba(255, 50, 1, 0.9)',
|
||||||
|
'rgba(143, 170, 220, 0.9)',
|
||||||
|
'rgba(143, 170, 220, 0.9)',
|
||||||
|
'rgba(103, 215, 153, 0.9)',
|
||||||
|
'rgba(143, 170, 220, 0.9)',
|
||||||
|
],
|
||||||
|
borderColor: [
|
||||||
|
'rgba(143, 170, 220, 0.9)',
|
||||||
|
'rgba(255, 50, 1, 1)',
|
||||||
|
'rgba(143, 170, 220, 1)',
|
||||||
|
'rgba(143, 170, 220, 1)',
|
||||||
|
'rgba(103, 215, 153, 1)',
|
||||||
|
'rgba(143, 170, 220, 1)',
|
||||||
|
],
|
||||||
|
borderWidth: 1
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
responsive: true,
|
||||||
|
title: {
|
||||||
|
display: false,
|
||||||
|
text: 'Einkaufszeiten'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
categoryPercentage: 1.0,
|
||||||
|
barPercentage: 0.5,
|
||||||
|
ticks: {
|
||||||
|
beginAtZero: true
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
xAxes: [{
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,38 @@
|
||||||
|
$.ajax({
|
||||||
|
url: 'data/sold_articles.json',
|
||||||
|
dataType: 'json'
|
||||||
|
}).done(function (results) {
|
||||||
|
new Chart(document.getElementById("sold_articles_cake"), {
|
||||||
|
type: 'pie',
|
||||||
|
data: {
|
||||||
|
datasets: [{
|
||||||
|
data: results.data1,
|
||||||
|
backgroundColor: [
|
||||||
|
'rgba(237, 125, 49, 0.9)',
|
||||||
|
'rgba(255, 192, 0, 0.9)',
|
||||||
|
'rgba(112, 173, 71, 0.9)',
|
||||||
|
],
|
||||||
|
label: 'Dataset 1'
|
||||||
|
}],
|
||||||
|
labels: results.labels
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
responsive: true,
|
||||||
|
title: {
|
||||||
|
display: false,
|
||||||
|
text: 'Verkaufte Artikel',
|
||||||
|
},
|
||||||
|
tooltips: {
|
||||||
|
mode: 'index',
|
||||||
|
intersect: false,
|
||||||
|
},
|
||||||
|
hover: {
|
||||||
|
mode: 'nearest',
|
||||||
|
intersect: true
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
position: 'bottom'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,47 @@
|
||||||
|
$.ajax({
|
||||||
|
url: 'data/top_articles.json',
|
||||||
|
dataType: 'json'
|
||||||
|
}).done(function (results) {
|
||||||
|
new Chart(document.getElementById("top_articles_chart"), {
|
||||||
|
type: 'phorizontalBarie',
|
||||||
|
data: {
|
||||||
|
labels: results.labels,
|
||||||
|
datasets: [{
|
||||||
|
label: results.label1,
|
||||||
|
backgroundColor: 'rgba(244, 177, 131, 1)',
|
||||||
|
stack: 'Stack 0',
|
||||||
|
data: results.data1
|
||||||
|
}, {
|
||||||
|
label: results.label2,
|
||||||
|
backgroundColor: 'rgba(255, 217, 102, 1)',
|
||||||
|
stack: 'Stack 1',
|
||||||
|
data: results.data2
|
||||||
|
}, {
|
||||||
|
label: results.label3,
|
||||||
|
backgroundColor: 'rgba(196, 209, 142, 1)',
|
||||||
|
stack: 'Stack 2',
|
||||||
|
data: results.data3
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
responsive: true,
|
||||||
|
title: {
|
||||||
|
display: false,
|
||||||
|
text: 'Top Artikel'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
position: 'bottom',
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
beginAtZero: true
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,44 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Login</title>
|
||||||
|
<!--Import Google Icon Font-->
|
||||||
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||||
|
<!--Import materialize.css-->
|
||||||
|
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" media="screen,projection" />
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css" integrity="sha256-aa0xaJgmK/X74WM224KMQeNQC2xYKwlAt08oZqjeF0E=" crossorigin="anonymous" />
|
||||||
|
<!--Let browser know website is optimized for mobile-->
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
</head>
|
||||||
|
<body class="blue-grey lighten-5">
|
||||||
|
<div class="container row">
|
||||||
|
<!--Login-->
|
||||||
|
<div class="center">
|
||||||
|
<div class="card white col s6 push-s3">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="center">
|
||||||
|
<img style="width: 50%" src="logoOrginal.gif">
|
||||||
|
</div>
|
||||||
|
<div class="divider"></div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s8 push-s2">
|
||||||
|
<input id="password" type="password" class="validate" placeholder="Passwort">
|
||||||
|
<a class="waves-effect waves-light btn blue-grey lighten-2"><i class="material-icons left">lock_open</i>Login</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Anfang Skriptbereich-->
|
||||||
|
|
||||||
|
<!--Script für Materlialize-->
|
||||||
|
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
|
||||||
|
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
|
||||||
|
<script type="text/javascript" src="js/materialize_components.js"></script>
|
||||||
|
|
||||||
|
<!--Ende Skriptbereich-->
|
||||||
|
</body>
|
||||||
|
</html>
|
Binary file not shown.
After Width: | Height: | Size: 32 KiB |
|
@ -0,0 +1,55 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Registrierung</title>
|
||||||
|
<!--Import Google Icon Font-->
|
||||||
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||||
|
<!--Import materialize.css-->
|
||||||
|
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" media="screen,projection" />
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css" integrity="sha256-aa0xaJgmK/X74WM224KMQeNQC2xYKwlAt08oZqjeF0E=" crossorigin="anonymous" />
|
||||||
|
<!--Let browser know website is optimized for mobile-->
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
</head>
|
||||||
|
<body class="blue-grey lighten-5">
|
||||||
|
<div class="container">
|
||||||
|
<!--Login-->
|
||||||
|
<div class="center">
|
||||||
|
<div class="card white">
|
||||||
|
<div class="center">
|
||||||
|
<span class="card-title center">Regstrierung</span>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div>
|
||||||
|
<img style="width: 100%" src="logoOrginal.gif">
|
||||||
|
</div>
|
||||||
|
<div class="divider"></div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12">
|
||||||
|
<input id="login" type="text">
|
||||||
|
<label for="login">Login-Name</label>
|
||||||
|
</div>
|
||||||
|
<div class="col s12">
|
||||||
|
<input id="password" type="text">
|
||||||
|
<label for="password">Passwort</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-action right">
|
||||||
|
<a href="#">Bestätigen</a>
|
||||||
|
<a href="login.html">Zurück</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Anfang Skriptbereich-->
|
||||||
|
|
||||||
|
<!--Script für Materlialize-->
|
||||||
|
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
|
||||||
|
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
|
||||||
|
<script type="text/javascript" src="js/materialize_components.js"></script>
|
||||||
|
|
||||||
|
<!--Ende Skriptbereich-->
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in New Issue