[FIX] per Page Product Option & Quick Info Option in Shop Page

addons/website_sale/controllers/main.py

@@ -312,6 +312,7 @@ class WebsiteSale(http.Controller):
             'get_attribute_value_ids': self.get_attribute_value_ids,
             'tags': tags,
             'brands': brands,
+            'PPG': PPG,
         }
         if category:
             values['main_object'] = category

addons/website_sale/static/src/less/website_sale.less

@@ -10,92 +10,9 @@
 }
 
 /* quick view start */
-.quick-view .fancybox {
-    -webkit-transition: all 0.6s ease;
-    transition: all 0.6s ease;
-}
-.quick-view .fancybox {
-    opacity: 0.7;
-    font-size: 11px;
-    font-weight: normal;
-    background: #EEEEEE;
-    border-radius: 0;
-    left: 0;
-    margin: 0;
-    padding: 7px;
-    float: none;
-    color: #000000;
-    overflow: hidden;
-    text-align: center;
-    white-space: nowrap;
-    display: block;
-    width: 32px;
-    text-transform: uppercase;
-    line-height: 1.42857;
-}
-.quick-view .fancybox .icon {
-    margin-right: 10px;
-    margin-left: 4px;
-    font-size: 12px;
-}
-.quick-view .fancybox:hover {
-    width: 100%;
-}
-
-
-.quick {
-    top: 0;
-    height: auto;
-    position: absolute;
-    left: 0;
-    width: 100%;
-    z-index: 6;
-    opacity: 1;
-    transition: 0.3s all ease 0s;
-    -webkit-transition: 0.3s all ease 0s;
-}
-.quick .quick-view-bgr {
-    width: 100%;
-    text-align: center;
-}
-
-.quick .quick-view-bgr a {
-    display: block;
-    cursor: pointer;
-    border: none;
-    position: absolute;
-}
-.product-single:hover .quick {
-  opacity: 1;
-  z-index: 20;
-}
-.oe_grid:hover .quick {
-  opacity: 1;
-  z-index: 20;
-}
-.oe_list:hover .quick {
-  opacity: 1;
-  z-index: 20;
-}
-
-.quick-view-product{
-    position: relative !important;
-}
-
 .modal-lg .product_price {
     position: relative !important;
 }
-
-.quick-modal .modal-content {
-	border-radius: 0px;
-}
-.quick-modal .modal-header {
-	border-bottom: 0px;
-}
-.quick-modal .modal-footer {
- 	border-top: 0px;
-}
-
 /* quick view end */
 
 /* share Option start */
@@ -127,4 +44,4 @@
 .oe_share_mail, .oe_share_mail:hover {
     color: #666666 !important;
 }
-/* share Option end */
+/* share Option end */

addons/website_sale/views/templates.xml

@@ -95,27 +95,6 @@
         </div>
     </template>
 
-    <!-- View Limit Template -->
-    <template id="product_limit" name="Product View Limit">
-        <div t-if="limits" class="product_limit dropdown btn-group">
-            <button class="btn btn-default dropdown-toggle active_limit"
-                type="button" data-toggle="dropdown">
-                <b>
-                    <t t-esc="PPG" />
-                </b>
-                <span class="perPage"> Per Page </span>
-                <span class="caret"/>
-            </button>
-            <ul class="dropdown-menu limit_list">
-                <li t-foreach="limits" t-as="limit">
-                    <a class="product_limit_link" t-att-value="limit['name']">
-                        <t t-esc="limit['name']" />
-                    </a>
-                </li>
-            </ul>
-        </div>
-    </template>
-
     <!-- Product item used by /shop and /shop/cart -->
     <template id="products_item" name="Products item">
         <form action="/shop/cart/update" method="post">
@@ -220,7 +199,6 @@
                             <t t-call="website_sale.pricelist_list" />
                             <t t-call="website.pager" />
                             <t t-call="website_sale.product_view_switcher" />
-                            <t t-call="website_sale.product_limit" />
                         </div>
                     </div>
                     <div class="row">
@@ -253,16 +231,19 @@
 
     <template id="sort" inherit_id="website_sale.products" active="True" customize_show="True" name="Show Sort by">
         <xpath expr="//div[hasclass('products_pager')]/div/t[@t-call][last()]" position="after">
-            <t t-set="list_price_desc_label">Catalog price: High to Low</t>
+            <t t-set="new_arrivals_label">New Arrivals</t>
-            <t t-set="list_price_asc_label">Catalog price: Low to High</t>
+            <t t-set="list_price_desc_label">Price</t>
-            <t t-set="name_asc_label">Name - A to Z</t>
+            <t t-set="list_price_asc_label">Price</t>
-            <t t-set="name_desc_label">Name - Z to A</t>
+            <t t-set="name_asc_label">Name</t>
-            <t t-set="website_sale_sortable" t-value="[
+            <t t-set="name_desc_label">Name</t>
-                (list_price_desc_label, 'list_price desc'),
+            <t t-set="website_sale_sortable"
-                (list_price_asc_label, 'list_price asc'),
+               t-value="[
-                (name_asc_label, 'name asc'),
+               (new_arrivals_label + ' &lt;i class=\'fa fa-paper-plane\' aria-hidden=\'true\'&gt;&lt;/i&gt;', 'id desc'),
-                (name_desc_label, 'name desc')
+               (list_price_desc_label + ' &lt;i class=\'fa fa-arrow-up\' aria-hidden=\'true\'&gt;&lt;/i&gt;', 'list_price desc'),
-            ]"/>
+               (list_price_asc_label + ' &lt;i class=\'fa fa-arrow-down\' aria-hidden=\'true\'&gt;&lt;/i&gt;', 'list_price asc'),
+               (name_asc_label + ' &lt;i class=\'fa fa-sort-alpha-asc\' aria-hidden=\'true\'&gt;&lt;/i&gt;', 'name asc'),
+               (name_asc_label + ' &lt;i class=\'fa fa-sort-alpha-desc\' aria-hidden=\'true\'&gt;&lt;/i&gt;', 'name desc'),
+            ]" />
             <t t-set="website_sale_sortable_current" t-value="[sort for sort in website_sale_sortable if sort[1]==request.params.get('order', '')]"/>
             <div class="dropdown btn-group dropdown_sorty_by">
                 <a href="#" class="dropdown-toggle btn btn-default" data-toggle="dropdown">
@@ -285,6 +266,28 @@
         </xpath>
     </template>
 
+    <!-- View Limit Template -->
+    <template id="product_limit" inherit_id="website_sale.products" active="True" customize_show="True" name="Show Per Page Product Limit">
+        <xpath expr="//div[hasclass('products_pager')]/div/t[@t-call][last()]" position="after">
+            <div t-if="limits" class="product_limit dropdown btn-group">
+                <button class="btn btn-default dropdown-toggle active_limit"
+                    type="button" data-toggle="dropdown">
+                    <b>
+                        <t t-esc="PPG" />
+                    </b>
+                    <span class="perPage"> per Page </span>
+                    <span class="caret"/>
+                </button>
+                <ul class="dropdown-menu limit_list">
+                    <li t-foreach="limits" t-as="limit">
+                        <a class="product_limit_link" t-att-value="limit['name']">
+                            <t t-esc="limit['name']" />
+                        </a>
+                    </li>
+                </ul>
+            </div>
+        </xpath>
+    </template>
 
     <!-- Add to cart button-->
     <template id="categories_recursive" name="Category list">
@@ -1755,23 +1758,24 @@
     </template>
 
     <template id="quick_view_products_item" inherit_id="website_sale.products_item"
-        active="True" customize_show="True" name="Product Quick View">
+        active="False" customize_show="True" name="Product Quick Info">
-        <xpath expr="//div[hasclass('oe_product_image')]/a[1]" position="after">
+        <xpath expr="//div[hasclass('product_price')]" position="inside">
-            <div t-attf-class="quick" t-if="(not product.website_ids or website in product.website_ids) and product.website_published">
+            <t t-if="(not product.website_ids or website in product.website_ids) and product.website_published">
-                <div class="quick-view-bgr">
+                <a class="quick-view btn btn-default btn-xs" t-attf-href="##{ product.id }"
-                    <a class="quick-view btn btn-primary" t-attf-href="##{ product.id }"
+                    role="button" data-toggle="modal" title="Quick Info">
-                        role="button" data-toggle="modal" title="Quick view">
+                    <span class="fa fa-eye"></span>
-                        <i class="fa fa-eye"></i>
+                </a>
-                    </a>
+            </t>
-                </div>
+        </xpath>
-            </div>
+        <xpath expr="//div[hasclass('oe_product_image')]" position="after">
             <div t-att-id="product.id" class="modal fade in quick-modal" aria-hidden="true"
                 role="dialog" tabindex="-1" t-if="product.website_published">
                 <div class="modal-dialog modal-lg">
                     <div class="modal-content">
                         <div class="modal-header">
-                            <button type="button" class="close" data-dismiss="modal">X
+                            <button type="button" class="close" data-dismiss="modal"><span class="fa fa-times"></span>
                             </button>
+                            <br/>
                         </div>
                         <div class="modal-body col-md-12">
                             <div class="col-md-5 col-md-offset-1">