diff options
| author | Gery Debongnie <ged@openerp.com> | 2014-04-03 16:46:51 +0200 |
|---|---|---|
| committer | Gery Debongnie <ged@openerp.com> | 2014-04-03 16:46:51 +0200 |
| commit | 64fecc86b7f960aea2db42d45b87dfe67264c1da (patch) | |
| tree | c2ca813cc5149b7504398629af86ef6142ba1c5f /addons/web/static/src | |
| parent | 9d915db2144be0d3b8e01340495f45b4187ceb76 (diff) | |
| parent | d9b9894c62f3bed2b0e88a0bc495a3b4e7fe3ae3 (diff) | |
[MERGE] merge from trunk
bzr revid: ged@openerp.com-20140403144651-9c2a4wi5klvtnw75
Diffstat (limited to 'addons/web/static/src')
| -rw-r--r-- | addons/web/static/src/css/base.css | 46 | ||||
| -rw-r--r-- | addons/web/static/src/css/base.sass | 39 | ||||
| -rw-r--r-- | addons/web/static/src/js/view_form.js | 81 | ||||
| -rw-r--r-- | addons/web/static/src/xml/base.xml | 15 |
4 files changed, 167 insertions, 14 deletions
diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css index 6a20442ed41..66bfaca7c6e 100644 --- a/addons/web/static/src/css/base.css +++ b/addons/web/static/src/css/base.css @@ -1,4 +1,4 @@ -@charset "utf-8"; +@charset "UTF-8"; @font-face { font-family: "mnmliconsRegular"; src: url("/web/static/src/font/mnmliconsv21-webfont.eot") format("eot"); @@ -368,6 +368,7 @@ .openerp .oe_left { float: left; margin-right: 8px; + width: 305px; } .openerp .oe_right { float: right; @@ -456,11 +457,46 @@ background: #ed6f6a; } .openerp .oe_button_box { - width: 270px; - text-align: right; + width: 400px; + text-align: left; +} +.openerp .oe_button_box .oe_stat_button:hover { + background: #7c7bad; + color: white; +} +.openerp .oe_button_box .oe_stat_button:hover .fa { + color: white; +} +.openerp .oe_button_box .oe_stat_button { + font-weight: normal; + display: inline-table; + width: 33% !important; + height: 42px; + margin: 0px -1px -1px 0px; + padding: 0; + color: #666666; + border: 1px solid #dddddd; + border-radius: 0; + box-shadow: none; + background: white; +} +.openerp .oe_button_box .oe_stat_button > div { + display: table-cell; + vertical-align: middle; + text-align: left; + padding: 0; + line-height: 120%; +} +.openerp .oe_button_box .oe_stat_button .stat_button_icon { + color: #7c7bad; + font-size: 24px; + padding: 0px 3px; + width: 37px; + text-align: center; } -.openerp .oe_button_box button { - margin: 4px; +.openerp .oe_button_box .oe_stat_button svg { + width: 38px; + height: 38px; } .openerp .oe_avatar > img { max-height: 90px; diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass index 38a47eed1c5..7110349557a 100644 --- a/addons/web/static/src/css/base.sass +++ b/addons/web/static/src/css/base.sass @@ -385,6 +385,7 @@ $sheet-padding: 16px .oe_left float: left margin-right: 8px + width: 305px .oe_right float: right margin-left: 8px @@ -429,10 +430,40 @@ $sheet-padding: 16px &:hover background: #ED6F6A .oe_button_box - width: 270px - text-align: right - button - margin: 4px + width: 400px + text-align: left + .oe_stat_button:hover + background: #7c7bad + color: white + .fa + color: white + .oe_stat_button + font-weight: normal + display: inline-table + width: 33% !important + height: 42px + margin: 0px -1px -1px 0px + padding: 0 + color: #666 + border: 1px solid #dddddd + border-radius: 0 + box-shadow: none + background: white + > div + display: table-cell + vertical-align: middle + text-align: left + padding: 0 + line-height: 120% + .stat_button_icon + color: #7C7BAD + font-size: 24px + padding: 0px 3px + width: 37px + text-align: center + svg + width: 38px + height: 38px .oe_avatar > img max-height: 90px diff --git a/addons/web/static/src/js/view_form.js b/addons/web/static/src/js/view_form.js index 3dc148bc7c1..7b60957807e 100644 --- a/addons/web/static/src/js/view_form.js +++ b/addons/web/static/src/js/view_form.js @@ -1277,6 +1277,9 @@ instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInt var defs = []; _.each(this.to_replace, function(el) { defs.push(el[0].replace(el[1])); + if (el[1].children().length) { + el[0].$el.append(el[1].children()); + } }); this.to_replace = []; return $.when.apply($, defs); @@ -1304,7 +1307,7 @@ instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInt var tagname = $tag[0].nodeName.toLowerCase(); if (this.tags_registry.contains(tagname)) { this.tags_to_init.push($tag); - return $tag; + return (tagname === 'button') ? this.process_button($tag) : $tag; } var fn = self['process_' + tagname]; if (fn) { @@ -1321,6 +1324,13 @@ instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInt return $tag; } }, + process_button: function ($button) { + var self = this; + $button.children().each(function() { + self.process($(this)); + }); + return $button; + }, process_widget: function($widget) { this.widgets_to_init.push($widget); return $widget; @@ -1906,6 +1916,8 @@ instance.web.form.WidgetButton = instance.web.form.FormWidget.extend({ template: 'WidgetButton', init: function(field_manager, node) { node.attrs.type = node.attrs['data-button-type']; + this.is_stat_button = /\boe_stat_button\b/.test(node.attrs['class']); + this.icon = node.attrs.icon && "<span class=\"fa " + node.attrs.icon + " fa-fw\"></span>"; this._super(field_manager, node); this.force_disabled = false; this.string = (this.node.attrs.string || '').replace(/_/g, ''); @@ -1976,7 +1988,6 @@ instance.web.form.WidgetButton = instance.web.form.FormWidget.extend({ var self = this; var context = this.build_context(); - return this.view.do_execute_action( _.extend({}, this.node.attrs, {context: context}), this.view.dataset, this.view.datarecord.id, function () { @@ -2805,6 +2816,50 @@ instance.web.form.FieldProgressBar = instance.web.form.AbstractField.extend({ } }); +/** + The PercentPie field expect a float from 0 to 100. +*/ +instance.web.form.FieldPercentPie = instance.web.form.AbstractField.extend({ + template: 'FieldPercentPie', + + render_value: function() { + var value = this.get('value'), + formatted_value = Math.round(value || 0) + '%', + svg = this.$('svg')[0]; + + svg.innerHTML = ""; + nv.addGraph(function() { + var size=43; + var chart = nv.models.pieChart() + .width(size) + .height(size) + .margin({top: 0, right: 0, bottom: 0, left: 0}) + .donut(true) + .showLegend(false) + .showLabels(false) + .tooltips(false) + .color(['#7C7BAD','#DDD']) + .donutRatio(0.62); + + d3.select(svg) + .datum([{'x': 'value', 'y': value}, {'x': 'complement', 'y': 100 - value}]) + .transition() + .call(chart) + .attr({width:size, height:size}); + + d3.select(svg) + .append("text") + .attr({x: size/2, y: size/2 + 3, 'text-anchor': 'middle'}) + .style({"font-size": "10px", "font-weight": "bold"}) + .text(formatted_value); + + return chart; + }); + + } +}); + + instance.web.form.FieldSelection = instance.web.form.AbstractField.extend(instance.web.form.ReinitializeFieldMixin, { template: 'FieldSelection', @@ -5852,6 +5907,26 @@ instance.web.form.X2ManyCounter = instance.web.form.AbstractField.extend(instanc }); /** + This widget is intended to be used on stat button numeric fields. It will display + the value many2many and one2many. It is a read-only field that will + display a simple string "<value of field> <label of the field>" +*/ +instance.web.form.StatInfo = instance.web.form.AbstractField.extend({ + init: function() { + this._super.apply(this, arguments); + this.set("value", 0); + }, + render_value: function() { + var options = { + value: this.get("value") || 0, + text: this.string, + }; + this.$el.html(QWeb.render("StatInfo", options)); + }, + +}); + +/** * Registry of form fields, called by :js:`instance.web.FormView`. * * All referenced classes must implement FieldInterface. Those represent the classes whose instances @@ -5878,6 +5953,7 @@ instance.web.form.widgets = new instance.web.Registry({ 'reference' : 'instance.web.form.FieldReference', 'boolean' : 'instance.web.form.FieldBoolean', 'float' : 'instance.web.form.FieldFloat', + 'percentpie': 'instance.web.form.FieldPercentPie', 'integer': 'instance.web.form.FieldFloat', 'float_time': 'instance.web.form.FieldFloat', 'progressbar': 'instance.web.form.FieldProgressBar', @@ -5888,6 +5964,7 @@ instance.web.form.widgets = new instance.web.Registry({ 'monetary': 'instance.web.form.FieldMonetary', 'many2many_checkboxes': 'instance.web.form.FieldMany2ManyCheckBoxes', 'x2many_counter': 'instance.web.form.X2ManyCounter', + 'statinfo': 'instance.web.form.StatInfo', }); /** diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml index 7ba06b69095..23cad2098dc 100644 --- a/addons/web/static/src/xml/base.xml +++ b/addons/web/static/src/xml/base.xml @@ -1195,6 +1195,11 @@ <span></span> </span> </t> +<t t-name="FieldPercentPie"> + <span class="oe_form_field oe_form_field_percent_pie" t-att-style="widget.node.attrs.style"> + <svg></svg> + </span> +</t> <t t-name="FieldStatus"> <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> @@ -1358,13 +1363,15 @@ </div> </t> <t t-name="WidgetButton"> - <button type="button" class="oe_button oe_form_button" + <button type="button" t-att-class="widget.is_stat_button ? 'oe_stat_button btn btn-default' : 'oe_button oe_form_button'" t-att-style="widget.node.attrs.style" t-att-tabindex="widget.node.attrs.tabindex" t-att-autofocus="widget.node.attrs.autofocus" t-att-accesskey="widget.node.attrs.accesskey"> - <img t-if="widget.node.attrs.icon" t-att-src="_s + widget.node.attrs.icon" width="16" height="16"/> - <span t-if="widget.string"><t t-esc="widget.string"/></span> + <img t-if="!widget.is_stat_button and widget.node.attrs.icon " t-att-src="_s + widget.node.attrs.icon" width="16" height="16"/> + <div t-if="widget.is_stat_button" class="stat_button_icon"><t t-if="widget.icon" t-raw="widget.icon"/></div> + <span t-if="widget.string and !widget.is_stat_button"><t t-esc="widget.string"/></span> + <div t-if="widget.string and widget.is_stat_button"><t t-esc="widget.string"/></div> </button> </t> <t t-name="WidgetButton.tooltip" t-extend="WidgetLabel.tooltip"> @@ -1937,4 +1944,6 @@ <t t-name="X2ManyCounter"> <a href="javascript:void(0)"><t t-esc="text"/></a> </t> +<t t-name="StatInfo"> + <strong><t t-esc="value"/></strong><br/><t t-esc="text"/></t> </templates> |
