feat(claim_index): implemented smart-table and change state in summary

2022-02-28 07:57:46 +01:00 · 2022-02-28 07:57:46 +01:00 · 5434dd3baf
parent c3e480b2e7
commit 5434dd3baf
6 changed files with 204 additions and 72 deletions
--- a/modules/claim/back/methods/claim/filter.js
+++ b/modules/claim/back/methods/claim/filter.js
@ -94,19 +94,15 @@ module.exports = Self => {
                    ? {'cl.id': value}
                    : {
                        or: [
-                            {'c.name': {like: `%${value}%`}}
+                            {'cl.socialName': {like: `%${value}%`}}
                        ]
                    };
-            case 'client':
-                return {'c.name': {like: `%${value}%`}};
+            case 'workerFk':
+                return {['cl.workerFk']: value};
            case 'id':
-                return {'cl.id': value};
-            case 'clientFk':
-                return {'c.id': value};
            case 'claimStateFk':
-                return {'cl.claimStateFk': value};
-            case 'salesPersonFk':
-                return {'c.salesPersonFk': value};
+            case 'priority':
+                return {[`cl.${param}`]: value};
            case 'attenderFk':
                return {'cl.workerFk': value};
            case 'created':
@ -123,12 +119,23 @@ module.exports = Self => {
        const stmts = [];

        const stmt = new ParameterizedSQL(
-            `SELECT cl.id, c.name, cl.clientFk, cl.workerFk, u.name AS userName, cs.description, cl.created
-                FROM claim cl
-                    LEFT JOIN client c ON c.id = cl.clientFk
-                    LEFT JOIN worker w ON w.id = cl.workerFk 
-                    LEFT JOIN account.user u ON u.id = w.userFk
-                    LEFT JOIN claimState cs ON cs.id = cl.claimStateFk`
+            `SELECT * 
+                FROM (
+                    SELECT 
+                        cl.id,
+                        cl.clientFk,
+                        c.socialName,
+                        cl.workerFk,
+                        u.name AS workerName,
+                        cs.description,
+                        cl.created,
+                        cs.priority,
+                        cl.claimStateFk
+                    FROM claim cl
+                        LEFT JOIN client c ON c.id = cl.clientFk
+                        LEFT JOIN worker w ON w.id = cl.workerFk 
+                        LEFT JOIN account.user u ON u.id = w.userFk
+                        LEFT JOIN claimState cs ON cs.id = cl.claimStateFk ) cl`
        );

        stmt.merge(conn.makeSuffix(filter));
--- a/modules/claim/front/index/index.html
+++ b/modules/claim/front/index/index.html
@ -1,59 +1,74 @@
 <vn-auto-search
    model="model">
 </vn-auto-search>
-<vn-data-viewer
-    model="model"
-    class="vn-w-lg">
-    <vn-card>
-    <vn-table model="model">
-        <vn-thead>
-            <vn-tr>
-                <vn-th field="id" number>Id</vn-th>
-                <vn-th field="clientFk">Client</vn-th>
-                <vn-th field="created" center shrink-date>Created</vn-th>
-                <vn-th field="workerFk">Worker</vn-th>
-                <vn-th field="claimStateFk">State</vn-th>
-                <vn-th></vn-th>
-            </vn-tr>
-        </vn-thead>
-        <vn-tbody>
-            <a
-                ng-repeat="claim in model.data"
-                class="{{::$ctrl.compareDate(ticket.shipped)}} clickable vn-tr search-result"
-                ui-sref="claim.card.summary({id: claim.id})">
-                <vn-td number>{{::claim.id}}</vn-td>
-                <vn-td expand>
-                    <span
-                        vn-click-stop="clientDescriptor.show($event, claim.clientFk)"
-                        class="link">
-                        {{::claim.name}}
-                    </span>
-                </vn-td>
-                <vn-td center shrink-date>{{::claim.created | date:'dd/MM/yyyy'}}</vn-td>
-                <vn-td expand>
-                    <span
-                        vn-click-stop="workerDescriptor.show($event, claim.workerFk)"
-                        class="link" >
-                        {{::claim.userName}}
-                    </span>
-                </vn-td>
-                <vn-td>
-                    <span class="chip {{::$ctrl.stateColor(claim)}}">
-                        {{::claim.description}}
-                    </span>
-                </vn-td>
-                <vn-td shrink>
-                    <vn-icon-button
-                        vn-click-stop="$ctrl.preview(claim)"
-                        vn-tooltip="Preview"
-                        icon="preview">
-                    </vn-icon-button>
-                </vn-td>
-            </a>
-        </vn-tbody>
-    </vn-table>
-    </vn-card>
-</vn-data-viewer>
+<vn-card>
+    <smart-table 
+        model="model"
+        options="$ctrl.smartTableOptions" 
+        expr-builder="$ctrl.exprBuilder(param, value)">
+        <slot-table>
+            <table>
+                <thead>
+                    <tr>
+                        <th field="id" shrink>
+                            <span translate>Id</span>
+                        </th>
+                        <th field="clientFk">
+                            <span translate>Client</span>
+                        </th>
+                        <th field="created" center shrink-date>
+                            <span translate>Created</span>
+                        </th>
+                        <th field="workerFk">
+                            <span translate>Worker</span>
+                        </th>
+                        <th field="claimStateFk">
+                            <span translate>State</span>
+                        </th>
+                        <th></th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr
+                        ng-repeat="claim in model.data"
+                        vn-anchor="::{
+                            state: 'claim.card.summary', 
+                            params: {id: claim.id}
+                        }">
+                        <td>{{::claim.id}}</td>
+                        <td>
+                            <span
+                                vn-click-stop="clientDescriptor.show($event, claim.clientFk)"
+                                class="link">
+                                {{::claim.socialName}}
+                            </span>
+                        </td>
+                        <td center shrink-date>{{::claim.created | date:'dd/MM/yyyy'}}</td>
+                        <td>
+                            <span
+                                vn-click-stop="workerDescriptor.show($event, claim.workerFk)"
+                                class="link" >
+                                {{::claim.workerName}}
+                            </span>
+                        </td>
+                        <td>
+                            <span class="chip {{::$ctrl.stateColor(claim)}}">
+                                {{::claim.description}}
+                            </span>
+                        </td>
+                        <td shrink>
+                            <vn-icon-button
+                                vn-click-stop="$ctrl.preview(claim)"
+                                vn-tooltip="Preview"
+                                icon="preview">
+                            </vn-icon-button>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </slot-table>
+    </smart-table>
+</vn-card>
 <vn-client-descriptor-popover
    vn-id="clientDescriptor">
 </vn-client-descriptor-popover>
@ -62,6 +77,7 @@
 </vn-worker-descriptor-popover>
 <vn-popup vn-id="summary">
    <vn-claim-summary
-        claim="$ctrl.claimSelected">
+        claim="$ctrl.claimSelected"
+        parent-reload="$ctrl.reload()">
    </vn-claim-summary>
 </vn-popup>
--- a/modules/claim/front/index/index.js
+++ b/modules/claim/front/index/index.js
@ -1,7 +1,69 @@
 import ngModule from '../module';
 import Section from 'salix/components/section';

-export default class Controller extends Section {
+class Controller extends Section {
+    constructor($element, $) {
+        super($element, $);
+
+        this.smartTableOptions = {
+            activeButtons: {
+                search: true
+            },
+            columns: [
+                {
+                    field: 'clientFk',
+                    autocomplete: {
+                        url: 'Clients',
+                        showField: 'socialName',
+                        valueField: 'socialName'
+                    }
+                },
+                {
+                    field: 'workerFk',
+                    autocomplete: {
+                        url: 'Workers/activeWithInheritedRole',
+                        where: `{role: 'salesPerson'}`,
+                        searchFunction: '{firstName: $search}',
+                        showField: 'name',
+                        valueField: 'id',
+                    }
+                },
+                {
+                    field: 'claimStateFk',
+                    autocomplete: {
+                        url: 'ClaimStates',
+                        showField: 'description',
+                        valueField: 'id',
+                    }
+                },
+                {
+                    field: 'created',
+                    searchable: false
+                }
+            ]
+        };
+    }
+
+    exprBuilder(param, value) {
+        switch (param) {
+        case 'clientFk':
+            return {['cl.socialName']: value};
+        case 'id':
+        case 'workerFk':
+        case 'claimStateFk':
+        case 'priority':
+            return {[`cl.${param}`]: value};
+        case 'attenderFk':
+            return {'cl.workerFk': value};
+        case 'created':
+            value.setHours(0, 0, 0, 0);
+            to = new Date(value);
+            to.setHours(23, 59, 59, 999);
+
+            return {'cl.created': {between: [value, to]}};
+        }
+    }
+
    stateColor(claim) {
        switch (claim.description) {
        case 'Pendiente':
--- a/modules/claim/front/summary/index.html
+++ b/modules/claim/front/summary/index.html
@ -12,6 +12,15 @@
            <vn-icon-button icon="launch"></vn-icon-button>
        </a>
        <span>{{::$ctrl.summary.claim.id}} - {{::$ctrl.summary.claim.client.name}}</span>
+        <vn-button-menu 
+            disabled="!$ctrl.isEditable"
+            class="message"
+            label="Change state"
+            value-field="id"
+            show-field="description"
+            url="claimStates"
+            on-change="$ctrl.changeState(value)">
+        </vn-button-menu>
    </h5>
    <vn-horizontal>
        <vn-one>
--- a/modules/claim/front/summary/index.js
+++ b/modules/claim/front/summary/index.js
@ -13,6 +13,18 @@ class Controller extends Summary {
            this.getSummary();
    }

+    loadData() {
+        this.getSummary();
+    }
+
+    reload() {
+        if (this.card) {
+            console.log('CARD');
+            this.card.reload();
+        }
+        if (this.parentReload)
+            this.parentReload();
+    }
    get isSalesPerson() {
        return this.aclService.hasAny(['salesPerson']);
    }
@ -29,8 +41,10 @@ class Controller extends Summary {
        this._claim = value;

        // Get DMS on summary load
-        if (value)
+        if (value) {
            this.$.$applyAsync(() => this.loadDms());
+            this.loadData();
+        }
    }

    loadDms() {
@ -44,11 +58,29 @@ class Controller extends Summary {
        this.$http.get(`Claims/${this.claim.id}/getSummary`).then(response => {
            this.summary = response.data;
        });
+        this.$http.get(`Claims/${this.claim.id}/isEditable`).then(response => {
+            this.isEditable = response.data;
+        });
    }

    getImagePath(dmsId) {
        return this.vnFile.getPath(`/api/dms/${dmsId}/downloadFile`);
    }
+
+    changeState(value) {
+        const params = {
+            id: this.claim.id,
+            claimStateFk: value
+        };
+
+        this.$http.patch(`Claims/updateClaim/${this.claim.id}`, params)
+            .then(() => {
+                this.reload();
+            })
+            .then(() => {
+                this.vnApp.showSuccess(this.$t('Data saved!'));
+            });
+    }
 }

 Controller.$inject = ['$element', '$scope', 'vnFile'];
@ -57,6 +89,11 @@ ngModule.vnComponent('vnClaimSummary', {
    template: require('./index.html'),
    controller: Controller,
    bindings: {
-        claim: '<'
+        claim: '<',
+        model: '<?',
+        parentReload: '&'
+    },
+    require: {
+        card: '?^vnClaimCard'
    }
 });
--- a/modules/claim/front/summary/index.spec.js
+++ b/modules/claim/front/summary/index.spec.js
@ -22,6 +22,7 @@ describe('Claim', () => {
            it('should perform a query to set summary', () => {
                $httpBackend.expect('GET', `Claims/1/getSummary`).respond(200, 24);
                controller.getSummary();
+                $httpBackend.expect('GET', `Claims/1/isEditable`).respond(200, true);
                $httpBackend.flush();

                expect(controller.summary).toEqual(24);