如何将页面转为PDF后实现打印功能

<#include "/common/commoncss.ftl">

${xCustomerOrderList1.billType}

出库业务 > ${xCustomerOrderList1.billType}

    <div class="bgc-w box" id="printBody">
 
        <div class="box-header">
            <table class="bo table ">
                <tr >
                    <td colspan="14" class="title"><h2>${xCustomerOrderList1.billType}</h2></td>
                </tr>
                <tr style="opacity: 0;">
                    <td colspan="14">11</td>
                </tr>
                <tr class="top ss">
                    <td colspan="14" class="wi "><div class="bottom" ><label class="control-label font">销售信息</label></div></td>
                </tr>
 
                <tr class="rile two">
                    <td class="wi" style="width:100px;"><label class="control-label">订单编号</label></td>
                    <td  style="width:170px;"><div class="bottom">${xCustomerOrderList1.orderCode}</div></td>
                    <td class="css"style="width:30px;"></td>
                    <td class="wi"><label class="control-label">销售员</label></td>
                    <td colspan="4" ><div class="bottom">${(xCustomerOrderList1.recorder)!''}</div></td>
                </tr>
                <tr class="rile two">
                    <td class="wi" style="width:100px;"><label class="control-label">客户名称</label></td>
                    <td  style="width:170px;"><div class="bottom">${xCustomerOrderList1.customerList.customerListName}</div></td>
                    <td class="css"style="width:30px;"></td>
                    <td class="wi" style="width:90px;"><label class="control-label">客户地址</label></td>
                    <td colspan="4" style="width:108px;"><div class="bottom">${xCustomerOrderList1.customerList.customerListAdress}</div></td>
                    <td class="css"style="width:30px;"></td>
                    <td class="wi" style="width:90px;"><label class="control-label">联系电话</label></td>
                    <td colspan="4" style="width:108px;"><div class="bottom">${xCustomerOrderList1.customerList.customerListTelephone}</div></td>
                </tr>
                <tr class="rile two">
                    <td class="wi" style="width:100px;"><label class="control-label">销售商品</label></td>
                    <td  style="width:170px;"><div class="bottom">${(xSaleCommodity.productName)!''}</div></td>
                    <td class="css"style="width:30px;"></td>
                    <td class="wi" style="width:90px;"><label class="control-label">计量单位</label></td>
                    <td colspan="4" style="width:108px;"><div class="bottom">${(xSaleCommodity.sysGoodsUnit.goodsUnitName)!''}</div></td>
                    <td class="css" style="width:30px;"></td>
                    <td class="wi"><label class="control-label">商品类型</label></td>
                    <td colspan="4" ><div class="bottom">${(xSaleCommodity.goodsType.goodsTypeName)!''}</div></td>
                </tr>
                <tr class="rile two">
                    <td class="wi" style="width:100px;"><label class="control-label">规格</label></td>
                    <td  style="width:170px;"><div class="bottom">${(xSaleCommodity.specificationModel)!""}</div></td>
                    <td class="css"style="width:30px;"></td>
                    <td class="wi" style="width:90px;"><label class="control-label">订单数量</label></td>
                    <td colspan="4" style="width:108px;"><div class="bottom">${(xSaleCommodity.pickNum)!''}</div></td>
                    <td class="css" style="width:30px;"></td>
                    <td class="wi"style="width:100px;"><label class="control-label">订价</label></td>
                    <td style="width:170px;" ><div class="bottom">${(xSaleCommodity.goodsDiscountPrice)!''}元</div></td>
                </tr>
                <tr class="rile two">
                    <td class="wi" style="width:100px;"><label class="control-label">总额</label></td>
                    <td style="width:170px;" ><div class="bottom">${((xSaleCommodity.pickNum)*(xSaleCommodity.goodsDiscountPrice))!''}元</div></td>
                    <td class="css" style="width:30px;"></td>
                            <#if xCustomerOrderList1.billType=='出库单'>
                    <td class="wi" style="width:90px;"><label class="control-label">出库人</label></td>
                                <td  style="width:140px;"><div class="bottom">${(xSaleCommodity.warehouseKeeper)!''}</div></td>
                            </#if>
                </tr>
                <tr class="rile two">
                    <td class="wi" style="width:100px;"><label class="control-label">订单日期</label></td>
                    <td style="width:170px;" ><div class="bottom">${(xCustomerOrderList1.orderDate)!''}</div></td>
                    <td class="css" style="width:30px;"></td>
                    <td class="wi"style="width:100px;"><label class="control-label">交货日期</label></td>
                    <td style="width:170px;" ><div class="bottom">${(xCustomerOrderList1.sendDate)!''}</div></td>
                </tr>
                <tr class="fo">
 
                    <td colspan="14" style="text-align: right;" >
                        <div class="pull-right foot">
                            <a id="downLoad" class="btn btn-default fault saved" href="javascript:" onclick="dianji()">转存为pdf</a>
                            <a class="btn btn-default fault fa-back" href="javascript:" onclick="history.back(); ">
                                <span class="glyphicon glyphicon-chevron-left"></span> 返回</a>
 
 
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</div>

转换前结果如下：

转换后结果如下：