如何用css和js在php中打印数据?

时间:2017-07-13 06:10:02

标签: javascript php css printing

enter image description here

上面的图像是发票的图像,然后用css和js打印出来。

enter image description here

这是我打印后的图像,打印前看起来不太好,所以请帮我拍一张与图1相同的照片['打印前']。

CSS

<link rel="stylesheet" type="text/css" href="css/custom_css/invoice.css">

CODE:

<aside class="right-side">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>Invoice</h1>
        <ol class="breadcrumb">
            <li>
                <a href="index.html">
                    <i class="fa fa-fw fa-home"></i> Dashboard
                </a>
            </li>
            <li> Pages</li>
            <li class="active">
                <a href="invoice.html">Invoice</a>
            </li>
        </ol>
    </section>
    <!-- Main content -->
    <section class="content p-l-r-15" id="invoice-stmt">
        <div class="panel panel-primary">
            <div class="panel-body">
                <div class="row printableArea">
                    <h1 align="center">National Battery Centre</h1>
                    <h4 align="center" style="text-transform:uppercase;" > Tax Invoice </h4>
                    <div class="col-md-12">
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <h4><strong>Jameel Khan</strong></h4>
                            <address>
                                <br/> Shop No : 1, Patel Tower
                                <br/> Bardoli, Dist - Surat
                                <br/> +91 9426890590
                            </address>
                        </div>
                        <?php
                            $query = mysql_query("SELECT * FROM customer_mst WHERE CUSTOMER_ID = '".$_SESSION['cust']."'");
                            $row = mysql_fetch_array($query);

                            $query_cart = mysql_query("SELECT * FROM final_invoice_mst WHERE CUSTOMER_ID = '".$_SESSION['cust']."' AND DATE = '".$_SESSION['date']."' AND FLAG = '0'");
                            $row_cart = mysql_fetch_array($query_cart);
                        ?>
                        <div class="col-md-6 col-sm-12 col-xs-6 text-right">
                            <div class="pull-right">
                                <h4><strong><?php echo $row['CUSTOMER_NAME']; ?></strong></h4>
                                <address>
                                    <br/> <?php echo $row['CUSTOMER_ADDRESS']; ?>
                                    <br/> <?php echo $row['CUSTOMER_CITY'] ?>
                                    <br/> <?php echo $row['CUSTOMER_CONTACT'] ?>
                                    <br/> <?php echo $row['VEHICLE_NO'] ?>
                                </address>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">

                            <div class="pull-right">
                                <font color="#000000" size="4">Bill No : <?php echo $row_cart['BILL_NO'] ?></font>
                            </div>

                            <div class="pull-left">
                                <font color="#000000" size="4">Date : <?php echo $_SESSION['date'] ?></font>
                            </div>
                    </div>
                    <div class="col-md-12">
                        <div class="table-responsive">
                            <table class="table table-striped">
                                <thead>
                                <tr class="bg-primary">
                                    <th width="10%"><strong>Sr No.</strong></th>
                                    <th class="text-left"><strong>Item Name</strong></th>
                                    <th class="text-left"><strong> Serial No </strong></th>
                                    <th class="text-right"><strong> CGST </strong></th>
                                    <th class="text-right"><strong> SGST </strong></th>
                                    <th class="text-right"><strong> Net Amount </strong></th>
                                </tr>
                                </thead>

                                <tbody>
                                <?php
                                    $query_cart1 = mysql_query("SELECT * FROM final_invoice_mst, item_details WHERE final_invoice_mst.CUSTOMER_ID = '".$_SESSION['cust']."' AND final_invoice_mst.FLAG = '0' AND final_invoice_mst.ITEM_NAME = item_details.ITEM_NAME");
                                    $counter = 0;
                                    while($row_cart1 = mysql_fetch_array($query_cart1))
                                    {
                                ?>
                                <tr>
                                    <td ><?php echo ++$counter; ?></td>
                                    <td class="text-left"><?php echo $row_cart1['ITEM_NAME']; ?></td>
                                    <td class="text-left"><?php echo $row_cart1['SERIAL_NO'];?></td>
                                    <td class="text-right"><?php echo $row_cart1['CGST'];?></td>
                                    <td class="text-right"><?php echo $row_cart1['SGST'];?></td>
                                    <td class="text-right"><?php echo $row_cart1['NAMT'];?></td>
                                </tr>
                                <?php
                                    }
                                ?>
                                </tbody>
                            </table>

                        </div>
                    </div>
                    <div class="col-md-12">
                        <?php
                            //Battery Inverter Both
                            $sum_cgst = mysql_query("SELECT SUM(CGST) FROM final_invoice_mst, item_details WHERE final_invoice_mst.CUSTOMER_ID = '".$_SESSION['cust']."' AND final_invoice_mst.FLAG = '0' AND final_invoice_mst.ITEM_NAME = item_details.ITEM_NAME AND item_details.TYPE = 'BAT'");
                        $row_sum_cgst = mysql_fetch_array($sum_cgst);

                        $sum_sgst = mysql_query("SELECT SUM(SGST) FROM final_invoice_mst, item_details WHERE final_invoice_mst.CUSTOMER_ID = '".$_SESSION['cust']."' AND final_invoice_mst.FLAG = '0' AND final_invoice_mst.ITEM_NAME = item_details.ITEM_NAME AND item_details.TYPE = 'BAT'");
                        $row_sum_sgst = mysql_fetch_array($sum_sgst);

                        $sum_namt = mysql_query("SELECT SUM(NAMT) FROM final_invoice_mst, item_details WHERE final_invoice_mst.CUSTOMER_ID = '".$_SESSION['cust']."' AND final_invoice_mst.FLAG = '0' AND final_invoice_mst.ITEM_NAME = item_details.ITEM_NAME AND item_details.TYPE = 'BAT'");
                        $row_sum_namt = mysql_fetch_array($sum_namt);

                        //Inverter
                        $isum_cgst = mysql_query("SELECT SUM(CGST) FROM final_invoice_mst, item_details WHERE final_invoice_mst.CUSTOMER_ID = '".$_SESSION['cust']."' AND final_invoice_mst.FLAG = '0' AND final_invoice_mst.ITEM_NAME = item_details.ITEM_NAME AND item_details.TYPE = 'INV'");
                        $irow_sum_cgst = mysql_fetch_array($isum_cgst);

                        $isum_sgst = mysql_query("SELECT SUM(SGST) FROM final_invoice_mst, item_details WHERE final_invoice_mst.CUSTOMER_ID = '".$_SESSION['cust']."' AND final_invoice_mst.FLAG = '0' AND final_invoice_mst.ITEM_NAME = item_details.ITEM_NAME AND item_details.TYPE = 'INV'");
                        $irow_sum_sgst = mysql_fetch_array($isum_sgst);                 


                        $isum_namt = mysql_query("SELECT SUM(NAMT) FROM final_invoice_mst, item_details WHERE final_invoice_mst.CUSTOMER_ID = '".$_SESSION['cust']."' AND final_invoice_mst.FLAG = '0' AND final_invoice_mst.ITEM_NAME = item_details.ITEM_NAME AND item_details.TYPE = 'INV'");
                        $irow_sum_namt = mysql_fetch_array($isum_namt);

                            if($rque1['TYPE'] == 'BAT' && $rque2['TYPE'] != 'INV')
                            {
                        ?>
                        <div class="col-lg-9">

                        </div>

                        <div class="col-lg-3">
                            <table class="table">
                                <thead>
                                <tbody>
                                 <tr>
                                    <td>Net Amount</td>
                                    <td class="text-left"><?php $inamt = $row_sum_namt['SUM(NAMT)']; echo "$inamt"; ?></td>
                                </tr>

                                <tr>
                                    <td>CGST 14%</td>
                                    <td class="text-left"><?php $icgst = $row_sum_cgst['SUM(CGST)']; echo "$icgst"; ?></td>
                                </tr>

                                <tr>
                                    <td>SGST 14%</td>
                                    <td class="text-left"><?php $isgst = $row_sum_sgst['SUM(SGST)']; echo "$isgst"; ?></td>
                                </tr>

                                <tr>
                                    <td>IGST 28%</td>
                                    <td class="text-left">&nbsp;</td>
                                </tr>

                                <tr>
                                    <td>TOTAL</td>
                                    <td class="text-left"><?php $total = $inamt + $icgst + $isgst; echo round($total); ?></td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                        <?php
                            }

                            if($rque2['TYPE'] == 'INV' && $rque1['TYPE'] != 'BAT')
                            {
                        ?>
                        <div class="col-lg-9">

                        </div>

                        <div class="col-lg-3">
                            <table class="table">
                                <tbody>
                                 <tr>
                                    <td>Net Amount</td>
                                    <td class="text-left"><?php $inamt = $irow_sum_namt['SUM(NAMT)']; echo "$inamt"; ?></td>
                                </tr>
                                <tr>
                                    <td>CGST 9%</td>
                                    <td class="text-left"><?php $icgst = $irow_sum_cgst['SUM(CGST)']; echo "$icgst"; ?></td>
                                </tr>
                                <tr>
                                    <td>SGST 9%</td>
                                    <td class="text-left"><?php $isgst = $irow_sum_sgst['SUM(SGST)']; echo "$isgst"; ?></td>
                                </tr>
                                <tr>
                                    <td>IGST 18%</td>
                                    <td class="text-left">&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>TOTAL</td>
                                    <td class="text-left"><?php $total = $inamt + $icgst + $isgst; echo round($total); ?></td>
                                </tr>

                                </tbody>
                            </table>
                        </div>
                        <?php
                            }
                            if($rque1['TYPE'] == 'BAT' && $rque2['TYPE'] == 'INV')
                            {
                        ?>
                        <div class="col-lg-6">

                        </div>

                        <div class="col-lg-3">
                            <table class="table">
                                <thead>
                                <tbody>
                                 <tr>
                                    <td>Net Amount</td>
                                    <td class="text-left"><?php $inamt = $row_sum_namt['SUM(NAMT)']; echo "$inamt"; ?></td>
                                </tr>

                                <tr>
                                    <td>CGST 14%</td>
                                    <td class="text-left"><?php $icgst = $row_sum_cgst['SUM(CGST)']; echo "$icgst"; ?></td>
                                </tr>

                                <tr>
                                    <td>SGST 14%</td>
                                    <td class="text-left"><?php $isgst = $row_sum_sgst['SUM(SGST)']; echo "$isgst"; ?></td>
                                </tr>

                                <tr>
                                    <td>IGST 28%</td>
                                    <td class="text-left">&nbsp;</td>
                                </tr>

                                <tr>
                                    <td>TOTAL</td>
                                    <td class="text-left"><?php $total = $inamt + $icgst + $isgst; echo round($total); ?></td>
                                </tr>
                                </tbody>
                            </table>
                        </div>

                        <div class="col-lg-3">
                            <table class="table">
                                <tbody>
                                 <tr>
                                    <td>Net Amount</td>
                                    <td class="text-left"><?php $inamt = $irow_sum_namt['SUM(NAMT)']; echo "$inamt"; ?></td>
                                </tr>
                                <tr>
                                    <td>CGST 9%</td>
                                    <td class="text-left"><?php $icgst = $irow_sum_cgst['SUM(CGST)']; echo "$icgst"; ?></td>
                                </tr>
                                <tr>
                                    <td>SGST 9%</td>
                                    <td class="text-left"><?php $isgst = $irow_sum_sgst['SUM(SGST)']; echo "$isgst"; ?></td>
                                </tr>
                                <tr>
                                    <td>IGST 18%</td>
                                    <td class="text-left">&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>TOTAL</td>
                                    <td class="text-left"><?php $total = $inamt + $icgst + $isgst; echo round($total); ?></td>
                                </tr>

                                </tbody>
                            </table>
                        </div>
                        <?php
                            }
                        ?>
                        <h4><Strong>Terms and conditions:</Strong></h4>
                        <ul>
                            <li>An invoice must accompany products returned for warantty</li>
                            <li>Balance due within 10 days of invoice date,1.5% interest/month thereafter.</li>
                            <li>All goods returned for replacement/credit must be saleable condition with original
                                packaging.
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="btn-section">
                    <div class="col-md-12 col-sm-12 col-xs-12">
                        <span class="pull-right">
                            <form id="form1">
                                <input type="button" value="Print" class="btn btn-danger" onclick='PrintDiv();' id="print" />
                            </form>
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- /.content -->
</aside>

<script src="js/jquery.PrintArea.js" type="text/JavaScript"></script>
<script>
$(document).ready(function() {
    $("#print").click(function() {
        var mode = 'iframe'; //popup
        var close = mode == "popup";
        var options = {
            mode: mode,
            popClose: close
        };
        $("div.printableArea").printArea(options);
    });
});
</script>

2 个答案:

答案 0 :(得分:0)

您可以在其他文件中指定打印样式并使用以下内容导入:

<link rel="stylesheet" type="text/css" href="print.css" media="print">

默认mediaall,适用于所有设备,包括打印机,我猜你现在正在使用它。如果这不起作用,则需要创建一个新的CSS文件。

答案 1 :(得分:0)

在我尝试了所有内容后,我发现最佳解决方案是通过target="_blank"window.open(url)打开另一个标签页。

用于隐藏页面顶部的网址

<style type="text/css" media="print">
@page {
    size: auto;   /* auto is the initial value */
    margin: 0;  /* this affects the margin in the printer settings */
}
</style>

javascript立即打开打印对话并在打印完成后关闭

<script>

window.onload= function () { 
    window.print();
setTimeout(function(){
window.close();
},500 )
   }  
   </script>