ordersprinter/webapp/reports.html

242 lines
11 KiB
HTML

<html>
<head>
<title>Ansicht Statistik</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="author" content="Stefan Pichel">
<link rel="stylesheet" type="text/css" href="css/bestformat.css?v=1.5.15">
<link rel="stylesheet" href="php/contenthandler.php?module=admin&command=getmobilecss" />
<link rel="stylesheet" href="php/3rdparty/orderstyle/jquery.mobile.icons.min.css" />
<link rel="stylesheet" href="php/3rdparty/jquery.mobile-1.4.0.min.css" type="text/css" />
<script src="php/3rdparty/jquery-2.0.3.min.js"></script>
<script src="php/3rdparty/jquery.mobile-1.4.0.min.js"></script>
<script src="utilities.js"></script>
<script src="elements/rating.js"></script>
</head>
<body>
<script>
var REP_USERSUM = ["Kassenbestände ","Open paydesks", "Cajas" ];
var REP_USER = ["Benutzer","User","Usario"];
var REP_USER_TXT = ["Diese Übersicht umfasst den derzeitigen Brutto-Kassenbestand pro Kasse inkl. aller Zahlungswege und Ein-/Auslagen.",
"This overview contains the current sum of all paydesks including all payment types and cash inserts/extracs.",
"Esta table contiene todos las cajas incluyendo todas los tipos the pagamientos"];
var REP_TODAY = ["Heute","Today","Hoy"];
var REP_YESTERDAY = ["Gestern","Yesterday","Ayer"];
var REP_HOUR = ["Uhrzeit","Time","Hora"];
var REP_DAY = ["Tag","Day","Día"];
var REP_PROD = ["Produkt","Product","Producto"];
var REP_SUM = ["Summe","Sum","Total"];
var REP_TODAY_TXT = ["Diese Übersicht umfasst alle Kassenbons, die bisher heute gedruckt wurden.",
"This overview shows all receipts that have been printed today.",
"Este parte contiene todos los tiques de este día."];
var REP_YEST_TXT = ["Diese Übersicht umfasst die gestrigen Einnahmen, die in Tageslosungen erfasst wurden.",
"This overview shows all revenues of yesterday that are part of a closing.",
"Este parte muestra todo el cobro de tiques cerrados de ayer."];
var REP_THIS_MONTH_TXT = ["Diese Übersicht umfasst alle Einnahmen dieses Monats, die in Tageslosungen erfasst sind.",
"This overview shows all revenues of this month that are part of a closing.",
"Este parte muestra todo el cobro de tiques cerrados de este mes."];
var REP_LAST_MONTH_TXT = ["Diese Übersicht umfasst Einnahmen des letzten Monats.",
"This overview shows all revenues of the last month.",
"Este parte muestra todo el cobro del mes pasado."];
var REP_PROD_LAST30_TXT = ["Diese Übersicht zeigt die Einnahmen, die mit den in den letzten 30 Tagen verkauften Produkten erzielt wurden.",
"This overview displays the revenue that could be achieved with all sold products in the last 30 days.",
"Este parte muestra el cobro con el productos vendido en los últimos 30 días."];
var REP_NO_DATA = ["Es liegen keine Daten vor.", "There is no data.", "No hay ningún datos."];
var REP_PRODREP = ["Produktstatistik","Product report","Estadistica de productos"];
var REP_TITLE = ["Statistik","Statistics","Estadisticas"];
var REP_RATINGS = ["Bewertungen","Ratings","Valoraciones"];
var REP_RATINFO = ["Übersicht der Bewertung der letzten 30 Tage","Overview of all ratings in the last 30 days","Valoraciones de los últimos 30 dias"];
var REP_SERVICE = ["Bedienung und Service","Service","Servicio"];
var REP_KITCHEN = ["Küche","Kitchen","Cocina"];
var REP_GOOD = ["Zufriedener Kunde","Customer is happy","Cliente esta contento"];
var REP_OK = ["Passabel","ok","Pues..."];
var REP_BAD = ["Kunde ist unzufrieden","Customer is not satisfied","Cliente no esta contento"];
var REP_COUNT = ["Anzahl","Number","Número"];
var REP_REMARKS = ["Kundenmeinungen","Customer remarks","Notas de los clientes"];
var lang = 0;
function setLanguage(language) {
lang = language;
$("#reportttitletxt").html(REP_TITLE[lang]);
}
function getStats() {
doAjax("GET","php/contenthandler.php?module=reports&command=getStats",null,fillPageWithStats,"Statistikreports nicht erhalten");
}
function fillPageWithStats(jsonText) {
var htmlToday = fillOnePart(REP_TODAY[lang],jsonText.today,REP_HOUR[lang],
REP_TODAY_TXT[lang],
"center",10,10,80);
var htmlYesterday = fillOnePart(REP_YESTERDAY[lang],jsonText.yesterday,REP_HOUR[lang],
REP_YEST_TXT[lang],
"center",10,10,80);
var htmlThisMonth = fillOnePart(jsonText.thismonthname,jsonText.thismonth,REP_DAY[lang],
REP_THIS_MONTH_TXT[lang],
"center",10,10,80);
var htmlLastMonth = fillOnePart(jsonText.lastmonthname,jsonText.lastmonth,REP_DAY[lang],
REP_LAST_MONTH_TXT[lang],
"center",10,10,80);
var htmlProds = fillOnePart(REP_PRODREP[lang],jsonText.prodsums,REP_PROD[lang],
REP_PROD_LAST30_TXT[lang],
"left",30,10,60);
var htmlRatings = fillRatingsPart(jsonText.ratings,REP_DAY[lang],10,10,40,40);
var htmlUserSumsPart = fillOnePart(REP_USERSUM[lang],jsonText.usersums,REP_USER[lang],
REP_USER_TXT[lang],
"center",15,10,75);
$("#content").html(htmlToday + htmlYesterday + htmlThisMonth + htmlLastMonth + htmlProds + htmlRatings + htmlUserSumsPart);
$("#content").trigger("create");
}
function getLegend (good,ok,bad) {
var goodTxt = "<img src=img/green.png style='height:20px;width:40px;' />: " + good + "<br>";
var okTxt = "<img src=img/yellow.png style='height:20px;width:40px;' />: " + ok + "<br>";
var badTxt = "<img src=img/red.png style='height:20px;width:40px;' />: " + bad + "<br>";
return goodTxt + okTxt + badTxt;
}
function fillRatingsPart(ratingReport,iterObjName,width1,width2,width3,width4) {
var ratings = ratingReport.statistics;
var collapse_elem = '<div data-role="collapsible" data-content-theme="e" data-collapsed="true" data-theme="c">';
var header = '<h3>'+REP_RATINGS[lang] + '</h3><p>' + REP_RATINFO[lang] + '</p><p>';
var legend = getLegend(REP_GOOD[lang],REP_OK[lang],REP_BAD[lang]) + "</p><p>";
var content = "<table width=100% class='reporttable'>";
content += aTableRatingHeader(iterObjName,REP_COUNT[lang],REP_SERVICE[lang],REP_KITCHEN[lang],width1,width2,width3,width4);
var i=0;
for (i=0;i<ratings.length;i++) {
var aRating = ratings[i];
var aRatingEl = new Rating(aRating.day,aRating.service,aRating.kitchen,aRating.total);
content += "<tr><td style='text-align:center;'>" + aRating.day
+ "<td style='text-align:center;'>" + aRatingEl.getTotal()
+ "<td>" + aRatingEl.getServiceInfo() + "<td>" + aRatingEl.getKitchenInfo() + "</tr>";
}
content += "</table>";
var remarks = ratingReport.remarks;
if (remarks.length > 0) {
content += "</p><p><b>" + REP_REMARKS[lang] + "</b><br>";
var i=0;
for (i=0;i<remarks.length;i++) {
var aRemark = remarks[i];
content += "<i>" + aRemark.date + "</i>: " + aRemark.remark + "<br>";
}
}
var html = collapse_elem + header + legend + content + "</p></div>";
return html;
}
function fillOnePart(aName,values,iterObjName,infoText,iterAlignment,width1,width2,width3) {
var collapse_elem = '<div data-role="collapsible" data-content-theme="e" data-collapsed="true" data-theme="c">';
var header = '<h3>'+aName + '</h3><p>' + infoText + '</p><p>';
var maxValue = values.max;
var content = REP_NO_DATA[lang];
if (maxValue != 0.0) {
var content = "<table width=100% class='reporttable'>";
content += aTableHeader(iterObjName,REP_SUM[lang],"Graph",width1,width2,width3);
var contentValues = values.content;
var decpoint = $("#info-page").data("decpoint");
$.each(contentValues, function (i, aStatValue) {
var hourOrDay = aStatValue.iter;
var sum = aStatValue.sum;
content += aTableLine(hourOrDay,sum.toString().replace(".",decpoint),sum/maxValue*98.0,iterAlignment,
width1,width2,width3);
});
content += "</table>";
}
var html = collapse_elem + header + content + "</p></div>";
return html;
}
function aTableHeader(val1,val2,val3,width1,width2,width3) {
var text = "<tr><th width=" + width1 + "%>" + val1 + "<th width=" + width2 + "%>" + val2 + "<th width=" + width3 + "%>" + val3;
return text;
}
function aTableRatingHeader(val1,val2,val3,val4,width1,width2,width3,width4) {
var text = "<tr><th width=" + width1 + "%>" + val1 + "<th width=" + width2 + "%>" + val2 + "<th width=" + width3 + "%>" + val3 + "<th width=" + width4 + "%>" + val4;
return text;
}
function aTableLine(val1,val2,porcent,iterAlignment,width1,width2,width3) {
var text = "<tr><td width=" + width1 + "% style='text-align:" + iterAlignment + ";'>" + toHtml(val1) + "<td width=" + width2 + "% style='text-align:right;'>" + val2;
text += "<td width=" + width3 + "%><img src=img/green.png width=" + porcent + "% height=20px />";
return text;
}
function getGeneralConfigItems() {
doAjax("GET", "php/contenthandler.php?module=admin&command=getGeneralConfigItems", null, insertDecPointStartRest, "Fehler Konfigurationsdaten");
}
function insertDecPointStartRest(configResult) {
if (configResult.status == "OK") {
var values = configResult.msg;
var decpoint = values.decpoint;
$("#info-page").data("decpoint",values.decpoint);
setLanguage(values.userlanguage);
getStats();
} else {
setTimeout(function(){document.location.href = "index.html"},250); // not logged in
}
}
$(document).on("pageinit", "#info-page", function () {
initializeMainMenu("#modulemenu");
hideMenu();
getGeneralConfigItems();
});
</script>
<div data-role="page" id="info-page" data-theme="c">
<div data-role="panel" id="modulepanel" data-position="right" data-display="overlay">
<ul data-role="listview" id="modulemenu" data-divider-theme="a" data-inset="true">
<li data-role="list-divider" data-theme="b" data-role="heading">Hauptmenü</li>
</ul>
</div><!-- /panel -->
<div data-role="header" data-theme="b" data-position="fixed" id="theheader" style="background-color:black;">
<h1><span id="reportttitletxt">Statistik</span> <img src="img/connection.png" class="connectionstatus" style="display:none;" /> <img src="img/printerstatus.png" class="printerstatus" style="display:none;" /> <img src="img/tasksstatus.png" class="tasksstatus" style="display:none;" /></h1>
<div data-type="horizontal" style="top:0px;position:absolute;float:right;z-index:10;display:inline;" align="right" class="ui-btn-right">
<a href="#" data-role="button" data-icon="arrow-d" data-ajax="false" id="menuswitch">Hauptmenü</a>
</div>
</div>
<div data-role="content" id="content">
<h3>Kein Inhalt</h3>
</div>
<div data-role="footer" data-theme="b" id="thefooterr" style="background-color:black;">
<div class="ui-grid-a">
<div class="ui-block-a userinfo" id="loggedinuser"></div>
<div class="ui-block-b grid_right" id="versioninfo"></div>
</div><!-- /grid-a -->
</div> <!-- footer -->
</div>
</body>
</html>