pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[MERGE] stock_picking_ui: ui fixes and responsiveness for mobile devices

Browse Source 
bzr revid: fva@openerp.com-20131118101834-mx42iuhk34bxng38
This commit is contained in:
Frédéric van der Essen
2013-11-18 11:18:34 +01:00
parent f8a32c79ba b7161d918a
commit f7ac335aec
3 changed files with 178 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/stock/static/src/css/picking.css
+68 -3
View File
@@ -67,6 +67,7 @@
}
.oe_pick_widget .oe_pick_button.oe_disabled {
cursor: default;
background-color: #5A5A5A;
background: linear-gradient(#666666, #474747);
border: solid 1px rgb(44, 44, 44);
color: rgb(53, 53, 53);
@@ -89,7 +90,7 @@
}
.oe_pick_widget .oe_pick_right_toolbar{
float: right;
border-left: solid 1px black;
border-left: solid 1px rgba(0,0,0,0.3);
padding-left: 8px;
padding-right: 8px;
margin-left: 8px;
@@ -104,7 +105,11 @@
background: rgb(255, 226, 226);
color: rgb(168, 6, 6);
}
.oe_pick_widget .oe_pick_app_header{
font-size: 24px;
margin-left: 5px;
margin-bottom: 10px;
}
.oe_pick_widget .oe_pick_app_title{
font-size: 20px;
margin-top: 0px;
@@ -118,6 +123,8 @@
opacity: 0.5;
}
/* ----------------------- *
* PICKING TABLES *
* ----------------------- */
@@ -172,7 +179,12 @@
border: solid 1px rgba(0, 0, 0, 0.09);
cursor: pointer;
}
.oe_pick_widget .js_pack_select{
.oe_pick_widget .oe_expanded{
text-align: center;
min-width: 32px;
}
.oe_pick_widget .js_pack_select,
.oe_pick_widget .js_pack_op{
cursor: pointer;
}
@@ -224,3 +236,56 @@
border-radius: 3px;
color: rgb(119, 77, 77);
}
/* ----------------------- *
* RESPONSIVENESS *
* ----------------------- */
@media screen and (max-width:642px){
.oe_pick_widget .oe_pick_body{
background: white;
background-image: none;
box-shadow: none;
}
.oe_pick_widget .oe_pick_app{
width: auto;
max-width: 600px;
margin: 0 auto;
border: none;
box-shadow: none;
padding-left: 5px;
padding-right: 5px;
}
.oe_pick_widget .oe_pick_toolbar{
width: auto;
}
.oe_pick_widget .oe_pick_right_toolbar{
float: none;
text-align: center;
border-left: none;
margin-left: 0px;
}
.oe_pick_widget .oe_pick_button{
margin-top: 3px;
margin-bottom: 3px;
}
}
@media screen and (max-width:450px){
.oe_pick_widget .oe_pick_list_header{
font-size: 16px;
}
.oe_pick_widget .oe_pick_list_table{
font-size: 12px;
}
.oe_pick_widget .oe_pick_col_small{
width: 50px;
}
}
@media screen and (max-width:326px){
.oe_pick_widget .oe_pick_toolbar{
width: 326px;
}
}
addons/stock/static/src/js/widgets.js
+95 -12
View File
@@ -5,15 +5,28 @@ function openerp_picking_widgets(instance){
var _t = instance.web._t;
var QWeb = instance.web.qweb;
// This widget makes sure that the scaling is disabled on mobile devices.
// Widgets that want to display fullscreen on mobile phone need to extend this
// widget.
module.MobileWidget = instance.web.Widget.extend({
start: function(){
if(!$('#oe-mobilewidget-viewport').length){
$('head').append('<meta id="oe-mobilewidget-viewport" name="viewport" content="initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">');
}
return this._super();
},
destroy: function(){
$('#oe-mobilewidget-viewport').remove();
return this._super();
},
});
module.PickingEditorWidget = instance.web.Widget.extend({
template: 'PickingEditorWidget',
init: function(parent,options){
this._super(parent,options);
},
get_header: function(){
var model = this.getParent();
return 'Picking: '+model.picking.name;
},
get_rows: function(){
var model = this.getParent();
var rows = [];
@@ -25,7 +38,7 @@ function openerp_picking_widgets(instance){
rem: moveline.remaining_qty,
uom: moveline.product_uom[1],
loc: moveline.location_id[1],
stat: moveline.state
id: moveline.product_id[0],
},
classes: (moveline.qty_remaining < 0 ? 'oe_invalid' : '')
});
@@ -33,6 +46,15 @@ function openerp_picking_widgets(instance){
return rows;
},
renderElement: function(){
var self = this;
this._super();
this.$('.js_pack_scan').click(function(){
var id = parseInt($(this).attr('op-id'));
console.log('Id:',id);
self.getParent().scan_product_id(id);
});
},
});
module.PackageEditorWidget = instance.web.Widget.extend({
@@ -53,12 +75,24 @@ function openerp_picking_widgets(instance){
product: op.product_id[1],
uom: op.product_uom ? product_uom[1] : '',
qty: op.product_qty,
}
},
classes: 'js_pack_op '+ (op.id === model.get_selected_operation() ? 'oe_selected' : ''),
att_op_id: op.id,
});
});
return rows;
},
renderElement: function(){
var self = this;
this._super();
var model = this.getParent();
this.$('.js_pack_op').click(function(){
self.$('.js_pack_op').removeClass('oe_selected');
$(this).addClass('oe_selected');
model.set_selected_operation(parseInt($(this).attr('op-id')));
});
},
});
module.PackageSelectorWidget = instance.web.Widget.extend({
@@ -99,7 +133,7 @@ function openerp_picking_widgets(instance){
},
});
module.PickingMenuWidget = instance.web.Widget.extend({
module.PickingMenuWidget = module.MobileWidget.extend({
template: 'PickingMenuWidget',
init: function(parent, params){
this._super(parent,params);
@@ -150,6 +184,7 @@ function openerp_picking_widgets(instance){
});
},
start: function(){
this._super();
var self = this;
this.barcode_scanner.connect(function(barcode){
self.on_scan(barcode);
@@ -245,7 +280,7 @@ function openerp_picking_widgets(instance){
});
openerp.web.client_actions.add('stock.menu', 'instance.stock.PickingMenuWidget');
module.PickingMainWidget = instance.web.Widget.extend({
module.PickingMainWidget = module.MobileWidget.extend({
template: 'PickingMainWidget',
init: function(parent,params){
this._super(parent,params);
@@ -255,6 +290,7 @@ function openerp_picking_widgets(instance){
this.pickings = [];
this.movelines = null;
this.operations = null;
this.selected_operation = { id: null, picking_id: null};
this.packages = null;
this.barcode_scanner = new module.BarcodeScanner();
this.picking_type_id = params.context.active_id || 0;
@@ -265,6 +301,7 @@ function openerp_picking_widgets(instance){
}else{
this.loaded = this.load();
}
},
// load the picking data from the server. If picking_id is undefined, it will take the first picking
@@ -351,6 +388,7 @@ function openerp_picking_widgets(instance){
},
start: function(){
this._super();
var self = this;
instance.webclient.set_content_full_screen(true);
this.connect_numpad();
@@ -397,6 +435,8 @@ function openerp_picking_widgets(instance){
self.$('.js_pick_next').removeClass('oe_disabled');
}
self.$('.oe_pick_app_header').text(self.get_header());
});
@@ -411,6 +451,7 @@ function openerp_picking_widgets(instance){
self.picking_editor.renderElement();
self.package_editor.renderElement();
self.package_selector.renderElement();
if( self.picking.id === self.pickings[0]){
self.$('.js_pick_prev').addClass('oe_disabled');
}else{
@@ -422,8 +463,17 @@ function openerp_picking_widgets(instance){
}else{
self.$('.js_pick_next').removeClass('oe_disabled');
}
self.$('.oe_pick_app_header').text(self.get_header());
});
},
get_header: function(){
if(this.picking){
return _t('Picking:') +' '+this.picking.name;
}else{
return _t('Picking:');
}
},
menu: function(){
this.do_action({
type: 'ir.actions.client',
@@ -434,11 +484,21 @@ function openerp_picking_widgets(instance){
});
},
scan: function(ean){
scan: function(ean){ //scans a barcode, sends it to the server, then reload the ui
var self = this;
new instance.web.Model('stock.picking')
.call('get_barcode_and_return_todo_stuff', [self.picking.id, ean])
.then(function(){
self.reset_selected_operation();
return self.refresh_ui(self.picking.id);
});
},
scan_product_id: function(product_id){ //performs the same operation as a scan, but with product id instead
var self = this;
new instance.web.Model('stock.picking')
.call('get_product_id_and_return_todo_stuff', [self.picking.id, product_id])
.then(function(){
self.reset_selected_operation();
return self.refresh_ui(self.picking.id);
});
},
@@ -538,15 +598,38 @@ function openerp_picking_widgets(instance){
}
ops.push(op);
});
console.log('Current Operations:',ops);
return ops;
},
get_selected_operation: function(){
if( this.selected_operation.picking_id === this.picking.id && this.selected_operation.id ){
return this.selected_operation.id;
}else{
this.selected_operation.picking_id = this.picking.id;
var ops = this.get_current_operations();
if(ops.length === 0){
this.selected_operation.id = null;
}else{
this.selected_operation.id = ops[ops.length - 1].id;
}
return this.selected_operation.id;
}
},
reset_selected_operation: function(){
if(this.selected_operation.picking_id === this.picking.id){
this.selected_operation.id = null;
}
},
set_selected_operation: function(id){
this.selected_operation.picking_id = this.picking.id;
this.selected_operation.id = id;
},
set_operation_quantity: function(quantity){
var self = this;
var ops = this.get_current_operations();
if( !ops || ops.length === 0){
var op = this.get_selected_operation();
if( !op ){
return;
}
var op = ops[ops.length-1];
if(quantity === '++'){
quantity = op.product_qty + 1;
addons/stock/static/src/xml/picking.xml
+15 -7
View File
@@ -48,7 +48,9 @@
<t t-name='PickingEditorWidget'>
<div class='oe_pick_list'>
<div class='oe_pick_list_header'><t t-esc="widget.get_header()" /></div>
<div class='oe_pick_list_header'>
Operations To Process
</div>
<table class='oe_pick_list_table'>
<colgroup>
@@ -57,7 +59,7 @@
<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>
<col class='oe_pick_col_small'></col>
</colgroup>
<thead>
@@ -67,7 +69,7 @@
<th class='oe_centeralign'>Rem</th>
<th class='oe_centeralign'>UoM</th>
<th>Location</th>
<th>Status</th>
<th>Scan</th>
</tr>
</thead>
@@ -79,7 +81,7 @@
<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>
<td><span class='oe_row_button oe_expanded js_pack_scan' t-att-op-id='row.cols.id'>➔</span></td>
</tr>
</t>
</tbody>
@@ -109,7 +111,7 @@
<tbody>
<t t-foreach="widget.get_rows()" t-as="row">
<tr t-att-class="row.classes">
<tr t-att-class="row.classes" t-att-op-id="row.att_op_id">
<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>
@@ -123,7 +125,7 @@
<t t-name='PackageSelectorWidget'>
<div class='oe_pick_list'>
<div class='oe_pick_list_header'> <t t-esc="widget.get_header()" /> </div>
<div class='oe_pick_list_header'><t t-esc="widget.get_header()" /></div>
<table class='oe_pick_list_table'>
<colgroup>
@@ -210,7 +212,10 @@
<t t-if="widget.pickings_by_type[type.id].length === 0">
<span class='oe_pick_app_info'>Nothing to do</span>
</t>
<t t-if="widget.pickings_by_type[type.id].length > 0">
<t t-if="widget.pickings_by_type[type.id].length === 1">
<span class='oe_pick_app_info'>1 picking</span>
</t>
<t t-if="widget.pickings_by_type[type.id].length > 1">
<span class='oe_pick_app_info'><t t-esc="widget.pickings_by_type[type.id].length" /> pickings </span>
</t>
</div>
@@ -248,6 +253,9 @@
<td class='oe_pick_body_cont'>
<div class='oe_pick_body'>
<div class='oe_pick_app'>
<div class='oe_pick_app_header'>
<t t-esc='widget.get_header()' />
</div>
<div class='oe_placeholder_picking_editor'></div>
<div class='oe_placeholder_package_editor'></div>