Swiss QR Code in custom design template

Hi Hillel and Co.

I’m currently working on implementing the Swiss QR code for payments on our invoices. The information found on https://github.com/invoiceninja/invoiceninja/issues/2930 using the qr code already helps.

So far I have found the format for the Swiss QR codes: https://github.com/manuelbl/SwissQRBill.NET/blob/master/GeneratorTest/SampleQRCodeText.cs

With the “S” (structured) address format, I need to separate Company Name, Street, Street Number, ZIP Code, City by a newline (https://docs-native.qr-invoice.ch/latest/cpp_examples/build/qrinvoicebuilder-addresstypes.html).

What I’m struggling to find however is an overview of all field variables which can be used in the template. $account.name for example can be used for the Company Name, but what about the others? Is there a complete list of all available variables somewhere? I was unable to find this in the docs.

Thx

The app supports using snake case to access most of the fields, you can use the transformers in the code to see a complete list of fields.

ie, https://github.com/invoiceninja/invoiceninja/blob/master/app/Ninja/Transformers/AccountTransformer.php#L151

Thx for your response and your hint!

I am close to the solution. For the address I had to change the format from S(tructured) to K(ombined), as Invoiceninja does not split up the address1 field. This is fine though.

Some of the fields can be accessed using variables, but I’m struggling with two fields:

  • The country: I was only able to get the $account.country_id, which shows the value 756 (for Switzerland) but I need “CH”. I can workaround that by hardcoding “CH” into the QR field as invoices are only sent from one account.
  • The currency: So far I’ve not been able to retrieve the “CHF” or “EUR” value of an invoice’s currency. Here I cannot do a hard-coded workaround as invoice currencies depend on the customer. I tried it with $client.currency_id but the value is empty.

So far what I have:

      "qr": "SPC\n0200\n1\nHard-Coded-IBAN\nK\n$account.name\n$account.address1\n$account.postal_code $account.city\n\n\nCH\n\n\n\n\n\n\n\n$invoice.balance\n$client.currency_id\n\n\n\n\n\n\nNON\n\n$invoice_number\nEPD",
      "fit": "100",
      "eccLevel": "H",
      "alignment": "right"

Only the currency is left until the QR code contains the needed data.

Update: Actually the amount is also not correctly showing up. In the custom template editor $invoice.balance showed 0.00 but it doesnt seem correct. So the correct variable name is needed here, too.

Update 2: The amount to pay could be solved with https://github.com/invoiceninja/invoiceninja/issues/2930#issuecomment-526619709
So it’s only the currency missing now.

Sorry, I’m not sure it’s supported

We’ll keep the use case in mind for v5

1 Like

Thanks, I appreciate that.

As a workaround, I did the following now:

  • Added a new custom field under Clients called “Currency”
  • Edited the Clients and manually entered the currency per customer with the string variant, “CHF” for example
  • Using $client.custom_value1 to retrieve the invoices currency.

It works, but it would definitely nicer to be able to retrieve that value natively.

Thanks for sharing your workaround, nice solution!

I documented it “properly” on our blog: https://www.infiniroot.com/blog/973/implementing-swiss-payments-code-spc-qr-code-invoice-invoiceninja

Again, thanks for your help and it would indeed by cool, if v5 would offer this natively :wink:

1 Like

Hi Coren,

Sorry but I came across a problem with the invoice amount. It seems that $balanceAmount cuts the amount to nnn.n if the second decimal is a 0.
More precise with an example: This outputs the amount of 120.5 instead of 120.50.
According to the Swiss QR-Bill standard this is invalid:

The element amount has to be shown without leading zeroes inlcuding decimal separator and two decimal elements. As decimal separator only a dot (.) is valid.

Do you know which variable to use for this purpose?

Update: Found it and updated blog article :slight_smile:

Hi all

@napsty Thank you so much for your work and your written tutorial!
I want to achieve the same implementation you have done, but I am struggling to get the QR code to be shown :frowning:
It works in header, content etc, but not in the footer template.
I tried removing all styles and columns, but it still does not show up :confused:
Version is v.4.5.19

Or did something change since July @hillel?

Thanks!

4.5.18 here and the QR codes show up fine. Not sure if there was something between 4.5.18 and 4.5.19 which would break this…

But during the implementation I also noticed that the template “preview” sometimes didn’t show the changes correctly. So in between I created a new invoice to see the result in the generated PDF of that invoice. Maybe this helps.

awesome! quick reply :smiley:
No, I tried changing an invoice and it still does not show, but QR codes in other parts of the documents are shown

Hm. I’ve removed all the JSON from the invoice designer and added them back one by one and now it seems to work ¯_(ツ)_/¯

Hi Napsty,
it seems you forget one graphical detail in swiss QR code definition.
The famous swiss cross, you can find the image here: https://www.paymentstandards.ch/dam/downloads/swiss-cross.zip
Tell me if you found a idea to implement this image on invoice template.
Greetings
Franck