| Invoice # |
Total Amount |
Payment Method |
Invoice Date |
Due Date |
Status |
Close Date |
Payment Info |
Actions |
| 76284 |
20,230.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Paid |
01/27/2021 |
|
|
| 76315 |
1,418.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Paid |
01/27/2021 |
|
|
| 28476 |
1,989.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Not Paid |
01/27/2021 |
|
|
| 62784 |
1,230.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Paid |
01/27/2021 |
|
|
| 84762 |
1,122.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Not Paid |
01/27/2021 |
|
|
| Invoice # |
Total Amount |
Payment Method |
Invoice Date |
Due Date |
Status |
Close Date |
Payment Info |
Actions |
| 76284 |
20,230.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Paid |
01/27/2021 |
|
|
| 76315 |
1,418.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Paid |
01/27/2021 |
|
|
| 62784 |
1,230.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Paid |
01/27/2021 |
|
|
| Invoice # |
Total Amount |
Payment Method |
Invoice Date |
Due Date |
Status |
Close Date |
Payment Info |
Actions |
| 28476 |
1,989.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Not Paid |
01/27/2021 |
|
|
| 84762 |
1,122.00 |
Credit card |
01/27/2021 |
01/27/2021 |
Not Paid |
01/27/2021 |
|
|
<!--my invoices-->
<div class="storefront-rightbar my-invoices mt-3 mainTab" style="display: none;">
<div class="row ">
<div class="col-md-12">
<h3>My Invoices</h3>
<div class="config-tabs mx-auto">
<div class="custom-tab-col">
<div class="overview-tabs m-0 mx-auto action-tabs">
<a href="javascript:void(0);" class="active" data-active ="allInv">All Invoices</a>
<a href="javascript:void(0);" class="ml-2" data-active ="paidInv">Paid Invoices</a>
<a href="javascript:void(0);" class="ml-2" data-active ="ntPaidInv">Not Paid Invoices</a>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="products-search">
<div class="search-input-col w-100 mr-0">
<i class="icon-cross" style="display: none;"></i>
<i class="icon-search"></i>
<input type="text" class="form-control form-control-padding search-category ui-autocomplete-input" placeholder="Search by invoice number" autocomplete="off">
<ul id="ui-id-2" tabindex="0" class="ui-menu ui-widget ui-widget-content ui-autocomplete ui-front" style="display: none;"></ul>
</div>
</div>
</div>
<div class="col-md-3 pl-0">
<div class="row no-gutters date-block">
<div class="col-md-6">
<div class="scheduled-time mt-0">
<div class="search-input-col date-picker w-100">
<input type="text" class="form-control form-control-padding date start-date" placeholder="Start Date">
<i class="icon-calender-outline"></i>
</div>
</div>
</div>
<div class="col-md-6">
<div class="scheduled-time mt-0">
<div class="search-input-col date-picker w-100">
<input type="text" class="form-control form-control-padding date end-date" placeholder="End Date">
<i class="icon-calender-outline"></i>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-5">
<div class="float-right mt-2">
<a href="javascript:void(0);"><i class="icon-export-arrow mr-2"></i> Export</a>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="list-view-tile summary-tab-table customers-box selectedTab allInv">
<table class="table custom-table endCustTbl">
<thead class="thead-light">
<tr>
<th scope="col" width="15%">Invoice # </th>
<th scope="col" width="10%" class="text-right">Total Amount</th>
<th scope="col" width="10%">Payment Method</th>
<th scope="col" width="10%">Invoice Date</th>
<th scope="col" width="10%">Due Date </th>
<th scope="col" width="10%">Status</th>
<th scope="col" width="10%">Close Date</th>
<th scope="col" width="15%">Payment Info</th>
<th scope="col" width="10%">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="text-blue">76284</span></td>
<td class="text-right">20,230.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar active">Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
<tr>
<td><span class="text-blue">76315</span></td>
<td class="text-right">1,418.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar active">Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
<tr>
<td><span class="text-blue">28476</span></td>
<td class="text-right">1,989.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar inactive">Not Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
<tr>
<td><span class="text-blue">62784</span></td>
<td class="text-right">1,230.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar active">Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
<tr>
<td><span class="text-blue">84762</span></td>
<td class="text-right">1,122.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar inactive">Not Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
</tbody>
</table>
<nav aria-label="navigation" class="pagination-col pt-2 selectedTab">
<span class="item-dropdown-col">
View
<div class="items-dropdown">
<i class="icon-arrow-bottom"></i>
<select>
<option>10</option>
<option>15</option>
<option>20</option>
</select>
</div>
<span class="view-text">Items Per Page</span>
</span>
<ul class="table-count-list m-auto">
<li class="left-arrow"><a href="javascript:void(0);"><i class="icon-arrow-right"></i></a></li>
<li class="active"><a href="javascript:void(0);"><span>1</span></a></li>
<li><a href="#page-2" class=""> <span>2</span></a></li>
<li class="right-arrow"><a href="javascript:void(0);"><i class="icon-arrow-right"></i></a></li>
</ul>
<ul class="next-prev-page">
<li><a href="javascript:void(0);"><i class="icon-left-arrow-double mr-1"></i>First</a></li>
<li><a href="javascript:void(0);"><i class="icon-left-arrow mr-1"></i>Previous</a></li>
<li><span class="page-count">1 of 12</span></li>
<li><a href="javascript:void(0);">Next<i class="icon-right-arrow-b ml-1"></i></a></li>
<li class="last-page"><a href="javascript:void(0);">Last <i class="icon-left-arrow-double pr-1"></i></a></li>
</ul>
</nav>
</div>
<div class="list-view-tile summary-tab-table customers-box selectedTab paidInv" style="display: none;">
<table class="table custom-table endCustTbl">
<thead class="thead-light">
<tr>
<th scope="col" width="15%">Invoice # </th>
<th scope="col" width="10%" class="text-right">Total Amount</th>
<th scope="col" width="10%">Payment Method</th>
<th scope="col" width="10%">Invoice Date</th>
<th scope="col" width="10%">Due Date </th>
<th scope="col" width="10%">Status</th>
<th scope="col" width="10%">Close Date</th>
<th scope="col" width="15%">Payment Info</th>
<th scope="col" width="10%">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="text-blue">76284</span></td>
<td class="text-right">20,230.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar active">Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
<tr>
<td><span class="text-blue">76315</span></td>
<td class="text-right">1,418.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar active">Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
<tr>
<td><span class="text-blue">62784</span></td>
<td class="text-right">1,230.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar active">Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="" data-original-title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
</tbody>
</table>
<nav aria-label="navigation" class="pagination-col pt-2 selectedTab synnx">
<span class="item-dropdown-col">
View
<div class="items-dropdown">
<i class="icon-arrow-bottom"></i>
<select>
<option>10</option>
<option>15</option>
<option>20</option>
</select>
</div>
<span class="view-text">Items Per Page</span>
</span>
<ul class="table-count-list m-auto">
<li class="left-arrow"><a href="javascript:void(0);"><i class="icon-arrow-right"></i></a></li>
<li class="active"><a href="javascript:void(0);"><span>1</span></a></li>
<li><a href="#page-2" class=""> <span>2</span></a></li>
<li class="right-arrow"><a href="javascript:void(0);"><i class="icon-arrow-right"></i></a></li>
</ul>
<ul class="next-prev-page">
<li><a href="javascript:void(0);"><i class="icon-left-arrow-double mr-1"></i>First</a></li>
<li><a href="javascript:void(0);"><i class="icon-left-arrow mr-1"></i>Previous</a></li>
<li><span class="page-count">1 of 12</span></li>
<li><a href="javascript:void(0);">Next<i class="icon-right-arrow-b ml-1"></i></a></li>
<li class="last-page"><a href="javascript:void(0);">Last <i class="icon-left-arrow-double pr-1"></i></a></li>
</ul>
</nav>
</div>
<div class="list-view-tile summary-tab-table customers-box selectedTab ntPaidInv" style="display: none;">
<table class="table custom-table endCustTbl">
<thead class="thead-light">
<tr>
<th scope="col" width="15%">Invoice # </th>
<th scope="col" width="10%" class="text-right">Total Amount</th>
<th scope="col" width="10%">Payment Method</th>
<th scope="col" width="10%">Invoice Date</th>
<th scope="col" width="10%">Due Date </th>
<th scope="col" width="10%">Status</th>
<th scope="col" width="10%">Close Date</th>
<th scope="col" width="15%">Payment Info</th>
<th scope="col" width="10%">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="text-blue">28476</span></td>
<td class="text-right">1,989.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar inactive">Not Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
<tr>
<td><span class="text-blue">84762</span></td>
<td class="text-right">1,122.00</td>
<td>Credit card</td>
<td>01/27/2021</td>
<td>01/27/2021</td>
<td><span class="status-bar inactive">Not Paid</span></td>
<td>01/27/2021</td>
<td></td>
<td><a href="javascript:void(0)" class="circle-link"><i class="icon-pdf" data-toggle="tooltip" data-placement="top" title="Download Agreement"><span class="path1"></span><span class="path2"></span></i></a></td>
</tr>
</tbody>
</table>
<nav aria-label="navigation" class="pagination-col pt-2 selectedTab synnx">
<span class="item-dropdown-col">
View
<div class="items-dropdown">
<i class="icon-arrow-bottom"></i>
<select>
<option>10</option>
<option>15</option>
<option>20</option>
</select>
</div>
<span class="view-text">Items Per Page</span>
</span>
<ul class="table-count-list m-auto">
<li class="left-arrow"><a href="javascript:void(0);"><i class="icon-arrow-right"></i></a></li>
<li class="active"><a href="javascript:void(0);"><span>1</span></a></li>
<li><a href="#page-2" class=""> <span>2</span></a></li>
<li class="right-arrow"><a href="javascript:void(0);"><i class="icon-arrow-right"></i></a></li>
</ul>
<ul class="next-prev-page">
<li><a href="javascript:void(0);"><i class="icon-left-arrow-double mr-1"></i>First</a></li>
<li><a href="javascript:void(0);"><i class="icon-left-arrow mr-1"></i>Previous</a></li>
<li><span class="page-count">1 of 12</span></li>
<li><a href="javascript:void(0);">Next<i class="icon-right-arrow-b ml-1"></i></a></li>
<li class="last-page"><a href="javascript:void(0);">Last <i class="icon-left-arrow-double pr-1"></i></a></li>
</ul>
</nav>
</div>
</div>
</div>
</div>
<!--my invoices-->