From b2ec2351e2fe5dda389dfbbe413a90c891fb22a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20van=20der=20Essen?= Date: Wed, 26 Jun 2013 10:30:39 +0200 Subject: [PATCH] [IMP] stock: picking gui initial commit bzr revid: fva@openerp.com-20130626083039-vrwwmwulddkirg83 --- addons/stock/__openerp__.py | 10 +- addons/stock/static/src/css/picking.css | 179 +++++++++++++++++++++++ addons/stock/static/src/js/main.js | 14 ++ addons/stock/static/src/js/widgets.js | 154 ++++++++++++++++++++ addons/stock/static/src/xml/picking.xml | 184 ++++++++++++++++++++++++ 5 files changed, 540 insertions(+), 1 deletion(-) create mode 100644 addons/stock/static/src/css/picking.css create mode 100644 addons/stock/static/src/js/main.js create mode 100644 addons/stock/static/src/js/widgets.js create mode 100644 addons/stock/static/src/xml/picking.xml diff --git a/addons/stock/__openerp__.py b/addons/stock/__openerp__.py index b3d7e30f1ce..a4acc026d7e 100644 --- a/addons/stock/__openerp__.py +++ b/addons/stock/__openerp__.py @@ -98,7 +98,15 @@ Dashboard / Reports for Warehouse Management will include: 'installable': True, 'application': True, 'auto_install': False, - 'css': [ 'static/src/css/stock.css' ], + 'css': [ + 'static/src/css/picking.css', + 'static/src/css/stock.css', + ], + 'js': [ + 'static/src/js/widgets.js', + 'static/src/js/main.js', + ], + 'qweb':['static/src/xml/picking.xml'], } # vim:expandtab:smartindent:tabstop=4:softtabstop=4:shiftwidth=4: diff --git a/addons/stock/static/src/css/picking.css b/addons/stock/static/src/css/picking.css new file mode 100644 index 00000000000..bc131efb715 --- /dev/null +++ b/addons/stock/static/src/css/picking.css @@ -0,0 +1,179 @@ + +/* ----------------------- * + * PICKING WIDGET LAYOUT * + * ----------------------- */ + +.oe_pick_widget { + position: absolute; + top: 0px; right: 0px; bottom: 0px; left: 0px; + color: #444444; + background: #686868; + text-shadow: none; + font-family: 'Lato'; +} +.oe_pick_widget .oe_pick_layout { + width: 100%; + height: 100%; +} + +.oe_pick_widget .oe_pick_header{ + background: red; +} +.oe_pick_widget .oe_pick_body_cont{ + background: blue; + height: 100%; +} +.oe_pick_widget .oe_pick_body{ + width: 100%; + height: 100%; + background: green; + overflow: hidden; + overflow-y: auto; +} +.oe_pick_widget .oe_pick_app{ + width: 600px; + background: yellow; + margin: 40px auto; +} +.oe_pick_widget .oe_pick_toolbar{ + width: 600px; + background: purple; + margin: auto; + text-align: center; +} +.oe_pick_widget .oe_pick_button{ + display: inline-block; + min-width: 120px; + padding: 15px; + margin: 10px; + text-align: center; + line-height: 30px; + background: white; +} +.oe_pick_widget .oe_pick_right_toolbar{ + background: blue; + float: right; +} +.oe_pick_widget .oe_pick_col_small{ width: 50px; } +.oe_pick_widget .oe_pick_col_medium{ width: 100px; } +.oe_pick_widget .oe_pick_col_big{ width: 200px; } +.oe_pick_widget .oe_pick_col_expand{ width: 100%; } +.oe_pick_widget .oe_invalid{ + background: red; + color: white; +} + +/* ----------------------- * + * PICKING TABLES * + * ----------------------- */ + +.oe_pick_widget .oe_pick_list{ + background: red; + margin: 20px 0px; +} + +.oe_pick_widget .oe_pick_list_header{ + background: blue; +} +.oe_pick_widget .oe_pick_list_table{ + width: 100%; + table-layout: fixed; + background: greenyellow; + +} + + + +/* ----------------------- * + * TACTILE LIST * + * ----------------------- */ + +.openerp .oe_tactlist { + border-radius: 3px; + font-size: 18px; + background: black; + color: white; + margin-bottom: 20px; +} +.openerp .oe_tactlist .oe_tactlist_header{ + padding: 5px; + font-size: 24px; + overflow: hidden; +} +.openerp .oe_tactlist .oe_vresizer{ + cursor: ns-resize; + height: 15px; +} +.openerp .oe_tactlist .oe_hresizer{ + display: inline-block; + float: right; + height: 15px; + width: 15px; + line-height: 15px; + text-align: center; + font-size: 9px; + color: rgba(255,255,255,0.3); + cursor: move; +} +.openerp .oe_tactlist .oe_scrolltable{ + position: relative; + background: rgb(209,209,209); +} +.openerp .oe_tactlist td{ + padding: 5px; + box-sizing: border-box; + overflow: hidden; +} +.openerp .oe_tactlist .oe_scrolltable_scroll{ + height: 100%; + overflow-y: scroll; + overflow-x: hidden; +} +.openerp .oe_tactlist .oe_scrolltable_header_container{ + position: absolute; + top: 0px; + overflow: hidden; +} +.openerp .oe_tactlist .oe_scrolltable_header{ + background: black; + color: white; + width: 100%; + table-layout: fixed; +} +.openerp .oe_tactlist .oe_scrolltable_body{ + table-layout: fixed; + margin-top: 32px; + background: #D6D6D6; + color: #444444; +} +.openerp .oe_tactlist .oe_invalid{ + background: rgb(255, 192, 192); + color: rgb(201, 0, 0); +} +.openerp .oe_tactlist .oe_scrolltable_body tr:nth-child(even){ + background: rgba(0,0,0,0.02); +} +.openerp .oe_tactlist td.oe_small, .openerp .oe_tactlist col.oe_small{ width: 50px; } +.openerp .oe_tactlist td.oe_medium, .openerp .oe_tactlist col.oe_medium{ width: 100px; } +.openerp .oe_tactlist td.oe_big, .openerp .oe_tactlist col.oe_big{ width: 200px; } +.openerp .oe_tactlist td.oe_expand, .openerp .oe_tactlist col.oe_expand{ width: 100%; } + +.openerp .oe_tactlist ::-webkit-scrollbar{ + width: 15px; + background-color: black; +} +.openerp .oe_tactlist ::-webkit-scrollbar-track{ + background-color: black; +} +.openerp .oe_tactlist ::-webkit-scrollbar-thumb{ + background-color: rgba(255,255,255,0.6); + border: solid 4px black; +} +.openerp .oe_tactlist ::-wekbit-scrollbar-button{ + display: none; +} + + + + + diff --git a/addons/stock/static/src/js/main.js b/addons/stock/static/src/js/main.js new file mode 100644 index 00000000000..ca345c5e6b1 --- /dev/null +++ b/addons/stock/static/src/js/main.js @@ -0,0 +1,14 @@ +console.log('Executing picking module'); + +openerp.stock = function(instance){ + + console.log('Loading stock picking module'); + + instance.stock = instance.stock || {}; + + openerp_picking_widgets(instance); + + instance.web.client_actions.add('stock.ui', 'instance.stock.PickingMainWidget'); +}; + + diff --git a/addons/stock/static/src/js/widgets.js b/addons/stock/static/src/js/widgets.js new file mode 100644 index 00000000000..44d836511d5 --- /dev/null +++ b/addons/stock/static/src/js/widgets.js @@ -0,0 +1,154 @@ + +function openerp_picking_widgets(instance){ + var module = instance.stock; + + /* + * new TactileListWidget(parent,{ + * height: '500px', + * width: '100%', + * title: 'Sample List', + * collumns: [ + * {header:'Foobar', classes:'oe_small'}, + * {header:'Foobar', classes:'oe_medium'}, + * {header:'' , classes:'oe_big'}, + * {header:'BarFoo', classes:'oe_expand'}, + * ], + * rows: [ + * {cols: [0,1,2,3] }, + * {cols: [1,2,3,4], classes:'oe_selected oe_invalid'}, + * {cols: [2,1,3,4] }, + * ] + * }); + */ + + module.TactileListWidget = instance.web.Widget.extend({ + template: 'TactileListWidget', + init: function(parent, options){ + this._super(parent,options); + this._collumns = options.collumns || []; + this._rows = options.rows || []; + this._title = options.title || ''; + this._width = options.width || 625; + this._height = options.height || 200; + this._scrollbarwidth = 15; + }, + renderElement: function(){ + var self = this; + this._super(); + this.$('.js_vresizer, .js_hresizer').mousedown(function(event){ + self._startsize = {height: self.get_height(), width: self.get_width()}; + console.log('drag init:',self._startsize); + }); + this.$('.js_vresizer').drag(function(event,dragevent){ + self.set_height(self._startsize.height + dragevent.deltaY); + }); + this.$('.js_hresizer').drag(function(event,dragevent){ + self.set_height(self._startsize.height + dragevent.deltaY); + self.set_width(self._startsize.width + dragevent.deltaX); + }); + }, + get_collumns: function(){ + return this._collumns; + }, + get_rows: function(){ + return this._rows; + }, + add_row: function(row){ + this._rows.push(row); + this.renderElement(); + }, + get_title: function(){ + return this._title; + }, + get_width: function(){ + return this._width; + }, + get_innerwidth: function(){ + return this._width - this._scrollbarwidth; + }, + set_width: function(width){ + if(width >= 0){ + this._width = width; + this.$('.js_innerwidth').css({'width':this.get_innerwidth()+'px'}); + this.$el.css({'width':this.get_width()+'px'}); + } + }, + get_height: function(){ + return this._height; + }, + set_height: function(height){ + if(height >= 0){ + this._height = height; + this.$('.js_height').css({'height':this.get_height()+'px'}); + } + }, + }); + + module.PickingEditorWidget = instance.web.Widget.extend({ + template: 'PickingEditorWidget', + get_header: function(){ + return 'Picking: INTERNAL/00112'; + }, + get_rows: function(){ + return [ + { cols: { product:'abc', qty:1, rem: 4, uom: 5, loc: 'def', stat: 'available' }, }, + { cols: { product:'dec', qty:2, rem: 3, uom: 5, loc: 'rcd', stat: 'available' }, classes: 'oe_invalid' }, + { cols: { product:'qcr', qty:4, rem: 4, uom: 5, loc: 'hre', stat: 'unavailable' }, }, + ]; + }, + }); + + module.PackageEditorWidget = instance.web.Widget.extend({ + template: 'PackageEditorWidget', + get_header: function(){ + return 'Package: 032 '; + }, + get_rows: function(){ + return [ + { cols: { product:'abc', qty:1, uom: 5, }, }, + { cols: { product:'dec', qty:2, uom: 5, }, classes: 'oe_invalid' }, + { cols: { product:'qcr', qty:4, uom: 5, }, }, + ]; + }, + }); + + module.PackageSelectorWidget = instance.web.Widget.extend({ + template: 'PackageSelectorWidget', + get_header: function(){ + return 'Package Selector'; + }, + get_rows: function(){ + return [ + { cols: { pack:'abc' }, }, + { cols: { pack:'def' }, classes: 'oe_invalid' }, + { cols: { pack:'ghi' }, }, + ]; + }, + increment: function(){ + }, + decrement: function(){ + }, + }); + + module.PickingMainWidget = instance.web.Widget.extend({ + template: 'PickingMainWidget', + init: function(){ + + }, + start: function(){ + var self = this; + instance.webclient.set_content_full_screen(true); + + var picking_editor = new module.PickingEditorWidget(this); + picking_editor.replace(this.$('.oe_placeholder_picking_editor')); + + var package_editor = new module.PackageEditorWidget(this); + package_editor.replace(this.$('.oe_placeholder_package_editor')); + + var package_selector = new module.PackageSelectorWidget(this); + package_selector.replace(this.$('.oe_placeholder_package_selector')); + + return this._super(); + }, + }); +} diff --git a/addons/stock/static/src/xml/picking.xml b/addons/stock/static/src/xml/picking.xml new file mode 100644 index 00000000000..8b6847a54b0 --- /dev/null +++ b/addons/stock/static/src/xml/picking.xml @@ -0,0 +1,184 @@ + + + + +
+
+ +
+ +
+
+
+ + + + + + + + +
+ +
+
+ + + + + + + + + + + + + + + +
+
+
+
+ ● +
+
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Product Qty Rem UoM Location Status
+
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + +
Product Qty UoM
+
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + +
Package
+ -
+
+ + + +
+ + + + + + + +
+ +
+
Quit
+
+ +
+
Pack
+
Reset
+
Done
+
+ + +
+
+
+ +
+
+
+ +
+
+
+
+ + +