Question

这些是我对DinkToPDF的设置：

var document = new HtmlToPdfDocument()
{
    GlobalSettings =
    {
        PaperSize = PaperKind.A4,
        Orientation = Orientation.Portrait,
        Out = @Path.Combine(path, QuoteId + ".pdf")
    },
    Objects =
    {
        new ObjectSettings()
        {
            HtmlContent = result
        }
    }
};
converter.Convert(document);

当我在Web应用程序中通过导航加载视图时，它显示的页面很好。但是，当我生成pdf时，根本不使用bootstrap列。而是将右列推到底部，就像在移动视图中一样。

DinkToPDF还有其他设置可以正确使用引导程序吗？

这是我的查看代码：

@model APPONE.Data.Services.ViewModels.PCVM
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <link rel="stylesheet" href="@Model.HostURL/twitter-bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
    <link rel="stylesheet" href="@Model.HostURL/jqueryui/jquery-ui.css" />
    <link rel="stylesheet" href="@Model.HostURL/theme/css/style.css" />
    <link rel="stylesheet" href="@Model.HostURL/jquery-modal/jquery.modal.css" />
    <link rel="stylesheet" href="@Model.HostURL/css/Modal.css" />
    <link rel="stylesheet" href="@Model.HostURL/css/Site.css" />
    <link rel="stylesheet" href="@Model.HostURL/css/site-theme-extended.css" />
    <link rel="stylesheet" href="@Model.HostURL/css/QuotationForms.css" />
    <link rel="stylesheet" href="@Model.HostURL/css/Form-Styles/PCRCss.css" />
</head>
<body>
    <div id="app">
        <div class="main-wrapper main-wrapper-1">
            <div class="main-content">
                <section class="section">
                    <div class="section-header">
                        <h1>Summary</h1>
                    </div>

                    <div class="row">
                        <div class="col-sm-12">
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Email</label>
                                        <input type="text" class="form-control col-sm-12" value="@Model.CommercialProfile.Email" readonly />
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Address</label>
                                        <textarea type="text" class="form-control col-sm-12" readonly>@Model.CommercialProfile.Address</textarea>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Mobile Number</label>
                                        <input type="text" class="form-control col-sm-12" value="@Model.CommercialProfile.MobileNumber" readonly />
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Phone Number</label>
                                        <input type="text" class="form-control col-sm-12" value="@Model.CommercialProfile.PhoneNumber" readonly />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-9">
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label>Use Of Vehicle</label>
                                        <input type="text" class="form-control col-sm-12" value="@Model.UseOfVehicle" readonly />
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Vehicle Number</label>
                                        <input type="text" class="form-control col-sm-12" value="@Model.VehicleNumber" readonly />
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Vehicle Sum Insured</label>
                                        <input type="text" class="form-control col-sm-12" value="@Model.VehicleSumInsured" readonly />
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-12">
                                    <h5>Extra Coverage</h5>
                                    <hr />
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-4">
                                    <div class="form-group">
                                        <label>All Drivers</label>
                                        <input type="checkbox" class="form-control col-sm-12 checkbox-item" @Model.ADChecked />
                                    </div>
                                </div>
                                <div class="col-sm-4">
                                    <div class="form-group">
                                        <label>LLP</label>
                                        <input type="checkbox" class="form-control col-sm-12 checkbox-item" @Model.LLPChecked />
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-4">
                                    <div class="form-group">
                                        <label>SRCC</label>
                                        <input type="checkbox" class="form-control col-sm-12 checkbox-item" @Model.SRCCChecked />
                                    </div>
                                </div>
                                <div class="col-sm-4">
                                    <div class="form-group">
                                        <label>Nature Disaster</label>
                                        <input type="checkbox" class="form-control col-sm-12 checkbox-item" @Model.NDChecked />
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-4">
                                    <div class="form-group">
                                        <label>LLOP</label>
                                        <input type="checkbox" class="form-control col-sm-12 checkbox-item" @Model.LLOPChecked />
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-12">
                                    <h5>Extra Coverage</h5>
                                    <hr />
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Additional Named Driver</label>
                                        <input type="text" class="form-control col-sm-12" value="@Model.AdditionalNamedDriver" readonly />
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-sm-3" id="CalculationPanel">
                            <div class="row">
                                <div class="col-sm-12">
                                    <h4>Calculator</h4>
                                    <hr />
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group form-inline col-sm-12">
                                    <label class="col-sm-6">Laminated</label>
                                    <input type="text" class="form-control col-sm-6 no-border right-align-text" value="@Model.PrivateCarReadOnly.BasicRO" readonly />
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group form-inline col-sm-12">
                                    <label class="col-sm-6">Loading</label>
                                    <input type="text" class="form-control col-sm-6 no-border right-align-text" value="@Model.PrivateCarReadOnly.LoadingRO" readonly />
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group form-inline col-sm-12">
                                    <label class="col-sm-6">NCD</label>
                                    <input type="text" class="form-control col-sm-6 no-border right-align-text" value="@Model.PrivateCarReadOnly.NCDRO" readonly />
                                </div>
                            </div>
                            <hr />
                            <div class="row">
                                <div class="form-group form-inline col-sm-12">
                                    <label class="col-sm-6 strong">SubTotal</label>
                                    <input type="text" class="form-control col-sm-6 no-border right-align-text strong" value="@Model.PrivateCarReadOnly.SubTotal" readonly />
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group form-inline col-sm-12">
                                    <label class="col-sm-6">AD</label>
                                    <input type="text" class="form-control col-sm-6 no-border right-align-text" value="@Model.PrivateCarReadOnly.ADRO" readonly />
                                </div>
                            </div>
                            <hr />
                            <div class="row">
                                <div class="form-group form-inline col-sm-12">
                                    <label class="col-sm-6 strong">Total Premium</label>
                                    <input type="text" class="form-control col-sm-6 no-border right-align-text strong" value="@Model.PrivateCarReadOnly.TotalPremiumRO" readonly />
                                </div>
                            </div>
                        </div>

                    </div>
                </section>
            </div>
        </div>
    </div>

</body>

</html>

Answer 1

DinkToPDF基于wkhtmltopdf及其doesn't support flexbox，它引导4 relays on。

您可以使用jsreport.net之类的示例来代替DinkToPDF：https://stackoverflow.com/a/45840308/7874927

.NET Core DinkToPDF无法正确显示引导程序列

1 个答案: