[Time Off] Accrual UX

addons/hr_holidays/static/src/components/days_in_month_selection/days_in_month_selection.js

@@ -0,0 +1,41 @@
+/** @odoo-module **/
+import { registry } from "@web/core/registry";
+import { SelectionField, selectionField } from "@web/views/fields/selection/selection_field";
+
+export class DaysInMonthSelection extends SelectionField {
+
+    static props = {
+        ...SelectionField.props,
+        monthField: { type: String, optional: true },
+    };
+
+    get options() {
+        const monthFieldName = this.props.monthField;
+        const monthValue = this.props.record.data[monthFieldName] ?? null;
+        const maxDay = this.getDaysRange(monthValue);
+        return [...Array(maxDay).keys()].map(i => [String(i + 1), String(i + 1)]);
+    }
+
+    getDaysRange(month) {
+        if (!month) return 31;
+        const luxonMonth = luxon.DateTime.fromObject({year: 2024, month: parseInt(month)}); //2024 is leap year - this will enforce 29 for February
+        return luxonMonth.isValid ? luxonMonth.daysInMonth : 31;
+    }
+
+    onChange(value) {
+        this.props.record.update({ [this.props.name]: value }, { save: this.props.autosave });
+    }
+}
+
+export const daysInMonthSelection = {
+    ...selectionField,
+    component: DaysInMonthSelection,
+    supportedTypes: ["selection", "integer"],
+    extractProps({ options, viewType }, dynamicInfo) {
+        const props = selectionField.extractProps(...arguments);
+        props.monthField = options.month;
+        return props;
+    },
+};
+
+registry.category("fields").add("daysInMonthSelection", daysInMonthSelection);

addons/hr_holidays/views/hr_leave_accrual_views.xml

@@ -46,7 +46,7 @@
                                 </span>
                                 <span name="yearly" invisible="frequency != 'yearly'">
                                     on the
-                                    <field nolabel="1" name="yearly_day" class="o_field_accrual" required="frequency == 'yearly'" placeholder="select a day"/>
+                                    <field nolabel="1" name="yearly_day" widget="daysInMonthSelection"  options="{'month': 'yearly_month'}" class="o_field_accrual" required="frequency == 'yearly'" placeholder="select a day"/>
                                     of
                                     <field nolabel="1" name="yearly_month" class="o_field_accrual" required="frequency == 'yearly'" placeholder="select a month"/>
                                 </span>
@@ -196,6 +196,8 @@
                                         <span id="carryover_custom_date">
                                             : the
                                             <field name="carryover_day" placeholder="select a day"
+                                                   class="o_field_accrual"
+                                                   widget="daysInMonthSelection"  options="{'month': 'carryover_month'}"
                                                    required="carryover_date == 'other'"/>
                                             of
                                             <field name="carryover_month" placeholder="select a month"