Commit 66d233bb authored by Eric Seigne's avatar Eric Seigne
Browse files

new tags page

parent ebc2ddc0
......@@ -193,6 +193,7 @@ label[for="objet"] {
width: 25%;
} */
#feedVehicules {
clear: both;
padding-top: 8px;
......@@ -250,6 +251,14 @@ label[for=ht], label[for=ttc], label[for=tvaVal1], label[for=tvaVal2], label[for
top: 44px;
}
.toolbar.toolbar--material+.page__background {
top: 44px;
}
.toolbar-button--material {
padding: 0 6px;
}
.menulabel {
position: absolute;
top: 4px;
......@@ -492,7 +501,6 @@ fieldset {
right: 5px;
}
#contenuLDFImage {
text-align: center;
}
......@@ -546,7 +554,6 @@ span.deleteiconAccount span.deleteiconAccount2 {
color: grey;
}
.automatique {
font-weight: 400;
border-radius: 5px;
......@@ -570,3 +577,14 @@ input[type="button"] {
text-transform: unset;
white-space: unset;
}
label[for=element-toggle] {
cursor: pointer;
}
#element-toggle {
display: none;
}
#element-toggle:not(:checked) ~ #toggled-element {
display: none;
}
\ No newline at end of file
<ons-dialog id="dialog-tag-new">
<div style="text-align: center; padding: 10px;">
<div style="text-align: center; margin-top: 30px;">
<p>
<input type="hidden" id="dialogID" value=""></ons-input>
<input type="hidden" id="dialogSlug" value=""></ons-input>
<ons-input id="dialogLabel" modifier="underbar" placeholder="Label" float></ons-input>
</p>
</div>
<p style="margin-top: 30px;">
<ons-button onclick="tagCreate($('#dialogID').val(), $('#dialogSlug').val(), $('#dialogLabel').val())">create</ons-button>
<ons-button onclick="hideDialog('dialog-tag-new')">cancel</ons-button>
</p>
</div>
</ons-dialog>
\ No newline at end of file
<ons-dialog id="dialog-tag-update">
<div style="text-align: center; padding: 10px;">
<div style="text-align: center; margin-top: 30px;">
<p>
<input type="hidden" id="dialogID" value=""></ons-input>
<input type="hidden" id="dialogSlug" value=""></ons-input>
<ons-input id="dialogLabel" modifier="underbar" placeholder="Label" float></ons-input>
</p>
</div>
<p style="margin-top: 30px;">
<ons-button onclick="updateDialog($('#dialogID').val(), $('#dialogSlug').val(), $('#dialogLabel').val())">update</ons-button>
<ons-button onclick="hideDialog('dialog-tag-update')">cancel</ons-button>
</p>
</div>
</ons-dialog>
\ No newline at end of file
......@@ -133,5 +133,9 @@
"myAccounts": "My accounts",
"OtherAccount": "Other account",
"AddNewAccount": "Add",
"account": "Account used"
}
"account": "Account used",
"pleaseSelectTagsBefore": "Please select tags you want to delete before",
"tags": "Tags",
"apply": "Apply",
"tagsAvailable": "Tags available"
}
\ No newline at end of file
......@@ -135,5 +135,9 @@
"useThisAccount": "Utiliser ce compte",
"OtherAccount": "Autre compte",
"AddNewAccount": "Ajouter",
"account": "Compte actif"
}
"account": "Compte actif",
"pleaseSelectTagsBefore": "Veuillez choisir quelles étiquettes vous voulez supprimer avant de cliquer sur ce bouton",
"tags": "Étiquettes",
"apply": "Valider",
"tagsAvailable": "Étiquettes disponibles"
}
\ No newline at end of file
<ons-page id="ONSSplitter">
<ons-toolbar modifier="material">
<div id="titreDoliscan" class="left">
<span id="titreDoliscan">DoliSCAN</span>
</div>
<div id="home" class="left">
<img src="img/logo_square.png" id="homeLogo" />
</div>
</ons-toolbar>
<ons-list>
<ons-list-item onclick="gotoPage('menu.html');" tappable modifier="nodivider">
<span class="translate">home</span>
......@@ -17,6 +25,9 @@
<ons-list-item onclick="gotoPage('config.html');" tappable modifier="nodivider">
<span class="translate">vehicles</span>
</ons-list-item>
<ons-list-item onclick="gotoPage('tags.html');" tappable modifier="nodivider">
<span class="translate">tags</span>
</ons-list-item>
<ons-list-item onclick="gotoPage('moncompte.html');" tappable modifier="nodivider">
<span class="translate">myAccount</span>
</ons-list-item>
......@@ -33,4 +44,4 @@
<span class="translate">closeSession</span>
</ons-list-item>
</ons-list>
</ons-page>
</ons-page>
\ No newline at end of file
<ons-page id="ONSFraisIK">
<ons-toolbar modifier="material">
<div id="titreNav" class="left" onclick="gotoPage('menu.html');">
<span class="translate">tags</span>
</div>
<div id="home" class="left" onclick="gotoPage('menu.html');">
<img src="img/logo_square.png" id="homeLogo" />
</div>
<div id="menuHautDroite" class="right">
<ons-toolbar-button>
<ons-icon icon="md-search" onclick="$('#searchRow').toggle();"></ons-icon>
</ons-toolbar-button>
<ons-toolbar-button onclick="deleteAllChecked();">
<ons-icon icon="md-delete"></ons-icon>
</ons-toolbar-button>
<ons-toolbar-button onclick="fn.open()">
<ons-icon icon="md-menu"></ons-icon>
</ons-toolbar-button>
</div>
</ons-toolbar>
<ons-fab position="bottom right" onclick="showTagNewDialog();">
<ons-icon icon="md-plus"></ons-icon>
</ons-fab>
<ons-bottom-toolbar style="display: none;;">
<div style="text-align: center; margin-top: 4px;">
<ons-button modifier="material" onclick="getAllCheckedBoxes();"><span class="translate">apply</span></ons-button>
</div>
</ons-bottom-toolbar>
<div id="container">
<form id="leformDev" name="leformDev">
<ons-row id="searchRow" style="position: fixed; background-color: white; z-index: 100; display: none;">
<ons-col>
<div style="float:right">
<input id="searchDev" type="search" value="" placeholder="" class="search-input search-input--material" style="padding: 0px 0px 0px 10px;">
</div>
</ons-col>
</ons-row>
<ons-row>
<ons-col>
<ons-list-title id='title'><span class="translate">tagsAvailable</span></ons-list-title>
<ons-list id='listeDev' style="z-index: 1;">
</ons-list>
</ons-col>
</ons-row>
</form>
</div>
<script type="text/javascript">
function showTagNewDialog(val) {
var dialog = document.getElementById('dialog-tag-new');
if (dialog) {
dialog.show();
}
};
// ============== liste générique (dev en cours)
function showTagUpdateDialog(val) {
var dialog = document.getElementById('dialog-tag-update');
if (dialog) {
dialog.show();
let inLabel = document.getElementById('dialogLabel');
let inSlug = document.getElementById('dialogSlug');
let inID = document.getElementById('dialogID');
// console.log("==========================");
// console.log(val);
// console.log(dialog);
// console.log(inField);
inLabel.value = val.label;
inID.value = val.id;
inSlug.value = val.slug;
}
};
function deleteDialog(id, slug, label) {
let t = localGetData('devTest');
if (t !== null) {
let a = JSON.parse(t);
a.splice(id, 1);
localStoreData("devTest", JSON.stringify(a));
feedList('listeDev', 'devTest', '');
}
hideDialog('dialog-tag-update');
}
function updateDialog(id, slug, label) {
// console.log("==========================");
// console.log(id);
// console.log(slug);
// console.log(label);
let t = localGetData('devTest');
if (t !== null) {
let a = JSON.parse(t);
a.splice(id, 1);
var valA = { "id": id, "slug": slug, "label": label };
a.push(valA);
localStoreData("devTest", JSON.stringify(a));
feedList('listeDev', 'devTest', '');
}
hideDialog('dialog-tag-update');
}
var hideDialog = function (id) {
document
.getElementById(id)
.hide();
};
/**
* Ajoute une entrée à la liste
*/
function makeOneListEntry(id, l_title, l_subtitle, l_value) {
let h = "";
var valA = { "id": id, "slug": l_value, "label": l_title };
let val = btoa(JSON.stringify(valA));
// if (typeof l_subtitle === undefined || l_subtitle == "undefined" || l_subtitle == "") {
//ok h += "<ons-list-item tappable onclick='listChooseVal(\"" + id + "\", \"" + l_value + "\")'>" + l_title + "</ons-list-item>\n";
//tentative avec checkbox
h += "<ons-list-item tappable>\n";
h += " <label class=\"left\"><ons-checkbox input-id=\"" + l_value + "\" value=\"" + val + "\"></ons-checkbox></label>\n";
h += " <label for=\"" + l_value + "\" class=\"center\">" + l_title + "</label>\n";
h += "</ons-list-item>\n";
// h += "<ons-list-item tappable onclick='listChooseVal(\"" + id + "\", \"" + l_value + "\")'>" + l_title + "</ons-list-item>\n";
// }
return h;
}
function listChooseVal(id, value) {
}
/**
* récupère la liste de toutes les checkbox cochées
*/
function getAllCheckedBoxes() {
let checkedBoxes = document.querySelectorAll('.checkbox__input:checked');
checkedBoxes.forEach(e => {
let val = JSON.parse(atob(e.value));
myDebug(val.slug + " :: " + val.label);
});
}
/**
* supprime toutes les étiquettes sélectionnées
**/
function deleteAllChecked() {
let checkedBoxes = document.querySelectorAll('.checkbox__input:checked');
if (checkedBoxes.length > 0) {
let t = localGetData('devTest');
// if (t !== null) {
let a = JSON.parse(t);
// }
checkedBoxes.forEach(e => {
let val = JSON.parse(atob(e.value));
a.splice(val.id, 1);
myDebug(val.slug + " :: " + val.label);
});
localStoreData("devTest", JSON.stringify(a));
feedList('listeDev', 'devTest', '');
}
else {
ons.notification.toast(trans('pleaseSelectTagsBefore'), { timeout: 2000, animation: 'fall' });
}
}
/**
* complète la liste automatiquement
*/
function feedList(fieldName, sourceListName, search = "") {
let formField = '#' + fieldName;
let html = "";
let strRegEx = new RegExp(search, 'i');
$(formField).empty();
let thelist = JSON.parse(localGetData(sourceListName));
if (thelist !== null) {
thelist.sort(function (a, b) {
return a.label.localeCompare(b.label);
});
//On re-sauvegarde pour avoir la liste triée et donc les indices correspondants (pour del/update)
localStoreData("devTest", JSON.stringify(thelist));
console.log("Liste non vide : " + thelist.length);
for (let f = 0; f < thelist.length; f++) {
let ltitle = thelist[f].label;
// let llabel = thelist.arrayData[f][''];
let llabel = "";
let lvalue = thelist[f].slug;
if (search == "") {
myDebug("Search vide, ajout d'une entree : " + ltitle + " / " + llabel + " :: " + lvalue);
html += makeOneListEntry(f, ltitle, llabel, lvalue);
}
else {
myDebug("Vérifie si l'entrée matche avec la recherche ... " + ltitle + " search " + strRegEx);
if (ltitle.match(strRegEx)) {
myDebug("Ca matche ! Ajout d'une entree : " + ltitle + " / " + llabel + " :: " + lvalue);
html += makeOneListEntry(f, ltitle, llabel, lvalue);
}
}
}
}
myDebug("Ajout du code HTML : " + html);
$(formField).append(html);
}
ons.getScriptPage().onInit = function () {
// var t = [];
// t.push({ id: 120, slug: 'projet-208', label: "Projet modélisation 208" });
// t.push({ id: 130, slug: 'client-104', label: "Client CAP-REL" });
// t.push({ id: 154, slug: 'projet-001', label: "Client Zorglub" });
// t.push({ id: 154, label: "Expograph", slug: "C1800001" });
// t.push({ id: 154, label: "IFRAC", slug: "C1800002" });
// t.push({ id: 154, label: "GNS", slug: "C1800003" });
// t.push({ id: 154, label: "LG2i Informatique", slug: "C1800004" });
// t.push({ id: 154, label: "O'Clock", slug: "C1800005" });
// t.push({ id: 154, label: "Communauté de Communes Jalle Eau Bourde", slug: "C1800006" });
// t.push({ id: 154, label: "Asso. AbulEdu-FR", slug: "C1800007" });
// t.push({ id: 154, label: "Mairie de Cestas", slug: "C1800008" });
// t.push({ id: 154, label: "Ville d'Albi", slug: "C1800009" });
// t.push({ id: 154, label: "EXCIAL", slug: "C1800010" });
// t.push({ id: 154, label: "Mairie de Saint Loubès", slug: "C1800011" });
// t.push({ id: 154, label: "Association Sud-Ouest.Org", slug: "C1800012" });
// t.push({ id: 154, label: "Nathalie SEIGNE", slug: "C1900001" });
// t.push({ id: 154, label: "Christophe Fournier", slug: "C1900002" });
// t.push({ id: 154, label: "Isabelle Bruyère", slug: "C1900003" });
// t.push({ id: 154, label: "Lestanquet", slug: "C1900004" });
// t.push({ id: 154, label: "Audit Process Services", slug: "C1900005" });
// t.push({ id: 154, label: "SEBAN ET AUDY INGENIERIE INFORMATIQUE", slug: "C1900006" });
// t.push({ id: 154, label: "Jouneau", slug: "C1900007" });
// t.push({ id: 154, label: "FFESSM30", slug: "C1900008" });
// t.push({ id: 154, label: "L'Oliveraie", slug: "C1900009" });
// t.push({ id: 154, label: "Cabinet de Radiologie de la Calmette", slug: "C1900010" });
// t.push({ id: 154, label: "Patrick Ayuso", slug: "C1900011" });
// t.push({ id: 154, label: "Eric SEIGNE (client)", slug: "C2000001" });
// t.push({ id: 154, label: "OPEN-DSI", slug: "C2000002" });
// t.push({ id: 154, label: "ATM-Consulting", slug: "C2000003" });
// t.push({ id: 154, label: "ARTICA", slug: "C2000004" });
// t.push({ id: 154, label: "Inovea Conseil", slug: "C2000005" });
// t.push({ id: 154, label: "COPIE FRANCE", slug: "C2000006" });
// t.push({ id: 154, label: "Coursodon Valérie", slug: "C2000007" });
// t.push({ id: 154, label: "Bruyère Bruno", slug: "C2000008" });
// t.push({ id: 154, label: "INFORMATIQUE-LIBRE", slug: "C2000009" });
// t.push({ id: 154, label: "DOLIBARR ASSOCIATION", slug: "C2100001" });
// t.push({ id: 154, label: "MoviDone", slug: "C2100002" });
// t.push({ id: 154, label: "ARS Administration Réseaux et Systèmes", slug: "C2100003" });
// t.push({ id: 154, label: "Netlogic", slug: "C2100004" });
// t.push({ id: 154, label: "F.M. MEDICA", slug: "C2100005" });
// t.push({ id: 154, label: "Ascott International Management (Europe)", slug: "C2100006" });
// t.push({ id: 154, label: "INFRAS", slug: "C2100007" });
// t.push({ id: 154, label: "Jeffinfo", slug: "C2100008" });
// t.push({ id: 154, label: "BATIPRO", slug: "C2100009" });
// t.push({ id: 154, label: "PRAGMA-TECH", slug: "C2100010" });
// t.push({ id: 154, label: "COMCUBE", slug: "C2100011" });
// t.push({ id: 154, label: "iNodbox", slug: "C2100012" });
// t.push({ id: 154, label: "OAS-SERVICES", slug: "C2100013" });
// t.push({ id: 154, label: "TIARIS", slug: "C2100014" });
// t.push({ id: 154, label: "Audit Process IDF", slug: "C2100015" });
// t.push({ id: 154, label: "Audit Process SO", slug: "C2100016" });
// t.push({ id: 154, label: "Fgc Concept", slug: "C2100017" });
// t.push({ id: 154, label: "SAS 2AR Architecte", slug: "C2100018" });
// t.push({ id: 154, label: "iouston", slug: "C2100019" });
// t.push({ id: 154, label: "BIOKONOPIA", slug: "C2100020" });
// t.push({ id: 154, label: "NLTechno SARL", slug: "C2100021" });
// t.push({ id: 154, label: "osinum", slug: "C2100022" });
// t.push({ id: 154, label: "BamBoo Trading & Services Co., Ltd", slug: "C2100023" });
// t.push({ id: 154, label: "Doliexperts", slug: "C2100024" });
// t.push({ id: 154, label: "NOBELCO", slug: "C2100025" });
// t.push({ id: 154, label: "CODE 42", slug: "C2100026" });
// t.push({ id: 154, label: "PDP Gestion", slug: "C2100027" });
// t.push({ id: 154, label: "L'estanquet", slug: "C2100028" });
// t.push({ id: 154, label: "LDMI", slug: "C2100029" });
// t.push({ id: 154, label: "letirol.ch", slug: "C2100030" });
// t.push({ id: 154, label: "Médias-Cité", slug: "C2100031" });
// t.push({ id: 154, label: "DRONE3XPERT", slug: "C2100032" });
// t.push({ id: 154, label: "Web Solutions", slug: "C2100034" });
// t.push({ id: 154, label: "Lexweb", slug: "C2100035" });
// t.push({ id: 154, label: "NOD SYSTEMS", slug: "C2100036" });
// t.push({ id: 154, label: "Audit Process", slug: "C2100037" });
// t.push({ id: 154, label: "Divelopper", slug: "C2100038" });
// t.push({ id: 154, label: "Etrema", slug: "C2100039" });
// t.push({ id: 154, label: "Synapse V-V", slug: "C2100040" });
// t.push({ id: 154, label: "SYSTRES CONSULTING", slug: "C2100041" });
// t.push({ id: 154, label: "Tecnoid", slug: "C2100042" });
// t.push({ id: 154, label: "Palais Des Saveurs", slug: "C2100043" });
// t.push({ id: 154, label: "Comptasimi", slug: "C2100044" });
// t.push({ id: 154, label: "Amelie mellere", slug: "C2100045" });
// t.push({ id: 154, label: "Voxis", slug: "C2100046" });
// t.push({ id: 154, label: "Alliance Automobiles", slug: "C2100048" });
// t.push({ id: 154, label: "URBANPROTECT SECURITE PRIVEE GD SUD", slug: "C2100049" });
// t.push({ id: 154, label: "Alliance Automobiles", slug: "C2100050" });
// t.push({ id: 154, label: "Le Comptoir JunaSol", slug: "C2100051" });
// t.push({ id: 154, label: "HUMAN INTELLIGENCE PORTAGE", slug: "C2100052" });
// t.push({ id: 154, label: "Datanalysis", slug: "C2100053" });
// t.push({ id: 154, label: "Ideal Solutions", slug: "C2100054" });
// t.push({ id: 154, label: "OC SOLUTIONS", slug: "C2100055" });
// t.push({ id: 154, label: "SPEC BIAGGIONI MAZZONI", slug: "C2100056" });
// t.push({ id: 154, label: "Ascier", slug: "C2100057" });
// t.push({ id: 154, label: "SAISK", slug: "C2100058" });
// t.push({ id: 154, label: "EPIC Solutions", slug: "C2100059" });
// t.push({ id: 154, label: "Antonio", slug: "C2100060" });
// t.push({ id: 154, label: "YH Consulting", slug: "C2100061" });
// t.push({ id: 154, label: "Jean Peyratout", slug: "C2100062" });
// t.push({ id: 154, label: "Sas Cuny expertises", slug: "C2100063" });
// t.push({ id: 154, label: "ERCO", slug: "C2100064" });
// t.push({ id: 154, label: "Outlook", slug: "C2100066" });
// t.push({ id: 154, label: "APLOSE", slug: "C2100067" });
// //Liste triée en amont pour se simplifier la vie
// // t.sort(function (a, b) {
// // return a.label.localeCompare(b.label);
// // });
// localStoreData("devTest", JSON.stringify(t));
feedList('listeDev', 'devTest', '');
//On créé la dialog pour ne pas avoir de pb de promise si on a la génère au vol
ons.createElement('dialogs/dialog-tag-update.html', { append: true });
ons.createElement('dialogs/dialog-tag-new.html', { append: true });
if (typeof onHold === 'undefined') {
var onHold = ons.GestureDetector(listeDev).on("hold", function (e) {
let id = e.srcElement.control.id;
let input = document.getElementById(id);
let val = JSON.parse(atob(input.value));
// alert(val);
// console.log(val);
showTagUpdateDialog(val);
});
}
/** super important: c'est la solution pour avoir le "search when you type" **/
function handleInputDev(e) {
myDebug('Search value = ' + e.target.value);
feedList('listeDev', 'devTest', this.value);
}
if (typeof input === 'undefined') {
var input = document.getElementById('searchDev');
input.oninput = handleInputDev;
}
/** end of solution pour avoir le "search when you type" **/
};
</script>
</ons-page>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment