Options Admin - Responsive Web Application Kit

Ecommerce - Order View

Get order details!

Toggle Code!

Order #124845 FEB 25, 2017 5:02:24

                                                        
<ul class="nav nav-tabs border-bottom border-primary" role="tablist">
    <li role="presentation" class="active"><a class="" href="#home7" aria-controls="home7" role="tab" data-toggle="tab">Details</a></li>
    <li role="presentation"><a class="" href="#profile7" aria-controls="profile7" role="tab" data-toggle="tab">Invoices</a></li>
    <li role="presentation"><a class="" href="#messages7" aria-controls="messages7" role="tab" data-toggle="tab">Credit Memos</a></li>
    <li role="presentation"><a class="" href="#settings7" aria-controls="settings7" role="tab" data-toggle="tab">Shipments</a></li>
</ul>

Order

Order #:

124845

Order Date & Time:

FEB 25, 2017 5:02:24

Order Status:

Pending

Grand Total:

$985.68

Payment Information:

Debit Card

                                                                        
<div class="panel panel-info">
    <div class="panel-heading">
        <div class="panel-title">
            <h5>Order</h5>
        </div>
    </div>
    <div class="panel-body overflow-x-auto">
        <div class="col-xs-12 p-n">
            <div class="col-xs-6 p-n">
                Order #:
            </div>
            <!-- /.col-md-6 -->
            <div class="col-xs-6 p-n">
                124845
            </div>
            <!-- /.col-md-6 -->
        </div>
        <!-- /.col-xs-12 -->
        <div class="col-xs-12 p-n">
            <div class="col-xs-6 p-n">
                Order Date & Time:
            </div>
            <!-- /.col-md-6 -->
            <div class="col-xs-6 p-n">
                FEB 25, 2017 5:02:24
            </div>
            <!-- /.col-md-6 -->
        </div>
        <!-- /.col-xs-12 -->
        <div class="col-xs-12 p-n">
            <div class="col-xs-6 p-n">
                Order Status:
            </div>
            <!-- /.col-md-6 -->
            <div class="col-xs-6 p-n">
                <span class="label label-info label-wide">Pending</span>
            </div>
            <!-- /.col-md-6 -->
        </div>
        <!-- /.col-xs-12 -->
        <div class="col-xs-12 p-n">
            <div class="col-xs-6 p-n">
                Grand Total:
            </div>
            <!-- /.col-md-6 -->
            <div class="col-xs-6 p-n">
                $985.68
            </div>
            <!-- /.col-md-6 -->
        </div>
        <!-- /.col-xs-12 -->
        <div class="col-xs-12 p-n">
            <div class="col-xs-6 p-n">
                Payment Information:
            </div>
            <!-- /.col-md-6 -->
            <div class="col-xs-6 p-n">
                Debit Card
            </div>
            <!-- /.col-md-6 -->
        </div>
        <!-- /.col-xs-12 -->
    </div>
    <!-- /.panel-body -->
</div>
<!-- /.panel -->

Customer Information add class 'panel-danger'

Customer Name:

Cedric Kelly

Email:

cedric.kelly@gmail.com

State:

Buffalo

Phone Number:

(307) 217-18078

Alternate Phone Number:

(307) 217-12345

Billing Address add class 'panel-primary'

Cedric Kelly
606 TW Road
Buffalo
WY 82834
United States
T: (307) 217-18078

Customer Information add class 'panel-danger'

Cedric Kelly
606 TW Road
Buffalo
WY 82834
United States
T: (307) 217-18078

Shopping Cart add class 'panel-primary'

List Of Order

Product	Item Status	Original Price	Price	Quantity	Tax Amount	Tax Percent	Discount Amount	Total
Item-1	Available	650.40$	660.50$	56	2$	2%	5$	640.50$
Item-2	Available	650.40$	660.50$	56	2$	2%	5$	640.50$
Item-3	Not Available	650.40$	660.50$	56	2$	2%	5$	640.50$
Item-4	Waiting	650.40$	660.50$	56	2$	2%	5$	640.50$
Item-5	Not Available	650.40$	660.50$	56	2$	2%	5$	640.50$
Item-6	Waiting	650.40$	660.50$	56	2$	2%	5$	640.50$
Item-7	Not Available	650.40$	660.50$	56	2$	2%	5$	640.50$

                                                                        
<table class="table table-striped">
    <thead>
        <tr>
            <th>Product</th>
            <th>Item Status</th>
            <th>Original Price</th>
            <th>Price</th>
            <th>Quantity</th>
            <th>Tax Amount</th>
            <th>Tax Percent</th>
            <th>Discount Amount</th>
            <th>Total</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Item-1</td>
            <td><span class="label label-info label-wide">Available</span></td>
            <td>650.40$</td>
            <td>660.50$</td>
            <td>56</td>
            <td>2$</td>
            <td>2%</td>
            <td>5$</td>
            <td>640.50$</td>
        </tr>
        ...
    </tbody>
</table>

Invoice add class 'panel-danger'

Sub Total:

$1,123.65

Shipping:

$10

Grand Total:

$1,256.80

Total Paid:

$1,256.80

Total Refunded:

Total Due:

$1,123.65

List Of Order

Invoice #	Invoice Date	Customer	Email	Amount	Location	Status	Action
61	2011/04/25	Cedric Kelly	cedric.kelly@gmail.com	$320,800	New York	Pending
60	2011/07/25	Cedric Kelly	cedric.kelly@gmail.com	$170,750	Tokyo	Paid
59	2016/10/02	Cedric Kelly	cedric.kelly@gmail.com	$270,750	Pune	Cancel
66	2016/10/02	Cedric Kelly	cedric.kelly@gmail.com	$86,000	San Francisco	Cancel
22	2012/03/29	Cedric Kelly	cedric.kelly@gmail.com	$433,060	San Francisco	Cancel
33	2008/11/28	Cedric Kelly	cedric.kelly@gmail.com	$162,700	Tokyo	Paid
39	2012/12/02	Cedric Kelly	cedric.kelly@gmail.com	$372,000	New York	Paid
120	2012/08/06	Cedric Kelly	cedric.kelly@gmail.com	$137,500	San Francisco	Pending
158	2015/08/06	Cedric Kelly	cedric.kelly@gmail.com	$537,500	NY	Pending
168	2016/08/06	Cedric Kelly	cedric.kelly@gmail.com	$337,500	London	On Hold
89	2016/08/09	Cedric Kelly	cedric.kelly@gmail.com	$387,500	NY	Pending
Order #	Purchased On	Customer	Email	Purchased Price	Location	Status	Action

                                                                    
<table id="example" class="display table table-striped table-bordered" width="100%">
    <thead>
        <tr>
            <th>Invoice #</th>
            <th>Invoice Date</th>
            <th>Customer</th>
            <th>Email</th>
            <th>Amount</th>
            <th>Location</th>
            <th>Status</th>
            <th class="ecomm-action-icon">Action</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>61</td>
            <td>2011/04/25</td>
            <td>Cedric Kelly</td>
            <td>cedric.kelly@gmail.com</td>
            <td>$320,800</td>
            <td>New York</td>
            <td>
                <span class="label label-info label-wide">Pending</span>
            </td>
            <td>
                <button type="button" class="btn btn-info btn-xs btn-labeled">Print<span class="btn-label btn-label-right"><i class="fa fa-print"></i></span></button>
            </td>
        </tr>
        ...
    </tbody>
    <tfoot>
        <tr>
            <th>Order #</th>
            <th>Purchased On</th>
            <th>Customer</th>
            <th>Email</th>
            <th>Purchased Price</th>
            <th>Location</th>
            <th>Status</th>
            <th class="ecomm-action-icon">Action</th>
        </tr>
        ...
    </tfoot>
</table>
<!-- ========== JS ========== -->
<script>
    $(function($) {
        $('#example').DataTable();
    });
</script>

List Of Order

Credit Memo #	Invoice Date	Customer	Email	Amount	Location	Status	Action
61	2011/04/25	Cedric Kelly	cedric.kelly@gmail.com	$320,800	New York	Pending
60	2011/07/25	Cedric Kelly	cedric.kelly@gmail.com	$170,750	Tokyo	Paid
59	2016/10/02	Cedric Kelly	cedric.kelly@gmail.com	$270,750	Pune	Cancel
66	2016/10/02	Cedric Kelly	cedric.kelly@gmail.com	$86,000	San Francisco	Cancel
22	2012/03/29	Cedric Kelly	cedric.kelly@gmail.com	$433,060	San Francisco	Cancel
33	2008/11/28	Cedric Kelly	cedric.kelly@gmail.com	$162,700	Tokyo	Paid
39	2012/12/02	Cedric Kelly	cedric.kelly@gmail.com	$372,000	New York	Paid
120	2012/08/06	Cedric Kelly	cedric.kelly@gmail.com	$137,500	San Francisco	Pending
158	2015/08/06	Cedric Kelly	cedric.kelly@gmail.com	$537,500	NY	Pending
168	2016/08/06	Cedric Kelly	cedric.kelly@gmail.com	$337,500	London	On Hold
89	2016/08/09	Cedric Kelly	cedric.kelly@gmail.com	$387,500	NY	Pending
Order #	Purchased On	Customer	Email	Purchased Price	Location	Status	Action


<table id="example-memo" class="display table table-striped table-bordered" width="100%">
    <thead>
        <tr>
            <th>Credit Memo #</th>
            <th>Invoice Date</th>
            <th>Customer</th>
            <th>Email</th>
            <th>Amount</th>
            <th>Location</th>
            <th>Status</th>
            <th class="ecomm-action-icon">Action</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>61</td>
            <td>2011/04/25</td>
            <td>Cedric Kelly</td>
            <td>cedric.kelly@gmail.com</td>
            <td>$320,800</td>
            <td>New York</td>
            <td>
                <span class="label label-info label-wide">Pending</span>
            </td>
            <td>
                <button type="button" class="btn btn-info btn-xs btn-labeled">Print<span class="btn-label btn-label-right"><i class="fa fa-print"></i></span></button>
            </td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <th>Order #</th>
            <th>Purchased On</th>
            <th>Customer</th>
            <th>Email</th>
            <th>Purchased Price</th>
            <th>Location</th>
            <th>Status</th>
            <th class="ecomm-action-icon">Action</th>
        </tr>
        ...
    </tfoot>
</table>
<!-- ========== JS ========== -->
<script>
    $(function($) {
        $('#example-memo').DataTable();
    });
</script>

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

John Doe

Ecommerce - Order View

Order #124845 FEB 25, 2017 5:02:24

Order

Customer Information add class 'panel-danger'

Billing Address add class 'panel-primary'

Customer Information add class 'panel-danger'

Shopping Cart add class 'panel-primary'

List Of Order

Invoice add class 'panel-danger'

List Of Order

List Of Order

Useful Sidebar