From 5030f0b1ed28d70d9fcb023e868904e03ccfa256 Mon Sep 17 00:00:00 2001 From: Cris Date: Wed, 16 Oct 2019 08:53:37 +0200 Subject: [PATCH] Major addition of tabulator functionality methods III / Enhanced code MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit III: Same as for orderLehrauftrag is here adapted to acceptLehrauftrag: . MOVED out function from datasetRepFieldDefs to javascript for better   maintainance . Added status column and status icons with tooltips . Added status buttons to filter status rapidly . Rows formatting enhanced and bootstrapped . day of date now with 2 digits --- .../lehre/lehrauftrag/acceptLehrauftrag.php | 230 +++++++++++++++++- .../lehrauftrag/acceptLehrauftragData.php | 53 ++-- 2 files changed, 240 insertions(+), 43 deletions(-) diff --git a/application/views/lehre/lehrauftrag/acceptLehrauftrag.php b/application/views/lehre/lehrauftrag/acceptLehrauftrag.php index 65238556a..9aada9786 100644 --- a/application/views/lehre/lehrauftrag/acceptLehrauftrag.php +++ b/application/views/lehre/lehrauftrag/acceptLehrauftrag.php @@ -68,8 +68,10 @@ $this->load->view(
- - + + + +
@@ -94,6 +96,7 @@ $this->load->view( // Global vars // ----------------------------------------------------------------------------------------------------------------- + const COLOR_LIGHTGREY = "#f5f5f5"; // Store boolean has_inkludierteLehre. If true, used to hide column Betrag. var has_inkludierteLehre = new Boolean().valueOf(); @@ -107,10 +110,21 @@ $this->load->view( if (value != null) { var d = new Date(value); - return d.getDate() + "." + ("0"+(d.getMonth()+1)).slice(-2) + "." + d.getFullYear(); + return ("0" + (d.getDate())).slice(-2) + "." + ("0"+(d.getMonth()+1)).slice(-2) + "." + d.getFullYear(); } } + + Major addition of tabulator functionality methods III / Enhanced code + + III: Same as for orderLehrauftrag is here adapted to acceptLehrauftrag: + + . MOVED out function from datasetRepFieldDefs to javascript for better + maintainance + . Added status column and status icons with tooltips + . Added status buttons to filter status rapidly + . Rows formatting enhanced and bootstrapped + . day of date now with 2 digits // ----------------------------------------------------------------------------------------------------------------- // Header filter // ----------------------------------------------------------------------------------------------------------------- @@ -126,11 +140,193 @@ $this->load->view( return parseFloat(headerValue) <= parseFloat(rowValue); //must return a boolean, true if it passes the filter. } -$(function() { + // ----------------------------------------------------------------------------------------------------------------- + // Tabulator table format functions + // ----------------------------------------------------------------------------------------------------------------- + + // Formats the rows + function func_rowFormatter(row){ + var bestellt = row.getData().bestellt; + var betrag = parseFloat(row.getData().betrag); + var vertrag_betrag = parseFloat(row.getData().vertrag_betrag); + + /* + Formats the color of the rows depending on their status + - orange: geaendert + - default: bestellte und erteilte (= zu akzeptierende) + - green: akzeptierte + - grey: all other (marks unselectable) + */ + row.getCells().forEach(function(cell){ + if (bestellt != null && (betrag != vertrag_betrag)) + { + row._row.getElement().style['font-weight'] = 'bold'; // geaendert + } + else if(row.getData().bestellt != null && row.getData().erteilt != null && row.getData().akzeptiert == null) + { + return; // bestellte + erteilte + } + else if(row.getData().bestellt != null && row.getData().erteilt != null && row.getData().akzeptiert != null) + { + cell.getElement().classList.add('bg-success') // akzeptierte + } + else + { + row.getElement().style["background-color"] = COLOR_LIGHTGREY; // default + } + }); + } + + // Formats row selectable/unselectable + function func_selectableCheck(row){ + var betrag = parseFloat(row.getData().betrag); + var vertrag_betrag = parseFloat(row.getData().vertrag_betrag); + + // only allow to select bestellte && erteilte && nicht geaenderte Lehraufträge + return row.getData().bestellt != null && // bestellt + row.getData().erteilt != null && // AND erteilt + row.getData().akzeptiert == null && // AND nicht akzeptiert + betrag == vertrag_betrag; // OR nicht geaenderte + } + + // Adds column status + function func_tableBuilt(table) { + // Add status column to table + table.addColumn( + { + title: "Status", + field: "status", + width:40, + align:"center", + formatter: status_formatter, + tooltip: status_tooltip + }, true + ); + } + + // Sets status values into column status + function func_renderStarted(table){ + // Set literally status to each row - this enables sorting by status despite using icons + table.getRows().forEach(function(row){ + var bestellt = row.getData().bestellt; + var erteilt = row.getData().erteilt; + var akzeptiert = row.getData().akzeptiert; + + var betrag = parseFloat(row.getData().betrag); + var vertrag_betrag = parseFloat(row.getData().vertrag_betrag); + + if (bestellt != null && (betrag != vertrag_betrag)) + { + row.getData().status = 'Geändert'; // geaendert + } + else if (bestellt == null && erteilt == null && akzeptiert == null) + { + row.getData().status = 'Neu'; // neu + } + else if (bestellt != null && erteilt == null && akzeptiert == null) + { + row.getData().status = 'Bestellt'; // bestellt + } + else if (bestellt != null && erteilt != null && akzeptiert == null) + { + row.getData().status = 'Erteilt'; // erteilt + } + else if (bestellt != null && erteilt != null && akzeptiert != null) + { + row.getData().status = 'Akzeptiert'; // akzeptiert + } + else + { + row.getData().status = null; // default + } + }); + } + + // Performes after row was updated + function func_rowUpdated(row){ + // Deselect and disable new selection of updated rows (ordering done) + row.deselect(); + row.getElement().style["background-color"] = COLOR_LIGHTGREY; + row.getElement().style["pointerEvents"] = "none"; + } + + // Hide betrag, if lector has inkludierte Lehre + function func_renderComplete(table){ + // If the lectors actual Verwendung has inkludierte Lehre, hide the column betrag + if (has_inkludierteLehre) + { + table.hideColumn("betrag"); + } + } + + // ----------------------------------------------------------------------------------------------------------------- + // Tabulator columns format functions + // ----------------------------------------------------------------------------------------------------------------- + // Generates status icons + status_formatter = function(cell, formatterParams, onRendered){ + + var bestellt = cell.getRow().getData().bestellt; + var erteilt = cell.getRow().getData().erteilt; + var akzeptiert = cell.getRow().getData().akzeptiert; + + var betrag = parseFloat(cell.getRow().getData().betrag); + var vertrag_betrag = parseFloat(cell.getRow().getData().vertrag_betrag); + + // commented icons would be so nice to have with fontawsome 5.11... + if (bestellt != null && isNaN(vertrag_betrag)) + { + return ""; // kein Vertrag + } + else if (bestellt != null && (betrag != vertrag_betrag)) + { + return ""; // geaendert + // return ""; // geaendert + } + else if (bestellt == null && erteilt == null && akzeptiert == null) + { + return ""; // neu + } + else if (bestellt != null && erteilt == null && akzeptiert == null) + { + return ""; // bestellt + // return ""; // bestellt + } + else if (bestellt != null && erteilt != null && akzeptiert == null) + { + return ""; // erteilt + // return ""; // erteilt + } + else if (bestellt != null && erteilt != null && akzeptiert != null) + { + return ""; // akzeptiert + // return ""; // akzeptiert + } + else + { + return ""; // default + } + }; + + // Generates status tooltip + status_tooltip = function(cell){ + var bestellt = cell.getRow().getData().bestellt; + var betrag = parseFloat(cell.getRow().getData().betrag); + var vertrag_betrag = parseFloat(cell.getRow().getData().vertrag_betrag); + + if (bestellt != null && betrag != vertrag_betrag) { + var text = 'Lehrauftrag wird bearbeitet.'; + text += "\n"; + text += 'Sobald dieser (erneut) erteilt wurde, kann der Lehrauftrag angenommen werden.'; + + return text; + } + } + + $(function() { // Select all (filtered) rows, where status bestellt AND erteilt has a value and status akzeptiert has no value. $("#select-all").click(function(){ - $('#filterTabulator').tabulator('getRows') + $('#filterTabulator').tabulator('getRows', true) .filter(function(row){ return row.getData().bestellt != null && row.getData().erteilt != null && row.getData().akzeptiert == null; }) @@ -147,7 +343,18 @@ $(function() { $('#filterTabulator').tabulator('clearFilter'); }); - // Show only rows with akzeptierte lehrauftraege + // Show only rows with ordered lehrauftraege + $("#show-ordered").click(function(){ + $('#filterTabulator').tabulator('setFilter', + [ + {field: 'bestellt', type: '!=', value: null}, + {field: 'erteilt', type: '=', value: null}, + {field: 'akzeptiert', type: '=', value: null} + ] + ); + }); + + // Show only rows with erteilte lehrauftraege $("#show-approved").click(function(){ $('#filterTabulator').tabulator('setFilter', [ {field: 'bestellt', type: '!=', value: null}, // filter when is bestellt @@ -157,6 +364,17 @@ $(function() { ); }); + // Show only rows with akzeptierte lehrauftraege + $("#show-accepted").click(function(){ + $('#filterTabulator').tabulator('setFilter', + [ + {field: 'bestellt', type: '!=', value: null}, + {field: 'erteilt', type: '!=', value: null}, + {field: 'akzeptiert', type: '!=', value: null} + ] + ); + }); + // Approve Lehrauftraege $("#accept-lehrauftraege").click(function(){ diff --git a/application/views/lehre/lehrauftrag/acceptLehrauftragData.php b/application/views/lehre/lehrauftrag/acceptLehrauftragData.php index 44757fe93..6410e8732 100644 --- a/application/views/lehre/lehrauftrag/acceptLehrauftragData.php +++ b/application/views/lehre/lehrauftrag/acceptLehrauftragData.php @@ -240,7 +240,7 @@ $filterWidgetArray = array( 'hideOptions' => true, 'hideMenu' => true, 'columnsAliases' => array( // TODO: use phrasen - 'row_index', + 'Status', // alias for row_index, because row_index is formatted to display the status icons 'LE-ID', 'LV-ID', 'PA-ID', @@ -273,45 +273,24 @@ $filterWidgetArray = array( selectable: true, // allow row selection selectableRangeMode: "click", // allow range selection using shift end click on end of range selectablePersistence:false, // deselect previously selected rows when table is filtered, sorted or paginated - selectableCheck: function(row) - { - // only allow to select bestellte && erteilte Lehraufträge - return (row.getData().bestellt != null && row.getData().erteilt != null && row.getData().akzeptiert == null); + selectableCheck: function(row){ + return func_selectableCheck(row); }, - rowUpdated:function(row) - { - // deselect and disable new selection of updated rows (approvement done) - row.deselect(); - row.getElement().style["pointerEvents"] = "none"; + rowUpdated:function(row){ + func_rowUpdated(row); }, - rowFormatter:function(row) - { - var data = row.getData(); - - // default (white): rows to be accepted - // green: rows accepted - // grey: all other - if(row.getData().bestellt != null && row.getData().erteilt != null && row.getData().akzeptiert == null) - { - return; - } - else if(row.getData().bestellt != null && row.getData().erteilt != null && row.getData().akzeptiert != null) - { - row.getElement().style["background-color"] = "#d1f1d196"; // green - } - else - { - row.getElement().style["background-color"] = "#f5f5f5"; // grey - } + rowFormatter:function(row){ + func_rowFormatter(row); }, - renderComplete:function() - { - // If the lectors actual Verwendung has inkludierte Lehre, hide the column betrag - if (has_inkludierteLehre) - { - this.hideColumn("betrag"); - } - } + tableBuilt: function(){ + func_tableBuilt(this); + }, + renderComplete:function(){ + func_renderComplete(this); + }, + renderStarted:function(){ + func_renderStarted(this); + } }', // tabulator properties 'datasetRepFieldsDefs' => '{ row_index: {visible:false}, // necessary for row indexing