Subversion Repositories SmartDukaan

Rev

Rev 35726 | Blame | Compare with Previous | Last modification | View Log | RSS feed

<style>
        .table-striped > tbody > tr:nth-child(odd) > td{
  background: white;
  background-color: white;
}
.table-striped > tbody > tr:nth-child(even) > td{
  background: white;
  background-color:white;
}

.add-bag-submit{
color: white;
background-color: #008CBA;
}

#find-similar-products{
padding-top: 10px;
}

.add-bag-submit:hover{
color: red;
background-color: #000000;
}

.table-striped > tbody > tr:hover > td,
        .table-striped > tbody > tr:hover {
          background-color: #f5f5f5;
        }
        .btn:hover{
        color: grey;
        text-decoration: none;
        }
        .btn-primary:hover{
        color: grey;
        text-decoration: none;
        }
        #add-to-compare-check{
                cursor:pointer;
        }
        modal-dialog.modal-lg{
                left:10%;
                right:auto;
                width:80%;
        }
        .modal-content{
                background : white;
        }
        .modelHeaderCustom{
                font-size:14px;
                font-weight:bold;
        }
        hr{
                background-color:#007aff;
                border:none;
                height:1px;
                background:#007aff;
        }
</style>
<section class="wrapper">
        <div class="row">
                <div class="col-lg-12">
                        <h3 class="page-header"><i class="icon_genius"></i>#springMessage("mystrocks.catalog")</h3>
                        <ol class="breadcrumb">
                                <li><i class="fa fa-home"></i><a href="${rc.contextPath}/dashboard">#springMessage("mystrocks.home")</a></li>
                                <li><i class="icon_genius"></i>#springMessage("mystrocks.catalog")</li>
                                 <li><a href="#videoModal" class="btn btn-danger" data-toggle="modal" data-src="oozbvqapL60"><span
                     class="glyphicon glyphicon-play-circle"></span> #springMessage("mystrocks.playvideo")</a></li>
                        
                        </ol>
                </div>
        </div>
        
        <div id="find-similar-products">
                <div class="row">
                        <div class="col-lg-12">
                <div class="col-md-3 col-sm-3 col-xs-12  form-group pull-left top_search">
                  <div class="input-group">
                     <input type="text" class="typeahead form-control" id="catalog-search-text-compare" name="Item" data-provide="typeahead" autocomplete="off" value="" style ="
                        width: 200px;" placeholder=#springMessage("mystrocks.searchforproducts")/>
                        
                    <span class="input-group-btn">
                      <button class="btn btn-primary submit" id="catalog-button" type="button">#springMessage("mystrocks.findsimilerproducts")</button>
                    </span>
                    </div>
                  </div>
                </div>
              </div>
            </div>
        
        <div id="catalog-search">
                <div class="row">
                        <div class="col-lg-12">
                <div class="col-md-3 col-sm-3 col-xs-12 form-group pull-left top_search">
                  <div class="input-group">
                    <input type="text" class="form-control" id="catalog-search-text"  autocomplete="off" placeholder="Search for product..." value="$searchTerm" />
                    <span class="input-group-btn">
                      <button class="btn btn-primary submit" id="catalog-search-button" type="button">#springMessage("mystrocks.go")</button>
                    </span>
                  </div>
                </div>
              </div>
         </div>
        </div>
          <div id="catalog-search-capmare-go">
                <div class="col-lg-12">
            <div class="col-md-3 col-sm-3 col-xs-12 form-group pull-right top_search" style="width:15%;">
                    <span class="input-group-btn">
                  <button class="btn btn-primary submit"  id="Go-compare-button" type="button">#springMessage("mystrocks.gotocompare")</button>
                   </span>
              </div>
              </div>
            </div>
        
         <div id="catalog-table">
                 <div class="row">
                        <div class="col-lg-12">
                                <table class="table table-striped table-advance table-hover">
                                        <tbody>
                                                <tr>
                                                        <th>#springMessage("mystrocks.itemcode")</th>
                                                        <th>#springMessage("mystrocks.brand")</th>
                                                        <th>#springMessage("mystrocks.modelname")</th>
                                                        <th>#springMessage("mystrocks.modelnumber")</th>
                                                        <th>#springMessage("mystrocks.color")</th>
                                                        <th>#springMessage("mystrocks.mop")</th>
                                                        <th>#springMessage("mystrocks.availability")</th>
                                                        <th>#springMessage("mystrocks.customeroffers")</th>
                                                        <th>#springMessage("mystrocks.pinelabsoffers")</th>
                                                        <th>#springMessage("mystrocks.addtobag")</th>
                                                        <th>#springMessage("mystrocks.addtocompare")</th>
                                                </tr>
                                                #if(!$currentInventorySnapshot.isEmpty())
                                                         #foreach( $inventorySnapshot in $currentInventorySnapshot )
                                                                <tr data="$inventorySnapshot.getItemId()" class="add-to-bag" >
                                                                        <td>$inventorySnapshot.getItemId()</td>
                                                                        <td>$inventorySnapshot.getBrand()</td>
                                                                        <td>$inventorySnapshot.getModelName()</td>
                                                                        <td>$inventorySnapshot.getModelNumber()</td>
                                                                        <td>$inventorySnapshot.getColor()</td>
                                                                        <td>$inventorySnapshot.getPrice()</td>
                                                                        <td>$inventorySnapshot.getAvailability()</td>
                                                                        #if($webOfferMap.get($inventorySnapshot.getCatalogItemId()))
                                                                        <td><a class="web-offer-submit" data-catalogid= "$inventorySnapshot.getCatalogItemId()" id="web-offer-button"  data-target="#todayOfferModal" data-toggle="modal">Customer Offers</a></td>
                                                                        #else
                                                                         <td>-</td>
                                                                        #end
                                                                        #if($pinelabsOfferMap.get($inventorySnapshot.getItemId()))
                                                                            #set($hasValidTenure = false)
                                                                            #foreach($issuerEntry in $pinelabsOfferMap.get($inventorySnapshot.getItemId()).entrySet())
                                                                                #foreach($tenure in $issuerEntry.value)
                                                                                    #if($tenure.getTenureValue() && $tenure.getTenureValue() > 0)
                                                                                        #set($hasValidTenure = true)
                                                                                    #end
                                                                                #end
                                                                            #end
                                                                            #if($hasValidTenure)
                                                                        <td><a class="pinelabs-offer-submit" data-itemid="$inventorySnapshot.getItemId()" data-target="#pinelabsOfferModal" data-toggle="modal">View Offers</a></td>
                                                                            #else
                                                                         <td>-</td>
                                                                            #end
                                                                        #else
                                                                         <td>-</td>
                                                                        #end
                                                                        <td><button class="add-bag-submit" id="add-bag-button" type="button" data-target="#bagModel" data-toggle="modal" >Add To Bag</button></td>
                                                                     <td><input type="checkbox" class="add-compare-checkbox" data-catalogitemid="$inventorySnapshot.getCatalogItemId()" id="add-to-compare-check" name="compare-check"><span></span></td>
                                                                </tr>
                                                         #end
                                                #else
                                                        <tr>
                                                                <td colspan="5" style="text-align:center;">#springMessage("mystrocks.nomatchingdatafoundforcriteria")</td>
                                                        </tr>
                                                #end
                   
                                        </tbody>
                                </table>
                        </div>
                </div>
        </div>
        #if(!$currentInventorySnapshot.isEmpty())
                <div class="row" id="catalog-paginated">
                        <div class="col-lg-9">
                                <p>Showing <span class="start">$start</span> to <span class="end">$end</span> of <span class="size">$size</span> items</p>
                        </div>
                        <div class="col-lg-3" style="text-align:right;">
                                        <div class="btn-group" style="width:40%">
                                                <button class="btn btn-primary previous" disabled="disabled" style="width:100%">#springMessage("mystrocks.previous")</button>
                                        </div>
                                        <div class="btn-group" style="width:40%">
                                                #if($end >= $size)
                                                        <button class="btn btn-primary next" style="width:100%" disabled="disabled">#springMessage("mystrocks.next")</button>
                                                #else
                                                        <button class="btn btn-primary next" style="width:100%">#springMessage("mystrocks.next")</button>
                                                #end
                                        </div>
                        </div>
                </div>
        #end
        
        <div id="itemSimilarContainer">
        
        </div>
        
        
</section>

<div id="bagModel" class="modal" role="dialog">
                <div class="modal-dialog modal-md">
               <!-- Modal content-->
                    <div class="modal-content">
                      <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h4 class="modal-title">Add Item To Bag</h4>
                      </div>
                                <div class="modal-body" style="min-height:200px;">

                                        <div id="catalogModalBody">
                                                <div style="max-height: 450px;overflow-y: auto;padding-bottom: 10px;margin-bottom: 20px;">
                                                        <input type="hidden" class="itemId"/>
                                                        <input type="hidden" class="availability"/>
                                                        <h4 class="bagModalProductInfo modelHeaderCustom">Product Details : <span></span></h4>
                                                        <h4 class="bagModalAvailability modelHeaderCustom">Availability : <span></span></h4>
                                                        <h4 class="bagModalEarlyImeis modelHeaderCustom">Imeis to bill - (Recommend you to bill
                                                                imeis on the left first) <span></span></h4>
                                                        <h4 class="bagModalQuantity modelHeaderCustom">Enter Quantity
                                                                <span>
                                                        <input type="number" min="1" class="form-control quantity"></input>
                                                </span></h4>
                                                        <hr/>
                                                </div>
                                <span>
                                        <button type="submit" id="addToBagButton" class="btn btn-warning">Add more!</button>
                                        <button type="submit" id="addToBagButtonwithCart"
                                                        class="btn btn-primary">Continue with cart</button>
                                        <button type="submit" id="addToBagButtonwithBillingpage" class="btn btn-success"> Checkout</button>
                                        <input type="hidden" class="cart-checkout" value="checkout">

                        </span>
                          </div>
                          </div>
                    </div>
                </div>
 </div>
 
    <div id="todayOfferModal" class="modal" role="dialog">
          <div class="modal-dialog">
            <div class="modal-content">

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

    <div id="pinelabsOfferModal" class="modal" role="dialog">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Pinelabs EMI Offers <small class="text-danger">All plans are showing on MOP basis</small></h4>
          </div>
          <div class="modal-body" id="pinelabsOfferModalBody" style="max-height:450px;overflow-y:auto;">
          </div>
        </div>
      </div>
    </div>

<!-- Modal HTML -->
<div id="videoModal" class="modal fade">
        <div class="modal-dialog">
                <div class="modal-content">
                        <div class="modal-body">
                                <div class="embed-responsive embed-responsive-16by9">
                                        <iframe id="trainingVideo" referrerpolicy="strict-origin-when-cross-origin" class="embed-responsive-item" width="560" height="315"
                                                        allowfullscreen allow="autoplay"></iframe>
                                </div>
                        </div>
                </div>
        </div>
</div>

 <script type="text/javascript">
        hasGift = $hasGift;

        $(function(){
            getItemAheadOptions($("#catalog-search-text-compare"),false,function(selectedItem){
                        currentItem = selectedItem;
                        console.log(currentItem);
                        });

                $("#videoModal").on('hide.bs.modal', function () {
                        $("#trainingVideo").attr('src', '');
                });

                /* Assign the initially stored url back to the iframe src
        attribute when modal is displayed again */
                $("#videoModal").on('show.bs.modal', function (event) {
                        let button = $(event.relatedTarget);
                        let youtubeUrl = button.data("src");
                        $("#trainingVideo").attr('src', `//www.youtube.com/embed/${youtubeUrl}?autoplay=1`);
                });

                $(document).on('click', '.pinelabs-offer-submit', function() {
                        var itemId = $(this).data('itemid');
                        var content = $('#pinelabs-data-' + itemId).html();
                        $('#pinelabsOfferModalBody').html(content || '<p>No offers available</p>');
                });
                });
 </script>

## Pinelabs offer data rendered per item - grouped accordion by bank name
#if($pinelabsOfferMap && !$pinelabsOfferMap.isEmpty())
#foreach($entry in $pinelabsOfferMap.entrySet())
<div id="pinelabs-data-$entry.key" style="display:none;">
    <div class="panel-group" id="pinelabs-accordion-$entry.key">
        #foreach($issuerEntry in $entry.value.entrySet())
        <div class="panel panel-default">
            <div class="panel-heading" style="cursor:pointer;" data-toggle="collapse" data-parent="#pinelabs-accordion-$entry.key" data-target="#pinelabs-collapse-${entry.key}-${velocityCount}">
                <h4 class="panel-title">
                    <span class="glyphicon glyphicon-chevron-down" style="margin-right:8px;font-size:12px;"></span>
                    $!issuerEntry.key
                    <span class="badge" style="margin-left:8px;">$issuerEntry.value.size() offers</span>
                </h4>
            </div>
            <div id="pinelabs-collapse-${entry.key}-${velocityCount}" class="panel-collapse collapse#if($velocityCount == 1) in#end">
                <div class="panel-body" style="padding:0;">
                    <table class="table table-striped table-hover" style="margin-bottom:0;">
                        <thead>
                            <tr>
                                <th>Tenure</th>
                                <th>Monthly EMI</th>
                                <th>Interest Rate</th>
                                <th>EMI Type</th>
                            </tr>
                        </thead>
                        <tbody>
                        #foreach($tenure in $issuerEntry.value)
                            #if($tenure.getTenureValue() && $tenure.getTenureValue() > 0)
                            <tr>
                                <td>$!tenure.getTenureValue() months</td>
                                <td>#if($tenure.getMonthlyEmiAmount())$!tenure.getMonthlyEmiAmount().getValue() $!tenure.getMonthlyEmiAmount().getCurrency()#end</td>
                                <td>$!tenure.getInterestRatePercentage()%</td>
                                <td>$!tenure.getEmiType()</td>
                            </tr>
                            #end
                        #end
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        #end
    </div>
</div>
#end
#end