[IMP] event: improve kanban card display of events
Purpose ======= Improve design of the kanban cards in Events. Specifications ============== Have more useful information on the kanban record and removed redundant information * Display the location of the event * Remove the duration * Date should only be in the green block * Use the same links as before Task 2170831 PR #43173
This commit is contained in:
Debauche Stéphane
committed by
Thibault Delavallée
Thibault Delavallée
parent
ea6ab15d39
commit
9726e33654
@@ -9,7 +9,6 @@ from odoo.addons.base.models.res_partner import _tz_get
|
||||
from odoo.tools import format_datetime
|
||||
from odoo.exceptions import ValidationError
|
||||
from odoo.tools.translate import html_translate
|
||||
from odoo.tools.misc import _format_time_ago
|
||||
|
||||
_logger = logging.getLogger(__name__)
|
||||
|
||||
@@ -128,7 +127,6 @@ class EventEvent(models.Model):
|
||||
legend_blocked = fields.Char(related='stage_id.legend_blocked', string='Kanban Blocked Explanation', readonly=True)
|
||||
legend_done = fields.Char(related='stage_id.legend_done', string='Kanban Valid Explanation', readonly=True)
|
||||
legend_normal = fields.Char(related='stage_id.legend_normal', string='Kanban Ongoing Explanation', readonly=True)
|
||||
duration_str = fields.Char(compute='_compute_duration_str')
|
||||
# Seats and computation
|
||||
seats_max = fields.Integer(
|
||||
string='Maximum Attendees Number',
|
||||
@@ -265,11 +263,6 @@ class EventEvent(models.Model):
|
||||
end_tz = fields.Datetime.context_timestamp(event, event.date_end)
|
||||
event.is_one_day = (begin_tz.date() == end_tz.date())
|
||||
|
||||
@api.depends('date_begin', 'date_end')
|
||||
def _compute_duration_str(self):
|
||||
for event in self:
|
||||
event.duration_str = _format_time_ago(self.env, event.date_end - event.date_begin, add_direction=False)
|
||||
|
||||
@api.onchange('is_online')
|
||||
def _onchange_is_online(self):
|
||||
if self.is_online:
|
||||
|
||||
@@ -1,44 +1,27 @@
|
||||
.o_kanban_view.o_event_kanban_view {
|
||||
.o_kanban_record {
|
||||
position: relative;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
.o_kanban_record_title {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.o_event_left {
|
||||
flex: 1 1 25%;
|
||||
color: white;
|
||||
background-color: $o-brand-primary;
|
||||
padding: 8px;
|
||||
.o_day {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
.o_event_right {
|
||||
padding: 8px;
|
||||
margin-left: 8px;
|
||||
width: 70%;
|
||||
.o_kanban_content {
|
||||
min-height: 130px;
|
||||
|
||||
.o_event_stat {
|
||||
padding: 0;
|
||||
height: 35px;
|
||||
width: 60%;
|
||||
}
|
||||
.o_event_fontweight_500 {
|
||||
font-weight: 500;
|
||||
}
|
||||
.o_event_float_right {
|
||||
right: 8px;
|
||||
top: 40px;
|
||||
|
||||
.o_event_fontsize_09 {
|
||||
font-size: .9rem;
|
||||
}
|
||||
.o_event_bottom_right {
|
||||
width: 60px;
|
||||
right: 8px;
|
||||
bottom: 8px;
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.o_event_fontsize_11 {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.o_event_fontsize_20 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.o_event_fit_20 {
|
||||
height: 20px;
|
||||
object-fit: cover;
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -328,6 +328,7 @@
|
||||
<field name="arch" type="xml">
|
||||
<kanban class="o_event_kanban_view" default_group_by="stage_id" quick_create_view="event.event_event_view_form_quick_create">
|
||||
<field name="user_id"/>
|
||||
<field name="name"/>
|
||||
<field name="stage_id" options='{"group_by_tooltip": {"description": "Description"}}'/>
|
||||
<field name="address_id"/>
|
||||
<field name="date_begin"/>
|
||||
@@ -340,51 +341,49 @@
|
||||
<field name="legend_blocked"/>
|
||||
<field name="legend_normal"/>
|
||||
<field name="legend_done"/>
|
||||
<field name="duration_str"/>
|
||||
<field name="activity_ids"/>
|
||||
<field name="activity_state"/>
|
||||
<templates>
|
||||
<t t-name="kanban-box">
|
||||
<div t-attf-class="{{!selection_mode ? 'oe_kanban_color_' + kanban_getcolor(record.color.raw_value) : ''}} oe_kanban_card oe_kanban_global_click">
|
||||
<div class="o_event_left text-center">
|
||||
<div class="o_day"><t t-esc="record.date_begin.raw_value.getDate()"/></div>
|
||||
<div>
|
||||
<t t-esc="moment(record.date_begin.raw_value).format('MMM')"/>
|
||||
<t t-esc="record.date_begin.raw_value.getFullYear()"/>
|
||||
</div>
|
||||
<div><t t-esc="moment(record.date_begin.raw_value).format('LT')"/></div>
|
||||
</div>
|
||||
<div class="o_event_right d-flex flex-column justify-content-between">
|
||||
<div>
|
||||
<h1 class="o_kanban_record_title"><field name="name"/></h1>
|
||||
<p t-esc="record.address_id.value"/>
|
||||
</div>
|
||||
<div class="o_event_duration_str">Duration <field name="duration_str"/></div>
|
||||
<div class="o_event_stat text-left d-flex justify-content-between">
|
||||
<div class="text-left inline-block mr-2">
|
||||
<button
|
||||
type="action"
|
||||
class="btn btn-link p-0"
|
||||
name="%(event_registration_action_tree)d"
|
||||
t-esc="record.seats_expected.raw_value"/>
|
||||
<p>Expected</p>
|
||||
<div t-attf-class="p-0 {{!selection_mode ? 'oe_kanban_color_' + kanban_getcolor(record.color.raw_value) : ''}} oe_kanban_card oe_kanban_global_click">
|
||||
<div class="o_kanban_content p-0 m-0 position-relative row d-flex">
|
||||
<div class="col-3 bg-primary p-2 text-center d-flex flex-column justify-content-center">
|
||||
<div t-esc="record.date_begin.raw_value.getDate()" class="o_event_fontsize_20"/>
|
||||
<div>
|
||||
<t t-esc="moment(record.date_begin.raw_value).format('MMM')"/>
|
||||
<t t-esc="record.date_begin.raw_value.getFullYear()"/>
|
||||
</div>
|
||||
<div class="text-left inline-block">
|
||||
<button
|
||||
type="action"
|
||||
class="btn btn-link my-0 p-0"
|
||||
name="%(event_registration_action_tree)d"
|
||||
context="{'search_default_confirmed': True}"
|
||||
t-esc="record.seats_reserved.raw_value"/>
|
||||
<p>Confirmed</p>
|
||||
<div><t t-esc="moment(record.date_begin.raw_value).format('LT')"/></div>
|
||||
<div t-if="moment(record.date_begin.raw_value).dayOfYear() !== moment(record.date_end.raw_value).dayOfYear()">
|
||||
<i class="fa fa-arrow-right o_event_fontsize_09" title="End date"/>
|
||||
<t t-esc="moment(record.date_end.raw_value).format('D MMM')"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-9 py-2 px-3 d-flex flex-column justify-content-between pt-3">
|
||||
<div>
|
||||
<h4 class="o_event_fontweight_500 mb-0 o_text_overflow" t-att-title="record.name.value"><field name="name"/></h4>
|
||||
<div><i class="fa fa-map-marker" title="Location"/> <span class="o_text_overflow o_event_kanban_location" t-esc="record.address_id.value"/></div>
|
||||
</div>
|
||||
<h5 class="o_event_fontsize_11 p-0">
|
||||
<a name="%(act_event_registration_from_event)d" type="action">
|
||||
<t t-esc="record.seats_expected.raw_value"/> Expected attendees
|
||||
</a>
|
||||
<t t-set="total_seats" t-value="record.seats_reserved.raw_value + record.seats_used.raw_value"/>
|
||||
<t t-if="total_seats > 0 "><br/>
|
||||
<a name="%(event_event_action_pivot)d" type="action">
|
||||
<t t-esc="total_seats"/> Confirmed attendees
|
||||
</a>
|
||||
</t>
|
||||
</h5>
|
||||
<div class="text-right">
|
||||
<div class="float-left"><field name="activity_ids" widget="kanban_activity"/></div>
|
||||
<field name="kanban_state" widget="state_selection"/>
|
||||
<t t-set="unassigned"><t t-esc="_t('Unassigned')"/></t>
|
||||
<img class="oe_kanban_avatar o_event_fit_20 ml-2" t-att-src="kanban_image('res.users', 'image_128', record.user_id.raw_value)"
|
||||
t-att-title="record.user_id.value || unassigned" t-att-alt="record.user_id.value"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="o_event_bottom_right d-flex justify-content-between align-items-center position-absolute">
|
||||
<field name="activity_ids" widget="kanban_activity"/>
|
||||
<field name="kanban_state" widget="state_selection"/>
|
||||
<img t-att-src="kanban_image('res.users', 'image_128', record.user_id.raw_value)" t-att-title="record.user_id.value" t-att-alt="record.user_id.value"/>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</templates>
|
||||
|
||||
Reference in New Issue
Block a user