Odoo 16 Development Book

Gantt view

In Odoo, we can create several views such as tree view, form view, list view, kanban view, pivot view, calendar view, etc. The Gantt view is a Gantt visualization. It is one of the advanced types of view in Odoo. We can access this feature only in the enterprise version. If you want to use the Gantt view in your custom module, you should have to install the “web_gantt” and also mention the module ‘web_gantt” in the manifest.

Let’s take an example.

class ExampleOdoo(models.Model):
    _name="example.odoo"
    example_field = fields.Char(string="Example Field")
    example_field1 = fields.Many2one('res.users', 'User', required=True)

After the model is created, we can add the menu and the corresponding menu and action for this model.

<record id="action_Example" model="ir.actions.act_window">
                                            <field name="name">Example</field>
                                            <field name="type">ir.actions.act_window</field>
                                            <field name="res_model">example.odoo</field>
                                            <field name="view_mode">kanban,tree,form,graph,pivot</field>
                                        </record>
                                        <menuitem id="example_menu"
                                                name="Example Odoo"
                                                action="action_Example"/>

Now we can define the ‘Gantt’ view for this model.

<record id="student_assignment_gantt" model="ir.ui.view">
                                                    <field name="name">model.example.view.gantt</field>
                                                    <field name="model">model.example</field>
                                                    <field name="arch" type="xml">
                                                        <gantt
                                                                date_start="create_date"
                                                                date_stop="date"
                                                                default_group_by="name"
                                                                default_scale="week"
                                                                color="student_id"
                                                                scales="day,week,month,year"
                                                                precision="{'day': 'hour:full', 'week': 'day:full', 'month': 'day:full', 'year': 'day:full'}"
                                                                thumbnails="{'employee_id': 'image_128'}">
                                                            <field name="student_id"/>
                                                            <templates>
                                                                <div t-name="gantt-popover" class="container-fluid">
                                                                    <div class="row no-gutters">
                                                                        <div class="col">
                                                                            <ul class="pl-1 mb-0">
                                                                                <li>
                                                                                    <strong>Start Date:</strong>
                                                                                    <t t-esc="userTimezoneStartDate.format('YYYY-MM-DD hh:mm:ss A')"/>
                                                                                </li>
                                                                                <li>
                                                                                    <strong>Stop Date:</strong>
                                                                                    <t t-esc="date.format('YYYY-MM-DD hh:mm:ss A')"/>
                                                                                </li>
                                                                            </ul>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </templates>
                                                        </gantt>
                                                    </field>
                                                </record>