Laravel中使用mPDF时表格页脚{colsum}无法正常显示

问题分析 #

使用Laravel PDF（基于mPDF）生成PDF时，表格页脚的{colsum}标签无法渲染列合计值，核心原因是mPDF对表格结构、属性及内容格式有特定要求，未满足这些条件时合计功能不会生效。

解决方案 #

1. 修正表格结构与属性 #

mPDF的表格合计功能依赖规范的表格结构和固定布局，需做以下调整：

• 给表格添加table-layout: fixed样式，确保mPDF能正确识别列边界；
• 显式指定{colsum}的列索引（从1开始计数），避免列识别错误；
• 调整tfoot至tbody之后，符合HTML标准同时适配mPDF解析逻辑。

修改后的表格代码：

<table style="table-layout: fixed; width: 100%;">
    <!-- 建议添加thead完善表格结构 -->
    <thead>
        <tr>
            <th>ID</th>
            <th>客户名称</th>
            <th>产品类型</th>
            <th>数量</th>
            <th>运费</th>
            <th>人工</th>
            <th>预付款</th>
            <th>总计</th>
        </tr>
    </thead>
    <tbody>
        @foreach ($data['bilties'] as $key => $item)
            <tr>
                <td>{{$item['id']}}</td>
                <td>{{$item['customer']['name']}}</td>
                <td>{{$item['product_type']}}</td>
                <td>{{$item['quantity']}}</td>
                <td>{{$item['fare']}}</td>
                <td>{{$item['labour']}}</td>
                <td>{{$item['adv']}}</td>
                <td>{{$item['total']}}</td>
            </tr>
        @endforeach
    </tbody>
    <tfoot>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td>{colsum=4}</td>
            <td>{colsum=5}</td>
            <td>{colsum=6}</td>
            <td>{colsum=7}</td>
            <td>{colsum=8}</td>
        </tr>
    </tfoot>
</table>

2. 确保列内容为纯数字 #

mPDF仅能计算纯数字内容的合计，需处理列中的非数字字符：

• 若字段包含货币符号（如$、¥）或千位分隔符，需清除后再渲染：

<td>{{ str_replace(['$', ','], '', $item['fare']) }}</td>

• 若字段为字符串类型，需强制转换为数字：

<td>{{ (float)$item['quantity'] }}</td>

3. 配置mPDF启用合计功能 #

生成PDF时，需确保mPDF的相关配置开启，调整控制器代码：

$pdf = PDFF::loadView('pdf.vouchers', $data);
// 获取底层mPDF实例并配置
$mpdf = $pdf->getMpdf();
// 确保字符转换正常，避免解析错误
$mpdf->allow_charset_conversion = true;
// 设置自动边距适配分页表格
$mpdf->setAutoTopMargin = 'stretch';

return $pdf->download('vouchers.pdf');

4. 备用方案：手动计算合计（最可靠） #

若上述方法仍无法生效，可在控制器中提前计算各列合计，直接传递到视图渲染：

// 控制器中计算合计
$bilties = $vochur['bilties'];
$totals = [
    'quantity' => collect($bilties)->sum('quantity'),
    'fare' => collect($bilties)->sum('fare'),
    'labour' => collect($bilties)->sum('labour'),
    'adv' => collect($bilties)->sum('adv'),
    'total' => collect($bilties)->sum('total'),
];

$data = [
    'data' => $vochur,
    'date' => date('m/d/Y H:i:s A'),
    'setting' => $setting,
    'user' => Auth::user()->first_name,
    'totals' => $totals // 传递合计值
];

$pdf = PDFF::loadView('pdf.vouchers', $data);

视图中直接渲染合计值：

<tfoot>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td>{{ $totals['quantity'] }}</td>
        <td>{{ $totals['fare'] }}</td>
        <td>{{ $totals['labour'] }}</td>
        <td>{{ $totals['adv'] }}</td>
        <td>{{ $totals['total'] }}</td>
    </tr>
</tfoot>

内容的提问来源于stack exchange，提问作者Sami Ullah