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

[FIX] web: status indicator next to the breadcrumb

Browse Source 
Before this fix, the '.o_form_status_indicator' was in the right
part of the control panel.
But on desktop, we want it next to the last breadcrumb item
to cognitively attach the "save status" to the record name.

closes odoo/odoo#107397

Task-id: 3067691
X-original-commit: 24b098767b03c97ffe108a7f8aa0f77c08aecef5
Signed-off-by: Pierre Paridans (app) <app@odoo.com>
Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com>
This commit is contained in:
Adrien Dieudonné
2022-12-07 18:29:33 +01:00
committed by Adrien Dieudonne
parent ba9a84e532
commit 94cb7ba07d
8 changed files with 31 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web/static/src/scss/primary_variables.scss
+2
View File
@@ -163,6 +163,8 @@ $o-base-settings-mobile-tabs-overflow-gap: 3% !default;
$o-cp-breadcrumb-height: 30px !default;
$o-cp-button-sm-no-border-padding: 0.4rem;
$o-datepicker-week-color: #8f8f8f !default;
$o-card-body-bg-opacity: 0.9 !default;
addons/web/static/src/search/control_panel/control_panel.scss
+15 -7
View File
@@ -80,7 +80,7 @@
.breadcrumb {
font-size: 18px;
max-width: 100%;
min-width: 0;
> li {
@include o-text-overflow();
@@ -114,7 +114,7 @@
}
&.btn {
padding: 0.4rem;
padding: $o-cp-button-sm-no-border-padding;
}
> a {
@@ -192,11 +192,19 @@
.o_cp_bottom_right {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: flex-start;
column-gap: $o-horizontal-padding;
@include media-breakpoint-down(md) {
align-items: center;
justify-content: space-between;
align-items: center;
@include media-breakpoint-up(md) {
column-gap: $o-horizontal-padding;
}
> .o_form_status_indicator {
@include media-breakpoint-down(md) {
.o_form_status_indicator_buttons > .btn {
padding: $o-cp-button-sm-no-border-padding;
}
}
}
> .o_cp_pager {
addons/web/static/src/search/control_panel/control_panel.xml
+3 -2
View File
@@ -180,9 +180,10 @@
<em t-else="" class="text-warning">Unnamed</em>
</a>
</li>
<li t-else="" class="breadcrumb-item active">
<t t-if="breadcrumb.name" t-esc="breadcrumb.name"/>
<li t-else="" class="breadcrumb-item active d-flex align-items-center">
<span class="text-truncate" t-if="breadcrumb.name" t-esc="breadcrumb.name"/>
<em t-else="" class="text-warning">Unnamed</em>
<t t-slot="control-panel-status-indicator" />
</li>
</t>
</ol>
addons/web/static/src/views/form/control_panel/form_control_panel.xml
+3 -1
View File
@@ -17,7 +17,9 @@
</t>
</div>
<div class="o_cp_bottom_right w-auto flex-shrink-0">
<t t-slot="control-panel-status-indicator" />
<t t-if="env.isSmall">
<t t-slot="control-panel-status-indicator" />
</t>
<t t-slot="control-panel-action-menu" t-if="display['bottom-left']"/>
<div t-if="pagerProps and pagerProps.total > 0" class="o_cp_pager" role="search">
<Pager t-props="pagerProps"/>
addons/web/static/src/views/form/form_controller.xml
-1
View File
@@ -25,7 +25,6 @@
onActionExecuted="() => model.load({ resId: model.root.resId, resIds: model.root.resIds })"
shouldExecuteAction.bind="shouldExecuteAction"
/>
<span class="border-start d-none d-md-inline-block"/>
</t>
</t>
<t t-set-slot="control-panel-status-indicator">
addons/web/static/src/views/form/form_status_indicator/form_status_indicator.xml
+3 -3
View File
@@ -2,11 +2,11 @@
<templates xml:space="preserve">
<t t-name="web.FormStatusIndicator" owl="1">
<div class="o_form_status_indicator" t-att-class="{ o_form_status_indicator_new_record: props.model.root.isVirtual }">
<div class="o_form_status_indicator ms-md-1" t-att-class="{ o_form_status_indicator_new_record: props.model.root.isVirtual }">
<div class="o_form_status_indicator_buttons d-flex" t-att-class="{ invisible: !(props.model.root.isVirtual or displayButtons) }">
<button
type="button"
class="o_form_button_save btn btn-light"
class="o_form_button_save btn btn-light py-0"
t-att-disabled="props.isDisabled"
data-hotkey="s"
t-on-click.stop="save"
@@ -16,7 +16,7 @@
</button>
<button
type="button"
class="o_form_button_cancel btn btn-light"
class="o_form_button_cancel btn btn-light py-0"
t-att-disabled="props.isDisabled"
data-hotkey="j"
t-on-click.stop="discard"
addons/web/static/src/webclient/settings_form_view/settings_form_view.xml
+1
View File
@@ -16,6 +16,7 @@
</div>
</t>
</xpath>
<xpath expr="//Layout/t[@t-set-slot='control-panel-status-indicator']" position="replace"/>
<xpath expr="//Layout/t[@t-component='props.Renderer']" position="attributes">
<attribute name="initialApp">initialApp</attribute>
</xpath>
addons/web/static/tests/views/form/form_view_tests.js
+4 -2
View File
@@ -4916,7 +4916,8 @@ QUnit.module("Views", (hooks) => {
await editInput(target, ".o_field_widget[name=foo] input", "");
await click(target.querySelector(".o_pager_next"));
assert.strictEqual(target.querySelector(".breadcrumb").innerText, "first record");
assert.strictEqual(target.querySelector(".breadcrumb-item > span").innerText, "first record");
assert.strictEqual(target.querySelector(".breadcrumb-item > .o_form_status_indicator").innerText.trim(), "Unable to save");
assert.strictEqual(target.querySelector(".o_pager_value").textContent, "1");
assert.strictEqual(target.querySelector(".o_pager_limit").textContent, "2");
assert.hasClass(target.querySelector(".o_field_widget[name=foo]"), "o_field_invalid");
@@ -4946,7 +4947,8 @@ QUnit.module("Views", (hooks) => {
await editInput(target, ".o_field_widget[name=foo] input", "");
triggerHotkey("alt+n");
await nextTick();
assert.strictEqual(target.querySelector(".breadcrumb").innerText, "first record");
assert.strictEqual(target.querySelector(".breadcrumb-item > span").innerText, "first record");
assert.strictEqual(target.querySelector(".breadcrumb-item > .o_form_status_indicator").innerText.trim(), "Unable to save");
assert.strictEqual(target.querySelector(".o_pager_value").textContent, "1");
assert.strictEqual(target.querySelector(".o_pager_limit").textContent, "2");
assert.hasClass(target.querySelector(".o_field_widget[name=foo]"), "o_field_invalid");