【问题标题】:xhtml2pdf not converting css properly djangoxhtml2pdf 没有正确转换 css django
【发布时间】:2021-01-07 12:32:51
【问题描述】:

嘿伙计们,我已经使用这个库有一段时间了,我只是遇到这个错误,通过使用这个库它没有将我的 html 的 css 正确转换为 pdf,我使用这个库为我的客户生成凭证互联网,现在有人可以解决这个问题吗?谢谢,这是我的代码

凭证.html

    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <style type="text/css">
        
        * {
        box-sizing: border-box;
        }

        .row {
        display: flex;
        margin-left:-5px;
        margin-right:-5px;
        }

        .column {
        flex: 50%;
        padding: 5px;
        }

        table {
        border-collapse: collapse;
        border-spacing: 0;
        width: 100%;
        border: 1px solid #ddd;

        }

        th, td {
        text-align: left;
        padding: 16px;
        text-align: center;
        }

        tr:nth-child(even) {
        background-color: #f2f2f2;
        }
    @page {
        size: letter landscape;
        margin: 2cm;
    }
        </style>
    </head>
    <body>
        <div class="row">
        {% for data in akun %}
            <div class="column">
                <table>
                    <tr>
                        <th colspan="2">Voucher Internet 1 Hari</th>
                    </tr>
                    <tr>
                        <td>Username</td>
                        <td>{{akun.username}}</td>
                    </tr>
                    <tr>
                        <td>Password</td>
                        <td>{{akun.password}}</td>
                    </tr>
                    <tr>
                        <td>Harga</td>
                        <td>{{akun.harga}}</td>
                    </tr>
                    <tr>
                        <td colspan="2">Mikadmin.net</td>
                    </tr>
                </table>
            </div>
        {% endfor %}
        </div>
    </body>
    </html>

view.py

    def voucher_profile(request):
        mikrotik_session = request.session.get("mikadmin")
        template = get_template('voucher.html')
        host     = mikrotik_session.get("host")
        username = mikrotik_session.get("username")
        password = mikrotik_session.get("password")
        con  = routeros_api.RouterOsApiPool(host=host,username=username,password=password,plaintext_login=True)
        api  = con.get_api()
        content = api.get_resource('ip/hotspot/user/profile')
        content_user = api.get_resource('ip/hotspot/user')
        username_paket_profile = request.POST['name-profile']
        valid = request.POST['valid']
        limit_bandwidth = request.POST['rate-limit']
        harga_voucher = request.POST['harga-voucher']
        count_generate = request.POST['count_generate']
        akun = []
        content.add(
            name=username_paket_profile,
            shared_users="1",
            rate_limit=limit_bandwidth,
            status_autorefresh="1m",
            transparent_proxy="yes",
            on_login="""{
            :local pengguna $user;
            :local date [/system clock get date];
            :local time [/system clock get time];
            :log warning "$pengguna telah login pada jam $time";
            :if ([/ip hotspot user find name=$pengguna limit-uptime=%s]="") do={
            /ip hotspot user set [find name=$pengguna] limit-uptime=%s
            /ip hotspot active remove [find user=$pengguna]
            };
            :if ([/system schedule find name=$pengguna]="") do={
            /system schedule add name=$pengguna interval=%s on-event="/ip hotspot user remove [find name=$pengguna]\r\n/ip hotspot active remove [find user=$pengguna]\r\n/system schedule remove [find name=$pengguna]"
            }
            }""" % (valid, valid, valid))

        for data in range(int(count_generate)):
            generate_name = "".join(random.choice(string.ascii_letters) for x in range(6))
            generate_password = "".join(random.choice(string.ascii_letters) for x in range(6))
            content_user.add(name=generate_name,password=generate_password,profile=username_paket_profile)
            ctx = {"username":generate_name,"password":generate_password,"harga":harga_voucher}
            akun.append(ctx)

        context = {"akun":akun}
        html  = template.render(context)
        nama_file = 'voucher paket generate.pdf'
        file = open(nama_file, "w+b")
        pisaStatus = pisa.CreatePDF(html.encode('utf-8'), dest=file,
                encoding='utf-8')

        file.seek(0)
        pdf = file.read()
        file.close()            
        return HttpResponse(pdf, 'application/pdf')

【问题讨论】:

    标签: python django xhtml2pdf pisa


    【解决方案1】:

    xhmtl2pdf 仅支持有限数量的 css 属性,如 docs page 中所述:

    background-color
    border-bottom-color, border-bottom-style, border-bottom-width
    border-left-color, border-left-style, border-left-width
    border-right-color, border-right-style, border-right-width
    border-top-color, border-top-style, border-top-width
    colordisplay
    font-family, font-size, font-style, font-weight
    height
    line-height, list-style-type
    margin-bottom, margin-left, margin-right, margin-top
    padding-bottom, padding-left, padding-right, padding-top
    page-break-after, page-break-before
    size
    text-align, text-decoration, text-indent
    vertical-align
    white-space
    width
    zoom
    

    并添加一些自己的来定义自己的样式:

    -pdf-frame-border
    -pdf-frame-break
    -pdf-frame-content
    -pdf-keep-with-next
    -pdf-next-page
    -pdf-outline
    -pdf-outline-level
    -pdf-outline-open
    -pdf-page-break
    

    即它不接受来自您的代码的flexborder-collapseborder-spacing

    使用它的pages and frames to define layout 而不是弹性列。

    还有 doc 说它有一些默认的页面样式,你可以像 here 描述的那样转储、编辑或替换它:

    # dump
    $ xhtml2pdf --css-dump > xhtml2pdf-default.css
    
    # replace
    $ xhtml2pdf --css=xhtml2pdf-default.css test.html
    

    【讨论】:

    • 哦,我只知道这一点,但是当使用 xhtml2pdf 将其转换为 pdf 时,我如何才能使我的表格并排排列呢?因为我通过使用 flex-box 在我的 css 中实现这一点的方式,我尝试使用 page@ 但它似乎根本没有做任何事情你能给我一些帮助或提示,或者我可以用来做这个的库吗?谢谢
    • 可能您需要在每个 tr 中创建一个包含多个 td 的表。如果您的设计并不严格要求多个表格 - 显示一个表格,每行有多个 td。您也可以在浏览器中渲染页面并使用 js 从中下载 pdf:codexworld.com/convert-html-to-pdf-using-javascript-jspdf
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-05-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-09-08
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多