From 5b73568c001c245ea630c1b97bf8086a738ea8b7 Mon Sep 17 00:00:00 2001 From: ulrich Date: Tue, 06 Apr 2021 08:27:18 +0000 Subject: [PATCH] Ablageort bearbeiten und leoschen in Arbeit --- www/ui/app.css | 9 ++++ www/ui/data/tpl/dlg-loeschen.tpl | 13 ++++++ www/ui/data/tpl/form_ablageort.tpl | 1 www/ui/js/app.js | 59 +++++++++++++++++++++++------ 4 files changed, 69 insertions(+), 13 deletions(-) diff --git a/www/ui/app.css b/www/ui/app.css index 3da32ea..e2ac5ca 100644 --- a/www/ui/app.css +++ b/www/ui/app.css @@ -140,6 +140,15 @@ margin-bottom: 0; } +.form-button-footer { + display: flex; + flex-flow: row; +} + +.dlg-btn { + margin-left: 0.4rem; +} + /* @media (min-width: 800px) { .zentrum-behaelter { diff --git a/www/ui/data/tpl/dlg-loeschen.tpl b/www/ui/data/tpl/dlg-loeschen.tpl new file mode 100644 index 0000000..c0eaa8a --- /dev/null +++ b/www/ui/data/tpl/dlg-loeschen.tpl @@ -0,0 +1,13 @@ +<div class="dlg-info"> + <span class="close-btn pointer-cursor">✖</span> + <div class="dlg-behaelter"> + <div class="dlg-info-app-titel">Löschen</div> + <div class="dlg-info-app-info">{{del-elem}} wirklich löschen?</div> + <div class="dlg-info-app-info"></div> + <div class="form-button-footer"> + <button class="button dlg-btn" type="button" id="nein-btn">Abbrechen</button> + <button class="button-primary dlg-btn" type="button" id="ja-btn">Löschen</button> + </div> + </div> +</div> + diff --git a/www/ui/data/tpl/form_ablageort.tpl b/www/ui/data/tpl/form_ablageort.tpl index d6132bf..8d4bf21 100644 --- a/www/ui/data/tpl/form_ablageort.tpl +++ b/www/ui/data/tpl/form_ablageort.tpl @@ -7,6 +7,7 @@ <div class="entity-buttons"> <button class="button-primary" id="ok-btn">Speichern</button> <button class="button" id="cancel-btn">Abbrechen</button> + <button class="button" id="loeschen-btn">Löschen</button> </div> </div> diff --git a/www/ui/js/app.js b/www/ui/js/app.js index 04db53f..9f348d6 100644 --- a/www/ui/js/app.js +++ b/www/ui/js/app.js @@ -28,21 +28,28 @@ self.vorlage_laden_und_fuellen("data/tpl/form_ablageort.tpl", "", function (html) { document.querySelector(".zentraler-inhalt").innerHTML = html; self.addEvtListener('#ok-btn', 'click', function () { - // hier neuen Ablageort speichern var a = new Ablageort( document.querySelector('#ablageort-name').value, document.querySelector('#ablageort-ort').value, document.querySelector('#ablageort-url').value ); - // {"name":"Katalog","ort":"/home/ulrich/Videos","url":"/media/test"} var daten = JSON.stringify(a); self.http_post('../api/store/Ablageort', daten, function (responseText) { // hier die Antwort verarbeiten }); }); self.addEvtListener('#cancel-btn', 'click', function () { - // hier die Aktion abbrechen document.querySelector(".zentraler-inhalt").innerHTML = ''; + }); + self.addEvtListener('#loeschen-btn', 'click', function() { + var aoname = document.querySelector('#ablageort-name').value; + var dlgdata = {"del-elem": aoname}; + self.dialog_laden_und_zeigen('data/tpl/dlg-loeschen.tpl', dlgdata, function() { + self.addEvtListener('#nein-btn', 'click', self.dialog_schliessen); + self.addEvtListener('#ja-btn', 'click', function() { + // hier loeschen + }); + }); }); }); }; @@ -63,6 +70,10 @@ self.http_call('POST', u, data, cb); }; + this.http_delete = function (u, data, cb) { + self.http_call('DELETE', u, data, cb); + }; + this.http_call = function (method, u, data, scallback) { var xhr = new XMLHttpRequest(); var url = u; @@ -192,20 +203,42 @@ vurl - URL zur Dialogvorlage msgTpl - URL mit einer Vorlage eines Mitteilungstextes (optional) */ - this.dialog_laden_und_zeigen = function (vurl, msgTpl) { - if (msgTpl !== '') { - fetch(msgTpl) - .then(data => { - // Handle data - self.dialog_zeigen(vurl, data); - }).catch(error => { - // Handle error + this.dialog_laden_und_zeigen = function (vurl, msgTpl, cb) { + var vorlage = self.cache[vurl]; + if(vorlage === undefined) { + self.http_get(vurl, function(antwort) { + self.cache[vurl] = antwort; + self.dialog_zeigen(vurl, msgTpl, cb); + //self.dialog_zeigen(vurl, antwort, cb); + //self.vorlage_fuellen(vurl, inhalt, cb); }); } else { - self.dialog_zeigen(vurl, ''); + self.dialog_zeigen(vurl, msgTpl, cb); + //self.dialog_zeigen(vurl, vorlage, cb); } }; + this.dialog_zeigen = function (vurl, inhalt, cb) { + var dlg = document.querySelector(".dialog"); + self.html_erzeugen( + vurl, + inhalt, + function (html) { + //dlg.html(html); + dlg.style.height = '7em'; + dlg.innerHTML = html; + document.querySelector('.close-btn').addEventListener('click', self.dialog_schliessen); + //dlg.slideDown(300); + if(typeof(cb) !== 'function') { + // .. + } else { + cb(); + } + }); + }; + + +/* this.dialog_zeigen = function (vurl, inhalt) { var dlg = document.querySelector(".dialog"); self.html_erzeugen( @@ -219,7 +252,7 @@ //dlg.slideDown(300); }); }; - +*/ self.dialog_schliessen = function () { document.querySelector('.close-btn').removeEventListener('click', self.dialog_schliessen); //$('.dialog').slideUp(300); -- Gitblit v1.9.3