[IMP] account*: update invoice page view on customer portal

*account_payment, l10_in(_sale), sale(_stock), web

With this commit:
The invoice preview in portal (/my/invoices..) is now the HTML version of the
PDF report.
The HTML preview is based on the invoice report to closely match what is
already done in Odoo.

The invoice preview is displayed in an 'iframe', it is mandatory since:
1. Reports are rendered as a separate page as it returns the whole page after
   rendering, which has tag <html>, <head> etc
2. Reports are having their own layouts and their own assets that we we cannot
   load in the page directly or it will break the website layout.
3. We can not use report template with t-call because internally reports are
   using extra params like context_timestamp, company, DateTime, user etc which
   is used in header/footer

--

There will be a chatter (as a modal) to display/see the history of the document

--

For responsive purpose, we use new tables with limited column (Description,
Quantity and Amount) for responsive purpose (small screen).
It also adds some bootstrap classes to reports for responsive purpose.

--

The 'Pay Now' button remains if you already paid with 'wire transfer'.
(It disappears for Credit Note)

--

Add margin after the header and before the footer to look like the real printed
document, without alterating the real printed version

--

In every portal module, the pager is now generic in the generic breadcrump

--

Task ID: 39876
Closes #24938

4 files changed, 14 insertions, 5 deletions

diff --git a/addons/web/static/src/scss/layout_boxed.scss b/addons/web/static/src/scss/layout_boxed.scss
index f3aa7601107..fae631cda6a 100644
--- a/addons/web/static/src/scss/layout_boxed.scss
+++ b/addons/web/static/src/scss/layout_boxed.scss
@@ -15,6 +15,7 @@
     }
 }
 .o_boxed_footer {
+    margin-top: 200px;
     white-space: nowrap;
     border-top: 3px solid $gray;
     ul {
diff --git a/addons/web/static/src/scss/layout_clean.scss b/addons/web/static/src/scss/layout_clean.scss
index ecbdb02153f..03ce4c993b9 100644
--- a/addons/web/static/src/scss/layout_clean.scss
+++ b/addons/web/static/src/scss/layout_clean.scss
@@ -3,6 +3,7 @@
     color: #000;
 }
 .o_clean_header {
+    border-bottom: 1px solid $o-brand-primary;
     img {
         max-height: 90px;
         max-width: 300px;
@@ -10,6 +11,7 @@
 }
 .o_clean_footer {
     margin: 0 3px;
+    margin-top: 200px;
     border-top: 3px solid $o-brand-primary;
     h4 {
         color: $o-brand-primary;
diff --git a/addons/web/static/src/scss/layout_standard.scss b/addons/web/static/src/scss/layout_standard.scss
new file mode 100644
index 00000000000..acc0e07bf1c
--- /dev/null
+++ b/addons/web/static/src/scss/layout_standard.scss
@@ -0,0 +1,3 @@
+.o_standard_footer {
+    margin-top: 200px;
+}
diff --git a/addons/web/views/report_templates.xml b/addons/web/views/report_templates.xml
index 9347dff1c07..5c08be5df9f 100644
--- a/addons/web/views/report_templates.xml
+++ b/addons/web/views/report_templates.xml
@@ -19,10 +19,13 @@
 
         <link href="/web/static/lib/fontawesome/css/font-awesome.css" rel="stylesheet" type="text/css"/>
 
+
         <link rel="stylesheet" type="text/scss" href="/web/static/src/scss/report.scss"/>
+        <link rel="stylesheet" type="text/scss" href="/web/static/src/scss/layout_standard.scss"/>
         <link rel="stylesheet" type="text/scss" href="/web/static/src/scss/layout_background.scss"/>
         <link rel="stylesheet" type="text/scss" href="/web/static/src/scss/layout_boxed.scss"/>
         <link rel="stylesheet" type="text/scss" href="/web/static/src/scss/layout_clean.scss"/>
+
     </template>
 
     <template id="report_assets_pdf">
@@ -173,7 +176,7 @@
                     <li t-if="company.vat"><i class="fa fa-building-o"/><t t-esc="company.country_id.vat_label or 'TIN'"/>: <span t-field="company.vat"/></li>
                 </ul>
                 <div t-field="company.report_footer"/>
-                <div class="text-muted">
+                <div t-if="not type_html" class="text-muted">
                     Page:
                     <span class="page"/>
                     of
@@ -212,7 +215,7 @@
                     <li t-if="company.vat"><t t-esc="company.country_id.vat_label or 'TIN'"/>: <span t-field="company.vat"/></li>
                 </ul>
                 <div t-field="company.report_footer"/>
-                <div>
+                <div t-if="not type_html">
                     Page: <span class="page"/> / <span class="topage"/>
                 </div>
             </div>
@@ -254,7 +257,7 @@
                     <h4 class="mt0 mb0 text-uppercase" t-field="company.report_header"/>
                 </div>
                 <div class="col-xs-1">
-                    <ul class="list-inline pagenumber pull-right text-center">
+                    <ul t-if="not type_html" class="list-inline pagenumber pull-right text-center">
                         <li><strong><span class="page"/></strong></li>
                     </ul>
                 </div>
@@ -288,7 +291,7 @@
             <t t-raw="0" />
         </div>
 
-        <div class="footer">
+        <div class="footer o_standard_footer">
             <div class="text-center" style="border-top: 1px solid black;">
                 <ul class="list-inline mb4">
                     <li t-if="company.phone">Phone: <span t-field="company.phone"/></li>
@@ -301,7 +304,7 @@
                     <span t-field="company.report_footer"/>
                 </div>
 
-                <div class="text-muted">
+                <div t-if="not type_html" class="text-muted">
                     Page: <span class="page"/> / <span class="topage"/>
                 </div>
             </div>