[IMP] web: add RemainingDays field widget

This widget can be used on date and datetime fields. In readonly,
it displays the delta (in days) between the value of the field and
today. In edit, it behaves like a regular date(time) widget.

Part of task 2195254

1 files changed, 197 insertions, 0 deletions

diff --git a/addons/web/static/tests/fields/basic_fields_tests.js b/addons/web/static/tests/fields/basic_fields_tests.js
index 1f78efeb7f2..5f4c4eb8dcb 100644
--- a/addons/web/static/tests/fields/basic_fields_tests.js
+++ b/addons/web/static/tests/fields/basic_fields_tests.js
@@ -15,6 +15,8 @@ var testUtilsDom = require('web.test_utils_dom');
 var field_registry = require('web.field_registry');
 
 var createView = testUtils.createView;
+var patchDate = testUtils.mock.patchDate;
+
 var DebouncedField = basicFields.DebouncedField;
 var JournalDashboardGraph = basicFields.JournalDashboardGraph;
 var _t = core._t;
@@ -4193,6 +4195,201 @@ QUnit.module('basic_fields', {
         form.destroy();
     });
 
+    QUnit.module('RemainingDays');
+
+    QUnit.test('remaining_days widget on a date field in list view', async function (assert) {
+        assert.expect(16);
+
+        const unpatchDate = patchDate(2017, 9, 8, 15, 35, 11); // October 8 2017, 15:35:11
+        this.data.partner.records = [
+            { id: 1, date: '2017-10-08' }, // today
+            { id: 2, date: '2017-10-09' }, // tomorrow
+            { id: 3, date: '2017-10-07' }, // yesterday
+            { id: 4, date: '2017-10-10' }, // + 2 days
+            { id: 5, date: '2017-10-05' }, // - 3 days
+            { id: 6, date: '2018-02-08' }, // + 4 months (diff >= 100 days)
+            { id: 7, date: '2017-06-08' }, // - 4 months (diff >= 100 days)
+            { id: 8, date: false },
+        ];
+
+        const list = await createView({
+            View: ListView,
+            model: 'partner',
+            data: this.data,
+            arch: '<tree><field name="date" widget="remaining_days"/></tree>',
+        });
+
+        assert.strictEqual(list.$('.o_data_cell:nth(0)').text(), 'Today');
+        assert.strictEqual(list.$('.o_data_cell:nth(1)').text(), 'Tomorrow');
+        assert.strictEqual(list.$('.o_data_cell:nth(2)').text(), 'Yesterday');
+        assert.strictEqual(list.$('.o_data_cell:nth(3)').text(), 'In 2 days');
+        assert.strictEqual(list.$('.o_data_cell:nth(4)').text(), '3 days ago');
+        assert.strictEqual(list.$('.o_data_cell:nth(5)').text(), '02/08/2018');
+        assert.strictEqual(list.$('.o_data_cell:nth(6)').text(), '06/08/2017');
+        assert.strictEqual(list.$('.o_data_cell:nth(7)').text(), '');
+
+        assert.strictEqual(list.$('.o_data_cell:nth(0) .o_field_widget').attr('title'), '10/08/2017');
+
+        assert.hasClass(list.$('.o_data_cell:nth(0) span'), 'text-bf text-warning');
+        assert.doesNotHaveClass(list.$('.o_data_cell:nth(1) span'), 'text-bf text-warning text-danger');
+        assert.hasClass(list.$('.o_data_cell:nth(2) span'), 'text-bf text-danger');
+        assert.doesNotHaveClass(list.$('.o_data_cell:nth(3) span'), 'text-bf text-warning text-danger');
+        assert.hasClass(list.$('.o_data_cell:nth(4) span'), 'text-bf text-danger');
+        assert.doesNotHaveClass(list.$('.o_data_cell:nth(5) span'), 'text-bf text-warning text-danger');
+        assert.hasClass(list.$('.o_data_cell:nth(6) span'), 'text-bf text-danger');
+
+        list.destroy();
+        unpatchDate();
+    });
+
+    QUnit.test('remaining_days widget on a date field in form view', async function (assert) {
+        assert.expect(6);
+
+        const unpatchDate = patchDate(2017, 9, 8, 15, 35, 11); // October 8 2017, 15:35:11
+        this.data.partner.records = [
+            { id: 1, date: '2017-10-08' }, // today
+        ];
+
+        const form = await createView({
+            View: FormView,
+            model: 'partner',
+            data: this.data,
+            arch: '<form><field name="date" widget="remaining_days"/></form>',
+            res_id: 1,
+        });
+
+        assert.strictEqual(form.$('.o_field_widget').text(), 'Today');
+        assert.hasClass(form.$('.o_field_widget'), 'text-bf text-warning');
+
+        // in edit mode, this widget should behave like a regular date(time) widget
+        await testUtils.form.clickEdit(form);
+
+        assert.hasClass(form.$('.o_form_view'), 'o_form_editable');
+        assert.containsOnce(form, '.o_datepicker');
+        assert.strictEqual(form.$('.o_datepicker_input').val(), '10/08/2017');
+
+        await testUtils.dom.openDatepicker(form.$('.o_datepicker'));
+
+        assert.containsOnce(document.body, '.bootstrap-datetimepicker-widget:visible');
+
+        form.destroy();
+        unpatchDate();
+    });
+
+    QUnit.test('remaining_days widget on a datetime field in list view in UTC', async function (assert) {
+        assert.expect(16);
+
+        const unpatchDate = patchDate(2017, 9, 8, 15, 35, 11); // October 8 2017, 15:35:11
+        this.data.partner.records = [
+            { id: 1, datetime: '2017-10-08 20:00:00' }, // today
+            { id: 2, datetime: '2017-10-09 08:00:00' }, // tomorrow
+            { id: 3, datetime: '2017-10-07 18:00:00' }, // yesterday
+            { id: 4, datetime: '2017-10-10 22:00:00' }, // + 2 days
+            { id: 5, datetime: '2017-10-05 04:00:00' }, // - 3 days
+            { id: 6, datetime: '2018-02-08 04:00:00' }, // + 4 months (diff >= 100 days)
+            { id: 7, datetime: '2017-06-08 04:00:00' }, // - 4 months (diff >= 100 days)
+            { id: 6, datetime: false },
+        ];
+
+        const list = await createView({
+            View: ListView,
+            model: 'partner',
+            data: this.data,
+            arch: '<tree><field name="datetime" widget="remaining_days"/></tree>',
+            session: {
+                getTZOffset: () => 0,
+            },
+        });
+
+        assert.strictEqual(list.$('.o_data_cell:nth(0)').text(), 'Today');
+        assert.strictEqual(list.$('.o_data_cell:nth(1)').text(), 'Tomorrow');
+        assert.strictEqual(list.$('.o_data_cell:nth(2)').text(), 'Yesterday');
+        assert.strictEqual(list.$('.o_data_cell:nth(3)').text(), 'In 2 days');
+        assert.strictEqual(list.$('.o_data_cell:nth(4)').text(), '3 days ago');
+        assert.strictEqual(list.$('.o_data_cell:nth(5)').text(), '02/08/2018');
+        assert.strictEqual(list.$('.o_data_cell:nth(6)').text(), '06/08/2017');
+        assert.strictEqual(list.$('.o_data_cell:nth(7)').text(), '');
+
+        assert.strictEqual(list.$('.o_data_cell:nth(0) .o_field_widget').attr('title'), '10/08/2017');
+
+        assert.hasClass(list.$('.o_data_cell:nth(0) span'), 'text-bf text-warning');
+        assert.doesNotHaveClass(list.$('.o_data_cell:nth(1) span'), 'text-bf text-warning text-danger');
+        assert.hasClass(list.$('.o_data_cell:nth(2) span'), 'text-bf text-danger');
+        assert.doesNotHaveClass(list.$('.o_data_cell:nth(3) span'), 'text-bf text-warning text-danger');
+        assert.hasClass(list.$('.o_data_cell:nth(4) span'), 'text-bf text-danger');
+        assert.doesNotHaveClass(list.$('.o_data_cell:nth(5) span'), 'text-bf text-warning text-danger');
+        assert.hasClass(list.$('.o_data_cell:nth(6) span'), 'text-bf text-danger');
+
+        list.destroy();
+        unpatchDate();
+    });
+
+    QUnit.test('remaining_days widget on a datetime field in list view in UTC+6', async function (assert) {
+        assert.expect(6);
+
+        const unpatchDate = patchDate(2017, 9, 8, 15, 35, 11); // October 8 2017, 15:35:11, UTC+6
+        this.data.partner.records = [
+            { id: 1, datetime: '2017-10-08 20:00:00' }, // tomorrow
+            { id: 2, datetime: '2017-10-09 08:00:00' }, // tomorrow
+            { id: 3, datetime: '2017-10-07 18:30:00' }, // today
+            { id: 4, datetime: '2017-10-07 12:00:00' }, // yesterday
+            { id: 5, datetime: '2017-10-09 20:00:00' }, // + 2 days
+        ];
+
+        const list = await createView({
+            View: ListView,
+            model: 'partner',
+            data: this.data,
+            arch: '<tree><field name="datetime" widget="remaining_days"/></tree>',
+            session: {
+                getTZOffset: () => 360,
+            },
+        });
+
+        assert.strictEqual(list.$('.o_data_cell:nth(0)').text(), 'Tomorrow');
+        assert.strictEqual(list.$('.o_data_cell:nth(1)').text(), 'Tomorrow');
+        assert.strictEqual(list.$('.o_data_cell:nth(2)').text(), 'Today');
+        assert.strictEqual(list.$('.o_data_cell:nth(3)').text(), 'Yesterday');
+        assert.strictEqual(list.$('.o_data_cell:nth(4)').text(), 'In 2 days');
+
+        assert.strictEqual(list.$('.o_data_cell:nth(0) .o_field_widget').attr('title'), '10/09/2017');
+
+        list.destroy();
+        unpatchDate();
+    });
+
+    QUnit.test('remaining_days widget on a datetime field in list view in UTC-8', async function (assert) {
+        assert.expect(5);
+
+        const unpatchDate = patchDate(2017, 9, 8, 15, 35, 11); // October 8 2017, 15:35:11, UTC-8
+        this.data.partner.records = [
+            { id: 1, datetime: '2017-10-08 20:00:00' }, // today
+            { id: 2, datetime: '2017-10-09 07:00:00' }, // today
+            { id: 3, datetime: '2017-10-09 10:00:00' }, // tomorrow
+            { id: 4, datetime: '2017-10-08 06:00:00' }, // yesterday
+            { id: 5, datetime: '2017-10-07 02:00:00' }, // - 2 days
+        ];
+
+        const list = await createView({
+            View: ListView,
+            model: 'partner',
+            data: this.data,
+            arch: '<tree><field name="datetime" widget="remaining_days"/></tree>',
+            session: {
+                getTZOffset: () => -560,
+            },
+        });
+
+        assert.strictEqual(list.$('.o_data_cell:nth(0)').text(), 'Today');
+        assert.strictEqual(list.$('.o_data_cell:nth(1)').text(), 'Today');
+        assert.strictEqual(list.$('.o_data_cell:nth(2)').text(), 'Tomorrow');
+        assert.strictEqual(list.$('.o_data_cell:nth(3)').text(), 'Yesterday');
+        assert.strictEqual(list.$('.o_data_cell:nth(4)').text(), '2 days ago');
+
+        list.destroy();
+        unpatchDate();
+    });
+
     QUnit.module('FieldMonetary');
 
     QUnit.test('monetary field in form view', async function (assert) {