tarteo
6 years ago
13 changed files with 1129 additions and 734 deletions
-
86web_timeline/README.rst
-
6web_timeline/__manifest__.py
-
71web_timeline/readme/CONFIGURE.rst
-
6web_timeline/readme/CONTRIBUTORS.rst
-
4web_timeline/readme/CREDITS.rst
-
4web_timeline/readme/DESCRIPTION.rst
-
1web_timeline/readme/ROADMAP.rst
-
29web_timeline/readme/USAGE.rst
-
49web_timeline/static/src/js/timeline_canvas.js
-
62web_timeline/static/src/js/timeline_controller.js
-
13web_timeline/static/src/js/timeline_model.js
-
166web_timeline/static/src/js/timeline_renderer.js
-
14web_timeline/static/src/js/timeline_view.js
@ -0,0 +1,71 @@ |
|||||
|
You need to define a view with the tag <timeline> as base element. These are |
||||
|
the possible attributes for the tag: |
||||
|
|
||||
|
* date_start (required): it defines the name of the field of type date that |
||||
|
contains the start of the event. |
||||
|
* date_stop (optional): it defines the name of the field of type date that |
||||
|
contains the end of the event. The date_stop can be equal to the attribute |
||||
|
date_start to display events has 'point' on the Timeline (instantaneous event) |
||||
|
* date_delay (optional): it defines the name of the field of type float/integer |
||||
|
that contain the duration in hours of the event, default = 1 |
||||
|
* default_group_by (required): it defines the name of the field that will be |
||||
|
taken as default group by when accessing the view or when no other group by |
||||
|
is selected. |
||||
|
* zoomKey (optional): Specifies whether the Timeline is only zoomed when an |
||||
|
additional key is down. Available values are '' (does not apply), 'altKey', |
||||
|
'ctrlKey', or 'metaKey'. Set this option if you want to be able to use the |
||||
|
scroll to navigate vertically on views with a lot of events. |
||||
|
* mode (optional): Specifies the initial visible window. Available values are: |
||||
|
'day' to display the current day, 'week', 'month' and 'fit'. |
||||
|
Default value is 'fit' to adjust the visible window such that it fits all items |
||||
|
* event_open_popup (optional): when set to true, it allows to edit the events |
||||
|
in a popup. If not (default value), the record is edited changing to form |
||||
|
view. |
||||
|
* colors (optional): it allows to set certain specific colors if the expressed |
||||
|
condition (JS syntax) is met. |
||||
|
* dependency_arrow (optional): set this attribute to a x2many field to draw |
||||
|
arrows between the records referenced in the x2many field. |
||||
|
|
||||
|
Optionally you can declare a custom template, which will be used to render the |
||||
|
timeline items. You have to name the template 'timeline-item'. |
||||
|
These are the variables available in template rendering: |
||||
|
|
||||
|
* ``record``: to access the fields values selected in the timeline definition. |
||||
|
* ``field_utils``: used to format and parse values (see available functions in ``web.field_utils``). |
||||
|
|
||||
|
You also need to declare the view in an action window of the involved model. |
||||
|
|
||||
|
Example: |
||||
|
|
||||
|
.. code-block:: xml |
||||
|
|
||||
|
<?xml version="1.0" encoding="utf-8"?> |
||||
|
<odoo> |
||||
|
<record id="view_task_timeline" model="ir.ui.view"> |
||||
|
<field name="model">project.task</field> |
||||
|
<field name="type">timeline</field> |
||||
|
<field name="arch" type="xml"> |
||||
|
<timeline date_start="date_start" |
||||
|
date_stop="date_end" |
||||
|
string="Tasks" |
||||
|
default_group_by="user_id" |
||||
|
event_open_popup="true" |
||||
|
zoomKey="ctrlKey" |
||||
|
colors="#ec7063:user_id == false;#2ecb71:kanban_state=='done';" |
||||
|
dependency_arrow="task_dependency_ids"> |
||||
|
<field name="user_id"/> |
||||
|
<templates> |
||||
|
<div t-name="timeline-item"> |
||||
|
<div t-esc="record.display_name"/> |
||||
|
Assigned to: |
||||
|
<span t-esc="record.user_id[1]"/> |
||||
|
</div> |
||||
|
</templates> |
||||
|
</timeline> |
||||
|
</field> |
||||
|
</record> |
||||
|
|
||||
|
<record id="project.action_view_task" model="ir.actions.act_window"> |
||||
|
<field name="view_mode">kanban,tree,form,calendar,gantt,timeline,graph</field> |
||||
|
</record> |
||||
|
</odoo> |
||||
@ -0,0 +1,6 @@ |
|||||
|
* Laurent Mignon <laurent.mignon@acsone.eu> |
||||
|
* Adrien Peiffer <adrien.peiffer@acsone.eu> |
||||
|
* Pedro M. Baeza <pedro.baeza@tecnativa.com> |
||||
|
* Leonardo Donelli <donelli@webmonks.it> |
||||
|
* Adrien Didenot <adrien.didenot@horanet.com> |
||||
|
* Dennis Sluijk <d.sluijk@onestein.nl> |
||||
@ -0,0 +1,4 @@ |
|||||
|
Images |
||||
|
------ |
||||
|
|
||||
|
* Odoo Community Association: `Icon <https://github.com/OCA/maintainer-tools/blob/master/template/module/static/description/icon.svg>`_. |
||||
@ -0,0 +1,4 @@ |
|||||
|
Define a new view displaying events in an interactive visualization chart. |
||||
|
|
||||
|
The widget is based on the external library |
||||
|
http://visjs.org/timeline_examples.html |
||||
@ -0,0 +1 @@ |
|||||
|
* Implement a more efficient way of refreshing timeline after a record update. |
||||
@ -0,0 +1,29 @@ |
|||||
|
For accessing the timeline view, you have to click on the button with the clock |
||||
|
icon in the view switcher. The first time you access to it, the timeline window |
||||
|
is zoomed to fit all the current elements, the same as when you perform a |
||||
|
search, filter or group by operation. |
||||
|
|
||||
|
You can use the mouse scroll to zoom in or out in the timeline, and click on |
||||
|
any free area and drag for panning the view in that direction. |
||||
|
|
||||
|
The records of your model will be shown as rectangles whose widths are the |
||||
|
duration of the event according our definition. You can select them clicking |
||||
|
on this rectangle. You can also use Ctrl or Shift keys for adding discrete |
||||
|
or range selections. Selected records are hightlighted with a different color |
||||
|
(but the difference will be more noticeable depending on the background color). |
||||
|
Once selected, you can drag and move the selected records across the timeline. |
||||
|
|
||||
|
When a record is selected, a red cross button appears on the upper left corner |
||||
|
that allows to remove that record. This doesn't work for multiple records |
||||
|
although they were selected. |
||||
|
|
||||
|
Records are grouped in different blocks depending on the group by criteria |
||||
|
selected (if none is specified, then the default group by is applied). |
||||
|
Dragging a record from one block to another change the corresponding field to |
||||
|
the value that represents the block. You can also click on the group name to |
||||
|
edit the involved record directly. |
||||
|
|
||||
|
Double-click on the record to edit it. Double-click in open area to create a |
||||
|
new record with the group and start date linked to the area you clicked in. |
||||
|
By holding the Ctrl key and dragging left to right, you can create a new record |
||||
|
with the dragged start and end date. |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue