<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="Asset/font-awesome.min.css">
    <style type="text/css">

        table {
            border-collapse: collapse;
            width: 100%;
        }

        th,
        td {
            text-align: left;
            border: 1px solid #ccc;
        }

        tbody tr:nth-child(odd) {
            background: #eee;
        }

        .invoice-info-table {
            width: 100%;
            font-size: 18px;
            text-align: left;
        }

        .invoice-info-title {
            border: 1.5px #1EB0FC solid;
        }
    </style>
</head>
<body style="font-family:FontAwesome; margin:3%">
    <div>
        <div style="padding-bottom: 0">
            <h1 style='float:left'>
                <b>Consolidated Sales Report</b>
            </h1>
            <br style="clear:both;">
        </div>
        <div style="width: 100%;overflow: hidden;">
            <div style="float: left; line-height:50%">
                <h3>Company Name : {{config.company_name}}</h3>
                <h3>Time From : {{datetime_start}}</h3>
                <h3>Time To : {{datetime_end}}</h3>
            </div>
        </div>
        <div style="text-align:center; line-height:50%; bottom: -30px;margin-top:0;">
            <h3>Summarized Figures</h3>
        </div>
        <div>
            <table style="font-size:18px;width: 100%; text-align:left; ">
                <tbody>
                    <tr style="font-size:18px; font-weight: 600;">
                        <td>Gross Sale</td>
                        <td>GST</td>
                        <td>SC</td>
                        <td>Rounding</td>
                        <td>Cost</td>
                        <td>Net Sale</td>
                        <td>Net Profit</td>
                    </tr>
                    <tr>
                        <td>S$&nbsp;{{gross_sale}}</td>
                        <td>S$ {{Sum 'tax' invoice_close}}</td>
                        <td>S$ {{Sum 'service_charge' invoice_close}}</td>
                        <td>S$ {{Sum 'rounding' invoice_close}}</td>
                        <td>S$&nbsp;{{cost}}</td>
                        <td>S$&nbsp;{{net_sale}}</td>
                        <td>S$&nbsp;{{net_profit}}</td>
                    </tr>
                </tbody>
            </table>
            <table style="font-size:18px;width: 100%; text-align:left;margin-top:2%; ">
                <tbody>
                    <tr style="font-size:18px; font-weight: 600;">
                        <td>Total</td>
                        <td>Average Sale Per Transaction</td>
                        <td>Average Items Per Transaction</td>
                    </tr>
                    <tr>
                        <td>S$ {{Sum 'grand_total' invoice_close}}</td>
                        <td>S$&nbsp;{{average_sale_per_transaction}}</td>
                        <td>S${{average_item_per_transaction}}</td>
                    </tr>
                </tbody>
            </table>
            <table style="font-size:18px;width: 100%; text-align:left;margin-top:2%; ">
                <tbody>
                    <tr style="font-size:18px; font-weight: 600;">
                        {{#each payment}}
                        <td>{{ name }}</td>
                        {{/each}}
                    </tr>
                    <tr style="font-size:18px; ">
                        {{#each payment}}
                        <td>S$ {{subtotal}}</td>
                        {{/each}}
                    </tr>
                </tbody>
            </table>
        </div>
        <div style="text-align:center; height:auto; margin-top: 2rem;">
            <h3>Item Sales Table</h3>
        </div>
        <div style="margin-top: -40px;">
            {{#each category}}
            <div style="line-height:40px;padding:12px; margin-top:5%;overflow:hidden;text-align: center;font-size:16px;font-weight: 500;border:1px solid rgb(202,203,204);">
                <div style="float:left;width:40%;text-align: left; font-size:20px; font-weight:bold;">{{name}}</div>
                <div style="float:left;width:25%">Category Total&nbsp:&nbsp&nbsp S${{subtotal}}</div>
                <div style="float:left;width:25%;text-align: right;">{{percent}}%</div>
            </div>
            <table style="font-size:18px;width: 100%; text-align:left;">
                <!-- <col width="40%">
                <col width="20%">
                <col width="20%">
                <col width="20%"> -->
                <tbody>
                    <tr style="font-size:18px;">
                        <th>Item Name</th>
                        <th>Quantity</th>
                        <th>Unit Price</th>
                        <th>Item Total</th>
                    </tr>
                    {{#each item}}
                    <tr>
                        <td>{{name}}</td>
                        <td>{{Sum 'quantity' invoice_line_close}}</td>
                        <td>{{price}}</td>
                        <td>{{Sum 'subtotal' invoice_line_close}}</td>
                    </tr>
                    {{/each}}
                </tbody>
            </table>
            {{/each}}
        </div>
        <div style='page-break-before: always;'></div>
    </div>
    <div style="width: 100%;overflow: hidden;bottom:0%; ">
        <div style="text-align:center; line-height:50%; margin-top: 30px;">
            <h3>Transaction Table</h3>
        </div>
    </div>

    <div class="w-100p">
        <table class="invoice-info-table">
            <tbody>
                <tr>
                    <td>Invoice No.</td>
                    <td>Subtotal</td>
                    <td>Discount</td>
                    <td>GST</td>
                    <td>Ser.Charge</td>
                    <td>Payment</td>
                    <td>Total</td>
                    <td>DateTime</td>
                </tr>
                {{#each invoice_close}}
                <tr>
                    <td>{{ref_id}}</td>
                    <td>{{subtotal}}</td>
                    <td>{{discount_amount}}</td>
                    <td>{{tax}}</td>
                    <td>{{service_charge}}</td>
                    <td>
                        {{#each payment}}
                        <span>
                            {{payment_method.name}}:
                        </span>
                        <span>
                            {{tender_amount}}
                        </span>
                        &nbsp;
                        {{/each}}
                    </td>
                    <td>{{grand_total}}</td>
                    <td>{{datetime_close}}</td>
                </tr>
                {{/each}}
            </tbody>
        </table>
    </div>

</body>
</html>