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

[FIX] web: DateTimePicker focus when programmatically changing month

Browse Source 
When passing a date out of the current as a props to the DateTimePicker
component, the chosen date is actually set but the calendar doesn't
rerender to display the corresponding month.

This commit fixes this behavior to properly focus the date's month.

closes odoo/odoo#134844

X-original-commit: 9dbb35479615f5aef7b22f21bf9f58f176874886
Signed-off-by: Julien Mougenot (jum) <jum@odoo.com>
Signed-off-by: Pierre Paridans (app) <app@odoo.com>
This commit is contained in:
Pierre Paridans
2023-09-08 13:45:42 +00:00
parent 640a11a56e
commit 915454bfaa
2 changed files with 56 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web/static/src/core/datetime/datetime_picker.js
+1
View File
@@ -412,6 +412,7 @@ export class DateTimePicker extends Component {
this.state.timeValues[props.focusedDateIndex] = timeValues[props.focusedDateIndex];
}
this.shouldAdjustFocusDate = !props.range;
this.adjustFocus(this.values, props.focusedDateIndex);
this.handle12HourSystem();
this.state.timeValues = this.state.timeValues.map((timeValue) => timeValue.map(String));
addons/web/static/tests/core/datetime/datetime_picker_tests.js
+55
View File
@@ -13,6 +13,8 @@ import {
getTimePickers,
useTwelveHourClockFormat,
} from "./datetime_test_helpers";
import { Component, useState, xml } from "@odoo/owl";
import { nextTick } from "../../helpers/utils";
const { DateTime } = luxon;
@@ -1145,4 +1147,57 @@ QUnit.module("Components", ({ beforeEach }) => {
assert.verifySteps(["2023-04-20T08:43:00,2023-04-27T17:16:00"]);
});
QUnit.test("focus proper month when changing props out of current month", async (assert) => {
class Parent extends Component {
static template = xml`<DateTimePicker value="state.current"/>`;
static components = { DateTimePicker };
setup() {
this.state = useState({
current: DateTime.now(),
})
}
}
const parent = await mount(Parent, getFixture(), { env });
assertDateTimePicker({
title: "April 2023",
date: [
{
cells: [
[-26, -27, -28, -29, -30, -31, 1],
[2, 3, 4, 5, 6, 7, 8],
[9, 10, 11, 12, 13, 14, 15],
[16, 17, 18, 19, 20, 21, 22],
[23, 24, ["25"], 26, 27, 28, 29],
[30, -1, -2, -3, -4, -5, -6],
],
daysOfWeek: ["#", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
},
],
time: [[13, 45]],
});
parent.state.current = DateTime.fromObject({ month: 5, day: 1, hour: 17, minute: 16 });
await nextTick();
assertDateTimePicker({
title: "May 2023",
date: [
{
cells: [
[-30, [1], 2, 3, 4, 5, 6],
[7, 8, 9, 10, 11, 12, 13],
[14, 15, 16, 17, 18, 19, 20],
[21, 22, 23, 24, 25, 26, 27],
[28, 29, 30, 31, -1, -2, -3],
[-4, -5, -6, -7, -8, -9, -10],
],
daysOfWeek: ["#", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
},
],
time: [[17, 0]],
});
});
});