Odoo19生成KHQR HTML报告 - xiaohao0576/odoo-doc GitHub Wiki

创建html报表动作

image

创建Qweb

image

Qweb的内容如下

<t>
&lt;!DOCTYPE html&gt;
<html>
  <head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>KHQR</title>
    
    <!--加载字体-->
    <link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000" rel="stylesheet"/>
    <link href="https://fonts.googleapis.com/css2?family=Hanuman:[email protected]" rel="stylesheet"/>
    
    <style>
        .khqr-content {
            background: #fff;
            border-radius: 22px;
            box-shadow: 0 8px 16px rgba(0, 0, 0, .08);
            height: 380px;
            width: 262px
        }
        
        .uk-flex {
            display: flex
        }
        
        .uk-flex-column {
            flex-direction: column
        }
        
        .khqr-banner {
            background: #e1232e;
            border-top-left-radius: 22px;
            border-top-right-radius: 22px;
            height: 47.52px
        }
        
        .uk-flex-middle {
            align-items: center
        }
        
        .uk-flex-center {
            justify-content: center
        }
        
        .uk-flex-right {
            justify-content: flex-end
        }
        
        .triangle-top-right {
            border-left: 22.86px solid transparent;
            border-top: 22.86px solid #e21a1a;
            height: 0;
            width: 0
        }
        
        .merc-khqr-info {
            font-family: "Nunito Sans", "Battambang";
            padding: 0 8px 0 39px
        }
        
        .uk-text-14 {
            font-size: 14px
        }
        
        .uk-text-weight600 {
            font-weight: 600 !important
        }
        
        .total-amount-khqr {
            font-size: 25px;
            font-weight: 700
        }
        
        .uk-margin-8-top {
            margin-top: 8px !important
        }
        
        .line-divider {
            background-image: url(https://raw.githubusercontent.com/xiaohao0576/blog/b195121e513e99340c45417527a3922c16423272/images/khqr-line-divider.svg);
            height: 1px;
            margin-top: 18px;
            width: 100%
        }
        
        .uk-height-1-1 {
            height: 100%
        }
        
        .uk-animation-fade {
            animation-name: uk-fade;
            animation-duration: .8s;
            animation-timing-function: linear
        }
        
        .uk-position-absolute {
            position: absolute !important
        }
        
        .z-1 {
            z-index: 1
        }
    </style>
  </head>
  <body>
    <div t-foreach="docs" t-as="doc" class="khqr-content uk-flex uk-flex-column">
        <div>
            <div class="khqr-banner uk-flex uk-flex-center uk-flex-middle"><img src="https://raw.githubusercontent.com/xiaohao0576/blog/f76ef4493e4905af25ae88cfad395112754a84ce/images/khqr-icon.svg" alt="KHQR"/></div>
            <div class="uk-flex uk-flex-right">
                <div class="triangle-top-right"/>
            </div>
            <div class="merc-khqr-info"><span class="uk-text-14 uk-text-weight600"><t t-out="doc.payment_method_id.journal_id.bank_account_id.partner_id.name"/></span>
                <div class="total-amount-khqr uk-margin-8-top"><span><t t-esc="doc.amount" t-options="{&quot;widget&quot;: &quot;monetary&quot;, &quot;display_currency&quot;: doc.currency_id }"/></span></div>
            </div>
            <div class="line-divider"/>
        </div>
        <div class="uk-flex uk-flex-center uk-flex-middle uk-height-1-1 uk-animation-fade">
            <img t-if="doc.currency_id.name == 'KHR'" src="https://raw.githubusercontent.com/xiaohao0576/blog/b195121e513e99340c45417527a3922c16423272/images/khqr-khr.svg" class="uk-position-absolute z-1"/>
            <img t-if="doc.currency_id.name == 'USD'" src="https://raw.githubusercontent.com/xiaohao0576/blog/b195121e513e99340c45417527a3922c16423272/images/khqr-usd.svg" class="uk-position-absolute z-1"/>
            <img src="/report/barcode/?barcode_type=QR&amp;quiet=0&amp;width=200&amp;height=200&amp;humanreadable=1&amp;value=%22aabbccddee12345465767544%20%203434%203434%20%20234%22"/>
        </div>
    </div>
  </body>
</html>
</t>
⚠️ **GitHub.com Fallback** ⚠️