ru.coon 3.0.12 → 3.0.13

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 (7) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/package.json +1 -1
  3. package/src/nav/AppNavigationPanel.js +92 -54
  4. package/src/nav/AppNavigationPanel.scss +100 -7
  5. package/src/nav/AppNavigationPanelController.js +180 -157
  6. package/src/util.js +1 -1
  7. package/src/version.js +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,6 @@
1
+ # Version 3.0.13, [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/69daa3a3eded1749d18511d789e78fb16183c688)
2
+ * update: CHANGELOG.md ([eb9d44], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/eb9d449ea27de953433b6b94e08da7d06acf3365))
3
+
1
4
  # Version 3.0.12, [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/0c447ca5061cf5797eafaa30bb6e17197e76363a)
2
5
  * ## Fixes
3
6
  * <span style='color:red'>fix ComponentHierarchy</span> ([cc41c6], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/cc41c695854f91ad429dc3e918cb4ffbfb0c8b62))
@@ -6,8 +9,13 @@
6
9
  * update: CHANGELOG.md ([14ee18], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/14ee1852bde7c78ba01dc19d811ea842bf8c8d79))
7
10
 
8
11
  # Version 3.0.11, [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/81bfea3da8aa88897674b9f4908dcebd7fccfec9)
12
+ * ## Features
13
+ * <span style='color:green'>feat: HT-12185 transition from search and removed favoriteView</span> ([7e1dab], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/7e1dab1dfa2f26d6c8041d71970ae3297f9a56bb))
14
+
9
15
  * ## Fixes
10
16
  * <span style='color:red'>fix title on menuItem components</span> ([80e0e1], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/80e0e17c03e338820fd24a5cc8d5d24f53c43d8a))
17
+ * <span style='color:red'> HT-12185 refactoring</span> ([24ec9d], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/24ec9da1ea638da54735f3f337cb4ab42bedc240))
18
+ * <span style='color:red'> HT-12185 refactoring</span> ([1c0c36], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/1c0c3689812fb47003fd56359bd7cae29c9d1201))
11
19
 
12
20
  * up ([92525a], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/92525a0e9d6bacf6107595796d27f1de04086a93))
13
21
  * update: CHANGELOG.md ([203567], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/20356738803f224ae31cd3dba9f3fb2b47938242))
@@ -24,6 +32,7 @@
24
32
  * ## Fixes
25
33
  * <span style='color:red'>fix error on invalid menuItem id in url</span> ([2ea41b], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/2ea41b986155f8457088d5f11c988418d645c9ac))
26
34
  * <span style='color:red'> HT-12211 fix indents</span> ([6e199c], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/6e199c0b9d3ade1640e9d8e2c9525316a9e95007))
35
+ * <span style='color:red'> HT-12185 fix css</span> ([1eee62], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/1eee6206eb5b7aece27d1afcab25f099598a480d))
27
36
 
28
37
  * add openInEditor in component hierarchy ([08f577], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/08f5779e801d80935e5fb34256e157939b5f8fee))
29
38
  * HT-12472 fix: Исправление отображения «Меню навигации» и другого в старых версиях браузера chrome ([798820], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/798820de0189e38991454e2021eb9b76fb6d7644))
@@ -42,6 +51,9 @@
42
51
  * ## Features
43
52
  * <span style='color:green'>feat: NEVA-828: Доработка копирования плагинов, пересобираю объект что бы вложенные объекты не были ссылочными. + мелкие фиксы</span> ([5524d0], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/5524d0ac04332a4ebd845ef77a68295551a1d81b))
44
53
 
54
+ * ## Fixes
55
+ * <span style='color:red'> HT-12185 search fix clickability and fix css</span> ([6bdb16], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/6bdb1680fc5342a5e19d2bfcf419c0d1c32bf0ed))
56
+
45
57
  * up ([6f6c21], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/6f6c219276a6b1d3f93cded8d1b9428913ab3935))
46
58
  * update: CHANGELOG.md ([e963ac], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/e963ac9403c3210aff84abbcc9cd67104f8adc34))
47
59
 
@@ -52,6 +64,11 @@
52
64
  * update: CHANGELOG.md ([00de7c], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/00de7c83a272fdf985d3627c192c05c1be1e8953))
53
65
 
54
66
  # Version 3.0.5, [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/e0c4d5ae7335ab5af50f01462f36c1de26edf311)
67
+ * ## Fixes
68
+ * <span style='color:red'> HT-12185 search refactoring</span> ([e21bbd], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/e21bbd36d1155ab7cfe1bb405d50728c56ccf1c2))
69
+ * <span style='color:red'> HT-12185 search</span> ([e50323], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/e50323c792f60ff17aa9961dc1ad964c14fed31c))
70
+ * <span style='color:red'> HT-12185 upd</span> ([0f464c], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/0f464c05f885da9d2b4d8c0b630130e73a6cd159))
71
+
55
72
  * up ([57408c], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/57408cd0e2e46ae1fb908ac0d93623681b4fcff4))
56
73
  * up ([65fcec], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/65fcecf6226bad1b6d533e7b555f23975eb8f0c2))
57
74
  * upd ([3fd072], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/3fd07257e024736c717ef15caf375ed43a31b0a2))
@@ -59,6 +76,9 @@
59
76
  * update: CHANGELOG.md ([1fd600], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/1fd600e9b7989b7e5294a4c7eee46ef1019fb09e))
60
77
 
61
78
  # Version 3.0.4, [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/2e89a5f1e7ef7e24ea4984b55dd164b542f7c8c1)
79
+ * ## Fixes
80
+ * <span style='color:red'> HT-12185 upd</span> ([86bc67], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/86bc676e648c14952153c54989b9292f0136766e))
81
+
62
82
  * add tooltips for CenterView tabs
63
83
  remove first menuItem autoload for Menu ([29ead4], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/29ead462b5631357f3662ff3aeb2ca4449f2aa97))
64
84
  * refactor: change jsdoc on UiCPWrapper ([be109a], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/be109a9cc9bb97543f9a864d7b719396a93e9f81))
@@ -71,6 +91,8 @@ remove first menuItem autoload for Menu ([29ead4], [link](http://gitlab-dbr.sigm
71
91
 
72
92
  * ## Fixes
73
93
  * <span style='color:red'> HT-12066 scroller display only for CenterViewTabBar</span> ([2d8a87], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/2d8a8782c9b28265b3f2c3f455de4a7ea8629ed9))
94
+ * <span style='color:red'> HT-12185 upd</span> ([118434], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/118434fde8fc0a0dd3d44d0a24c3d8f1cd92ad53))
95
+ * <span style='color:red'> HT-12185 upd</span> ([b6b1c6], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/b6b1c69e181dbc5b155021e455222a450bf9808d))
74
96
  * <span style='color:red'> HT-12083 NorthPanel search button handler bind</span> ([292cec], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/292cecb1463110c53151814f0565d56916945d99))
75
97
 
76
98
  * add title method to UiCustomPanel controller ([19a3a7], [link](http://gitlab-dbr.sigma-it.local/dbr/ru.coon/-/commit/19a3a71ead9faef63e2dde5d4809170c1d1d9c3d))
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "name": "ru.coon"
5
5
  },
6
6
  "description": "",
7
- "version": "3.0.12",
7
+ "version": "3.0.13",
8
8
  "repository": {
9
9
  "type": "git",
10
10
  "url": "git+http://gitlab-dbr.sigma-it.local/dbr/ru.coon"
package/src/nav/AppNavigationPanel.js CHANGED
@@ -9,7 +9,7 @@ Ext.define('Coon.nav.menu.AppNavigationPanel', {
9
9
  align: 'stretch',
10
10
  },
11
11
 
12
- title: 'меню навигации',
12
+ title: 'Меню навигации',
13
13
 
14
14
  mixin: [
15
15
  'Ext.mixin.Responsive'
@@ -21,6 +21,7 @@ Ext.define('Coon.nav.menu.AppNavigationPanel', {
21
21
  data: {
22
22
  favorites: {},
23
23
  map: [],
24
+ isHiddenMenu: false,
24
25
  },
25
26
  stores: {
26
27
  spacesStore: {
@@ -37,74 +38,111 @@ Ext.define('Coon.nav.menu.AppNavigationPanel', {
37
38
  cls: 'no-shadow',
38
39
  items: [
39
40
  {
40
- xtype: 'combo',
41
+ xtype: 'textfield',
41
42
  emptyText: 'Поиск',
42
43
  width: 300,
43
- margin: '0 40px 0 0',
44
- bind: {
45
- store: '{searchStore}',
46
- },
47
- queryMode: 'local',
48
- valueField: 'MENU_ENTRY_CD',
49
- displayField: 'text',
44
+ margin: '0 40px 8px 0',
45
+ reference: 'searchTextField',
50
46
  anyMatch: true,
51
47
  caseSensitive: false,
48
+ enableKeyEvents: true,
49
+ valueField: 'MENU_ENTRY_CD',
52
50
  listeners: {
53
- select: 'onChangeSearchCombo',
51
+ change: {
52
+ fn: 'onChangeSearch', buffer: 500,
53
+ },
54
+ },
55
+ triggers: {
56
+ search: {
57
+ cls: 'svg-icon svg-icon-magnifying-glass search-trigger',
58
+ hidden: false,
59
+ },
60
+ clear: {
61
+ cls: 'svg-icon svg-icon-cancel-small',
62
+ hidden: true,
63
+ handler: 'clearField',
64
+ },
54
65
  },
55
- clearFilterOnBlur: false,
56
- tpl: Ext.create('Ext.XTemplate',
57
- `<ul class="x-list-plain"><tpl for=".">
58
- <li role="option" class="x-boundlist-item">{[this.getText(values.WORKSPACE_DESCR,values.text)]}</li>
59
- </tpl></ul>`,
60
- {
61
- // XTemplate configuration:
62
- disableFormats: true,
63
- // member functions:
64
- getText: function(space, text) {
65
- const value = this.owner.ownerCmp.getValue() || '';
66
- if (value) {
67
- return `${space} / ` + text.replaceAll(value, `<span class="search-compare">${value}</span>`);
68
- } else {
69
- return `${space} / ${text}`;
70
- }
71
- },
72
- }
73
- ),
74
66
  }
75
67
  ],
76
68
  },
77
- items: [{
78
-
79
- xtype: 'grid',
80
- reference: 'spacesPanel',
81
- cls: 'spaces-panel',
82
- width: 300,
83
- header: false,
84
- bodyPadding: '0 10px',
85
- bind: {
86
- store: '{spacesStore}',
69
+ items: [
70
+ {
71
+ xtype: 'grid',
72
+ reference: 'spacesPanel',
73
+ cls: 'spaces-panel',
74
+ width: 300,
75
+ header: false,
76
+ bodyPadding: '0 10px',
77
+ bind: {
78
+ store: '{spacesStore}',
79
+ hidden: '{isHiddenMenu}',
80
+ },
81
+ listeners: {
82
+ itemmouseup: 'onGridMouseUp',
83
+ },
84
+ columns: [{
85
+ xtype: 'templatecolumn',
86
+ tpl: '<i class="workspace-icon {iconCls}"></i><div class="workspace-text">{text}</div>',
87
+ flex: 1,
88
+ }],
87
89
  },
88
- listeners: {
89
- itemmouseup: 'onGridMouseUp',
90
+ {
91
+ xtype: 'panel',
92
+ reference: 'menuPanel',
93
+ cls: 'menu-panel',
94
+ layout: 'card',
95
+ flex: 1,
96
+ bind: {
97
+ hidden: '{isHiddenMenu}',
98
+ },
99
+ items: [],
90
100
  },
91
- columns: [{
92
- xtype: 'templatecolumn',
93
- tpl: '<i class="workspace-icon {iconCls}"></i><div class="workspace-text">{text}</div>',
101
+ {
102
+ xtype: 'panel',
103
+ reference: 'searchResultsPanel',
104
+ cls: 'menu-panel',
105
+ title: 'Результаты поиска',
106
+ hidden: true,
94
107
  flex: 1,
95
- }],
96
- }, {
97
- xtype: 'panel',
98
- reference: 'menuPanel',
99
- cls: 'menu-panel',
100
- flex: 1,
101
- layout: 'card',
102
- items: [],
103
- }],
108
+ layout: 'card',
109
+ scrollable: true,
110
+ tpl: new Ext.XTemplate(
111
+ `<tpl for=".">
112
+ <div class="search-results-title" onclick="Ext.fireEvent('nav:workspaceclick', '{id}');">
113
+ <i class="svg-icon-size-18 {iconCls} title-icon"></i>
114
+ <div class="title">{title}</div>
115
+ </div>
116
+ <ul class="search-results-list">
117
+ <tpl for="items">
118
+ {[this.renderItem(values)]}
119
+ </tpl>
120
+ </ul>
121
+ </tpl>`,
122
+ {
123
+ // XTemplate configuration:
124
+ disableFormats: true,
125
+ // member functions:
126
+ renderItem: function(item) {
127
+ let html = item.HTML;
128
+
129
+ if (item.children.length) {
130
+ item.children.forEach((child) => {
131
+ html += this.renderItem(child);
132
+ });
133
+ }
134
+
135
+ return html;
136
+ },
137
+ }
138
+ ),
139
+ }
140
+
141
+ ],
104
142
 
105
143
  menuItemTpl: new Ext.XTemplate(
106
144
  `<li class="ref-item {isSelected}" data-removed="{remove}">
107
- <span class="item-icon" onclick="Ext.fireEvent('nav:menuitemtofavoriteclick','{MENU_ENTRY_CD}',this);">
145
+ <span class="item-icon" data-id="{MENU_ENTRY_CD}" onclick="Ext.fireEvent('nav:menuitemtofavoriteclick','{MENU_ENTRY_CD}',this);">
108
146
  <i class="star svg-icon svg-icon-star-16 icon-orange {isFavorite}"></i>
109
147
  </span>
110
148
  <span class="item-text" onclick="Ext.fireEvent('nav:menuitemclick', '{MENU_ENTRY_CD}');">
package/src/nav/AppNavigationPanel.scss CHANGED
@@ -5,7 +5,11 @@
5
5
  .search-compare{
6
6
  background-color: #ffcd29 !important;
7
7
  }
8
+
8
9
  .AppNavigationPanel{
10
+ .x-panel-body .x-panel-body-default .x-panel-body-default .x-noborder-trbl{
11
+ max-width: 100% !important;
12
+ }
9
13
  .no-shadow{
10
14
  box-shadow: none !important;
11
15
  }
@@ -56,13 +60,14 @@
56
60
  .item-icon{
57
61
  background-color: #F5F5F5;
58
62
  }
59
-
60
-
61
-
62
63
  }
63
64
  .is-favorite-item{
64
65
  background-color: #ff9800 !important;
65
66
  }
67
+ .is-searching-item {
68
+ background-color: rgba(255, 152, 0, 1);
69
+ animation: fadingBack 3s forwards;
70
+ }
66
71
  .item-icon:hover{
67
72
  i:not(.is-favorite-item) {
68
73
  background-color: #b4b4b4 !important;
@@ -71,6 +76,8 @@
71
76
  .flex-container .x-autocontainer-innerCt{
72
77
  display: flex;
73
78
  flex-wrap: wrap;
79
+ max-width: 100%;
80
+ min-width: 0;
74
81
  ul{
75
82
  width: 400px;
76
83
  list-style: none;
@@ -114,12 +121,8 @@
114
121
  }
115
122
  li.ref-item:hover {
116
123
  .item-text{
117
- //background-color: #F5F5F5;
118
124
  color: black;
119
125
  }
120
- .item-icon{
121
- //background-color: #F5F5F5;
122
- }
123
126
  .icon-orange{
124
127
  background-color: #dddddd;
125
128
  }
@@ -179,6 +182,96 @@
179
182
  .menu-panel {
180
183
  .x-panel-body {
181
184
  overflow-x: hidden !important;
185
+ max-width: 100%;
186
+ min-width: 0;
187
+ }
188
+ }
189
+
190
+ .search-trigger {
191
+ pointer-events: none;
192
+ }
193
+
194
+ .search-results-title {
195
+ margin: 25px;
196
+ padding-left: 16px;
197
+ position: relative;
198
+ background-color: white;
199
+ }
200
+
201
+ .search-results-title {
202
+ .title-icon {
203
+ display: inline-block;
204
+ background-color: #919191;
205
+ position: absolute;
206
+ top: -10px;
207
+ left: 1px;
208
+ z-index: 5;
209
+ cursor: pointer;
210
+ }
211
+ .title {
212
+ display: inline-block;
213
+ cursor: pointer;
214
+ font-weight: 600; color: #919191;
215
+ font-size: 16px;
216
+ position: absolute;
217
+ top: -8px;
218
+ left: -8px;
219
+ padding-left: 33px;
220
+ padding-right: 8px;
221
+ background-color: white
222
+ }
223
+ }
224
+
225
+ .search-results-list {
226
+ display: flex;
227
+ flex-direction: column;
228
+ list-style: none;
229
+ padding: 16px 0 10px;
230
+ margin: 10px;
231
+ border: 1px solid #DEDEDE;
232
+ }
233
+
234
+ .search-results-list {
235
+ .leaf-element {
236
+ width: max-content;
237
+ font-weight: 400;
238
+ margin-bottom: 6px;
239
+ color: #1E3B4C;
240
+ cursor: pointer;
182
241
  }
242
+ .leaf-element:hover {
243
+ color: #111111;
244
+ }
245
+ .node-element {
246
+ width: max-content;
247
+ font-weight: 600;
248
+ margin-bottom: 8px;
249
+ color: #112B39;
250
+ cursor: pointer;
251
+ }
252
+ .node-element:hover {
253
+ color: #3D6780;
254
+ }
255
+ }
256
+
257
+ .x-autocontainer-outerCt {
258
+ display: block;
259
+ }
260
+
261
+ .x-autocontainer-innerCt {
262
+ display: block;
263
+ }
264
+
265
+ .x-panel .flex-container .x-fit-item .x-panel-default {
266
+ width: 100% !important;
267
+ }
268
+ }
269
+
270
+ @keyframes fadingBack {
271
+ 0% {
272
+ background-color: rgba(255, 152, 0, 1);
273
+ }
274
+ 100% {
275
+ background-color: rgba(255, 152, 0, 0);
183
276
  }
184
277
  }
package/src/nav/AppNavigationPanelController.js CHANGED
@@ -21,39 +21,24 @@ Ext.define('Coon.nav.AppNavigationPanelController', {
21
21
  init() {
22
22
  this.router = Ext.getApplication().appRouter;
23
23
  this.lastRoute = this.router && this.router.lastRoute;
24
+ this.searchSection = '';
24
25
  this.renderMenu();
25
26
  this.getView().on('ownerShow', () => {
26
27
  const panel = this.lookup('menuPanel').layout.getActiveItem();
27
- if (panel) {
28
- const cardId = panel.itemId;
29
- const active = panel.down('#menuInterface').layout.getActiveItem();
30
- if (active && cardId) {
31
- if (active.itemId === 'menuView') {
32
- this.updateMenuView(cardId, active);
33
- } else {
34
- this.updateFavoriteView(cardId, active);
35
- }
36
- }
37
- }
28
+ this.updateMenuView(panel.itemId, panel.down('[reference="menuView"]'));
38
29
  }, this);
39
30
  Ext.on({
40
31
  'nav:menuitemtofavoriteclick': {fn: this.onMenuItemToFavoriteClick, scope: this},
41
32
  'nav:menuitemclick': {fn: this.onMenuItemClick, scope: this},
42
33
  'nav:reload': {fn: this.updateMenu, scope: this},
34
+ 'nav:workspaceclick': {fn: this.changeWorkSpace, scope: this},
35
+ 'nav:sectionclick': {fn: this.onSectionClick, scope: this},
43
36
  'route:change': {
44
37
  fn: (route) => {
45
38
  this.setActiveMenuItem(route.id);
46
39
  },
47
40
  scope: this,
48
41
  },
49
- 'route:unmatched': {fn: () => {
50
- this.goTo(this.getFirstAvailable());
51
- }, scope: this},
52
- });
53
- this.lookup('spacesPanel').on({
54
- itemmouseenter: {fn: this.onGridMouseUp, scope: this, buffer: 600},
55
- beforeitemmouseenter: {fn: this.mouseIn, scope: this},
56
- beforeitemmouseleave: {fn: this.mouseOut, scope: this},
57
42
  });
58
43
  },
59
44
 
@@ -95,43 +80,37 @@ Ext.define('Coon.nav.AppNavigationPanelController', {
95
80
  const rec = this.getViewModel().getStore('spacesStore').getAt(index);
96
81
  this.lookup('spacesPanel').setSelection(rec);
97
82
  this.lookup('menuPanel').setActiveItem(index);
83
+ this.clearField();
98
84
  },
99
85
 
100
- getFirstAvailable() {
101
- const ws = [...this.locals.data.ws.values()][0];
102
- const item = ws && this.locals.data.menu.find((el) => el.WORKSPACE_CD === ws.ws);
103
- return ws && item && item.MENU_ENTRY_CD;
86
+ getActiveWorkSpaceMenu() {
87
+ return this.lookup('menuPanel').getLayout().getActiveItem().down('[reference="menuView"]');
104
88
  },
105
89
 
106
- async onMenuReady() {
107
- const isValidLastRoute = this.lastRoute && this.lastRoute.id && await Coon.nav.MenuEntity.isValid(this.lastRoute.id);
108
- if (isValidLastRoute) {
109
- this.setActiveMenuItem(this.lastRoute.id);
110
- } else {
111
- this.goTo(this.getFirstAvailable());
90
+ onSectionClick(workspace, section) {
91
+ this.searchSection = section;
92
+ if (this.lookup('menuPanel').getLayout().getActiveItem().getItemId() === workspace) {
93
+ this.updateMenuView(workspace, this.getActiveWorkSpaceMenu());
112
94
  }
95
+ this.changeWorkSpace(workspace);
96
+ this.getActiveWorkSpaceMenu().getEl().on('painted', () => {
97
+ const searchingItem = this.getActiveWorkSpaceMenu().getEl().down('.is-searching-item');
98
+ if (searchingItem) {
99
+ searchingItem.dom.scrollIntoView({behavior: 'smooth', block: 'center'});
100
+ }
101
+ });
113
102
  },
114
103
 
115
- goTo(menuEntryCd, force = false) {
104
+ goTo(menuEntryCd, force = true) {
116
105
  if (menuEntryCd) {
117
- let prefix = '';
118
- if (this.addWorkspaceToUrl) {
119
- const ws = this.getViewModel().get('workspace') || this.getFirstAvailable().ws.ws;
120
- prefix = ws && ws + '/';
121
- }
122
- this.router.redirectTo(prefix + menuEntryCd, {force});
106
+ this.router.redirectTo(menuEntryCd, {force});
123
107
  }
124
108
  },
125
109
 
126
110
  onMenuItemClick(menuEntryCd) {
127
111
  this.goTo(menuEntryCd);
128
112
  },
129
- mouseOut() {
130
- this.mouseInFlag = false;
131
- },
132
- mouseIn() {
133
- this.mouseInFlag = true;
134
- },
113
+
135
114
  onGridMouseUp(el, rec) {
136
115
  if (!this.mouseInFlag) {
137
116
  return false;
@@ -144,28 +123,45 @@ Ext.define('Coon.nav.AppNavigationPanelController', {
144
123
  },
145
124
 
146
125
  onMenuPanelBeforeActivate(panel) {
147
- const activeView = panel.down('#menuInterface').layout.getActiveItem();
148
- if (activeView.itemId === 'favoriteView') {
149
- this.updateFavoriteView(panel.itemId, activeView);
150
- } else {
151
- this.updateMenuView(panel.itemId, activeView);
152
- }
126
+ this.updateMenuView(panel.itemId, panel.down('[reference="menuView"]'));
153
127
  },
154
128
 
155
- updateMenu: function() {
129
+ updateMenu() {
156
130
  Coon.nav.MenuEntity.menuItems = null;
157
131
  this.renderMenu();
158
132
  },
159
133
 
134
+ listToTree(list) {
135
+ const map = {}; const roots = [];
136
+ let node;
137
+ for (let i = 0; i < list.length; i += 1) {
138
+ map[list[i].MENU_ENTRY_CD] = i; // initialize the map
139
+ list[i].children = []; // initialize the children
140
+ }
141
+ for (let i = 0; i < list.length; i += 1) {
142
+ node = list[i];
143
+ node.PARENT_MENU_ENTRY_CD = node.PARENT_MENU_ENTRY_CD || '0';
144
+ if (node.PARENT_MENU_ENTRY_CD !== '0') {
145
+ // if you have dangling branches check that map[node.parentId] exists
146
+ list[map[node.PARENT_MENU_ENTRY_CD]].children.push(node);
147
+ } else {
148
+ roots.push(node);
149
+ }
150
+ }
151
+ return roots;
152
+ },
153
+
160
154
  renderMenu() {
161
155
  this.menuReady = false;
162
- // view.mask();
163
156
  const vm = this.getViewModel();
164
157
  vm.getStore('spacesStore').removeAll();
165
158
  vm.getStore('searchStore').removeAll();
166
- // this.lookup('menuPanel').removeAll();
167
159
  Coon.nav.MenuEntity.get().then((menu) => {
168
160
  if (Array.isArray(menu)) {
161
+ menu = menu.map((el) => {
162
+ el.sortseq = `${el.WORKSPACE_SQ}-${el.LVL}-${el.MENU_ENTRY_SQ}`;
163
+ return el;
164
+ });
169
165
  const dataList = this.prepareMenuData(menu);
170
166
  const transformData = dataList.map((el) => {
171
167
  return Coon.Function.convertObjectByMapping(el, {
@@ -200,30 +196,15 @@ Ext.define('Coon.nav.AppNavigationPanelController', {
200
196
  });
201
197
  vm.getStore('spacesStore').loadData(items);
202
198
  vm.getStore('searchStore').loadData(this.locals.data.menu);
203
-
204
- const listToTree = (list) => {
205
- const map = {}; const roots = [];
206
- let node;
207
- for (let i = 0; i < list.length; i += 1) {
208
- map[list[i].MENU_ENTRY_CD] = i; // initialize the map
209
- list[i].children = []; // initialize the children
210
- }
211
- for (let i = 0; i < list.length; i += 1) {
212
- node = list[i];
213
- node.PARENT_MENU_ENTRY_CD = node.PARENT_MENU_ENTRY_CD || '0';
214
- if (node.PARENT_MENU_ENTRY_CD !== '0') {
215
- // if you have dangling branches check that map[node.parentId] exists
216
- list[map[node.PARENT_MENU_ENTRY_CD]].children.push(node);
217
- } else {
218
- roots.push(node);
219
- }
220
- }
221
- return roots;
222
- };
199
+ this.menuItems = vm.getStore('searchStore').getRange()
200
+ .reduce((acc, menuItem) => {
201
+ acc[menuItem.get('MENU_ENTRY_CD')] = menuItem.getData();
202
+ return acc;
203
+ }, {});
223
204
 
224
205
  Object.entries(this.locals.data.items).forEach(function(workspace) {
225
206
  const [workspaceId, workspaceItems] = workspace;
226
- this.locals.data.items[workspaceId] = listToTree(Object.values(workspaceItems));
207
+ this.locals.data.items[workspaceId] = this.listToTree(Object.values(workspaceItems));
227
208
  }, this);
228
209
 
229
210
  const menuPanel = this.lookup('menuPanel');
@@ -242,58 +223,19 @@ Ext.define('Coon.nav.AppNavigationPanelController', {
242
223
  activate: 'onMenuPanelBeforeActivate',
243
224
  },
244
225
  itemId: workSpace.ws,
245
- items: [{
246
- xtype: 'container',
247
- colspan: 10,
248
- layout: 'hbox',
249
- items: [{
250
- xtype: 'container',
251
- margin: '8px 0 8px 8px',
252
- html: '<span class="favorite-title">Избранное</span>',
253
- }, {
254
- xtype: 'button',
255
- padding: '10px 16px 8px 6px',
256
- focusOnToFront: false,
257
- focusable: false,
258
- overCls: '',
259
- focusCls: '',
260
- style: {
261
- backgroundColor: 'transparent!important',
262
- marginRight: '20px',
263
- },
264
- iconCls: 'x-fa fa-toggle-on inactiveToggle',
265
- handler: this.onFavoriteClick.bind(this),
266
- bind: {
267
- // eslint-disable-next-line max-len
268
- iconCls: `{favorites.${workSpace.ws} ? 'x-fa fa-toggle-on fa-rotate-180 activeToggle' : 'x-fa fa-toggle-on inactiveToggle'}`,
269
- },
270
- }],
271
- }, {
272
- xtype: 'panel',
273
- itemId: 'menuInterface',
274
- layout: 'card',
275
-
276
- items: [
277
- {
278
- xtype: 'panel',
279
- itemId: 'menuView',
280
- cls: 'flex-container',
281
- },
282
- {
283
- xtype: 'panel',
284
- itemId: 'favoriteView',
285
- cls: 'flex-container',
286
- }
287
- ],
288
- }],
226
+ items: [
227
+ {
228
+ xtype: 'panel',
229
+ reference: 'menuView',
230
+ cls: 'flex-container',
231
+ }
232
+ ],
289
233
  });
290
234
  });
291
235
  this.getViewModel().set('map', map);
292
236
  this.menuReady = true;
293
237
  Ext.fireEvent('nav:ready');
294
- // this.onMenuReady();
295
238
  }
296
- // view.unmask();
297
239
  });
298
240
  },
299
241
 
@@ -305,13 +247,18 @@ Ext.define('Coon.nav.AppNavigationPanelController', {
305
247
  const selected = this.router.lastRoute?.id || '';
306
248
  const props = Coon.nav.menu.FavoriteCfg.get().favorite || [];
307
249
  const createItemsTemplate = (item) => {
250
+ let isSearching = '';
251
+ if (this.searchSection && this.searchSection === item.MENU_ENTRY_CD) {
252
+ isSearching = 'is-searching-item';
253
+ this.searchSection = '';
254
+ }
308
255
  item.isFavorite = props.indexOf(item.MENU_ENTRY_CD) >= 0 ? 'is-favorite-item' : '';
309
256
  item.isSelected = selected === item.MENU_ENTRY_CD ? 'selected-item' : '';
310
257
  item.remove = false;
311
258
  if (!item.children[0]) {
312
259
  return this.getMenuItemHtml(item);
313
260
  }
314
- let res = `<li><span class="parent-menu-item">${item.text}</span><ul>`;
261
+ let res = `<li><span class="parent-menu-item ${isSearching}">${item.text}</span><ul>`;
315
262
  item.children.forEach((child) => {
316
263
  res += createItemsTemplate(child);
317
264
  });
@@ -337,52 +284,128 @@ Ext.define('Coon.nav.AppNavigationPanelController', {
337
284
  panel.setHtml(`${panels.join('')}`);
338
285
  },
339
286
 
340
- updateFavoriteView(cardId, panel) {
341
- const props = Coon.nav.menu.FavoriteCfg.get().favorite || [];
342
- const selected = this.router.lastRoute?.id || '';
343
- if (props.length) {
344
- const createItemsTemplate = (item) => {
345
- item.isFavorite = props.indexOf(item.MENU_ENTRY_CD) >= 0 ? 'is-favorite-item' : '';
346
- item.isSelected = selected === item.MENU_ENTRY_CD ? 'selected-item' : '';
347
- item.remove = true;
348
- if (!item.children[0]) {
349
- return item.isFavorite ? this.getMenuItemHtml(item) : '';
287
+ onChangeSearch(field) {
288
+ const searchValue = field.getValue().toLowerCase().trim();
289
+ const vm = this.getViewModel();
290
+ const panel = this.lookup('searchResultsPanel');
291
+
292
+ field.getTrigger('clear').setHidden(!searchValue);
293
+ field.getTrigger('search').setHidden(searchValue);
294
+
295
+ const getText = (text) => {
296
+ const pattern = new RegExp(searchValue, 'ig');
297
+ const arr = text.match(pattern);
298
+ if (searchValue && !Ext.isEmpty(arr)) {
299
+ return text.replaceAll(arr[0], '<span class="search-compare">' + arr[0] + '</span>');
300
+ } else {
301
+ return text;
302
+ }
303
+ };
304
+
305
+ const getMargin = (lvl) => {
306
+ if (lvl === '1') {
307
+ return '16px';
308
+ } else {
309
+ return ((lvl - 1) * 28 + 16) + 'px';
310
+ }
311
+ };
312
+
313
+ const renderItem = (item) => {
314
+ return `
315
+ <li
316
+ data-id="${item.MENU_ENTRY_CD}"
317
+ class="${item.LEAF_SW === 'Y' ? 'leaf-element' : 'node-element'}"
318
+ onclick="('${item.LEAF_SW}' === 'Y')
319
+ ? Ext.fireEvent('nav:menuitemclick', '${item.MENU_ENTRY_CD}')
320
+ : Ext.fireEvent('nav:sectionclick', '${item.WORKSPACE_CD}', '${item.MENU_ENTRY_CD}');"
321
+ style="margin-left: ${getMargin(item.LVL)}">
322
+ ${getText(item.text)}
323
+ </li>`;
324
+ };
325
+
326
+ const search = () => {
327
+ const resultsWithoutParents = Object.values(this.menuItems).filter((record) => {
328
+ const text = record.text.toLowerCase();
329
+ return text.includes(searchValue);
330
+ });
331
+
332
+ const parentValues = new Set();
333
+
334
+ const collectParents = (item) => {
335
+ if (item.PARENT_MENU_ENTRY_CD === '0') {
336
+ return;
337
+ }
338
+ const parent = this.menuItems[item.PARENT_MENU_ENTRY_CD];
339
+ if (parent) {
340
+ parentValues.add(item.PARENT_MENU_ENTRY_CD);
341
+ collectParents(parent);
342
+ }
343
+ };
344
+
345
+ resultsWithoutParents.forEach((item) => {
346
+ if (item.PARENT_MENU_ENTRY_CD === '0') {
347
+ return;
350
348
  }
351
- let res = '';
352
- item.children.forEach((child) => {
353
- res += createItemsTemplate(child);
349
+ collectParents(item);
350
+ });
351
+
352
+ return Object.values(this.menuItems).filter((record) => {
353
+ const text = record.text.toLowerCase();
354
+ const matches = text.includes(searchValue) || parentValues.has(record.MENU_ENTRY_CD);
355
+ if (matches) {
356
+ record.HTML = renderItem(record);
357
+ }
358
+ return matches;
359
+ });
360
+ };
361
+
362
+ const results = search();
363
+ const treeResults = this.listToTree(results);
364
+
365
+ if (treeResults.length && searchValue) {
366
+ panel.removeAll();
367
+
368
+ const groupByWorkspace = (tree) => {
369
+ const grouped = new Map();
370
+
371
+ tree.forEach((item) => {
372
+ const key = item.WORKSPACE_CD;
373
+ if (!grouped.has(key)) {
374
+ grouped.set(key, {
375
+ title: item.WORKSPACE_DESCR,
376
+ id: item.WORKSPACE_CD,
377
+ iconCls: item.WORKSPACE_ICON,
378
+ items: [],
379
+ });
380
+ }
381
+ grouped.get(key).items.push(item);
354
382
  });
355
- return res;
383
+
384
+ return Array.from(grouped.values());
356
385
  };
357
- let res = '';
358
- this.locals.data.items[cardId].forEach((item) => {
359
- res += createItemsTemplate(item);
386
+
387
+ const groupedResults = groupByWorkspace(treeResults);
388
+ const newData = [];
389
+ groupedResults.forEach((item) => {
390
+ newData.push(item);
360
391
  });
361
- panel.setHtml(`<ul>${res}</ul>`);
362
- }
363
- },
364
392
 
365
- onFavoriteClick(cmp) {
366
- const vm = this.getViewModel();
367
- const favorites = vm.get('favorites');
368
- const cardId = cmp.up('panel').itemId;
369
- favorites[cardId] = !favorites[cardId];
370
- vm.set('favorites', favorites);
371
-
372
- const panel = cmp.up('panel').down('#menuInterface');
373
- if (favorites[cardId]) {
374
- this.updateFavoriteView(cardId, panel.down('#favoriteView'));
393
+ panel.setData(newData);
394
+
395
+ vm.set('isHiddenMenu', true);
396
+ panel.show();
375
397
  } else {
376
- this.updateMenuView(cardId, panel.down('#menuView'));
398
+ vm.set('isHiddenMenu', false);
399
+ panel.hide();
377
400
  }
378
- panel.setActiveItem(favorites[cardId] ? 1 : 0);
379
401
  },
380
402
 
381
- onChangeSearchCombo(cmp, rec) {
382
- if (!rec || !rec.get('MENU_ENTRY_CD')) {
383
- return false;
384
- }
385
- cmp.clearValue();
386
- this.goTo(rec.get('MENU_ENTRY_CD'));
403
+ clearField() {
404
+ const field = this.lookup('searchTextField');
405
+ field.setValue(null);
406
+ this.getViewModel().set('isHiddenMenu', false);
407
+ this.lookup('searchResultsPanel').hide();
408
+ field.getTrigger('clear').setHidden(!field.getValue());
409
+ field.getTrigger('search').setHidden(field.getValue());
387
410
  },
388
411
  });
package/src/util.js CHANGED
@@ -91,7 +91,7 @@ Ext.define('Coon.util', {
91
91
  acc = defaultValue;
92
92
  }
93
93
  return acc;
94
- }, obj);
94
+ }, Object.assign({}, obj));
95
95
  },
96
96
 
97
97
  setByPath(src, path, handlerOrInitVal, opts) {
package/src/version.js CHANGED
@@ -1,4 +1,4 @@
1
1
  Ext.define('Coon.version', {
2
2
  singleton: true,
3
- number: '3.0.12',
3
+ number: '3.0.13',
4
4
  });