+
+
+
+
+ 
+
+
+
+
+
+
+
+ Community
+
+
+ Enterprise
+
+
+ Odoo.sh
+
+
+
+
+
+
+
+ 
+
+ + Product Quickview in e-Commerce
+Module for Showing Quickview Popup for Products in Products-listing Page.
+ +
+
+
+
+ 
+
+
+ Explore This + Module
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ Overview +
+
+
+
+
+
+
+ This module adds a "Quick View" button to the product listing on a website.
+ By adding the "Quick View" button, users can view additional product information,
+ such as a product description, specifications, reviews, and more, without having to navigate to a separate product detail page.
+ This saves users time and effort and allows them to quickly assess whether the product meets their needs.
+
+ +
+
+
+ 
+
+
+ Features +
+
+
+
+
+
+
+
+ 
+ Enables quick view mode for both Mobile and Desktop Clients.
+
+
+
+ Enables quick view mode for both Mobile and Desktop Clients.
+
+
+
+ Loads up all Product information in quick view.
+
+
+
+
+ Loads up all Product information in quick view.
+
+
+
+
+ Reduces UI refresh time to load Product information.
+
+
+
+
+ Reduces UI refresh time to load Product information.
+
+
+
+
+ All major functionalities of the Product info Page is added in quick view.
+
+
+
+
+ All major functionalities of the Product info Page is added in quick view.
+
+
+
+
+ 
+
+
+ Screenshots +
+
+
+
+
+
+
+
+ 
+
+
+ Quickview button
+Enable the button to open quickview for the selected product.
+
+
+ 
+
+ Quickview window
+Quickview window contains most of the product information and operation without reloading the page.
+
+
+
+
+ 
+
+
+ Related + Products +
+
+
+
+
+
+
+ 
+ 
+ 
+ 
+ 
+
+
+
+ 
+
+
+ Our Services +
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Odoo + Customization
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+ 
+
+
+ + Odoo + Support
+
+
+
+ 
+
+
+ + Hire + Odoo + Developer
+
+
+
+ 
+
+
+ + Odoo + Integration
+
+
+
+ 
+
+
+ + Odoo + Migration
+
+
+
+ 
+
+
+ + Odoo + Consultancy
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+ 
+
+
+ + Odoo + Licensing Consultancy
+
+
+
+ 
+
+
+ Our + Industries +
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Trading +
++ Easily procure + and + sell your products
+
+
+
+ 
+
+
+ + POS +
++ Easy + configuration + and convivial experience
+
+
+
+ 
+
+
+ + Education +
++ A platform for + educational management
+
+
+
+ 
+
+
+ + Manufacturing +
++ Plan, track and + schedule your operations
+
+
+
+ 
+
+
+ + E-commerce & Website +
++ Mobile + friendly, + awe-inspiring product pages
+
+
+
+ 
+
+
+ + Service Management +
++ Keep track of + services and invoice
+
+
+
+ 
+
+
+ + Restaurant +
++ Run your bar or + restaurant methodically
+
+
+
+ 
+
+
+ + Hotel Management +
++ An + all-inclusive + hotel management application
+
+
+
+ 
+
+
+ Support +
+
+
+
diff --git a/ecommerce_quick_view/static/src/js/quick_view_modal.js b/ecommerce_quick_view/static/src/js/quick_view_modal.js
new file mode 100644
index 000000000..5e0634d7a
--- /dev/null
+++ b/ecommerce_quick_view/static/src/js/quick_view_modal.js
@@ -0,0 +1,40 @@
+/** @odoo-module **/
+
+var core = require('web.core');
+var rpc = require('web.rpc');
+var publicWidget = require('web.public.widget');
+require('website_sale.website_sale');
+
+var QuickViewModal = publicWidget.Widget.extend({
+ selector: '.oe_website_sale',
+ events: {'click a.c-product-quick-view-action': '_onQuickViewClick',},
+ init(params) {
+ this._super(... arguments);
+ },
+ show_modal(template) {
+ var $modal = $(template).appendTo($(this.selector));
+ $modal.modal('show');
+ core.bus.trigger('DOM_updated');
+ // get the DOM element from the jQuery object
+ // attach an event listener to remove the modal from the DOM when it is hidden
+ $modal.get(0).addEventListener('hidden.bs.modal', function (event) {
+ $modal.remove();
+ }, {once: true});
+ },
+ async _onQuickViewClick(ev) {
+ ev.preventDefault();
+ var product_id = $(ev.currentTarget).data('product-id');
+ var self = this;
+ try {
+ var result = await rpc.query({
+ route: '/c_quick_view/get_quick_view_html',
+ params: {product_id: product_id},
+ });
+ self.show_modal(result);
+ } catch (err) {
+ reject(err);
+ }
+ },
+});
+publicWidget.registry.quick_view_modal = QuickViewModal;
+return QuickViewModal;
diff --git a/ecommerce_quick_view/views/templates.xml b/ecommerce_quick_view/views/templates.xml
new file mode 100644
index 000000000..02593be4f
--- /dev/null
+++ b/ecommerce_quick_view/views/templates.xml
@@ -0,0 +1,138 @@
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+