chris.watts90@outlook.com
20bf968675
fixed pagination where it wasnt rounding up so <x.5 would show not 1 page less than required. fix issue introduced in last branch where group drop down/filter wouldnt work. #51
592 lines
23 KiB
JavaScript
592 lines
23 KiB
JavaScript
const SortOptions = {
|
|
LastAsc: "LastNameAscending",
|
|
LastDesc: "LastNameDescending",
|
|
FirstAsc: "FirstNameAscending",
|
|
FirstDesc: "FirstNameDescending"
|
|
};
|
|
function DataVM() {
|
|
"use strict";
|
|
var self = this;
|
|
self.helpers = new Helpers();
|
|
self.menuOptions = ["Home", "Policy"];
|
|
self.possibleLogDirections = ko.observableArray([
|
|
{ Text: "In", value: 1 },
|
|
{ Text: "Out", value: 2 }
|
|
]),
|
|
self.chosenMenuItemId = ko.observable();
|
|
self.appDetails = ko.observable(null);
|
|
self.userList = ko.observable(null);
|
|
self.groupsList = ko.observable(null);
|
|
self.chosenUserDetails = ko.observable(null);
|
|
self.userTimeLogData = ko.observable(null);
|
|
self.unassignedCardData = ko.observable(null);
|
|
self.chosenTimeLogUserId = -1;
|
|
self.selectedTimeLogDate = ko.observable(null);
|
|
self.selectedCalendarWeek = ko.observable(0);
|
|
self.errorData = ko.observable(null);
|
|
self.manualLog = ko.observable(null);
|
|
self.policyData = ko.observable(null);
|
|
self.policyChangeDate = ko.observable(null);
|
|
self.policyChangeAuthor = ko.observable(null);
|
|
self.policyVersion = ko.observable(null);
|
|
self.selectedSort = ko.observable(null);
|
|
self.apiEndpoints = {
|
|
root: "http://localhost:8800",
|
|
getUserList: "/api/users",
|
|
getUserDetails: "/api/users",
|
|
editUser: "/api/users/edit",
|
|
getTimeLogs: "/api/timelogs",
|
|
getUnassignedCards: "/api/cards/unassigned",
|
|
getGroups: "/api/groups",
|
|
getAppDetails: "/api/app",
|
|
manualLogsCreate: "/api/logs/create",
|
|
manualLogsDelete: "/api/logs/delete",
|
|
getPolicy: "/api/app/policy"
|
|
};
|
|
self.uiPages = {
|
|
users: "users",
|
|
userDetails: "userData",
|
|
timeLogs: "timelogs",
|
|
home: function () { return this.users; }
|
|
};
|
|
self.goToMenuOption = function (menu) { location.hash = menu; console.log("goToMenuOption: " + menu); };
|
|
self.goToUserDetails = function (user) { location.hash = self.uiPages.userDetails + "/" + user.UserId; };
|
|
self.goToTimeLogs = function (user, data, args) {
|
|
var userId;
|
|
if (user.UserId) {
|
|
userId = user.UserId;
|
|
} else {
|
|
userId = user;
|
|
}
|
|
var url = "timelogs" + "/" + userId;
|
|
if (args) {
|
|
url = self.helpers.createRequestUrl(url, args, false, false);
|
|
}
|
|
location.hash = url;
|
|
};
|
|
self.goToToday = function() {
|
|
self.goToTimeLogs(self.chosenTimeLogUserId,
|
|
null,
|
|
null);
|
|
};
|
|
self.assignErrorObject = function(errCode, errMessage, errorSource) {
|
|
var errDat = {
|
|
errorCode: errCode,
|
|
errorMessage: errMessage,
|
|
errorSource: errorSource,
|
|
errorDate: new Date().toDateString("yyyy-mm-dd")
|
|
};
|
|
self.errorData(errDat);
|
|
}
|
|
self.returnButtonClick = function (data, event) {
|
|
var destination = self.helpers.getPageDestination(data, event);
|
|
if (destination !== "") {
|
|
self.goToMenuOption(destination); //redirect to whereever the button is telling us to go..
|
|
}
|
|
};
|
|
self.convertToHours = function (value) {
|
|
var hrs = value / 60;
|
|
if (hrs < 1) {
|
|
return value + " mins";
|
|
}
|
|
var h = Math.floor(hrs);
|
|
var m = Math.floor((hrs % 1) * 60);
|
|
return h + " hrs " + m + " minutes";
|
|
};
|
|
self.convertToDisplayTime = function (dateValue) {
|
|
var date = new Date(dateValue);
|
|
return date.getHours() + ":" + self.padNumber(date.getMinutes());
|
|
};
|
|
self.correctLogOffset = function(logCount) {
|
|
if (logCount % 2 !== 0) {
|
|
logCount += 1;
|
|
}
|
|
return logCount;
|
|
};
|
|
self.round = function(value, decimals) {
|
|
return parseFloat(Math.round(value * 100) / 100).toFixed(decimals);
|
|
};
|
|
self.getTimeLogEntryArrayLength = function(maxDailyLogs) {
|
|
return Math.round(maxDailyLogs/2);
|
|
};
|
|
self.padNumber = function(number) {
|
|
return (number < 10 ? "0" : "") + number;
|
|
};
|
|
self.convertToDisplayDateTime = function (dateValue) {
|
|
var date = new Date(dateValue); // dd MM YY HH:mm:ss e.g.: 01 Mar 17 17:34:02
|
|
return date.getDate() + " "
|
|
+ date.toLocaleString("en-us", { month: "long" }) + " "
|
|
+ (date.getYear()-100) + " "
|
|
+ self.padNumber(date.getHours()) + ":"
|
|
+ self.padNumber(date.getMinutes()) + ":"
|
|
+ self.padNumber(date.getSeconds());
|
|
};
|
|
self.dismissAlert = function(data, event) {
|
|
self.errorData(null);
|
|
};
|
|
self.setPageSize = function(data) {
|
|
if (self.userList().PageSize !== data && self.userList().PageSize !== -1) {
|
|
self.setPagination(data, 1);
|
|
}
|
|
};
|
|
self.goToUserPage = function (data) {
|
|
if (self.userList().PageNumber !== data && self.userList().PageNumber !== -1) {
|
|
self.setPagination(self.userList().PageSize, data);
|
|
}
|
|
};
|
|
self.getCurrentGroupFilter = function() {
|
|
if (self.userList() !== null) {
|
|
if (self.userList().GroupFilter !== null) {
|
|
return self.userList().GroupFilter.Name;
|
|
}
|
|
}
|
|
return "";
|
|
};
|
|
self.clearGroupFilter = function () {
|
|
self.setPagination(20, 1);
|
|
};
|
|
self.hasGroupFilter = function() {
|
|
if(self.userList() !== null)
|
|
if (self.userList().GroupFilter)
|
|
return true;
|
|
return false;
|
|
};
|
|
self.hasQuery = function() {
|
|
if (self.userList() !== null) {
|
|
if (self.userList().Query && self.userList().Query !== "")
|
|
return true;
|
|
}
|
|
return false;
|
|
};
|
|
self.groupFilter = function(data) {
|
|
console.log("filter by group: " + data);
|
|
var args = [
|
|
{
|
|
key: "groupId",
|
|
value: data
|
|
}
|
|
];
|
|
var url = self.helpers.createRequestUrl("users", args, false, false);
|
|
location.hash = url;
|
|
console.log(url);
|
|
};
|
|
self.setPagination = function(pageSize, pageNumber) {
|
|
var args = [
|
|
{
|
|
key: "pageSize",
|
|
value: pageSize
|
|
},
|
|
{
|
|
key: "pageNumber",
|
|
value: pageNumber
|
|
}
|
|
];
|
|
var url = self.helpers.createRequestUrl("users", args, false, false);
|
|
location.hash = url;
|
|
console.log(url);
|
|
};
|
|
self.initDatePicker = function (selectedDate) {
|
|
if (!selectedDate) {
|
|
selectedDate = new Date();
|
|
} else {
|
|
selectedDate = new Date(selectedDate);
|
|
}
|
|
moment.locale("en", { week: { dow: 1 } });
|
|
$("#weeklyDatePicker").datetimepicker({
|
|
//showTodayButton: true,
|
|
format: "DD/MM/YYYY",
|
|
inline: true,
|
|
calendarWeeks: true,
|
|
maxDate: "now",
|
|
date: selectedDate
|
|
});
|
|
};
|
|
self.assignHandler = function() {
|
|
var elem = $("#weeklyDatePicker")[0];
|
|
var data = jQuery.hasData(elem) && jQuery._data(elem);
|
|
if (!data.events) {
|
|
$("#weeklyDatePicker")
|
|
.on("dp.change",
|
|
function(e) {
|
|
var value = e.date;
|
|
self.selectedCalendarWeek(moment(value).isoWeek());
|
|
self.goToTimeLogs(self.chosenTimeLogUserId,
|
|
null,
|
|
[{ key: "selectedDate", value: moment(value).format("MM-DD-YYYY") }]);
|
|
});
|
|
}
|
|
};
|
|
self.assignUpdateHandler = function() {
|
|
var elem = $("#datetimepicker1")[0];
|
|
var data = jQuery.hasData(elem) && jQuery._data(elem);
|
|
if (!data.events) {
|
|
$("#datetimepicker1")
|
|
.on("dp.change",
|
|
function(e) {
|
|
var value = e.date.toISOString();
|
|
self.manualLog().EventTime = value;
|
|
});
|
|
}
|
|
};
|
|
self.getUserList = function (pageSize, pageNumber, groupId, sort) {
|
|
var args = [];
|
|
if (pageSize && pageNumber) {
|
|
args.push(
|
|
{
|
|
key: "pageSize",
|
|
value: pageSize
|
|
});
|
|
args.push(
|
|
{
|
|
key: "pageNumber",
|
|
value: pageNumber
|
|
});
|
|
}
|
|
if (groupId) {
|
|
args.push(
|
|
{
|
|
key: "groupId",
|
|
value: groupId
|
|
});
|
|
}
|
|
if (sort) {
|
|
args.push({
|
|
key: "sort",
|
|
value: sort
|
|
});
|
|
}
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getUserList, args, false);
|
|
$.getJSON(url, function (res) {
|
|
self.userList(res);
|
|
$('[data-toggle="tooltip"]').tooltip();
|
|
}).fail(function (response, status, error) {
|
|
console.log("error - getusers");
|
|
var errObj = self.helpers.processRequestFailure(response, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "getUserList");
|
|
});
|
|
};
|
|
self.getAppDetails = function() {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getAppDetails, null, false, false);
|
|
$.getJSON(url, function (res) {
|
|
self.appDetails(res);
|
|
}).fail(function (response, status, error) {
|
|
console.log("error - getusers");
|
|
var errObj = self.helpers.processRequestFailure(response, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "getUserList");
|
|
});
|
|
};
|
|
self.searchUsers = function(query, sort) {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getUserList,
|
|
[{ key: "query", value: query }, {key:"sort",value:sort}], false, false);
|
|
$.getJSON(url,
|
|
function(res) {
|
|
self.userList(res);
|
|
}).fail(function(resp, status, error) {
|
|
self.goToMenuOption(self.uiPages.home());
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "searchUsers");
|
|
}
|
|
);
|
|
};
|
|
self.getUserDetails = function (userId) {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getUserDetails + "/" + userId, null, false);
|
|
$.getJSON(url, function (res) {
|
|
self.chosenUserDetails(res);
|
|
}).fail(function (resp, status, error) {
|
|
console.log("error - getuserdetails");
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "getUserDetails");
|
|
self.goToMenuOption(self.uiPages.home());
|
|
});
|
|
};
|
|
self.submitChangedUser = function (user) {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.editUser, null, false, false);
|
|
$.post(url, user, function () {
|
|
}, "json")
|
|
.done(function () {
|
|
self.chosenUserDetails(null);
|
|
self.goToMenuOption(self.uiPages.home());
|
|
})
|
|
.fail(function (resp, status, error) {
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "submitChangedUser");
|
|
self.chosenUserDetails(null);
|
|
self.goToMenuOption(self.uiPages.home());
|
|
});
|
|
};
|
|
self.getTimeLogData = function (userId, selectedDate) {
|
|
var urlArgs = [{ key: "userId", value: userId }];
|
|
if (selectedDate) {
|
|
urlArgs.push({ key: "selectedDate", value: selectedDate });
|
|
}
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getTimeLogs,
|
|
urlArgs,
|
|
false);
|
|
$.getJSON(url, function (res) {
|
|
self.userTimeLogData(res);
|
|
self.initDatePicker(res.SelectedDate);
|
|
self.assignHandler();
|
|
}).fail(function (resp, status, error) {
|
|
console.log("error - getuserdetails");
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "getTimeLogData");
|
|
self.goToMenuOption(self.uiPages.home()); //go home.
|
|
});
|
|
};
|
|
self.getUnassignedCardData = function () {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getUnassignedCards, null, false);
|
|
$.getJSON(url, function (res) {
|
|
self.unassignedCardData(res);
|
|
}).fail(function (resp, status, error) {
|
|
console.log("error - getuserdetails");
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "getUnassignedCardData");
|
|
});
|
|
};
|
|
self.getGroups = function (successFunc) {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getGroups, null, false);
|
|
return $.getJSON(url, function (res) {
|
|
successFunc(res);
|
|
//self.chosenUserDetails().Groups = res;
|
|
//self.chosenUserDetails.valueHasMutated();
|
|
}).fail(function (resp, status, error) {
|
|
console.log("error - getGroups");
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "getGroups");
|
|
});
|
|
};
|
|
self.getPolicyData = function () {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.getPolicy, null, false);
|
|
$.getJSON(url, function (res) {
|
|
console.log(res);
|
|
self.policyData(res);
|
|
}).fail(function (resp, status, error) {
|
|
console.log("error - getPolicyData");
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "getPolicyData");
|
|
});
|
|
|
|
};
|
|
self.createManualLog = function(newLog) {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.manualLogsCreate, null, false, false);
|
|
$.post(url, newLog, function () {
|
|
}, "json")
|
|
.done(function () {
|
|
self.manualLog(null);
|
|
$("#manualLogDialog").modal("hide");
|
|
location.reload(); //stay on this users logs page, but just reload the timelogs.
|
|
})
|
|
.fail(function (resp, status, error) {
|
|
var errObj = self.helpers.processRequestFailure(resp, status, error);
|
|
self.assignErrorObject(errObj.errorCode, errObj.errorMessage, "createManualLog");
|
|
self.chosenUserDetails(null);
|
|
self.goToMenuOption(self.uiPages.home());
|
|
});
|
|
};
|
|
self.deleteManualLog = function (logToDelete) {
|
|
var url = self.helpers.createRequestUrl(self.apiEndpoints.manualLogsDelete, null, false, false);
|
|
$.ajax({
|
|
url: url,
|
|
type: "DELETE",
|
|
data: logToDelete,
|
|
success: function (result) {
|
|
console.log("successfully deleted .." + result);
|
|
location.reload(); //stay on this page but just reload the timelogs.
|
|
}
|
|
});
|
|
};
|
|
self.createContextMenu = ko.observableArray([
|
|
{ text: "Create", action: createlog }
|
|
]);
|
|
self.editContextMenu = ko.observableArray([
|
|
{ text: "Create", action: createlog },
|
|
{ text: "Edit", action: editlog },
|
|
{ text: "Delete", action: deleteLog }
|
|
]);
|
|
function editlog (data) {
|
|
self.manualLog(data);
|
|
$("#manualLogDialog").modal("show");
|
|
self.initialiseManualLogDateTimePicker(data.EventTime);
|
|
self.assignUpdateHandler();
|
|
};
|
|
function createlog(data, event) {
|
|
var logDateInitVal = moment(self.selectedTimeLogDate()).add((data.Day - 1), 'days').toISOString();
|
|
self.manualLog({
|
|
CalendarWeek:-1,
|
|
Direction:-1,
|
|
EventTime: logDateInitVal,
|
|
Id: -1,
|
|
IdentifierId: -1,
|
|
UserId: self.chosenTimeLogUserId,
|
|
Year: 0
|
|
});
|
|
$('#manualLogDialog').modal("show");
|
|
self.initialiseManualLogDateTimePicker(logDateInitVal);
|
|
self.assignUpdateHandler();
|
|
};
|
|
function deleteLog(data) {
|
|
if (confirm("Are you sure you want to delete this log?")) {
|
|
self.deleteManualLog(data);
|
|
}
|
|
};
|
|
self.initialiseManualLogDateTimePicker = function (date) {
|
|
$('#datetimepicker1')
|
|
.datetimepicker({
|
|
format: "YYYY-DD-MM HH:mm:ss",
|
|
date: new Date(date),
|
|
inline:true,
|
|
sideBySide:true,
|
|
minDate: moment(date).startOf("week"),
|
|
maxDate: moment(date).endOf("week")
|
|
});
|
|
};
|
|
function convertSortOption(opt) {
|
|
if (!opt) {
|
|
return SortOptions.LastAsc;
|
|
}
|
|
if (opt === "firstAsc") {
|
|
return SortOptions.FirstAsc;
|
|
}
|
|
if (opt === "firstDesc") {
|
|
return SortOptions.FirstDesc;
|
|
}
|
|
if (opt === "lastAsc") {
|
|
return SortOptions.LastAsc;
|
|
}
|
|
if (opt === "lastDesc") {
|
|
return SortOptions.LastDesc;
|
|
}
|
|
};
|
|
self.sortIsActive = function (option) {
|
|
if (option === "firstAsc" && self.userList().SelectedSortOption === SortOptions.FirstAsc) {
|
|
return true;
|
|
}
|
|
if (option === "firstDesc" && self.selectedSort() === SortOptions.FirstDesc) {
|
|
return true;
|
|
}
|
|
if (option === "lastAsc" && self.selectedSort() === SortOptions.LastAsc) {
|
|
return true;
|
|
}
|
|
if (option === "lastDesc" && self.selectedSort() === SortOptions.LastDesc) {
|
|
return true;
|
|
}
|
|
return false;
|
|
};
|
|
Sammy(function () {
|
|
this.get("#users", function () {
|
|
var query = this.params.query;
|
|
var pageSize = this.params.pageSize;
|
|
var pageNumber = this.params.pageNumber;
|
|
var groupId = this.params.groupId;
|
|
var sort = convertSortOption(this.params.sort);
|
|
console.log(sort);
|
|
self.chosenMenuItemId("Home");
|
|
self.groupsList(null);
|
|
self.chosenUserDetails(null);
|
|
self.userList(null);
|
|
self.userTimeLogData(null);
|
|
self.policyData(null);
|
|
self.manualLog(null);
|
|
if (self.appDetails() === null) {
|
|
self.getAppDetails();
|
|
}
|
|
self.getGroups(function (data) { self.groupsList(data); });
|
|
if (query)
|
|
self.searchUsers(query, sort);
|
|
else if (groupId && groupId > 0)
|
|
self.getUserList(null, null, groupId, sort);
|
|
else
|
|
self.getUserList(pageSize, pageNumber, null,sort);
|
|
});
|
|
this.get("#userData/:userId", function () {
|
|
self.chosenMenuItemId("Data");
|
|
self.groupsList(null);
|
|
self.chosenUserDetails(null);
|
|
self.userList(null);
|
|
self.userTimeLogData(null);
|
|
self.policyData(null);
|
|
self.manualLog(null);
|
|
self.getUserDetails(this.params.userId);
|
|
self.getUnassignedCardData();
|
|
});
|
|
this.get("#timelogs/:userId", function () {
|
|
if (this.params.selectedDate) {
|
|
self.selectedTimeLogDate(this.params.selectedDate);
|
|
} else {
|
|
self.selectedTimeLogDate(new Date());
|
|
}
|
|
self.chosenTimeLogUserId = this.params.userId;
|
|
self.chosenMenuItemId("Other");
|
|
self.groupsList(null);
|
|
self.chosenUserDetails(null);
|
|
self.userList(null);
|
|
self.userTimeLogData(null);
|
|
self.manualLog(null);
|
|
self.policyData(null);
|
|
self.getTimeLogData(this.params.userId, self.selectedTimeLogDate());
|
|
});
|
|
this.get("#newUser", function () {
|
|
self.chosenMenuItemId("newUser");
|
|
self.userList(null);
|
|
self.userTimeLogData(null);
|
|
self.policyData(null);
|
|
self.chosenUserDetails({
|
|
"UserId": -1,
|
|
"FirstName": null,
|
|
"LastName": null,
|
|
"HoursPerWeek": null,
|
|
"AssociatedIdentifiers": [],
|
|
"Groups": [],
|
|
"IsContractor": false
|
|
});
|
|
self.getGroups(function(data) {
|
|
self.chosenUserDetails().Groups = data.Groups;
|
|
self.chosenUserDetails.valueHasMutated();
|
|
});
|
|
self.getUnassignedCardData();
|
|
});
|
|
this.get("#stats", function () {
|
|
self.goToMenuOption("users");
|
|
});
|
|
this.get("#Policy",
|
|
function () {
|
|
self.groupsList(null);
|
|
self.chosenUserDetails(null);
|
|
self.userList(null);
|
|
self.userTimeLogData(null);
|
|
self.manualLog(null);
|
|
|
|
self.getPolicyData();
|
|
});
|
|
this.post("#edituser", function () {
|
|
$.each(self.chosenUserDetails().AssociatedIdentifiers,
|
|
function (k, v) {
|
|
if (v.IsAssociatedToUser !== true) {
|
|
self.chosenUserDetails().AssociatedIdentifiers.splice(k, 1);
|
|
}
|
|
});
|
|
$.each(self.unassignedCardData().data, function (k, v) {
|
|
if (v.IsAssociatedToUser === true) {
|
|
self.chosenUserDetails().AssociatedIdentifiers.push(v);
|
|
}
|
|
});
|
|
self.submitChangedUser(self.chosenUserDetails());
|
|
return false;
|
|
});
|
|
this.post("#manualLog",
|
|
function() {
|
|
self.createManualLog(self.manualLog());
|
|
$('#manualLogDialog').modal("hide");
|
|
//self.goToTimeLogs(self.chosenTimeLogUserId, null, [{ key: "selectedDate", value: self.selectedTimeLogDate() }]);
|
|
});
|
|
//default route (home page)
|
|
this.get("", function () { this.app.runRoute("get", "#" + self.uiPages.home()) });
|
|
}).run();
|
|
};
|
|
ko.applyBindings(new DataVM());
|
|
//$(document).on("mouseenter", ".datepicker-days tbody tr", function () {
|
|
// $(this).addClass("highlight");
|
|
//});
|
|
//$(document).on("mouseleave", ".datepicker-days tbody tr", function () {
|
|
// $(this).removeClass("highlight");
|
|
//});
|