From 88a5443d64efcaa21afb4e27cc5673896baea16e Mon Sep 17 00:00:00 2001
From: carlosjr <carlosjr@verdnatura.es>
Date: Mon, 14 Jun 2021 15:52:46 +0200
Subject: [PATCH 1/3] table style changes

---
 front/core/components/table/style.scss    |   4 +
 modules/entry/front/buy/index/index.html  | 355 +++++++++++-----------
 modules/entry/front/buy/index/style.scss  |  27 +-
 modules/ticket/front/component/index.html | 110 +++----
 modules/ticket/front/index/index.html     | 286 ++++++++---------
 5 files changed, 406 insertions(+), 376 deletions(-)

diff --git a/front/core/components/table/style.scss b/front/core/components/table/style.scss
index dea26a462..878002e01 100644
--- a/front/core/components/table/style.scss
+++ b/front/core/components/table/style.scss
@@ -229,4 +229,8 @@ vn-table.scrollable.sm,
 vn-table.scrollable.lg,
 .vn-table.scrollable.lg {
     max-height: 700px
+}
+
+.tableWrapper {
+    overflow-x: auto;
 }
\ No newline at end of file
diff --git a/modules/entry/front/buy/index/index.html b/modules/entry/front/buy/index/index.html
index 9b9cd4634..5e5c02e6c 100644
--- a/modules/entry/front/buy/index/index.html
+++ b/modules/entry/front/buy/index/index.html
@@ -10,182 +10,185 @@
 </vn-watcher>
 <div class="vn-w-xl">
     <vn-card class="vn-pa-lg">
-        <vn-horizontal class="header">
-            <vn-tool-bar class="vn-mb-md">
-                <vn-button 
-                    disabled="$ctrl.selectedBuys() == 0"
-                    ng-click="deleteBuys.show()"
-                    vn-tooltip="Delete buy(s)"
-                    icon="delete">
-                </vn-button>
-            </vn-tool-bar>
-            <vn-one class="taxes" ng-if="$ctrl.sales.length > 0">
-                <p><vn-label translate>Subtotal</vn-label> {{$ctrl.ticket.totalWithoutVat | currency: 'EUR':2}}</p>
-                <p><vn-label translate>VAT</vn-label> {{$ctrl.ticket.totalWithVat - $ctrl.ticket.totalWithoutVat | currency: 'EUR':2}}</p>
-                <p><vn-label><strong>Total</strong></vn-label> <strong>{{$ctrl.ticket.totalWithVat | currency: 'EUR':2}}</strong></p>
-            </vn-one>
-        </vn-horizontal>
-        <table class="vn-table">
-            <thead>
-                <tr>
-                    <th shrink>
-                        <vn-multi-check model="model" on-change="$ctrl.resetChanges()">
-                        </vn-multi-check>
-                    </th>
-                    <th translate center>Item</th>
-                    <th translate center>Quantity</th>
-                    <th translate center>Package</th>
-                    <th translate>Stickers</th>
-                    <th translate>Weight</th>
-                    <th translate>Packing</th>
-                    <th translate>Grouping</th>
-                    <th translate>Buying value</th>
-                    <th translate expand>Grouping price</th>
-                    <th translate expand>Packing price</th>
-                    <th translate>Import</th>
-                </tr>
-            </thead>
-            <tbody ng-repeat="buy in $ctrl.buys">
-                <tr>
-                    <td shrink>
-                        <vn-check tabindex="-1" ng-model="buy.checked">
-                        </vn-check>
-                    </td>
-                    <td shrink>
-                        <span 
-                            ng-if="buy.id"
-                            ng-click="itemDescriptor.show($event, buy.item.id)"
-                            class="link">
-                            {{::buy.item.id | zeroFill:6}}
-                        </span>
-                        <vn-autocomplete ng-if="!buy.id" class="dense"
-                            vn-focus
-                            url="Items"
-                            ng-model="buy.itemFk"
-                            show-field="name"
-                            value-field="id"
-                            search-function="$ctrl.itemSearchFunc($search)"
-                            on-change="$ctrl.saveBuy(buy)"
-                            order="id DESC"
-                            tabindex="1">
-                            <tpl-item>
-                                {{::id}} - {{::name}}
-                            </tpl-item>
-                        </vn-autocomplete>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.quantity | dashIfEmpty}}"
-                            ng-model="buy.quantity"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td center>
-                        <vn-autocomplete
-                            vn-one
-                            title="{{::buy.packageFk | dashIfEmpty}}"
-                            url="Packagings"
-                            show-field="id"
-                            value-field="id"
-                            where="{isBox: true}"
-                            ng-model="buy.packageFk"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-autocomplete>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.stickers | dashIfEmpty}}"
-                            ng-model="buy.stickers"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.weight | dashIfEmpty}}"
-                            ng-model="buy.weight"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.packing | dashIfEmpty}}"
-                            ng-model="buy.packing"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.grouping | dashIfEmpty}}"
-                            ng-model="buy.grouping"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.buyingValue | dashIfEmpty}}"
-                            ng-model="buy.buyingValue"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.price2 | dashIfEmpty}}"
-                            ng-model="buy.price2"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td>
-                        <vn-input-number class="dense"
-                            title="{{::buy.price3 | dashIfEmpty}}"
-                            ng-model="buy.price3"
-                            on-change="$ctrl.saveBuy(buy)">
-                        </vn-input-number>
-                    </td>
-                    <td>
-                        <span 
-                            ng-if="buy.quantity != null && buy.buyingValue != null"
-                            title="{{buy.quantity * buy.buyingValue | currency: 'EUR':2}}">
-                            {{buy.quantity * buy.buyingValue | currency: 'EUR':2}}
-                        </span>
-                    </td>
-                </tr>
-                <tr class="dark-row">
-                    <td shrink>
-                    </td>
-                    <td shrink>
-                        <span translate-attr="{title: 'Item type'}">
-                            {{::buy.item.itemType.code}}
-                        </span>
-                    </td>
-                    <td number shrink>
-                        <span translate-attr="{title: 'Item size'}">
-                            {{::buy.item.size}}
-                        </span>
-                    </td>
-                    <td center>
-                        <span translate-attr="{title: 'Minimum price'}">
-                            {{::buy.item.minPrice | currency: 'EUR':2}}
-                        </span>
-                    </td>
-                    <td vn-fetched-tags colspan="9">
-                        <vn-one title="{{::buy.item.name}}">{{::buy.item.name}}</vn-one>
-                        <vn-fetched-tags
-                            max-length="6"
-                            item="::buy.item"
-                            tabindex="-1">
-                        </vn-fetched-tags>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
-        <div>
-            <vn-icon-button
-                vn-one
-                vn-tooltip="Add buy"
-                vn-bind="+"
-                icon="add_circle"
-                ng-click="model.insert({})">
-            </vn-icon-button>
+        <div class="tableWrapper">
+            <vn-horizontal class="header">
+                <vn-tool-bar class="vn-mb-md">
+                    <vn-button 
+                        disabled="$ctrl.selectedBuys() == 0"
+                        ng-click="deleteBuys.show()"
+                        vn-tooltip="Delete buy(s)"
+                        icon="delete">
+                    </vn-button>
+                </vn-tool-bar>
+                <vn-one class="taxes" ng-if="$ctrl.sales.length > 0">
+                    <p><vn-label translate>Subtotal</vn-label> {{$ctrl.ticket.totalWithoutVat | currency: 'EUR':2}}</p>
+                    <p><vn-label translate>VAT</vn-label> {{$ctrl.ticket.totalWithVat - $ctrl.ticket.totalWithoutVat | currency: 'EUR':2}}</p>
+                    <p><vn-label><strong>Total</strong></vn-label> <strong>{{$ctrl.ticket.totalWithVat | currency: 'EUR':2}}</strong></p>
+                </vn-one>
+            </vn-horizontal>
+            <table class="vn-table">
+                <thead>
+                    <tr>
+                        <th shrink>
+                            <vn-multi-check model="model" on-change="$ctrl.resetChanges()">
+                            </vn-multi-check>
+                        </th>
+                        <th translate center>Item</th>
+                        <th translate center>Quantity</th>
+                        <th translate center>Package</th>
+                        <th translate>Stickers</th>
+                        <th translate>Weight</th>
+                        <th translate>Packing</th>
+                        <th translate>Grouping</th>
+                        <th translate>Buying value</th>
+                        <th translate expand>Grouping price</th>
+                        <th translate expand>Packing price</th>
+                        <th translate>Import</th>
+                    </tr>
+                </thead>
+                <tbody ng-repeat="buy in $ctrl.buys">
+                    <tr>
+                        <td shrink>
+                            <vn-check tabindex="-1" ng-model="buy.checked">
+                            </vn-check>
+                        </td>
+                        <td shrink>
+                            <span 
+                                ng-if="buy.id"
+                                ng-click="itemDescriptor.show($event, buy.item.id)"
+                                class="link">
+                                {{::buy.item.id | zeroFill:6}}
+                            </span>
+                            <vn-autocomplete ng-if="!buy.id" class="dense"
+                                vn-focus
+                                url="Items"
+                                ng-model="buy.itemFk"
+                                show-field="name"
+                                value-field="id"
+                                search-function="$ctrl.itemSearchFunc($search)"
+                                on-change="$ctrl.saveBuy(buy)"
+                                order="id DESC"
+                                tabindex="1">
+                                <tpl-item>
+                                    {{::id}} - {{::name}}
+                                </tpl-item>
+                            </vn-autocomplete>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.quantity | dashIfEmpty}}"
+                                ng-model="buy.quantity"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td center>
+                            <vn-autocomplete
+                                vn-one
+                                title="{{::buy.packageFk | dashIfEmpty}}"
+                                url="Packagings"
+                                show-field="id"
+                                value-field="id"
+                                where="{isBox: true}"
+                                ng-model="buy.packageFk"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-autocomplete>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.stickers | dashIfEmpty}}"
+                                ng-model="buy.stickers"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.weight | dashIfEmpty}}"
+                                ng-model="buy.weight"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.packing | dashIfEmpty}}"
+                                ng-model="buy.packing"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.grouping | dashIfEmpty}}"
+                                ng-model="buy.grouping"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.buyingValue | dashIfEmpty}}"
+                                ng-model="buy.buyingValue"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.price2 | dashIfEmpty}}"
+                                ng-model="buy.price2"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td>
+                            <vn-input-number class="dense"
+                                title="{{::buy.price3 | dashIfEmpty}}"
+                                ng-model="buy.price3"
+                                on-change="$ctrl.saveBuy(buy)">
+                            </vn-input-number>
+                        </td>
+                        <td>
+                            <span 
+                                ng-if="buy.quantity != null && buy.buyingValue != null"
+                                title="{{buy.quantity * buy.buyingValue | currency: 'EUR':2}}">
+                                {{buy.quantity * buy.buyingValue | currency: 'EUR':2}}
+                            </span>
+                        </td>
+                    </tr>
+                    <tr class="dark-row">
+                        <td shrink>
+                        </td>
+                        <td shrink>
+                            <span translate-attr="{title: 'Item type'}">
+                                {{::buy.item.itemType.code}}
+                            </span>
+                        </td>
+                        <td number shrink>
+                            <span translate-attr="{title: 'Item size'}">
+                                {{::buy.item.size}}
+                            </span>
+                        </td>
+                        <td center>
+                            <span translate-attr="{title: 'Minimum price'}">
+                                {{::buy.item.minPrice | currency: 'EUR':2}}
+                            </span>
+                        </td>
+                        <td vn-fetched-tags colspan="8">
+                            <vn-one title="{{::buy.item.name}}">{{::buy.item.name}}</vn-one>
+                            <vn-fetched-tags
+                                max-length="6"
+                                item="::buy.item"
+                                tabindex="-1">
+                            </vn-fetched-tags>
+                        </td>
+                    </tr>
+                    <tr class="gap"><td></td></tr>
+                </tbody>
+            </table>
+            <div>
+                <vn-icon-button
+                    vn-one
+                    vn-tooltip="Add buy"
+                    vn-bind="+"
+                    icon="add_circle"
+                    ng-click="model.insert({})">
+                </vn-icon-button>
+            </div>
         </div>
     </vn-card>
 </div>
diff --git a/modules/entry/front/buy/index/style.scss b/modules/entry/front/buy/index/style.scss
index 836f1eddc..0ffccd99a 100644
--- a/modules/entry/front/buy/index/style.scss
+++ b/modules/entry/front/buy/index/style.scss
@@ -3,19 +3,34 @@
 
 vn-entry-buy-index vn-card {
     max-width: $width-xl;
-
+    
     .dark-row {
         background-color: lighten($color-marginal, 10%);
     }
 
-    tbody tr:nth-child(1) {
-        border-top: 1px solid $color-marginal;
+    thead tr {
+        border-left: 1px solid white;
+        border-right: 1px solid white;
     }
 
+    tbody tr:nth-child(1),
+    tbody tr:nth-child(2) {
+        border-left: 1px solid $color-marginal;
+        border-right: 1px solid $color-marginal;
+    }
+
+    tbody tr:nth-child(2) {
+        border-bottom: 1px solid $color-marginal;
+    }
+    
     tbody{
         border-bottom: 1px solid $color-marginal;
     }
 
+    tbody:last-child {
+        border-bottom: 0;
+    }
+
     tbody tr:nth-child(3) {
         height: inherit
     }
@@ -23,6 +38,12 @@ vn-entry-buy-index vn-card {
     tr {
         margin-bottom: 10px;
     }
+
+    .gap {
+        border-left: 1px solid transparent;
+        border-right: 1px solid transparent;
+        height: inherit;
+    }
 }
 
 $color-font-link-medium: lighten($color-font-link, 20%)
\ No newline at end of file
diff --git a/modules/ticket/front/component/index.html b/modules/ticket/front/component/index.html
index 3843529c3..2e3544cd0 100644
--- a/modules/ticket/front/component/index.html
+++ b/modules/ticket/front/component/index.html
@@ -8,60 +8,62 @@
 </vn-crud-model>
 <vn-data-viewer model="model" class="vn-w-xl">
     <vn-card class="vn-mt-md">
-        <table class="vn-table">
-            <thead>
-                <tr>
-                    <th number translate>Item</th>
-                    <th translate expand>Description</th>
-                    <th number translate>Quantity</th>
-                    <th translate>Serie</th>
-                    <th translate>Components</th>
-                    <th number translate>Import</th>
-                    <th number translate>Total</th>
-                </tr>
-            </thead>
-            <tbody ng-repeat="sale in components track by sale.id">
-                <tr class="initial">
-                    <td rowspan="{{::sale.components.length + 1}}" number>
-                        <span 
-                            ng-click="itemDescriptor.show($event, sale.itemFk, sale.id)"
-                            class="link">
-                            {{sale.itemFk | zeroFill:6}}
-                        </span>
-                    </td>
-                    <td rowspan="{{::sale.components.length + 1}}" vn-fetched-tags>
-                        <vn-one title="{{::sale.item.name}}">{{::sale.item.name}}</vn-one>
-                        <vn-one ng-if="::sale.item.subName">
-                            <h3 title="{{::sale.item.subName}}">{{::sale.item.subName}}</h3>
-                        </vn-one>
-                        <vn-fetched-tags
-                            max-length="6"
-                            item="::sale.item"
-                            tabindex="-1">
-                        </vn-fetched-tags>
-                    </td>
-                    <td rowspan="{{::sale.components.length + 1}}" number>
-                        {{::sale.quantity}}
-                    </td>
-                </tr>
-                <tr 
-                    ng-repeat="saleComponent in sale.components track by saleComponent.componentFk"
-                    class="components">
-                    <td>
-                        {{::saleComponent.component.componentType.type}}
-                    </td>
-                    <td>
-                        {{::saleComponent.component.name}}
-                    </td>
-                    <td number>
-                        {{::saleComponent.value | currency: 'EUR':3}}
-                    </td>
-                    <td number>
-                        {{::sale.quantity * saleComponent.value | currency: 'EUR':3}}
-                    </td>
-                </tr>
-            </tbody>
-        </table>
+        <div class="tableWrapper">
+            <table class="vn-table">
+                <thead>
+                    <tr>
+                        <th number translate>Item</th>
+                        <th translate expand>Description</th>
+                        <th number translate>Quantity</th>
+                        <th translate>Serie</th>
+                        <th translate>Components</th>
+                        <th number translate>Import</th>
+                        <th number translate>Total</th>
+                    </tr>
+                </thead>
+                <tbody ng-repeat="sale in components track by sale.id">
+                    <tr class="initial">
+                        <td rowspan="{{::sale.components.length + 1}}" number>
+                            <span 
+                                ng-click="itemDescriptor.show($event, sale.itemFk, sale.id)"
+                                class="link">
+                                {{sale.itemFk | zeroFill:6}}
+                            </span>
+                        </td>
+                        <td rowspan="{{::sale.components.length + 1}}" vn-fetched-tags>
+                            <vn-one title="{{::sale.item.name}}">{{::sale.item.name}}</vn-one>
+                            <vn-one ng-if="::sale.item.subName">
+                                <h3 title="{{::sale.item.subName}}">{{::sale.item.subName}}</h3>
+                            </vn-one>
+                            <vn-fetched-tags
+                                max-length="6"
+                                item="::sale.item"
+                                tabindex="-1">
+                            </vn-fetched-tags>
+                        </td>
+                        <td rowspan="{{::sale.components.length + 1}}" number>
+                            {{::sale.quantity}}
+                        </td>
+                    </tr>
+                    <tr 
+                        ng-repeat="saleComponent in sale.components track by saleComponent.componentFk"
+                        class="components">
+                        <td>
+                            {{::saleComponent.component.componentType.type}}
+                        </td>
+                        <td>
+                            {{::saleComponent.component.name}}
+                        </td>
+                        <td number>
+                            {{::saleComponent.value | currency: 'EUR':3}}
+                        </td>
+                        <td number>
+                            {{::sale.quantity * saleComponent.value | currency: 'EUR':3}}
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
     </vn-card>
 </vn-data-viewer>
 <vn-side-menu side="right">
diff --git a/modules/ticket/front/index/index.html b/modules/ticket/front/index/index.html
index acef6cd23..79774c647 100644
--- a/modules/ticket/front/index/index.html
+++ b/modules/ticket/front/index/index.html
@@ -5,149 +5,149 @@
     model="model"
     class="vn-mb-xl vn-w-xl">
     <vn-card>
-    <vn-table model="model">
-        <vn-thead>
-            <vn-tr>
-                <vn-th shrink>
-                    <vn-multi-check 
-                        model="model">
-                    </vn-multi-check>
-                </vn-th>
-                <vn-th class="icon-field"></vn-th>
-                <vn-th field="id">Id</vn-th>
-                <vn-th field="salesPersonFk" class="expendable">Salesperson</vn-th>
-                <vn-th field="shipped" shrink-date>Date</vn-th>
-                <vn-th>Hour</vn-th>
-                <vn-th field="zoneHour" shrink>Closure</vn-th>
-                <vn-th field="nickname">Alias</vn-th>
-                <vn-th field="provinceFk" class="expendable">Province</vn-th>
-                <vn-th field="stateFk" >State</vn-th>
-                <vn-th field="zoneFk">Zone</vn-th>
-                <vn-th field="warehouseFk">Warehouse</vn-th>
-                <vn-th number>Total</vn-th>
-                <vn-th></vn-th>
-            </vn-tr>
-        </vn-thead>
-        <vn-tbody>
-            <a ng-repeat="ticket in model.data"
-                class="clickable vn-tr search-result"
-                ui-sref="ticket.card.summary({id: {{::ticket.id}}})">
-                <vn-td>
-                    <vn-check 
-                        ng-model="ticket.checked"
-                        vn-click-stop>
-                    </vn-check>
-                </vn-td>
-                <vn-td class="icon-field">
-                    <vn-icon
-                        ng-show="::ticket.isTaxDataChecked === 0"
-                        translate-attr="{title: 'No verified data'}"
-                        class="bright"
-                        icon="icon-no036">
-                    </vn-icon>
-                    <vn-icon
-                        ng-show="::ticket.hasTicketRequest"
-                        translate-attr="{title: 'Purchase request'}"
-                        class="bright"
-                        icon="icon-100">
-                    </vn-icon>
-                    <vn-icon
-                        ng-show="::ticket.isAvailable === 0"
-                        translate-attr="{title: 'Not available'}"
-                        class="bright"
-                        icon="icon-unavailable">
-                    </vn-icon>
-                    <vn-icon
-                        ng-show="::ticket.isFreezed"
-                        translate-attr="{title: 'Client frozen'}"
-                        class="bright"
-                        icon="icon-frozen">
-                    </vn-icon>
-                    <vn-icon
-                        ng-show="::ticket.risk"
-                        title="{{::$ctrl.$t('Risk')}}: {{ticket.risk}}"
-                        class="bright"
-                        icon="icon-risk">
-                    </vn-icon>
-                    <vn-icon
-                        ng-show="::ticket.hasComponentLack"
-                        translate-attr="{title: 'Component lack'}"
-                        class="bright"
-                        icon="icon-components">
-                    </vn-icon>
-                </vn-td>
-                <vn-td shrink>{{::ticket.id}}</vn-td>
-                <vn-td class="expendable">
-                    <span
-                        title="{{::ticket.userName}}"
-                        vn-click-stop="workerDescriptor.show($event, ticket.salesPersonFk)"
-                        class="link">
-                        {{::ticket.userName | dashIfEmpty}}
-                    </span>
-                </vn-td>
-                <vn-td shrink-date>
-                    <span class="chip {{$ctrl.compareDate(ticket.shipped)}}">
-                        {{::ticket.shipped | date: 'dd/MM/yyyy'}}
-                    </span>
-                </vn-td>
-                <vn-td shrink>{{::ticket.shipped | date: 'HH:mm'}}</vn-td>
-                <vn-td shrink>{{::ticket.zoneLanding | date: 'HH:mm'}}</vn-td>
-                <vn-td>
-                    <span
-                        title="{{::ticket.nickname}}"
-                        vn-click-stop="clientDescriptor.show($event, ticket.clientFk)"
-                        class="link">
-                        {{::ticket.nickname}}
-                    </span>
-                </vn-td>
-                <vn-td class="expendable">{{::ticket.province}}</vn-td>
-                <vn-td class="expendable">
-                    <span
-                        ng-show="ticket.refFk"
-                        title="{{::ticket.refFk}}"
-                        vn-click-stop="invoiceOutDescriptor.show($event, ticket.invoiceOutId)"
-                        class="link">
-                        {{::ticket.refFk}}
-                    </span>
-                    <span 
-                        ng-show="!ticket.refFk"
-                        class="chip {{$ctrl.stateColor(ticket)}}">
-                        {{ticket.state}}
-                    </span>
-                </vn-td>
-                <vn-td>
-                    <span
-                        title="{{::ticket.zoneName}}"
-                        vn-click-stop="zoneDescriptor.show($event, ticket.zoneFk)"
-                        class="link">
-                        {{::ticket.zoneName | dashIfEmpty}}
-                    </span>
-                </vn-td>
-                <vn-td>{{::ticket.warehouse}}</vn-td>
-                <vn-td number>
-                    <span class="chip {{$ctrl.totalPriceColor(ticket)}}">
-                        {{::(ticket.totalWithVat ? ticket.totalWithVat : 0) | currency: 'EUR': 2}}
-                    </span>
-                </vn-td>
-                <vn-td actions>
-                    <vn-icon-button
-                        vn-anchor="::{
-                            state: 'ticket.card.sale', 
-                            params: {id: ticket.id}, 
-                            target: '_blank'
-                        }"
-                        vn-tooltip="Go to lines"
-                        icon="icon-lines">
-                    </vn-icon-button>
-                    <vn-icon-button
-                        vn-click-stop="$ctrl.preview(ticket)"
-                        vn-tooltip="Preview"
-                        icon="preview">
-                    </vn-icon-button>
-                </vn-td>
-            </a>
-        </vn-tbody>
-    </vn-table>
+        <vn-table model="model">
+            <vn-thead>
+                <vn-tr>
+                    <vn-th shrink>
+                        <vn-multi-check 
+                            model="model">
+                        </vn-multi-check>
+                    </vn-th>
+                    <vn-th class="icon-field"></vn-th>
+                    <vn-th field="id">Id</vn-th>
+                    <vn-th field="salesPersonFk" class="expendable">Salesperson</vn-th>
+                    <vn-th field="shipped" shrink-date>Date</vn-th>
+                    <vn-th>Hour</vn-th>
+                    <vn-th field="zoneHour" shrink>Closure</vn-th>
+                    <vn-th field="nickname">Alias</vn-th>
+                    <vn-th field="provinceFk" class="expendable">Province</vn-th>
+                    <vn-th field="stateFk" >State</vn-th>
+                    <vn-th field="zoneFk">Zone</vn-th>
+                    <vn-th field="warehouseFk">Warehouse</vn-th>
+                    <vn-th number>Total</vn-th>
+                    <vn-th></vn-th>
+                </vn-tr>
+            </vn-thead>
+            <vn-tbody>
+                <a ng-repeat="ticket in model.data"
+                    class="clickable vn-tr search-result"
+                    ui-sref="ticket.card.summary({id: {{::ticket.id}}})">
+                    <vn-td>
+                        <vn-check 
+                            ng-model="ticket.checked"
+                            vn-click-stop>
+                        </vn-check>
+                    </vn-td>
+                    <vn-td class="icon-field">
+                        <vn-icon
+                            ng-show="::ticket.isTaxDataChecked === 0"
+                            translate-attr="{title: 'No verified data'}"
+                            class="bright"
+                            icon="icon-no036">
+                        </vn-icon>
+                        <vn-icon
+                            ng-show="::ticket.hasTicketRequest"
+                            translate-attr="{title: 'Purchase request'}"
+                            class="bright"
+                            icon="icon-100">
+                        </vn-icon>
+                        <vn-icon
+                            ng-show="::ticket.isAvailable === 0"
+                            translate-attr="{title: 'Not available'}"
+                            class="bright"
+                            icon="icon-unavailable">
+                        </vn-icon>
+                        <vn-icon
+                            ng-show="::ticket.isFreezed"
+                            translate-attr="{title: 'Client frozen'}"
+                            class="bright"
+                            icon="icon-frozen">
+                        </vn-icon>
+                        <vn-icon
+                            ng-show="::ticket.risk"
+                            title="{{::$ctrl.$t('Risk')}}: {{ticket.risk}}"
+                            class="bright"
+                            icon="icon-risk">
+                        </vn-icon>
+                        <vn-icon
+                            ng-show="::ticket.hasComponentLack"
+                            translate-attr="{title: 'Component lack'}"
+                            class="bright"
+                            icon="icon-components">
+                        </vn-icon>
+                    </vn-td>
+                    <vn-td shrink>{{::ticket.id}}</vn-td>
+                    <vn-td class="expendable">
+                        <span
+                            title="{{::ticket.userName}}"
+                            vn-click-stop="workerDescriptor.show($event, ticket.salesPersonFk)"
+                            class="link">
+                            {{::ticket.userName | dashIfEmpty}}
+                        </span>
+                    </vn-td>
+                    <vn-td shrink-date>
+                        <span class="chip {{$ctrl.compareDate(ticket.shipped)}}">
+                            {{::ticket.shipped | date: 'dd/MM/yyyy'}}
+                        </span>
+                    </vn-td>
+                    <vn-td shrink>{{::ticket.shipped | date: 'HH:mm'}}</vn-td>
+                    <vn-td shrink>{{::ticket.zoneLanding | date: 'HH:mm'}}</vn-td>
+                    <vn-td>
+                        <span
+                            title="{{::ticket.nickname}}"
+                            vn-click-stop="clientDescriptor.show($event, ticket.clientFk)"
+                            class="link">
+                            {{::ticket.nickname}}
+                        </span>
+                    </vn-td>
+                    <vn-td class="expendable">{{::ticket.province}}</vn-td>
+                    <vn-td class="expendable">
+                        <span
+                            ng-show="ticket.refFk"
+                            title="{{::ticket.refFk}}"
+                            vn-click-stop="invoiceOutDescriptor.show($event, ticket.invoiceOutId)"
+                            class="link">
+                            {{::ticket.refFk}}
+                        </span>
+                        <span 
+                            ng-show="!ticket.refFk"
+                            class="chip {{$ctrl.stateColor(ticket)}}">
+                            {{ticket.state}}
+                        </span>
+                    </vn-td>
+                    <vn-td>
+                        <span
+                            title="{{::ticket.zoneName}}"
+                            vn-click-stop="zoneDescriptor.show($event, ticket.zoneFk)"
+                            class="link">
+                            {{::ticket.zoneName | dashIfEmpty}}
+                        </span>
+                    </vn-td>
+                    <vn-td>{{::ticket.warehouse}}</vn-td>
+                    <vn-td number>
+                        <span class="chip {{$ctrl.totalPriceColor(ticket)}}">
+                            {{::(ticket.totalWithVat ? ticket.totalWithVat : 0) | currency: 'EUR': 2}}
+                        </span>
+                    </vn-td>
+                    <vn-td actions>
+                        <vn-icon-button
+                            vn-anchor="::{
+                                state: 'ticket.card.sale', 
+                                params: {id: ticket.id}, 
+                                target: '_blank'
+                            }"
+                            vn-tooltip="Go to lines"
+                            icon="icon-lines">
+                        </vn-icon-button>
+                        <vn-icon-button
+                            vn-click-stop="$ctrl.preview(ticket)"
+                            vn-tooltip="Preview"
+                            icon="preview">
+                        </vn-icon-button>
+                    </vn-td>
+                </a>
+            </vn-tbody>
+        </vn-table>
     </vn-card>
 </vn-data-viewer>
 <div fixed-bottom-right>

From 9c0cff2f3abe2c80598c026d2fdf10f19f4e6a04 Mon Sep 17 00:00:00 2001
From: carlosjr <carlosjr@verdnatura.es>
Date: Mon, 14 Jun 2021 16:09:28 +0200
Subject: [PATCH 2/3] removed unused code

---
 modules/entry/front/buy/index/index.html | 2 +-
 modules/entry/front/buy/index/style.scss | 6 ------
 2 files changed, 1 insertion(+), 7 deletions(-)

diff --git a/modules/entry/front/buy/index/index.html b/modules/entry/front/buy/index/index.html
index 5e5c02e6c..50cd26329 100644
--- a/modules/entry/front/buy/index/index.html
+++ b/modules/entry/front/buy/index/index.html
@@ -177,7 +177,7 @@
                             </vn-fetched-tags>
                         </td>
                     </tr>
-                    <tr class="gap"><td></td></tr>
+                    <tr><td></td></tr>
                 </tbody>
             </table>
             <div>
diff --git a/modules/entry/front/buy/index/style.scss b/modules/entry/front/buy/index/style.scss
index 0ffccd99a..55df72f1c 100644
--- a/modules/entry/front/buy/index/style.scss
+++ b/modules/entry/front/buy/index/style.scss
@@ -38,12 +38,6 @@ vn-entry-buy-index vn-card {
     tr {
         margin-bottom: 10px;
     }
-
-    .gap {
-        border-left: 1px solid transparent;
-        border-right: 1px solid transparent;
-        height: inherit;
-    }
 }
 
 $color-font-link-medium: lighten($color-font-link, 20%)
\ No newline at end of file

From db3d5ca4d8d85b0e7403c08a08e53029d6cdd7e3 Mon Sep 17 00:00:00 2001
From: carlosjr <carlosjr@verdnatura.es>
Date: Tue, 15 Jun 2021 13:14:21 +0200
Subject: [PATCH 3/3] added missing html closing tag

---
 modules/supplier/front/billing-data/index.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/modules/supplier/front/billing-data/index.html b/modules/supplier/front/billing-data/index.html
index 0fb7011b8..12d3b84b3 100644
--- a/modules/supplier/front/billing-data/index.html
+++ b/modules/supplier/front/billing-data/index.html
@@ -49,6 +49,7 @@
                 rule>
             </vn-input-number>
         </vn-horizontal>
+    </vn-card>
     <vn-button-bar>
         <vn-submit
             label="Save"