Chapter 6 - Odoo 15 Development Book

Gantt view

Gantt view is one of the advanced types of view in Odoo. Gantt view is only available in the enterprise version. To use the Gantt view in a custom module, we should have to install the “web_gantt” so that we should mention the module ‘web_gantt” in manifest.

Let’s take an example. So let us create a new model and its fields.

                            class StudentAssignment(models.Model):
   _name = 'student.assignment'
   student_id = fields.Many2one('school.student.record', string="Student")
   name = fields.Char(string='Name')
   date = fields.Date(string="Date")
   attachment = fields.Binary(string="Attachment")
                        

Now let’s create Gantt view of this model

                            <record id="student_assignment_gantt" model="ir.ui.view">
   <field name="name">student.assignment.view.gantt</field>
   <field name="model">student.assignment.gantt</field>
   <field name="arch" type="xml">
       <gantt
               date_start="create_date"
               date_stop="date"
               default_group_by="student_id"
               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>

The attributes used in the Gantt view are:

  • start_date: It is the starting time of the Gantt item. It must be a date or datetime field.
  • stop_date: It is the ending time of the Gantt item. It must be a date or datetime field.
  • default_group_by: It helps to group the records based on a field.
  • color: It helps to give color for the Gantt item based on a particular field.
  • progress: This attribute is used to indicate the progress of a Gantt item.
  • decoration: Decoration attributes are used to decide the color of a Gantt item based on conditions. It can be used like this: decoration-danger="state == 'lost'". Its other values are decoration-success, decoration-info, decoration-warning, and decoration-secondary.
  • scales: Use the scales attribute if you want to enable the Gantt view only for a few scales. For example, if you only want day and week scales, you can use scales="day,week".
  • edit: By default, Gantt view items are resizable and draggable, but if we want to disable it, we can use the edit="0" attribute.
WhatsApp