Yep they all have dual monitors so they could potentially check customer tab in the first instance.
I made an extension that grabs the current debt of the customer and puts it below the invoice’s total in a small table (made with a custom theme) on the view screen. I also subtract the invoice total from current debt and show it as previous debt. It sounds wacky but it works really well for my work environment.
1 Like
It would be nice if you could share the code with us.
Sure, I learned a lot here so it feels right to share:
const url = 'http://127.0.0.1:55667/customers?ogYl2qnYp9ix2q_blduMINio25XZh9in2LEgQmFoYXIgRmFjdG9yecAMAMgM_____wc'
var x = document.querySelector("#printable-content > table:nth-child(1) > thead > tr:nth-child(1) > td > table:nth-child(2) > tbody > tr > td:nth-child(1) > div:nth-child(1) > b:nth-child(1)").textContent;
fetch(url).then(function (response) {
return response.text();
}).then(function (html) {
// Convert the HTML string into a document object
var parser = new DOMParser();
var doc = parser.parseFromString(html, 'text/html');
var y = doc.querySelector("#table > div.overflow-x-auto.lg\\:overflow-visible.no-scrollbar > table");
// Getting data from spans
var appendText = [];
const nodeList = y.querySelectorAll("span");
for (let i = 0; i < nodeList.length; i++) {
appendText.push(nodeList[i].textContent);
}
var itemsObj = {items:appendText};
items = JSON.stringify(itemsObj);
var match = appendText.indexOf(x);
var currentdept = appendText.at(match+11).replaceAll("IQD ", "").replaceAll(",", "").replaceAll('NaN', 0.00 ).replaceAll(' ', '');
var invoicetotal = document.querySelector("#printable-content > table:nth-child(2) > tbody:last-child tr:nth-last-child(1) td:last-child").textContent.replaceAll("IQD ", "").replaceAll(",", "");
var debt = Number(currentdept) - Number(invoicetotal)
var prevoiusdept = debt.toLocaleString('en-US').replaceAll('NaN', 0.00 ).replaceAll(' ', '');
//var row1 = document.querySelector("#printable-content > table:last-child > tbody > tr:nth-child(1)");
//var row = table.insertRow(1);
//var cell1 = row1.insertCell(1);
//cell1.innerHTML = prevoiusdept.toLocaleString('en-US');
//cell1.style.textAlign = "left";
//cell1.style.fontWeight = "800";
//cell1.style.paddingLeft = '10px';
//var z = Array.from(document.querySelectorAll(' tbody > tr:nth-child(1)')).find(el => el.textContent === 'current debt');
//console.log(z);
var row1 = document.querySelector("#printable-content > table:last-child > tbody > tr:nth-child(1)");
var row2 = document.querySelector("#printable-content > table:last-child > tbody > tr:nth-child(2)");
var row1cell2 = row1.insertCell(1);
row1cell2.innerHTML = prevoiusdept + ' IQD';
row1cell2.style.textAlign = "left";
row1cell2.style.fontWeight = "bold";
row1cell2.style.paddingLeft = '10px';
row1cell2.style.color = "#AF0000";
row1cell2.style.borderBottom = "thin solid #AF0000";
var row2cell2 = row2.insertCell(1);
row2cell2.innerHTML = String(Number(currentdept).toLocaleString('en-US')).replaceAll('NaN', 0.00 ) + ' IQD';
row2cell2.style.textAlign = "left";
row2cell2.style.fontWeight = "bold";
//row2cell2.style.paddingLeft = '10px';
row2cell2.style.color = "#AF0000";
row1cell2.style.borderBottom = "thin solid #AF0000";
row2.style.fontSize = "large";
row2cell2.style.padding = "12px 0px 0px 5px";
}).catch(function (err) {
// There was an error
alert('Something went wrong.', err);
});
My layout is RTL so you might need to make some changes to make it work for you.
You will also need to create a table at the bottom of your custom theme like this
{% if title == "پسوڵەی فرۆشتن" %}
<table align="left"
style="width: 35%;
font-family: Noto Naskh Arabic; text-align: right; vertical-align: middle;
border-color: #AF0000;
border-width: 1px;
font-weight: bold; font-size: 16px;
margin-left: 30px;
margin-bottom: 30px;
margin-right: 350px;
border-radius: 5px 5px 5px 5px;
position: realative;
padding: 10px;
padding-top: 12px;
font-weight: bold;
">
<tbody>
<tr>
<td style = "border-bottom: thin solid #AF0000; font-weight: bold; color: #810000;"> Previous debt
</td>
</tr>
<tr>
<td style = "padding-top: 12px; font-weight: bold; color: #810000;">Current debt
</td>
</tr>
</tbody>
</table>
{% else %}
{% continue %}
{% endif %}
</tbody>
</table>
I couldn’t make it work using the extension alone without involving a custom theme. Hopefully, the more experienced programmers here could make that work for us 
2 Likes
So now that custom themes are in the obsolete category and would not work this solution will prevent anyone upgrading to newer versions. Maybe it is time to wait further development by @Lubos to review Manager’s ability to give us back some control without having the forum flood with support for custom themes, etc. I think that the idea is to have a more robust application that is much more intuitive for the average user and works mostly out of the box. Many of still would require some theming options for our invoices, receipts and payments and even added (such as Logo) to reports. This can be basic like many other applications where you can select a logo, background, font, etc. but no longer code anything yourself.
For reports it would be much more tricky to standardize as one can see from the many customization needs. The way currently we create “queries” is lacking and confusing and as @Lubos indicated will be improved.
Having outstanding account data could be great in some instances. However a simple alert if some customer invoices are past due date would be sufficient in our case to trigger a response to question the customer’s account status right away.
The fact that themes have become obsolete is not so attractive to us to use them as a solution.
We have the same issue. In my topic about another similar issue @Ealfardan suggests:
I know that in a busy retail environment anything that takes slightly longer is likely to not get done, but we’re going to see if this works for us.
Ya @GrahamvdR That’s an option, but if you read carefully the rightly explained by @compuit, the user won’t be in a position to search the reports of each and every customer who arrives in a faster environment.
And ever since the themes moved to obsolete features the solution can be just to bring the total outstanding amount to the last line of the current invoice. Maybe this can be made as an option to be selected by the admin or even the user. (To select or deselect the option at the Invoice form)
This is only possible if the developers are convinced
Maybe the solution to this problem would be for the developer to include a direct link to the customer’s unpaid invoice statement on the invoice view screen. Then the user would be able to select the “Copy to” New Receipt to enable inclusion of past outstanding amounts.
3 Likes
How do i get this url for my manager?
Go to the Customers tab > right click anywhere on the page > Properties > copy the Address (URL).
Are you talking about the link inside red box? because I did not see “properties” option anywhere after right click in the customer tab screen
And if this is actually the required link, then why is it that there is " FileID=" in between of this link, whereas in @BawarYassin link its not?
Yes that is the link but make sure it is the link to the total number of customers like this
You must have a customer code on your invoice view screen because this is what I’m using to find the matching name in the customers list.
I have my customers’ debt in the 11th column. So you need to change the column number in match+11 in the code below to suit the column number you want.
var currentdept = appendText.at(match+11).replaceAll("IQD ", "").replaceAll(",", "").replaceAll('NaN', 0.00 ).replaceAll(' ', '');
is it compulsory that customer code should appear before customer name in sales invoice view screen? or is it also fine if the code appears after the name & address??
and how many column should i consider in my customer list which i uploaded in my last post above? 8 or 10? i am confused whether we count “edit” & “view” column also or not…
For my code yes but you can modify it. I am using basic web scraping to find the elements (in this case it’s customer code) I advise you to hire a programmer if you don’t know how to do it.
try with column 4 see what you get and figure it out from there.
@BawarYassin can we follow above method of web scraping to capture and insert/print username(whoever is currently logged in) on the invoice? I tried to achieve it taking history page table, but only to find out values in user & timestamp column are not the part of node list that we are iterating through. It is returning only values from description or action column of history page.
Any help from you or from other member in this forum will be highly appreciated. Thanks.
Every page in manager has logged in username at top right corner beside ‘logout’. I wonder if we can use that somehow…
@romangarg Yes you can, I use this myself. But it’s on you to figure out the placement.
Edit: I was getting the username instead of the account name in my original code. so if you just want the account name the code could be simpler.
// Get Username
var currentUser = document.querySelector("body > div.overflow-x-auto.lg\\:overflow-visible.no-scrollbar.print\\:hidden.font-bold.bg-gradient-to-b.from-white.to-neutral-100.shadow.shadow-neutral-400.dark\\:bg-none.dark\\:bg-slate-700.dark\\:shadow-none > div > div.flex.justify-end > a:nth-child(1)").textContent;
// Placement of the Username
var placement1 = document.querySelector("#printable-content > table > thead > tr:nth-child(1) > td > table:nth-child(2) > tbody > tr");
var placement1cell1 = placement1.insertCell(1);
placement1cell1.innerHTML = currentUser;
1 Like
Thank you so much for sharing. Will give it a try…