odoo
/
odoo
2
0
Fork 0
Code Pull Requests Releases Activity

[IMP] view_form: statusbar with folded selection 

bzr revid: chm@openerp.com-20130321124952-kwexraafd2681isg
This commit is contained in:
Christophe Matthieu 2013-03-21 13:49:52 +01:00
parent 185b405b96
commit 0cecdac970
4 changed files with 99 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
addons/web/static/src/css/base.css
View File

@ -2158,6 +2158,7 @@
}
.openerp .oe_form header {
position: relative;
z-index: 1;
border-bottom: 1px solid #cacaca;
padding-left: 2px;
background-color: #ededed;
@ -2630,17 +2631,17 @@
background-image: -o-linear-gradient(top, #fcfcfc, #dedede);
background-image: linear-gradient(to bottom, #fcfcfc, #dedede);
}
.openerp ul.oe_form_status li:first-child .label, .openerp ul.oe_form_status_clickable li:first-child .label {
.openerp ul.oe_form_status li:first-child .label, .openerp ul.oe_form_status_clickable li:first-child > .label {
border-left: 1px solid #cacaca;
padding-left: 14px;
}
.openerp ul.oe_form_status li:last-child, .openerp ul.oe_form_status_clickable li:last-child {
border-right: 1px solid #cacaca;
}
.openerp ul.oe_form_status li:last-child .label, .openerp ul.oe_form_status_clickable li:last-child .label {
.openerp ul.oe_form_status li:last-child .label, .openerp ul.oe_form_status_clickable li:last-child > .label {
padding-right: 14px;
}
.openerp ul.oe_form_status li:last-child .arrow, .openerp ul.oe_form_status_clickable li:last-child .arrow {
.openerp ul.oe_form_status li:last-child .arrow, .openerp ul.oe_form_status_clickable li:last-child > .arrow {
display: none;
}
.openerp ul.oe_form_status li .label, .openerp ul.oe_form_status_clickable li .label {
@ -2690,18 +2691,18 @@
background-image: -o-linear-gradient(top, #729fcf, #3465a4);
background-image: linear-gradient(to bottom, #729fcf, #3465a4);
}
.openerp ul.oe_form_status li.oe_active .arrow span, .openerp ul.oe_form_status_clickable li.oe_active .arrow span {
.openerp ul.oe_form_status li.oe_active .arrow span, .openerp ul.oe_form_status_clickable li.oe_active > .arrow span {
background-color: #3465a4;
background: -moz-linear-gradient(135deg, #3465a4, #729fcf);
background: -o-linear-gradient(135deg, #729fcf, #3465a4);
background: -webkit-gradient(linear, left top, right bottom, from(#729fcf), to(#3465a4));
background: -ms-linear-gradient(top, #729fcf, #3465a4);
}
.openerp ul.oe_form_status li.oe_active .label, .openerp ul.oe_form_status_clickable li.oe_active .label {
.openerp ul.oe_form_status li.oe_active .label, .openerp ul.oe_form_status_clickable li.oe_active > .label {
color: white;
text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4;
}
.openerp ul.oe_form_status_clickable li {
.openerp ul.oe_form_status_clickable > li {
cursor: pointer;
}
.openerp ul.oe_form_status_clickable li:hover {
@ -2713,10 +2714,10 @@
background-image: -o-linear-gradient(top, #e8e8e8, #cacaca);
background-image: linear-gradient(to bottom, #e8e8e8, #cacaca);
}
.openerp ul.oe_form_status_clickable li:hover .label {
.openerp ul.oe_form_status_clickable li:hover > .label {
text-shadow: 0 -1px 1px #fcfcfc, 0 1px 1px #dedede;
}
.openerp ul.oe_form_status_clickable li:hover .arrow span {
.openerp ul.oe_form_status_clickable li:hover > .arrow span {
background-color: #d9d9d9;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#cacaca));
background-image: -webkit-linear-gradient(top, #e8e8e8, #cacaca);
@ -2725,7 +2726,7 @@
background-image: -o-linear-gradient(top, #e8e8e8, #cacaca);
background-image: linear-gradient(to bottom, #e8e8e8, #cacaca);
}
.openerp ul.oe_form_status_clickable li .label {
.openerp ul.oe_form_status_clickable li > .label {
color: #7c7bad;
}
.openerp ul.oe_form_status_clickable li.oe_active:hover {
@ -2737,16 +2738,42 @@
background-image: -o-linear-gradient(top, #4c85c2, #284d7d);
background-image: linear-gradient(to bottom, #4c85c2, #284d7d);
}
.openerp ul.oe_form_status_clickable li.oe_active:hover .label {
.openerp ul.oe_form_status_clickable li.oe_active:hover > .label {
text-shadow: 0 -1px 1px #729fcf, 0 1px 1px #3465a4;
}
.openerp ul.oe_form_status_clickable li.oe_active:hover .arrow span {
.openerp ul.oe_form_status_clickable li.oe_active:hover > .arrow span {
background-color: #284d7d;
background: -moz-linear-gradient(135deg, #284d7d, #4c85c2);
background: -o-linear-gradient(135deg, #4c85c2, #284d7d);
background: -webkit-gradient(linear, left top, right bottom, from(#4c85c2), to(#284d7d));
background: -ms-linear-gradient(top, #4c85c2, #284d7d);
}
.openerp ul.oe_form_field_status li.oe_folded .label{
padding-bottom: 8px;
}
.openerp ul.oe_form_field_status li.oe_folded ul{
position: absolute;
border-top: 1px solid #cacaca;
float: none;
top: 30px;
right: 0;
display: none;
}
.openerp ul.oe_form_field_status li.oe_folded:hover ul{
display: block;
}
.openerp ul.oe_form_field_status li.oe_folded ul li{
margin: 0;
border-left: 1px solid #cacaca;
display: block;
}
.openerp ul.oe_form_field_status li.oe_folded ul li .label{
border: 0;
padding-left: 24px;
}
.openerp ul.oe_form_field_status li.oe_folded ul li:last-child {
border-bottom: 1px solid #cacaca;
}
.openerp .oe_form .oe_form_field_one2many > .oe_view_manager .oe_list_pager_single_page {
display: none;
}

45
addons/web/static/src/css/base.sass
View File

@ -1707,6 +1707,7 @@ $sheet-padding: 16px
// FormView.header {{{
.oe_form header
position: relative
z-index: 1
border-bottom: 1px solid #cacaca
padding-left: 2px
@include vertical-gradient(#fcfcfc, #dedede)
@ -2092,16 +2093,16 @@ $sheet-padding: 16px
margin: 0 -18px 0 0
padding: 0
@include vertical-gradient(#fcfcfc, #dedede)
&:first-child .label
&:first-child > .label
border-left: 1px solid #cacaca
padding-left: 14px
&:last-child
border-right: 1px solid #cacaca
.label
> .label
padding-right: 14px
.arrow
> .arrow
display: none
.label
> .label
color: #4c4c4c
text-shadow: 0 1px 1px #fcfcfc, 0 -1px 1px #dedede
padding: 7px
@ -2109,7 +2110,7 @@ $sheet-padding: 16px
padding-left: 24px
margin: 0
position: relative
.arrow
> .arrow
width: 17px
display: inline-block
vertical-align: top
@ -2128,9 +2129,9 @@ $sheet-padding: 16px
@include transform(rotate(45deg))
li.oe_active
@include vertical-gradient(#729fcf, #3465a4)
.arrow span
> .arrow span
@include skew-gradient(#729fcf, #3465a4)
.label
> .label
color: white
text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4
ul.oe_form_status_clickable
@ -2138,18 +2139,18 @@ $sheet-padding: 16px
cursor: pointer
&:hover
@include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
.label
> .label
text-shadow: 0 -1px 1px #fcfcfc, 0 1px 1px #dedede
.arrow span
> .arrow span
@include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
.label
> .label
color: $link-color
li.oe_active
&:hover
@include vertical-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
.label
> .label
text-shadow: 0 -1px 1px #729fcf, 0 1px 1px #3465a4
.arrow span
> .arrow span
@include skew-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
// }}}
// FormView.one2many {{{
@ -2609,26 +2610,26 @@ div.ui-widget-overlay
&:last-child
overflow: hidden
border-right: 1px solid #cacaca
.label
> .label
padding-right: 14px
border-right: none
.arrow
> .arrow
display: inline-block
opacity: 0
filter: alpha(opacity = 0)
border: none
width: 0
border-right: none
.label
border-bottom: 1px solid #cacaca
background: transparent
.arrow
span
background-color: #fefefe !important
> .label
border-bottom: 1px solid #cacaca
background: transparent
> .arrow
span
background-color: #fefefe !important
li.oe_active
.label
> .label
border-bottom: 1px solid #729fcf
.arrow span
> .arrow span
background-color: #729fcf !important
// jquery ui for ie

47
addons/web/static/src/js/view_form.js
View File

@ -5263,8 +5263,8 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
this.options.clickable = this.options.clickable || (this.node.attrs || {}).clickable || false;
this.options.visible = this.options.visible || (this.node.attrs || {}).statusbar_visible || false;
this.set({value: false});
this.selection = [];
this.set("selection", []);
this.selection = {'unfolded': [], 'folded': []};
this.set("selection", {'unfolded': [], 'folded': []});
this.selection_dm = new instance.web.DropMisordered();
},
start: function() {
@ -5278,7 +5278,7 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
});
this.get_selection();
if (this.options.clickable) {
this.$el.on('click','li',this.on_click_stage);
this.$el.on('click','li:not(.oe_folded)',this.on_click_stage);
}
if (this.$el.parent().is('header')) {
this.$el.after('<div class="oe_clear"/>');
@ -5293,7 +5293,10 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
},
render_value: function() {
var self = this;
var content = QWeb.render("FieldStatus.content", {widget: self});
var content = QWeb.render("FieldStatus.content", {
'widget': self,
'value_folded': _.find(self.selection.folded, function(i){return i[0] === self.get('value')})
});
self.$el.html(content);
var colors = JSON.parse((self.node.attrs || {}).statusbar_colors || "{}");
var color = colors[self.get('value')];
@ -5303,15 +5306,8 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
},
calc_domain: function() {
var d = instance.web.pyeval.eval('domain', this.build_domain());
var domain = []; //if there is no domain defined, fetch all the records
if (d.length) {
domain = ['|',['id', '=', this.get('value')]].concat(d);
}
if (! _.isEqual(domain, this.get("evaluated_selection_domain"))) {
this.set("evaluated_selection_domain", domain);
}
this.set("evaluated_selection_domain", ['&', ['fold', '=', false], '|', ['id', '=', this.get('value')]].concat(d));
this.set("evaluated_selection_domain_folded", ['&', ['fold', '!=', false], '|', ['id', '=', this.get('value')]].concat(d));
},
/** Get the selection and render it
* selection: [[identifier, value_to_display], ...]
@ -5320,18 +5316,24 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
*/
get_selection: function() {
var self = this;
var selection = [];
var selection_unfolded = [];
var selection_folded = [];
var calculation = _.bind(function() {
if (this.field.type == "many2one") {
var domain = [];
var ds = new instance.web.DataSetSearch(this, this.field.relation,
self.build_context(), this.get("evaluated_selection_domain"));
return ds.read_slice(['name'], {}).then(function (records) {
for(var i = 0; i < records.length; i++) {
selection.push([records[i].id, records[i].name]);
}
});
var ds_unfold = new instance.web.DataSetSearch(self, self.field.relation, self.build_context(), this.get("evaluated_selection_domain"))
.read_slice(['name'], {}).then(function (records) {
_.each(records, function (record) {
selection_unfolded.push([record.id, record.name]);
});
});
var ds_fold = new instance.web.DataSetSearch(self, self.field.relation, self.build_context(), this.get("evaluated_selection_domain_folded"))
.read_slice(['name'], {}).then(function (records) {
_.each(records, function (record) {
selection_folded.push([record.id, record.name]);
});
});
return $.when(ds_unfold, ds_fold);
} else {
// For field type selection filter values according to
// statusbar_visible attribute of the field. For example:
@ -5347,6 +5349,7 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
}
}, this);
this.selection_dm.add(calculation()).then(function () {
var selection = {'unfolded': selection_unfolded, 'folded': selection_folded};
if (! _.isEqual(selection, self.get("selection"))) {
self.set("selection", selection);
}

14
addons/web/static/src/xml/base.xml
View File

@ -1190,13 +1190,25 @@
<ul t-att-class="'oe_form_field_status ' + (widget.options.clickable ? 'oe_form_status_clickable' : 'oe_form_status')" t-att-style="widget.node.attrs.style"/>
</t>
<t t-name="FieldStatus.content">
<t t-foreach="widget.selection" t-as="i">
<t t-foreach="widget.selection.unfolded" t-as="i">
<li t-att-class="i[0] === widget.get('value') ? 'oe_active' : ''" t-att-data-id="i[0]">
<span class="label"><t t-esc="i[1]"/></span>
<!-- are you mit ? -->
<span class="arrow"><span></span></span>
</li>
</t>
<t t-if="widget.selection.folded.length">
<li t-att-class="value_folded ? 'oe_active oe_folded' : 'oe_folded'">
<span class="label"> ... </span>
<ul>
<t t-foreach="widget.selection.folded" t-as="i">
<li t-att-class="i[0] === widget.get('value') ? 'oe_active' : ''" t-att-data-id="i[0]">
<span class="label"><t t-esc="i[1]"/></span>
</li>
</t>
</ul>
</li>
</t>
</t>
<t t-name="FieldBinaryImage">
<span class="oe_form_field oe_form_field_image" t-att-style="widget.node.attrs.style">