/* Copyright (c) 2018 [Glacies UG, Berlin, Germany] (http://glacies.de) Developer: Thilina Hasantha (http://lk.linkedin.com/in/thilinah | https://github.com/thilinah) */ /* global nv, d3 */ import BaseGraphAdapter from '../../../api/BaseGraphAdapter'; /* * AttendanceGraphAdapter */ class AttendanceGraphAdapter extends BaseGraphAdapter { getFormFields() { return []; } getFilters() { return [ ['employee', { label: 'Employee', type: 'select2', 'allow-null': true, 'null-label': 'All Employees', 'remote-source': ['Employee', 'id', 'first_name+last_name'], }], ['start', { label: 'Start Date', type: 'date', validation: '' }], ['end', { label: 'End Date', type: 'date', validation: '' }], ]; } get() { this.initFieldMasterData(); this.getTimeUtilization(); } doCustomFilterValidation(params) { const $errorElement = $(`#${this.table}_filter_error`); $errorElement.html(''); $errorElement.hide(); if (Date.parse(params.start).getTime() > Date.parse(params.end).getTime()) { $errorElement.html('End date should be a later date than start date'); $errorElement.show(); return false; } const dateDiff = (Date.parse(params.end).getTime() - Date.parse(params.start).getTime()) / (1000 * 60 * 60 * 24); if (dateDiff > 45 && (params.employee === undefined || params.employee == null || params.employee === 'NULL')) { $errorElement.html('Differance between start and end dates should not be more than 45 days, when creating chart for all employees'); $errorElement.show(); return false; } if (dateDiff > 90) { $errorElement.html('Differance between start and end dates should not be more than 90 days'); $errorElement.show(); return false; } return true; } getTimeUtilization(object, callBackData) { object = {}; if (this.filter != null && this.filter !== undefined) { if (this.filter.employee !== 'NULL') { object.employee = this.filter.employee; } object.start = this.filter.start; object.end = this.filter.end; } const reqJson = JSON.stringify(object); callBackData = (callBackData === undefined || callBackData === null) ? [] : callBackData; callBackData.callBackData = []; callBackData.callBackSuccess = 'getAttendanceSuccessCallBack'; callBackData.callBackFail = 'getAttendanceFailCallBack'; this.customAction('getAttendance', 'admin=charts', reqJson, callBackData); } getAttendanceFailCallBack(callBackData) { this.showMessage('Error Occured while getting data for chart', callBackData); } getAttendanceSuccessCallBack(callBackData) { const that = this; const filterHtml = that.getTableTopButtonHtml(); $('#tabPageAttendanceGraph svg').remove(); $('#tabPageAttendanceGraph div').remove(); const $tabPageAttendanceGraph = $('#tabPageAttendanceGraph'); $tabPageAttendanceGraph.html(''); $tabPageAttendanceGraph.html(`${filterHtml}`); nv.addGraph(() => { const chart = nv.models.multiBarChart() .margin({ bottom: 200 }) .transitionDuration(0) .reduceXTicks(true) // If 'false', every single x-axis tick label will be rendered. .rotateLabels(45) // Angle to rotate x-axis labels. .showControls(false) // Allow user to switch between 'Grouped' and 'Stacked' mode. .groupSpacing(0.1); // Distance between each group of bars. chart.yAxis .tickFormat(d3.format(',.1f')); chart.dispatch.on('stateChange', (e) => { nv.log('New State:', JSON.stringify(e)); }); chart.tooltip((key, x, y, e, graph) => `
${key}
` + `${y} on ${x}
`); d3.select('#tabPageAttendanceGraph svg') .datum(callBackData) .call(chart); return chart; }); } getHelpLink() { return 'https://icehrm.gitbook.io/icehrm/insights/analytics'; } } /* * TimeUtilizationGraphAdapter */ class TimeUtilizationGraphAdapter extends BaseGraphAdapter { getFormFields() { return []; } getFilters() { return [ ['employee', { label: 'Employee', type: 'select2', 'allow-null': true, 'null-label': 'All Employees', 'remote-source': ['Employee', 'id', 'first_name+last_name'], }], ['start', { label: 'Start Date', type: 'date', validation: '' }], ['end', { label: 'End Date', type: 'date', validation: '' }], ]; } get() { this.initFieldMasterData(); this.getTimeUtilization(); } doCustomFilterValidation(params) { const $errorElement = $(`#${this.table}_filter_error`); $errorElement.html(''); $errorElement.hide(); if (Date.parse(params.start).getTime() > Date.parse(params.end).getTime()) { $errorElement.html('End date should be a later date than start date'); $errorElement.show(); return false; } const dateDiff = (Date.parse(params.end).getTime() - Date.parse(params.start).getTime()) / (1000 * 60 * 60 * 24); if (dateDiff > 45 && (params.employee === undefined || params.employee == null || params.employee === 'NULL')) { $errorElement.html('Differance between start and end dates should not be more than 45 days, when creating chart for all employees'); $errorElement.show(); return false; } if (dateDiff > 90) { $errorElement.html('Differance between start and end dates should not be more than 90 days'); $errorElement.show(); return false; } return true; } getTimeUtilization(object, callBackData) { object = {}; if (this.filter != null && this.filter !== undefined) { if (this.filter.employee !== 'NULL') { object.employee = this.filter.employee; } object.start = this.filter.start; object.end = this.filter.end; } const reqJson = JSON.stringify(object); callBackData = (callBackData === undefined || callBackData === null) ? [] : callBackData; callBackData.callBackData = []; callBackData.callBackSuccess = 'getTimeUtilizationSuccessCallBack'; callBackData.callBackFail = 'getTimeUtilizationFailCallBack'; this.customAction('getTimeUtilization', 'admin=charts', reqJson, callBackData); } getTimeUtilizationFailCallBack(callBackData) { this.showMessage('Error Occured while getting data for chart', callBackData); } getTimeUtilizationSuccessCallBack(callBackData) { const that = this; const filterHtml = that.getTableTopButtonHtml(); $('#tabPageTimeUtilizationGraph svg').remove(); $('#tabPageTimeUtilizationGraph div').remove(); const $tabPageTimeUtilizationGraph = $('#tabPageTimeUtilizationGraph'); $tabPageTimeUtilizationGraph.html(''); $tabPageTimeUtilizationGraph.html(`${filterHtml}`); nv.addGraph(() => { const chart = nv.models.multiBarChart() .margin({ bottom: 200 }) .transitionDuration(0) .reduceXTicks(true) // If 'false', every single x-axis tick label will be rendered. .rotateLabels(45) // Angle to rotate x-axis labels. .showControls(true) // Allow user to switch between 'Grouped' and 'Stacked' mode. .groupSpacing(0.1); // Distance between each group of bars. chart.yAxis .tickFormat(d3.format(',.1f')); d3.select('#tabPageTimeUtilizationGraph svg') .datum(callBackData) .call(chart); chart.dispatch.on('stateChange', (e) => { nv.log('New State:', JSON.stringify(e)); }); chart.tooltip((key, x, y, e, graph) => `${key}
` + `${y} on ${x}
`); return chart; }); } getHelpLink() { return 'https://icehrm.gitbook.io/icehrm/insights/analytics'; } } module.exports = { AttendanceGraphAdapter, TimeUtilizationGraphAdapter };