mirror of
https://github.com/NaN-tic/sao-base.git
synced 2023-12-14 03:13:01 +01:00
Move button inside input and improve editable widgets
review9821002
This commit is contained in:
C?dric Krier
parent
888edbdc18
commit
02e7a10678
56
src/sao.less
56
src/sao.less
|
|
@ -88,6 +88,12 @@ body {
|
|||
height: 2em;
|
||||
}
|
||||
}
|
||||
& .editabletree-char, .editabletree-date, .editabletree-datetime,
|
||||
.editabletree-integer, .editabletree-float, .editabletree-selection,
|
||||
.editabletree-float_time, .editabletree-boolean, .editabletree-many2one,
|
||||
.editabletree-one2many {
|
||||
width: 100%;
|
||||
}
|
||||
& td {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
|
|
@ -120,21 +126,6 @@ body {
|
|||
& td.form-one2many, td.form-many2many {
|
||||
vertical-align: top;
|
||||
}
|
||||
& .form-many2one, .form-date, .form-binary, .form-reference {
|
||||
& button {
|
||||
float: right;
|
||||
}
|
||||
& div {
|
||||
overflow: hidden;
|
||||
& input {
|
||||
width: 100%;
|
||||
boxing-sizing: border-box;
|
||||
}
|
||||
}
|
||||
& select, span {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
& .form-one2many-menu, .form-one2many-content,
|
||||
.form-many2many-menu, .form-many2many-content {
|
||||
border: 1px solid rgb(170, 170, 170);
|
||||
|
|
@ -162,6 +153,41 @@ body {
|
|||
}
|
||||
}
|
||||
}
|
||||
.form-date, .form-datetime, .form-many2one, .form-binary, .form-reference,
|
||||
.editabletree-date, .editabletree-datetime, .editabletree-many2one,
|
||||
.editabletree-binary, .editabletree-reference {
|
||||
& button {
|
||||
height: 1.5em;
|
||||
float: right;
|
||||
border: 0;
|
||||
}
|
||||
& div {
|
||||
overflow: hidden;
|
||||
& input {
|
||||
width: 100%;
|
||||
height: 1.5em;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
background-color: inherit;
|
||||
}
|
||||
}
|
||||
& select, span {
|
||||
float: left;
|
||||
}
|
||||
& select {
|
||||
max-width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.form-binary, .editabletree-binary {
|
||||
min-width: calc(5 * 2.4em);
|
||||
}
|
||||
|
||||
.form-integer, .form-float, .form-float-time,
|
||||
.column-integer, .column-float, .column-float_time,
|
||||
.editabletree-integer, .editabletree-float, .editabletree-float_time {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
button {
|
||||
& .ui-icon-custom {
|
||||
|
|
|
|||
43
src/view.js
43
src/view.js
|
|
@ -940,9 +940,7 @@
|
|||
this.factor = Number(attributes.factor || 1);
|
||||
},
|
||||
get_cell: function() {
|
||||
var cell = Sao.View.Tree.IntegerColumn._super.get_cell.call(this);
|
||||
cell.css('text-align', 'right');
|
||||
return cell;
|
||||
return Sao.View.Tree.IntegerColumn._super.get_cell.call(this);
|
||||
},
|
||||
update_text: function(cell, record) {
|
||||
cell.text(this.field.get_client(record, this.factor));
|
||||
|
|
@ -1915,11 +1913,11 @@
|
|||
Sao.View.Form.Date._super.init.call(this, field_name, model,
|
||||
attributes);
|
||||
this.el = jQuery('<div/>', {
|
||||
'class': this.class_ + ' ui-widget'
|
||||
'class': this.class_ +
|
||||
' ui-widget ui-widget-content ui-corner-all'
|
||||
});
|
||||
this.date = jQuery('<input/>', {
|
||||
'type': 'input',
|
||||
'class': 'ui-widget-content ui-corner-all'
|
||||
'type': 'input'
|
||||
});
|
||||
this.el.append(jQuery('<div/>').append(this.date));
|
||||
this.date.datepicker({
|
||||
|
|
@ -1937,9 +1935,6 @@
|
|||
this.date.datepicker('show');
|
||||
}.bind(this));
|
||||
},
|
||||
_get_color_el: function() {
|
||||
return this.date;
|
||||
},
|
||||
get_format: function(record, field) {
|
||||
return Sao.common.date_format();
|
||||
},
|
||||
|
|
@ -1959,6 +1954,7 @@
|
|||
});
|
||||
|
||||
Sao.View.Form.DateTime = Sao.class_(Sao.View.Form.Date, {
|
||||
class_: 'form-datetime',
|
||||
init: function(field_name, model, attributes) {
|
||||
Sao.View.Form.DateTime._super.init.call(this, field_name, model,
|
||||
attributes);
|
||||
|
|
@ -1998,7 +1994,6 @@
|
|||
init: function(field_name, model, attributes) {
|
||||
Sao.View.Form.Integer._super.init.call(this, field_name, model,
|
||||
attributes);
|
||||
this.el.css('text-align', 'right');
|
||||
this.factor = Number(attributes.factor || 1);
|
||||
},
|
||||
set_value: function(record, field) {
|
||||
|
|
@ -2037,6 +2032,9 @@
|
|||
Sao.common.selection_mixin.init.call(this);
|
||||
this.init_selection();
|
||||
},
|
||||
_get_color_el: function() {
|
||||
return this.select;
|
||||
},
|
||||
init_selection: function(key) {
|
||||
Sao.common.selection_mixin.init_selection.call(this, key,
|
||||
this.set_selection.bind(this));
|
||||
|
|
@ -2127,7 +2125,6 @@
|
|||
init: function(field_name, model, attributes) {
|
||||
Sao.View.Form.FloatTime._super.init.call(this, field_name, model,
|
||||
attributes);
|
||||
this.el.css('text-align', 'right');
|
||||
this.conv = null; // TODO
|
||||
},
|
||||
display: function(record, field) {
|
||||
|
|
@ -2198,11 +2195,11 @@
|
|||
Sao.View.Form.Many2One._super.init.call(this, field_name, model,
|
||||
attributes);
|
||||
this.el = jQuery('<div/>', {
|
||||
'class': this.class_ + ' ui-widget'
|
||||
'class': this.class_ +
|
||||
' ui-widget ui-widget-content ui-corner-all'
|
||||
});
|
||||
this.entry = jQuery('<input/>', {
|
||||
'type': 'input',
|
||||
'class': 'ui-widget-content ui-corner-all'
|
||||
'type': 'input'
|
||||
});
|
||||
this.entry.on('keyup', this.key_press.bind(this));
|
||||
this.el.append(jQuery('<div/>').append(this.entry));
|
||||
|
|
@ -2217,9 +2214,6 @@
|
|||
// TODO autocompletion
|
||||
this._readonly = false;
|
||||
},
|
||||
_get_color_el: function() {
|
||||
return this.entry;
|
||||
},
|
||||
get_screen: function() {
|
||||
var domain = this.field().get_domain(this.record());
|
||||
var context = this.field().get_context(this.record());
|
||||
|
|
@ -2453,9 +2447,7 @@
|
|||
init: function(field_name, model, attributes) {
|
||||
Sao.View.Form.Reference._super.init.call(this, field_name, model,
|
||||
attributes);
|
||||
this.select = jQuery('<select/>', {
|
||||
'class': 'ui-widget-content ui-corner-all'
|
||||
});
|
||||
this.select = jQuery('<select/>');
|
||||
this.el.prepend(jQuery('<span/>').text('-'));
|
||||
this.el.prepend(this.select);
|
||||
this.select.change(this.select_changed.bind(this));
|
||||
|
|
@ -3109,23 +3101,22 @@
|
|||
this.filename = attributes.filename || null;
|
||||
|
||||
this.el = jQuery('<div/>', {
|
||||
'class': this.class_ + 'ui-widget'
|
||||
'class': this.class_ +
|
||||
' ui-widget ui-widget-content ui-corner-all'
|
||||
});
|
||||
|
||||
var inputs = jQuery('<div/>');
|
||||
this.el.append(inputs);
|
||||
if (this.filename && attributes.filename_visible) {
|
||||
this.text = jQuery('<input/>', {
|
||||
type: 'input',
|
||||
'class': 'ui-widget-content ui-corner-all'
|
||||
type: 'input'
|
||||
});
|
||||
this.text.change(this.focus_out.bind(this));
|
||||
this.text.on('keyup', this.key_press.bind(this));
|
||||
inputs.append(this.text);
|
||||
}
|
||||
this.size = jQuery('<input/>', {
|
||||
type: 'input',
|
||||
'class': 'ui-widget ui-widget-content ui-corner-all'
|
||||
type: 'input'
|
||||
});
|
||||
inputs.append(this.size);
|
||||
|
||||
|
|
@ -3139,7 +3130,7 @@
|
|||
this.el.prepend(this.but_new);
|
||||
|
||||
if (this.filename) {
|
||||
this.but_open = jQuery('<a/>').button({
|
||||
this.but_open = jQuery('<button/>').button({
|
||||
icons: {
|
||||
primary: 'ui-icon-folder-open'
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in a new issue