[MERGE] stock.ui: first draft of the point of picking ui
bzr revid: fva@openerp.com-20130626144439-uce3tojbb9iruc75
This commit is contained in:
Frédéric van der Essen
@@ -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:
|
||||
|
||||
@@ -0,0 +1,134 @@
|
||||
|
||||
/* ----------------------- *
|
||||
* 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: #454343;
|
||||
background-image: linear-gradient(#646060,#262626);
|
||||
}
|
||||
.oe_pick_widget .oe_pick_body_cont{
|
||||
height: 100%;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_body{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: white;
|
||||
background: url('/web/static/src/img/form_sheetbg.png');
|
||||
box-shadow: 0px 9px 5px -5px rgba(0, 0, 0, 0.16) inset;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_app{
|
||||
width: 600px;
|
||||
background: white;
|
||||
margin: 40px auto;
|
||||
padding: 20px;
|
||||
border: solid 1px rgb(228, 228, 255);
|
||||
box-shadow: 0px 2px 3px rgba(114, 114, 175, 0.11);
|
||||
}
|
||||
.oe_pick_widget .oe_pick_toolbar{
|
||||
width: 600px;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_button{
|
||||
display: inline-block;
|
||||
min-width: 120px;
|
||||
padding: 5px;
|
||||
font-size: 18px;
|
||||
border-radius: 3px;
|
||||
margin: 10px 5px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
background: linear-gradient(#b2b3d7, #7f82ac);
|
||||
color: #273072;
|
||||
border: 1px solid #353A7E;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
|
||||
cursor: pointer;
|
||||
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
.oe_pick_widget .oe_pick_right_toolbar{
|
||||
float: right;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_right_toolbar .oe_pick_button{
|
||||
margin-right: 10px;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_col_small{ width: 60px; }
|
||||
.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_centeralign{ text-align: center; }
|
||||
|
||||
.oe_pick_widget .oe_invalid{
|
||||
background: rgb(255, 226, 226);
|
||||
color: rgb(168, 6, 6);
|
||||
}
|
||||
|
||||
/* ----------------------- *
|
||||
* PICKING TABLES *
|
||||
* ----------------------- */
|
||||
|
||||
.oe_pick_widget .oe_pick_list{
|
||||
margin: 0px 0px 20px 0px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.oe_pick_widget .oe_pick_list_header{
|
||||
font-size: 20px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_list_table{
|
||||
background: whitesmoke;
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
font-size: 16px;
|
||||
border-radius: 3px;
|
||||
|
||||
}
|
||||
.oe_pick_widget .oe_pick_list_table tbody tr:nth-child(odd){
|
||||
background: rgb(250,250,250);
|
||||
}
|
||||
.oe_pick_widget .oe_pick_list_table td,
|
||||
.oe_pick_widget .oe_pick_list_table th {
|
||||
padding: 5px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_list_table thead{
|
||||
background: rgb(224, 225, 235);
|
||||
border-top-left-radius: 3px;
|
||||
border-top-right-radius: 3px;
|
||||
}
|
||||
.oe_pick_widget .oe_pick_list_table th {
|
||||
background: none;
|
||||
border: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
.oe_pick_widget .oe_row_button{
|
||||
display: inline-block;
|
||||
background: rgb(255, 255, 255);
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
line-height: 14px;
|
||||
color: rgb(102, 98, 133);
|
||||
font-weight: bold;
|
||||
border-radius: 9px;
|
||||
border: solid 1px rgba(0, 0, 0, 0.09);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
@@ -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');
|
||||
};
|
||||
|
||||
|
||||
@@ -0,0 +1,124 @@
|
||||
|
||||
function openerp_picking_widgets(instance){
|
||||
var module = instance.stock;
|
||||
|
||||
module.PickingEditorWidget = instance.web.Widget.extend({
|
||||
template: 'PickingEditorWidget',
|
||||
init: function(parent,options){
|
||||
this._super(parent,options);
|
||||
},
|
||||
get_header: function(){
|
||||
return this._header || 'Picking: INTERNAL/00112';
|
||||
},
|
||||
get_rows: function(){
|
||||
var model = this.getParent();
|
||||
var rows = [];
|
||||
console.log('Parent:', this.getParent());
|
||||
|
||||
_.each( model.movelines, function(moveline){
|
||||
console.log('Moveline:',moveline);
|
||||
rows.push({
|
||||
cols: { product: moveline.product_id[1],
|
||||
qty: moveline.product_qty,
|
||||
rem: moveline.qty_remaining,
|
||||
uom: moveline.product_uom[1],
|
||||
loc: moveline.location_id[1],
|
||||
stat: moveline.state
|
||||
},
|
||||
classes: (moveline.qty_remaining < 0 ? 'oe_invalid' : '')
|
||||
});
|
||||
});
|
||||
|
||||
return rows;
|
||||
},
|
||||
});
|
||||
|
||||
module.PackageEditorWidget = instance.web.Widget.extend({
|
||||
template: 'PackageEditorWidget',
|
||||
get_header: function(){
|
||||
return this._header || 'Package: 032 ';
|
||||
},
|
||||
get_rows: function(){
|
||||
return this._rows || [
|
||||
{ cols: { product:'abc', qty:1, uom: 5, }, },
|
||||
{ cols: { product:'dec', qty:2, uom: 5, }, classes: '' },
|
||||
{ cols: { product:'qcr', qty:4, uom: 5, }, },
|
||||
];
|
||||
},
|
||||
});
|
||||
|
||||
module.PackageSelectorWidget = instance.web.Widget.extend({
|
||||
template: 'PackageSelectorWidget',
|
||||
get_header: function(){
|
||||
return this._header || 'Package Selector';
|
||||
},
|
||||
get_rows: function(){
|
||||
return this._rows || [
|
||||
{ cols: { pack:'abc', qty:12 }, },
|
||||
{ cols: { pack:'def', qty:500 }, classes: '' },
|
||||
{ cols: { pack:'ghi', qty:1 }, },
|
||||
];
|
||||
},
|
||||
});
|
||||
|
||||
module.PickingMainWidget = instance.web.Widget.extend({
|
||||
template: 'PickingMainWidget',
|
||||
init: function(parent,params){
|
||||
this._super(parent,params);
|
||||
var self = this;
|
||||
|
||||
this.picking = null;
|
||||
this.movelines = null;
|
||||
|
||||
window.pickwidget = this;
|
||||
|
||||
console.log('Action params:', params);
|
||||
|
||||
this.loaded = new instance.web.Model('stock.picking.in')
|
||||
.query()
|
||||
.all()
|
||||
.then(function(picking_in){
|
||||
self.picking = picking_in[0];
|
||||
console.log('Picking In:',picking_in);
|
||||
|
||||
return new instance.web.Model('stock.move').call('read',[self.picking.move_lines, []]);
|
||||
}).then(function(movelines){
|
||||
self.movelines = movelines;
|
||||
console.log('Move Lines:',movelines);
|
||||
});
|
||||
|
||||
},
|
||||
start: function(){
|
||||
var self = this;
|
||||
instance.webclient.set_content_full_screen(true);
|
||||
|
||||
this.$('.js_pick_quit').click(function(){ self.quit(); });
|
||||
|
||||
$.when(this.loaded).done(function(){
|
||||
var picking_editor = new module.PickingEditorWidget(self);
|
||||
picking_editor.replace(self.$('.oe_placeholder_picking_editor'));
|
||||
|
||||
var package_editor = new module.PackageEditorWidget(self);
|
||||
package_editor.replace(self.$('.oe_placeholder_package_editor'));
|
||||
|
||||
var package_selector = new module.PackageSelectorWidget(self);
|
||||
package_selector.replace(self.$('.oe_placeholder_package_selector'));
|
||||
});
|
||||
|
||||
|
||||
return this._super();
|
||||
},
|
||||
scan: function(ean){
|
||||
new instance.web.Model('stock.picking')
|
||||
.call('get_barcode_and_return_todo_stuff', [this.picking.id, ean])
|
||||
.then(function(results){
|
||||
console.log('STUFF TODO:', arguments);
|
||||
});
|
||||
},
|
||||
quit: function(){
|
||||
console.log('Quit');
|
||||
instance.webclient.set_content_full_screen(false);
|
||||
window.location = '/'; // FIXME THIS IS SHIT NIV WILL KILL YOU (BY MULTIPLE FACE-STABBING) IF YOU MERGE THIS IN TRUNK
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,193 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<templates id="template" xml:space="preserve">
|
||||
|
||||
<t t-name="TactileListWidget">
|
||||
<div class='oe_tactlist js_width' t-att-style="'width:' + widget.get_width() + 'px'">
|
||||
<div class='oe_tactlist_header'>
|
||||
<t t-esc='widget.get_title()' />
|
||||
</div>
|
||||
|
||||
<div class='oe_scrolltable js_height' t-att-style="'height:' + widget.get_height() + 'px'">
|
||||
<div class='oe_scrolltable_scroll'>
|
||||
<div class='oe_scrolltable_header_container js_innerwidth' t-att-style="'width:' + widget.get_innerwidth() + 'px'">
|
||||
<table class='oe_scrolltable_header js_innerwidth' >
|
||||
<tbody>
|
||||
<tr>
|
||||
<t t-foreach="widget.get_collumns()" t-as="col">
|
||||
<td t-att-class="col.classes">
|
||||
<t t-esc="col.header" />
|
||||
</td>
|
||||
</t>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<table class='oe_scrolltable_body js_innerwidth' t-att-style="'width:' + widget.get_innerwidth() + 'px'">
|
||||
<colgroup>
|
||||
<t t-foreach="widget.get_collumns()" t-as="col">
|
||||
<col t-att-class="col.classes"></col>
|
||||
</t>
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<t t-foreach="widget.get_rows()" t-as="row">
|
||||
<tr t-att-class="row.classes">
|
||||
<t t-foreach="row.cols" t-as="col">
|
||||
<td><t t-esc="col" /></td>
|
||||
</t>
|
||||
</tr>
|
||||
</t>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class='oe_vresizer js_vresizer'>
|
||||
<span class='oe_hresizer js_hresizer'>●</span>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
<t t-name='PickingEditorWidget'>
|
||||
<div class='oe_pick_list'>
|
||||
<div class='oe_pick_list_header'><t t-esc="widget.get_header()" /></div>
|
||||
<table class='oe_pick_list_table'>
|
||||
|
||||
<colgroup>
|
||||
<col class='oe_pick_col_expand'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
<col class='oe_pick_col_expand'></col>
|
||||
<col class='oe_pick_col_expand'></col>
|
||||
</colgroup>
|
||||
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Product</th>
|
||||
<th class='oe_centeralign'>Qty</th>
|
||||
<th class='oe_centeralign'>Rem</th>
|
||||
<th class='oe_centeralign'>UoM</th>
|
||||
<th>Location</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
<t t-foreach="widget.get_rows()" t-as="row">
|
||||
<tr t-att-class="row.classes">
|
||||
<td> <t t-esc="row.cols.product" /> </td>
|
||||
<td class='oe_centeralign'> <t t-esc="row.cols.qty" /> </td>
|
||||
<td class='oe_centeralign'> <t t-esc="row.cols.rem" /> </td>
|
||||
<td class='oe_centeralign'> <t t-esc="row.cols.uom" /> </td>
|
||||
<td> <t t-esc="row.cols.loc" /> </td>
|
||||
<td> <t t-esc="row.cols.stat" /> </td>
|
||||
</tr>
|
||||
</t>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
<t t-name='PackageEditorWidget'>
|
||||
<div class='oe_pick_list'>
|
||||
<div class='oe_pick_list_header'> <t t-esc="widget.get_header()" /> </div>
|
||||
<table class='oe_pick_list_table'>
|
||||
|
||||
<colgroup>
|
||||
<col class='oe_pick_col_expand'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
</colgroup>
|
||||
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Product</th>
|
||||
<th class='oe_centeralign'>Qty</th>
|
||||
<th class='oe_centeralign'>UoM</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
<t t-foreach="widget.get_rows()" t-as="row">
|
||||
<tr t-att-class="row.classes">
|
||||
<td> <t t-esc="row.cols.product" /> </td>
|
||||
<td class='oe_centeralign'> <t t-esc="row.cols.qty" /> </td>
|
||||
<td class='oe_centeralign'> <t t-esc="row.cols.uom" /> </td>
|
||||
</tr>
|
||||
</t>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
<t t-name='PackageSelectorWidget'>
|
||||
<div class='oe_pick_list'>
|
||||
<div class='oe_pick_list_header'> <t t-esc="widget.get_header()" /> </div>
|
||||
<table class='oe_pick_list_table'>
|
||||
|
||||
<colgroup>
|
||||
<col class='oe_pick_col_expand'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
<col class='oe_pick_col_small'></col>
|
||||
</colgroup>
|
||||
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Package</th> <th class='oe_centeralign'>Qty</th> <th></th> <th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
<t t-foreach="widget.get_rows()" t-as="row">
|
||||
<tr t-att-class="row.classes">
|
||||
<td> <t t-esc="row.cols.pack" /> </td>
|
||||
<td class='oe_centeralign'> <t t-esc="row.cols.qty" /> </td>
|
||||
<td class='oe_centeralign'> <span class='oe_row_button js_pick_plus'>+</span> </td>
|
||||
<td class='oe_centeralign'> <span class='oe_row_button js_pick_minus'>-</span> </td>
|
||||
</tr>
|
||||
</t>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
<t t-name="PickingMainWidget">
|
||||
<div class='oe_pick_widget'>
|
||||
<table class='oe_pick_layout'>
|
||||
<tr class='oe_pick_header_row'>
|
||||
<td class='oe_pick_header'>
|
||||
|
||||
<div class='oe_pick_right_toolbar'>
|
||||
<div class='oe_pick_button js_pick_quit'> Quit </div>
|
||||
</div>
|
||||
|
||||
<div class='oe_pick_toolbar'>
|
||||
<div class='oe_pick_button js_pick_pack'> Pack </div>
|
||||
<!-- <div class='oe_pick_button js_pick_reset'> Reset </div> -->
|
||||
<div class='oe_pick_button js_pick_done'> Done </div>
|
||||
</div>
|
||||
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr class='oe_pick_body_row'>
|
||||
<td class='oe_pick_body_cont'>
|
||||
<div class='oe_pick_body'>
|
||||
<div class='oe_pick_app'>
|
||||
|
||||
<div class='oe_placeholder_picking_editor'></div>
|
||||
<div class='oe_placeholder_package_editor'></div>
|
||||
<div class='oe_placeholder_package_selector'></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
</templates>
|
||||
Reference in New Issue
Block a user