@kigi/components 1.9.1-beta.1 → 1.9.1-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/package.json +1 -1
  2. package/src/components/mbg-multi-select/mbg-multi-select.html +4 -2
  3. package/src/components/mbg-multi-select/mbg-multi-select.ts +10 -8
  4. package/src/components/mbg-product-grid/mbg-product-grid.html +34 -71
  5. package/src/components/mbg-product-grid/mbg-product-grid.scss +2 -27
  6. package/src/components/mbg-product-grid/mbg-product-grid.ts +0 -8
  7. package/src/components/mbg-product-inline/mbg-product-inline.html +21 -55
  8. package/src/components/mbg-product-inline/mbg-product-inline.scss +134 -142
  9. package/src/components/mbg-product-inline/mbg-product-inline.ts +1 -31
  10. package/src/components/mbg-select/mbg-select.ts +28 -5
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kigi/components",
3
- "version": "1.9.1-beta.1",
3
+ "version": "1.9.1-beta.2",
4
4
  "description": "@kigi/components",
5
5
  "main": "src/components/index.ts",
6
6
  "scripts": {
package/src/components/mbg-multi-select/mbg-multi-select.html CHANGED
@@ -3,7 +3,7 @@
3
3
  ng-class="{'disabled': $ctrl.ngDisabled, 'inline-mode-wrapper': $ctrl.inlineMode}">
4
4
  <div class="mbg-multi-select-content">
5
5
  <ul class="items-selected">
6
- <li ng-repeat="item in $ctrl.ngModel"
6
+ <li ng-repeat="item in $ctrl.ngModel track by $index"
7
7
  draggable="true">
8
8
  <label data-text="{{ $ctrl.label ? item[$ctrl.label] : item }}"
9
9
  ng-style="{width: $ctrl.widthEllipsis && $ctrl.inlineMode ? $ctrl.widthEllipsis : 'auto'}">{{
@@ -24,11 +24,13 @@
24
24
  fetch="$ctrl.fetch({ query })"
25
25
  ng-disabled="$ctrl.ngDisabled"
26
26
  ignore-items="$ctrl.ngModel"
27
- on-select="$ctrl.onSelect()"
27
+ on-select="$ctrl.onSelect(value)"
28
28
  ng-blur="$ctrl.ngBlur({ $event })"
29
29
  ng-focus="$ctrl.ngFocus({ $event })"
30
30
  placeholder="{{ $ctrl.placeholder }}"
31
31
  enable-add="$ctrl.enableAdd"
32
+ enable-favorite="$ctrl.enableFavorite"
33
+ many-favorite="true"
32
34
  label="{{ $ctrl.label }}"></mbg-select>
33
35
  </div>
34
36
  </div>
package/src/components/mbg-multi-select/mbg-multi-select.ts CHANGED
@@ -19,6 +19,7 @@ class MbgMultiSelectController {
19
19
  private enableAdd: boolean
20
20
  private inlineMode: boolean
21
21
  private widthEllipsis: string
22
+ private enableFavorite: boolean
22
23
 
23
24
  constructor(public $scope, public $element, public $attrs, public $timeout) {}
24
25
 
@@ -53,26 +54,26 @@ class MbgMultiSelectController {
53
54
  })
54
55
  }
55
56
 
56
- onSelect() {
57
+ onSelect(item?) {
57
58
  this.$timeout(() => {
58
- if (this.searchModel) {
59
+ const currentModel = this.searchModel || item
60
+ if (currentModel) {
59
61
  this.ngModel = this.ngModel || []
60
62
  if (this.ngModel && typeof this.ngModel[0] === 'string') {
61
63
  if (
62
- this.ngModel.filter((v) => v.toLowerCase() === this.searchModel.toLowerCase())
63
- .length === 0
64
+ this.ngModel.filter((v) => v.toLowerCase() === currentModel.toLowerCase()).length === 0
64
65
  ) {
65
66
  if (this.inlineMode) {
66
- this.ngModel.unshift(this.searchModel)
67
+ this.ngModel.unshift(currentModel)
67
68
  } else {
68
- this.ngModel.push(this.searchModel)
69
+ this.ngModel.push(currentModel)
69
70
  }
70
71
  }
71
72
  } else {
72
73
  if (this.inlineMode) {
73
- this.ngModel.unshift(this.searchModel)
74
+ this.ngModel.unshift(currentModel)
74
75
  } else {
75
- this.ngModel.push(this.searchModel)
76
+ this.ngModel.push(currentModel)
76
77
  }
77
78
  }
78
79
  this.verifyScroll()
@@ -242,6 +243,7 @@ const mbgMultiSelect = {
242
243
  ngDisabled: '=?',
243
244
  inlineMode: '=?',
244
245
  widthEllipsis: '@?',
246
+ enableFavorite: '=?',
245
247
  },
246
248
  template,
247
249
  controller: MbgMultiSelectController,
package/src/components/mbg-product-grid/mbg-product-grid.html CHANGED
@@ -1,39 +1,23 @@
1
1
  <div class="mbg-product-grid-wrapper">
2
2
  <table class="table table-striped">
3
- <thead>
3
+ <tbody>
4
4
  <tr>
5
5
  <th class="grid-center-content">
6
- <div class="border-list">
7
- <label>{{ ::$ctrl.y.label }}</label>
8
- </div>
6
+ <label>{{ ::$ctrl.y.label }}</label>
9
7
  </th>
10
- <th class="grid-center-content"
11
- colspan="{{ $ctrl.grid.x.length }}">
12
- <div class="border-list">
13
- <label>{{ ::$ctrl.x.label }}</label>
14
- <a class="grid-adicional-link"
15
- ng-click="$ctrl.onClickExtraButton()">
16
- {{ ::$ctrl.extraButtonLabel }}
17
- </a>
18
- </div>
19
-
8
+ <th class="grid-center-content" colspan="{{ $ctrl.grid.x.length }}">
9
+ <label>{{ ::$ctrl.x.label }}</label>
10
+ <a class="grid-adicional-link" ng-click="$ctrl.onClickExtraButton()">
11
+ {{ ::$ctrl.extraButtonLabel }}
12
+ </a>
20
13
  </th>
21
14
  </tr>
22
15
  <tr>
23
- <td>
24
- <div class="border-list">
25
- </div>
26
- </td>
27
- <td ng-repeat="xItem in $ctrl.grid.x track by xItem.value"
28
- class="grid-center-content">
29
- <div class="border-list">
30
- <label>{{ ::xItem.value }}</label>
31
- </div>
32
-
16
+ <td></td>
17
+ <td ng-repeat="xItem in $ctrl.grid.x track by xItem.value" class="grid-center-content">
18
+ <label>{{ ::xItem.value }}</label>
33
19
  </td>
34
20
  </tr>
35
- </thead>
36
- <tbody>
37
21
  <!-- <tr>
38
22
  <td></td>
39
23
  <td ng-repeat="xItem in $ctrl.grid.x track by xItem.value"
@@ -46,65 +30,44 @@
46
30
  </tr> -->
47
31
  <tr ng-repeat="yItem in $ctrl.grid.y track by yItem.value">
48
32
  <td>
49
- <div class="grid-product-item-name-wrapper border-list">
50
- <div class="grid-product-item-circle"
51
- ng-style="{'background': yItem.valueRef}"></div>
33
+ <div class="grid-product-item-name-wrapper">
34
+ <div class="grid-product-item-circle" ng-style="{'background': yItem.valueRef}"></div>
52
35
  <span>{{ ::yItem.value }}</span>
53
36
  </div>
54
37
  </td>
55
38
  <td ng-repeat="xItem in $ctrl.grid.x track by xItem.value">
56
39
  <div class="grid-transclude-edit-wrapper">
57
- <div ng-show="$ctrl.transcludeTemplate"
58
- mbg-dynamic-html="$ctrl.transcludeTemplate"></div>
40
+ <div ng-show="$ctrl.transcludeTemplate" mbg-dynamic-html="$ctrl.transcludeTemplate"></div>
59
41
  </div>
60
- <div ng-show="!$ctrl.transcludeTemplate"
61
- class="grid-product-edit-wrapper">
62
- <svg tabindex="-1"
63
- height="401pt"
64
- viewBox="0 -1 401.52289 401"
65
- width="401pt"
66
- ng-click="$ctrl.onClickEditButton({ x: xItem, y: yItem })"
67
- ng-show="$ctrl.activeEdit && $ctrl.gridValues[$index][$parent.$index].enable"
68
- xmlns="http://www.w3.org/2000/svg">
42
+ <div ng-show="!$ctrl.transcludeTemplate" class="grid-product-edit-wrapper">
43
+ <svg tabindex="-1" height="401pt" viewBox="0 -1 401.52289 401" width="401pt"
44
+ ng-click="$ctrl.onClickEditButton({ x: xItem, y: yItem })"
45
+ ng-show="$ctrl.activeEdit && $ctrl.gridValues[$index][$parent.$index].enable"
46
+ xmlns="http://www.w3.org/2000/svg">
69
47
  <path
70
- d="m370.589844 250.972656c-5.523438 0-10 4.476563-10 10v88.789063c-.019532 16.5625-13.4375 29.984375-30 30h-280.589844c-16.5625-.015625-29.980469-13.4375-30-30v-260.589844c.019531-16.558594 13.4375-29.980469 30-30h88.789062c5.523438 0 10-4.476563 10-10 0-5.519531-4.476562-10-10-10h-88.789062c-27.601562.03125-49.96875 22.398437-50 50v260.59375c.03125 27.601563 22.398438 49.96875 50 50h280.589844c27.601562-.03125 49.96875-22.398437 50-50v-88.792969c0-5.523437-4.476563-10-10-10zm0 0" />
48
+ d="m370.589844 250.972656c-5.523438 0-10 4.476563-10 10v88.789063c-.019532 16.5625-13.4375 29.984375-30 30h-280.589844c-16.5625-.015625-29.980469-13.4375-30-30v-260.589844c.019531-16.558594 13.4375-29.980469 30-30h88.789062c5.523438 0 10-4.476563 10-10 0-5.519531-4.476562-10-10-10h-88.789062c-27.601562.03125-49.96875 22.398437-50 50v260.59375c.03125 27.601563 22.398438 49.96875 50 50h280.589844c27.601562-.03125 49.96875-22.398437 50-50v-88.792969c0-5.523437-4.476563-10-10-10zm0 0" />
71
49
  <path
72
- d="m376.628906 13.441406c-17.574218-17.574218-46.066406-17.574218-63.640625 0l-178.40625 178.40625c-1.222656 1.222656-2.105469 2.738282-2.566406 4.402344l-23.460937 84.699219c-.964844 3.472656.015624 7.191406 2.5625 9.742187 2.550781 2.546875 6.269531 3.527344 9.742187 2.566406l84.699219-23.464843c1.664062-.460938 3.179687-1.34375 4.402344-2.566407l178.402343-178.410156c17.546875-17.585937 17.546875-46.054687 0-63.640625zm-220.257812 184.90625 146.011718-146.015625 47.089844 47.089844-146.015625 146.015625zm-9.40625 18.875 37.621094 37.625-52.039063 14.417969zm227.257812-142.546875-10.605468 10.605469-47.09375-47.09375 10.609374-10.605469c9.761719-9.761719 25.589844-9.761719 35.351563 0l11.738281 11.734375c9.746094 9.773438 9.746094 25.589844 0 35.359375zm0 0" />
50
+ d="m376.628906 13.441406c-17.574218-17.574218-46.066406-17.574218-63.640625 0l-178.40625 178.40625c-1.222656 1.222656-2.105469 2.738282-2.566406 4.402344l-23.460937 84.699219c-.964844 3.472656.015624 7.191406 2.5625 9.742187 2.550781 2.546875 6.269531 3.527344 9.742187 2.566406l84.699219-23.464843c1.664062-.460938 3.179687-1.34375 4.402344-2.566407l178.402343-178.410156c17.546875-17.585937 17.546875-46.054687 0-63.640625zm-220.257812 184.90625 146.011718-146.015625 47.089844 47.089844-146.015625 146.015625zm-9.40625 18.875 37.621094 37.625-52.039063 14.417969zm227.257812-142.546875-10.605468 10.605469-47.09375-47.09375 10.609374-10.605469c9.761719-9.761719 25.589844-9.761719 35.351563 0l11.738281 11.734375c9.746094 9.773438 9.746094 25.589844 0 35.359375zm0 0" />
73
51
  </svg>
74
- <a tabindex="-1"
75
- class="link"
76
- ng-show="$ctrl.activeAddOrRemove"
77
- ng-click="$ctrl.toogleEnableItem($index, $parent.$index)">
52
+ <a tabindex="-1" class="link" ng-show="$ctrl.activeAddOrRemove"
53
+ ng-click="$ctrl.toogleEnableItem($index, $parent.$index)">
78
54
  {{ $ctrl.gridValues[$index][$parent.$index].enable ? 'Remover' : 'Adicionar'}}
79
55
  </a>
80
- <span tabindex="-1"
81
- ng-show="$ctrl.enableCurrentStock">Estoque:
56
+ <span tabindex="-1" ng-show="$ctrl.enableCurrentStock">Estoque:
82
57
  {{$ctrl.gridValues[$index][$parent.$index].currentStock || '0'}}</span>
83
58
  <span tabindex="-1"
84
- ng-class="{ 'grid-disable': $ctrl.activeAddOrRemove && !$ctrl.gridValues[$index][$parent.$index].enable }">
59
+ ng-class="{ 'grid-disable': $ctrl.activeAddOrRemove && !$ctrl.gridValues[$index][$parent.$index].enable }">
85
60
  {{$ctrl.inputLabel ? $ctrl.inputLabel : $ctrl.showStock ? 'Estoque' : 'R$ Venda'}}</span>
86
- <input tabindex="0"
87
- type="number"
88
- ng-show="$ctrl.showStock"
89
- ng-model="$ctrl.gridValues[$index][$parent.$index].stock"
90
- placeholder="0"
91
- ng-keydown="$ctrl.onKeydown($event)"
92
- ng-class="{ 'grid-disable': $ctrl.activeAddOrRemove && !$ctrl.gridValues[$index][$parent.$index].enable }"
93
- ng-change="$ctrl.handleGridValues()"
94
- ng-model-options="{ debounce: 500 }"
95
- class="grid-product-stock"
96
- onwheel="this.blur()" />
97
- <input tabindex="-1"
98
- type="text"
99
- ng-model="$ctrl.gridValues[$index][$parent.$index].price"
100
- ng-show="$ctrl.enablePrice"
101
- ui-money-mask
102
- ng-disabled="$ctrl.ngDisabled"
103
- onclick="angular.element(this).scope().$ctrl.focusInput(this)"
104
- ng-class="{ 'grid-disable': $ctrl.activeAddOrRemove && !$ctrl.gridValues[$index][$parent.$index].enable }"
105
- ng-change="$ctrl.handleGridValues()"
106
- class="grid-product-money"
107
- placeholder="0" />
61
+ <input tabindex="0" type="number" ng-show="$ctrl.showStock"
62
+ ng-model="$ctrl.gridValues[$index][$parent.$index].stock" placeholder="0"
63
+ ng-keydown="$ctrl.onKeydown($event)"
64
+ ng-class="{ 'grid-disable': $ctrl.activeAddOrRemove && !$ctrl.gridValues[$index][$parent.$index].enable }"
65
+ ng-change="$ctrl.handleGridValues()" ng-model-options="{ debounce: 500 }" class="grid-product-stock" onwheel="this.blur()" />
66
+ <input tabindex="-1" type="text" ng-model="$ctrl.gridValues[$index][$parent.$index].price"
67
+ ng-show="$ctrl.enablePrice" ui-money-mask ng-disabled="$ctrl.ngDisabled"
68
+ onclick="angular.element(this).scope().$ctrl.focusInput(this)"
69
+ ng-class="{ 'grid-disable': $ctrl.activeAddOrRemove && !$ctrl.gridValues[$index][$parent.$index].enable }"
70
+ ng-change="$ctrl.handleGridValues()" class="grid-product-money" placeholder="0" />
108
71
  </div>
109
72
  </td>
110
73
  </tr>
package/src/components/mbg-product-grid/mbg-product-grid.scss CHANGED
@@ -8,25 +8,10 @@
8
8
  input[type="number"] {
9
9
  -moz-appearance: textfield;
10
10
  }
11
- // overflow: auto;
12
- max-height: 600px;
11
+ overflow: auto;
13
12
  table {
14
13
  border-radius: 5px;
15
- thead {
16
- padding: 0 !important;
17
- border: 0 !important;
18
- th {
19
- padding: 0 !important;
20
- border: 0 !important;
21
- }
22
- td {
23
- background-color: #fff;
24
- z-index: 1;
25
- padding: 0 !important;
26
- border: 0 !important;
27
- }
28
- }
29
- tbody, thead {
14
+ tbody {
30
15
  border: 1px solid #ccc;
31
16
  border-radius: 5px;
32
17
  .grid-center-content {
@@ -47,8 +32,6 @@
47
32
  border-top: 1px solid #ccc;
48
33
  border-left: 1px solid #ccc;
49
34
  height: 54px;
50
- padding: 0 !important;
51
- border: 0 !important;
52
35
  .grid-adicional-link {
53
36
  position: absolute;
54
37
  right: 18px;
@@ -78,8 +61,6 @@
78
61
  align-items: flex-end;
79
62
  color: #666;
80
63
  font-weight: 500;
81
- padding: 8px;
82
- border: 1px solid #ccc;
83
64
  .grid-disable {
84
65
  pointer-events: none;
85
66
  opacity: 0;
@@ -178,9 +159,3 @@
178
159
  margin: 0 10px !important;
179
160
  }
180
161
  }
181
-
182
- .border-list {
183
- width: 100%;
184
- height:100%;
185
- border: 1px solid #ccc;
186
- }
package/src/components/mbg-product-grid/mbg-product-grid.ts CHANGED
@@ -32,7 +32,6 @@ class MbgProductGridController {
32
32
  this.findTransclude()
33
33
  this.$scope.$watch('$ctrl.ngModel', () => this.handleModel(), true)
34
34
  this.$scope.$watch('$ctrl.details', () => this.handleModel(), true)
35
- this.handleGridView()
36
35
  }
37
36
 
38
37
  findTransclude() {
@@ -123,13 +122,6 @@ class MbgProductGridController {
123
122
  focusInput(element) {
124
123
  element.select()
125
124
  }
126
-
127
- handleGridView() {
128
- angular.element('.mbg-product-grid-wrapper table').mbgSmartGrid({
129
- head: true,
130
- left: 1,
131
- })
132
- }
133
125
  }
134
126
 
135
127
  MbgProductGridController.$inject = ['$scope', '$element', '$attrs', '$timeout', '$transclude']
package/src/components/mbg-product-inline/mbg-product-inline.html CHANGED
@@ -1,85 +1,51 @@
1
1
  <div class="mbg-product-inline-wrapper">
2
2
  <div class="default-header-inline">
3
3
  <div class="inline-row">
4
- <div class="x-value-col"
5
- ng-click="$ctrl.order($ctrl.x.label, $ctrl.orderDirSizes == 'asc' ? 'desc' : 'asc')">
4
+ <div class="x-value-col">
6
5
  <label>{{$ctrl.x.label}}</label>
7
- <i class="fa fa-angle-down"
8
- ng-show="$ctrl.orderDirSizes == 'asc'"></i>
9
- <i class="fa fa-angle-up"
10
- ng-show="$ctrl.orderDirSizes == 'desc'"></i>
11
6
  </div>
12
- <div class="y-value-col"
13
- ng-click="$ctrl.order($ctrl.y.label, $ctrl.orderDirColors == 'asc' ? 'desc' : 'asc')">
7
+ <div class="y-value-col">
14
8
  <label>{{$ctrl.y.label}}</label>
15
- <i class="fa fa-angle-down"
16
- ng-show="$ctrl.orderDirColors == 'asc'"></i>
17
- <i class="fa fa-angle-up"
18
- ng-show="$ctrl.orderDirColors == 'desc'"></i>
19
9
  </div>
20
- <div class="barcode-col"
21
- ng-hide="$ctrl.hideBarcode">
10
+ <div class="barcode-col" ng-hide="$ctrl.hideBarcode">
22
11
  <label>Código de barras</label>
23
12
  </div>
24
13
  <div class="stock-col">
25
14
  <label>Estoque</label>
26
15
  </div>
27
- <div class="price-col"
28
- ng-hide="$ctrl.hidePrice">
16
+ <div class="price-col" ng-hide="$ctrl.hidePrice">
29
17
  <label>Preço</label>
30
18
  </div>
31
19
  </div>
32
20
  </div>
33
- <div class="inline-content"
34
- ng-style="{'max-height': $ctrl.maxHeight + 'px'}">
21
+ <div class="inline-content" ng-style="{'max-height': $ctrl.maxHeight + 'px'}">
35
22
  <div class="inline-x">
36
- <div class="inline-y"
37
- ng-if="item[$ctrl.activeAttr] === undefined ? true : item[$ctrl.activeAttr]"
38
- ng-repeat="item in $ctrl.ngModel track by $index">
23
+ <div class="inline-y" ng-if="item[$ctrl.activeAttr] === undefined ? true : item[$ctrl.activeAttr]"
24
+ ng-repeat="item in $ctrl.ngModel track by $index">
39
25
  <div class="inline-row"
40
- ng-class="{'default-template': !$ctrl.transcludeTemplate && $parent.$index === 0 && $index === 0}">
26
+ ng-class="{'default-template': !$ctrl.transcludeTemplate && $parent.$index === 0 && $index === 0}">
41
27
  <div class="x-value-col">
42
28
  <span tabindex="-1">{{ item.xDetail.value}}</span>
43
29
  </div>
44
30
  <div class="y-value-col">
45
- <div class="grid-product-item-circle"
46
- ng-style="{'background': item.yDetail.valueRef}"></div>
31
+ <div class="grid-product-item-circle" ng-style="{'background': item.yDetail.valueRef}"></div>
47
32
  <span tabindex="-1">{{ item.yDetail.value }}</span>
48
33
  </div>
49
- <div class="barcode-col"
50
- ng-hide="$ctrl.hideBarcode">
51
- <input tabindex="-1"
52
- type="text"
53
- ng-class="{'input-error': item.inputError}"
54
- ng-change="$ctrl.changeBarCode(item)"
55
- onclick="angular.element(this).scope().$ctrl.focusInput(this)"
56
- ng-model="item.barCode"
57
- placeholder="Código de barras"
58
- ng-model-options="{ debounce: 500 }"
59
- class="inline-product-barcode" />
34
+ <div class="barcode-col" ng-hide="$ctrl.hideBarcode">
35
+ <input tabindex="-1" type="text" ng-class="{'input-error': item.inputError}"
36
+ ng-change="$ctrl.changeBarCode(item)" onclick="angular.element(this).scope().$ctrl.focusInput(this)"
37
+ ng-model="item.barCode" placeholder="Código de barras" ng-model-options="{ debounce: 500 }"
38
+ class="inline-product-barcode" />
60
39
  </div>
61
40
  <div class="stock-col">
62
- <input tabindex="0"
63
- type="number"
64
- onclick="angular.element(this).scope().$ctrl.focusInput(this)"
65
- ng-model="item.stock"
66
- ng-keydown="$ctrl.onKeydown($event)"
67
- placeholder="0"
68
- placeholder="Estoque"
69
- ng-model-options="{ debounce: 500 }"
70
- class="inline-product-stock"
71
- onwheel="this.blur()" />
41
+ <input tabindex="0" type="number" onclick="angular.element(this).scope().$ctrl.focusInput(this)"
42
+ ng-model="item.stock" ng-keydown="$ctrl.onKeydown($event)" placeholder="0" placeholder="Estoque"
43
+ ng-model-options="{ debounce: 500 }" class="inline-product-stock" onwheel="this.blur()" />
72
44
  </div>
73
- <div class="price-col"
74
- ng-hide="$ctrl.hidePrice">
75
- <input tabindex="-1"
76
- type="text"
77
- onclick="angular.element(this).scope().$ctrl.focusInput(this)"
78
- ng-model="item.price"
79
- ui-money-mask
80
- ng-disabled="$ctrl.ngDisabled"
81
- class="inline-product-money"
82
- placeholder="0" />
45
+ <div class="price-col" ng-hide="$ctrl.hidePrice">
46
+ <input tabindex="-1" type="text" onclick="angular.element(this).scope().$ctrl.focusInput(this)"
47
+ ng-model="item.price" ui-money-mask ng-disabled="$ctrl.ngDisabled" class="inline-product-money"
48
+ placeholder="0" />
83
49
  </div>
84
50
  </div>
85
51
  </div>
package/src/components/mbg-product-inline/mbg-product-inline.scss CHANGED
@@ -1,177 +1,169 @@
1
1
  .mbg-product-inline-wrapper {
2
- input[type="number"]::-webkit-outer-spin-button,
3
- input[type="number"]::-webkit-inner-spin-button {
4
- -webkit-appearance: none;
5
- margin: 0;
6
- }
7
-
8
- input[type="number"] {
9
- -moz-appearance: textfield;
10
- }
11
- .inline-content {
12
- overflow: auto;
13
- }
14
-
15
- .inline-y {
16
- &:first-child {
17
- .inline-row {
18
- border-top: 1px solid #ccc;
2
+ input[type="number"]::-webkit-outer-spin-button,
3
+ input[type="number"]::-webkit-inner-spin-button {
4
+ -webkit-appearance: none;
5
+ margin: 0;
6
+ }
7
+
8
+ input[type="number"] {
9
+ -moz-appearance: textfield;
10
+ }
11
+ .inline-content {
12
+ overflow: auto;
13
+ }
14
+
15
+ .inline-y {
16
+ &:first-child {
17
+ .inline-row {
18
+ border-top: 1px solid #ccc;
19
+ }
19
20
  }
20
21
  }
21
- }
22
22
 
23
- .inline-row {
24
- display: flex;
25
- height: 44px;
26
- border-bottom: 1px solid #ccc;
27
- border-left: 1px solid #ccc;
28
- border-right: 1px solid #ccc;
29
-
30
- div {
31
- flex: 1;
32
- }
33
-
34
- .x-value-col {
23
+ .inline-row {
35
24
  display: flex;
36
- align-items: center;
37
- justify-content: center;
38
- max-width: 154px;
39
-
40
- span {
41
- font-weight: 600;
42
- color: #666;
43
- }
25
+ height: 44px;
26
+ border-bottom: 1px solid #ccc;
27
+ border-left: 1px solid #ccc;
28
+ border-right: 1px solid #ccc;
44
29
 
45
- label {
46
- margin-right: 5px;
30
+ div {
31
+ flex: 1;
47
32
  }
48
- }
49
33
 
50
- .y-value-col {
51
- display: flex;
52
- align-items: center;
53
- justify-content: flex-start;
54
- max-width: 174px;
34
+ .x-value-col {
35
+ display: flex;
36
+ align-items: center;
37
+ justify-content: center;
38
+ max-width: 154px;
55
39
 
56
- label {
57
- margin-right: 5px;
40
+ span {
41
+ font-weight: 600;
42
+ color: #666;
43
+ }
58
44
  }
59
- }
60
-
61
- .barcode-col {
62
- display: flex;
63
- align-items: center;
64
- justify-content: center;
65
- }
66
45
 
67
- .stock-col {
68
- display: flex;
69
- align-items: center;
70
- justify-content: center;
71
- }
72
-
73
- .price-col {
74
- display: flex;
75
- align-items: center;
76
- justify-content: center;
77
- }
78
-
79
- .grid-product-item-circle {
80
- max-width: 18px;
81
- width: 18px;
82
- height: 18px;
83
- border-radius: 50%;
84
- margin: 0 12px 0 0;
85
- }
86
-
87
- input {
88
- background: transparent;
89
- height: 100%;
90
- width: 100%;
91
- padding-right: 14px;
92
- &.input-error {
93
- color: #ff002e;
46
+ .y-value-col {
47
+ display: flex;
48
+ align-items: center;
49
+ justify-content: flex-start;
50
+ max-width: 174px;
94
51
  }
95
- }
96
-
97
- input[type="number"] {
98
- -moz-appearance: textfield;
99
- }
100
52
 
101
- input::-webkit-outer-spin-button,
102
- input::-webkit-inner-spin-button {
103
- -webkit-appearance: none;
104
- }
53
+ .barcode-col {
54
+ display: flex;
55
+ align-items: center;
56
+ justify-content: center;
57
+ }
105
58
 
106
- input {
107
- padding: 0 6px;
108
- border: none;
109
- text-align: right;
110
- outline: none;
59
+ .stock-col {
60
+ display: flex;
61
+ align-items: center;
62
+ justify-content: center;
63
+ }
111
64
 
112
- &.ng-touched.ng-invalid {
113
- border: 1px solid #b00020;
65
+ .price-col {
66
+ display: flex;
67
+ align-items: center;
68
+ justify-content: center;
114
69
  }
115
70
 
116
- &[disabled="disabled"] {
117
- background: #f5f5f5;
71
+ .grid-product-item-circle {
72
+ max-width: 18px;
73
+ width: 18px;
74
+ height: 18px;
75
+ border-radius: 50%;
76
+ margin: 0 12px 0 0;
118
77
  }
119
78
 
120
- &::-webkit-input-placeholder {
121
- color: #bcbcbc;
122
- font-style: italic;
79
+ input {
80
+ background: transparent;
81
+ height: 100%;
82
+ width: 100%;
83
+ padding-right: 14px;
84
+ &.input-error {
85
+ color: #ff002e;
86
+ }
123
87
  }
124
88
 
125
- &:-moz-placeholder {
126
- /* Firefox 18- */
127
- color: #bcbcbc;
128
- font-style: italic;
89
+ input[type="number"] {
90
+ -moz-appearance: textfield;
129
91
  }
130
92
 
131
- &::-moz-placeholder {
132
- /* Firefox 19+ */
133
- color: #bcbcbc;
134
- font-style: italic;
93
+ input::-webkit-outer-spin-button,
94
+ input::-webkit-inner-spin-button {
95
+ -webkit-appearance: none;
135
96
  }
136
97
 
137
- &:-ms-input-placeholder {
138
- color: #bcbcbc;
139
- font-style: italic;
98
+ input {
99
+ padding: 0 6px;
100
+ border: none;
101
+ text-align: right;
102
+ outline: none;
103
+
104
+ &.ng-touched.ng-invalid {
105
+ border: 1px solid #b00020;
106
+ }
107
+
108
+ &[disabled="disabled"] {
109
+ background: #f5f5f5;
110
+ }
111
+
112
+ &::-webkit-input-placeholder {
113
+ color: #bcbcbc;
114
+ font-style: italic;
115
+ }
116
+
117
+ &:-moz-placeholder {
118
+ /* Firefox 18- */
119
+ color: #bcbcbc;
120
+ font-style: italic;
121
+ }
122
+
123
+ &::-moz-placeholder {
124
+ /* Firefox 19+ */
125
+ color: #bcbcbc;
126
+ font-style: italic;
127
+ }
128
+
129
+ &:-ms-input-placeholder {
130
+ color: #bcbcbc;
131
+ font-style: italic;
132
+ }
140
133
  }
141
- }
142
134
 
143
- .inline-product-money {
144
- color: #666;
145
- font-size: 16px;
146
- font-weight: 600;
135
+ .inline-product-money {
136
+ color: #666;
137
+ font-size: 16px;
138
+ font-weight: 600;
139
+ }
147
140
  }
148
- }
149
141
 
150
- .default-header-inline {
151
- * {
152
- border: 0;
153
- }
142
+ .default-header-inline {
143
+ * {
144
+ border: 0;
145
+ }
154
146
 
155
- .barcode-col {
156
- padding-right: 6px;
157
- justify-content: flex-end;
158
- }
147
+ .barcode-col {
148
+ padding-right: 6px;
149
+ justify-content: flex-end;
150
+ }
159
151
 
160
- .stock-col {
161
- padding-right: 6px;
162
- justify-content: flex-end;
163
- }
152
+ .stock-col {
153
+ padding-right: 6px;
154
+ justify-content: flex-end;
155
+ }
164
156
 
165
- .price-col {
166
- padding-right: 6px;
167
- justify-content: flex-end;
168
- }
157
+ .price-col {
158
+ padding-right: 6px;
159
+ justify-content: flex-end;
160
+ }
169
161
 
170
- label {
171
- display: flex;
172
- text-align: center;
173
- color: #666;
174
- font-weight: 600;
162
+ label {
163
+ display: flex;
164
+ text-align: center;
165
+ color: #666;
166
+ font-weight: 600;
167
+ }
175
168
  }
176
169
  }
177
- }
package/src/components/mbg-product-inline/mbg-product-inline.ts CHANGED
@@ -8,10 +8,8 @@ class MbgProductInlineController {
8
8
  private y: { key: string; label: string }
9
9
  private gridValues: any
10
10
  private errorCallBackBarCode: Function
11
- private orderDirSizes: 'asc' | 'dir' = 'asc'
12
- private orderDirColors: 'asc' | 'dir' = 'asc'
13
11
 
14
- constructor(public $scope, public $element, public $attrs, public $timeout, public $transclude) {}
12
+ constructor(public $scope, public $element, public $attrs, public $timeout, public $transclude) { }
15
13
 
16
14
  $onInit() {
17
15
  this.gridValues = {}
@@ -46,34 +44,6 @@ class MbgProductInlineController {
46
44
  }
47
45
  }
48
46
  }
49
-
50
- orderSizes(a, b, dir) {
51
- if (dir == 'asc') {
52
- return Number(a.xDetail.valueRef || 9999) - Number(b.xDetail.valueRef || 99999)
53
- } else {
54
- return Number(b.xDetail.valueRef || 99999) - Number(a.xDetail.valueRef || 9999)
55
- }
56
- }
57
-
58
- orderColors(a, b, dir) {
59
- if (dir == 'asc') {
60
- return a.yDetail.description.localeCompare(b.yDetail.description)
61
- } else {
62
- return b.yDetail.description.localeCompare(a.yDetail.description)
63
- }
64
- }
65
-
66
- order(column, dir) {
67
- if (column == 'TAMANHOS') {
68
- this.orderDirSizes = dir
69
- this.ngModel.sort((a, b) => this.orderSizes(a, b, dir))
70
- } else {
71
- this.orderDirColors = dir
72
- this.ngModel.sort(
73
- (a, b) => this.orderSizes(a, b, this.orderDirSizes) || this.orderColors(a, b, dir),
74
- )
75
- }
76
- }
77
47
  }
78
48
 
79
49
  MbgProductInlineController.$inject = ['$scope', '$element', '$attrs', '$timeout', '$transclude']
package/src/components/mbg-select/mbg-select.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { Capitalize } from '@kigi/components/src/helpers/capitalize';
1
+ import { Capitalize } from '@kigi/components/src/helpers/capitalize'
2
2
  import * as angular from 'angular'
3
3
  import './mbg-select.scss'
4
4
  import template from './mbg-select.html'
@@ -44,6 +44,7 @@ class MbgSelectController {
44
44
  private transcludeSize: any
45
45
  private getCustomModel: Function
46
46
  private capitalize
47
+ private manyFavorite: boolean
47
48
 
48
49
  constructor(
49
50
  public $scope,
@@ -52,7 +53,7 @@ class MbgSelectController {
52
53
  public $timeout,
53
54
  public $compile,
54
55
  public $transclude,
55
- ) { }
56
+ ) {}
56
57
 
57
58
  $onInit() {
58
59
  this.fixedValue = this.ngValue || 'id'
@@ -430,6 +431,12 @@ class MbgSelectController {
430
431
  this.executeCallback(isNew)
431
432
  this.pressEnter = false
432
433
  this.hasFocus = false
434
+ if (item instanceof Array) {
435
+ if (this.onSelect) {
436
+ item.forEach((i) => this.onSelect({ value: i }))
437
+ return
438
+ }
439
+ }
433
440
  await this.updateModelValue(this.ngValue ? item[this.ngValue] : item)
434
441
  if (this.onSelect) {
435
442
  this.onSelect({ value: this.ngModel })
@@ -599,8 +606,19 @@ class MbgSelectController {
599
606
  favorite(evt, item) {
600
607
  evt.preventDefault()
601
608
  evt.stopPropagation()
602
- if (this.isFavorite(item)) {
609
+ if (this.isFavorite(item) && !this.manyFavorite) {
603
610
  MbgCookie.set(this.getFavoriteKey(), null)
611
+ } else if (this.manyFavorite) {
612
+ if (this.isFavorite(item)) {
613
+ const favorite = MbgCookie.get(this.getFavoriteKey())
614
+ const index = favorite.findIndex((i) => i.id == item.id)
615
+ favorite.splice(index, 1)
616
+ MbgCookie.set(this.getFavoriteKey(), favorite)
617
+ } else {
618
+ const favorite = MbgCookie.get(this.getFavoriteKey())
619
+ const favoriteArray = favorite ? (favorite instanceof Array ? favorite : [favorite]) : []
620
+ MbgCookie.set(this.getFavoriteKey(), [...favoriteArray, item])
621
+ }
604
622
  } else {
605
623
  MbgCookie.set(this.getFavoriteKey(), item)
606
624
  }
@@ -621,7 +639,11 @@ class MbgSelectController {
621
639
 
622
640
  isFavorite(item) {
623
641
  const favorite = MbgCookie.get(this.getFavoriteKey())
624
- return favorite && angular.equals(favorite, item)
642
+ if (this.manyFavorite) {
643
+ return favorite && (favorite || []).find((i) => i && i.id == item.id)
644
+ } else {
645
+ return favorite && angular.equals(favorite, item)
646
+ }
625
647
  }
626
648
 
627
649
  async fixedOption(evt, item) {
@@ -672,7 +694,8 @@ const mbgSelect = {
672
694
  callbackAddFixedOption: '&?',
673
695
  transcludeSize: '=?',
674
696
  getCustomModel: '&?',
675
- capitalize: '=?'
697
+ capitalize: '=?',
698
+ manyFavorite: '=?',
676
699
  },
677
700
  controller: MbgSelectController,
678
701
  template,