網(wǎng)頁如何實(shí)現(xiàn)批量打印單據(jù)

位置:首頁 / 新聞中心 / 知識(shí)教程

知識(shí)教程 Admin 2024-02-22 11:20:58 888

1,一個(gè)打印頁面批量預(yù)覽打印內(nèi)容。

2,打印換頁代碼如下:

<div style="page-break-after: always; page-break-inside: avoid;"></div>


整體頁面DEMO如下:


<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title></title>

    <link href="/static/plugs/layui/css/layui.css" type="text/css" rel="stylesheet"/>

    <style>

        table {

            width: 98%;

            border: 1px solid #000 !important;

        }


        th, td {

            text-align: center;

            border: 1px solid #000 !important;

            padding: 5px 8px !important;

        }

        .title{

            text-align: center;

            margin: 30px 0 ;

            font-size: 36px;

        }

    </style>

</head>

<body>


<!--<div  style="text-align:center;  font-weight: bold; color:red;margin-top: 10px;font-size: 60px">

    <img style="height: 80px" src="{$image}">{$user.shop_name}


</div>-->

{foreach $master_list as $k => $master_info }

<p>銷售單</p>

<button style="position: absolute ;right: 10px;top:10px;" class="layui-btn printer">打印</button>

<div style="display:flex;justify-content:space-around;;width: 95%;font-size: 18px;font-weight: bold;margin-top: 20px;margin-left: 33px;">

    <div>銷售單號(hào):{$master_info.info.order_num}</div>

    <div>銷售件數(shù):{$master_info.info.total_count}</div>

    <div>銷售時(shí)間:{$master_info.info.export_time|date="Y-m-d"}</div>

</div>


<div style="width: 98%;">

    <table style="margin:20px 30px;">

       <thead>

           <tr>

               {eq name="$setting.name" value="1"}

               <th class='text-center nowrap'>商品名稱</th>

               {/eq}

               {eq name="$setting.count" value="1"}

               <th class='text-center nowrap'>銷售數(shù)量</th>

               {/eq}

               <th class='text-center nowrap'>商品單位</th>

               {eq name="$setting.price" value="1"}

               <th class='text-center nowrap'>商品單價(jià)</th>

               {/eq}

               {eq name="$setting.total_price" value="1"}

               <th class='text-center nowrap'>商品總價(jià)</th>

               {/eq}

               {eq name="$setting.warehouse" value="1"}

               <th class='text-center nowrap'>倉庫</th>

               {/eq}

               {eq name="$setting.apply" value="1"}

               <th class='text-center nowrap'>客戶</th>

               {/eq}

           </tr>

       </thead>

        <tbody>

        {foreach $master_info.list as $k => $v }

            <tr>

                {eq name="$setting.name" value="1"}

                <td class='text-center nowrap'>{$v.name}</td>

                {/eq}

                {eq name="$setting.count" value="1"}

                <td class='text-center nowrap'>{$v.count}</td>

                {/eq}

                <td class='text-center nowrap'>{$v.unit_name}</td>

                {eq name="$setting.price" value="1"}

                <td class='text-center nowrap'>{$v.price}</td>

                {/eq}

                {eq name="$setting.total_price" value="1"}

                <td class='text-center nowrap'>{$v.total_price}</td>

                {/eq}

                {eq name="$setting.warehouse" value="1"}

                <td class='text-center nowrap'>{$v.warehouse}</td>

                {/eq}

                {eq name="$setting.apply" value="1"}

                <td class='text-center nowrap'>{$v.customer}</td>

                {/eq}

            </tr>

        {/foreach}

        </tbody>

    </table>

    {eq name="$setting.addr" value="1"}

        <div style="margin-left:30px; ">客戶信息:{$master_info.info.addr}</div>

    {/eq}

    <div style="margin-left:30px; ">合計(jì)金額:{$master_info.info.total_money}</div>

</div>

<!--<div style="page-break-after: always; page-break-inside: avoid;">-->

<!--</div>-->

{/foreach}

</body>

</html>

<script src="/static/plugs/jquery/jquery.min.js"></script>

<script>

    $('.printer').click(function () {

        $(this).hide();

        window.print();

        $(this).show();

    });

</script>


以上就是“網(wǎng)頁如何實(shí)現(xiàn)批量打印單據(jù)”的詳細(xì)內(nèi)容,更多請關(guān)注木子天禾科技其它相關(guān)文章!

以上就是“網(wǎng)頁如何實(shí)現(xiàn)批量打印單據(jù)”的詳細(xì)內(nèi)容,更多請關(guān)注木子天禾科技其它相關(guān)文章!

15934152105 掃描微信