viewmanager refactor part1

bzr revid: al@openerp.com-20120409184445-nri84zeylu6ur21d
This commit is contained in:
Antony Lesuisse 2012-04-09 20:44:45 +02:00
parent bc92baa084
commit d4b103fb4d
6 changed files with 86 additions and 300 deletions

View File

@ -920,6 +920,17 @@
.openerp2 .oe_view_manager_header .oe_view_manager_switch {
float: right;
}
.openerp2 .oe_view_manager_header .oe_view_manager_buttons {
padding-right: 8px;
float: left;
margin-right: 12px;
}
.openerp2 .oe_view_manager_header .oe_view_manager_sidebar {
display: block;
}
.openerp2 .oe_view_manager_header .oe_view_manager_pager {
float: right;
}
.openerp2 .oe_form_dropdown_section {
position: relative;
display: inline-block;
@ -1162,149 +1173,9 @@
.openerp2 .oe_searchview .oe_searchview_drawer .oe_searchview_advanced.oe_opened div {
display: block;
}
.openerp2 .searcharea {
position: relative;
float: right;
}
.openerp2 .searcharea .toggle-button {
position: absolute;
top: 10px;
right: 8px;
width: 0;
height: 0;
display: inline-block;
content: "&darr";
vertical-align: top;
border-top: 5px solid #4c4c4c;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
filter: alpha(opacity=50);
opacity: 0.5;
}
.openerp2 .searcharea .toggle-button:hover {
filter: alpha(opacity=80);
opacity: 0.8;
}
.openerp2 .searcharea .searchmenu {
display: none;
position: absolute;
top: 30px;
right: 7px;
border: 1px solid #afafb6;
width: 432px;
overflow-x: hidden;
z-index: 900;
background: white;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.openerp2 .searcharea .searchmenu .dropdown-menu input {
width: 120px;
}
.openerp2 .searcharea .searchmenu input {
width: 25px;
}
.openerp2 .searcharea .searchmenu .toggle:before {
margin-left: 0;
margin-top: 9px;
}
.openerp2 .searcharea .searchmenu .open:before {
margin-top: 14px;
}
.openerp2 .searcharea .searchmenu .menu:last-child {
margin-bottom: 0;
}
.openerp2 .searcharea .searchmenu .menu li {
padding-left: 12px;
margin-right: 8px;
}
.openerp2 .searcharea .searchmenu .custom-filters a:hover:after {
content: "d";
font-family: "mnmliconsRegular" !important;
font-size: 18px;
font-weight: 300 !important;
float: right;
margin-top: -1px;
}
.openerp2 .searcharea .searchmenu a {
height: 14px;
line-height: 14px;
padding: 3px 6px;
color: #4c4c4c;
}
.openerp2 .searcharea .searchmenu a:hover {
text-decoration: none;
background-color: #f0f0fa;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f0fa), to(#eeeef6));
background-image: -webkit-linear-gradient(top, #f0f0fa, #eeeef6);
background-image: -moz-linear-gradient(top, #f0f0fa, #eeeef6);
background-image: -ms-linear-gradient(top, #f0f0fa, #eeeef6);
background-image: -o-linear-gradient(top, #f0f0fa, #eeeef6);
background-image: linear-gradient(to bottom, #f0f0fa, #eeeef6);
}
.openerp2 .searcharea .searchmenu p {
margin-left: 12px;
}
.openerp2 .searcharea .searchmenu input, .openerp2 .searcharea .searchmenu textarea {
height: 14px;
padding: 2px;
font-size: 11px;
line-height: 18px;
border: 1px solid #cccccc;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.openerp2 .searcharea .searchmenu .column {
width: 48%;
}
.openerp2 .searcharea .searchmenu .full-column {
margin: 8px 0;
padding: 4px;
}
.openerp2 input.searchbox {
width: 410px;
border: 1px solid #ababab;
margin-top: 0;
margin-bottom: 0;
padding: 4px 19px;
font-size: 13px;
background: url("/web/static/src/img/search.png") no-repeat 5px;
background-color: white;
-moz-border-radius: 13px;
-webkit-border-radius: 13px;
border-radius: 13px;
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
}
.openerp2 .search-clear {
position: absolute;
top: 7px;
right: 24px;
width: 12px;
height: 12px;
cursor: pointer;
display: none;
}
.openerp2 .oe_form_header {
padding: 8px;
}
.openerp2 .oe_form_header .oe_form_buttons {
padding-right: 8px;
float: left;
margin-right: 12px;
}
.openerp2 .oe_form_header .oe_form_pager {
float: right;
}
.openerp2 .oe_form_header .oe-sidebar-attachments {
display: none;
}
.openerp2 .oe_form_invalid input, .openerp2 .oe_form_invalid select, .openerp2 .oe_form_invalid textarea {
background-color: #ff6666 !important;
border: 1px solid #dd0000 !important;

View File

@ -667,7 +667,7 @@ $colour4: #8a89ba
color: #fff
text-shadow: 0 1px 2px rgba(0,0,0,0.4)
// }}}
// ViewManager Header {{{
// ViewManager.header {{{
.oe_view_manager_header
border-top: 1px solid #cacaca
border-bottom: 1px solid #cacaca
@ -721,13 +721,21 @@ $colour4: #8a89ba
padding: 0 8px
.oe_view_manager_switch
float: right
.oe_view_manager_buttons
padding-right: 8px
float: left
margin-right: 12px
.oe_view_manager_sidebar
display: block
.oe_view_manager_pager
float: right
// }}}
// ViewManager Dropdown {{{
// ViewManager.sidebar {{{
.oe_form_dropdown_section
position: relative
display: inline-block
margin-right: 4px
.oe_dropdown_toggle:after
width: 0
height: 0
@ -739,11 +747,9 @@ $colour4: #8a89ba
border-right: 4px solid transparent
border-top: 4px solid white
@include opacity(0.5)
margin-top: 7px
margin-left: 6px
border-top-color: #404040
.oe_dropdown_menu
display: none
position: absolute
@ -951,120 +957,9 @@ $colour4: #8a89ba
div
display: block
// }}}
// SearchView mit {{{
.searcharea
position: relative
float: right
.toggle-button
position: absolute
top: 10px
right: 8px
width: 0
height: 0
display: inline-block
content: "&darr"
vertical-align: top
border-top: 5px solid #4c4c4c
border-left: 5px solid transparent
border-right: 5px solid transparent
@include opacity(0.5)
&:hover
@include opacity(0.8)
.searchmenu
display: none
position: absolute
top: 30px
right: 7px
border: 1px solid #afafb6
width: 432px
overflow-x: hidden
z-index: 900
background: white
@include radius(5px)
@include box-shadow(0 1px 4px rgba(0,0,0,0.3))
.dropdown-menu
input
width: 120px
input
width: 25px
.toggle:before
margin-left: 0
margin-top: 9px
.open:before
margin-top: 14px
.menu
&:last-child
margin-bottom: 0
li
padding-left: 12px
margin-right: 8px
.custom-filters
a:hover:after
content: 'd'
font-family: "mnmliconsRegular" !important
font-size: 18px
font-weight: 300 !important
float: right
margin-top: -1px
a
height: 14px
line-height: 14px
padding: 3px 6px
color: #4c4c4c
&:hover
text-decoration: none
@include vertical-gradient(#f0f0fa, #eeeef6)
p
margin-left: 12px
input, textarea
height: 14px
padding: 2px
font-size: 11px
line-height: 18px
border: 1px solid #ccc
@include radius(3px)
.column
width: 48%
.full-column
margin: 8px 0
padding: 4px
input.searchbox
width: 410px
border: 1px solid #ababab
margin-top: 0
margin-bottom: 0
padding: 4px 19px
font-size: 13px
background: url('/web/static/src/img/search.png') no-repeat 5px
background-color: white
@include radius(13px)
@include box-shadow(0 1px 2px rgba(0,0,0,0.2) inset)
.search-clear
position: absolute
top: 7px
right: 24px
width: 12px
height: 12px
cursor: pointer
display: none
// }}}
// FormView.header {{{
// FormView.body {{{
.oe_form_header
padding: 8px
.oe_form_buttons
padding-right: 8px
float: left
margin-right: 12px
.oe_form_pager
float: right
// FIXME
.oe-sidebar-attachments
display: none
// }}}
// FormView.body {{{
.oe_form_invalid
input, select, textarea
background-color: #F66 !important

View File

@ -5,7 +5,7 @@ var _t = openerp.web._t,
var QWeb = openerp.web.qweb;
openerp.web.views.add('form', 'openerp.web.FormView');
openerp.web.FormView = openerp.web.View.extend( /** @lends openerp.web.FormView# */{
openerp.web.FormView = openerp.web.View.extend({
/**
* Indicates that this view is not searchable, and thus that no search
* view should be displayed (if there is one active).
@ -41,7 +41,6 @@ openerp.web.FormView = openerp.web.View.extend( /** @lends openerp.web.FormView#
this.default_focus_button = null;
this.registry = openerp.web.form.widgets;
this.has_been_loaded = $.Deferred();
this.$form_header = null;
this.translatable_fields = [];
_.defaults(this.options, {
"not_interactible_on_create": false
@ -54,10 +53,6 @@ openerp.web.FormView = openerp.web.View.extend( /** @lends openerp.web.FormView#
this.rendering_engine = new openerp.web.FormRenderingEngine(this);
},
destroy: function() {
if (this.sidebar) {
this.sidebar.attachments.destroy();
this.sidebar.destroy();
}
_.each(this.get_widgets(), function(w) {
w.destroy();
});
@ -78,23 +73,26 @@ openerp.web.FormView = openerp.web.View.extend( /** @lends openerp.web.FormView#
var $dest = this.$element.hasClass("oe_form_container") ? this.$element : this.$element.find('.oe_form_container');
this.rendering_engine.render_to($dest);
this.$form_header = this.$element.find('.oe_form_header:first');
this.$form_header.find('div.oe_form_pager button[data-pager-action]').click(function() {
this.$buttons = this.options.$buttons || this.$element.find('.oe_form_buttons');
this.$sidebar = this.options.$sidebar || this.$element.find('.oe_form_sidebar');
this.$pager = this.options.$pager || this.$element.find('.oe_form_pager');
this.$buttons.html(QWeb.render("FormView.buttons", {'widget':self}));
this.$pager.html(QWeb.render("FormView.pager", {'widget':self}));
this.$buttons.on('click','.oe_form_buttons button.oe_form_button_save',this.on_button_save);
this.$buttons.on('click','.oe_form_buttons button.oe_form_button_cancel',this.on_button_cancel);
this.$pager.on('click','.oe_form_pager button[data-pager-action]',function(event) {
var action = $(this).data('pager-action');
self.on_pager_action(action);
});
this.$form_header.find('button.oe_form_button_save').click(this.on_button_save);
this.$form_header.find('button.oe_form_button_cancel').click(this.on_button_cancel);
if (!this.sidebar && this.options.sidebar && this.options.sidebar_id) {
if (!this.sidebar && this.options.sidebar) {
this.sidebar = new openerp.web.Sidebar(this);
this.sidebar.appendTo(this.$element.find(".oe_form_sidebar"));
this.sidebar.attachments = new openerp.web.form.SidebarAttachments(this.sidebar, this);
this.sidebar.appendTo(this.$sidebar);
//this.sidebar.attachments = new openerp.web.form.SidebarAttachments(this.sidebar, this);
this.sidebar.add_toolbar(this.fields_view.toolbar);
this.set_common_sidebar_sections(this.sidebar);
this.sidebar.add_section(_t('Customize'), 'customize');
this.sidebar.add_items('customize', [{
this.sidebar.add_items('other', [{
label: _t('Set Default'),
form: this,
callback: function (item) {
@ -173,7 +171,7 @@ openerp.web.FormView = openerp.web.View.extend( /** @lends openerp.web.FormView#
self.is_initialized.resolve();
self.do_update_pager(record.id == null);
if (self.sidebar) {
self.sidebar.attachments.do_update();
// self.sidebar.attachments.do_update();
}
if (self.default_focus_field) {
self.default_focus_field.focus();
@ -216,7 +214,7 @@ openerp.web.FormView = openerp.web.View.extend( /** @lends openerp.web.FormView#
}
},
do_update_pager: function(hide_index) {
var $pager = this.$form_header.find('div.oe_form_pager');
var $pager = this.$pager.find('div.oe_form_pager');
var index = hide_index ? '-' : this.dataset.index + 1;
$pager.find('button').prop('disabled', this.dataset.ids.length < 2);
$pager.find('span.oe_pager_index').html(index);

View File

@ -19,10 +19,10 @@ openerp.web.page = function (openerp) {
},
on_loaded: function(data) {
this._super(data);
this.$form_header.find('button.oe_form_button_edit').click(this.on_button_edit);
this.$form_header.find('button.oe_form_button_create').click(this.on_button_create);
this.$form_header.find('button.oe_form_button_duplicate').click(this.on_button_duplicate);
this.$form_header.find('button.oe_form_button_delete').click(this.on_button_delete);
this.$buttons.find('button.oe_form_button_edit').click(this.on_button_edit);
this.$buttons.find('button.oe_form_button_create').click(this.on_button_create);
this.$buttons.find('button.oe_form_button_duplicate').click(this.on_button_duplicate);
this.$buttons.find('button.oe_form_button_delete').click(this.on_button_delete);
},
on_button_edit: function() {
return this.do_switch_view('form');

View File

@ -252,7 +252,9 @@ session.web.ViewManager = session.web.OldWidget.extend({
deferred : $.Deferred(),
controller : null,
options : _.extend({
sidebar_id : self.element_id + '_sidebar_' + view.view_type,
$buttons : self.$element.find('.oe_view_manager_buttons'),
$sidebar : self.$element.find('.oe_view_manager_sidebar'),
$pager : self.$element.find('.oe_view_manager_pager'),
action : self.action,
action_views_ids : views_ids
}, self.flags, self.flags[view.view_type] || {}, view.options || {})
@ -274,9 +276,9 @@ session.web.ViewManager = session.web.OldWidget.extend({
* @returns {jQuery.Deferred} new view loading promise
*/
on_mode_switch: function(view_type, no_store) {
var self = this,
view = this.views[view_type],
view_promise;
var self = this;
var view = this.views[view_type];
var view_promise;
if(!view)
return $.Deferred().reject();
@ -778,17 +780,17 @@ session.web.Sidebar = session.web.Widget.extend({
},
add_toolbar: function(toolbar) {
var self = this;
_.each([['print', _t("Reports")], ['action', _t("Actions")], ['relate', _t("Links")]], function(type) {
var items = toolbar[type[0]];
if (items.length) {
_.each(['print','action','relate'], function(type) {
var items = toolbar[type];
if (items) {
for (var i = 0; i < items.length; i++) {
items[i] = {
label: items[i]['name'],
action: items[i],
classname: 'oe_sidebar_' + type[0]
classname: 'oe_sidebar_' + type
}
}
self.add_items(type[0], items);
self.add_items(type=='print' ? 'print' : 'other', items);
}
});
},
@ -820,11 +822,7 @@ session.web.Sidebar = session.web.Widget.extend({
add_items: function(section_code, items) {
var self = this;
if (items) {
// generate unique id for items
for (var i = 0; i < items.length; i++) {
items[i].element_id = _.uniqueId(section_code + '_item_');
this.items[items[i].element_id] = items[i];
}
this.items[section_code].push.apply(this.items[section_code],items);
this.redraw();
}
},
@ -974,7 +972,7 @@ session.web.TranslateDialog = session.web.Dialog.extend({
}
});
session.web.View = session.web.Widget.extend(/** @lends session.web.View# */{
session.web.View = session.web.Widget.extend({
template: "EmptyComponent",
// name displayed in view switchers
display_name: '',
@ -1014,7 +1012,8 @@ session.web.View = session.web.Widget.extend(/** @lends session.web.View# */{
* Called after a successful call to fields_view_get.
* Must return a promise.
*/
on_loaded: function(fields_view_get) {},
on_loaded: function(fields_view_get) {
},
set_default_options: function(options) {
this.options = options || {};
_.defaults(this.options, {

View File

@ -415,6 +415,8 @@
<div t-attf-id="#{widget.element_id}_search" t-opentag="true"/>
</div>
<div class="oe_view_manager_row">
<div class="oe_view_manager_buttons"/>
<div class="oe_view_manager_sidebar"/>
<div class="oe_view_manager_switch oe_button_group">
<t t-if="widget.views_src.length != 1" t-foreach="widget.views_src" t-as="view">
<button type="button" t-attf-class="oe_vm_switch_#{view.view_type}" t-att-data-view-type="view.view_type" t-att-title="view.label || view.view_type">
@ -422,6 +424,7 @@
</button>
</t>
</div>
<div class="oe_view_manager_pager"/>
</div>
</div>
<div class="oe_view_manager_body">
@ -682,14 +685,34 @@
<div class="oe_form_container"/>
</div>
</t>
<t t-name="PageView" t-extend="FormView">
<t t-jquery=".oe_form_buttons" t-operation="inner">
<button type="button" class="oe_button oe_form_button_edit">Edit</button>
<t t-name="FormView">
<div class="oe_formview">
<div class="oe_form_buttons"/>
<div class="oe_form_sidebar"/>
<div class="oe_form_pager"/>
<div class="oe_form_container"/>
</div>
</t>
<t t-name="FormView.buttons">
<div class="oe_form_buttons" t-if="widget.options.action_buttons !== false">
view:<button type="button" class="oe_button oe_form_button_edit">Edit</button>
<button type="button" class="oe_button oe_form_button_create">Create</button>
<button type="button" class="oe_button oe_form_button_duplicate">Duplicate</button>
<button type="button" class="oe_button oe_form_button_delete">Delete</button>
</t>
edit:<button type="button" class="oe_button oe_form_button_save">Save</button>
<button type="button" class="oe_button oe_form_button_cancel">Cancel</button>
</div>
</t>
<t t-name="FormView.pager">
<div class="oe_form_pager" t-if="widget.options.pager !== false">
<t t-call="ViewPager">
<span class="oe_pager_index">0</span><span class="oe_pager_separator"> / </span><span class="oe_pager_count">0</span>
</t>
</div>
</t>
<t t-name="PageView" t-extend="FormView">
</t>
<t t-name="FormView.sidebar.attachments">
<div class="oe-sidebar-attachments-toolbar">
<div class="oe-binary-file-set" style="float: right">