Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Ask a Question
Welcome To Ask or Share your Answers For Others

Categories

python - xhtml2pdf not converting css properly django

0 votes
581 views
in Technique[技术] by (71.8m points)

python - xhtml2pdf not converting css properly django

hey guys so i have been using this library for a while now and i just encounter this error that by using this library its not converting my css of my html properly to pdf, i used this library to generate voucher internet for my client, does anybody now how can i fix this? thanks, here's my code

voucher.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]
/ip hotspot active remove [find user=$pengguna]
/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')

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

xhmtl2pdf supports only limited number of css properties as described in the 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

And adds few of its own for defining its own styling:

-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

Namely it does not accept flex, border-collapse and border-spacing from your code.

Use its pages and frames to define layout instead of flex columns.

Also doc says that it has some default styling for the page, which you may dump, edit or replace like described here:

# dump
$ xhtml2pdf --css-dump > xhtml2pdf-default.css

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

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

Just Browsing Browsing

2.1m questions

2.1m answers

60 comments

56.8k users

Most popular tags

Powered by Question2Answer
Donate
Theme by Q2A Market&&OStack.cn
...