[FIX]barcode interface, redo of menu interface to use kanban view instead of table

bzr revid: csn@openerp.com-20140228105231-2wjgbri012wd4mna

4 files changed, 107 insertions, 61 deletions

diff --git a/addons/stock/controllers/main.py b/addons/stock/controllers/main.py
index 8db24ea8730..8f94a517d69 100644
--- a/addons/stock/controllers/main.py
+++ b/addons/stock/controllers/main.py
@@ -28,6 +28,7 @@ html_template = """<!DOCTYPE html>
         <link rel="shortcut icon" href="/web/static/src/img/favicon.ico" type="image/x-icon"/>
         <link rel="stylesheet" href="/stock/static/src/css/barcode.css" />
         <link rel="stylesheet" href="/web/static/lib/bootstrap/css/bootstrap.css" /> 
+        <link rel="stylesheet" href="/web/static/lib/fontawesome/css/font-awesome.css" />
         %(js)s
         <script type="text/javascript">
             $(function() {
diff --git a/addons/stock/static/src/css/barcode.css b/addons/stock/static/src/css/barcode.css
index 8d095bbecb3..046baeaa23d 100644
--- a/addons/stock/static/src/css/barcode.css
+++ b/addons/stock/static/src/css/barcode.css
@@ -1,3 +1,56 @@
+.oe_kanban.oe_picking {
+	min-height: 80px;
+	margin-bottom: 10px;
+	border: 1px solid rgba(0, 0, 0, 0.16);
+  	border-bottom-color: rgba(0, 0, 0, 0.3);
+  	-webkit-transition: -webkit-transform, -webkit-box-shadow, border 200ms linear;
+  	-moz-border-radius: 4px;
+  	-webkit-border-radius: 4px;
+  	border-radius: 4px;
+  	padding: 5px;
+}
+
+.oe_kanban_color_0 {
+  background-color: white;
+  color: #5a5a5a;
+}
+.oe_kanban_color_1 {
+  background-color: #cccccc;
+  color: #424242;
+}
+.oe_kanban_color_2 {
+  background-color: #ffc7c7;
+  color: #7a3737;
+}
+.oe_kanban_color_3 {
+  background-color: #fff1c7;
+  color: #756832;
+}
+.oe_kanban_color_4 {
+  background-color: #e3ffc7;
+  color: #5d6937;
+}
+.oe_kanban_color_5 {
+  background-color: #c7ffd5;
+  color: #1a7759;
+}
+.oe_kanban_color_6 {
+  background-color: #c7ffff;
+  color: #1a5d83;
+}
+.oe_kanban_color_7 {
+  background-color: #c7d5ff;
+  color: #3b3e75;
+}
+.oe_kanban_color_8 {
+  background-color: #e3c7ff;
+  color: #4c3668;
+}
+.oe_kanban_color_9 {
+  background-color: #ffc7f1;
+  color: #6d2c70;
+}
+
 /*hide OpenERP leftbar, table should use all width by default and display vertical scrollbar if needed*/
 .oe_leftbar {
     display: none;
diff --git a/addons/stock/static/src/js/widgets.js b/addons/stock/static/src/js/widgets.js
index 04faf9245ee..6006f646a0f 100644
--- a/addons/stock/static/src/js/widgets.js
+++ b/addons/stock/static/src/js/widgets.js
@@ -163,7 +163,6 @@ function openerp_picking_widgets(instance){
             return new instance.web.Model('stock.picking.type').get_func('search_read')([],[])
                 .then(function(types){
                     self.picking_types = types;
-                    
                     for(var i = 0; i < types.length; i++){
                         self.pickings_by_type[types[i].id] = [];
                     }
@@ -173,7 +172,6 @@ function openerp_picking_widgets(instance){
                                                                   
                 }).then(function(pickings){
                     self.pickings = pickings;
-
                     for(var i = 0; i < pickings.length; i++){
                         var picking = pickings[i];
                         self.pickings_by_type[picking.picking_type_id[0]].push(picking);
diff --git a/addons/stock/static/src/xml/picking.xml b/addons/stock/static/src/xml/picking.xml
index 41aae87a055..bda5108b16b 100644
--- a/addons/stock/static/src/xml/picking.xml
+++ b/addons/stock/static/src/xml/picking.xml
@@ -159,62 +159,59 @@
     </t>
 
     <t t-name="PickingMenuWidget">
-        <div class="row">
-                <div class="navbar navbar-inverse navbar-static-top" role="navigation">
-                    <div class="container">
-                        <div class="navbar-header navbar-form navbar-right">
-                            <div class='form-group'>
-                                <input type='text' class="oe_searchbox form-control" placeholder='Search'/>
-                                <button type="button" class="btn btn-danger js_pick_quit">Quit</button>
-                            </div>
-                            
-                        </div>
+        <div class="navbar navbar-inverse navbar-static-top" role="navigation">
+            <div class="container">
+                <!-- <div class="navbar-header navbar-form"> -->
+                    <div class="navbar-header navbar-form navbar-left">
+                    <input type='text' class="oe_searchbox form-control pull-left" placeholder='Search'/>
+                </div>
+                <div class="navbar-header navbar-form navbar-right">
+                    <!-- <div class='form-group'> -->
+                        <button type="button" class="btn btn-danger js_pick_quit pull-right">Quit</button>
                     </div>
+                    
                 </div>
+            <!-- </div> -->
         </div>
-        <div class="row">
-            <div class="col-md-8 col-md-offset-2">
-                <div class="jumbotron">
-                    <div class="container">
-                        <h3><span class="oe_title_label label label-info">Pickings</span></h3>
-                        <div class='oe_picking_not_found alert alert-warning hidden'>
-                            Scanned picking could not be found
-                        </div>
-
-                        <div class='oe_picking_search_results'>
-                        </div>
+        <div class="container">
+            <div class="row">
+                <div class="col-md-12">
+                    <h2 class="oe_title_label">Pickings</h2>
+                    <div class='oe_picking_not_found alert alert-warning hidden'>
+                        Scanned picking could not be found
+                    </div>
 
-                        <div class='oe_picking_categories'>
-                            <p>
-                                Select the type of picking you want to process.
-                            </p>
-                            <table class="table table-striped">
-                                
-                            <t t-foreach="widget.picking_types" t-as="type">
-                                <tr>
-                                    <td>
-                                        <div t-att-class="'oe_picking ' + (widget.pickings_by_type[type.id].length === 0 ? 'oe_empty':'js_pick_last') " 
-                                             t-att-data-id="type.id">
+                    <div class='oe_picking_search_results'>
+                    </div>
 
-                                            <span><t t-esc="type.complete_name"/></span>
-                                            <t t-if="widget.pickings_by_type[type.id].length > 0">
-                                                <span class='badge pull-right'><t t-esc="widget.pickings_by_type[type.id].length" /> picking(s) </span>
-                                            </t>
-                                        </div>
-                                    </td>
-                                </tr>
-                            </t>
-                            </table>
-                        </div>
+                    <div class='oe_picking_categories'>
+                        <p>
+                            Select the type of picking you want to process.
+                        </p>
                     </div>
                 </div>
             </div>
+            <div class="row oe_picking_categories">
+                <t t-foreach="widget.picking_types" t-as="type">
+                    <div class="col-lg-3 col-md-4">
+                        <div t-att-class="'oe_kanban oe_picking oe_kanban_color_' + type.color + ' ' + (widget.pickings_by_type[type.id].length === 0 ? 'oe_empty':'js_pick_last') " 
+                                         t-att-data-id="type.id">
+                            <t t-if="type.code == 'incoming'" ><span class="fa fa-sign-in fa-2x"></span></t>
+                            <t t-if="type.code == 'outgoing'" ><span class="fa fa-truck fa-2x fa-flip-horizontal"></span></t>
+                            <t t-if="type.code == 'internal'" ><span class="fa fa-retweet fa-2x"></span></t>
+                            <strong><span><t t-esc="type.complete_name"/></span></strong>
+                            <div><t t-if="widget.pickings_by_type[type.id].length > 0">
+                                <span class='badge'><t t-esc="widget.pickings_by_type[type.id].length" /> picking(s) </span>
+                            </t></div>
+                        </div>
+                    </div>
+                </t>
+            </div>    
         </div>
     </t>
 
 
     <t t-name="PickingMainWidget">
-        <div class='row'>
                 <div class="navbar navbar-inverse navbar-static-top" role="navigation">
                     <div class="container">
                         <div class="navbar-header">
@@ -227,30 +224,27 @@
                         </div>
                     </div>
                 </div>
-        </div>
+
+        <div class="container">
+
         <div class="row">
-            <div class="col-md-8 col-md-offset-2">
-                <div class="jumbotron">
-                    <div class="container">
-                        <div>
-                            <div class="text-right">
+            <div class="col-md-8">
+                            <div class="pull-right">
                                     <button type="button" class='btn btn-danger js_pick_done'> Done </button>
                                     <button type="button" class='btn btn-info js_pick_print'> Print </button>
                             </div>
-                            <div>
-                                <h2><span class="oe_pick_app_header label label-info"><t t-esc='widget.get_header()' /></span></h2>
-                            </div>
-                            <div class="text-left">
-                                <button type="button" class='btn btn-default js_pick_pack'> Put in Pack </button>
-                            </div>
-                        </div>
-                        
-                        <div class='oe_placeholder_picking_editor'></div>
+                             <h2 class="oe_pick_app_header" t-esc='widget.get_header()' />
+
+                        <div class='oe_placeholder_picking_editor'/>
+                        <button type="button" class='btn btn-default js_pick_pack pull-right'> Put in Pack </button>
+
                         <div class='oe_placeholder_package_editor'></div>
+
+            </div><div class="col-md-4">
+
                         <div class='oe_placeholder_package_selector'></div>
                         <div class='oe_placeholder_menu'></div>
                     </div>
-                </div>
             </div>
         </div>
     </t>