ordersprinter/webapp/timetracking.html

469 lines
16 KiB
HTML
Raw Normal View History

2020-11-19 23:11:27 +01:00
<html>
<head>
<title>Ansicht Zeiterfassung</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">
2020-11-19 23:15:14 +01:00
<link rel="stylesheet" type="text/css" href="css/bestformat.css?v=2.0.8">
2020-11-19 23:11:27 +01:00
<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-1.11.3.min.js"></script>
<script src="php/3rdparty/jquery.mobile-1.4.5.min.js"></script>
2020-11-19 23:15:14 +01:00
<script src="utilities.js?v=2.0.8"></script>
2020-11-19 23:11:27 +01:00
<link rel="stylesheet" href="php/3rdparty/jqueryui1-11-4/jquery-ui.min.css" />
<script src="php/3rdparty/jqueryui1-11-4/jquery-ui.min.js"></script>
<script src="php/3rdparty/jqueryui1-11-4/jquery-ui-i18n.min.js"></script>
<link rel="stylesheet" href="php/3rdparty/jquerymobiledatepicker/jquery.mobile.datepicker.css" />
<script src="php/3rdparty/jquerymobiledatepicker/jquery.mobile.datepicker.js"></script>
</head>
<body>
<script>
var TIME_DATE_START = ["Startdatum","Start date","Fecha de inicio"];
var TIME_DATE_END = ["Enddatum","End date","Fecha del fin"];
var TIME_USER_ACTIONS_TITLE = ["Benutzeraktionen","User actions","Acciones del usario"];
var TIME_COME = ["Kommen","Coming","Venir"];
var TIME_GO = ["Gehen","Go","Irse"];
var TIME_OVERVIEW = ["Übersicht","Overview","Resumen"];
var TIME_ACTION_FAILED = ["Aktion konnte nicht ausgeführt werden","Action failed","Error en accion"];
var TIME_ACTION_OK = ["Aktion wurde ausgeführt","Action was executed","Completado"];
var TIME_DAYNAMES = [
["Montag","Monday","Lunes"],
["Dienstag","Tuesday","Martes"],
["Mittwoch","Wednesday","Miércoles"],
["Donnerstag","Thursday","Jueves"],
["Freitag","Friday","Viernes"],
["Samstag","Saturday","Sábado"],
["Sonntag","Sunday","Domingo"]
];
var TIME_NEW_OVERVIEW_TABLE = ["Liste der Einträge für","List of entries für","Lista de las entradas para"];
var TIME_NEW_ENTRY = ["Neuen Eintrag erstellen","Create new entry","Crear entrada nueva"];
var TIME_TIME = ["Uhrzeit","Time","Hora"];
var TIME_NO_TIME_ERROR = ["Zeitangabe fehlt","Missing time entry","No tiempo"];
var TIME_SUM = ["Arbeitszeit","Work time","Horas de trabajo"];
var TIME_NON_CALCULABLE = ["nicht berechenbar","not calculable","no posible calcular"];
var TIME_TOTAL_SUM = ["Gesamte Arbeitszeit im gewählten Zeitraum","Total work time in chosen date frame","Horas de trabajo total"];
var TIME_ALL_USERS_TIMES = ["Arbeitszeiten aller Benutzer","Work times of all users","Horas de trabajos de cada usario"];
var lang = 0;
var maymanageusers = 0;
var activeuserid = 0;
var activeusername = "";
var allusers = null;
function setLanguage(language) {
lang = language;
$("#datestarttxt").html(TIME_DATE_START[lang]);
$("#dateendtxt").html(TIME_DATE_END[lang]);
$("#useractionstitle").html(TIME_USER_ACTIONS_TITLE[lang]);
$(".comebtntxt").html(TIME_COME[lang]);
$(".gobtntxt").html(TIME_GO[lang]);
$("#useroverview").html(TIME_OVERVIEW[lang]);
$("#newentrytxt").html(TIME_NEW_ENTRY[lang]);
$("#listofentriestxt").html(TIME_NEW_OVERVIEW_TABLE[lang]);
$("#timetxt").html(TIME_TIME[lang]);
$("#listofalluserstimestxt").html(TIME_ALL_USERS_TIMES[lang]);
}
function initializeOverviewDateFields() {
var langtxt = "de";
if (lang == 1) {
langtxt = "en";
} else if (lang == 2) {
langtxt = "es";
};
var currentYear = new Date().getFullYear();
var yearRangeTxt = (currentYear-1) + ":" + (currentYear+1);
$("#datepickerstart").datepicker($.datepicker.regional[langtxt]).datepicker("option", {
changeMonth: true,
changeYear: true,
yearRange: yearRangeTxt,
});
var date = new Date();
var firstDayOfMonth = new Date(date.getFullYear(), date.getMonth(), 1);
$('#datepickerstart').datepicker('setDate', firstDayOfMonth);
$("#datepickerend").datepicker($.datepicker.regional[langtxt]).datepicker("option", {
changeMonth: true,
changeYear: true,
yearRange: yearRangeTxt,
});
$('#datepickerend').datepicker('setDate', new Date());
$("#datepickernew").datepicker($.datepicker.regional[langtxt]).datepicker("option", {
changeMonth: true,
changeYear: true,
yearRange: yearRangeTxt,
});
$('#datepickernew').datepicker('setDate', new Date());
}
function getGeneralConfigItems() {
doAjax("GET", "php/contenthandler.php?module=admin&command=getGeneralConfigItems", null, insertGenConfigStartRest, "Fehler Konfigurationsdaten");
}
function insertGenConfigStartRest(configResult) {
if (configResult.status == "OK") {
var values = configResult.msg;
setLanguage(values.userlanguage);
} else {
setTimeout(function(){document.location.href = "index.html";},250); // not logged in
}
}
function bindComeGoBtns() {
$(".actionsbtn").off("click").on("click", function (e) {
e.stopImmediatePropagation();
e.preventDefault();
var id = this.id;
var comment = $("#comment").val();
var data = {
comment: comment
};
if (id == "comebtn") {
doAjax("POST","php/contenthandler.php?module=timetracking&command=come",data,handleActionAnswer,"Problem Zeiterfassung");
} else if (id == "gobtn") {
doAjax("POST","php/contenthandler.php?module=timetracking&command=go",data,handleActionAnswer,"Problem Zeiterfassung");
}
});
}
function bindUserSelection() {
$("#userselbox").off("change").on("change", function (e) {
e.stopImmediatePropagation();
e.preventDefault();
activeuserid = $("#userselbox").val();
activeusername = $("#userselbox option:selected").text();
updateUserSelBox();
getOverview();
});
}
function bindNewEntryBtns() {
$(".newactionsbtn").off("click").on("click", function (e) {
e.stopImmediatePropagation();
e.preventDefault();
var id = this.id;
var date = $("#datepickernew").datepicker("getDate");
var userid = $("#userselbox").val();
var comment = $("#commentnewentry").val();
var time = $("#timenew").val().trim();
if (time == '') {
alert(TIME_NO_TIME_ERROR[lang]);
return;
}
var data = {
day: date.getDate(),
month: (date.getMonth() + 1),
year: date.getFullYear(),
userid: userid,
time: time,
comment: comment
};
if (id == "newcomebtn") {
doAjax("POST","php/contenthandler.php?module=timetracking&command=newadmincome",data,handleActionAnswer,"Problem Zeiterfassung");
} else if (id == "newgobtn") {
doAjax("POST","php/contenthandler.php?module=timetracking&command=newadmingo",data,handleActionAnswer,"Problem Zeiterfassung");
}
});
}
function handleActionAnswer(answer) {
if (answer.status != "OK") {
alert(TIME_ACTION_FAILED[lang] + ": " + answer.msg);
} else {
clearNewEntryFields();
alert(TIME_ACTION_OK[lang] + ".");
$("#comment").val("");
getOverview();
}
}
function handleDateChangeEvents() {
$(".overviewdatepicker").off("change").on("change", function (e) {
getOverview();
});
}
function createUsersSelectBox() {
var txt = "<select id='userselbox' data-theme='f'>";
allusers.forEach(function(aUser, index) {
var userid = aUser.id;
var username = aUser.username;
var selected = "";
if (userid == activeuserid) {
selected = " selected ";
}
txt += "<option value='" + userid + "' " + selected + ">" + toHtml(username) + "</option>";
});
txt += "</select>";
return txt;
}
function getAllowedOverviewUsers() {
doAjax("GET","php/contenthandler.php?module=timetracking&command=getusers",null,handleUsersAnswer,null);
}
function updateUserSelBox() {
var userSelBox = createUsersSelectBox();
$("#userselpart").html(userSelBox);
$('#userselpart').trigger('create');
$("#selectedusername").html(activeusername);
}
function handleUsersAnswer(answer) {
if (answer.status == "OK") {
maymanageusers = answer.msg.maymanageusers;
if (maymanageusers == 1) {
showCreateNewEntryAreaAndAllUsersList();
}
activeuserid = answer.msg.ownuserid;
activeusername = answer.msg.username;
allusers = answer.msg.users;
updateUserSelBox();
initializeOverviewDateFields();
getOverview();
bindUserSelection();
bindNewEntryBtns();
}
}
function showCreateNewEntryAreaAndAllUsersList() {
$("#newentrypart").show();
$("#listofalluserspart").show();
}
function getOverview() {
var startdate = $("#datepickerstart").datepicker("getDate");
var enddate = $("#datepickerend").datepicker("getDate");
var userid = activeuserid;
var data = {
startday: startdate.getDate(),
startmonth: (startdate.getMonth() + 1),
startyear: startdate.getFullYear(),
endday: enddate.getDate(),
endmonth: (enddate.getMonth() + 1),
endyear: enddate.getFullYear(),
userid: userid
};
doAjax("POST","php/contenthandler.php?module=timetracking&command=getoverview",data,handleOverviewAnswer,null);
}
function handleOverviewAnswer(answer) {
if (answer.status == "OK") {
var txt = "";
2020-11-19 23:11:29 +01:00
txt += "<p><i><b><span class='timeline'>" + TIME_TOTAL_SUM[lang] + ": <u>";
2020-11-19 23:11:27 +01:00
if (answer.msg.totalduration.status == "OK") {
txt += minutesToHourMin(answer.msg.totalduration.minutes);
} else {
txt += TIME_NON_CALCULABLE[lang];
}
2020-11-19 23:11:29 +01:00
txt += "</u></i></span><b><p>";
2020-11-19 23:11:27 +01:00
answer.msg.times.forEach(function(aTimeEntry, index) {
var aDate = aTimeEntry.date;
var dayno = aTimeEntry.dayno;
var dayname = TIME_DAYNAMES[dayno-1][lang];
var timesofdate = aTimeEntry.timesofdate;
if (timesofdate.length > 0) {
txt += "<p><table class='infotable'>";
txt += "<tr><th colspan=2 class='heading'>" + aDate + " (" + dayname + ")</tr>";
timesofdate.forEach(function(aTime,index2) {
txt += "<tr>";
var id = aTime.id;
var actionid = aTime.action;
var thetime = aTime.thetime;
var timeparts = thetime.split(':');
thetime = timeparts[0] + ":" + timeparts[1];
var comment = toHtml(aTime.comment);
var actiontxt = TIME_COME[lang];
if (actionid == 2) {
actiontxt = TIME_GO[lang];
}
txt += "<td>" + thetime + " - " + actiontxt;
if (comment != '') {
txt += " (" + comment + ")";
}
if (maymanageusers == 1) {
txt += '<td><img src=img/delete.png class="deltimeentry" id="timeentry_' + id + '" />';
}
txt += "</tr>";
});
var workMinutesOfDay = aTimeEntry.workminutes;
if (workMinutesOfDay.status == "OK") {
txt += "<tr><td class='relevantdata' colspan=2>" + TIME_SUM[lang] + ": " + minutesToHourMin(workMinutesOfDay.minutes) + "</tr>";
} else {
txt += "<tr><td class='relevantdata' colspan=2>" + TIME_SUM[lang] + ": " + TIME_NON_CALCULABLE[lang] + "</tr>";
}
txt += "</table>";
}
});
$("#overviewtable").html(txt);
if (answer["allusertimes"] != undefined) {
txt = "<table class='infotable'>";
var allusers = answer.allusertimes;
allusers.forEach(function(aUserEntry,index) {
var username = aUserEntry.username;
var minutes = aUserEntry.minutes;
if (minutes != "-1") {
txt += "<tr><td>" + username + "<td>" + minutesToHourMin(minutes) + "</tr>";
} else {
txt += "<tr><td>" + username + "<td>" + TIME_NON_CALCULABLE[lang] + "</tr>";
}
});
txt += "</table>";
$("#allusersoverviewtable").html(txt);
};
bindUserSelection();
bindDelTimeEntry();
}
}
function bindDelTimeEntry() {
$(".deltimeentry").off("click").on("click", function (e) {
e.stopImmediatePropagation();
e.preventDefault();
var id = this.id.split("_")[1];
doAjax("POST","php/contenthandler.php?module=timetracking&command=delentry",{id:id},handleActionAnswer,null);
});
}
function clearNewEntryFields() {
$("#timenew").val("");
$("#commentnewentry").val("");
}
function minutesToHourMin(minutes) {
var hour = Math.floor(minutes/60);
var min = minutes % 60;
return hour + "h " + min + " min";
}
$(document).on("pageinit", "#time-page", function () {
initializeMainMenu("#modulemenu");
hideMenu();
$.ajaxSetup({ cache: false });
$("#time-page").data("date",new Date());
$("#comment").val("");
clearNewEntryFields();
getGeneralConfigItems();
bindComeGoBtns();
getAllowedOverviewUsers();
handleDateChangeEvents();
});
</script>
2020-11-19 23:11:29 +01:00
<div data-role="page" id="time-page" data-theme="c">
2020-11-19 23:11:27 +01:00
<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-theme="b" data-role="heading">Hauptmenü</li>
</ul>
</div><!-- /panel -->
2020-11-19 23:11:29 +01:00
<div data-role="header" data-theme="b" data-position="fixed" id="theheader" style="background-color:black;">
2020-11-19 23:14:48 +01:00
<h1><span id="timetitletxt">Zeiterfassung</span> <img src="img/connection.png" class="connectionstatus" style="display:none;" /> <img src="img/printerstatus.png" class="printerstatus" style="display:none;" /> <img src="img/tsestatus.png" class="tsestatus" style="display:none;" /> <img src="img/tasksstatus.png" class="tasksstatus" style="display:none;" /></h1>
2020-11-19 23:11:27 +01:00
<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"><span id="modulstxt2">Hauptmenü</span></a>
</div>
</div>
<div data-role="content" id="fullcontent">
<div data-role="collapsible" data-content-theme="c" data-collapsed="false" data-theme="e" id="useractions">
<H2><span id="useractionstitle">Aktionen</span></H2>
<p>
<input name="comment" id="comment" type="text" class="whiteinput" placeholder="Kommentar" />
<div class="ui-grid-a" >
<div class="ui-block-a"><button id="comebtn" type="submit" data-theme="f" class="actionsbtn" ><span class="comebtntxt">Kommen</span></button></div>
<div class="ui-block-b"><button id="gobtn" type="submit" data-theme="f" class="actionsbtn" ><span class="gobtntxt">Gehen</span></button></div>
</div>
</div> <!-- useractions -->
<div data-role="collapsible" data-content-theme="c" data-collapsed="false" data-theme="e" id="timeoverview">
<H2><span id="useroverview">Übersicht</span></H2>
<div id="userselpart"></div>
<div data-role="fieldcontain">
<label for="datepickerstart"><span id=datestarttxt>Datum S</span>: </label>
<input data-role="date" data-inline="true" type="text" id="datepickerstart" data-theme="d" class="overviewdatepicker">
</div>
<div data-role="fieldcontain">
<label for="datepickerend"><span id=dateendtxt>Datum E</span>: </label>
<input data-role="date" data-inline="true" type="text" id="datepickerend" data-theme="d" class="overviewdatepicker">
</div>
<p><div class="roundedborderarea">
2020-11-19 23:11:29 +01:00
<h2><span id="listofentriestxt" class="timeline">Liste</span> <span id="selectedusername" class="timeline"></span></h2>
2020-11-19 23:11:27 +01:00
<div id="overviewtable"></div>
</div>
<p><div id="newentrypart" style="display:none;" class="roundedborderarea">
2020-11-19 23:11:29 +01:00
<h2><span id="newentrytxt" class="timeline">Neueintrag</span></h2>
2020-11-19 23:11:27 +01:00
<div data-role="fieldcontain" >
2020-11-19 23:11:29 +01:00
<label for="datepickernew"><span id=datetxt class="timeline">Datum </span>: </label>
2020-11-19 23:11:27 +01:00
<input data-role="date" data-inline="true" type="text" id="datepickernew" data-theme="d" >
</div>
<div data-role="fieldcontain" >
2020-11-19 23:11:29 +01:00
<label for="timenew"><span id=timetxt class="timeline">Uhrzeit</span>: </label>
2020-11-19 23:11:27 +01:00
<input type="text" id="timenew" name="timenew" class="whiteinput" placeholder="hh:mm" >
</div>
<input name="commentnewentry" id="commentnewentry" type="text" class="whiteinput" placeholder="Kommentar" />
<div class="ui-grid-a" >
<div class="ui-block-a"><button id="newcomebtn" type="submit" data-theme="f" class="newactionsbtn" ><span class="comebtntxt">Kommen</span></button></div>
<div class="ui-block-b"><button id="newgobtn" type="submit" data-theme="f" class="newactionsbtn" ><span class="gobtntxt">Gehen</span></button></div>
</div>
</div> <!-- newentrypart -->
<p><div id="listofalluserspart" class="roundedborderarea" style="display:none;">
2020-11-19 23:11:29 +01:00
<h2><span id="listofalluserstimestxt" class="timeline">Liste</span></h2>
2020-11-19 23:11:27 +01:00
<div id="allusersoverviewtable"></div>
</div>
</div> <!-- time overview -->
<br>
</div>
2020-11-19 23:11:29 +01:00
<div data-role="footer" data-theme="b" id="thefooterr" style="background-color:black;">
2020-11-19 23:11:27 +01:00
<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> <!-- first page -->
</body>
</html>