Show item descriptor on itemFk click

client/ticket/src/component/index.html

@@ -36,7 +36,8 @@
                     <tr>
                         <td rowspan="{{
                             ::sale.components.length + 1
-                        }}" number>{{::sale.itemFk}}</td>
+                        }}" number pointer 
+                            ng-click="$ctrl.showDescriptor($event, sale.itemFk)">{{::sale.itemFk}}</td>
                         <td rowspan="{{
                             ::sale.components.length + 1
                         }}"><vn-fetched-tags sale="sale"/></td>
@@ -69,3 +70,4 @@
         <!-- <vn-auto-paging vn-one margin-large-top index="index" total="index.model.count" items="$ctrl.instances"></vn-auto-paging> -->
     </vn-card>
 </vn-vertical>
+<vn-item-descriptor-popover vn-id="descriptor"></vn-item-descriptor-popover>

client/ticket/src/component/index.js

@@ -43,6 +43,16 @@ class Controller extends FilterTicketList {
         }
         return sum;
     }
+
+    showDescriptor(event, itemFk) {
+        this.$scope.descriptor.itemFk = itemFk;
+        this.$scope.descriptor.parent = event.target;
+        this.$scope.descriptor.show();
+    }
+
+    onDescriptorLoad() {
+        this.$scope.popover.relocate();
+    }
 }
 
 Controller.$inject = ['$scope', '$timeout', '$state'];

client/ticket/src/component/style.scss

@@ -1,27 +1,41 @@
-vn-ticket-components .vn-grid {
+vn-ticket-components {
-    tbody:not(:last-child) {
+    vn-fetched-tags {
-        border-bottom: none;
+        & vn-horizontal {
+            flex-direction: column;
+            text-align: center;
+
+            & .inline-tag {
+                display: inline-block;
+                float: none
+            }
+        }
     }
     
-    tfoot tr:first-child td {
+    .vn-grid {
-        padding-top: 10px !important;
+        tbody:not(:last-child) {
-    }
+            border-bottom: none;
-    
-    tr {
-        td {
-            padding-top: .1em !important;
-            padding-bottom: .1em !important;
         }
 
-        td.first {
+        tfoot tr:first-child td {
             padding-top: 10px !important;
         }
         
-        td.last {
+        tr {
-            padding-bottom: 10px !important;
+            td {
+                padding-top: .1em !important;
+                padding-bottom: .1em !important;
+            }
+
+            td.first {
+                padding-top: 10px !important;
+            }
+
+            td.last {
+                padding-bottom: 10px !important;
+            }
+        }
+        tr:not(:first-child):not(:last-child), {
+            border-bottom: none;
         }
     }
-    tr:not(:first-child):not(:last-child), {
-        border-bottom: none;
-    }
 }

client/ticket/src/expedition/index.html

@@ -25,7 +25,8 @@
                             vn-tooltip="delete expedition"                        
                             ng-click="$ctrl.deleteExpedition(expedition)">delete</i>
                     </vn-one>
-                    <vn-one pad-medium-h>{{::expedition.itemFk}}</vn-one>
+                    <vn-one pointer number
+                        ng-click="$ctrl.showDescriptor($event, expedition.item.id)">{{::expedition.itemFk}}</vn-one>
                     <vn-one pad-medium-h>{{::expedition.item.name}}</vn-one>
                     <vn-one pad-medium-h>{{::expedition.package.name}}</vn-one>
                     <vn-one pad-medium-h>{{::expedition.counter}}</vn-one>
@@ -41,3 +42,4 @@
     <vn-paging vn-one margin-large-top index="index" total="index.model.count"></vn-paging>
     <!-- <vn-auto-paging vn-one margin-large-top index="index" total="index.model.count" items="$ctrl.instances"></vn-auto-paging> -->
 </vn-vertical>
+<vn-item-descriptor-popover vn-id="descriptor"></vn-item-descriptor-popover>

client/ticket/src/expedition/index.js

@@ -4,6 +4,7 @@ import FilterTicketList from '../filter-ticket-list';
 class Controller extends FilterTicketList {
     constructor($scope, $timeout, $stateParams, $http) {
         super($scope, $timeout, $stateParams);
+        this.$scope = $scope;
         this.params = $stateParams;
         this.$http = $http;
     }
@@ -13,6 +14,16 @@ class Controller extends FilterTicketList {
             () => this.$.index.accept()
         );
     }
+
+    showDescriptor(event, itemFk) {
+        this.$scope.descriptor.itemFk = itemFk;
+        this.$scope.descriptor.parent = event.target;
+        this.$scope.descriptor.show();
+    }
+
+    onDescriptorLoad() {
+        this.$scope.popover.relocate();
+    }
 }
 
 Controller.$inject = ['$scope', '$timeout', '$state', '$http'];

client/ticket/src/sale-checked/index.html

@@ -20,7 +20,8 @@
                                 disabled="true">
                             </vn-check>
                         </td>
-                        <td number>{{::sale.itemFk}}</td>
+                        <td number pointer
+                            ng-click="$ctrl.showDescriptor($event, sale.itemFk)">{{::sale.itemFk}}</td>
                         <td><vn-fetched-tags sale="sale"/></td>
                         <td number>{{::sale.quantity}}</td>
                     </tr>
@@ -34,3 +35,4 @@
     <vn-paging vn-one margin-large-top index="index" total="index.model.count"></vn-paging>
     <!-- <vn-auto-paging vn-one margin-large-top index="index" total="index.model.count" items="$ctrl.instances"></vn-auto-paging> -->
 </vn-vertical>
+<vn-item-descriptor-popover vn-id="descriptor"></vn-item-descriptor-popover>

client/ticket/src/sale-checked/index.js

@@ -4,9 +4,19 @@ import FilterTicketList from '../filter-ticket-list';
 class Controller extends FilterTicketList {
     constructor($scope, $timeout, $state) {
         super($scope, $timeout, $state);
-
+        this.$scope = $scope;
         this.onOrder('quantity', 'ASC');
     }
+
+    showDescriptor(event, itemFk) {
+        this.$scope.descriptor.itemFk = itemFk;
+        this.$scope.descriptor.parent = event.target;
+        this.$scope.descriptor.show();
+    }
+
+    onDescriptorLoad() {
+        this.$scope.popover.relocate();
+    }
 }
 
 Controller.$inject = ['$scope', '$timeout', '$state'];

client/ticket/src/sale/index.html

@@ -62,7 +62,5 @@
     </vn-card>
     <vn-paging vn-one margin-large-top index="index" total="index.model.count"></vn-paging>
     <!-- <vn-auto-paging vn-one margin-large-top index="index" total="index.model.count" items="index.model.instances"></vn-auto-paging> -->
-        <vn-item-descriptor-popover vn-id="descriptor">
+    <vn-item-descriptor-popover vn-id="descriptor"></vn-item-descriptor-popover>
-        </vn-item-descriptor-popover>
-    </vn-popover>
 </vn-vertical>

client/ticket/src/summary/index.html

@@ -73,7 +73,10 @@
                                 vn-tooltip="delete expedition"                        
                                 ng-click="$ctrl.deleteExpedition(expedition)">warning</i> -->
                         </td>
-                        <td number>{{("000000"+sale.itemFk).slice(-6)}}</td>
+                        <td number pointer
+                            ng-click="$ctrl.showDescriptor($event, sale.itemFk)">
+                            {{("000000"+sale.itemFk).slice(-6)}}
+                        </td>
                         <td><vn-fetched-tags sale="sale"/></td>
                         <td number>{{::sale.quantity}}</td>
                         <td number>{{::sale.price | currency:'€':2}}</td>
@@ -85,3 +88,4 @@
         </vn-horizontal>
     </vn-vertical>
 </vn-card>
+<vn-item-descriptor-popover vn-id="descriptor"></vn-item-descriptor-popover>

client/ticket/src/summary/index.js

@@ -2,7 +2,8 @@ import ngModule from '../module';
 import './style.scss';
 
 class Controller {
-    constructor($http) {
+    constructor($scope, $http) {
+        this.$scope = $scope;
         this.$http = $http;
     }
 
@@ -15,9 +16,19 @@ class Controller {
                 this.summary = res.data;
         });
     }
+
+    showDescriptor(event, itemFk) {
+        this.$scope.descriptor.itemFk = itemFk;
+        this.$scope.descriptor.parent = event.target;
+        this.$scope.descriptor.show();
+    }
+
+    onDescriptorLoad() {
+        this.$scope.popover.relocate();
+    }
 }
 
-Controller.$inject = ['$http'];
+Controller.$inject = ['$scope', '$http'];
 
 ngModule.component('vnTicketSummary', {
     template: require('./index.html'),

client/ticket/src/volume/index.html

@@ -23,7 +23,8 @@
                 </thead>
                 <tbody>
                     <tr ng-repeat="sale in index.model.instances track by sale.id" class="list list-element">
-                        <td number>{{::sale.itemFk}}</td>
+                        <td number pointer
+                            ng-click="$ctrl.showDescriptor($event, sale.itemFk)">{{::sale.itemFk}}</td>
                         <td><vn-fetched-tags sale="sale"/></td>
                         <td number>{{::sale.quantity}}</td>
                         <td number>{{::sale.volume.m3 | number:3}}</td>
@@ -38,3 +39,5 @@
     <vn-paging vn-one margin-large-top index="index" total="index.model.count"></vn-paging>
     <!-- <vn-auto-paging vn-one margin-large-top index="index" total="index.model.count" items="$ctrl.instances"></vn-auto-paging> -->
 </vn-vertical>
+<vn-item-descriptor-popover vn-id="descriptor"></vn-item-descriptor-popover>
+

client/ticket/src/volume/index.js

@@ -28,6 +28,16 @@ class Controller extends FilterTicketList {
             }
         });
     }
+
+    showDescriptor(event, itemFk) {
+        this.$scope.descriptor.itemFk = itemFk;
+        this.$scope.descriptor.parent = event.target;
+        this.$scope.descriptor.show();
+    }
+
+    onDescriptorLoad() {
+        this.$scope.popover.relocate();
+    }
 }
 
 Controller.$inject = ['$scope', '$http', '$translate', '$timeout', '$state'];