Skip to content

Commit 31e9e67

Browse files
gppa-odoogppa-odoo
committed
Add dynamic content snippet + 3
1 parent c6eaeae commit 31e9e67

File tree

5 files changed

+72
-55
lines changed

5 files changed

+72
-55
lines changed

‎website_dynamic_snippet/__manifest__.py

+3-4
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,12 @@
44
'category': 'Website',
55
'depends': ['website_sale'],
66
'data': [
7-
'views/snippets/snippet_templates.xml',
7+
'views/snippets/snippets.xml',
88
],
99
'assets': {
1010
'web.assets_frontend': [
11-
'/website_dynamic_snippet/static/src/xml/sale_order_snippets.xml',
12-
'/website_dynamic_snippet/static/src/js/dynamic_snippet_sale_orders.js',
13-
'/website_dynamic_snippet/static/src/js/layout_switcher.js',
11+
'website_dynamic_snippet/static/src/snippets/s_dynamic_sale_order_snippet/000.xml',
12+
'website_dynamic_snippet/static/src/snippets/s_dynamic_sale_order_snippet/000.js',
1413
],
1514
'website.assets_wysiwyg': [
1615
'website_dynamic_snippet/static/src/snippets/s_dynamic_sale_order_snippet/options.js',

‎website_dynamic_snippet/static/src/js/dynamic_snippet_sale_orders.js renamed to ‎website_dynamic_snippet/static/src/snippets/s_dynamic_sale_order_snippet/000.js

+27-6
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import publicWidget from "@web/legacy/js/public/public_widget";
44

55
publicWidget.registry.get_product_tab = publicWidget.Widget.extend({
66
selector: '.categories_section',
7+
DisableinEditableMode: false,
78

89
events: {
910
'click .load-more-button': '_onLoadMoreClick',
@@ -17,6 +18,15 @@ publicWidget.registry.get_product_tab = publicWidget.Widget.extend({
1718
},
1819

1920
async willStart() {
21+
if(this.$target[0].querySelector(".card_sale_order") && this.$target[0].querySelector(".card_sale_order")) {
22+
if(this.$target[0].querySelector(".card_sale_order").classList.contains('d-none')){
23+
this.layout = "list";
24+
} else {
25+
this.layout = "grid";
26+
}
27+
} else {
28+
this.layout = "grid"
29+
}
2030
await this.loadCategories();
2131
},
2232

@@ -38,16 +48,22 @@ publicWidget.registry.get_product_tab = publicWidget.Widget.extend({
3848
{ result: result }
3949
);
4050

51+
const newTableRows = content.querySelectorAll('.list_sale_order > tbody > tr');
52+
const existingTableBody = this.el.querySelector('.list_sale_order > tbody');
53+
54+
const newCardCols = content.querySelectorAll('.card_sale_order > .col-md-4');
55+
const existingCardWrapper = this.el.querySelector('.card_sale_order');
56+
4157
if (this.offset === 0) {
4258
this.el.innerHTML = '';
4359
this.el.appendChild(content);
4460
} else {
45-
const newRows = content.querySelectorAll('tbody > tr');
46-
const existingTbody = this.el.querySelector('tbody');
47-
if (existingTbody) {
48-
newRows.forEach(row => {
49-
existingTbody.appendChild(row);
50-
});
61+
if (existingTableBody && newTableRows.length) {
62+
newTableRows.forEach(row => existingTableBody.appendChild(row));
63+
}
64+
65+
if (existingCardWrapper && newCardCols.length) {
66+
newCardCols.forEach(card => existingCardWrapper.appendChild(card));
5167
}
5268
}
5369

@@ -58,8 +74,13 @@ publicWidget.registry.get_product_tab = publicWidget.Widget.extend({
5874
loadMoreButton.style.display = 'none';
5975
}
6076
}
77+
if(this.layout === "list"){
78+
this.el.querySelector('.list_sale_order').classList.remove('d-none');
79+
this.el.querySelector('.card_sale_order').classList.add('d-none');
80+
}
6181
},
6282

83+
6384
async _onLoadMoreClick(ev) {
6485
ev.preventDefault();
6586
await this.loadCategories();

‎website_dynamic_snippet/static/src/xml/sale_order_snippets.xml renamed to ‎website_dynamic_snippet/static/src/snippets/s_dynamic_sale_order_snippet/000.xml

+4-10
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,7 @@
44
<div class="container my-5 categories_section">
55
<h3 class="section_heading">Sale Order Details</h3>
66
<div class="card_list_wrapper">
7-
<t t-if="layout == 'list'">
8-
<!-- LIST/TABLE VIEW -->
9-
<table class="table">
7+
<table class="table list_sale_order d-none">
108
<thead>
119
<tr>
1210
<th scope="col">Number</th>
@@ -24,10 +22,7 @@
2422
</t>
2523
</tbody>
2624
</table>
27-
</t>
28-
<t t-else="">
29-
<!-- GRID/CARD VIEW -->
30-
<div class="row">
25+
<div class="row card_sale_order">
3126
<t t-foreach="result" t-as="sale_order" t-key="sale_order.id">
3227
<div class="col-md-4 mb-4">
3328
<div class="card h-100">
@@ -40,7 +35,6 @@
4035
</div>
4136
</t>
4237
</div>
43-
</t>
4438

4539
<div class="text-center mt-3">
4640
<button type="button" class="btn btn-primary load-more-button">
@@ -49,5 +43,5 @@
4943
</div>
5044
</div>
5145
</div>
52-
</t>
53-
</templates>
46+
</t>
47+
</templates>

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

+32-28
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,40 @@
1-
/** @odoo-module **/
1+
import options from "@web_editor/js/editor/snippets.options";
22

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);
3+
options.registry.DynamicSnippetOptions = options.Class.extend({
4+
confirmOrderOnly(previewMode, widgetValue, params) {
5+
const confirmOrderOnly = widgetValue;
6+
this.$target[0].attr("data-confirm-order-only", widgetValue);
147
},
158

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-
});
9+
setLayout(previewMode, widgetValue, params) {
10+
const snippetList = this.$target[0].querySelector(".list_sale_order");
11+
const snippetCard = this.$target[0].querySelector(".card_sale_order");
12+
if (widgetValue && widgetValue === "list") {
13+
snippetList.classList.remove("d-none");
14+
snippetCard.classList.add("d-none");
15+
} else if (widgetValue && widgetValue === "grid") {
16+
snippetList.classList.add("d-none");
17+
snippetCard.classList.remove("d-none");
18+
} else {
19+
snippetList.classList.remove("d-none");
20+
snippetCard.classList.add("d-none");
21+
}
2822
},
2923

30-
onChangeOption(previewMode, widgetValue, params) {
31-
if (['grid', 'list'].includes(widgetValue)) {
32-
this.layout = widgetValue;
33-
this._render();
24+
//--------------------------------------------------------------------------
25+
// Private
26+
//--------------------------------------------------------------------------
27+
28+
/**
29+
* @override
30+
*/
31+
_computeWidgetState(methodName, widgetName, params, widgetValue) {
32+
if (methodName === "confirmOrderOnly") {
33+
return this.$target[0].dataset.isConfirmOrder === 'true' || this.$target[0].dataset.isConfirmOrder === true;
3434
}
35+
if (methodName === "setLayout") {
36+
return this.$target[0].querySelector(".list_sale_order").classList.contains('d-none') ? "grid" : "list";
37+
}
38+
return this._super(...arguments);
3539
},
3640
});

‎website_dynamic_snippet/views/snippets/snippet_templates.xml renamed to ‎website_dynamic_snippet/views/snippets/snippets.xml

+6-7
Original file line numberDiff line numberDiff line change
@@ -23,20 +23,19 @@
2323
<template id="s_dynamic_snippet_controller_layout" inherit_id="website.snippet_options">
2424
<xpath expr="." position="inside">
2525
<t t-call="website.s_dynamic_snippet_options_template">
26-
<t t-set="snippet_name" t-value="'dynamic_snippet_sale_order'"/>
26+
<t t-set="snippet_name" t-value="'DynamicSnippetOptions'"/>
2727
<t t-set="snippet_selector" t-value="'.categories_section'"/>
2828
</t>
2929
</xpath>
3030
</template>
3131

3232
<template id="s_dynamic_snippet_sale_order_template_options" inherit_id="website.s_dynamic_snippet_options_template">
3333
<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>
34+
<we-select data-name="snippet_data_view" string="View" data-no-preview="true" data-reload="/">
35+
<we-button data-set-layout="grid" data-name="grid_view_opt">Grid</we-button>
36+
<we-button data-set-layout="list" data-name="list_view_opt">List</we-button>
37+
</we-select>
38+
<we-button data-confirm-order-only="false" class="btn btn-primary">Show Confirm Orders</we-button>
4039
</xpath>
4140
</template>
4241
</odoo>

0 commit comments

Comments
 (0)