pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] web: form: checkbox with optional field on mobile

Browse Source 
This PR adds a class to be able to show/hide
other fields depending on a checkbox status.

This class is needed to have this behavior on desktop but also
on mobile.

We can now fix some alignment issues encountered on mobile.

Related task-ID: 1929043

closes odoo/odoo#66153

Related: odoo/enterprise#16345
Signed-off-by: Pierre Paridans <pparidans@users.noreply.github.com>
This commit is contained in:
Odoo's Mergebot
2021-02-16 12:01:03 +01:00
committed by GitHub
parent 21e2676b7a 0aa8a2be7f
commit 38e8895249
5 changed files with 48 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/event/views/event_views.xml
+2 -2
View File
@@ -241,8 +241,8 @@
<field name="address_id"
context="{'show_address': 1}"
options='{"always_reload": True}'/>
<label for="seats_limited" string="Limit Registrations"/>
<div>
<div colspan="2" class="o_checkbox_optional_field">
<label for="seats_limited" string="Limit Registrations"/>
<field name="seats_limited"/>
<span attrs="{'invisible': [('seats_limited', '=', False)], 'required': [('seats_limited', '=', False)]}">to <field name="seats_max" class="oe_inline"/> Attendees</span>
</div>
addons/purchase/views/res_partner_views.xml
+2 -2
View File
@@ -8,8 +8,8 @@
<field name="priority">36</field>
<field name="arch" type="xml">
<group name="purchase" position="inside">
<label for="receipt_reminder_email" groups='purchase.group_send_reminder'/>
<div name="receipt_reminder" class="o_row" groups='purchase.group_send_reminder'>
<div name="receipt_reminder" colspan="2" class="o_checkbox_optional_field" groups='purchase.group_send_reminder'>
<label for="receipt_reminder_email"/>
<field name="receipt_reminder_email"/>
<div attrs="{'invisible': [('receipt_reminder_email', '=', False)]}">
<field name="reminder_date_before_receipt" class="oe_inline"/>
addons/survey/views/survey_survey_views.xml
+11 -7
View File
@@ -89,10 +89,12 @@
<field name="questions_layout" widget="radio"
attrs="{'readonly': [('session_state', 'in', ['ready', 'in_progress'])]}"/>
<field name="progression_mode" widget="radio" />
<label for="is_time_limited" string="Survey Time Limit"/>
<div>
<div colspan="2" class="o_checkbox_optional_field">
<label for="is_time_limited" string="Survey Time Limit"/>
<field name="is_time_limited" nolabel="1"/>
<field name="time_limit" widget="float_time" attrs="{'invisible': [('is_time_limited', '=', False)]}" nolabel="1" class="oe_inline" /> <span attrs="{'invisible': [('is_time_limited', '=', False)]}"> minutes</span>
<div attrs="{'invisible': [('is_time_limited', '=', False)]}">
<field name="time_limit" widget="float_time" nolabel="1" class="oe_inline"/> minutes
</div>
</div>
<field name="questions_selection" widget="radio" />
<field name="users_can_go_back" string="Back Button" attrs="{'invisible': [('questions_layout', '=', 'one_page')]}"/>
@@ -100,11 +102,13 @@
<group string="Candidates" name="candidates">
<field name="access_mode"/>
<field name="users_login_required"/>
<label for="is_attempts_limited" string="Attempts Limit"
attrs="{'invisible': ['|', ('has_conditional_questions', '=', True), '&amp;', ('access_mode', '=', 'public'), ('users_login_required', '=', False)]}"/>
<div attrs="{'invisible': ['|', ('has_conditional_questions', '=', True), '&amp;', ('access_mode', '=', 'public'), ('users_login_required', '=', False)]}">
<div colspan="2" class="o_checkbox_optional_field"
attrs="{'invisible': ['|', ('has_conditional_questions', '=', True), '&amp;', ('access_mode', '=', 'public'), ('users_login_required', '=', False)]}">
<label for="is_attempts_limited" string="Attempts Limit"/>
<field name="is_attempts_limited" nolabel="1"/>
<field name="attempts_limit" attrs="{'invisible': [('is_attempts_limited', '=', False)]}" nolabel="1" class="oe_inline" /> <span attrs="{'invisible': [('is_attempts_limited', '=', False)]}"> attempts</span>
<div attrs="{'invisible': [('is_attempts_limited', '=', False)]}">
<field name="attempts_limit" nolabel="1" class="oe_inline"/> attempts
</div>
</div>
</group>
<group string="Scoring" name="scoring">
addons/web/static/src/scss/form_view.scss
+25 -6
View File
@@ -23,12 +23,18 @@
margin-right: -$o-horizontal-padding*2;
}
}
@mixin o-form-nosheet-negative-margin {
margin-left: -$o-horizontal-padding;
margin-right: -$o-horizontal-padding;
}
@mixin o-td-label-style {
width: 0%;
padding: 0 15px 0 0;
min-width: 150px;
}
$o-form-label-margin-right: 0px;
.o_form_view {
background-color: $o-view-background-color;
@@ -546,9 +552,7 @@
> tbody > tr > td {
&.o_td_label {
width: 0%;
padding: 0 15px 0 0;
min-width: 150px;
@include o-td-label-style;
}
vertical-align: top;
@@ -590,7 +594,22 @@
.o_td_label .o_form_label {
font-weight: bold;
margin-right: 0px;
margin-right: $o-form-label-margin-right;
}
}
.o_checkbox_optional_field {
display: flex;
@include media-breakpoint-down(sm) {
flex-wrap: wrap;
justify-content: space-between;
}
> .o_form_label {
@include o-td-label-style;
margin-right: $o-form-label-margin-right;
font-weight: bold;
}
}
@@ -630,7 +649,7 @@
margin-bottom: 0px;
}
}
td.o_td_label .o_form_label:not(.o_status) {
.o_td_label .o_form_label:not(.o_status), .o_checkbox_optional_field > .o_form_label {
min-height: 33px;
}
td:not(.o_field_cell) .o_form_uri > span:first-child {
addons/web/static/src/scss/form_view_extra.scss
+8 -2
View File
@@ -1,3 +1,5 @@
$o-td-label-padding-right: 8px;
.o_form_view {
$sheet-min-width: 650px;
$sheet-padding: 16px;
@@ -60,12 +62,16 @@
// Groups
.o_group {
.o_td_label {
.o_td_label, .o_checkbox_optional_field > .o_form_label {
border-right: 1px solid #ddd;
}
.o_td_label + td {
padding: 0px 36px 0px 8px;
padding: 0px 36px 0px $o-td-label-padding-right;
}
.o_checkbox_optional_field > .o_form_label {
margin-right: $o-td-label-padding-right;
}
.o_field_widget.o_text_overflow {
width: 1px!important; // hack to make the table layout believe it is a small element (so that the table does not grow too much) ...
min-width: 100%; // ... but in fact it takes the whole table space