Subversion Repositories SmartDukaan

<style>
    .orangeBg {
        background-color: rgba(255, 165, 0, 0.66);
    }

    .redBg {
        background-color: rgba(255, 0, 0, 0.49);
    }

    .greenBg {
        background-color: rgba(0, 128, 0, 0.56);
    }
    #transactionList_wrapper .col-sm-6 {
        padding: 2px !important;
    }

    .active-tr {
        background-color: #f8f8a7;
    }

    #transactionList_length, #transactionList_filter {
        padding: 8px !important;
    }


    .nav > li > a {
        padding: 4px 8px !important;
    }

</style>
<section class="wrapper" style="font-size: 12px;">
    <div class="row">
        <div class="col-lg-12">

            <ol class="breadcrumb">
                <li><i class="fa fa-home"></i><a href="${rc.contextPath}/dashboard">Home</a></li>
                <li><i class="icon_document_alt"></i>Warehouse Management</li>
                <input type="hidden" id="firstTxnId" value="$firstTransactionId">
            </ol>
        </div>
    </div>


    <div class="col-lg-4">
        <div class="row">
            <div class="well" style="padding: 10px; max-height: 800px;overflow-y: auto;">
                <div class="row">
                    <div class="col-md-6">
                        <ul class="nav nav-pills">
                            <li class="active"><a data-toggle="pill" href="#readyToBill">Ready to Bill</a></li>
                            <li><a data-toggle="pill" href="#ooStock">Out of stock</a></li>
                        </ul>

                    </div>
                    <div class="col-md-6">
                        <div id="authWarehousesList">
                        </div>
                    </div>
                </div>
                <div style="max-height: 600px;overflow-y: auto;">
                    <div class="tab-content">
                        <div id="readyToBill" class="tab-pane fade in active">
                            <div style="margin-bottom: 10px;">
                                <input type="text" id="myInput" placeholder="Search transactions..."
                                       style="width: 98%;margin-top: 10px; padding: 5px;">
                            </div>

                            <table class="table table-bordered" id="transactionList">
                                <thead>
                                <tr>
                                    <th>Txn Id</th>
                                    <th>Retailer Name</th>
                                    <th>Created</th>
                                </tr>
                                </thead>
                                <tbody>
                                    #foreach($type in $partnerTypeOrder)
                                        #set($orders = $fofoStatusWiseInstockOrdersMap.get($type))
                                        #if($orders)
                                        <tr>
                                            <td colspan="3"
                                                style="background-color: #ddd; font-weight: bold;">$type</td>
                                        </tr>

                                            #foreach($perTransactionOrder in $orders)
                                                #set($hasOutOfStock = false)
                                                #set($hasInStock = false)
                                                #foreach($order in $orderTransactionMap.get($perTransactionOrder.getTransactionId()))
                                                    #if($oosItemIds.contains($order.getLineItem().getItemId()))

                                                        #set($hasOutOfStock = true)
                                                    #else
                                                        #set($hasInStock = true)
                                                    #end
                                                #end
                                                #if($hasOutOfStock && $hasInStock)
                                                <tr class="order_by_transaction orangeBg"
                                                    data-transaction="$perTransactionOrder.getTransactionId()">

                                                #elseif($hasInStock)
                                                <tr class="order_by_transaction greenBg"
                                                    data-transaction="$perTransactionOrder.getTransactionId()">
                                                #end
                                                <td>$perTransactionOrder.getTransactionId()</td>
                                                <td>
                                                <span>
                                                    #if($perTransactionOrder.getRetailerName())
                                                        $perTransactionOrder.getRetailerName()
                                                        - $partnerTypeMap.get($perTransactionOrder.getRetailerId())
                                                    #end
                                                    #if($perTransactionOrder.getRetailerCity() && $perTransactionOrder.getRetailerState())
                                                        ($perTransactionOrder.getRetailerCity()
                                                        , $perTransactionOrder.getRetailerState())
                                                    #end
                                                </span>
                                                </td>
                                                <td>$perTransactionOrder.getCreateTimestamp().format($dateFormatter)</td>
                                            </tr>

                                            #end
                                        #end
                                    #end
                                </tbody>

                            </table>
                        </div>
                        <div id="ooStock" class="tab-pane fade">
                            <div style="margin-bottom: 10px;">
                                <input type="text" id="oosInput" placeholder="Search transactions..."
                                       style="width: 98%;margin-top: 10px; padding: 5px;">
                            </div>
                            <table class="table table-bordered" id="ooStransactionList">
                                <thead>
                                <tr>
                                    <th>Txn Id</th>
                                    <th>Retailer Name</th>
                                    <th>Created</th>
                                </tr>
                                </thead>
                                <tbody>
                                    #foreach($type in $partnerTypeOrder)
                                        #set($orders = $fofoStatusWiseOostockOrdersMap.get($type))
                                        #if($orders)
                                        <tr>
                                            <td colspan="3"
                                                style="background-color: #ddd; font-weight: bold;">$type</td>
                                        </tr>

                                            #foreach($perTransactionOrder in $orders)

                                    <tr class="order_by_transaction redBg"
                                        data-transaction="$perTransactionOrder.getTransactionId()">
                                        <td>$perTransactionOrder.getTransactionId()</td>
                                        <td>
                                            <span>
                                                #if($perTransactionOrder.getRetailerName())
                                                    $perTransactionOrder.getRetailerName()
                                                    - $partnerTypeMap.get($perTransactionOrder.getRetailerId())
                                                #end
                                                #if($perTransactionOrder.getRetailerCity() && $perTransactionOrder.getRetailerState())
                                                    ($perTransactionOrder.getRetailerCity()
                                                    , $perTransactionOrder.getRetailerState())
                                                #end
                                            </span>
                                        </td>
                                        <td>$perTransactionOrder.getCreateTimestamp().format($dateFormatter)</td>
                                    </tr>

                                            #end
                                        #end
                                    #end
                                </tbody>

                            </table>
                        </div>
                    </div>


                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-8" id="transaction-detail-container">
        <div class="row" id="transaction-detail-container">

        </div>
    </div>


</section>


<script>
    $(document).ready(function () {
        $('#transactionList').DataTable(
                {
                    "bPaginate": true,
                    "pageLength": 50,
                    "bLengthChange": true,
                    "bFilter": true,
                    "bInfo": false,
                    "bAutoWidth": false
                }
        )
        ;$('#ooStransactionList').DataTable(
                {
                    "bPaginate": true,
                    "pageLength": 50,
                    "bLengthChange": true,
                    "bFilter": true,
                    "bInfo": false,
                    "bAutoWidth": false
                }
        );

    });
</script>
<script>
    $(document).ready(function () {
        $("#myInput").on("keyup", function () {
            var value = $(this).val().toLowerCase();
            $("#transactionList tr").filter(function () {
                $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
            });
        });
        $("#oosInput").on("keyup", function () {
            var value = $(this).val().toLowerCase();
            $("#ooStransactionList tr").filter(function () {
                $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
            });
        });
    });
</script>