From 92c0815732b198b1829aa8e8e2450307c04aa825 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 09:23:16 +0200 Subject: [PATCH 01/17] [ADD] awesome_owl: implement counter functionality and integrate into playground --- awesome_owl/static/src/counter/counter.js | 13 +++++++++++++ awesome_owl/static/src/counter/counter.xml | 11 +++++++++++ awesome_owl/static/src/playground.js | 2 ++ awesome_owl/static/src/playground.xml | 1 + 4 files changed, 27 insertions(+) create mode 100644 awesome_owl/static/src/counter/counter.js create mode 100644 awesome_owl/static/src/counter/counter.xml diff --git a/awesome_owl/static/src/counter/counter.js b/awesome_owl/static/src/counter/counter.js new file mode 100644 index 00000000000..b1635cbeda3 --- /dev/null +++ b/awesome_owl/static/src/counter/counter.js @@ -0,0 +1,13 @@ +import { Component, useState } from "@odoo/owl"; + +export class Counter extends Component { + static template = "awesome_owl.Counter"; + + setup() { + this.state = useState({ value: 0 }); + } + + increment() { + this.state.value++; + } +} \ No newline at end of file diff --git a/awesome_owl/static/src/counter/counter.xml b/awesome_owl/static/src/counter/counter.xml new file mode 100644 index 00000000000..83b2dcf0d06 --- /dev/null +++ b/awesome_owl/static/src/counter/counter.xml @@ -0,0 +1,11 @@ + + + + +
+

Counter:

+ +
+
+ +
diff --git a/awesome_owl/static/src/playground.js b/awesome_owl/static/src/playground.js index 657fb8b07bb..9f85177447d 100644 --- a/awesome_owl/static/src/playground.js +++ b/awesome_owl/static/src/playground.js @@ -1,7 +1,9 @@ /** @odoo-module **/ import { Component } from "@odoo/owl"; +import { Counter } from "./counter/counter"; export class Playground extends Component { static template = "awesome_owl.playground"; + static components = { Counter }; } diff --git a/awesome_owl/static/src/playground.xml b/awesome_owl/static/src/playground.xml index 4fb905d59f9..bd85761eb76 100644 --- a/awesome_owl/static/src/playground.xml +++ b/awesome_owl/static/src/playground.xml @@ -5,6 +5,7 @@
hello world
+ From abd6da51ce693e965d3d14b75a9ff9c995ed6df1 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 09:25:28 +0200 Subject: [PATCH 02/17] [FIX] awesome_owl: add duplicate Counter component and maintain aligned structure --- awesome_owl/static/src/playground.xml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/awesome_owl/static/src/playground.xml b/awesome_owl/static/src/playground.xml index bd85761eb76..57879b36b88 100644 --- a/awesome_owl/static/src/playground.xml +++ b/awesome_owl/static/src/playground.xml @@ -4,8 +4,9 @@
hello world + +
-
From 010fb2c1d7da18b480fe1ce684b4b9fa1192a8bc Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 09:57:09 +0200 Subject: [PATCH 03/17] [ADD] awesome_owl: create Card component and integrate into Playground --- awesome_owl/static/src/card/card.js | 5 +++++ awesome_owl/static/src/card/card.xml | 11 +++++++++++ awesome_owl/static/src/playground.js | 5 ++--- awesome_owl/static/src/playground.xml | 5 ++++- 4 files changed, 22 insertions(+), 4 deletions(-) create mode 100644 awesome_owl/static/src/card/card.js create mode 100644 awesome_owl/static/src/card/card.xml diff --git a/awesome_owl/static/src/card/card.js b/awesome_owl/static/src/card/card.js new file mode 100644 index 00000000000..bc8ae23762d --- /dev/null +++ b/awesome_owl/static/src/card/card.js @@ -0,0 +1,5 @@ +import { Component } from "@odoo/owl"; + +export class Card extends Component { + static template = "awesome_owl.Card"; +} \ No newline at end of file diff --git a/awesome_owl/static/src/card/card.xml b/awesome_owl/static/src/card/card.xml new file mode 100644 index 00000000000..86596c4eb64 --- /dev/null +++ b/awesome_owl/static/src/card/card.xml @@ -0,0 +1,11 @@ + + + +
+
+
+

+
+
+
+
\ No newline at end of file diff --git a/awesome_owl/static/src/playground.js b/awesome_owl/static/src/playground.js index 9f85177447d..dae12a5231a 100644 --- a/awesome_owl/static/src/playground.js +++ b/awesome_owl/static/src/playground.js @@ -1,9 +1,8 @@ -/** @odoo-module **/ - import { Component } from "@odoo/owl"; import { Counter } from "./counter/counter"; +import { Card } from "./card/card"; export class Playground extends Component { static template = "awesome_owl.playground"; - static components = { Counter }; + static components = { Counter, Card }; } diff --git a/awesome_owl/static/src/playground.xml b/awesome_owl/static/src/playground.xml index 57879b36b88..ec1025dfd89 100644 --- a/awesome_owl/static/src/playground.xml +++ b/awesome_owl/static/src/playground.xml @@ -7,6 +7,9 @@ +
+ + +
- From 35f6d8d253fbf0c806f611f8ee2de837380186a5 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 11:15:01 +0200 Subject: [PATCH 04/17] [ADD] awesome_owl: update Card component to use t-out for rendering props and adjust Playground to utilize dynamic content --- awesome_owl/static/src/card/card.xml | 4 ++-- awesome_owl/static/src/playground.js | 7 ++++++- awesome_owl/static/src/playground.xml | 4 ++-- 3 files changed, 10 insertions(+), 5 deletions(-) diff --git a/awesome_owl/static/src/card/card.xml b/awesome_owl/static/src/card/card.xml index 86596c4eb64..7a0f39cf6dc 100644 --- a/awesome_owl/static/src/card/card.xml +++ b/awesome_owl/static/src/card/card.xml @@ -3,8 +3,8 @@
-
-

+
+

diff --git a/awesome_owl/static/src/playground.js b/awesome_owl/static/src/playground.js index dae12a5231a..00fc95386e9 100644 --- a/awesome_owl/static/src/playground.js +++ b/awesome_owl/static/src/playground.js @@ -1,8 +1,13 @@ -import { Component } from "@odoo/owl"; +import { Component, markup } from "@odoo/owl"; import { Counter } from "./counter/counter"; import { Card } from "./card/card"; export class Playground extends Component { static template = "awesome_owl.playground"; static components = { Counter, Card }; + + setup() { + this.s1 = "
some content
"; + this.s2 = markup("
some content
"); + } } diff --git a/awesome_owl/static/src/playground.xml b/awesome_owl/static/src/playground.xml index ec1025dfd89..93e3ffd2511 100644 --- a/awesome_owl/static/src/playground.xml +++ b/awesome_owl/static/src/playground.xml @@ -8,8 +8,8 @@
- - + +
From 33d9d61c5dc292ad4af735bbeb539afa6c07f90b Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 11:28:20 +0200 Subject: [PATCH 05/17] [ADD] awesome_owl: define props for Card and Counter components to enhance functionality --- awesome_owl/static/src/card/card.js | 4 ++++ awesome_owl/static/src/counter/counter.js | 3 +++ 2 files changed, 7 insertions(+) diff --git a/awesome_owl/static/src/card/card.js b/awesome_owl/static/src/card/card.js index bc8ae23762d..03e2f9ff39b 100644 --- a/awesome_owl/static/src/card/card.js +++ b/awesome_owl/static/src/card/card.js @@ -2,4 +2,8 @@ import { Component } from "@odoo/owl"; export class Card extends Component { static template = "awesome_owl.Card"; + static props = { + title: { type: String }, + content: { type: String, optional: true }, + } } \ No newline at end of file diff --git a/awesome_owl/static/src/counter/counter.js b/awesome_owl/static/src/counter/counter.js index b1635cbeda3..2ddccff3f11 100644 --- a/awesome_owl/static/src/counter/counter.js +++ b/awesome_owl/static/src/counter/counter.js @@ -2,6 +2,9 @@ import { Component, useState } from "@odoo/owl"; export class Counter extends Component { static template = "awesome_owl.Counter"; + static props = { + initialValue: { type: Number, optional: true, default: 0, validate: (value) => value >= 0 }, + }; setup() { this.state = useState({ value: 0 }); From 7caed05f55caca673c83eff56c474bd00f278046 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 11:51:59 +0200 Subject: [PATCH 06/17] [ADD] awesome_owl: enhance Counter component with onChange prop and integrate sum functionality in Playground --- awesome_owl/static/src/counter/counter.js | 4 ++++ awesome_owl/static/src/playground.js | 7 ++++++- awesome_owl/static/src/playground.xml | 5 +++-- 3 files changed, 13 insertions(+), 3 deletions(-) diff --git a/awesome_owl/static/src/counter/counter.js b/awesome_owl/static/src/counter/counter.js index 2ddccff3f11..f2c60324ea0 100644 --- a/awesome_owl/static/src/counter/counter.js +++ b/awesome_owl/static/src/counter/counter.js @@ -4,6 +4,7 @@ export class Counter extends Component { static template = "awesome_owl.Counter"; static props = { initialValue: { type: Number, optional: true, default: 0, validate: (value) => value >= 0 }, + onChange: { type: Function, optional: true }, }; setup() { @@ -12,5 +13,8 @@ export class Counter extends Component { increment() { this.state.value++; + if (this.props.onChange) { + this.props.onChange(this.state.value); + } } } \ No newline at end of file diff --git a/awesome_owl/static/src/playground.js b/awesome_owl/static/src/playground.js index 00fc95386e9..99e4cdf46b8 100644 --- a/awesome_owl/static/src/playground.js +++ b/awesome_owl/static/src/playground.js @@ -1,4 +1,4 @@ -import { Component, markup } from "@odoo/owl"; +import { Component, markup, useState } from "@odoo/owl"; import { Counter } from "./counter/counter"; import { Card } from "./card/card"; @@ -9,5 +9,10 @@ export class Playground extends Component { setup() { this.s1 = "
some content
"; this.s2 = markup("
some content
"); + this.sum = useState({ value: 0 }); + } + + incrementSum() { + this.sum.value++; } } diff --git a/awesome_owl/static/src/playground.xml b/awesome_owl/static/src/playground.xml index 93e3ffd2511..63dd17ca1a5 100644 --- a/awesome_owl/static/src/playground.xml +++ b/awesome_owl/static/src/playground.xml @@ -4,8 +4,9 @@
hello world - - + + +
The sum is:
From 99ade4c2036d0055f17371210df0737f61ff5f3a Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 15:16:39 +0200 Subject: [PATCH 07/17] [ADD] awesome_owl: integrate TodoList component and create TodoItem for task management --- awesome_owl/static/src/playground.js | 3 ++- awesome_owl/static/src/playground.xml | 3 +++ awesome_owl/static/src/todo_list/todo_item.js | 14 ++++++++++++++ awesome_owl/static/src/todo_list/todo_item.xml | 9 +++++++++ awesome_owl/static/src/todo_list/todo_list.js | 16 ++++++++++++++++ awesome_owl/static/src/todo_list/todo_list.xml | 10 ++++++++++ 6 files changed, 54 insertions(+), 1 deletion(-) create mode 100644 awesome_owl/static/src/todo_list/todo_item.js create mode 100644 awesome_owl/static/src/todo_list/todo_item.xml create mode 100644 awesome_owl/static/src/todo_list/todo_list.js create mode 100644 awesome_owl/static/src/todo_list/todo_list.xml diff --git a/awesome_owl/static/src/playground.js b/awesome_owl/static/src/playground.js index 99e4cdf46b8..b1c13c12b1d 100644 --- a/awesome_owl/static/src/playground.js +++ b/awesome_owl/static/src/playground.js @@ -1,10 +1,11 @@ import { Component, markup, useState } from "@odoo/owl"; import { Counter } from "./counter/counter"; import { Card } from "./card/card"; +import { TodoList } from "./todo_list/todo_list"; export class Playground extends Component { static template = "awesome_owl.playground"; - static components = { Counter, Card }; + static components = { Counter, Card, TodoList }; setup() { this.s1 = "
some content
"; diff --git a/awesome_owl/static/src/playground.xml b/awesome_owl/static/src/playground.xml index 63dd17ca1a5..ed02c834d93 100644 --- a/awesome_owl/static/src/playground.xml +++ b/awesome_owl/static/src/playground.xml @@ -12,5 +12,8 @@
+
+ +
diff --git a/awesome_owl/static/src/todo_list/todo_item.js b/awesome_owl/static/src/todo_list/todo_item.js new file mode 100644 index 00000000000..730ff686c9c --- /dev/null +++ b/awesome_owl/static/src/todo_list/todo_item.js @@ -0,0 +1,14 @@ +import { Component } from "@odoo/owl"; + +export class TodoItem extends Component { + static template = "awesome_owl.TodoItem"; + static props = { + todo: { type: Object, + shape: { + id: { type: Number, default: 0 }, + description: { type: String, default: "" }, + isCompleted: { type: Boolean, default: false }, + } + } + }; +} \ No newline at end of file diff --git a/awesome_owl/static/src/todo_list/todo_item.xml b/awesome_owl/static/src/todo_list/todo_item.xml new file mode 100644 index 00000000000..803016a0879 --- /dev/null +++ b/awesome_owl/static/src/todo_list/todo_item.xml @@ -0,0 +1,9 @@ + + + +
+ + +
+
+
\ No newline at end of file diff --git a/awesome_owl/static/src/todo_list/todo_list.js b/awesome_owl/static/src/todo_list/todo_list.js new file mode 100644 index 00000000000..18e612175c3 --- /dev/null +++ b/awesome_owl/static/src/todo_list/todo_list.js @@ -0,0 +1,16 @@ +import {Component, useState} from "@odoo/owl"; +import {TodoItem} from "./todo_item"; + +export class TodoList extends Component { + static template = "awesome_owl.TodoList"; + static components = {TodoItem}; + + setup() { + this.todos = useState([ + {id: 1, description: "Buy groceries", isCompleted: false}, + {id: 2, description: "Walk the dog", isCompleted: false}, + {id: 3, description: "Read a book", isCompleted: true}, + ], + ); + } +} \ No newline at end of file diff --git a/awesome_owl/static/src/todo_list/todo_list.xml b/awesome_owl/static/src/todo_list/todo_list.xml new file mode 100644 index 00000000000..a05ada55464 --- /dev/null +++ b/awesome_owl/static/src/todo_list/todo_list.xml @@ -0,0 +1,10 @@ + + + +
+ + + +
+
+
\ No newline at end of file From 722fa7e8d37e3b83481d6f3f3bff511745004036 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 15:37:20 +0200 Subject: [PATCH 08/17] [ADD] awesome_owl: modify TodoItem component to conditionally apply styles based on task completion status --- awesome_owl/static/src/todo_list/todo_item.xml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/awesome_owl/static/src/todo_list/todo_item.xml b/awesome_owl/static/src/todo_list/todo_item.xml index 803016a0879..a2505d9bea2 100644 --- a/awesome_owl/static/src/todo_list/todo_item.xml +++ b/awesome_owl/static/src/todo_list/todo_item.xml @@ -1,9 +1,9 @@ -
+
- \ No newline at end of file + From 86ee05525911dbf961502dd89d432ce6625da5ae Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Wed, 28 May 2025 16:16:22 +0200 Subject: [PATCH 09/17] [ADD] awesome_owl: implement dynamic todo addition in TodoList component --- awesome_owl/static/src/todo_list/todo_list.js | 19 +++++++++++++------ .../static/src/todo_list/todo_list.xml | 1 + 2 files changed, 14 insertions(+), 6 deletions(-) diff --git a/awesome_owl/static/src/todo_list/todo_list.js b/awesome_owl/static/src/todo_list/todo_list.js index 18e612175c3..fc857a00804 100644 --- a/awesome_owl/static/src/todo_list/todo_list.js +++ b/awesome_owl/static/src/todo_list/todo_list.js @@ -6,11 +6,18 @@ export class TodoList extends Component { static components = {TodoItem}; setup() { - this.todos = useState([ - {id: 1, description: "Buy groceries", isCompleted: false}, - {id: 2, description: "Walk the dog", isCompleted: false}, - {id: 3, description: "Read a book", isCompleted: true}, - ], - ); + this.todos = useState([]); + } + + addTodo(ev) { + if (ev.keyCode === 13 && ev.target.value.trim() != "") { + const newTodo = { + id: this.todos.length + 1, + description: ev.target.value.trim(), + isCompleted: false, + }; + this.todos.push(newTodo); + ev.target.value = ""; + } } } \ No newline at end of file diff --git a/awesome_owl/static/src/todo_list/todo_list.xml b/awesome_owl/static/src/todo_list/todo_list.xml index a05ada55464..ec82f6ef984 100644 --- a/awesome_owl/static/src/todo_list/todo_list.xml +++ b/awesome_owl/static/src/todo_list/todo_list.xml @@ -2,6 +2,7 @@
+ From cf1b7929af50e198c876c70b3032882aac29e658 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Fri, 30 May 2025 09:15:35 +0200 Subject: [PATCH 10/17] [ADD] awesome_owl: implement autofocus utility and integrate it in TodoList component --- awesome_owl/static/src/todo_list/todo_list.js | 2 ++ awesome_owl/static/src/todo_list/todo_list.xml | 2 +- awesome_owl/static/src/utils.js | 13 +++++++++++++ 3 files changed, 16 insertions(+), 1 deletion(-) create mode 100644 awesome_owl/static/src/utils.js diff --git a/awesome_owl/static/src/todo_list/todo_list.js b/awesome_owl/static/src/todo_list/todo_list.js index fc857a00804..0d9af640047 100644 --- a/awesome_owl/static/src/todo_list/todo_list.js +++ b/awesome_owl/static/src/todo_list/todo_list.js @@ -1,5 +1,6 @@ import {Component, useState} from "@odoo/owl"; import {TodoItem} from "./todo_item"; +import { useAutofocus } from "../utils"; export class TodoList extends Component { static template = "awesome_owl.TodoList"; @@ -7,6 +8,7 @@ export class TodoList extends Component { setup() { this.todos = useState([]); + useAutofocus("input") } addTodo(ev) { diff --git a/awesome_owl/static/src/todo_list/todo_list.xml b/awesome_owl/static/src/todo_list/todo_list.xml index ec82f6ef984..d950a54bd5b 100644 --- a/awesome_owl/static/src/todo_list/todo_list.xml +++ b/awesome_owl/static/src/todo_list/todo_list.xml @@ -2,7 +2,7 @@
- + diff --git a/awesome_owl/static/src/utils.js b/awesome_owl/static/src/utils.js new file mode 100644 index 00000000000..026c6c1b076 --- /dev/null +++ b/awesome_owl/static/src/utils.js @@ -0,0 +1,13 @@ +import {useRef, onMounted} from "@odoo/owl"; + +export function useAutofocus(input) { + const inputRef = useRef(input); + + onMounted(() => { + if (inputRef.el) { + inputRef.el.focus(); + } + }); + + return { inputRef }; +} \ No newline at end of file From d35d10a878644c4a19709ecc98729df138e2dc94 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Fri, 30 May 2025 09:44:27 +0200 Subject: [PATCH 11/17] [ADD] awesome_owl: implement toggle and remove functionality in TodoItem and TodoList components --- awesome_owl/static/src/todo_list/todo_item.js | 12 +++++++++++- awesome_owl/static/src/todo_list/todo_item.xml | 10 +++++++--- awesome_owl/static/src/todo_list/todo_list.js | 13 +++++++++++++ awesome_owl/static/src/todo_list/todo_list.xml | 2 +- 4 files changed, 32 insertions(+), 5 deletions(-) diff --git a/awesome_owl/static/src/todo_list/todo_item.js b/awesome_owl/static/src/todo_list/todo_item.js index 730ff686c9c..4030485b157 100644 --- a/awesome_owl/static/src/todo_list/todo_item.js +++ b/awesome_owl/static/src/todo_list/todo_item.js @@ -9,6 +9,16 @@ export class TodoItem extends Component { description: { type: String, default: "" }, isCompleted: { type: Boolean, default: false }, } - } + }, + toggleState: { type: Function, optional: true }, + removeTodo: { type: Function, optional: true }, }; + + onChange() { + this.props.toggleState(this.props.todo.id); + } + + onRemove() { + this.props.removeTodo(this.props.todo.id); + } } \ No newline at end of file diff --git a/awesome_owl/static/src/todo_list/todo_item.xml b/awesome_owl/static/src/todo_list/todo_item.xml index a2505d9bea2..c4eb7c25a84 100644 --- a/awesome_owl/static/src/todo_list/todo_item.xml +++ b/awesome_owl/static/src/todo_list/todo_item.xml @@ -1,9 +1,13 @@ -
- - +
+ + +
diff --git a/awesome_owl/static/src/todo_list/todo_list.js b/awesome_owl/static/src/todo_list/todo_list.js index 0d9af640047..eb38b1694d7 100644 --- a/awesome_owl/static/src/todo_list/todo_list.js +++ b/awesome_owl/static/src/todo_list/todo_list.js @@ -22,4 +22,17 @@ export class TodoList extends Component { ev.target.value = ""; } } + toggleTodo(id) { + const todo = this.todos.find(todo => todo.id === id); + if (todo) { + todo.isCompleted = !todo.isCompleted; + } + } + + removeTodo(id) { + const index = this.todos.findIndex(todo => todo.id === id); + if (index !== -1) { + this.todos.splice(index, 1); + } + } } \ No newline at end of file diff --git a/awesome_owl/static/src/todo_list/todo_list.xml b/awesome_owl/static/src/todo_list/todo_list.xml index d950a54bd5b..f3d1d9f4021 100644 --- a/awesome_owl/static/src/todo_list/todo_list.xml +++ b/awesome_owl/static/src/todo_list/todo_list.xml @@ -4,7 +4,7 @@
- +
From 73465b9174076043aa9d481e235b1af326a53736 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Fri, 30 May 2025 10:00:42 +0200 Subject: [PATCH 12/17] [ADD] awesome_owl: update Card component to use slots for dynamic content rendering --- awesome_owl/static/src/card/card.js | 5 ++++- awesome_owl/static/src/card/card.xml | 2 +- awesome_owl/static/src/playground.xml | 8 ++++++-- 3 files changed, 11 insertions(+), 4 deletions(-) diff --git a/awesome_owl/static/src/card/card.js b/awesome_owl/static/src/card/card.js index 03e2f9ff39b..74c112db376 100644 --- a/awesome_owl/static/src/card/card.js +++ b/awesome_owl/static/src/card/card.js @@ -4,6 +4,9 @@ export class Card extends Component { static template = "awesome_owl.Card"; static props = { title: { type: String }, - content: { type: String, optional: true }, + slots: { + type: Object, + shape: { default:true }, + } } } \ No newline at end of file diff --git a/awesome_owl/static/src/card/card.xml b/awesome_owl/static/src/card/card.xml index 7a0f39cf6dc..eb5d0d5efb8 100644 --- a/awesome_owl/static/src/card/card.xml +++ b/awesome_owl/static/src/card/card.xml @@ -4,7 +4,7 @@
-

+

diff --git a/awesome_owl/static/src/playground.xml b/awesome_owl/static/src/playground.xml index ed02c834d93..65298c9a32a 100644 --- a/awesome_owl/static/src/playground.xml +++ b/awesome_owl/static/src/playground.xml @@ -9,8 +9,12 @@
The sum is:
- - + +

This is the content of Card 1.

+
+ + +
From 82ac6adb96b238215528916b1c7c1790a07ce61d Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Fri, 30 May 2025 10:19:36 +0200 Subject: [PATCH 13/17] [ADD] awesome_owl: enhance Card component with toggle functionality and state management --- awesome_owl/static/src/card/card.js | 12 +++++++++++- awesome_owl/static/src/card/card.xml | 9 +++++++-- 2 files changed, 18 insertions(+), 3 deletions(-) diff --git a/awesome_owl/static/src/card/card.js b/awesome_owl/static/src/card/card.js index 74c112db376..a36b44300d3 100644 --- a/awesome_owl/static/src/card/card.js +++ b/awesome_owl/static/src/card/card.js @@ -1,4 +1,4 @@ -import { Component } from "@odoo/owl"; +import { Component, useState } from "@odoo/owl"; export class Card extends Component { static template = "awesome_owl.Card"; @@ -7,6 +7,16 @@ export class Card extends Component { slots: { type: Object, shape: { default:true }, + }, + } + + setup() { + this.state = useState({ isToggled: true }); + } + toggle() { + this.state.isToggled = !this.state.isToggled; + if (this.props.onChange) { + this.props.onChange(this.state.isToggled); } } } \ No newline at end of file diff --git a/awesome_owl/static/src/card/card.xml b/awesome_owl/static/src/card/card.xml index eb5d0d5efb8..9b662da71a5 100644 --- a/awesome_owl/static/src/card/card.xml +++ b/awesome_owl/static/src/card/card.xml @@ -3,8 +3,13 @@
-
-

+
+ + +
+

+ +

From 1e85def6878bfd0f777d539d99a7d4ac44f23933 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Mon, 2 Jun 2025 09:58:18 +0200 Subject: [PATCH 14/17] [ADD] awesome_dashboard: implement layout and buttons for customer and leads actions --- awesome_dashboard/static/src/dashboard.js | 27 +++++++++++++++++++++ awesome_dashboard/static/src/dashboard.scss | 3 +++ awesome_dashboard/static/src/dashboard.xml | 8 +++++- 3 files changed, 37 insertions(+), 1 deletion(-) create mode 100644 awesome_dashboard/static/src/dashboard.scss diff --git a/awesome_dashboard/static/src/dashboard.js b/awesome_dashboard/static/src/dashboard.js index 637fa4bb972..fceea180f24 100644 --- a/awesome_dashboard/static/src/dashboard.js +++ b/awesome_dashboard/static/src/dashboard.js @@ -2,9 +2,36 @@ import { Component } from "@odoo/owl"; import { registry } from "@web/core/registry"; +import { Layout } from "@web/search/layout"; +import { useService } from "@web/core/utils/hooks"; class AwesomeDashboard extends Component { static template = "awesome_dashboard.AwesomeDashboard"; + + static components = { Layout }; + + setup() { + this.action = useService("action"); + this.display = { + controlPanel: {}, + }; + } + + openCustomerView() { + this.action.doAction("base.action_partner_form"); + } + + openLeads() { + this.action.doAction({ + type: "ir.actions.act_window", + name: "All leads", + res_model: "crm.lead", + views: [ + [false, "list"], + [false, "form"], + ], + }); + } } registry.category("actions").add("awesome_dashboard.dashboard", AwesomeDashboard); diff --git a/awesome_dashboard/static/src/dashboard.scss b/awesome_dashboard/static/src/dashboard.scss new file mode 100644 index 00000000000..49a8d6a691f --- /dev/null +++ b/awesome_dashboard/static/src/dashboard.scss @@ -0,0 +1,3 @@ +.o_dashboard { + background-color: rgb(86, 72, 90); +} \ No newline at end of file diff --git a/awesome_dashboard/static/src/dashboard.xml b/awesome_dashboard/static/src/dashboard.xml index 1a2ac9a2fed..58c1df94324 100644 --- a/awesome_dashboard/static/src/dashboard.xml +++ b/awesome_dashboard/static/src/dashboard.xml @@ -2,7 +2,13 @@ - hello dashboard + + + + + + content goes here + From 5a048a9829a52cd50d77b77eb490c3847735e5c1 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Mon, 2 Jun 2025 10:01:26 +0200 Subject: [PATCH 15/17] [ADD] awesome_dashboard: add DashboardItem component and integrate it into AwesomeDashboard layout --- awesome_dashboard/static/src/dashboard.js | 4 ++-- awesome_dashboard/static/src/dashboard.xml | 12 +++++++++++- .../static/src/dashboard_item/dashboard_item.js | 16 ++++++++++++++++ .../static/src/dashboard_item/dashboard_item.xml | 10 ++++++++++ 4 files changed, 39 insertions(+), 3 deletions(-) create mode 100644 awesome_dashboard/static/src/dashboard_item/dashboard_item.js create mode 100644 awesome_dashboard/static/src/dashboard_item/dashboard_item.xml diff --git a/awesome_dashboard/static/src/dashboard.js b/awesome_dashboard/static/src/dashboard.js index fceea180f24..230fc12eb82 100644 --- a/awesome_dashboard/static/src/dashboard.js +++ b/awesome_dashboard/static/src/dashboard.js @@ -4,11 +4,11 @@ import { Component } from "@odoo/owl"; import { registry } from "@web/core/registry"; import { Layout } from "@web/search/layout"; import { useService } from "@web/core/utils/hooks"; - +import { DashboardItem } from "./dashboard_item/dashboard_item" class AwesomeDashboard extends Component { static template = "awesome_dashboard.AwesomeDashboard"; - static components = { Layout }; + static components = { Layout, DashboardItem }; setup() { this.action = useService("action"); diff --git a/awesome_dashboard/static/src/dashboard.xml b/awesome_dashboard/static/src/dashboard.xml index 58c1df94324..c677f756d0d 100644 --- a/awesome_dashboard/static/src/dashboard.xml +++ b/awesome_dashboard/static/src/dashboard.xml @@ -7,7 +7,17 @@ - content goes here +
+ + some content + + + I love milk + + + some content + +
diff --git a/awesome_dashboard/static/src/dashboard_item/dashboard_item.js b/awesome_dashboard/static/src/dashboard_item/dashboard_item.js new file mode 100644 index 00000000000..24373d4836b --- /dev/null +++ b/awesome_dashboard/static/src/dashboard_item/dashboard_item.js @@ -0,0 +1,16 @@ +import { Component } from "@odoo/owl"; +export class DashboardItem extends Component { + static template = "awesome_dashboard.DashboardItem" + static props = { + slots: { + type: Object, + optional: true, + default: () => ({}), + }, + size: { + type: Number, + default: 1, + optional: true, + }, + }; +} diff --git a/awesome_dashboard/static/src/dashboard_item/dashboard_item.xml b/awesome_dashboard/static/src/dashboard_item/dashboard_item.xml new file mode 100644 index 00000000000..d023340bb59 --- /dev/null +++ b/awesome_dashboard/static/src/dashboard_item/dashboard_item.xml @@ -0,0 +1,10 @@ + + + +
+
+ +
+
+
+
\ No newline at end of file From 0cd0cbc75aeca69019692d5a1ed78e9bb6d7adb8 Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Mon, 2 Jun 2025 13:20:45 +0200 Subject: [PATCH 16/17] [ADD] awesome_dashboard: fetch and display statistics in DashboardItem components --- awesome_dashboard/static/src/dashboard.js | 6 +++++- awesome_dashboard/static/src/dashboard.xml | 19 +++++++++++++++---- 2 files changed, 20 insertions(+), 5 deletions(-) diff --git a/awesome_dashboard/static/src/dashboard.js b/awesome_dashboard/static/src/dashboard.js index 230fc12eb82..0a7de097ff5 100644 --- a/awesome_dashboard/static/src/dashboard.js +++ b/awesome_dashboard/static/src/dashboard.js @@ -1,10 +1,11 @@ /** @odoo-module **/ -import { Component } from "@odoo/owl"; +import { Component, onWillStart } from "@odoo/owl"; import { registry } from "@web/core/registry"; import { Layout } from "@web/search/layout"; import { useService } from "@web/core/utils/hooks"; import { DashboardItem } from "./dashboard_item/dashboard_item" +import { rpc } from "@web/core/network/rpc"; class AwesomeDashboard extends Component { static template = "awesome_dashboard.AwesomeDashboard"; @@ -15,6 +16,9 @@ class AwesomeDashboard extends Component { this.display = { controlPanel: {}, }; + onWillStart(async () => { + this.statistics = await rpc("awesome_dashboard/statistics", {}); + }); } openCustomerView() { diff --git a/awesome_dashboard/static/src/dashboard.xml b/awesome_dashboard/static/src/dashboard.xml index c677f756d0d..ff654ba4f90 100644 --- a/awesome_dashboard/static/src/dashboard.xml +++ b/awesome_dashboard/static/src/dashboard.xml @@ -9,13 +9,24 @@
- some content + Number of new orders this month + - - I love milk + + Total amount of new orders this month + + + + Average amount of t-shirt by order this month + + + + Number of cancelled orders this month + - some content + Average time for an order to go from ‘new’ to ‘sent’ or ‘cancelled’ +
From 1ff36c0a8e1e4f234859f73cc931d2d26e4b9c2c Mon Sep 17 00:00:00 2001 From: oumaima-aarabe <111888559+oumaima-aarabe@users.noreply.github.com> Date: Mon, 2 Jun 2025 13:44:25 +0200 Subject: [PATCH 17/17] [ADD] awesome_dashboard: implement statistics service for loading dashboard statistics --- awesome_dashboard/static/src/dashboard.js | 4 ++-- awesome_dashboard/static/src/statistics.js | 14 ++++++++++++++ 2 files changed, 16 insertions(+), 2 deletions(-) create mode 100644 awesome_dashboard/static/src/statistics.js diff --git a/awesome_dashboard/static/src/dashboard.js b/awesome_dashboard/static/src/dashboard.js index 0a7de097ff5..0c19267a96c 100644 --- a/awesome_dashboard/static/src/dashboard.js +++ b/awesome_dashboard/static/src/dashboard.js @@ -5,7 +5,6 @@ import { registry } from "@web/core/registry"; import { Layout } from "@web/search/layout"; import { useService } from "@web/core/utils/hooks"; import { DashboardItem } from "./dashboard_item/dashboard_item" -import { rpc } from "@web/core/network/rpc"; class AwesomeDashboard extends Component { static template = "awesome_dashboard.AwesomeDashboard"; @@ -13,11 +12,12 @@ class AwesomeDashboard extends Component { setup() { this.action = useService("action"); + this.statistics = useService("awesome_dashboard.statistics"); this.display = { controlPanel: {}, }; onWillStart(async () => { - this.statistics = await rpc("awesome_dashboard/statistics", {}); + this.statistics = await this.statistics.loadStatistics(); }); } diff --git a/awesome_dashboard/static/src/statistics.js b/awesome_dashboard/static/src/statistics.js new file mode 100644 index 00000000000..9f7a1b19a09 --- /dev/null +++ b/awesome_dashboard/static/src/statistics.js @@ -0,0 +1,14 @@ +import { registry } from "@web/core/registry"; +import { memoize } from "@web/core/utils/functions"; +import { rpc } from "@web/core/network/rpc"; + +const statistics = { + async: ["loadStatistics"], + start() { + return { + loadStatistics: memoize(() => rpc("/awesome_dashboard/statistics")), + }; + }, +}; + +registry.category("services").add("awesome_dashboard.statistics", statistics); \ No newline at end of file