@{
    ViewBag.Title = "Voucher";
}
<script type="text/javascript" src="../Projectscript/Voucher.js"></script>
<script type="text/javascript" src="../Projectscript/Common.js"></script>

<style>
    #panel7 {
        display: none;
    }

</style>



<div class="modal fade text-left show" id="iconForm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel17" style="padding-right: 17px;top:5%; display: none;background:rgba(0,0,0,0.5);">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel17">Paid Invoices</h4>
                <button type="button" class="close" data-dismiss="modal" onclick="($('#iconForm').hide())" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="table-responsive">
                    <table id="recent-orders" class="table table-hover mb-0 ps-container ps-theme-default">
                        <thead>
                            <tr>
                                <th>No</th>
                                <th>Voucher#</th>
                                <th>Customer Name</th>
                                <th>Status</th>
                                <th>Amount</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="text-truncate">V-10521</td>
                                <td class="text-truncate"><a href="#">RV-00100</a></td>
                                <td class="text-truncate">Elizabeth</td>
                                <td class="text-truncate">
                                    <span class="badge badge-default badge-success">Paid</span>
                                </td>
                                <td class="text-truncate">$ 1200.00</td>
                            </tr>
                            <tr>
                                <td class="text-truncate">V-532521</td>
                                <td class="text-truncate"><a href="#">RV-01112</a></td>
                                <td class="text-truncate">Doris R</td>
                                <td class="text-truncate">
                                    <span class="badge badge-default badge-success">Paid</span>
                                </td>
                                <td class="text-truncate">$ 5685.00</td>
                            </tr>

                        </tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <input type="button" class="btn btn-outline-secondary btn-lg" onclick="($('#iconForm').hide())" value="close">
            </div>
        </div>
    </div>
</div>




<div id="Entry">
    <section class="grid-row-label" id="grid-row-label">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                   
                    <div class="card-content collapse show">
                        <div class="card-body">
                            <h3>Receipt Voucher</h3>
                            <hr />
                            <form action="#">
                                <div class="form-body">
                                    <div class="form-group row">
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="VoucherId">Voucher No</label>
                                        </div>
                                        <div class="col-md-3">
                                            <input type="text" id="VoucherId" class="form-control" readonly="readonly">
                                        </div>
                                        <div class="col-md-1"  style="text-align:right;">
                                            <label for="VoucherDate">Voucher Date<span class="danger">*</span></label>
                                        </div>
                                        <div class="col-md-3">
                                            <input type="date" id="VoucherDate" class="form-control" data-trigger="hover" data-placement="top" data-title="VoucherDate" style="height:40px;" />
                                        </div>                                        
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="CustomerName">Customer<span class="danger">*</span></label>
                                        </div>
                                        <div class="col-md-3">
                                            <select id="CustomerName" class="form-control">
                                                <option value="1">Cust 1</option>
                                                <option value="2">Cust 2</option>
                                                <option value="3">Cust 3</option>
                                                </select>
                                        </div>
                                        <div class="col-md-1">
                                            <label for="AccountType" style="text-align:right;">Voucher Type<span class="danger">*</span></label>
                                        </div>
                                        <div class="col-md-3">
                                            <select id="AccountType" class="form-control">
                                                
                                            </select>
                                        </div>                                        
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="ChequeDate">ChequeDate</label>
                                        </div>
                                        <div class="col-md-2">
                                            <input type="date" id="ChequeDate" class="form-control" data-trigger="hover" data-placement="top" data-title="ChequeDate" readonly="readonly">
                                        </div>                                        
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="VoucherAmount">Amount<span class="danger">*</span></label>
                                        </div>
                                        <div class="col-md-3">
                                            <input type="text" id="VoucherAmount" class="form-control">
                                            <div class="d-inline-block custom-control custom-checkbox" style="margin-left:290px;">
                                                <input type="checkbox" class="custom-control-input" id="Advance" />
                                                <label class="custom-control-label" for="Advance">Advance</label>
                                            </div>
                                        </div>                                        
                                        <div class="col-md-1" style="text-align:right;" >
                                            <label for="ChequeNo">Cheque No</label>
                                        </div>
                                        <div class="col-md-3" >
                                            <input type="text" id="ChequeNo" class="form-control" readonly="readonly" />
                                        </div>
                                        <div class="col-md-1" style="text-align:right;" >
                                            <label for="Bank">Bank</label>
                                        </div>
                                        <div class="col-md-2">
                                            <select id="Bank" class="form-control" disabled>

                                            </select>
                                        </div>                                                                                
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="Currency">FC</label>
                                        </div>
                                        <div class="col-md-3">
                                            <select id="Currency" onchange="CurrencyChange(this.id)" class="form-control">
                                                <option value="1">Cur 1</option>
                                                <option value="2">Cur 2</option>
                                                <option value="3">Cur 3</option>
                                            </select>
                                        </div>
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="Rate">Rate</label>
                                        </div>
                                        <div class="col-md-3">
                                            <input type="text" id="Rate" onchange="CalculateFCAmount()" class="form-control">
                                        </div>
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="VoucherFCAmount">FC Amount</label>
                                        </div>
                                        <div class="col-md-2">
                                            <input type="text" id="VoucherFCAmount" onkeyup="CalculateAmount()" class="form-control">
                                        </div>
                                        </div>
                                    <div class="form-group row">
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="JobCode">Job Code</label>
                                        </div>
                                        <div class="col-md-3">
                                            <select id="JobCode" class="form-control">
                                                <option value="1">Job 1</option>
                                                <option value="2">Job 2</option>
                                                <option value="3">Job 3</option>
                                            </select>
                                        </div>
                                        <div class="col-md-1" style="text-align:right;">
                                            <label for="CostCenterCode">Cost Center</label>
                                        </div>
                                        <div class="col-md-3">
                                            <select id="CostCenterCode" class="form-control">
                                               
                                            </select>
                                        </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-md-3">
                                                <div class="form-group" >
                                                    <button id="RVDetails" type="button" class="btn btn-outline-primary mr-1">View Pending Invoices&nbsp;<i class="fa fa-search"></i></button>
                                                </div>
                                            </div>
                                        </div>
                                        <div id="panel7">
                                            <div class="row">
                                                <div class="card" style="width: 1500px;">
                                                    <div class="card-content">                                                        
                                                        <div class="table-responsive">
                                                            <table id="recent-orders" class="table table-hover mb-0 ps-container ps-theme-default">
                                                                <thead>
                                                                    <tr><th></th>
                                                                        <th>No</th>
                                                                        <th>Voucher#</th>
                                                                        <th>Customer Name</th>
                                                                        <th>Status</th>
                                                                        <th>Amount</th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <td><input type="checkbox"  /></td>
                                                                        <td class="text-truncate">V-10521</td>
                                                                        <td class="text-truncate"><a href="#">RV-00100</a></td>
                                                                        <td class="text-truncate">Elizabeth</td>
                                                                        <td class="text-truncate">
                                                                            <span class="badge badge-default badge-warning">Overdue</span>
                                                                        </td>
                                                                        <td class="text-truncate">$ 1200.00</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td><input type="checkbox" /></td>
                                                                        <td class="text-truncate">V-532521</td>
                                                                        <td class="text-truncate"><a href="#">RV-01112</a></td>
                                                                        <td class="text-truncate">Doris R</td>
                                                                        <td class="text-truncate">
                                                                            <span class="badge badge-default badge-warning">Overdue</span>
                                                                        </td>
                                                                        <td class="text-truncate">$ 5685.00</td>
                                                                    </tr>

                                                                </tbody>
                                                            </table>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    <div class="row" style="margin-left:120px;">
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label for="Debit">Debit</label>
                                                <input type="text" id="Debit" class="form-control" readonly="readonly">
                                            </div>
                                        </div>
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label for="Credit">Credit</label>
                                                <input type="text" id="Credit" class="form-control" readonly="readonly">
                                            </div>
                                        </div>
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label for="Diff">Diff</label>
                                                <input type="text" id="Diff" class="form-control" readonly="readonly">
                                            </div>
                                        </div>
                                    </div>                                        
                                    </div>

                                <div class="form-actions">
                                    <div class="row">                                                                                                                                                                   
                                                <div class="col-md-2">                                                 
                                                    <button type="button" onclick="($('#iconForm').show())" class="btn btn-outline-primary mr-1">View Paid Invoices&nbsp;<i class="fa fa-search"></i></button> 
                                                </div>                                                                                     
                                                <div class="col-md-10" >
                                                    <div class="text-right">
                                                        <button type="button" style="width:100px" id="btnsubmit" class="btn btn-primary btn-min-width mr-1 mb-1"><u>S</u>ave <i class="fa fa-check-square-o"></i></button>
                                                        <button type="button" style="width:100px" id="btnlist" onclick="GetRows(0)" class="btn btn-primary btn-min-width mr-1 mb-1">List <i class="ft-align-justify"></i></button>
                                                        <button type="button" style="width:100px" id="btnnew" onclick="formrefresh()" class="btn btn-primary btn-min-width mr-1 mb-1">Clear <i class="ft-refresh-cw position-right"></i></button>
                                                        <button style="display:none" type="button" id="btndelete" class="btn btn-primary btn-min-width mr-1 mb-1">Delete <i class="fa fa-times"></i></button>
                                                    </div>
                                                    </div>                                            
                                    </div>
                                    </div>
</form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>



<div style="display:none;" id="listing">
    <section>
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header" style="border-bottom:1px solid #cccccc">
                        <h4 class="card-title">Voucher List</h4>
                        <div class="heading-elements">
                            <ul class="list-inline mb-0">
                                <li><a data-action="collapse"><i class="ft-minus"></i></a></li>
                                <li><a data-action="reload"><i class="ft-rotate-cw"></i></a></li>
                                <li><a onclick="GetRows(0)" data-action="expand"><i class="ft-maximize"></i></a></li>
                                <li><a onclick="closetable(0)" data-action="#"><i class="ft-x"></i></a>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" onclick="closetable(1)" class="btn btn-outline-primary"><i class="ft-edit"></i> Add New</button>
                                        <button type="button" class="btn btn-outline-primary"><i class="ft-edit"></i> Export</button>
                                        <button type="button" class="btn btn-outline-primary dropdown-toggle" data-toggle="dropdown"
                                                aria-haspopup="true" aria-expanded="false">
                                            <span class="sr-only">Toggle Dropdown</span>
                                        </button>
                                        <div class="dropdown-menu">
                                            <a class="dropdown-item" href="#">Excel</a>
                                            <a class="dropdown-item" href="#">PDF</a>
                                            <div class="dropdown-divider"></div>
                                            <a class="dropdown-item" href="#">Print</a>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="card-content collapse show">
                        <div class="card-body card-dashboard">
                            <table id="tblvoucher" class="table table-striped table-bordered zero-configuration dataTable"></table>


                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>

<div style="display:none"><input type="text" value="0" id="VoucherId" /></div>