Skip to Content
Logo of RG Logo of RG
  • Home
  • Shop
  • Events
  • Courses
  • Company
    • News
    • Success Stories
  • Odoo Docs 19
  • Appointment
  • Jobs
  • Contact us
  • 0
  • 0
  • +1 555-555-5556
  • Sign in
Logo of RG Logo of RG
  • 0
  • 0
    • Home
    • Shop
    • Events
    • Courses
    • Company
      • News
      • Success Stories
    • Odoo Docs 19
    • Appointment
    • Jobs
    • Contact us
  • +1 555-555-5556
  • Sign in
Odoo Docs 19
Home Components Guides Classes Search
418 components
Forms
  • Account Json Checkboxes
  • Ace
  • Ace Field
  • Allowed Qweb Expressions
  • Attachment Image
  • Attachment Image Field
  • Badge
  • Badge Field
  • Badge Selection Field
  • Binary
  • Binary
  • Binary
  • Binary Field
  • Boolean
  • Boolean Favorite
  • Boolean Favorite Field
  • Boolean Field
  • Boolean Icon
  • Boolean Icon Field
  • Boolean Toggle
  • Boolean Toggle
  • boolean Toggle Field
  • calendar Properties Field
  • card Properties Field
  • Char
  • Char Field
  • Code
  • Code Ir Ui View
  • Color
  • Color Field
  • Color Picker
  • Color Picker Field
  • Contact Image
  • contact Image Field
  • Contact Statistics
  • Contact Statistics Field
  • Copyclipboardbutton
  • copy Clipboard Button Field
  • Copyclipboardchar
  • copy Clipboard Char Field
  • Copyclipboardurl
  • copy Clipboard URL Field
  • Dashboard Graph
  • date Field
  • date Range Field
  • Date Time Field
  • Domain
  • Domain Field
  • Dynamic Placeholder Popover
  • Email
  • Email
  • Email Field
  • Field Selector
  • Field Selector Field
  • File Uploader
  • Filterable Selection
  • filterable Selection Field
  • Float
  • Float Factor
  • float Factor Field
  • Float Field
  • Float Time
  • Float Time Field
  • Float Toggle
  • Float Toggle Field
  • form Email Field
  • form Phone Field
  • form Url Field
  • Gauge
  • Gauge Field
  • Google Slide Viewer
  • Handle
  • Handle Field
  • Html
  • html Field
  • Iframe Wrapper
  • Iframe Wrapper Field
  • Image
  • Image Field
  • Image Url
  • Image Url Field
  • Integer
  • Integer Field
  • ir Ui View Ace Field
  • Journal Dashboard Graph Field
  • Json
  • Json Checkboxes
  • Json Field
  • Kanban Color Picker
  • kanban Color Picker Field
  • kanban Many2 Many Tags Avatar Field
  • kanban Many2 Many Tags Field
  • Kanban Many2 One
  • Kanban Many2 One Avatar Field
  • kanban Progress Bar Field
  • Label Selection
  • Label Selection Field
  • list Badge Selection Field
  • list Binary Field
  • list Boolean Toggle Field
  • list Date Field
  • list Date Range Field
  • list Date Time Field
  • list Many2 Many Tags Avatar Field
  • list Text Field
  • List X2 Many Field
  • Many2many
  • Many2many
  • Many2many
  • Many2many Binary
  • Many2 Many Binary Field
  • Many2many Checkboxes
  • Many2 Many Checkboxes Field
  • Many2many Tags
  • Many2many Tags
  • Many2many Tags
  • Many2many Tags Avatar
  • Many2many Tags Avatar
  • Many2many Tags Avatar
  • many2 Many Tags Avatar Field
  • Many2many Tags Avatar Popover
  • Many2 Many Tags Field
  • Many2 One
  • Many2one
  • Many2one Avatar
  • Many2one Avatar
  • Many2 One Avatar Field
  • Many2one Barcode
  • Many2 One Barcode Field
  • Many2 One Field
  • Many2one Reference
  • Many2 One Reference Field
  • Many2one Reference Integer
  • Many2 X Autocomplete
  • Monetary
  • Monetary Field
  • One2many
  • One2many
  • One2many
  • Pdf Viewer
  • Pdf Viewer Field
  • Percentage
  • Percentage Field
  • Percentpie
  • Percent Pie Field
  • Phone
  • Phone
  • Phone Field
  • Priority
  • Priority Field
  • Profiling Qweb View
  • Progressbar
  • Progressbar
  • Progress Bar Field
  • Properties
  • Properties
  • Properties
  • Properties
  • Properties Field
  • Property Definition
  • Property Definition Selection
  • Property Tags
  • Property Tags Field
  • Property Text
  • Property Value
  • Radio
  • Radio
  • Radio Field
  • Reference
  • Reference Field
  • Remaining Days
  • Remaining Days Field
  • Res User Group Ids
  • Res User Group Ids Privilege
  • Selection
  • Selection Badge
  • Selection Badge
  • Selection Badge With Filter
  • Selection Field
  • settings Radio Field
  • Signature Field
  • State Selection
  • State Selection Field
  • Statinfo
  • Stat Info Field
  • Statusbar
  • Status Bar Field
  • Text
  • Text
  • Text Field
  • Timezone Mismatch
  • timezone Mismatch Field
  • Translation Button
  • Translation Dialog
  • Upgrade Boolean
  • upgrade Boolean Field
  • Upgrade Dialog
  • Url
  • Url
  • Url Field
  • X2 Many Field
  • X2 Many Field Dialog
  1. Components
  2. Remaining Days
fields forms

Remaining Days

Odoo 19 fields — Remaining Days (views)

Live preview Interactive
Source excerpt web/static/src/views/fields/remaining_days/remaining_days_field.js
import { Component } from "@odoo/owl";
import { evaluateExpr } from "@web/core/py_js/py";
import { getClassNameFromDecoration } from "@web/views/utils";
import { _t } from "@web/core/l10n/translation";
import { registry } from "@web/core/registry";
import { DateTimeField } from "../datetime/datetime_field";
import { standardFieldProps } from "../standard_field_props";
import { capitalize } from "@web/core/utils/strings";
import { formatDate } from "../formatters";

const { DateTime } = luxon;

export class RemainingDaysField extends Component {
    static components = { DateTimeField };

    static props = {
        ...standardFieldProps,
        classes: { type: Object, optional: true },
    };

    static defaultProps = {
        classes: {
            bf: "days <= 0",
            danger: "days < 0",
            warning: "days == 0",
        },
    };

    static template = "web.RemainingDaysField";

    get diffDays() {
        const { record, name } = this.props;
        const value = record.data[name];
        if (!value) {
            return null;
        }
        const today = DateTime.local().startOf("day");
        const diff = value.startOf("day").diff(today, "days");
        return Math.floor(diff.days);
    }

    get diffString() {
        if (this.diffDays === null) {
            return "";
        }
        if (Math.abs(this.diffDays) > 99) {
            return this.formattedValue;
        }
        const { record, name } = this.props;
        const value = record.data[name];
        return capitalize(value.toRelativeCalendar());
    }

    get formattedValue() {
        const { record, name } = this.props;
        return formatDate(record.data[name]);
    }

    get numericValue() {
        const { record, name } = this.props;
        return formatDate(record.data[name], { numeric: true });
    }

    get classNames() {
        if (this.diffDays === null) {
            return null;
        }
        if (!this.props.record.isActive) {
            return null;
        }
        const classNames = {};
        const evalContext = { days: this.diffDays, record: this.props.record.evalContext };
        for (const decoration in this.props.classes) {
            const value = evaluateExpr(this.props.classes[decoration], evalContext);
            classNames[getClassNameFromDecoration(decoration)] = value;
        }
        return classNames;
    }

    get dateTimeFieldProps() {
        return Object.fromEntries(
            Object.entries(this.props).filter(([key]) => standardFieldProps[key])
        );
    }
}

export const remainingDaysField = {
    component: RemainingDaysField,
    displayName: _t("Remaining Days"),
    supportedTypes: ["date", "datetime"],
    extractProps: ({ options }) => ({
        classes: options.classes,
    }),
};

registry.category("fields").add("remaining_days", remainingDaysField);
Registry / API
Registry name
remaining_days
Category
fields
Module
web
Slug
remaining-days
Nav group
forms
Follow us

250 Executive Park Blvd, Suite 3400
San Francisco CA 94134

  • +1 555-555-5556
  • info@yourcompany.example.com
Copyright © Company name
Powered by Odoo - The #1 Open Source eCommerce