Commit d378cd28 by Damien Moulard

Merge branch '1886-update-envelops' into 'dev_cooperatic'

create interface to update an envelop + refactoring

See merge request !115
parents ac15ae1e a93bd4aa
Pipeline #1755 failed with stage
in 1 minute 36 seconds
#cash, #ch {
margin-top: 15px;
}
.envelop_section {
margin-bottom: 10px;
}
......@@ -16,6 +20,70 @@
margin-top: 30px;
}
.update_envelop_button, .delete_envelop_button {
margin: 0 0 10px 15px;
}
.envelop_content_list {
margin: 20px 0 15px 0;
}
/* Update envelop modal */
.envelop_lines {
margin: 20px 0;
display: flex;
flex-direction: column;
align-items: center;
}
.update_envelop_line {
margin: 5px 0;
width: 60%;
display: flex;
position: relative;
}
.deleted_line_through {
border-bottom: 1px solid #d9534f;
position: absolute;
content: "";
width: 95%;
height: 50%;
display: none;
}
.update_envelop_line div {
flex: 50% 1 0;
}
.line_partner_name_container {
display: flex;
justify-content: flex-start;
align-items: center;
}
.line_partner_name {
text-align: left;
padding: 0 5px;
}
.line_partner_input_container {
display: flex;
align-items: center;
}
.delete_envelop_line_icon {
margin-left: 10px;
color: #d9534f;
cursor: pointer;
}
.envelop_comments {
width: 60%;
margin-bottom: 20px;
}
/* Accordion style */
/* Style the buttons that are used to open and close the accordion panel */
.accordion {
......@@ -23,7 +91,6 @@
color: #212529;
cursor: pointer;
padding: 18px;
/* width: 80%; */
text-align: left;
border: none;
outline: none;
......@@ -32,7 +99,6 @@
.archive_button {
padding: 18px;
/* width: 20%; */
}
hr {
......
var cash_envelops = [];
var ch_envelops = [];
var envelop_to_update = null;
function reset() {
$('#cash_envelops').empty();
......@@ -12,7 +13,8 @@ function toggle_error_alert() {
$('#envelop_cashing_error').toggle(250);
}
function toggle_success_alert() {
function toggle_success_alert(message) {
$('#envelop_cashing_success').find(".success_alert_content").text(message);
$('#envelop_cashing_success').toggle(250);
}
......@@ -20,7 +22,48 @@ function toggle_deleted_alert() {
$('#envelop_deletion_success').toggle(250);
}
// Set an envelop content on the document
/**
* Get an envelop from the cash or cheque lists dependings on the params
* @param {String} type
* @param {String} index
* @returns
*/
function get_envelop_from_type_index(type, index) {
if (type === "cash") {
return cash_envelops[index];
} else {
return ch_envelops[index];
}
}
/**
* Define a name for an envelop depending on its type, with or with its type
* @param {Object} envelop
* @param {String} name_type short | long
* @returns
*/
function get_envelop_name(envelop, name_type = 'short') {
let envelop_name = "";
if (envelop.type === "cash") {
let split_id = envelop._id.split('_');
let envelop_date = split_id[3].padStart(2, '0') + "/" + split_id[2].padStart(2, '0') + "/" + split_id[1];
envelop_name = `Enveloppe${(name_type === "short") ? "" : " de liquide"} du ${envelop_date}`;
} else if (envelop.type == "ch") {
envelop_name = `Enveloppe${(name_type === "short") ? "" : " de chèques"} #${envelop.display_id}`;
}
return envelop_name;
}
/**
* Set the envelops contents on the document (could use a little cleanup someday: don't generate html in js, etc...)
* @param {Object} envelop
* @param {String} envelop_name
* @param {Int} envelop_content_id
* @param {Int} envelop_index
*/
function set_envelop_dom(envelop, envelop_name, envelop_content_id, envelop_index) {
var envelops_section = $('#' + envelop.type + '_envelops');
......@@ -37,14 +80,14 @@ function set_envelop_dom(envelop, envelop_name, envelop_content_id, envelop_inde
// Allow checking for all cash and first check envelops
if (envelop.type == 'cash' || envelop.type == 'ch' && envelop_index == 0) {
new_html += '<button class="accordion w80">' + envelop_name + ' - <i>' + total_amount + '€</i></button>'
+ '<button class="btn--success archive_button item-fluid" onClick="openModal(\'<h3>Êtes-vous sûr ?</h3>\', function() {archive_envelop(\'' + envelop.type + '\', ' + envelop_index + ');}, \'Encaisser\')">Encaisser</button>';
+ '<button class="btn--success archive_button item-fluid" onClick="openModal(\'<h3>Êtes-vous sûr ?</h3>\', function() {archive_envelop(\'' + envelop.type + '\', ' + envelop_index + ');}, \'Encaisser\', false)">Encaisser</button>';
} else {
new_html += '<button class="accordion w100">' + envelop_name + ' - <i>' + total_amount + '€</i></button>';
}
new_html += '</div>'
+ '<div class="panel panel_' + envelop_content_id + '"><ol id="' + envelop_content_id + '"></ol></div>'
+ '</div>';
+ '<div class="panel panel_' + envelop_content_id + '"><ol class="envelop_content_list" id="' + envelop_content_id + '"></ol></div>'
+ '</div>';
$(new_html).appendTo(envelops_section);
......@@ -64,10 +107,44 @@ function set_envelop_dom(envelop, envelop_name, envelop_content_id, envelop_inde
}
let envelop_panel = $(`.panel_${envelop_content_id}`);
envelop_panel.append('<button class="btn--danger delete_envelop_button item-fluid" onClick="openModal(\'<h3>Supprimer enveloppe ?</h3>\', function() {delete_envelop(\'' + envelop.type + '\', ' + envelop_index + ');}, \'Supprimer\')">Supprimer l\'enveloppe</button>');
envelop_panel.append(`<button class="btn--danger delete_envelop_button item-fluid" id="update_envelop_${envelop.type}_${envelop_index}">Supprimer l'enveloppe</button>`);
envelop_panel.append(`<button class="btn--primary update_envelop_button item-fluid" id="update_envelop_${envelop.type}_${envelop_index}">Modifier</button>`);
$(".update_envelop_button").off("click");
$(".update_envelop_button").on("click", function() {
let el_id = $(this).attr("id").split("_");
envelop_to_update = {
type: el_id[2],
index: el_id[3],
lines_to_delete: []
}
set_update_envelop_modal();
});
$(".delete_envelop_button").off("click");
$(".delete_envelop_button").on("click", function() {
let el_id = $(this).attr("id").split("_");
let type = el_id[2];
let index = el_id[3];
let envelop = get_envelop_from_type_index(type, index);
openModal(
"<h3>Supprimer l'enveloppe ?</h3>",
function() {
delete_envelop(envelop);
},
'Supprimer'
);
});
}
// Set the envelops data according to their type
/**
* Given the raw list of envelop documents, generate the cash and cheque lists
* @param {Array} envelops
*/
function set_envelops(envelops) {
var cash_index = 0;
var ch_index = 0;
......@@ -79,9 +156,7 @@ function set_envelops(envelops) {
if (envelop.type == "cash") {
cash_envelops.push(envelop);
let split_id = envelop._id.split('_');
let envelop_date = split_id[3] + "/" + split_id[2] + "/" + split_id[1];
let envelop_name = 'Enveloppe du ' + envelop_date;
let envelop_name = get_envelop_name(envelop);
let envelop_content_id = 'content_cash_list_' + cash_index;
set_envelop_dom(envelop, envelop_name, envelop_content_id, cash_index);
......@@ -90,7 +165,7 @@ function set_envelops(envelops) {
} else if (envelop.type == "ch") {
ch_envelops.push(envelop);
let envelop_name = 'Enveloppe #' + envelop.display_id;
let envelop_name = get_envelop_name(envelop);
let envelop_content_id = 'content_ch_list_' + ch_index;
set_envelop_dom(envelop, envelop_name, envelop_content_id, ch_index);
......@@ -125,18 +200,112 @@ function set_envelops(envelops) {
}
}
function delete_envelop(type, index) {
if (is_time_to('delete_envelop', 1000)) {
openModal();
/**
* Generate content & set listeners for the modal to update an envelop
*/
function set_update_envelop_modal() {
let envelop = get_envelop_from_type_index(envelop_to_update.type, envelop_to_update.index);
let envelop_name = get_envelop_name(envelop, 'long');
let modal_update_envelop = $('#templates #modal_update_envelop');
modal_update_envelop.find(".envelop_name").text(envelop_name);
modal_update_envelop.find(".envelop_lines").empty();
let update_line_template = $('#templates #update_envelop_line_template');
let cpt = 1;
for (let partner_id in envelop.envelop_content) {
let line = envelop.envelop_content[partner_id];
update_line_template.find(".update_envelop_line").attr('id', `update_line_${partner_id}`);
update_line_template.find(".line_number").html(`${cpt}.&nbsp;`);
update_line_template.find(".line_partner_name").text(line.partner_name);
modal_update_envelop.find(".envelop_lines").append(update_line_template.html());
cpt += 1;
}
openModal(
modal_update_envelop.html(),
() => {
update_envelop();
},
'Mettre à jour',
true,
true,
() => {
envelop_to_update = null;
}
);
// Elements needs to be on the document so value & listeners can be set
for (let partner_id in envelop.envelop_content) {
let line = envelop.envelop_content[partner_id];
$(`#update_line_${partner_id}`).find('.line_partner_amount').val(line.amount);
}
modal.find('.envelop_comments').val((envelop.comments !== undefined) ? envelop.comments : '');
$(".delete_envelop_line_icon").off("click");
$(".delete_envelop_line_icon").on("click", function() {
let line_id = $(this).closest(".update_envelop_line").attr("id").split("_");
let partner_id = line_id[line_id.length-1];
envelop_to_update.lines_to_delete.push(partner_id);
$(this).hide();
$(this).closest(".update_envelop_line").find(".deleted_line_through").show();
})
}
var envelop = null;
if (type == "cash") {
envelop = cash_envelops[index];
} else {
envelop = ch_envelops[index];
/**
* Update an envelop in couchdb
*/
function update_envelop() {
if (is_time_to('update_envelop', 1000)) {
let envelop = get_envelop_from_type_index(envelop_to_update.type, envelop_to_update.index);
// Update lines amounts
let amount_inputs = modal.find('.line_partner_amount');
amount_inputs.each(function (i,e) {
let line_id = $(e).closest(".update_envelop_line").attr("id").split("_");
let partner_id = line_id[line_id.length-1];
envelop.envelop_content[partner_id].amount = parseInt($(e).val());
});
// Delete lines
for (let partner_id of envelop_to_update.lines_to_delete) {
delete(envelop.envelop_content[partner_id])
}
// Envelop comments
envelop.comments = modal.find('.envelop_comments').val();
dbc.put(envelop, function callback(err, result) {
envelop_to_update = null;
if (!err && result !== undefined) {
get_envelops();
toggle_success_alert("Enveloppe modifiée !");
} else {
alert("Erreur lors de la mise à jour de l'enveloppe. Si l'erreur persiste contactez un administrateur svp.");
console.log(err);
}
});
}
}
/**
* Delete an envelop from couchdb.
* @param {Object} envelop
*/
function delete_envelop(envelop) {
if (is_time_to('delete_envelop', 1000)) {
envelop._deleted = true;
dbc.put(envelop, function callback(err, result) {
if (!err && result !== undefined) {
toggle_deleted_alert();
......@@ -150,6 +319,11 @@ function delete_envelop(type, index) {
}
}
/**
* Send the request to save an envelop payments in Odoo. The envelop will be deleted from couchdb.
* @param {String} type
* @param {String} index
*/
function archive_envelop(type, index) {
if (is_time_to('archive_envelop', 1000)) {
$('#envelop_cashing_error').hide();
......@@ -157,11 +331,7 @@ function archive_envelop(type, index) {
// Loading on
openModal();
if (type == "cash") {
envelop = cash_envelops[index];
} else {
envelop = ch_envelops[index];
}
let envelop = get_envelop_from_type_index(type, index);
// Proceed to envelop cashing
$.ajax({
......@@ -204,7 +374,7 @@ function archive_envelop(type, index) {
}
if (display_success_alert) {
toggle_success_alert();
toggle_success_alert("Enveloppe encaissée !");
}
},
error: function() {
......@@ -215,7 +385,9 @@ function archive_envelop(type, index) {
}
}
// Get all the envelops from couch db
/**
* Get all the envelops from couchdb
*/
function get_envelops() {
dbc.allDocs({
include_docs: true,
......@@ -223,26 +395,26 @@ function get_envelops() {
}).then(function (result) {
set_envelops(result.rows);
})
.catch(function (err) {
alert('Erreur lors de la récupération des enveloppes.');
console.log(err);
});
.catch(function (err) {
alert('Erreur lors de la récupération des enveloppes.');
console.log(err);
});
}
// Hande change in couc db
sync.on('change', function (info) {
// handle change
if (info.direction == 'pull') {
get_envelops();
}
}).on('error', function (err) {
// handle error
console.log('erreur sync');
console.log(err);
});
$(document).ready(function() {
if (typeof must_identify == "undefined" || coop_is_connected()) {
get_envelops();
// Hande change in couc db
sync.on('change', function (info) {
// handle change
if (info.direction == 'pull') {
get_envelops();
}
}).on('error', function (err) {
// handle error
console.log('erreur sync');
console.log(err);
});
}
});
......@@ -2492,6 +2492,21 @@ $(document).ready(function() {
alert('Erreur lors de la récupération des articles, rechargez la page plus tard');
}
});
$(document).on('click', '.accordion', function(){
/* Toggle between adding and removing the "active" class,
to highlight the button that controls the panel */
this.classList.toggle("active");
/* Toggle between hiding and showing the active panel */
var panel = this.nextElementSibling;
if (panel.style.display === "block") {
panel.style.display = "none";
} else {
panel.style.display = "block";
}
});
} else {
$('#not_connected_content').show();
}
......
......@@ -460,22 +460,6 @@ for (i = 0; i < acc.length; i++) {
});
}
$(document).on('click', '.accordion', function(){
/* Toggle between adding and removing the "active" class,
to highlight the button that controls the panel */
this.classList.toggle("active");
/* Toggle between hiding and showing the active panel */
var panel = this.nextElementSibling;
if (panel.style.display === "block") {
panel.style.display = "none";
} else {
panel.style.display = "block";
}
console.log(panel)
});
function report_JS_error(e, m) {
try {
$.post('/log_js_error', {module: m, error: JSON.stringify(e)});
......
......@@ -17,7 +17,7 @@
<div style="width: 10%" class="fr txtright"><i class="fas fa-times"></i></div>
</div>
<div id="envelop_cashing_success" class="alert--success clearfix custom_alert" onClick="toggle_success_alert()">
<div style="width: 90%" class="fl txtleft">Enveloppe encaissée !</div>
<div style="width: 90%" class="fl txtleft success_alert_content">Enveloppe encaissée !</div>
<div style="width: 10%" class="fr txtright"><i class="fas fa-times"></i></div>
</div>
<div id="envelop_deletion_success" class="alert--success clearfix custom_alert" onClick="toggle_deleted_alert()">
......@@ -41,6 +41,33 @@
</section>
</section>
<div id="templates" style="display:none;">
<div id="modal_update_envelop">
<div class="modal_update_envelop_content">
<h3 class="envelop_name"></h3>
<div class="envelop_lines"></div>
<div class="envelop_comments_area">
<p>Commentaires</p>
<textarea class="envelop_comments"></textarea>
</div>
</div>
</div>
<div id="update_envelop_line_template">
<div class="update_envelop_line">
<div class="line_partner_name_container">
<span class="line_number"></span>
<span class="line_partner_name"></span>
</div>
<div class="line_partner_input_container">
<input type="text" class="line_partner_amount" placeholder="Montant">
<i class="fas fa-trash-alt fa-lg delete_envelop_line_icon"></i>
</div>
<div class="deleted_line_through"></div>
</div>
</div>
</div>
<script src="{% static "js/pouchdb.min.js" %}"></script>
<script type="text/javascript">
{%if must_identify %}
......
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