[ADD] account: add a popover with payment details and action on invoice

4 files changed, 96 insertions, 7 deletions

diff --git a/addons/account/models/account_invoice.py b/addons/account/models/account_invoice.py
index 69128aa25d9..2701039e974 100644
--- a/addons/account/models/account_invoice.py
+++ b/addons/account/models/account_invoice.py
@@ -127,7 +127,7 @@ class AccountInvoice(models.Model):
                     else:
                         amount_to_show = line.company_id.currency_id.compute(abs(line.amount_residual), self.currency_id)
                     info['content'].append({
-                        'ref': line.ref or line.move_id.name,
+                        'journal_name': line.ref or line.move_id.name,
                         'amount': amount_to_show,
                         'currency': self.currency_id.symbol,
                         'id': line.id,
@@ -161,12 +161,15 @@ class AccountInvoice(models.Model):
                     amount_to_show = payment.company_id.currency_id.compute(-amount, self.currency_id)
                 info['content'].append({
                     'name': payment.name,
-                    'ref': payment.journal_id.name,
+                    'journal_name': payment.journal_id.name,
                     'amount': amount_to_show,
                     'currency': self.currency_id.symbol,
                     'digits': [69, self.currency_id.decimal_places],
                     'position': self.currency_id.position,
                     'date': payment.date,
+                    'payment_id': payment.id,
+                    'move_id': payment.move_id.id,
+                    'ref': payment.move_id.ref,
                 })
             self.payments_widget = json.dumps(info)
 
diff --git a/addons/account/static/src/js/account_payment_widget.js b/addons/account/static/src/js/account_payment_widget.js
index fd201640a1a..5a1aae22291 100644
--- a/addons/account/static/src/js/account_payment_widget.js
+++ b/addons/account/static/src/js/account_payment_widget.js
@@ -15,6 +15,7 @@ var ShowPaymentLineWidget = form_common.AbstractField.extend({
         var invoice_id = info.invoice_id;
         if (info !== false) {
             _.each(info.content, function(k,v){
+                k.index = v;
                 k.amount = formats.format_value(k.amount, {type: "float", digits: k.digits});
                 if (k.date){
                     k.date = formats.format_value(k.date, {type: "date"});
@@ -33,6 +34,51 @@ var ShowPaymentLineWidget = form_common.AbstractField.extend({
                         self.view.reload();
                     });
             });
+            _.each(this.$('.js_payment_info'), function(k, v){
+                var options = {
+                    'content': QWeb.render('PaymentPopOver', {
+                            'name': info.content[v].name, 
+                            'journal_name': info.content[v].journal_name, 
+                            'date': info.content[v].date,
+                            'amount': info.content[v].amount,
+                            'currency': info.content[v].currency,
+                            'position': info.content[v].position,
+                            'payment_id': info.content[v].payment_id,
+                            'move_id': info.content[v].move_id,
+                            'ref': info.content[v].ref,
+                            }),
+                    'html': true,
+                    'placement': 'left',
+                    'title': 'Payment Information',
+                    'trigger': 'focus',
+                };
+                $(k).popover(options);
+                $(k).on('shown.bs.popover', function(event){
+                    $(this).parent().find('.js_unreconcile_payment').click(function(){
+                        var payment_id = parseInt($(this).attr('payment-id'))
+                        if (payment_id !== undefined && payment_id !== NaN){
+                            new Model("account.move.line")
+                                .call("remove_move_reconcile", [payment_id])
+                                .then(function (result) {
+                                    self.view.reload();
+                                });
+                        }
+                    });
+                    $(this).parent().find('.js_open_payment').click(function(){
+                        var move_id = parseInt($(this).attr('move-id'))
+                        if (move_id !== undefined && move_id !== NaN){
+                            //Open form view of account.move with id = move_id
+                            self.do_action({
+                                type: 'ir.actions.act_window',
+                                res_model: 'account.move',
+                                res_id: move_id,
+                                views: [[false, 'form']],
+                                target: 'current'
+                            });
+                        }
+                    });
+                });
+            });
         }
         else {
             this.$el.html('');
diff --git a/addons/account/static/src/xml/account_payment.xml b/addons/account/static/src/xml/account_payment.xml
index c99dd36f9e4..91a1d82cda3 100644
--- a/addons/account/static/src/xml/account_payment.xml
+++ b/addons/account/static/src/xml/account_payment.xml
@@ -14,15 +14,18 @@
                     <tr>
                     <t t-if="outstanding">
                         <td>
-                            <a title="assign to invoice" class="oe_form_field outstanding_credit_assign" t-att-data-id="line.id" style="margin-right: 10px;">Add</a>
+                            <a title="assign to invoice" role="button" class="oe_form_field outstanding_credit_assign" t-att-data-id="line.id" style="margin-right: 10px;">Add</a>
                         </td>
                         <td>
-                            <span class="oe_form_field" style="margin-right: 30px;"><t t-esc="line.ref"></t></span>
+                            <span class="oe_form_field" style="margin-right: 30px;"><t t-esc="line.journal_name"></t></span>
                         </td>
                     </t>
                     <t t-if="!outstanding">
                         <td>
-                            <i class="oe_form_field text-right oe_payment_label" t-att-title="line.name + '\n'+ line.ref">Paid on <t t-esc="line.date"></t></i>
+                            <a role="button" tabindex="0" class="js_payment_info fa fa-info-circle" t-att-index="line.index" style="margin-right:5px;"></a>
+                        </td>
+                        <td>
+                            <i class="oe_form_field text-right oe_payment_label">Paid on <t t-esc="line.date"></t></i>
                         </td>
                     </t>
                         <td style="text-align:right;">
@@ -42,4 +45,41 @@
         </div>
     </t>
 
+    <t t-name="PaymentPopOver">
+        <div>
+            <table>
+                <tr>
+                    <td><strong>Name: </strong></td>
+                    <td style="text-align:right;"><t t-esc="name"/></td>
+                </tr>
+                <tr>
+                    <td><strong>Date: </strong></td>
+                    <td style="text-align:right;"><t t-esc="date"/></td>
+                </tr>
+                <tr>
+                    <td><strong>Payment Method: </strong></td>
+                    <td style="text-align:right;"><t t-esc="journal_name"/></td>
+                </tr>
+                <tr>
+                    <td><strong>Ref: </strong></td>
+                    <td style="text-align:right;"><t t-esc="ref"/></td>
+                </tr>
+                <tr>
+                    <td><strong>Amount: </strong></td>
+                    <td style="text-align:right;">
+                        <t t-if="position === 'before'">
+                            <t t-esc="currency"/>
+                        </t>
+                        <t t-esc="amount"></t> 
+                        <t t-if="position === 'after'">
+                            <t t-esc="currency"/>
+                        </t>
+                    </td>
+                </tr>
+            </table>
+        </div>
+        <button class="btn btn-xs btn-primary js_unreconcile_payment pull-left" t-att-payment-id="payment_id" style="margin-top:5px; margin-bottom:5px;">Unreconcile</button>
+        <button class="btn btn-xs btn-default js_open_payment pull-right" t-att-move-id="move_id" style="margin-top:5px; margin-bottom:5px;">Open Payment</button>
+    </t>
+
 </templates>
diff --git a/addons/account/views/account_invoice_view.xml b/addons/account/views/account_invoice_view.xml
index d6ac5b78d5f..b2702c73174 100644
--- a/addons/account/views/account_invoice_view.xml
+++ b/addons/account/views/account_invoice_view.xml
@@ -219,7 +219,7 @@
                     <field name="state" widget="statusbar" statusbar_visible="draft,open,paid" statusbar_colors='{"proforma":"blue","proforma2":"blue"}'/>
                 </header>
                 <div class="alert alert-info" role="alert" style="margin-bottom:0px;" attrs="{'invisible': [('has_outstanding','=',False)]}">
-                    You have <bold><a class="alert-link" href="#outstanding">outstanding debits</a></bold> for this supplier. You can allocate them to mark this bill as paid.
+                    You have <bold><a class="alert-link" href="#outstanding" role="button">outstanding debits</a></bold> for this supplier. You can allocate them to mark this bill as paid.
                 </div>
                 <field name="has_outstanding" invisible="1"/>
                 <sheet string="Vendor Bill">
@@ -356,7 +356,7 @@
                     <field name="state" widget="statusbar" nolabel="1" statusbar_visible="draft,open,paid" statusbar_colors='{"proforma":"blue","proforma2":"blue"}'/>
                 </header>
                 <div class="alert alert-info" role="alert" style="margin-bottom:0px;" attrs="{'invisible': [('has_outstanding','=',False)]}">
-                    You have <bold><a class="alert-link" href="#outstanding">outstanding payments</a></bold> for this customer. You can allocate them to mark this invoice as paid.
+                    You have <bold><a class="alert-link" href="#outstanding" role="button">outstanding payments</a></bold> for this customer. You can allocate them to mark this invoice as paid.
                 </div>
                 <field name="has_outstanding" invisible="1"/>
                 <sheet string="Invoice">