Skip to content

Commit c6eaeae

Browse files
gppa-odoogppa-odoo
committed
Add dynamic content snippet + 2
1 parent 5066850 commit c6eaeae

File tree

5 files changed

+106
-36
lines changed

5 files changed

+106
-36
lines changed

‎website_dynamic_snippet/__manifest__.py

+4
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,11 @@
1010
'web.assets_frontend': [
1111
'/website_dynamic_snippet/static/src/xml/sale_order_snippets.xml',
1212
'/website_dynamic_snippet/static/src/js/dynamic_snippet_sale_orders.js',
13+
'/website_dynamic_snippet/static/src/js/layout_switcher.js',
1314
],
15+
'website.assets_wysiwyg': [
16+
'website_dynamic_snippet/static/src/snippets/s_dynamic_sale_order_snippet/options.js',
17+
]
1418
},
1519
'installable': True,
1620
'application': True,

‎website_dynamic_snippet/static/src/js/dynamic_snippet_sale_orders.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ import publicWidget from "@web/legacy/js/public/public_widget";
55
publicWidget.registry.get_product_tab = publicWidget.Widget.extend({
66
selector: '.categories_section',
77

8+
events: {
9+
'click .load-more-button': '_onLoadMoreClick',
10+
},
11+
812
init() {
913
this._super(...arguments);
1014
this.orm = this.bindService("orm");
@@ -16,10 +20,6 @@ publicWidget.registry.get_product_tab = publicWidget.Widget.extend({
1620
await this.loadCategories();
1721
},
1822

19-
events: {
20-
'click .load-more-button': '_onLoadMoreClick',
21-
},
22-
2323
async loadCategories() {
2424
const result = await this.orm.searchRead(
2525
'sale.order',

‎website_dynamic_snippet/static/src/snippets/s_dynamic_sale_order_snippet/options.js

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/** @odoo-module **/
2+
3+
import publicWidget from "@web_editor/js/public/widget";
4+
5+
publicWidget.registry.dynamic_snippet_sale_order = publicWidget.Widget.extend({
6+
selector: ".categories_section",
7+
8+
xmlDependencies: ["/website_dynamic_snippet/static/src/xml/sale_order_snippet.xml"],
9+
10+
start: function () {
11+
this.layout = this.el.dataset.layout || 'list';
12+
this._render();
13+
return this._super(...arguments);
14+
},
15+
16+
_render: function () {
17+
this._rpc({
18+
route: '/your/data/route',
19+
params: { /* your logic */ },
20+
}).then(data => {
21+
this.$el.find(".card_list_wrapper").html(
22+
qweb.render("website_dynamic_snippet.sale_order_snippet", {
23+
result: data.orders,
24+
layout: this.layout,
25+
})
26+
);
27+
});
28+
},
29+
30+
onChangeOption(previewMode, widgetValue, params) {
31+
if (['grid', 'list'].includes(widgetValue)) {
32+
this.layout = widgetValue;
33+
this._render();
34+
}
35+
},
36+
});

‎website_dynamic_snippet/static/src/xml/sale_order_snippets.xml

+43-32
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,53 @@
11
<?xml version="1.0" encoding="UTF-8"?>
2-
<!-- Sale Order tab content template -->
32
<templates xml:space="preserve">
43
<t t-name="website_dynamic_snippet.sale_order_snippet">
5-
<section class="categories_section my-5">
6-
<div class="container">
7-
<h3 class="section_heading">Sale Order Details</h3>
8-
<div class="categories_wrapper">
9-
<div class="categories .card_list_wrapper">
10-
<table class="table">
11-
<thead>
4+
<div class="container my-5 categories_section">
5+
<h3 class="section_heading">Sale Order Details</h3>
6+
<div class="card_list_wrapper">
7+
<t t-if="layout == 'list'">
8+
<!-- LIST/TABLE VIEW -->
9+
<table class="table">
10+
<thead>
11+
<tr>
12+
<th scope="col">Number</th>
13+
<th scope="col">Customer Name</th>
14+
<th scope="col">Status</th>
15+
</tr>
16+
</thead>
17+
<tbody>
18+
<t t-foreach="result" t-as="sale_order" t-key="sale_order.id">
1219
<tr>
13-
<th scope="col">Number</th>
14-
<th scope="col">Customer Name</th>
15-
<th scope="col">Status</th>
20+
<th scope="row"><t t-esc="sale_order.id"/></th>
21+
<td><t t-esc="sale_order.partner_id[1]"/></td>
22+
<td><t t-esc="sale_order.state"/></td>
1623
</tr>
17-
</thead>
18-
<tbody>
19-
<t t-foreach="result" t-as="sale_order" t-key="sale_order.id">
20-
<tr>
21-
<th scope="row">
22-
<t t-esc="sale_order.id"/>
23-
</th>
24-
<td><t t-esc="sale_order.partner_id[1]"/></td>
25-
<td><t t-esc="sale_order.state"/></td>
26-
</tr>
27-
</t>
28-
</tbody>
29-
</table>
30-
31-
<div class="text-center mt-3">
32-
<button type="button" class="btn btn-primary load-more-button">
33-
Load More
34-
</button>
35-
</div>
36-
24+
</t>
25+
</tbody>
26+
</table>
27+
</t>
28+
<t t-else="">
29+
<!-- GRID/CARD VIEW -->
30+
<div class="row">
31+
<t t-foreach="result" t-as="sale_order" t-key="sale_order.id">
32+
<div class="col-md-4 mb-4">
33+
<div class="card h-100">
34+
<div class="card-body">
35+
<h5 class="card-title">Order #<t t-esc="sale_order.id"/></h5>
36+
<p class="card-text"><strong>Customer:</strong> <t t-esc="sale_order.partner_id[1]"/></p>
37+
<p class="card-text"><strong>Status:</strong> <t t-esc="sale_order.state"/></p>
38+
</div>
39+
</div>
40+
</div>
41+
</t>
3742
</div>
43+
</t>
44+
45+
<div class="text-center mt-3">
46+
<button type="button" class="btn btn-primary load-more-button">
47+
Load More
48+
</button>
3849
</div>
3950
</div>
40-
</section>
51+
</div>
4152
</t>
4253
</templates>

‎website_dynamic_snippet/views/snippets/snippet_templates.xml

+19
Original file line numberDiff line numberDiff line change
@@ -20,4 +20,23 @@
2020
</xpath>
2121
</template>
2222

23+
<template id="s_dynamic_snippet_controller_layout" inherit_id="website.snippet_options">
24+
<xpath expr="." position="inside">
25+
<t t-call="website.s_dynamic_snippet_options_template">
26+
<t t-set="snippet_name" t-value="'dynamic_snippet_sale_order'"/>
27+
<t t-set="snippet_selector" t-value="'.categories_section'"/>
28+
</t>
29+
</xpath>
30+
</template>
31+
32+
<template id="s_dynamic_snippet_sale_order_template_options" inherit_id="website.s_dynamic_snippet_options_template">
33+
<xpath expr="//we-select[@data-name='filter_opt']" position="after">
34+
<t t-if="snippet_name == 'dynamic_snippet_sale_order'">
35+
<we-select data-name="default_listing_layout" string="View" data-no-preview="true" data-reload="/">
36+
<we-button data-set-layout="grid" data-name="grid_view_opt">Grid</we-button>
37+
<we-button data-set-layout="list" data-name="list_view_opt">List</we-button>
38+
</we-select>
39+
</t>
40+
</xpath>
41+
</template>
2342
</odoo>

0 commit comments

Comments
 (0)