Initial commit - Application CLEO de gestion de devis
- Architecture MVC avec framework maison d6 - Modules : devis, clients, marchés, SAP - Documentation initiale (README et TODO) - Configuration Composer avec dépendances 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
238
pub/res/js/jclients.js
Normal file
238
pub/res/js/jclients.js
Normal file
@@ -0,0 +1,238 @@
|
||||
//! jclients.js
|
||||
|
||||
let idClient;
|
||||
let oldIdLn;
|
||||
let oldColorLn;
|
||||
|
||||
window.addEventListener('DOMContentLoaded', (event) => {
|
||||
console.log('#');
|
||||
|
||||
//let elLigClients = document.getElementsByClassName("ligClient");
|
||||
let elCelClients = document.getElementsByClassName("celClient");
|
||||
//let elBtnModClient = document.getElementsByClassName("btnModClient");
|
||||
let elBtnQuitModClient = document.getElementById("btnQuitModClient");
|
||||
let elBtnImport = document.getElementById("btnImport");
|
||||
let elBtnCancelImport = document.getElementById("btnCancelImport");
|
||||
let elBtnSubmitImport = document.getElementById("btnSubmitImport");
|
||||
let elBtnSearch = document.getElementById("btnSearch");
|
||||
|
||||
let clickLigClient = function (e) {
|
||||
//! Event Click sur une cellule d'une ligne d'un client qui a la classe celClient
|
||||
idClient = e.getAttribute("data-rowid");
|
||||
console.log("idClient = " + idClient);
|
||||
let thisColor;
|
||||
|
||||
Array.from(elCelClients).forEach(function (lngClient) {
|
||||
if (lngClient.getAttribute("data-rowid") == oldIdLn) {
|
||||
lngClient.style.backgroundColor = oldColorLn;
|
||||
} else if (lngClient.getAttribute("data-rowid") == idClient) {
|
||||
thisColor = lngClient.style.backgroundColor;
|
||||
lngClient.style.backgroundColor = "#9bbce7";
|
||||
}
|
||||
});
|
||||
|
||||
oldColorLn = thisColor;
|
||||
oldIdLn = idClient;
|
||||
};
|
||||
|
||||
function clickModClient(e) {
|
||||
//! Fonction appelée lors du click sur un bouton de modification du tableau des Clients
|
||||
idClient = e.getAttribute("data-rowid");
|
||||
console.log("idClient = " + idClient);
|
||||
document.getElementById("loadingDiv").style.display = "block";
|
||||
// Va chercher la 1ère cellule de la ligne pour lancer la function click() => clickLigClient
|
||||
let firstCellOfRow = this.parentNode.parentNode.cells[0];
|
||||
firstCellOfRow.click();
|
||||
|
||||
let xhttp = new XMLHttpRequest();
|
||||
xhttp.open("POST", "/jxpost/load_client", true);
|
||||
xhttp.setRequestHeader("Content-Type", "application/json");
|
||||
xhttp.onreadystatechange = function () {
|
||||
if (this.readyState == XMLHttpRequest.DONE && this.status == 200) {
|
||||
// Response
|
||||
let ret = JSON.parse(this.responseText);
|
||||
if (ret.length == 1) {
|
||||
// 1 marché récupéré
|
||||
let Client = ret[0];
|
||||
document.getElementById("rowid").value = Client.rowid;
|
||||
document.getElementById("libelle").value = Client.libelle;
|
||||
document.getElementById("type_client").value = Client.type_client;
|
||||
document.getElementById("adresse1").value = Client.adresse1;
|
||||
document.getElementById("cp").value = Client.cp;
|
||||
document.getElementById("ville").value = Client.ville;
|
||||
|
||||
} else {
|
||||
showNotification("Consultation", "Erreur lors de la récupération du Client", "error");
|
||||
}
|
||||
document.getElementById("loadingDiv").style.display = "none";
|
||||
}
|
||||
};
|
||||
xhttp.send(JSON.stringify({cid: idClient}));
|
||||
showModal(document.getElementById("modalModClient"));
|
||||
}
|
||||
|
||||
//! Fonction appelée lors du click sur le bouton de fermeture de la fenêtre de modification d'un Client
|
||||
function clickQuitModClient() {
|
||||
hideModal(document.getElementById("modalModClient"));
|
||||
}
|
||||
|
||||
//! Fonction appelée lors du click sur le bouton d'importation des produits
|
||||
function clickImport() {
|
||||
showModal(document.getElementById("modalImport"));
|
||||
}
|
||||
|
||||
//! Fonction appelée lors du click sur le bouton d'annulation de l'importation des clients
|
||||
function clickCancelImport() {
|
||||
hideModal(document.getElementById("modalImport"));
|
||||
}
|
||||
|
||||
//! Fonction appelée lors du click sur le bouton de soumission de l'importation des clients
|
||||
function clickSubmitImport() {
|
||||
// TODO: prévoir une progress bar
|
||||
hideModal(document.getElementById("modalImport"));
|
||||
|
||||
showLoading();
|
||||
let xhttp = new XMLHttpRequest();
|
||||
xhttp.open("POST", "/jximport/upload_clients", true);
|
||||
xhttp.onreadystatechange = function () {
|
||||
if (this.readyState == XMLHttpRequest.DONE && this.status == 200) {
|
||||
let retour = JSON.parse(this.responseText);
|
||||
let msg = "";
|
||||
hideLoading();
|
||||
if (retour.ret == "ok") {
|
||||
msg = (retour.msg) ? retour.msg : "L'importation des clients a été effectuée avec succès";
|
||||
showNotification("Importation", msg, "success");
|
||||
} else {
|
||||
msg = (retour.msg) ? retour.msg : "Erreur lors de l'importation des clients";
|
||||
showNotification("Importation", msg, "error");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
let frmData = new FormData();
|
||||
frmData.append("file1", document.getElementById("importFile").files[0]);
|
||||
xhttp.send(frmData);
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
document.getElementById("schClients").addEventListener("keypress", function (event) {
|
||||
if (event.key === "Enter") {
|
||||
// Traitement de la touche "entrée"
|
||||
clickSearchClients();
|
||||
}
|
||||
});
|
||||
|
||||
let clickSearchClients = function () {
|
||||
document.getElementById("loadingDiv").style.display = "block";
|
||||
let search = document.getElementById("schClients").value;
|
||||
|
||||
let xhttp = new XMLHttpRequest();
|
||||
xhttp.open("POST", "/jxpost/search_clients", true);
|
||||
xhttp.setRequestHeader("Content-Type", "application/json");
|
||||
xhttp.onreadystatechange = function () {
|
||||
if (this.readyState == XMLHttpRequest.DONE && this.status == 200) {
|
||||
let retour = JSON.parse(this.responseText);
|
||||
document.getElementById("loadingDiv").style.display = "none";
|
||||
if (retour.ret) {
|
||||
showNotification("Recherche", "La recherche ne s'est pas déroulée correctement", "error");
|
||||
} else {
|
||||
let tblBody = document.getElementById("tblClients").getElementsByTagName("tbody")[0];
|
||||
// on vide le body de cette table
|
||||
tblBody.innerHTML = "";
|
||||
|
||||
if (retour.length > 0) {
|
||||
// au moins un client trouvé dans cette recherche
|
||||
let nbClients = retour.length;
|
||||
|
||||
for (let key in retour) {
|
||||
if (retour.hasOwnProperty(key)) {
|
||||
// Récupération des valeurs de la ligne
|
||||
let val = retour[key];
|
||||
|
||||
// Insertion d'une nouvelle ligne et création de ses colonnes
|
||||
let newRow = tblBody.insertRow(0);
|
||||
newRow.className = "clickable ligClient";
|
||||
newRow.setAttribute("data-rowid", val['rowid']);
|
||||
|
||||
let celEtab = newRow.insertCell(0);
|
||||
celEtab.className = "clickable celClient";
|
||||
celEtab.setAttribute("data-rowid", val['rowid']);
|
||||
celEtab.innerHTML = val['libelle'];
|
||||
let celType = newRow.insertCell(1);
|
||||
celType.className = "clickable celClient text-center";
|
||||
celType.setAttribute("data-rowid", val['rowid']);
|
||||
celType.innerHTML = val['type_client'];
|
||||
let celCP = newRow.insertCell(2);
|
||||
celCP.className = "clickable celClient text-center";
|
||||
celCP.setAttribute("data-rowid", val['rowid']);
|
||||
celCP.innerHTML = val['cp'];
|
||||
let celVille = newRow.insertCell(3);
|
||||
celVille.className = "clickable celClient";
|
||||
celVille.setAttribute("data-rowid", val['rowid']);
|
||||
celVille.innerHTML = val['ville'];
|
||||
let celAdresse = newRow.insertCell(4);
|
||||
celAdresse.className = "clickable celClient";
|
||||
celAdresse.setAttribute("data-rowid", val['rowid']);
|
||||
celAdresse.innerHTML = val['adresse1'];
|
||||
let celActions = newRow.insertCell(5);
|
||||
celActions.className = "text-center";
|
||||
celActions.innerHTML = '<button type="button" class="btn btn-primary btn-xs btnModClient" data-rowid="' + val["rowid"] + '"><i class="fa fa-edit"></i></button>';
|
||||
}
|
||||
}
|
||||
document.getElementById("pnlClientsTitre").innerHTML = '<i class="fa fa-handshake-o"></i> Liste des ' + nbClients + ' clients trouvés';
|
||||
} else {
|
||||
// Aucun produit trouvé dans cette recherche
|
||||
document.getElementById("pnlClientsTitre").innerHTML = '<i class="fa fa-handshake-o"></i> Liste des clients';
|
||||
let newRow = tblBody.insertRow(0);
|
||||
let celCode = newRow.insertCell(0);
|
||||
celCode.innerHTML = "Aucun client trouvé";
|
||||
celCode.setAttribute("colspan", "4");
|
||||
celCode.setAttribute("class", "text-center");
|
||||
}
|
||||
|
||||
showNotification("Recherche", "Recherche terminée", "success");
|
||||
}
|
||||
}
|
||||
}
|
||||
let data = {search: search};
|
||||
xhttp.send(JSON.stringify(data));
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
let mutationObserver = new MutationObserver(function (mutations) {
|
||||
|
||||
});
|
||||
|
||||
// Starts listening for changes in the root HTML element of the page.
|
||||
mutationObserver.observe(document.getElementById("tblClients"), {
|
||||
childList: true,
|
||||
subtree: true,
|
||||
attributes: true,
|
||||
});
|
||||
|
||||
document.getElementById("tblClientsBody").addEventListener("click", function (event) {
|
||||
if (event.target && event.target.nodeName == "TD") {
|
||||
clickLigClient(event.target);
|
||||
} else if (event.target && event.target.nodeName == "BUTTON") {
|
||||
clickModClient(event.target);
|
||||
}
|
||||
});
|
||||
|
||||
//! Sur chaque cellule du tableau des clients ayant la classe celClient, on affecte un événement click qui appelle la fonction clickLigClient()
|
||||
//Array.from(elCelClients).forEach(function (lnClient) {
|
||||
//lnClient.addEventListener('click', clickLigClient);
|
||||
//});
|
||||
|
||||
//! Sur chaque bouton de modification du tableau des clients, on affecte un événement click qui appelle la fonction clickModClient()
|
||||
//Array.from(elBtnModClient).forEach(function (modClient) {
|
||||
// modClient.addEventListener('click', clickModClient);
|
||||
//});
|
||||
|
||||
elBtnImport.addEventListener('click', clickImport);
|
||||
elBtnCancelImport.addEventListener('click', clickCancelImport);
|
||||
elBtnSubmitImport.addEventListener('click', clickSubmitImport);
|
||||
elBtnQuitModClient.addEventListener('click', clickQuitModClient);
|
||||
elBtnSearch.addEventListener('click', clickSearchClients);
|
||||
});
|
||||
Reference in New Issue
Block a user