Current Path : /data/web/virtuals/51568/virtual/www/knihy/ |
Current File : /data/web/virtuals/51568/virtual/www/knihy/tituly.php |
<style> .tituly { /* min-height: 800px; max-height: 820px; */ max-width: 550px; } #titul:invalid { border: 2px solid red; background-color: rgba(255, 0, 0, 0.1) } </style> <div class="card tituly rounded-0 shadow"> <div class="card-header alert-info p-2 h5 rounded-0">Tituly</div> <div class="card-body"> <div id="btnNovyTitul" class="row"> <div class="col-2 text-left"><button class="btn btn-outline-info rounded-0" onclick="zobrazFiltrTitul(true)"><i class="fas fa-filter"></i></button></div> <div class="col-4 text-left"> <select class="custom-select border-info text-info rounded-0" id="selSort"> <option value="1" selected>Podle titulu</option> <option value="2">Podle autora</option> </select> <!--button class="btn btn-outline-info" onclick="pretriditTituly()"><i class="fas fa-sort-alpha-down"></i> </button--> </div> <div class="col-6 text-right"> <button class="btn btn-outline-info rounded-0" onclick="zobrazNovyTitul(true)">Nový titul</button> </div> </div> <div id="novyTitul" class="py-2 d-none"> <div class="form-group row"> <label for="text" class="col-3 col-form-label">Nový titul</label> <div class="col-9"> <input id="titul" name="titul" placeholder="název titulu" type="text" class="form-control rounded-0" required> </div> </div> <div class="form-group row"> <label for="selectAutor" class="col-3 col-form-label">Autor</label> <div class="col-9"> <select id="selectAutor" name="selectAutor" class="custom-select rounded-0" required title="vyber autora..."> <?php include "tituly-select-autori-napln.php"?> </select> </div> </div> <div class="form-group row "> <div class="col-3"> <div class="custom-control custom-checkbox"> <input name="cbDalsiNovyTitul" id="cbDalsiNovyTitul" type="checkbox" class="custom-control-input rounded-0" value="" checked="checked"> <label for="cbDalsiNovyTitul" class="custom-control-label">další nový</label> </div> </div> <div class="col-3"> <div class="custom-control custom-checkbox"> <input name="cbPonechatAutoraTitul" id="cbPonechatAutoraTitul" type="checkbox" class="custom-control-input" value=""> <label for="cbPonechatAutoraTitul" class="custom-control-label">ponechat autora</label> </div> </div> <div class="col-3 text-right"> <button name="cancelTitul" class="btn btn-outline-warning rounded-0" onclick="zobrazNovyTitul(false)">Storno</button> </div> <div class="col-3 text-right"> <button name="ulozTitul" class="btn btn-primary rounded-0" onclick="novyTitul()">Uložit</button> </div> </div> </div> <div id="filtrDlgTituly" class="py-1 d-none"> <div class="form-group row"> <div class="col-4"> <input id="textFiltrTitul" name="textFiltrTitul" placeholder="titul..." type="text" class="form-control rounded-0"> </div> <div class="col-5 pl-0"> <select id="selectAutorFiltr" name="selectAutor" class="custom-select rounded-0" required title="vyber autora..."> <?php include "tituly-select-autori-napln.php"?> </select> </div> <div class="col-1 text-right px-0"> <button name="btnFiltrTitul" id="btnFiltrTitul" class="btn btn-primary rounded-0" onclick="titulyFiltruj()">Filtr</button> </div> <div class="col-2 pr-1 text-right"> <button name="btnFiltrTitulStorno" id="btnFiltrTitulStorno" class="btn btn-outline-primary rounded-0" onclick="zobrazFiltrTitul(false)">Zrušit</button> </div> </div> </div> <div id="seznamTituly"> <?php include("tituly-seznam.php") ?> </div> </div> <!-- card-body --> </div> <!-- card --> <script> tituly = []; naplnTituly(); $("#selSort").on("change", function () { let trideni = $("#selSort").children("option:selected").val(); // setridim if (trideni == '1') { tituly.sort((a, b) => (a['titul'] == b['titul']) ? a['autor'].localeCompare(b['autor'], 'cs') : a[ 'titul'].localeCompare(b['titul'], 'cs')); } else { tituly.sort((a, b) => (a['autor'] == b['autor']) ? a['titul'].localeCompare(b['titul'], 'cs') : a[ 'autor'].localeCompare(b['autor'], 'cs')); } // vygeneruji HTML let newHTML = `<table class="table table-sm " >`; for (obj of tituly) { newHTML += ` <tr id="radekTituly${obj.id}">`; if (trideni == '1') { newHTML += ` <td id="titulJm${obj.id}">${obj.titul}</td> <td id="titulAutorJm${obj.id}">${obj.autor}</td>`; } else { newHTML += ` <td id="titulAutorJm${obj.id}">${obj.autor}</td> <td id="titulJm${obj.id}">${obj.titul}</td>`; } newHTML += `<td id="titulEd${obj.id}" class="ikonaForm text-info" onclick="zavolejEditaciTitulu(${obj.id})"><i class="far fa-edit"></i></td> <td id="titulDe${obj.id}" class="ikonaForm text-danger" onclick="smazTitul(${obj.id})"><i class="far fa-trash-alt"></i></td> </tr> <tr id="radekConfirmTituly${obj.id}"> <td colspan="4" id="delConfirmAlertTitul${obj.id}" class="d-none"> <div class="alert alert-warning rounded- round-0"> <div class="row"> <div id="confirm${obj.id}" class="col-8"></div> <div class="col-2 text-right"><button class="btn btn-outline-primary rounded-0" onclick="stornoDeleteTitul(${obj.id})">Storno</button></div> <div class="col-2 text-right"><button class="btn btn-danger rounded-0" onclick="confirmDeleteTitul(${obj.id})">Smaž</button></div> </div> </div> </td> </tr> ` } newHTML += `</table>`; $("#titulySeznam").html(newHTML); }) function zobrazFiltrTitul(bool) { if (bool) { schovejTlacitkaTituly(-1); $("#titulySeznam").css("max-height", "480px"); } else { $("#titulySeznam").css("max-height", "530px"); } $('[id^="radekTituly"]').removeClass("d-none"); $("#btnNovyTitul").toggleClass("d-none"); $("#filtrDlgTituly").toggleClass("d-none"); } function zobrazNovyTitul(bool) { if (bool) { schovejTlacitkaTituly(-1); $("#titulySeznam").css("max-height", "480px"); } else { $("#titulySeznam").css("max-height", "530px"); } $("#btnNovyTitul").toggleClass("d-none"); $("#novyTitul").toggleClass("d-none"); if (bool) { $("#titul").focus(); $("#titul").val(""); } } function novyTitul() { let titul = $("#titul").val(), idautor = $("#selectAutor").children(":selected").attr("id"); idautor = (typeof idautor != 'undefined') ? idautor.substr(16, 10) : ""; if (idautor > '') { autor = $("#selectAutorFiltr"+idautor).html().trim(); } else { autor = ''; } titul = titul.trim(); if ((titul < ' ') || (autor < ' ')) { $("#titul").focus(); } else { $.ajax({ url: "knihy/tituly-uloz.php", type: 'POST', dataType: 'HTML', data: { 'titul': titul, 'idautor': idautor, 'operace': 'n', 'id': 0 }, success: function (result) { console.log(result); tituly.push({ 'id': result, 'titul': titul, 'autor': autor, 'idautor': idautor, 'e': false, 'd': false }); let trideni = $("#selSort").children("option:selected").val(); if (trideni == '1') { tituly.sort((a, b) => (a['titul'] == b['titul']) ? a['autor'].localeCompare(b[ 'autor'], 'cs') : a['titul'].localeCompare(b['titul'], 'cs')); } else { tituly.sort((a, b) => (a['autor'] == b['autor']) ? a['titul'].localeCompare(b[ 'titul'], 'cs') : a['autor'].localeCompare(b['autor'], 'cs')); } let novyIndex = tituly.findIndex(o => o.id == result); let vlozHTML = ` <tr id="radekTituly${result}">`; console.log(vlozHTML); if (trideni == '1') { vlozHTML += `<td id="titulJm${result}">${titul}</td> <td id="titulAutorJm${result}">${autor}</td>`; } else { vlozHTML += `<td id="titulAutorJm${result}">${autor}</td> <td id="titulJm${result}">${titul}</td>`; } vlozHTML += `<td id="titulEd${result}" class="ikonaForm text-info" onclick="zavolejEditaciTitulu(${result})"> <i class="far fa-edit"></i></td> <td id="titulDe${result}" class="ikonaForm text-danger" onclick="smazTitul(${result})"><i class="far fa-trash-alt"></i></td> </tr> <tr id="radekConfirmTituly${result}"> <td colspan="4" id="delConfirmAlertTitul${result}" class="d-none"> <div class="alert alert-warning mb-4 rounded-0"> <div class="row"> <div id="confirm${result}" class="col-8"></div> <div class="col-2 text-right"><button class="btn btn-outline-primary rounded-0" onclick="stornoDeleteTitul(${result})">Storno</button></div> <div class="col-2 text-right"><button class="btn btn-danger rounded-0" onclick="confirmDeleteTitul(${result})">Smazat</button></div> </div> </div> </td> </tr>`; if (novyIndex < tituly.length - 1) { $("#radekTituly" + tituly[novyIndex + 1].id).before(vlozHTML); } else { $("#radekConfirmTituly" + tituly[novyIndex - 1].id).after(vlozHTML); } if ($("#cbDalsiNovyTitul").prop("checked")) { $("#titul").focus(); $("#titul").val(""); if (!$("#cbPonechatAutoraTitul").prop("checked")) { $("#selectAutor").val(""); } } else { zobrazNovyTitul(false); } } }) } } //xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx function schovejTlacitkaTituly(idAkt) { if ($("#filtrDlgTituly").hasClass("d-none")) { if ($("#btnNovyTitul").hasClass("d-none")) { $("#novyTitul").addClass("d-none"); $("#filtrDlgTitul").addClass("d-none"); $("#btnNovyTitul").removeClass("d-none") } } let jeVEditaciIndex = tituly.findIndex(o => o.e == true), jeVDeleteIndex = tituly.findIndex(o => o.d == true); if (jeVEditaciIndex > -1) { stornoEditaceTitulu(tituly[jeVEditaciIndex].id, tituly[jeVEditaciIndex].titul); } if (jeVDeleteIndex > -1) { stornoDeleteTitul(tituly[jeVDeleteIndex].id); } } function stornoDeleteTitul(id) { const jeVDeleteIndex = tituly.findIndex(o => o.d == true); tituly[jeVDeleteIndex].d = !tituly[jeVDeleteIndex].d; $("#delConfirmAlertTitul" + id).addClass("d-none"); } function zavolejEditaciTitulu(id) { schovejTlacitkaTituly(id); let titulOld = $("#titulJm" + id).text(), titulyIndex = tituly.findIndex(o => o.id == id); tituly[titulyIndex].e = !tituly[titulyIndex].e; if (tituly[titulyIndex].e) { $("#titulJm" + id).html( `<input id="titulJmNew${id}" value="${titulOld}" placeholder=" jméno knihy" type="text" class="form-control" required>` ); $.ajax({ url: "knihy/tituly-select-autori-napln.php", type: 'POST', dataType: 'HTML', data: { 'id': tituly[titulyIndex].idautor }, success: function (result) { let newHTML = `<select id="selectAutorEdit" name="selectAutorEdit" class="custom-select rounded-0" required title="vyber autora..."> ${result} </select>`; $("#titulAutorJm" + id).html(newHTML);; } }) $("#titulDe" + id).html(`<span class="text-warning"><i class="fas fa-undo"></i></span>`); $("#titulEd" + id).html(`<span class="text-success"><i class="far fa-save"></i></span>`); document.getElementById("titulDe" + id).onclick = new Function(`stornoEditaceTitulu(${id}, '${titulOld}')`); document.getElementById("titulEd" + id).onclick = new Function(`ulozEditaciTitulu(${id}, '${titulOld}')`); $("#titulJmNew" + id).focus(); } } function titulyFiltruj() { let textFiltr = $("#textFiltrTitul").val(), idautor = $("#selectAutorFiltr").children(":selected").attr("id"), schovej = false; if (idautor > '') {idautor = idautor.substr(16, 10);} textFiltr = textFiltr.toLocaleLowerCase().trim(); if ((textFiltr > '') || (idautor > '')) { $('[id^="radekTituly"]').removeClass("d-none"); tituly.forEach(obj => { let a = obj.titul.toLocaleLowerCase(); schovej = ((textFiltr > '') && (a.indexOf(textFiltr) !== 0)) || ((idautor > '') && (obj.idautor != idautor)); if (schovej) { let id = obj.id; $("#radekTituly" + id).addClass("d-none"); } }) } } function smazTitul(id) { schovejTlacitkaTituly(id) $("#delConfirmAlertTitul" + id).removeClass("d-none"); let titulyIndex = tituly.findIndex(o => o.id == id); tituly[titulyIndex].d = !tituly[titulyIndex].d; $("#confirm" + id).html('Skutečně smazat (smaže se i u knih)?<br>' + tituly[titulyIndex].titul); } function confirmDeleteTitul(id) { $.ajax({ url: "knihy/tituly-delete.php", type: 'POST', dataType: 'HTML', data: { 'id': id }, success: function (result) { const index = tituly.findIndex(o => o.id == id); if (index > -1) { tituly.splice(index, 1); } $("#radekTituly" + id).remove(); $("#radekConfirmTituly" + id).remove(); } }) } function ulozEditaciTitulu(id, titulOld) { let titul = $("#titulJmNew" + id).val(), idautor = $("#selectAutorEdit").children(":selected").attr("id"), autor = $("#selectAutorEdit").children("option:selected").html(); jeVEditaciIndex = tituly.findIndex(o => o.e == true); if (idautor > " ") {idautor = idautor.substr(16, 10);} id = tituly[jeVEditaciIndex].id; idautorOld = tituly[jeVEditaciIndex].idautor; titul = titul.trim(); if (((titul != '') && (titul != titulOld)) || ((idautor != idautorOld) && (idautor > " "))) { $.ajax({ url: "knihy/tituly-uloz.php", type: 'POST', dataType: 'HTML', data: { 'titul': titul, 'operace': 'e', 'id': id, 'idautor': idautor }, success: function (result) { tituly[jeVEditaciIndex].idautor = idautor; tituly[jeVEditaciIndex].autor = autor; tituly[jeVEditaciIndex].titul = titul; tituly[jeVEditaciIndex].e = false; $("#titulJm" + id).html(titul); $("#titulAutorJm" + id).html(tituly[jeVEditaciIndex].autor); $("#titulDe" + id).html( `<span class="text-danger"><i class="far fa-trash-alt"></span>`); $("#titulEd" + id).html(`<span class="text-info"><i class="far fa-edit"></span>`); document.getElementById("titulDe" + id).onclick = new Function(`smazTitul(${id})`); document.getElementById("titulEd" + id).onclick = new Function( `zavolejEditaciTitulu(${id})`); // pretridit(); } }) } else { stornoEditaceTitulu(id, titulOld); } } function stornoEditaceTitulu(id, titulOld) { let jeVEditaciIndex = tituly.findIndex(o => o.e == true); tituly[jeVEditaciIndex].e = false; $("#titulJm" + id).html(titulOld); $("#titulAutorJm" + id).html(tituly[jeVEditaciIndex].autor); $("#titulDe" + id).html(`<span class="text-danger"><i class="far fa-trash-alt"></span>`); $("#titulEd" + id).html(`<span class="text-info"><i class="far fa-edit"></span>`); document.getElementById("titulDe" + id).onclick = new Function(`smazTitul(${id})`); document.getElementById("titulEd" + id).onclick = new Function(`zavolejEditaciTitulu(${id})`); } function pretridit() { $.ajax({ url: "knihy/tituly-seznam.php", type: 'POST', dataType: 'HTML', data: {}, success: function (result) { $('#seznamTituly').html(result); naplnTituly(); } }) } /*******************************************************************************/ function naplnTituly() { $('[id^="titulJm"]').each(function () { let titulJmID = this.id, id = titulJmID.substr(7, 10), titul = $("#titulJm" + id).html(); autor = $("#titulAutorJm" + id).html(), idautor = $("#titulAutorJm" + id).attr("id-autor"); tituly.push({ 'id': id, 'titul': titul, 'autor': autor, 'idautor': idautor, 'e': false, 'd': false }); }); } </script>