diff --git a/data/customer-invoice-1.jsonld b/data/customer-invoice-1.jsonld
index b6d59485653a19629616766439b0196b309f7fc6..1248d223fa3f71556eacea42e18e4147d148e19c 100644
--- a/data/customer-invoice-1.jsonld
+++ b/data/customer-invoice-1.jsonld
@@ -15,7 +15,7 @@
{ "@id": "/data/batch-2.jsonld" }
]
},
- "identifier": "F-202001",
+ "identifier": "202001",
"title": "Création plateforme Coopedia",
"state": "pending",
"tvaRate": 20,
diff --git a/data/customer-invoices.jsonld b/data/customer-invoices.jsonld
index d95e0f1f99cc932aba3471ac078bcf9849fec221..2c2e0767f9d3b076246a8c5333e4ca8af53da8a0 100644
--- a/data/customer-invoices.jsonld
+++ b/data/customer-invoices.jsonld
@@ -18,7 +18,7 @@
{ "@id": "/data/batch-2.jsonld" }
]
},
- "identifier": "F-202001",
+ "identifier": "202001",
"title": "Création plateforme Coopedia",
"state": "pending",
"tvaRate": 20,
diff --git a/locales/en.json b/locales/en.json
index 1e677365ec3b4911a218f857b4379b18625bd16c..f0c2dcd722f8e76dac4caceb96c2131d28e67527 100644
--- a/locales/en.json
+++ b/locales/en.json
@@ -62,7 +62,7 @@
"validate.delete_invoice": "Delete",
"cancel.delete_invoice": "Cancel",
"summary.totalTitle": "Billable amount without VAT",
- "summary.totalTitleHelp":" = Customer invoices - Freelancers invoices",
+ "summary.totalTitleHelp":" = Customer invoices - Freelancers invoices - Operating costs - Business contribution",
"summary.totalCustomerTitle":"Customer invoices",
"summary.totalFreelancerTitle":"Freelancers invoices",
"summary.totalFeesTitle":"Operating costs",
diff --git a/locales/fr.json b/locales/fr.json
index 7f8e364f35456e56960bbfd72bad6f996a34b63a..9286e32e4bcf9587d703a6bd499b21c86f68f77f 100644
--- a/locales/fr.json
+++ b/locales/fr.json
@@ -62,7 +62,7 @@
"validate.delete_invoice": "Supprimer",
"cancel.delete_invoice": "Annuler",
"summary.totalTitle":"Montant facturable en HT",
- "summary.totalTitleHelp":" = factures client - factures indépendants",
+ "summary.totalTitleHelp":" = factures client - factures indépendants - frais de fonctionnement - apport d'affaire",
"summary.totalCustomerTitle":"Factures client",
"summary.totalFreelancerTitle":"Factures indépendants",
"summary.totalFeesTitle":"Frais de fonctionnement",
diff --git a/solid-invoicing.js b/solid-invoicing.js
index 057be50bcdb71f3d5ec8677a5ec762fc48527f72..93b1401a21b8e7920c2dc67d3ad2d4d6caaabe33 100644
--- a/solid-invoicing.js
+++ b/solid-invoicing.js
@@ -33,9 +33,9 @@ export class SolidInvoicing extends SolidTemplateElement {
}
connectedCallback() {
- // navigate on router
+ // NAVIGATE
this.addEventListener('navigate', (e) => {
- // remove no-render to populate the recap
+ // Remove no-render to populate the recap
if (e.target === this.querySelector('#invoice-router') && e.detail.route === "invoices-summary") {
const customerDisplay = this.querySelector('#customer-invoices');
const customerForm = this.querySelector('#new-customer-invoice');
@@ -44,6 +44,8 @@ export class SolidInvoicing extends SolidTemplateElement {
if (freelancerDisplay.hasAttribute('no-render')) freelancerDisplay.removeAttribute('no-render');
if (customerForm.hasAttribute('no-render')) customerForm.removeAttribute('no-render');
}
+
+ // Calculate the totals when the edit form loads
if (e.detail.route === "edit-invoice") {
const editForm = this.querySelector('#edit-customer-invoice');
editForm.addEventListener('populate', () => {
@@ -54,6 +56,7 @@ export class SolidInvoicing extends SolidTemplateElement {
}
});
+ // CLICK
this.addEventListener('click', (e) => {
// Display invoice list
if(e.target && e.target.closest('.show-list')){
@@ -127,8 +130,9 @@ export class SolidInvoicing extends SolidTemplateElement {
}
});
- // Reactivity: subscribe batches to invoices changes
+ // WIDGET_RENDERED
this.addEventListener('widgetRendered', (e) => {
+ // Reactivity: subscribe batches to invoices changes
if (e.target.tagName === 'WIDGET-TASKS') {
const batchDisplay = e.target.closest('solid-display');
if (!batchDisplay) return;
@@ -153,7 +157,7 @@ export class SolidInvoicing extends SolidTemplateElement {
const form = e.target;
const batches = Array.from(form.querySelectorAll('widget-form-batches'));
- // BATCHES
+ // batches
for (const batch of batches) {
const tasksAmount = Array.from(batch.querySelectorAll('widget-form-tasks [name="htAmount"]'));
const total = tasksAmount.reduce((acc, task) => {
@@ -163,7 +167,7 @@ export class SolidInvoicing extends SolidTemplateElement {
htAmount += total;
}
- // TOTAL
+ // total
const totalEl = form.querySelector('widget-form-total');
totalEl.querySelector('[name="htAmount"]').setAttribute('value', htAmount.toFixed(2));
const tvaRate = form.component.value.tvaRate || 0;
@@ -239,18 +243,20 @@ export class SolidInvoicing extends SolidTemplateElement {
Promise.all([this.getTotalAmount(customerInvoices, true), this.getTotalAmount(freelancerInvoices, false)])
.then(([customerTotal, freelancerTotal]) => {
+ let recapFeesAmount = 0;
if (customerTotal) { // customer amounts
recapCustomerInvoices.innerText = customerTotal.amount.toFixed(2);
- recapFees.innerText = (customerTotal.amount * 0.05).toFixed(2);
+ recapFeesAmount = customerTotal.amount * 0.05; // TODO: make it configurable
+ recapFees.innerText = recapFeesAmount.toFixed(2);
recapBusinessProvision.innerText = (customerTotal.businessProvisionAmount).toFixed(2);
- infoBusinessProvision.innerText = `${customerTotal.businessProvision}%`
+ infoBusinessProvision.innerText = `${customerTotal.businessProvision}%`;
}
if (freelancerTotal) { // freelancer amounts
recapFreelancerInvoices.innerText = freelancerTotal.amount.toFixed(2);
}
- const recapAmount = (customerTotal.amount || 0) - (freelancerTotal.amount || 0);
+ const recapAmount = (customerTotal.amount || 0) - (freelancerTotal.amount || 0) - recapFeesAmount - (customerTotal.businessProvisionAmount ||Â 0);
recapTotal.innerText = recapAmount.toFixed(2);
if (recapAmount > 0) {
recapTotal.classList.remove('icon-dislike');
@@ -307,7 +313,7 @@ export class SolidInvoicing extends SolidTemplateElement {
this.attachPopulateListeners();
}
- template({dataSrc, routerPrefix, uploadUrl, logo}) {
+ template({ dataSrc, routerPrefix, uploadUrl }) {
let prefix = routerPrefix ? `route-prefix="${routerPrefix}"`: ''
return `
@@ -511,30 +517,31 @@ export class SolidInvoicing extends SolidTemplateElement {
</div>
</div>
<div class="segment full sm-whitespace-normal">
- <div class="segment quarter sm-full padding-right-medium">
+ <div class="segment quarter sm-full padding-right-medium text-top">
<div class="segment full padding-medium shadow total-block">
<div class="title-block text-xlarge text-color-heading text-uppercase text-bold margin-bottom-small whitespace-normal">${this.localize('summary.totalCustomerTitle')}</div>
<div class="separation-line margin-top-small margin-bottom-xsmall border-bottom border-color-third"></div>
<span class="total-block-amount text-xxlarge" id="recap-customer-invoices"></span>
</div>
</div>
- <div class="segment quarter sm-full padding-right-medium">
+ <div class="segment quarter sm-full padding-right-medium text-top">
<div class="segment full padding-medium shadow total-block">
<div class="title-block text-xlarge text-color-heading text-uppercase text-bold margin-bottom-small whitespace-normal">${this.localize('summary.totalFreelancerTitle')}</div>
<div class="separation-line margin-top-small margin-bottom-xsmall border-bottom border-color-third"></div>
<span class="total-block-amount text-xxlarge" id="recap-freelancer-invoices"></span>
</div>
</div>
- <div class="segment quarter sm-full padding-right-medium">
- <div class="segment full padding-medium shadow total-block">
+ <div class="segment quarter sm-full padding-right-medium text-top">
+ <div class="segment full padding-medium shadow total-block bp-block">
<div class="title-block text-xlarge text-color-heading text-uppercase text-bold margin-bottom-small whitespace-normal">${this.localize('summary.totalFeesTitle')}</div>
+ <div class="whitespace-normal text-large">Happy Dev Paris 5%</div>
<div class="separation-line margin-top-small margin-bottom-xsmall border-bottom border-color-third"></div>
<span class="total-block-amount text-xxlarge" id="recap-fees"></span>
</div>
</div>
- <div class="segment quarter sm-full padding-right-medium">
+ <div class="segment quarter sm-full padding-right-medium text-top">
<div class="segment full padding-medium shadow total-block bp-block">
- <div class="title-block text-xlarge text-color-heading text-uppercase text-bold whitespace-normal">${this.localize('summary.totalBusinessProvisionsTitle')}</div>
+ <div class="title-block text-xlarge text-color-heading text-uppercase text-bold margin-bottom-small whitespace-normal">${this.localize('summary.totalBusinessProvisionsTitle')}</div>
<div class="whitespace-normal text-large" id="info-business-provision"></div>
<div class="separation-line margin-top-xsmall margin-bottom-xsmall border-bottom border-color-third"></div>
<span class="total-block-amount text-xxlarge" id="recap-business-provision"></span>
diff --git a/utils/functions.js b/utils/functions.js
index 09699c850f9a94789e43f4e57e7cabe20b3ee9cd..d946abc88effd7642ecdf44b61d39066a3bb1e1c 100644
--- a/utils/functions.js
+++ b/utils/functions.js
@@ -23,7 +23,7 @@ export function getCSSVariables(document) {
* @param {string} type - accepts 'download' or 'print'
* @param {string} base_url - url of the component, used for targeting the css file
* @param {string} filename - name of the file to download
- * @returns {any} Window
+ * @returns {Window} Window
*/
export function openInvoiceWindow(type, base_url, filename) {
const downloadWindow = window.open('', 'INVOICE', 'height=400,width=600');
@@ -78,17 +78,22 @@ export function cleanInvoiceBeforeDuplicate(invoice) {
return invoice;
}
+/**
+ * Format a date for updating data
+ * @param {date} date - date to format
+ * @returns {string} date in format YYYY-MM-DD
+ */
function formatDateForPost(date) {
return date.toISOString().split('T')[0];
}
export async function getInvoiceFilename(invoice) {
if (!invoice) return 'invoice';
- const projectNumber = await invoice['project.number'];
+ const invoiceNumber = await invoice['identifier'];
const customerName = await invoice['project.customer.name'];
const invoicingDate = await invoice['invoicingDate'];
const splittedInvoicingDate = formatDateForPost(new Date(invoicingDate || null)).split('-');
// TODO: make this configurable
- return `Facture Happy Dev - ${projectNumber || '00'} - ${customerName || 'Unknown client'} - ${splittedInvoicingDate[2]}-${splittedInvoicingDate[1]}-${splittedInvoicingDate[0]}`;
+ return `Facture Happy Dev - ${invoiceNumber || '00'} - ${customerName || 'Unknown client'} - ${splittedInvoicingDate[2]}-${splittedInvoicingDate[1]}-${splittedInvoicingDate[0]}`;
}
\ No newline at end of file