diff options
| author | qsm-odoo <qsm@odoo.com> | 2017-04-19 18:06:12 +0200 |
|---|---|---|
| committer | qsm-odoo <qsm@odoo.com> | 2017-05-04 12:07:30 +0200 |
| commit | 250e716c3a12e88acb4a199b427dc47d4ec55d5d (patch) | |
| tree | 0be849fd0af8d54f556af5f1274e641200ec82ef /addons/web/static/src/js/fields/relational_fields.js | |
| parent | 8943aae665ea906aa03bc30cada884c571738b7c (diff) | |
[REF] web, *: restore views design
Since the new views merge, a lot of design elements were broken. This
was particularly impacting the fields in the editable list view; indeed
the editable list view is not using an inline form view anymore so the
fields in the list were not properly styled as the LESS was still
defined assuming the form view environment (for example the invalid
fields were red for o2m fields in form view but not in editable list
view even though they got the right CSS class).
This commit refactor the LESS following these rules:
- No more division of non-layout and layout rules. Dividing LESS rules
in x_layout.less and x.less was a mistake. Many rules can be
considered to be layout and not layout at the same time, developers
always have to switch from one file part to the other, many CSS
selectors (and rules!) are duplicated for nothing, ...
- Field style is extracted from x_view.less and put in the new
fields.less file. As before, the fields_extra.less will contain the
rules specific to community so that the enterprise repo can override
those by replacing the whole file.
- Many classes have been renamed so that o_form_x_y becomes o_x_y as
many classes can now be applied outside of form view. These classes
should not be used in templates anyway.
The commit also changes the DOM of fields so that it is more minimalist
(no useless parent div, etc).
Input elements are not automatically styled anymore, they have to get
the o_input class explicitely. This allows to fix lots of small style
bugs of previous versions (required monetary field had not the proper
style, readonly m2m tags appeared as editable, ...). This also improves
the LESS code.
The editable list view should also completely stop flickering on chrome
and firefox.
The commit also removes the orange outline on list view dirty cells.
The commit also removes deprecated static xml, LESS and other code.
Notice there are still styles to restore/fix and LESS to improve.
Diffstat (limited to 'addons/web/static/src/js/fields/relational_fields.js')
| -rw-r--r-- | addons/web/static/src/js/fields/relational_fields.js | 37 |
1 files changed, 24 insertions, 13 deletions
diff --git a/addons/web/static/src/js/fields/relational_fields.js b/addons/web/static/src/js/fields/relational_fields.js index 28d790b16c4..d7e65f5c4bf 100644 --- a/addons/web/static/src/js/fields/relational_fields.js +++ b/addons/web/static/src/js/fields/relational_fields.js @@ -81,9 +81,9 @@ var FieldMany2One = AbstractField.extend({ 'search_create_popup': '_onSearchCreatePopup', }, events: _.extend({}, AbstractField.prototype.events, { - 'click .o_form_input': '_onInputClick', - 'focusout .o_form_input': '_onInputFocusout', - 'keyup .o_form_input': '_onInputKeyup', + 'click input': '_onInputClick', + 'focusout input': '_onInputFocusout', + 'keyup input': '_onInputKeyup', 'click .o_external_button': '_onExternalButtonClick', 'click': '_onClick', }), @@ -106,7 +106,7 @@ var FieldMany2One = AbstractField.extend({ // what is 'this.floating' for? add a comment! this.floating = false; - this.$input = this.$('.o_form_input'); + this.$input = this.$('input'); this.$external_button = this.$('.o_external_button'); return this._super.apply(this, arguments); }, @@ -713,7 +713,7 @@ var FieldX2Many = AbstractField.extend({ onFailure: def.reject.bind(def), }); } else { - self.renderer.setRowMode(recordID, 'readonly', true); + self.renderer.setRowMode(recordID, 'readonly'); def.resolve(); } }); @@ -819,7 +819,7 @@ var FieldX2Many = AbstractField.extend({ }); var FieldOne2Many = FieldX2Many.extend({ - className: 'o_form_field_one2many', + className: 'o_field_one2many', supportedFieldTypes: ['one2many'], //-------------------------------------------------------------------------- @@ -937,7 +937,7 @@ var FieldOne2Many = FieldX2Many.extend({ }); var FieldMany2Many = FieldX2Many.extend({ - className: 'o_form_field_many2many', + className: 'o_field_many2many', supportedFieldTypes: ['many2many'], /** @@ -1019,7 +1019,7 @@ var FieldMany2ManyBinaryMultiFiles = AbstractField.extend({ events: { 'click .o_attach': '_onAttach', 'click .oe_delete': '_onDelete', - 'change .o_form_input_file': '_onFileChanged', + 'change .o_input_file': '_onFileChanged', }, /** * @constructor @@ -1102,7 +1102,7 @@ var FieldMany2ManyBinaryMultiFiles = AbstractField.extend({ _onAttach: function () { // This widget uses a hidden form to upload files. Clicking on 'Attach' // will simulate a click on the related input. - this.$('.o_form_input_file').click(); + this.$('.o_input_file').click(); }, /** * @private @@ -1196,7 +1196,7 @@ var FieldMany2ManyBinaryMultiFiles = AbstractField.extend({ var FieldMany2ManyTags = AbstractField.extend({ tag_template: "FieldMany2ManyTag", - className: "o_form_field o_form_field_many2manytags", + className: "o_field_many2manytags", supportedFieldTypes: ['many2many'], custom_events: { field_changed: '_onFieldChanged', @@ -1204,13 +1204,24 @@ var FieldMany2ManyTags = AbstractField.extend({ }, events: _.extend({}, AbstractField.prototype.events, { 'click .o_delete': '_onDeleteTag', - 'keydown .o_form_field_many2one input': '_onKeyDown', + 'keydown .o_field_many2one input': '_onKeyDown', }), fieldsToFetch: { color: {type: 'integer'}, display_name: {type: 'char'}, }, + /** + * @constructor + */ + init: function () { + this._super.apply(this, arguments); + + if (this.mode === 'edit') { + this.className += ' o_input'; + } + }, + //-------------------------------------------------------------------------- // Public //-------------------------------------------------------------------------- @@ -1310,7 +1321,7 @@ var FieldMany2ManyTags = AbstractField.extend({ this.many2one._getSearchBlacklist = function () { return self.value.res_ids; }; - this.many2one.appendTo(this.$el); + return this.many2one.appendTo(this.$el); }, /** * @private @@ -1445,7 +1456,7 @@ var FormFieldMany2ManyTags = FieldMany2ManyTags.extend({ var KanbanFieldMany2ManyTags = FieldMany2ManyTags.extend({ _render: function () { var self = this; - this.$el.addClass('o_form_field_many2manytags o_kanban_tags'); + this.$el.addClass('o_field_many2manytags o_kanban_tags'); _.each(this.value.data, function (m2m) { // 10th color is invisible if ('color' in m2m.data && m2m.data.color !== 10) { |
