#1012 claim.action

e2e/helpers/selectors.js

@@ -164,7 +164,7 @@ export default {
         newPaymentButton: `${components.vnFloatButton}`,
         newPaymentBankInut: `vn-client-risk-create vn-textfield[field="$ctrl.receipt.bankFk"] input`,
         newPaymentAmountInput: `vn-client-risk-create vn-textfield[field="$ctrl.receipt.amountPaid"] input`,
-        saveButton: `${components.vnSubmit}`,
+        saveButton: `vn-client-risk-create vn-button[label="Save"]`,
         firstRiskLineBalance: 'vn-client-risk-index vn-tbody > vn-tr:nth-child(1) > vn-td:nth-child(8)'
 
     },

front/core/components/dialog/dialog.js

@@ -47,9 +47,6 @@ export default class Dialog extends Component {
 
         if (this.onOpen)
             this.onOpen();
-
-        let firstFocusable = this.element.querySelector('input, textarea');
-        if (firstFocusable) firstFocusable.focus();
     }
 
     /**

front/salix/styles/index.js

@@ -13,3 +13,4 @@ import './effects.scss';
 import './order-product.scss';
 import './summary.scss';
 import './descriptor.scss';
+import './modal-form.scss';

front/salix/styles/modal-form.scss

@@ -1,7 +1,9 @@
 @import 'colors';
+@import "./padding";
 
 vn-dialog.modal-form {
     vn-horizontal.header{
+        @extend .pad-small;
         background-color: $main-01;
         h5{
             color: white;
@@ -14,7 +16,7 @@ vn-dialog.modal-form {
     table {
         width: 100%
     }
-    &>div{
+    & > div{
         padding: 0!important;
     }
     vn-textfield {

modules/client/front/risk/create/index.html

@@ -1,44 +1,45 @@
-<mg-ajax path="/client/api/receipts" options="vnPost"></mg-ajax>
-<vn-watcher
-    vn-id="watcher"
-    data="$ctrl.receipt"
-    form="form"
-    save="post">
-</vn-watcher>
-<form name="form" ng-submit="$ctrl.onSubmit()" compact>
-    <vn-card pad-large>
-        <vn-horizontal>
-            <vn-date-picker vn-one 
-                label="Date" 
-                model="$ctrl.receipt.payed"
-                ini-options="{dateFormat: 'd-m-Y', time_24hr: true}">
-            </vn-date-picker>
-            <vn-autocomplete vn-one
-                url="/api/Companies"
-                label="Company"
-                show-field="code"
-                value-field="id"
-                field="$ctrl.receipt.companyFk">
-            </vn-autocomplete>
+<vn-dialog
+    vn-id="dialog"
+    class="modal-form">
+    <tpl-body>
+        <mg-ajax path="/client/api/receipts" options="vnPost"></mg-ajax>
+        <vn-horizontal class="header">
+            <h5><span translate>New payment</span></h5>
         </vn-horizontal>
-        <vn-horizontal>
-            <vn-textfield
-                vn-one 
-                margin-medium-right
-                label="Bank"
-                field="$ctrl.receipt.bankFk">
-            </vn-textfield>
-            <vn-textfield
-                vn-one
-                margin-medium-right
-                label="Amount"
-                field="$ctrl.receipt.amountPaid"
-                vn-focus>
-            </vn-textfield>
+        <div pad-medium>
+            <vn-horizontal>
+                <vn-date-picker vn-one 
+                    label="Date" 
+                    model="$ctrl.receipt.payed"
+                    ini-options="{dateFormat: 'd-m-Y', time_24hr: true}">
+                </vn-date-picker>
+                <vn-autocomplete vn-one
+                    url="/api/Companies"
+                    label="Company"
+                    show-field="code"
+                    value-field="id"
+                    field="$ctrl.receipt.companyFk">
+                </vn-autocomplete>
+            </vn-horizontal>
+            <vn-horizontal>
+                <vn-textfield
+                    vn-one 
+                    margin-medium-right
+                    label="Bank"
+                    field="$ctrl.receipt.bankFk">
+                </vn-textfield>
+                <vn-textfield
+                    vn-one
+                    margin-medium-right
+                    label="Amount"
+                    field="$ctrl.receipt.amountPaid"
+                    vn-focus>
+                </vn-textfield>
+            </vn-horizontal>
+        </div>
+        <vn-horizontal margin-medium class="buttons-bar">
+            <vn-button vn-one label="Save" ng-click="$ctrl.save()"></vn-button>
+            <vn-button vn-one ng-click="$ctrl.hide()" label="Cancel"></vn-button>
         </vn-horizontal>
-    </vn-card>
-    <vn-button-bar>
-        <vn-submit label="Save"></vn-submit>
-        <vn-button ng-click="$ctrl.cancel($event)" label="Cancel"></vn-button>
-    </vn-button-bar>
-</form>
+    </tpl-body>
+</vn-dialog>

modules/client/front/risk/create/index.js

@@ -1,11 +1,13 @@
 import ngModule from '../../module';
+import './style.scss';
 
 class Controller {
-    constructor($scope, $state, $http, $stateParams) {
+    constructor($scope, $state, $http, vnApp, $translate) {
         this.$http = $http;
         this.$ = $scope;
         this.$state = $state;
-        this.$stateParams = $stateParams;
+        this.vnApp = vnApp;
+        this.$translate = $translate;
 
         this.receipt = {
             payed: new Date(),
@@ -13,21 +15,26 @@ class Controller {
             companyFk: window.localStorage.defaultCompanyFk,
             bankFk: window.localStorage.defaultBankFk
         };
-
-        if (this.$stateParams.payed)
-            this.receipt.payed = this.$stateParams.payed;
-
-        if (this.$stateParams.bankFk)
-            this.receipt.bankFk = this.$stateParams.bankFk;
-
-        if (this.$stateParams.amountPaid)
-            this.receipt.amountPaid = this.$stateParams.amountPaid;
-
-        if (this.$stateParams.companyFk)
-            this.receipt.companyFk = this.$stateParams.companyFk;
     }
 
-    $onInit() {
+    set payed(value) {
+        this.receipt.payed = value;
+    }
+
+    set bankFk(value) {
+        this.receipt.bankFk = value;
+    }
+
+    set amountPaid(value) {
+        this.receipt.amountPaid = value;
+    }
+
+    set companyFk(value) {
+        this.receipt.companyFk = value;
+        this.getAmountPaid();
+    }
+
+    getAmountPaid() {
         let filter = {
             where: {
                 clientFk: this.$state.params.id,
@@ -41,25 +48,34 @@ class Controller {
         });
     }
 
-    cancel() {
-        this.goToIndex();
+    show() {
+        this.$.dialog.show();
     }
 
-    goToIndex() {
-        this.$state.go('client.card.risk.index');
+    hide() {
+        this.$.dialog.hide();
     }
 
-    onSubmit() {
-        this.$.watcher.submit().then(
-            () => {
-                this.goToIndex();
-            }
-        );
+    save() {
+        let query = `/client/api/receipts`;
+        this.$http.post(query, this.receipt).then(() => {
+            this.vnApp.showSuccess(this.$translate.instant('Data saved!'));
+            this.hide();
+            if (this.onResponse)
+                this.onResponse();
+        });
     }
 }
-Controller.$inject = ['$scope', '$state', '$http', '$stateParams'];
+Controller.$inject = ['$scope', '$state', '$http', 'vnApp', '$translate'];
 
 ngModule.component('vnClientRiskCreate', {
     template: require('./index.html'),
-    controller: Controller
+    controller: Controller,
+    bindings: {
+        payed: '<?',
+        bankFk: '<?',
+        amountPaid: '<?',
+        onResponse: '&?',
+        companyFk: '<?'
+    }
 });

modules/client/front/risk/create/style.scss

@@ -0,0 +1,3 @@
+vn-horizontal.buttons-bar{
+    text-align: center;
+}

modules/client/front/risk/index/index.html

@@ -94,13 +94,16 @@
         <vn-pagination model="model"></vn-pagination>
     </vn-card>
 </vn-vertical>
-<a ui-sref="client.card.risk.create"
+
+<vn-float-button
+    vn-acl="administrative"
+    vn-acl-action="remove"
+    icon="add"
     vn-tooltip="New payment" 
     vn-bind="+"
-    fixed-bottom-right>
-    <vn-float-button
-        vn-acl="administrative"
-        vn-acl-action="remove"
-        icon="add">
-    </vn-float-button>
-</a>
+    fixed-bottom-right
+    ng-click="$ctrl.openCreateDialog()">
+</vn-float-button>
+
+<vn-client-risk-create vn-id="riskCreateDialog">
+</vn-client-risk-create>

modules/client/front/risk/index/index.js

@@ -31,6 +31,9 @@ class Controller {
     setOrder(value) {
         this.params.params.companyFk = value;
         this.filter.where.companyFk = value;
+    }
+
+    refresh() {
         this.$.model.refresh();
         this.$.riskModel.refresh();
     }
@@ -55,6 +58,14 @@ class Controller {
         return this._risks;
     }
 
+    openCreateDialog() {
+        this.$.riskCreateDialog.companyFk = this.companyFk;
+        this.$.riskCreateDialog.onResponse = () => {
+            this.refresh();
+        };
+        this.$.riskCreateDialog.show();
+    }
+
     onDownload() {
         alert('Not implemented yet');
     }

modules/item/front/ticket-descriptor/index.js

@@ -1,5 +1,4 @@
 import ngModule from '../module';
-import './style.scss';
 
 class Controller {
     constructor($state, $scope, $http, vnApp, $translate) {