[FIX] Timesheet design

Simplify timesheet design and adapt it for both enterprise and
community editions

4 files changed, 74 insertions, 114 deletions

diff --git a/addons/hr_timesheet_sheet/static/src/css/timesheet.css b/addons/hr_timesheet_sheet/static/src/css/timesheet.css
index 99a63002326..f91e6342e2a 100644
--- a/addons/hr_timesheet_sheet/static/src/css/timesheet.css
+++ b/addons/hr_timesheet_sheet/static/src/css/timesheet.css
@@ -1,65 +1,45 @@
-@charset "utf-8";
-.openerp .oe_form_readonly .oe_timesheet_weekly .oe_timesheet_button_add {
-  display: none;
-}
-.openerp .oe_form_readonly .oe_timesheet_weekly div.oe_view_nocontent {
-  display: none;
-}
-.openerp .oe_timesheet_weekly {
+.o_web_client .oe_timesheet_weekly {
   overflow-x: auto;
 }
-.openerp .oe_timesheet_weekly table {
+.o_web_client .oe_timesheet_weekly > table {
   width: 100%;
 }
-.openerp .oe_timesheet_weekly td {
-  padding: 3px;
-  text-align: right;
-}
-.openerp .oe_timesheet_weekly th {
-  text-align: center;
-  color: #006699;
-  font-family: "Helvetica Neue", Arial, Verdana, "Nimbus Sans L", sans-serif;
-  font-size: 11px;
-  background: #eeeeee;
-  min-width: 47px;
-}
-.openerp .oe_timesheet_weekly .oe_timesheet_total {
-  background: #eeeeee;
+.o_web_client .oe_timesheet_weekly > table > tbody > tr.oe_timesheet_weekly_add_row {
+  display: none;
 }
-.openerp .oe_timesheet_weekly .oe_timesheet_weekly_account {
+.o_web_client .oe_timesheet_weekly > table > tbody > tr.oe_timesheet_weekly_add_row > td {
   text-align: left;
 }
-.openerp .oe_timesheet_weekly .oe_timesheet_first_col {
-  min-width: 130px;
-}
-.openerp .oe_timesheet_weekly td input.oe_timesheet_weekly_input {
-  padding-right: 2px !important;
-  width: 40px;
+.o_web_client .oe_timesheet_weekly > table > tbody > tr > td {
   text-align: right;
-  min-width: 0 !important;
 }
-.openerp .oe_timesheet_weekly td.oe_timesheet_total {
+.o_web_client .oe_timesheet_weekly > table > tbody > tr > td.oe_timesheet_total {
   font-weight: bold;
-  padding: 5px 3px !important;
 }
-.openerp .oe_timesheet_weekly .oe_timesheet_weekly_adding_tot {
-  display: table;
-  width: 100%;
-}
-.openerp .oe_timesheet_weekly .oe_timesheet_weekly_adding {
-  display: table-cell;
+.o_web_client .oe_timesheet_weekly > table > tbody > tr > td.oe_timesheet_weekly_account {
+  white-space: nowrap;
   text-align: left;
 }
-.openerp .oe_timesheet_weekly .oe_timesheet_weekly_tottot {
-  display: table-cell;
+.o_web_client .oe_timesheet_weekly > table > tbody > tr > td input.oe_timesheet_weekly_input {
+  display: inline-block;
+  width: 40px;
+  text-align: right;
+}
+.o_web_client .oe_timesheet_weekly > table > tbody > tr > th {
+  text-align: center;
+  font-size: 10px;
+  background: #eee;
 }
-.openerp .oe_timesheet_weekly .oe_timesheet_weekly_add_row td {
-  text-align: left;
+.o_web_client .oe_timesheet_weekly .oe_timesheet_total {
+  background: #eee;
 }
-.openerp .oe_timesheet_weekly .oe_timesheet_weekly_add_row .oe_form_field_many2one {
-  display: inline-block;
-  width: 200px;
+.o_web_client .oe_timesheet_weekly .oe_timesheet_button_add {
+  float: left;
+}
+.o_web_client .oe_timesheet_weekly .oe_timesheet_weekly_today {
+  background: #fde;
 }
-.openerp .oe_timesheet_weekly .oe_timesheet_weekly_today {
-  background: #ffddee;
+
+.openerp .oe_timesheet_weekly > table > tbody > tr > th {
+  color: #069;
 }
diff --git a/addons/hr_timesheet_sheet/static/src/css/timesheet.sass b/addons/hr_timesheet_sheet/static/src/css/timesheet.sass
index daa835db88d..32dbd4a46ab 100644
--- a/addons/hr_timesheet_sheet/static/src/css/timesheet.sass
+++ b/addons/hr_timesheet_sheet/static/src/css/timesheet.sass
@@ -1,52 +1,38 @@
 @charset "utf-8"
 
-.openerp
-    .oe_form_readonly
-        .oe_timesheet_weekly
-            .oe_timesheet_button_add
-                display: none
-            div.oe_view_nocontent
-                display: none
+.o_web_client
     .oe_timesheet_weekly
         overflow-x: auto
-        table
+        > table
             width: 100%
-        td
-            padding: 3px
-            text-align: right
-        th
-            text-align: center
-            color: #069
-            font-family: 'Helvetica Neue', Arial, Verdana, 'Nimbus Sans L', sans-serif
-            font-size: 10px
-            background: #eee
-            min-width: 47px
+            > tbody > tr
+                &.oe_timesheet_weekly_add_row
+                    display: none
+                    > td
+                        text-align: left
+                > td
+                    text-align: right
+                    &.oe_timesheet_total
+                        font-weight: bold
+                    &.oe_timesheet_weekly_account
+                        white-space: nowrap
+                        text-align: left
+                    input.oe_timesheet_weekly_input
+                        display: inline-block
+                        width: 40px
+                        text-align: right
+                > th
+                    text-align: center
+                    font-size: 10px
+                    background: #eee
         .oe_timesheet_total
             background: #eee
-        .oe_timesheet_weekly_account
-            text-align: left
-        .oe_timesheet_first_col
-            min-width: 130px
-        td input.oe_timesheet_weekly_input
-            padding-right: 2px !important
-            width: 40px
-            text-align: right
-            min-width: 0 !important
-        td.oe_timesheet_total
-            font-weight: bold
-            padding: 5px 3px !important
-        .oe_timesheet_weekly_adding_tot
-            display: table
-            width: 100%
-        .oe_timesheet_weekly_adding
-            display: table-cell
-            text-align: left
-        .oe_timesheet_weekly_tottot
-            display: table-cell
-        .oe_timesheet_weekly_add_row td
-            text-align: left
-        .oe_timesheet_weekly_add_row .oe_form_field_many2one
-            display: inline-block
-            width: 200px
+        .oe_timesheet_button_add
+            float: left
         .oe_timesheet_weekly_today
             background: #fde
+
+.openerp
+    .oe_timesheet_weekly
+        > table > tbody > tr > th
+            color: #069
\ No newline at end of file
diff --git a/addons/hr_timesheet_sheet/static/src/js/timesheet.js b/addons/hr_timesheet_sheet/static/src/js/timesheet.js
index c99a3593d7e..819556b0a59 100644
--- a/addons/hr_timesheet_sheet/static/src/js/timesheet.js
+++ b/addons/hr_timesheet_sheet/static/src/js/timesheet.js
@@ -232,7 +232,7 @@ var WeeklyTimesheet = form_common.FormWidget.extend(form_common.ReinitializeWidg
             });
         });
         self.display_totals();
-        self.$(".oe_timesheet_weekly_adding button").click(_.bind(this.init_add_account, this));
+        self.$(".oe_timesheet_button_add").click(_.bind(this.init_add_account, this));
     },
     init_add_account: function() {
         var self = this;
@@ -263,7 +263,9 @@ var WeeklyTimesheet = form_common.FormWidget.extend(form_common.ReinitializeWidg
                 modifiers: '{"required": true}',
             },
         });
-        self.account_m2o.prependTo(self.$(".oe_timesheet_weekly_add_row td"));
+        self.account_m2o.prependTo(self.$(".oe_timesheet_weekly_add_row td")).then(function() {
+            self.account_m2o.$el.addClass('oe_inline');
+        });
         self.$(".oe_timesheet_weekly_add_row button").click(function() {
             var id = self.account_m2o.get_value();
             if (id === false) {
diff --git a/addons/hr_timesheet_sheet/static/src/xml/timesheet.xml b/addons/hr_timesheet_sheet/static/src/xml/timesheet.xml
index 710e68d13d9..e9478ba1629 100644
--- a/addons/hr_timesheet_sheet/static/src/xml/timesheet.xml
+++ b/addons/hr_timesheet_sheet/static/src/xml/timesheet.xml
@@ -1,14 +1,13 @@
 <?xml version="1.0" encoding="UTF-8"?>
-
 <templates>
     <t t-name="hr_timesheet_sheet.WeeklyTimesheet">
         <div class="oe_timesheet_weekly">
-            <table>
+            <table class="table table-condensed table-responsive">
                 <tr>
-                    <th class="oe_timesheet_first_col"> </th>
+                    <th class="oe_timesheet_first_col"/>
                     <t t-foreach="widget.dates" t-as="date">
                         <th t-att-class="'oe_timesheet_weekly_date_head' + (moment().format('DD-MM-YYYY') === moment(date).format('DD-MM-YYYY') ? ' oe_timesheet_weekly_today' : '')">
-                            <t t-esc="moment(date).format('ddd')"/><br />
+                            <t t-esc="moment(date).format('ddd')"/><br/>
                             <t t-esc="moment(date).format('MMM DD')"/>
                         </th>
                     </t>
@@ -26,39 +25,32 @@
                             <t t-set="day_count" t-value="day_count + 1"/>
                         </td>
                     </t>
-                    <td t-att-data-account-total="account.account" class="oe_timesheet_total"> </td>
+                    <td t-att-data-account-total="account.account" class="oe_timesheet_total"/>
                 </tr>
-                <tr class="oe_timesheet_weekly_add_row" style="display: none">
+                <tr class="oe_timesheet_weekly_add_row">
                     <td t-att-colspan="widget.dates.length + 2">
-                        <button class="oe_highlight">Add</button>
+                        <button class="btn btn-sm btn-default">Add</button>
                     </td>
                 </tr>
                 <tr class="oe_timesheet_total">
                     <td>
-                        <div class="oe_timesheet_weekly_adding_tot">
-                            <div t-if="!widget.get('effective_readonly')" class="oe_timesheet_weekly_adding"><button class="oe_timesheet_button_add">Add a Line</button></div>
-                            <div class="oe_timesheet_weekly_tottot"><span>Total</span></div>
-                        </div>
+                        <button t-if="!widget.get('effective_readonly')" class="btn btn-sm btn-primary oe_edit_only oe_timesheet_button_add">Add a Line</button>
+                        Total
                     </td>
                     <t t-set="day_count" t-value="0"/>
                     <t t-foreach="widget.dates" t-as="date">
                         <td class="oe_timesheet_total">
-                            <span class="oe_timesheet_weekly_box" t-att-data-day-total="day_count">
-                            </span>
+                            <span class="oe_timesheet_weekly_box" t-att-data-day-total="day_count"/>
                             <t t-set="day_count" t-value="day_count + 1"/>
                         </td>
                     </t>
-                    <td class="oe_timesheet_weekly_supertotal oe_timesheet_total"> </td>
+                    <td class="oe_timesheet_weekly_supertotal oe_timesheet_total"/>
                 </tr>
             </table>
             <div t-if="widget.accounts.length == 0">
-                <div class="oe_view_nocontent">
-                    <p class="oe_view_nocontent_create">
-                        Click to add projects, contracts or analytic accounts.
-                    </p><p>
-                        You will be able to register your working hours and
-                        activities.
-                    </p>
+                <div class="oe_view_nocontent oe_edit_only">
+                    <p class="oe_view_nocontent_create">Click to add projects, contracts or analytic accounts.</p>
+                    <p>You will be able to register your working hours and activities.</p>
                 </div>
             </div>
         </div>