<div id="kb" class="block">
    <div class="block_title">
        <h3><b><a href="index.php?fuse=clients&view=ShowCustomerData">Client Info</a> &raquo; <a href="#">Invoices</a></b></h3>
    </div>
    <ul>
        <li>
            <h1>[l]Invoices[/l]</h1>
            <p class="kb st" style="background: url(templates/{TEMPLATE}/images/public/icon_submit_ticket.jpg) no-repeat  0 8px;">[l]View your invoice details and upcoming recurring charges.  Click on an invoice description for more details.[/l]</p>
        </li>
        <li>

    <br />
    
    <div id="cip">
        <div class="nav_1">
            <ul>
                <li class="{active_selected}">
                    <a href="index.php?fuse=clients&amp;view=ViewInvoices"><span>[l]Active Invoices[/l]</span></a>
                </li>
                <li class="{archived_selected}">
                    <a href="index.php?fuse=clients&amp;view=ViewInvoices&archived=1"><span>[l]Archived Invoices[/l]</span></a>
                </li>
                <li>
                    <a href="index.php?fuse=clients&amp;view=ViewInvoices_Recurring"><span>[l]Recurring Charges[/l]</span></a>
                </li>
            </ul>
        </div>
        <br /><br />
    </div>

    <div style="padding-left: 15px;">
        <!-- BEGIN DYNAMIC BLOCK: showInvoiceFilter -->
        <form action="index.php" method="post" id="submit_ticket" style="padding:0;">
            <div class="invoice_filter" style="width:100%;">
                <!-- BEGIN DYNAMIC BLOCK: invoicefilteroptions -->
                <label><b>[l]Invoice Filter:[/l]</b></label>
                <select onchange="jumpMenu2('self',this,0);"  class="body" style="display:none">
                    <!-- BEGIN DYNAMIC BLOCK: invoicetypeoptions -->
                    <option value="{INVOICETYPEOPTIONVALUE}" {INVOICETYPEOPTIONSELECTED}>{INVOICETYPEOPTIONLABEL}&nbsp;&nbsp;&nbsp;&nbsp;</option>
                    <!-- END DYNAMIC BLOCK: invoicetypeoptions -->
                </select>
                <!-- END DYNAMIC BLOCK: invoicefilteroptions -->
                <!-- BEGIN DYNAMIC BLOCK: extrafilterblockforinvoices -->
                    <select onchange="jumpMenu2('self',this,0);"  class="body" style="{PAID_FILTER_STYLE}">
                        <!-- BEGIN DYNAMIC BLOCK: billingtypeoptions -->
                        <option value="{BILLINGTYPEOPTIONVALUE}" {BILLINGTYPEOPTIONSELECTED}>{BILLINGTYPEOPTIONLABEL}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</option>
                        <!-- END DYNAMIC BLOCK: billingtypeoptions -->
                    </select>
                <!-- END DYNAMIC BLOCK: extrafilterblockforinvoices -->
                {SPACES}
                <!-- BEGIN DYNAMIC BLOCK: multicurrencyoptions -->
                    <label><b>[l]Price:[/l]</b></label>
                    <select onchange="jumpMenu2('self',this,0);"  class="body">
                        <!-- BEGIN DYNAMIC BLOCK: pricetypeoptions -->
                        <option value="{PRICETYPEOPTIONVALUE}" {PRICETYPEOPTIONSELECTED}>{PRICETYPEOPTIONLABEL}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</option>
                        <!-- END DYNAMIC BLOCK: pricetypeoptions -->
                    </select>
                <!-- END DYNAMIC BLOCK: multicurrencyoptions -->
            </div>
        </form>
        <!-- END DYNAMIC BLOCK: showInvoiceFilter -->

        <!-- BEGIN DYNAMIC BLOCK: multicurrencynotice -->
        <div id="divdetails" class="table-summary" style="margin-bottom: 10px; margin-top: 10px;">
            <br>
            <h2>
                <font color=red>[l]Notice[/l]:</font>
            </h2>
            <h2>
                [l]You are using the Customer's Price Estimation, so all the values below are approximated values depending on the currencies rates.[/l]
            </h2>
        </div>
        <!-- END DYNAMIC BLOCK: multicurrencynotice -->

        <!-- BEGIN DYNAMIC BLOCK: invoice_block -->

        <div>
            <div class="ts table5">
                <form name="invoices" action="index.php" method="post" id="submit_ticket" style="padding:0">
                    <table width="100%">
                        <tr class="caption">
                            <td>[l]Due Date[/l]</td>
                            <td>[l]Description[/l]</td>
                            <td>[l]Payment Ref[/l]</td>
                            <td>[l]Amount[/l]</td>
                            <td>[l]Balance Due[/l]</td>
                            <td>[l]Status[/l]</td>
                        </tr>
                        <!-- BEGIN DYNAMIC BLOCK: invoicerow -->
                        <tr id="row_ie_{LISTINVOICEID}" class="{ROWCLASS}" style="{ROWSTYLE}">
                            <td>{COL2DATA}</td>
                            <td>{COL3DATA}</td>
                            <td id="check_{LISTINVOICEID}" align=center>{CHECKDATA}</td>
                            <td id="amount_{LISTINVOICEID}" align="right">{COL4DATA}</td>
                            <td id="balance_due_{LISTINVOICEID}" align="right">{BALANCEDUEDATA}</td>
                            <td id="status_{LISTINVOICEID}" align="center">{COL5DATA}</td>
                        </tr>
                        <!-- END DYNAMIC BLOCK: invoicerow -->
                        <!-- BEGIN DYNAMIC BLOCK: noinvoicesrow -->
                            <tr>
                                <td colspan="5" align=center><span style='font-size:11px;'>[l]There are no invoices for the selected billing type[/l]</span></td>
                            </tr>
                        <!-- END DYNAMIC BLOCK: noinvoicesrow -->
                    </table>
                </form>
            </div>
                    <div style="padding-right:">
                    <!-- BEGIN DYNAMIC BLOCK: pagebar -->
                        {pageBarDiv}
                    <!-- END DYNAMIC BLOCK: pagebar -->
        </div>

        <div class="ai_spacer">
            <!-- Buttons and Action Dropdown list -->
            <div id="invoicebuttons" style="height:50px;"><img src='images/spacer.gif' id='invoicebuttonwaiting' border='0' /></div>

            <script type="text/javascript">
            <!--
                if (document.images)
                {
                   pic1= new Image(167,14);
                   pic1.src="images/loading.gif";
                }
            //-->
            </script>

            <!-- BEGIN DYNAMIC BLOCK: showactiveinvoice_js -->
                <script type="text/javascript">
                //Used to show active invoice on page refresh
                {SETSELECTEDINVOICE_JSFUNCTION}
                </script>
            <!-- END DYNAMIC BLOCK: showactiveinvoice_js -->
        </div>

        <div id="ccinfo" style='align:left;display:none'>
            {CCINFO}
        </div>

        <!-- END DYNAMIC BLOCK: invoice_block -->


        <div id="invoicedetails" style='display:none;'>
            {INVOICEDETAILS}
        </div>

        <!-- BEGIN DYNAMIC BLOCK: invoiceadditionalinfosec -->
        <div class="clearline">&nbsp;</div>
        <div id="invoiceadditionalinfo">
            <span class="warningtext">[l]Additional Instructions[/l]</span><br />{INVOICEADDITIONALINFOTEXT}
        </div>
        <!-- END DYNAMIC BLOCK: invoiceadditionalinfosec -->
    </div>
    </li>
    </ul>
</div>
