2171 - Mostrar botón "Pago a cuenta" en índice de tickets

front/core/components/button/style.scss

@@ -50,6 +50,17 @@
             }
         }
     }
+    &.message {
+        color: white;
+        background-color: $color-bg-dark;
+
+        &:not(.disabled) {
+            &:hover,
+            &:focus {
+                background-color: lighten($color-bg-dark, 10%);
+            }
+        }
+    }
     &.flat {
         color: $color-button;
         background-color: transparent;
@@ -75,6 +86,22 @@
         & > button > span {
             display: none;
         }
+
+        &.xs {
+            font-size: 0.5em;
+        }
+    
+        &.sm {
+            font-size: 0.7em;
+        }
+    
+        &.md {
+            font-size: 0.9em;
+        }
+
+        &.lg {
+            font-size: 1.2em;
+        }
     }
     &.disabled {
         opacity: .7;

modules/client/back/methods/sms/send.js

@@ -47,7 +47,6 @@ module.exports = Self => {
         let xmlParsed;
         let status;
 
-
         try {
             if (process.env.NODE_ENV !== 'production') {
                 status = {

modules/ticket/front/index/index.html

@@ -8,17 +8,6 @@
 </vn-crud-model>
 <vn-auto-search
     on-search="$ctrl.onSearch($params)">
-    <append style="display: none;">
-        <vn-icon-menu
-            vn-id="more-button"
-            icon="more_vert"
-            show-filter="false"
-            value-field="callback"
-            translate-fields="['name']"
-            on-change="$ctrl.onMoreChange(value)"
-            on-open="$ctrl.onMoreOpen()">
-        </vn-icon-menu>
-    </append>
 </vn-auto-search>
 <vn-data-viewer
     model="model"
@@ -137,13 +126,28 @@
     </vn-table>
     </vn-card>
 </vn-data-viewer>
-<a
-    ui-sref="ticket.create"
-    vn-tooltip="New ticket"
+
+<div fixed-bottom-right>
+    <vn-vertical style="align-items: center;">
+        <vn-button class="round message xs vn-mb-sm"
+            icon="icon-recovery"
+            ng-show="$ctrl.totalChecked > 0"
+            ng-click="$ctrl.openBalanceDialog()"
+            vn-tooltip="Payment on account..."
+            tooltip-position="left">
+        </vn-button>
+
+        <a ui-sref="ticket.create">
+            <vn-button class="round md vn-mb-sm"
+                icon="add"
                 vn-bind="+"
-    fixed-bottom-right>
-    <vn-float-button icon="add"></vn-float-button>
+                vn-tooltip="New ticket"
+                tooltip-position="left">
+            </vn-button>
         </a>
+    </vn-vertical>
+</div>
+
 <vn-popup vn-id="summary">
     <vn-ticket-summary ticket="$ctrl.selectedTicket"></vn-ticket-summary>
 </vn-popup>

modules/ticket/front/index/index.js

@@ -1,4 +1,5 @@
 import ngModule from '../module';
+import UserError from 'core/lib/user-error';
 import './style.scss';
 
 export default class Controller {
@@ -9,33 +10,45 @@ export default class Controller {
         this.$stateParams = $stateParams;
         this.$state = $state;
         this.selectedTicket = null;
-        this.moreOptions = [
-            {
-                name: 'Payment on account...',
-                always: true,
-                callback: () => {
-                    this.setBalanceCreateDialog();
-                    this.$.balanceCreateDialog.show();
-                }
-            }
-        ];
     }
 
-    setBalanceCreateDialog() {
-        let data = this.$.tickets;
-        let description = [];
+    openBalanceDialog() {
+        const checkedTickets = this.checked;
+        const description = [];
         this.$.balanceCreateDialog.amountPaid = 0;
-        if (data) {
-            for (let i = 0; i < data.length; i++) {
-                if (data[i].checked) {
-                    this.$.balanceCreateDialog.amountPaid += data[i].total;
-                    this.$.balanceCreateDialog.clientFk = data[i].clientFk;
-                    description.push(`${data[i].id}`);
-                }
-            }
+
+        const firstTicketClientId = checkedTickets[0].clientFk;
+        const isSameClient = checkedTickets.every(ticket => {
+            return ticket.clientFk == firstTicketClientId;
+        });
+
+        if (!isSameClient)
+            throw new UserError('You cannot make a payment on account from multiple clients');
+
+        for (let ticket of checkedTickets) {
+            this.$.balanceCreateDialog.amountPaid += ticket.total;
+            this.$.balanceCreateDialog.clientFk = ticket.clientFk;
+            description.push(`${ticket.id}`);
         }
+
         this.$.balanceCreateDialog.description = 'Albaran: ';
         this.$.balanceCreateDialog.description += description.join(', ');
+        this.$.balanceCreateDialog.show();
+    }
+
+    get checked() {
+        const tickets = this.$.tickets || [];
+        const checkedLines = [];
+        for (let ticket of tickets) {
+            if (ticket.checked)
+                checkedLines.push(ticket);
+        }
+
+        return checkedLines;
+    }
+
+    get totalChecked() {
+        return this.checked.length;
     }
 
     getScopeDates(days) {

modules/ticket/front/index/index.spec.js

@@ -82,12 +82,14 @@ describe('Component vnTicketIndex', () => {
         });
     });
 
-    describe('setBalanceCreateDialog()', () => {
+    describe('openBalanceDialog()', () => {
         it('should fill the object for the component balanceCreateDialog', () => {
+            controller.$.balanceCreateDialog = {show: () => {}};
+            jest.spyOn(controller.$.balanceCreateDialog, 'show').mockReturnThis();
+
             controller.$.tickets = tickets;
-            controller.$.balanceCreateDialog = {};
             controller.$.balanceCreateDialog.amountPaid = 0;
-            controller.setBalanceCreateDialog();
+            controller.openBalanceDialog();
 
             let description = controller.$.balanceCreateDialog.description;
             let amountPaid = controller.$.balanceCreateDialog.amountPaid;
@@ -96,4 +98,26 @@ describe('Component vnTicketIndex', () => {
             expect(amountPaid).toEqual(50.5);
         });
     });
+
+    describe('checked()', () => {
+        it('should return an array of checked tickets', () => {
+            controller.$.tickets = tickets;
+            const result = controller.checked;
+            const firstRow = result[0];
+            const secondRow = result[1];
+
+            expect(result.length).toEqual(2);
+            expect(firstRow.id).toEqual(2);
+            expect(secondRow.id).toEqual(3);
+        });
+    });
+
+    describe('totalChecked()', () => {
+        it('should return the total number of checked tickets', () => {
+            controller.$.tickets = tickets;
+            const result = controller.checked;
+
+            expect(result.length).toEqual(2);
+        });
+    });
 });