mirror of
https://github.com/FH-Complete/FHC-Core.git
synced 2026-07-19 16:02:15 +00:00
Changed HTML table to Tablewidget
This commit is contained in:
@@ -57,31 +57,11 @@ $this->load->view('templates/FHC-Header', $includesArray);
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!--Tabelle-->
|
||||
<div class="row col-6">
|
||||
<table class="table table-condensed mt-3" id="azrTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th><?php echo $this->p->t('lehre', 'studiensemester'); ?></th>
|
||||
<th><?php echo $this->p->t('anrechnung', 'anrechnungszeitraumStart'); ?></th>
|
||||
<th><?php echo $this->p->t('anrechnung', 'anrechnungszeitraumEnde'); ?></th>
|
||||
<th><?php echo $this->p->t('ui', 'aktion'); ?></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach($anrechnungszeitraum_arr as $azr):?>
|
||||
<tr data-anrechnungszeitraum_id="<?php echo $azr->anrechnungszeitraum_id ?>">
|
||||
<td class="studiensemester_kurzbz"><?php echo $azr->studiensemester_kurzbz ?></td>
|
||||
<td class="anrechnungstart"><?php echo $azr->anrechnungstart ?></td>
|
||||
<td class="anrechnungende"><?php echo $azr->anrechnungende ?></td>
|
||||
<td>
|
||||
<button class="btn btn-outline-secondary azrOpenModal" data-bs-toggle="modal" data-bs-target="#azrModal" value="update"><i class="fa fa-edit"></i></button>
|
||||
<button type="button" class="btn btn-outline-secondary ms-1 azrDeleteBtn"><i class="fa fa-times"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach;?>
|
||||
</tbody>
|
||||
</table>
|
||||
<!-- Tabelle -->
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<?php $this->load->view('lehre/anrechnung/adminAnrechnungData.php'); ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal (für insert und update von Anrechnungszeitraum)-->
|
||||
@@ -120,7 +100,7 @@ $this->load->view('templates/FHC-Header', $includesArray);
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" id="azrInsertOrUpdateBtn" class="btn btn-primary" value=""><?php echo $this->p->t('ui', 'speichern'); ?></button>
|
||||
<button type="button" id="azrInsertBtn" class="btn btn-primary" value=""><?php echo $this->p->t('ui', 'speichern'); ?></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,45 @@
|
||||
<?php
|
||||
|
||||
$query = '
|
||||
SELECT *
|
||||
FROM lehre.tbl_anrechnungszeitraum
|
||||
ORDER BY anrechnungstart DESC
|
||||
';
|
||||
|
||||
$filterWidgetArray = array(
|
||||
'query' => $query,
|
||||
'tableUniqueId' => 'adminAnrechnung',
|
||||
'requiredPermissions' => 'admin',
|
||||
'datasetRepresentation' => 'tabulator',
|
||||
'columnsAliases' => array(
|
||||
'AzrID',
|
||||
ucfirst($this->p->t('lehre', 'studiensemester')),
|
||||
ucfirst($this->p->t('anrechnung', 'anrechnungszeitraumStart')),
|
||||
ucfirst($this->p->t('anrechnung', 'anrechnungszeitraumEnde')),
|
||||
ucfirst($this->p->t('ui', 'bearbeitetAm')),
|
||||
ucfirst($this->p->t('ui', 'bearbeitetVon')),
|
||||
),
|
||||
'datasetRepOptions' => '{
|
||||
height: func_height(this),
|
||||
layout: "fitColumns", // fit columns to width of table
|
||||
//persistentLayout:true,
|
||||
autoResize: false, // prevent auto resizing of table (false to allow adapting table size when cols are (de-)activated
|
||||
headerFilterPlaceholder: " ",
|
||||
index: "anrechnungszeitraum_id", // assign specific column as unique id (important for row indexing)
|
||||
selectable: false, // allow row selection
|
||||
//tableWidgetHeader: true,
|
||||
tableBuilt: function(){
|
||||
func_tableBuilt(this);
|
||||
},
|
||||
}',
|
||||
'datasetRepFieldsDefs' => '{
|
||||
anrechnungszeitraum_id: {visible: false, headerFilter:"input"},
|
||||
studiensemester_kurzbz: {headerFilter:"input"},
|
||||
anrechnungstart: {headerFilter:"input"},
|
||||
anrechnungende: {headerFilter:"input"},
|
||||
insertamum: {visible: false, headerFilter:"input"},
|
||||
insertvon: {visible: false, headerFilter:"input"}
|
||||
}'
|
||||
);
|
||||
|
||||
echo $this->widgetlib->widget('TableWidget', $filterWidgetArray);
|
||||
@@ -1,8 +1,61 @@
|
||||
// Adds column details
|
||||
function func_tableBuilt(table) {
|
||||
table.addColumn(
|
||||
{
|
||||
title: "Aktion",
|
||||
align: "center",
|
||||
width: 150,
|
||||
formatter: addActionButtons,
|
||||
}, false // place column right
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
// Returns relative height (depending on screen size)
|
||||
function func_height(table){
|
||||
return $(window).height() * 0.50;
|
||||
}
|
||||
|
||||
var addActionButtons = function(cell) {
|
||||
|
||||
// Create edit button
|
||||
var editBtn = document.createElement("button");
|
||||
editBtn.type = "button";
|
||||
editBtn.innerHTML = "<i class=\"fa fa-edit\"></i>";
|
||||
editBtn.classList.add("azrEditBtn");
|
||||
editBtn.classList.add("btn");
|
||||
editBtn.classList.add("btn-outline-secondary");
|
||||
editBtn.addEventListener("click", function(){
|
||||
adminAnrechnung.editRow(cell);
|
||||
});
|
||||
|
||||
|
||||
|
||||
// Create delete button
|
||||
var delBtn= document.createElement("button");
|
||||
delBtn.type = "button";
|
||||
delBtn.innerHTML = "<i class=\"fa fa-times\"></i>";
|
||||
delBtn.classList.add("azrDeleteBtn");
|
||||
delBtn.classList.add("btn");
|
||||
delBtn.classList.add("btn-outline-secondary");
|
||||
delBtn.classList.add("ms-1");
|
||||
delBtn.addEventListener("click", function(){
|
||||
adminAnrechnung.deleteRow(cell);
|
||||
});
|
||||
|
||||
// Add buttons to cell
|
||||
var buttonHolder = document.createElement("span");
|
||||
buttonHolder.appendChild(editBtn);
|
||||
buttonHolder.appendChild(delBtn);
|
||||
|
||||
return buttonHolder;
|
||||
}
|
||||
|
||||
$(function () {
|
||||
|
||||
// Open Modal and set values for insert or update Anrechnungszeitraum
|
||||
$(document).on('click', '.azrOpenModal', function(){
|
||||
|
||||
|
||||
// Open Modal
|
||||
$('#azrModal').modal('show');
|
||||
|
||||
@@ -25,66 +78,18 @@ $(function () {
|
||||
$('.modal-footer #azrInsertOrUpdateBtn').val('insert');
|
||||
}
|
||||
|
||||
if (mode === 'update')
|
||||
{
|
||||
let row = $(this).closest('tr');
|
||||
var anrechnungszeitraum_id = row.data('anrechnungszeitraum_id');
|
||||
var studiensemester_kurzbz = row.find('.studiensemester_kurzbz').text();
|
||||
var anrechnungstart = row.find('.anrechnungstart').text();
|
||||
var anrechnungende = row.find('.anrechnungende').text();
|
||||
|
||||
$('.modal-header #azrModalLabel').text('Anrechnungszeitraum bearbeiten');
|
||||
|
||||
$('.modal-body #anrechnungszeitraum_id').val(anrechnungszeitraum_id);
|
||||
$('.modal-body #studiensemester').val(studiensemester_kurzbz).change();
|
||||
$('.modal-body #azrStart').val(anrechnungstart);
|
||||
$('.modal-body #azrEnde').val(anrechnungende);
|
||||
|
||||
$('.modal-footer #azrInsertOrUpdateBtn').val('update');
|
||||
}
|
||||
});
|
||||
|
||||
// Insert or update Anrechnungszeitraum
|
||||
$(document).on('click', '#azrInsertOrUpdateBtn', function(){
|
||||
|
||||
var anrechnungszeitraum_id = $('.modal-body #anrechnungszeitraum_id').val();
|
||||
// Insert Anrechnungszeitraum
|
||||
$(document).on('click', '#azrInsertBtn', function(){
|
||||
var studiensemester_kurzbz = $('.modal-body #studiensemester').val();
|
||||
var anrechnungstart = $('.modal-body #azrStart').val();
|
||||
var anrechnungende = $('.modal-body #azrEnde').val();
|
||||
|
||||
// insert or update
|
||||
let mode = this.value;
|
||||
|
||||
if (mode === 'insert')
|
||||
{
|
||||
// Insert Anrechnungszeitraum
|
||||
adminAnrechnung.insertAzr(studiensemester_kurzbz, anrechnungstart, anrechnungende);
|
||||
}
|
||||
|
||||
if (mode === 'update')
|
||||
{
|
||||
// Update Anrechnungszeitraum
|
||||
adminAnrechnung.updateAzr(anrechnungszeitraum_id, studiensemester_kurzbz, anrechnungstart, anrechnungende);
|
||||
}
|
||||
// Insert Anrechnungszeitraum
|
||||
adminAnrechnung.insertAzr(studiensemester_kurzbz, anrechnungstart, anrechnungende);
|
||||
});
|
||||
|
||||
// Delete Anrechnungszeitraum
|
||||
$('#azrTable').on('click', '.azrDeleteBtn', function(){
|
||||
|
||||
if(!confirm(FHC_PhrasesLib.t("ui", "frageSicherLoeschen")))
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var anrechnungszeitraum_id = $(this).closest('tr').data('anrechnungszeitraum_id');
|
||||
var row = $(this).closest('tr');
|
||||
|
||||
// Delete Anrechnungszeitraum
|
||||
adminAnrechnung.deleteAzr(anrechnungszeitraum_id);
|
||||
|
||||
// Remove row
|
||||
row.remove();
|
||||
});
|
||||
|
||||
})
|
||||
|
||||
@@ -109,13 +114,13 @@ var adminAnrechnung = {
|
||||
{
|
||||
data = FHC_AjaxClient.getData(data);
|
||||
|
||||
// Add row on top
|
||||
adminAnrechnung.prependRow(
|
||||
data.anrechnungszeitraum_id,
|
||||
studiensemester_kurzbz,
|
||||
anrechnungstart,
|
||||
anrechnungende
|
||||
);
|
||||
// Update row
|
||||
$('#tableWidgetTabulator').tabulator('addData', [{
|
||||
anrechnungszeitraum_id: data.anrechnungszeitraum_id,
|
||||
studiensemester_kurzbz: studiensemester_kurzbz,
|
||||
anrechnungstart: anrechnungstart,
|
||||
anrechnungende: anrechnungende
|
||||
}], true); // true to add row on top
|
||||
|
||||
// Close Modal
|
||||
$('#azrModal').modal('hide');
|
||||
@@ -131,18 +136,24 @@ var adminAnrechnung = {
|
||||
}
|
||||
);
|
||||
},
|
||||
prependRow: function (anrechnungszeitraum_id, studiensemester_kurzbz, anrechnungstart, anrechnungende) {
|
||||
$('#azrTable').prepend($(
|
||||
'<tr data-anrechnungszeitraum_id="' + anrechnungszeitraum_id + '">' +
|
||||
'<td class="studiensemester_kurzbz">' + studiensemester_kurzbz + '</td>' +
|
||||
'<td class="anrechnungstart">' + anrechnungstart + '</td>' +
|
||||
'<td class="anrechnungende">' + anrechnungende + '</td>' +
|
||||
'<td>' +
|
||||
'<button class="btn btn-outline-secondary azrOpenModal" value="update"><i class="fa fa-edit"></i></button>' +
|
||||
'<button class="btn btn-outline-secondary ms-1 azrDeleteBtn"><i class="fa fa-times"></i></button>' +
|
||||
'</td>' +
|
||||
'</tr>'
|
||||
))
|
||||
editRow: function (cell){
|
||||
// Open Modal
|
||||
$('#azrModal').modal('show');
|
||||
|
||||
let row = cell.getRow();
|
||||
var anrechnungszeitraum_id = row.getData().anrechnungszeitraum_id;
|
||||
var studiensemester_kurzbz = row.getData().studiensemester_kurzbz;
|
||||
var anrechnungstart = row.getData().anrechnungstart;
|
||||
var anrechnungende = row.getData().anrechnungende;
|
||||
|
||||
$('.modal-header #azrModalLabel').text('Anrechnungszeitraum bearbeiten');
|
||||
|
||||
$('.modal-body #anrechnungszeitraum_id').val(anrechnungszeitraum_id);
|
||||
$('.modal-body #studiensemester').val(studiensemester_kurzbz).change();
|
||||
$('.modal-body #azrStart').val(anrechnungstart);
|
||||
$('.modal-body #azrEnde').val(anrechnungende);
|
||||
|
||||
$('.modal-footer #azrInsertOrUpdateBtn').val('update');
|
||||
},
|
||||
updateAzr: function (anrechnungszeitraum_id, studiensemester_kurzbz, anrechnungstart, anrechnungende) {
|
||||
FHC_AjaxClient.ajaxCallPost(
|
||||
@@ -164,7 +175,12 @@ var adminAnrechnung = {
|
||||
if (FHC_AjaxClient.hasData(data))
|
||||
{
|
||||
// Update row
|
||||
adminAnrechnung.updateRow(anrechnungszeitraum_id, studiensemester_kurzbz, anrechnungstart, anrechnungende);
|
||||
$('#tableWidgetTabulator').tabulator('updateData', [{
|
||||
anrechnungszeitraum_id: anrechnungszeitraum_id,
|
||||
studiensemester_kurzbz: studiensemester_kurzbz,
|
||||
anrechnungstart: anrechnungstart,
|
||||
anrechnungende: anrechnungende
|
||||
}]);
|
||||
|
||||
// Close Modal
|
||||
$('#azrModal').modal('hide');
|
||||
@@ -181,12 +197,6 @@ var adminAnrechnung = {
|
||||
}
|
||||
);
|
||||
},
|
||||
updateRow: function (anrechnungszeitraum_id, studiensemester_kurzbz, anrechnungstart, anrechnungende){
|
||||
let row = $('#azrTable').find('tr').filter('[data-anrechnungszeitraum_id=' + anrechnungszeitraum_id + ']');
|
||||
row.find('.studiensemester_kurzbz').text(studiensemester_kurzbz);
|
||||
row.find('.anrechnungstart').text(anrechnungstart);
|
||||
row.find('.anrechnungende').text(anrechnungende);
|
||||
},
|
||||
deleteAzr: function(anrechnungszeitraum_id){
|
||||
FHC_AjaxClient.ajaxCallPost(
|
||||
FHC_JS_DATA_STORAGE_OBJECT.called_path + "/delete",
|
||||
@@ -203,6 +213,9 @@ var adminAnrechnung = {
|
||||
|
||||
if (FHC_AjaxClient.hasData(data))
|
||||
{
|
||||
let row = $('#tableWidgetTabulator').tabulator('getRow', anrechnungszeitraum_id);
|
||||
row.delete(anrechnungszeitraum_id);
|
||||
|
||||
// Success message
|
||||
FHC_DialogLib.alertSuccess(FHC_PhrasesLib.t("ui", "geloescht"));
|
||||
|
||||
@@ -214,5 +227,14 @@ var adminAnrechnung = {
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
deleteRow: function (cell){
|
||||
if(!confirm(FHC_PhrasesLib.t("ui", "frageSicherLoeschen")))
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
// Delete Anrechnungszeitraum
|
||||
adminAnrechnung.deleteAzr(cell.getRow().getData().anrechnungszeitraum_id);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user