itext將html轉pdf

pom文件

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

<dependency>
    <groupId>org.thymeleaf.extras</groupId>
    <artifactId>thymeleaf-extras-springsecurity5</artifactId>
</dependency>

<dependency>
    <groupId>com.itextpdf</groupId>
    <artifactId>html2pdf</artifactId>
</dependency>

工具類 pdf類

CommonUtils

字體方法

public static FontProvider getFontProvider(){
    FontProvider fontProvider = new FontProvider();
    fontProvider.addFont(fontProvider.getClass().getClassLoader().getResource("font/simsun.ttf").getPath());
    fontProvider.addFont(fontProvider.getClass().getClassLoader().getResource("font/simhei.ttf").getPath());
    fontProvider.addStandardPdfFonts();
    return fontProvider;
}

設置編碼爲utf-8

public static ConverterProperties getConverterProperties(FontProvider fontProvider){
    ConverterProperties converterProperties = new ConverterProperties();
    converterProperties.setFontProvider(fontProvider);
    converterProperties.setCharset("utf-8");
    return converterProperties;
}

pdf方法

public static List<Attachment> generate2PDF(List<Dictionary> dictionaries,Object object,TemplateEngine templateEngine) throws IOException {
        List<Attachment> attachmentList = new ArrayList<>();
        //插入Order 中英PDF文件 Attachment
        Attachment attachmentZh = new Attachment();
        Attachment attachmentEn = new Attachment();

        //中英字典數據
        Map<String,String> dictionaryMapZh = new HashMap<>();
        Map<String,String> dictionaryMapEn = new HashMap<>();

        dictionaries.stream().forEach(dictionary -> {
            dictionary.getDictionaryItems().stream().forEach(dictionaryItem -> {
                dictionaryMapZh.put(dictionaryItem.getItemCode(),dictionaryItem.getItemValue());
                dictionaryMapEn.put(dictionaryItem.getItemCode(),dictionaryItem.getItemValueEn());
            });
        });
        //生成中英發票PDF
        if(object instanceof Invoice && object != null){
            Invoice invoice = (Invoice) object;

            FontProvider fontProvider = getFontProvider();


            ConverterProperties converterProperties = new ConverterProperties();
            converterProperties.setFontProvider(fontProvider);
            converterProperties.setCharset("utf-8");

            Context ctx = new Context();
            ctx.setVariable("invoice", invoice);
            ctx.setVariable("timeStr",CommonUtils.getCurrentTimeFormat());
            ctx.setVariable("timeEnStr",CommonUtils.getCurrentTimeEnFormat());
//            ctx.setVariable("orderConfirmDateStr",CommonUtils.getDateFormat(order.getConfirmDate()));
            ctx.setVariable("dictionaryZh",dictionaryMapZh);
            ctx.setVariable("dictionaryEn",dictionaryMapEn);

            File invoiceFileEn = new File(dictionaryMapEn.get("uploadPath") + invoice.getPdfIdEn() + ".pdf");
            Document documentEn = new Document(new PdfDocument(new PdfWriter(new FileOutputStream(invoiceFileEn))), PageSize.A4);
            documentEn.setMargins(10, 20, 10, 20);
            HtmlConverter.convertToElements(templateEngine.process("invoicePDF/en", ctx), converterProperties)
                    .stream().forEach(iElement -> documentEn.add((IBlockElement) iElement));

            documentEn.close();

            attachmentEn.setId(invoice.getPdfIdEn());
            attachmentEn.setFileName("invoice_"+invoice.getInvoiceNo()+".pdf");
            attachmentEn.setSize(invoiceFileEn.length());
            attachmentEn.setPath(invoice.getInvoiceNo()+"_invoiceEn.pdf");
            attachmentEn.setSuffix("pdf");

            //中文Invoice
            File invoiceFileZh = new File(dictionaryMapZh.get("uploadPath") + invoice.getPdfId() + ".pdf");
            Document documentZh = new Document(new PdfDocument(new PdfWriter(new FileOutputStream(invoiceFileZh))), PageSize.A4);
            documentZh.setMargins(10, 20, 10, 20);
            HtmlConverter.convertToElements(templateEngine.process("invoicePDF/zh", ctx), converterProperties)
                    .stream().forEach(iElement -> documentZh.add((IBlockElement) iElement));

            documentZh.close();

            attachmentZh.setId(invoice.getPdfId());
            attachmentZh.setFileName("發票_"+invoice.getInvoiceNo()+".pdf");
            attachmentZh.setSize(invoiceFileZh.length());
            attachmentZh.setPath(invoice.getInvoiceNo()+"_invoiceZh.pdf");
            attachmentZh.setSuffix("pdf");

        }
       
        attachmentList.add(attachmentZh);
        attachmentList.add(attachmentEn);
        return attachmentList;
    }

}

業務邏輯調用pdf方法

@Override
    @Transactional(rollbackFor = Exception.class)
    public void add(Delivery delivery) throws IOException {
        delivery.setId(CommonUtils.uuid());

        delivery.setDeliveryNo(CommonUtils.deliveryNo());
        deliveryMapper.insert(delivery);
        delivery.getOrder().setLastShipmentDate(new Date());
        orderMapper.update(delivery.getOrder());
        Optional.ofNullable(delivery.getDeliveryItems()).orElse(new ArrayList<>()).forEach(deliveryItem -> {
            deliveryItem.setId(CommonUtils.uuid());
            deliveryItem.setDelivery(delivery);
        });
        deliveryItemMapper.batchInsertDeliveryItem(delivery.getDeliveryItems());
        deliveryMapper.UpdatePoAndInStock(delivery);

        Invoice invoice = new Invoice();
        invoice.setId(CommonUtils.uuid());
        invoice.setOrder(delivery.getOrder());
        invoice.setInvoiceNo("I" + String.valueOf(new Date().getTime()));
        invoice.setPdfId(invoice.getInvoiceNo() + "invoiceZh");
        invoice.setPdfIdEn(invoice.getInvoiceNo() + "invoiceEn");
        invoice.setDelivery(delivery);
        BigDecimal total = deliveryMapper.selectCountAndPrice(delivery);
        invoice.setTotal(total);
        invoice.setAmountDue(total);



/******************生成INVOICE pdf****************************/


        //字典
        List<Dictionary> dictionaries = dictionaryMapper.findByNames(new String[]{"addrType", "orderType", "unit", "paymentMethod", "deliveryMethod", "exchangeRate", "country"});

        //把path存入字典
        DictionaryItem dictionaryItem = new DictionaryItem();
        dictionaryItem.setItemCode("uploadPath");
        dictionaryItem.setItemValue(uploadPath);
        dictionaryItem.setItemValueEn(uploadPath);
        dictionaries.get(0).getDictionaryItems().add(dictionaryItem);

        Order order = orderMapper.genOrderReportPDF(delivery.getOrder().getId());

        List<CompanyAddress> companyAddresses = companyAddressMapper.selectCompanyAdressById(order.getCompany().getId());


        if ("INV".equals(companyAddresses.get(0).getAddrType())) {
            Collections.swap(companyAddresses, 0, 1);
        }
        order.setCompanyAddressList(companyAddresses);
        invoice.setOrder(order);

        Map<String, OrderItem> map = new HashMap<>();

        List<OrderItem> orderItemsByOrderId = orderItemMapper.getOrderItemsByOrderId(order.getId());

        orderItemsByOrderId.stream().forEach(orderItem -> {
            map.put(orderItem.getId(), orderItem);
        });

        //組裝數據
        delivery.getDeliveryItems().stream().forEach(deliveryItem -> {
            InvoicePdfTableInfo invoicePdfTableInfo = new InvoicePdfTableInfo();
            OrderItem orderItem = map.get(deliveryItem.getOrderItem().getId());
            Product product = orderItem.getProduct();
            invoicePdfTableInfo.setProductNo(product.getProductNo());
            invoicePdfTableInfo.setProductName(product.getProductName());
            invoicePdfTableInfo.setProductNameEn(product.getProductNameEn());
            invoicePdfTableInfo.setDescription(product.getDescription());
            invoicePdfTableInfo.setDescriptionEn(product.getDescriptionEn());
            invoicePdfTableInfo.setQuantity(deliveryItem.getCount());
            invoicePdfTableInfo.setQuantityUnit(product.getUnit());
            invoicePdfTableInfo.setPrice(orderItem.getPrice());
            invoicePdfTableInfo.setTotal(orderItem.getPrice().multiply(new BigDecimal(deliveryItem.getCount())));
            invoicePdfTableInfo.setDeliveryTime(CommonUtils.getTimeFormat(delivery.getDeliveryDate()));//YYYYMMdd



            invoice.getInvoicePdfTableInfoList().add(invoicePdfTableInfo);
        });

        Date date = new Date();
        Calendar calendar = Calendar.getInstance();
        calendar.setTime(date);
        calendar.add(Calendar.MONTH,1);
        Date dateAddMonth = calendar.getTime();

        invoice.setInvoiceDate(date);
        invoice.setDuDate(dateAddMonth);

        List<Attachment> attachmentList = CommonUtils.generate2PDF(dictionaries, invoice, templateEngine);

        attachmentList.stream().forEach( attachment->{
            attachment.setPath(uploadPath+attachment.getPath());
        });
        //先插入文件表
        attachmentMapper.batchInsertAttachment(attachmentList);
        //後插入invoice表
        invoiceMapper.insert(invoice);

    }

發票英文.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<style>
    body {
        font-family: SimSun;
        font-size: 14px;
        border: 0px solid red;
        margin-bottom: 50px;
        height: auto;
    }
    ul {
        list-style-type:none;
        margin: 0px;
        padding: 0px;
    }
    .left {
        float: left;
        width: 45%;
    }
    .right {
        float: right;
        width: 45%;
    }
    .font-size-large {
        font-size: 22px;
    }
    .clear {
        clear: both;
    }
    .label {
        font-family: SimHei;
        font-weight: bold;
        font-size: 12px;
    }
    .data-address {
        margin: 5px auto;
        width:90%;
        border: 0px solid red;
    }
    .data-row {
        width:90%;
        border: 0px solid red;
        margin: 1px auto;
    }
    .data-row ul li {
        float: left;
    }
    .data-row .label {
        width: 180px;
    }
</style>
<body>
<div style=" border:0px solid red">
    <div style="border:0px solid black;margin-bottom: 50px">
        <div class="left font-size-large">LOGO</div>
        <div class="right">
            <span style="margin-right: 20px;" class="font-size-large">INVOICE</span>
            [[ ${invoice.invoiceNo} ]]
        </div>
        <div class="clear"></div>
    </div>

    <div class="data-address" style="margin-top: 100px">
        <div class="left">
            <div class="label" style="line-height: 20px;border-bottom: 2px solid black;font-size: 14px;margin-bottom: 5px">[[ ${dictionaryEn[invoice.order.companyAddressList[0].addrType]} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">Name:</span> [[ ${invoice.order.companyAddressList[0].addrName} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">Address:</span> [[ ${invoice.order.companyAddressList[0].partOne} ]]</div>
            <div style="font-size: 12px;height: 20px">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[ ${invoice.order.companyAddressList[0].partTwo} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">City:</span> [[ ${invoice.order.companyAddressList[0].postalCodeCity} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">Country:</span> [[ ${dictionaryEn[invoice.order.companyAddressList[0].country]} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">VAT-nr:</span> [[ ${invoice.order.companyAddressList[0].vatNr} ]]</div>
        </div>
        <div class="right">
            <div class="label" style="line-height: 20px;border-bottom: 2px solid black;font-size: 14px;margin-bottom: 5px">[[ ${dictionaryEn[invoice.order.companyAddressList.get(1).addrType]} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">Name:</span> [[ ${invoice.order.companyAddressList[1].addrName} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">Address:</span> [[ ${invoice.order.companyAddressList[1].partOne} ]]</div>
            <div style="font-size: 12px;height: 20px">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[ ${invoice.order.companyAddressList[1].partTwo} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">City:</span> [[ ${invoice.order.companyAddressList[1].postalCodeCity} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">Country:</span> [[ ${dictionaryEn[invoice.order.companyAddressList[1].country]} ]]</div>
            <div style="font-size: 12px;height: 20px"><span class="label">VAT-nr:</span> [[ ${invoice.order.companyAddressList[1].vatNr} ]]</div>
        </div>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label">Terms of payment</li>
            <li style="font-size: 12px;">[[ ${dictionaryEn[invoice.order.deliveryMethod]} ]]</li>
        </ul>
        <ul class="right">
            <li class="label">Invoice number</li>
            <li style="font-size: 12px;">[[ ${invoice.invoiceNo} ]]</li>
        </ul>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label">Terms of delivery</li>
            <li style="font-size: 12px;">[[ ${dictionaryEn[invoice.order.paymentMethod]} ]]</li>
        </ul>
        <ul class="right">
            <li class="label">Invoice date</li>
            <li style="font-size: 12px;" th:text="${#dates.format(invoice.getInvoiceDate(), 'yyyyMMdd')}"></li>
        </ul>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label">Forwarder</li>
            <li style="font-size: 12px;">[[ ${invoice.delivery.forwarder} ]]</li>
        </ul>
        <ul class="right">
            <li class="label">Invoice due date</li>
            <li style="font-size: 12px;" th:text="${#dates.format(invoice.getDuDate(), 'yyyyMMdd')}"></li>
        </ul>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label">Delivery date</li>
            <li style="font-size: 12px;" th:text="${#dates.format(invoice.getDelivery().getDeliveryDate(), 'yyyyMMdd')}"></li>
        </ul>
        <ul class="right">
            <li class="label">Customer number</li>
            <li style="font-size: 12px;">[[ ${invoice.order.company.companyNo} ]]</li>
        </ul>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label">Your reference</li>
            <li style="font-size: 12px;">[[ ${invoice.order.reference} ]]</li>
        </ul>
        <ul class="right">
            <li class="label">Our ordernr.</li>
            <li style="font-size: 12px;">[[ ${invoice.order.orderNo} ]]</li>
        </ul>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label"></li>
            <li></li>
        </ul>
        <ul class="right">
            <li class="label">Phone:</li>
            <li style="font-size: 12px;">[[ ${invoice.order.company.tel} ]]</li>
        </ul>
        <div class="clear"></div>
    </div>

    <table border="0" cellpadding="0" cellspacing="0" style="width:90%;border: 0px solid black;margin: 50px auto">
        <thead>
        <tr>
            <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 5%">Row</td>
            <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">Nr</td>
            <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 30%">Description</td>
            <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">Quantity</td>
            <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">Price</td>
            <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">Amount USD</td>
        </tr>
        </thead>
        <tbody>
        <tr th:each="invoicePdfTableInfo,invoicePdfTableInfoStat:${invoice.getInvoicePdfTableInfoList()}">
            <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfoStat.count}"></td>
            <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfo.getProductNo()}"></td>
            <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfo.getDescriptionEn()}"></td>
            <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfo.getQuantity()+' '+dictionaryEn[invoicePdfTableInfo.getQuantityUnit()]}"></td>
            <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${#numbers.formatDecimal(invoicePdfTableInfo.getPrice().multiply(dictionaryEn['CNY/USD']),1,'COMMA',5,'POINT')}"></td>
            <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${#numbers.formatDecimal(invoicePdfTableInfo.getTotal().multiply(dictionaryEn['CNY/USD']),1,'COMMA',2,'POINT')}"></td>
        </tr>
        </tbody>
        <tfoot style="margin-top: 50px">
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td style="border-bottom: 1px solid black"></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td style="font-size: 13px;"><b>NET VALUE.:</b></td>
            <td></td>
            <td></td>
            <td style="font-size: 13px;" th:text="${#numbers.formatDecimal(invoice.getTotal().multiply(dictionaryEn['CNY/USD']),1,'COMMA',2,'POINT')}"></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td style="font-size: 14px;"><b>TOT. AMOUNT.:</b></td>
            <td></td>
            <td style="font-size: 14px;">USD</td>
            <td style="font-size: 14px;" th:text="+${#numbers.formatDecimal(invoice.getAmountDue().multiply(dictionaryEn['CNY/USD']),1,'COMMA',2,'POINT')}"></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td style="font-size: 14px;"><b>********************</b></td>
        </tr>
        </tfoot>
    </table>
</div>
<div style="width:98%;position:absolute;bottom: 120px;border-bottom: 2px solid black">
    <p style="margin-left: 10px;font-size: 14px;">
        UPON ORDER DELIVERY, PLEASE CONTACT US IF ANY PROBLEM NOT LATER THAN
        7 DAYS, <br/>OTHERWISE, NO CLAIM WILL BE RECOGNIZED.
    </p>
</div>
<footer style="width:98%;border-top:1px solid black;position:absolute;bottom: 0px">
    <p th:text="${'Wanruite Clothing Signs Co., Ltd.'}"></p>
    <p>Contact information: <a href="#">12345678</a></p>
</footer>
</body>
</html>

發票中文

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<style>
    body {
        font-family: SimSun;
        font-size: 14px;
        border: 0px solid red;
        margin-bottom: 50px;
        height: auto;
    }
    ul {
        list-style-type:none;
        margin: 0px;
        padding: 0px;
    }
    .left {
        float: left;
        width: 45%;
    }
    .right {
        float: right;
        width: 45%;
    }
    .font-size-large {
        font-size: 22px;
    }
    .clear {
        clear: both;
    }
    .label {
        font-family: SimHei;
        font-weight: bold;
        font-size: 12px;
    }
    .data-address {
        margin: 5px auto;
        width:90%;
        border: 0px solid red;
    }
    .data-row {
        width:90%;
        border: 0px solid red;
        margin: 1px auto;
    }
    .data-row ul li {
        float: left;
    }
    .data-row .label {
        width: 180px;
    }
</style>
<body>
<div style=" border:0px solid red">
<div style="border:0px solid black;margin-bottom: 50px">
    <div class="left font-size-large">LOGO</div>
    <div class="right">
        <span style="margin-right: 20px;" class="font-size-large">發票編號</span>
        [[ ${invoice.invoiceNo} ]]
    </div>
    <div class="clear"></div>
</div>

<div class="data-address" style="margin-top: 100px">
    <div class="left">
        <div class="label" style="line-height: 20px;border-bottom: 2px solid black;font-size: 14px;margin-bottom: 5px">[[ ${dictionaryZh[invoice.order.companyAddressList[0].addrType]} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">名稱:</span> [[ ${invoice.order.companyAddressList[0].addrName} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">地址:</span> [[ ${invoice.order.companyAddressList[0].partOne} ]]</div>
        <div style="font-size: 12px;height: 20px">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[ ${invoice.order.companyAddressList[0].partTwo} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">城市:</span> [[ ${invoice.order.companyAddressList[0].postalCodeCity} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">國家:</span> [[ ${dictionaryZh[invoice.order.companyAddressList[0].country]} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">稅號:</span> [[ ${invoice.order.companyAddressList[0].vatNr} ]]</div>
    </div>
    <div class="right">
        <div class="label" style="line-height: 20px;border-bottom: 2px solid black;font-size: 14px;margin-bottom: 5px">[[ ${dictionaryZh[invoice.order.companyAddressList.get(1).addrType]} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">名稱:</span> [[ ${invoice.order.companyAddressList[1].addrName} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">地址:</span> [[ ${invoice.order.companyAddressList[1].partOne} ]]</div>
        <div style="font-size: 12px;height: 20px">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[ ${invoice.order.companyAddressList[1].partTwo} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">城市:</span> [[ ${invoice.order.companyAddressList[1].postalCodeCity} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">國家:</span> [[ ${dictionaryZh[invoice.order.companyAddressList[1].country]} ]]</div>
        <div style="font-size: 12px;height: 20px"><span class="label">稅號:</span> [[ ${invoice.order.companyAddressList[1].vatNr} ]]</div>
    </div>
    <div class="clear"></div>
</div>

<div class="data-row" >
    <ul class="left">
        <li class="label">交貨方式</li>
        <li>[[ ${dictionaryZh[invoice.order.deliveryMethod]} ]]</li>
    </ul>
    <ul class="right">
        <li class="label">發票編號</li>
        <li>[[ ${invoice.invoiceNo} ]]</li>
    </ul>
    <div class="clear"></div>
</div>

<div class="data-row" >
    <ul class="left">
        <li class="label">付款方式</li>
        <li>[[ ${dictionaryZh[invoice.order.paymentMethod]} ]]</li>
    </ul>
    <ul class="right">
        <li class="label">發票日期</li>
        <li th:text="${#dates.format(invoice.getInvoiceDate(), 'yyyyMMdd')}"></li>
    </ul>
    <div class="clear"></div>
</div>

<div class="data-row" >
    <ul class="left">
        <li class="label">貨運代理</li>
        <li>[[ ${invoice.delivery.forwarder} ]]</li>
    </ul>
    <ul class="right">
        <li class="label">發票到期日</li>
        <li th:text="${#dates.format(invoice.getDuDate(), 'yyyyMMdd')}"></li>
    </ul>
    <div class="clear"></div>
</div>

    <div class="data-row" >
        <ul class="left">
            <li class="label">發貨日期</li>
            <li th:text="${#dates.format(invoice.getDelivery().getDeliveryDate(), 'yyyyMMdd')}"></li>
        </ul>
        <ul class="right">
            <li class="label">客戶編號</li>
            <li>[[ ${invoice.order.company.companyNo} ]]</li>
        </ul>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label">客戶參考信息</li>
            <li>[[ ${invoice.order.reference} ]]</li>
        </ul>
        <ul class="right">
            <li class="label">訂單編號</li>
            <li>[[ ${invoice.order.orderNo} ]]</li>
        </ul>
        <div class="clear"></div>
    </div>

    <div class="data-row" >
        <ul class="left">
            <li class="label"></li>
            <li></li>
        </ul>
        <ul class="right">
            <li class="label">電話</li>
            <li>[[ ${invoice.order.company.tel} ]]</li>
        </ul>
        <div class="clear"></div>
    </div>

    <table border="0" cellpadding="0" cellspacing="0" style="width:90%;border: 0px solid black;margin: 50px auto">
        <thead>
            <tr>
                <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 5%">序號</td>
                <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">產品編號</td>
                <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 30%">描述</td>
                <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">發貨數量</td>
                <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">價格</td>
                <td class="label" style="border-bottom: 2px solid rebeccapurple;width: 10%">金額</td>
            </tr>
        </thead>
        <tbody>
            <tr th:each="invoicePdfTableInfo,invoicePdfTableInfoStat:${invoice.getInvoicePdfTableInfoList()}">
                <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfoStat.count}"></td>
                <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfo.getProductNo()}"></td>
                <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfo.getDescription()}"></td>
                <td style="font-size: 12px;border-bottom: 1px solid black" th:text="${invoicePdfTableInfo.getQuantity()+dictionaryZh[invoicePdfTableInfo.getQuantityUnit()]}"></td>
                <td style="font-size: 12px;border-bottom: 1px solid black" th:text="'￥'+${#numbers.formatDecimal(invoicePdfTableInfo.getPrice(),1,'COMMA',3,'POINT')}"></td>
                <td style="font-size: 12px;border-bottom: 1px solid black" th:text="'￥'+${#numbers.formatDecimal(invoicePdfTableInfo.getTotal(),1,'COMMA',2,'POINT')}"></td>
            </tr>
        </tbody>
        <tfoot>
            <tr >
                <td></td>
                <td></td>
                <td style="font-size: 14px;"><b>淨額:</b></td>
                <td></td>
                <td></td>
                <td style="font-size: 14px;" th:text="'￥'+${#numbers.formatDecimal(invoice.getTotal(),1,'COMMA',2,'POINT')}"></td>
            </tr>
            <tr >
                <td></td>
                <td></td>
                <td style="font-size: 14px;"><b>應付金額:</b></td>
                <td></td>
                <td style="font-size: 14px;">CNY</td>
                <td style="font-size: 14px;" th:text="'￥'+${#numbers.formatDecimal(invoice.getAmountDue(),1,'COMMA',2,'POINT')}"></td>
            </tr>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td style="font-size: 14px;"><b>********************</b></td>
            </tr>
        </tfoot>
    </table>
</div>
    <div style="width:98%;position:absolute;bottom: 120px;border-bottom: 2px solid black">
        <p style="margin-left: 10px;font-size: 14px;">
            訂購後，若有任何其餘問題，請與咱們聯繫
            不然7天，咱們將不予賠償。
        </p>
    </div>
<footer style="width:98%;border-top:1px solid black;position:absolute;bottom: 0px">
    <p th:text="${'萬瑞特服飾標牌有限公司'}"></p>
    <p>Contact information: <a href="#">12345678</a></p>
</footer>
</body>
</html>