cronapp-framework-js 3.0.0 → 3.1.0-SP.2

package/js/directives.js

@@ -925,6 +925,37 @@
         }
       }])
 
+      .directive('screenVariables', [function() {
+        'use strict';
+        return {
+          link: async function(scope, elem, attrs, ctrl) {
+            let screenVariables = eval(attrs.screenVariables);
+            if (screenVariables && screenVariables.length) {
+              screenVariables.forEach(async (screenVariables) => {
+                if (scope.vars && !scope.vars[screenVariables.key]) {
+                  let value = screenVariables.value || '';
+                  if (screenVariables.type === 'blockly') {
+                    value = await scope.$eval(value.replace('.run(','.toPromise().run('));
+                  }
+                  else if (screenVariables.type === 'expression') {
+                    if (value.startsWith('params')) {
+                      value = scope.params[value.replace('params.','')];
+                    }
+                    else if (value.startsWith('vars')) {
+                      value = scope.vars[value.replace('vars.','')];
+                    }
+                    else {
+                      value = await scope.$eval(value);
+                    }
+                  }
+                  scope.vars[screenVariables.key] = value;
+                }
+              });
+            }
+          }
+        }
+      }])
+
       .directive('mask', maskDirectiveMask)
 
       .directive('cronappFilter', function($compile) {
@@ -2688,6 +2719,67 @@
               return attributes;
             }
 
+            function commandClick(e, column) {
+              e.preventDefault();
+              let tr = $(e.target).closest("tr");
+              let grid = tr.closest('table');
+              let itemAsObj = this.dataItem(tr);
+              let item = this.dataItem(tr);
+              let index = $(grid.find('tbody')[0]).children().index(tr);
+              let call = undefined;
+              if (column.dataType == "Customized" || column.dataType == "CustomizedLink" || column.dataType == "GroupedButtons")
+                call = column.execute;
+              else
+                call = generateBlocklyCall(column.blocklyInfo);
+              let cronappDatasource = this.dataSource.transport.options.cronappDatasource;
+              let currentGrid = options.refComponent;
+              let selectedRows = [];
+              currentGrid.select().each(function() {
+                let gridRow = currentGrid.dataItem(this);
+                cronappDatasource.data.forEach(function(dsRow) {
+                  if (dsRow.__$id == gridRow.__$id)
+                    selectedRows.push(dsRow);
+                });
+              });
+
+              if (!(cronappDatasource.inserting || cronappDatasource.editing)) {
+                let tr = e.currentTarget.parentElement.parentElement;
+                this.select(tr);
+              }
+
+              let selectedRowsKeyOrObj = [];
+              if (options.fieldType && options.fieldType === 'key') {
+                item = helperDirective.changeObjectField(cronappDatasource, cronappDatasource.findObjInDs(item));
+                selectedRows.forEach(row => {
+                  selectedRowsKeyOrObj.push(helperDirective.changeObjectField(cronappDatasource, cronappDatasource.findObjInDs(row)));
+                });
+              }
+              else {
+                selectedRowsKeyOrObj = selectedRows;
+              }
+
+              let consolidated = {
+                item: item,
+                index: index
+              }
+
+              let contextVars = {
+                'currentData': cronappDatasource.data,
+                'datasource': cronappDatasource.copyWithoutAngularObj(),
+                'selectedIndex': index,
+                'index': index,
+                'selectedRow': item,
+                'consolidated': consolidated,
+                'item': item,
+                'selectedKeys': cronappDatasource.getKeyValues(cronappDatasource.findObjInDs(itemAsObj), true),
+                'selectedRows': selectedRowsKeyOrObj
+              };
+
+              cronappDatasource.goTo(itemAsObj);
+              scope.$eval(call, contextVars);
+              return;
+            };
+
             var columns = [];
             if (options.columns) {
               options.columns.forEach(function(column)  {
@@ -2757,7 +2849,7 @@
                     className = 'k-custom-command' + (label ? ' k-button-with-label' : '');
                   }
                   if (column.theme)
-                    className += ' ' + column.theme;
+                    className += ' btn ' + column.theme;
 
                   var tooltip = '';
                   if (column.tooltip && column.tooltip.length)
@@ -2769,79 +2861,21 @@
                     className += ' ' + classForTooltip;
                   }
 
+                  let width = column.width;
+                  if (width) {
+                    width += 'px';
+                  }
+
                   let idForCommand = app.common.generateId();
                   let ariaLabel = tooltip || label || idForCommand;
-                  let template = `<a href class='k-button ${className} k-grid-${idForCommand}' aria-label='${ariaLabel}'><span class='${column.iconClass}'></span>${label}</a>`;
+                  let template = `<a href class='k-button ${className} k-grid-${idForCommand}' aria-label='${ariaLabel}' style='width:${width}'><span class='${column.iconClass}'></span>${label}</a>`;
 
                   var addColumn = {
                     command: [{
                       name: idForCommand,
                       template: template,
                       click: function(e) {
-                        e.preventDefault();
-                        var tr = $(e.target).closest("tr");
-                        var grid = tr.closest('table');
-
-                        var itemAsObj = this.dataItem(tr);
-                        var item = this.dataItem(tr);
-                        var index = $(grid.find('tbody')[0]).children().index(tr)
-
-
-                        var call = undefined;
-                        if (column.dataType == "Customized" || column.dataType == "CustomizedLink")
-                          call = column.execute;
-                        else
-                          call = generateBlocklyCall(column.blocklyInfo);
-
-                        var cronappDatasource = this.dataSource.transport.options.cronappDatasource;
-                        var currentGrid = options.refComponent;
-                        var selectedRows = [];
-                        currentGrid.select().each(function() {
-                          var gridRow = currentGrid.dataItem(this);
-                          cronappDatasource.data.forEach(function(dsRow) {
-                            if (dsRow.__$id == gridRow.__$id)
-                              selectedRows.push(dsRow);
-                          });
-                        });
-
-                        if (!(cronappDatasource.inserting || cronappDatasource.editing)) {
-                          var tr = e.currentTarget.parentElement.parentElement;
-                          this.select(tr);
-                        }
-
-                        let selectedRowsKeyOrObj = [];
-                        if(options.fieldType && options.fieldType === 'key') {
-                          item = helperDirective.changeObjectField(cronappDatasource, cronappDatasource.findObjInDs(item));
-                          selectedRows.forEach(row => {
-                            selectedRowsKeyOrObj.push(helperDirective.changeObjectField(cronappDatasource, cronappDatasource.findObjInDs(row)));
-                          });
-                        }
-                        else {
-                          selectedRowsKeyOrObj = selectedRows;
-                        }
-
-                        var consolidated = {
-                          item: item,
-                          index: index
-                        }
-
-                        var contextVars = {
-                          'currentData': cronappDatasource.data,
-                          'datasource': cronappDatasource.copyWithoutAngularObj(),
-                          'selectedIndex': index,
-                          'index': index,
-                          'selectedRow': item,
-                          'consolidated': consolidated,
-                          'item': item,
-                          'selectedKeys': cronappDatasource.getKeyValues(cronappDatasource.findObjInDs(itemAsObj), true),
-                          'selectedRows': selectedRowsKeyOrObj
-                        };
-
-                        if (this.element.find('input[type=checkbox]').length === 0) {
-                          cronappDatasource.goTo(itemAsObj);
-                        }
-                        scope.$eval(call, contextVars);
-                        return;
+                        commandClick.bind(this)(e, column);
                       }
                     }],
                     width: widthDevice.width,
@@ -2852,6 +2886,62 @@
                   columns.push(addColumn);
                   setIdCommandButton.bind(this)(idForCommand, column.dataType);
                 }
+                else if (column.dataType == "GroupedButtons") {
+
+                  if (column.buttonColumns && column.buttonColumns.length) {
+
+                    let commands = [];
+                    
+                    column.buttonColumns.forEach(function(buttonColumn) {
+                      let label = buttonColumn.label == undefined ? '': buttonColumn.label;
+                      if (buttonColumn.iconClass && label)
+                        label = '&nbsp;' + label;
+
+                      let className = 'k-custom-command' + (label ? ' k-button-with-label' : '');
+                      if (buttonColumn.theme)
+                        className += ' btn ' + buttonColumn.theme;
+
+                      let tooltip = '';
+                      if (buttonColumn.tooltip && buttonColumn.tooltip.length)
+                        tooltip = buttonColumn.tooltip;
+
+                      if (tooltip)  {
+                        let classForTooltip = app.common.generateId();
+                        tooltips[classForTooltip] = tooltip;
+                        className += ' ' + classForTooltip;
+                      }
+
+                      let width = buttonColumn.width;
+                      if (width) {
+                        width += 'px';
+                      }
+
+                      let idForCommand = app.common.generateId();
+                      let ariaLabel = tooltip || label || idForCommand;
+                      let template = `<a href class='k-button ${className} k-grid-${idForCommand}' aria-label='${ariaLabel}' style='width:${width}'><span class='${buttonColumn.iconClass}'></span>${label}</a>`;
+                    
+                      let command = {
+                        name: idForCommand,
+                        template: template,
+                        click: function(e) {
+                          buttonColumn.dataType = column.dataType;
+                          commandClick.bind(this)(e, buttonColumn);
+                        }
+                      };
+                      commands.push(command);
+                    });
+
+                    var addColumn = {
+                      command: commands,
+                      width: widthDevice.width,
+                      title: column.headerText ? column.headerText: '',
+                      hidden: !widthDevice.visible,
+                      attributes: getAttributes(column)
+                    };
+                    columns.push(addColumn);
+                    setIdCommandButton.bind(this)(app.common.generateId(), column.dataType);
+                  }          
+                }
                 else if (column.dataType == "Selectable") {
                   var checkColumn = {
                     selectable: true,
@@ -2989,7 +3079,11 @@
               var cronappDatasource = this.dataSource.transport.options.cronappDatasource;
               if (!(cronappDatasource.inserting || cronappDatasource.editing)) {
                 if (this.selectable) {
+                  setToActiveInCronappDataSource.bind(this)(e.data);
                   this.select(e.masterRow);
+                  if (options.columns.find(c => c.dataType == 'Selectable') !== undefined) {
+                    collapseAllExcecptCurrent(this, e.detailRow, e.masterRow);
+                  }
                 }
                 else {
                   setToActiveInCronappDataSource.bind(this)(e.data);
@@ -3217,14 +3311,22 @@
               },
               change: function(e) {
                 var item = this.dataItem(this.select());
-                setToActiveInCronappDataSource.bind(this)(item);
+                if ((options.details && options.details.length == 0) || (!cronapi.internal.hasMethodInCallStack('detailInit'))) {
+                  setToActiveInCronappDataSource.bind(this)(item);
+                }
                 var cronappDatasource = this.dataSource.transport.options.cronappDatasource;
                 if(options.fieldType && options.fieldType === 'key'){
                   cronappDatasource.active = helperDirective.changeObjectField(cronappDatasource, cronappDatasource.active);
                 }
+
+                let trDetails = this.select().next();
+                let trMasters = this.select();
+
                 if (ngModelCtrl) {
                   if ("multiple" === options.allowSelectionRowType) {
                     let selecteds = [];
+                    trDetails = [];
+                    trMasters = [];
                     this.select().each((i, row)=> {
                       let item = this.dataItem(row);
                       let objInDs = cronappDatasource.findObjInDs(item, false);
@@ -3234,6 +3336,10 @@
                       if (objInDs !== null){
                         selecteds.push(objInDs);
                       }
+                      if (item["_objectKey"] === cronappDatasource.active["_objectKey"]) {
+                        trMasters.push(this.select()[i]);
+                        trDetails.push(this.select().next()[i]);
+                      }
                     });
                     ngModelCtrl.$setViewValue(selecteds);
                   }
@@ -3246,7 +3352,7 @@
                     }
                   }
                 }
-                collapseAllExcecptCurrent(this, this.select().next(), this.select());
+                collapseAllExcecptCurrent(this, trDetails, trMasters);
 
                 if (attrs && attrs.ngChange) {
                   scope.$eval(attrs.ngChange);
@@ -3269,8 +3375,8 @@
                       command = 'edit';
                     }
 
-                      let modelName = helperDirective.getModelName(attrs);
-                      if (item && item["_objectKey"]) {
+                    let modelName = helperDirective.getModelName(attrs);
+                    if (item && item["_objectKey"]) {
                       let key = item["_objectKey"];
                       let id = `${modelName}-${command}-${key}`;
                       $elem.attr('id', id);
@@ -3445,11 +3551,63 @@
                 }
               });
 
+              grid.selectable.userEvents.unbind("select");
+
             });
 
+            let contextMenuId = app.common.generateId();
+            let contextMenuValue = app.common.generateId();
+            let contextMenuClose = app.common.generateId();
+            let contextMenuHtml = $(`<ul id="${contextMenuId}">
+                                <li id="copyText">
+                                  <input id="${contextMenuValue}">
+                                  <span id="${contextMenuClose}" class="k-icon k-i-close" style="margin-left: 5px;"></span>
+                                </li>
+                              </ul>`);
             element.html($templateDyn);
+            element.append(contextMenuHtml);
             $compile($templateDyn)(element.scope());
 
+            let contextMenu = $(`#${contextMenuId}`).kendoContextMenu({
+              target: $templateDyn,
+              filter: "td",
+              close: (e) => {
+                if (!closeContextMenu) {
+                  e.preventDefault();
+                }
+              },
+              open: (e) => {
+                let cell = e.target;
+                let row = $(cell).parent()[0];
+                let grid = $templateDyn.data("kendoGrid");
+                let itemId = e.item.id;
+
+                let cellText = cell.innerText;
+                if (cellText.length && cellText !== '​') {
+                  $(e.item).find(`#${contextMenuValue}`).val(cellText);
+                  closeContextMenu = false;
+                }
+                else {
+                  let menuRejected = () => {
+                    return new Promise((resolve, reject) => {
+                      let waiting = setInterval(() => {
+                        if ($(`#${contextMenuId}`).is(':visible')) {
+                          clearInterval(waiting);
+                          $(`#${contextMenuId}`).hide();
+                        }
+                      });
+                    });
+                  }
+                  menuRejected();
+                }
+              }
+            }).data("kendoContextMenu");
+
+            $(`#${contextMenuClose}`).on("click", (e) => {
+              closeContextMenu = true;
+              contextMenu.close();
+            });
+
           }
         };
       }])
@@ -3531,8 +3689,8 @@
                     getAllParent(cronappDatasource, itemResult.d.results[0], ids, resolve, reject);
                   },
                   beforeSend: (xhr) => {
-                    if (window.uToken) {
-                      xhr.setRequestHeader ("X-AUTH-TOKEN", window.uToken);
+                    if (!window.isUsingCookie()) {
+                      xhr.setRequestHeader ("X-AUTH-TOKEN", cronapi.util.getUserToken());
                     }
                   },
                   error: () => reject(),
@@ -3673,8 +3831,8 @@
                               resolve();
                             },
                             beforeSend: (xhr) => {
-                              if (window.uToken) {
-                                xhr.setRequestHeader ("X-AUTH-TOKEN", window.uToken);
+                              if (!window.isUsingCookie()) {
+                                xhr.setRequestHeader ("X-AUTH-TOKEN", cronapi.util.getUserToken());
                               }
                             },
                             error: () => reject(),
@@ -3874,7 +4032,7 @@
           }
         };
       })
-
+    
       .directive('cronDynamicSelect', function ($compile, $timeout, $parse, $translate, $log) {
         return {
           restrict: 'E',
@@ -4062,97 +4220,28 @@
                 });
               }
 
-              options.virtual.valueMapper = async function(options) {
-                await waitRender();
-
-                $log.debug("valueMapper | " + attrs['id'] + " | " + options.value);
-
-                if (lastValueMapper && !lastValueMapper.completed) {
-                  $log.debug("valueMapper Canceling | " + lastValueMapper.value);
-                  lastValueMapper.canceled = true;
-                }
-
-                lastValueMapper = options;
-
-                var _combobox = _options.combobox;
-                if (options.canceled) {
-                  $log.debug("valueMapper CANCELED | " + options.value);
-                  return;
-                }
-
-                if (options.value || options.value === "") {
-                  if(_combobox.options.optionLabel[_combobox.options.dataValueField] !== null && options.value === ""){
-                    options.completed = true;
-                    $log.debug("valueMapper.success | " + attrs['id'] + " | NULL");
-                    options.success(null);
-                  }
-                  else{
-                    _combobox.isEvaluating = true;
-                    var _dataSource = _options.dataSource.transport.options.cronappDatasource;
-                    if (options.value === undefined || options.value === null || options.value === "") {
-                      options.completed = true;
-                      $log.debug("valueMapper.success | " + attrs['id'] + " | NULL");
-                      options.success(null);
-                      _combobox.isEvaluating = false;
-                    } else {
-                      $log.debug("valueMapper.findObj | " + attrs['id'] + " | " + options.value);
-                      _dataSource.findObj([options.value], false, function(data) {
-                        options.completed = true;
-
-                        if (options.canceled) {
-                          $log.debug("valueMapper CANCELED | " + options.value);
-                          _combobox.isEvaluating = false;
-                          return;
-                        }
-                        if (Array.isArray(data)) {
-                          data = data[0];
-                        }
-                        $log.debug("valueMapper.success | " + attrs['id'] + " | " + data);
-                        options.success(data);
-                        _combobox.isEvaluating = false;
-
-                        if (select.changeCursor) {
-                          scope.safeApply(function() {
-                            if (options.canceled) {
-                              $log.debug("valueMapper CANCELED | " + options.value);
-                              return;
-                            }
-                            if (data != null) {
-                              var found = _goTo(_scope, _combobox, data);
-                              if (!found) {
-                                _dataSource.data.push(data);
-                                found = _goTo(_scope, _combobox, data);
-                              }
-                              if (found) {
-                                modelSetter(_scope, found[select.dataValueField]);
-                              }
-                            } else {
-                              modelSetter(_scope, null);
-                            }
-                          });
-                        } else {
-                          if (data == null) {
-                            modelSetter(_scope, null);
-                          }
-                        }
-                      }, function() {
-                        options.completed = true;
-                        if (options.canceled) {
-                          $log.debug("valueMapper CANCELED | " + options.value);
-                          _combobox.isEvaluating = false;
-                          return;
-                        }
-                        $log.debug("valueMapper.success | " + attrs['id'] + " | NULL");
-                        options.success(null);
-                        _combobox.isEvaluating = false;
-                      }, [combobox.options.dataValueField]);
-                    }
+              options.virtual.valueMapper = async function (options) {
+                if (!combobox || combobox.isEvaluating) return;
+                combobox.isEvaluating = true;
+              
+                var _dataSource = _options.dataSource.transport.options.cronappDatasource;
+                $log.debug("valueMapper.findObj | " + attrs['id'] + " | " + options.value);
+              
+                try {
+                  let currentValue = combobox.value();
+              
+                  let data = await _dataSource.findObj([options.value], false);
+                  if (Array.isArray(data)) data = data[0];
+                  
+                  if (currentValue === combobox.value()) {
+                    options.success(data);
                   }
-                } else {
-                  $log.debug("valueMapper.success | " + attrs['id'] + " | NULL");
+                } catch (e) {
                   options.success(null);
+                } finally {
+                  combobox.isEvaluating = false;
                 }
-              };
+              }; 
             }
 
             options.messages =  {
@@ -4164,23 +4253,42 @@
               scope.safeApply(() => {
                 var contextVars = { 
                     'selected' : dataItem,
-                    'selectedKey' : dataItem[options.dataValueField],
-                    'selectedValue' : dataItem[options.dataTextField]
+                    'selectedKey' : dataItem ? dataItem[options.dataValueField] : "",
+                    'selectedValue' : dataItem ? dataItem[options.dataTextField] : ""
                 };
-                scope.$eval(attrs.ngChange, contextVars); 
+                scope.$eval(attrs.ngChange, contextVars);
               });
             } : undefined;
             
-            options.close = attrs.ngClose ? function (){scope.$eval(attrs.ngClose)}: undefined;
-            options.dataBound = attrs.ngDataBound ? function (){scope.$eval(attrs.ngDataBound)}: undefined;
-            options.filtering = attrs.ngFiltering ? function (){scope.$eval(attrs.ngFiltering)}: undefined;
-            options.open = function(e) {
-              if (!dataSourceScreen.fetched || (dataSourceScreen.data.length > combobox.dataSource.data().length)) {
+            
+            options.close = attrs.ngClose ? function () {
+              scope.$eval(attrs.ngClose);
+            } : undefined;
+                        
+            options.dataBound = function () {
+              if (!scope.$$phase && !scope.$root.$$phase) {
+                _compileAngular(scope, combobox.element[0]);
+              }
+            };
+
+            
+            options.filtering = attrs.ngFiltering ? function () {
+              scope.$eval(attrs.ngFiltering);
+            } : undefined;
+            
+            options.open = function (e) {
+              if (!dataSourceScreen.fetched || (dataSourceScreen.lastLoadedTime !== combobox.dataSource.lastLoadedTime)) {
                 combobox.options.firstLazyRead = true;
                 combobox.dataSource.read();
+                combobox.dataSource.lastLoadedTime = dataSourceScreen.lastLoadedTime;
+              }
+            
+              let emptyOption = { [combobox.options.dataValueField]: "", [combobox.options.dataTextField]: "" };
+              if (!combobox.dataSource.data().some(item => item[combobox.options.dataValueField] === "")) {
+                combobox.dataSource.add(emptyOption);
               }
             };
-
+            
             options.select = attrs.ngSelect ? function (e) { 
               scope.safeApply(() => {
                 var contextVars = { 
@@ -4211,6 +4319,49 @@
               dataSourceScreen.__ignoreFirstFetch = true;
             }
             var combobox = $element.kendoDropDownList(options).data('kendoDropDownList');
+            combobox.isEvaluating = false;
+            
+            function forceEmptyLineSelected() {
+              var optionLabel = combobox.list.find('.k-list-optionlabel');
+            
+              if (optionLabel && optionLabel.length) {
+                optionLabel.addClass("k-state-selected k-state-focused");
+              }
+              $log.debug("Linha vazia marcada como ativa:", optionLabel);
+            }
+            
+            var scrolling = false;
+
+            combobox.bind("open", function () {
+              if (scrolling) return;
+              scrolling = true;
+            
+              setTimeout(() => {
+                scrolling = false;
+              }, 300);
+            });
+            
+            combobox.bind("change", function () {
+              if (combobox.isEvaluating) return;
+              combobox.isEvaluating = true;
+            
+              try {
+                let selectedItem = combobox.dataItem();
+            
+                if (selectedItem && selectedItem[options.dataValueField] === "") {
+                  modelSetter(scope, "");
+                  modelTextFieldSetter(scope, "");
+                } else {
+                  modelSetter(scope, selectedItem[options.dataValueField]);
+                  modelTextFieldSetter(scope, selectedItem[options.dataTextField]);
+                }
+            
+                forceEmptyLineSelected();
+              } finally {
+                combobox.isEvaluating = false;
+              }
+            });
+            
             options.combobox = combobox;
             $(combobox.element[0]).attr('tabindex','-1');
             if (dataSourceScreen != null && dataSourceScreen != undefined) {
@@ -4225,6 +4376,13 @@
 
             this.toComboType(attrs, parent, select, combobox);
 
+            let forcedRefreshModelAt;
+            let canRefresh = () => {
+              let check = performance.now();
+              if (!forcedRefreshModelAt) return true;
+              return check - forcedRefreshModelAt > 2000;
+            };
+
             var forceChangeModel = async function(value) {
 
               $log.debug("forceChangeModel | " + attrs['id'] + " | " + value);
@@ -4268,70 +4426,29 @@
             /**
              * Observa o read do datasource para setar o primeiro valor ou valor inicial.
              */
-            var defineInitialValue = function() {
+            var defineInitialValue = function () {
               if (combobox.definingInitialValue) {
                 return;
               }
               if (!combobox.isEvaluating) {
-                var currentValue = returnTypedValue(combobox.value());
+                var currentValue = combobox.value();
                 var nextValue = null;
-
-                var found = dataSourceScreen.goTo(currentValue);
-
-                if (!found) {
-                  if ((combobox.options.lazyFirstInitialValue || !dataSourceScreen.lazy) && select.initValue != undefined && select.initValue != null) {
-                    combobox.options.lazyFirstInitialValue = false;
-                    found = dataSourceScreen.goTo(select.initValue);
-                    if (found) {
-                      nextValue = select.initValue;
-                    }
-                  }
-
-
-                  if (nextValue == null && select.firstValue) {
-                    if (dataSourceScreen) {
-                      combobox.definingInitialValue = true;
-                      dataSourceScreen.fetch({
-                        params: {
-                          $top: 1
-                        }
-                      }, {
-                        success: function(data) {
-                          if (data.length) {
-                            dataSourceScreen.data.push(data[0]);
-                            nextValue = data[0][select.dataValueField];
-                          }
-                          modelSetter(_scope, nextValue);
-                          forceChangeModel(nextValue);
-                          combobox.definingInitialValue = false;
-                        },
-                        error: function() {
-                          combobox.definingInitialValue = false;
-                        },
-                        canceled: function() {
-                          combobox.definingInitialValue = false;
-                        }
-                      }, undefined, {lookup : true});
-                    }
-                  } else {
-                    modelSetter(_scope, nextValue);
-                    forceChangeModel(nextValue);
-                    combobox.definingInitialValue = false;
-                  }
+            
+                if (!currentValue || currentValue === "") {
+                  nextValue = "";
+                  modelSetter(scope, nextValue);
+                  forceEmptyLineSelected();
                 }
               }
-              else {
-                setTimeout(()=>defineInitialValue(),300);
-              }
-            }
-
+            };
+            
             var _ngModelCtrl = ngModelCtrl;
             if (dataSourceScreen != null && dataSourceScreen != undefined) {
               dataSourceScreen.addDataSourceEvents({
                 overRideRefresh: function() {
                   dataSourceScreen.fetched = false;
                   dataSourceScreen.cleanup();
-                  defineInitialValue();
+                  canRefresh() && defineInitialValue();
                 }
               });
             }
@@ -4347,47 +4464,46 @@
                   return;
                 }
                 _scope.$apply(function() {
-                  modelSetter(_scope, combobox.dataItem()[select.dataValueField]);
-                  modelTextFieldSetter(_scope, combobox.dataItem()[select.dataTextField]);
-                  if(select.changeValueBasedOnLabel){
-                    let comboLabelValue = combobox.dataItem()[select.dataTextField];
-                    // Try to eval it first in pure vanilla and then if it was not possible in angular context.
-                    try {
-                      eval(select.changeValueBasedOnLabel + '=' + '"' + comboLabelValue + '"');
-                    }catch (e) {
-                      try {
-                        _scope.$eval(select.changeValueBasedOnLabel + '=' + '"' + comboLabelValue + '"')
-                      }catch (e) {
-                        console.error("Não foi possível atribuir o texto do combobox ", comboLabelValue, " no compo informado ", select.changeValueBasedOnLabel);
-                      }
-                    }
+                  let selectedItem = combobox.dataItem();
+                  
+                  if (!selectedItem || selectedItem[select.dataValueField] === "") {
+                    combobox.value("");
+                    modelSetter(_scope, "");
+                    modelTextFieldSetter(_scope, "");
+                  } else {
+                    modelSetter(_scope, selectedItem[select.dataValueField]);
+                    modelTextFieldSetter(_scope, selectedItem[select.dataTextField]);
                   }
-
+            
                   _compileAngular(scope, options.combobox.element[0]);
+                  if (options?.combobox?.span) {
+                    _compileAngular(scope, options.combobox.span);
+                  }
                 });
-
-              }
-
+              };
+            
               applyChange();
-
             });
-
+            
             /**
              * Observando model do DropdownList.
              */
             if (ngModelCtrl) {
               ngModelCtrl.$formatters.push(function (value) {
-                $log.debug("$formatters | " + attrs['id'] + " | " + value);
-                var x = combobox.value();
-                if (value === undefined || (value === "" && select.optionLabelValue === undefined)) {
-                  value = null;
-                  modelSetter(_scope, value);
+                if (value === undefined || value === "") {
+                  value = "";
+                  modelSetter(scope, value);
                 }
-                forceChangeModel(value);
-
                 return value;
               });
-
+              
+              ngModelCtrl.$parsers.push(function (value) {
+                if (!value || value === "") {
+                  return "";
+                }
+                return value;
+              });
+              
               ngModelCtrl.$parsers.push(function (value) {
                 $log.debug("$parsers | " + attrs['id'] + " | " + value);
                 if ((typeof value === 'boolean') || value) {
@@ -4422,9 +4538,11 @@
               select.initValue = null;
             }
 
-            if (select.initValue == '') {
-              select.initValue = null;
+            if (select.initValue === null || select.initValue === "" || !select.initValue) {
+              combobox.value("");
+              modelSetter(_scope, "");
             }
+            
 
             if (combobox.dataSource.transport && combobox.dataSource.transport.options) {
               combobox.dataSource.transport.options.combobox = combobox;
@@ -4465,10 +4583,14 @@
             });
 
             $("[aria-owns='" + `${attrs.id}_listbox` + "']").attr('aria-label', $translate.instant('template.crud.search'));
+            if (ngModelCtrl.$modelValue) {
+              _scope.cronapi.internal.forceRefreshNgModel(attrs.ngModel, ngModelCtrl.$modelValue);
+              forcedRefreshModelAt = performance.now();
+            }
           }
         };
       })
-
+    
       .directive('cronMultiSelect', function ($compile, $parse) {
         return {
           restrict: 'E',
@@ -4478,6 +4600,15 @@
             var modelSetter = modelGetter.assign;
             var model = attrs['ngModel'];
 
+            let jumpThread = () => {
+              return new Promise((resolve) => {
+                let jumpWait = setInterval(() => {
+                  clearInterval(jumpWait);
+                  resolve();
+                });
+              });
+            };
+
             var _self = this;
             var select = {};
             try {
@@ -4489,12 +4620,29 @@
             var _scope = scope;
             var _ngModelCtrl = ngModelCtrl;
 
+            if (select.relationDataSource != null) { 
+              try {
+                eval(select.relationDataSource.name);
+              }
+              catch (e) {
+                await jumpThread();
+              }
+            }
             var relactionDS = {
               relationDataSource: (select.relationDataSource != null ? eval(select.relationDataSource.name) : null),
               relationField: (select.relationField != null ? select.relationField : '')
             }
 
-            var options = await app.kendoHelper.getConfigCombobox(select, scope);
+            var options = undefined;
+            try {
+              eval(select.dataSourceScreen.name);
+              options = await app.kendoHelper.getConfigCombobox(select, scope);
+            }
+            catch (e) {
+              await jumpThread();
+              options = await app.kendoHelper.getConfigCombobox(select, scope);
+            }
+             
 
             try {
               delete options.dataSource.schema.model.id;
@@ -5262,6 +5410,87 @@
                     return false;
                   });
                 }
+                $('#checkCollapsibleMenu').on('click', function() {
+                  var mainView = document.getElementById("main-view");
+                  if (this.checked) {
+                    mainView.classList.remove("main-view-retratil");
+                  } else {
+                    mainView.classList.add("main-view-retratil");
+                  }
+                });
+
+                let baseNav = element.closest('nav');
+                if (baseNav && baseNav.length) {
+
+                  let subMenuOnHover = !baseNav.hasClass('submenu-click');
+                  let baseNavId = baseNav.attr('id');
+
+                  if (!baseNavId) {
+                    baseNavId = app.common.generateId();
+                    baseNav.attr('id', baseNavId);
+                  }
+
+                  if (subMenuOnHover) {
+                    let alreadyHooked = $(`#${baseNavId} .dropdown-submenu`).data('hooked');
+                    if (!alreadyHooked) {
+                      $(`#${baseNavId} .dropdown-submenu`).on('mouseenter', function (e) {
+                        $(this).children('.dropdown-menu').addClass('show');
+                      }).on('mouseleave', function (e) {
+                        $(this).children('.dropdown-menu').removeClass('show');
+                      });
+                      $(`#${baseNavId} .dropdown-submenu`).data('hooked', true);
+                    }
+                    
+                  }
+                  else {
+                    let alreayHooked = $(`#${baseNavId} .dropdown-menu a.dropdown-toggle`).data('hooked');
+                    if (!alreayHooked) {
+                      $(`#${baseNavId} .dropdown-menu a.dropdown-toggle`).on('click', function(e) {
+                        if (!$(this).next().hasClass('show')) {
+                          $(this).parents('.dropdown-menu').first().find('.show').removeClass('show');
+                        }
+                        var $subMenu = $(this).next('.dropdown-menu');
+                        $subMenu.toggleClass('show');
+
+                        $(this).parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', function(e) {
+                          $('.dropdown-submenu .show').removeClass('show');
+                        });
+
+                        if ($subMenu.length) {
+                          return false;
+                        }
+                        else {
+                          $('.dropdown-menu').removeClass('show');
+                        }
+                      });
+                      $(`#${baseNavId} .dropdown-menu a.dropdown-toggle`).data('hooked', true);
+                    }
+                    
+                    let alreadyHookedBs = $(`#${baseNavId} .dropdown.nav-item`).data('hooked');
+                    if (!alreadyHookedBs) {
+                      $(`#${baseNavId} .dropdown.nav-item`).on('hidden.bs.dropdown', function (e) {
+                        $('.dropdown-submenu .show').removeClass("show");
+                        $('.dropdown-menu .show').removeClass('show');
+                      });
+                      $(`#${baseNavId} .dropdown.nav-item`).data('hooked', true);
+                    }
+                    
+                  }
+
+                }
+                else {
+                  let menuWihtoutNavBar_id = $(element).find('ul:first').attr('id')
+                  let alreadyHooked = $(`#${menuWihtoutNavBar_id} .dropdown-submenu`).data('hooked');
+                  if (!alreadyHooked) {
+                    $(`#${menuWihtoutNavBar_id} .dropdown-submenu`).on('mouseenter', function (e) {
+                      $(this).children('.dropdown-menu').addClass('show');
+                    }).on('mouseleave', function (e) {
+                      $(this).children('.dropdown-menu').removeClass('show');
+                    });
+                    $(`#${menuWihtoutNavBar_id} .dropdown-submenu`).data('hooked', true);
+                  }
+                }
+
               });
             });
           }
@@ -5754,16 +5983,16 @@
         }
       })
 
-  .directive('crnInfiniteScroll', ['$compile', function($compile){
+  .directive('crnInfiniteScroll', ['$compile', function($compile) {
     'use strict';
     return {
       restrict: 'EA',
       link: function(scope, element, attrs) {
-        var dataSource = attrs.crnInfiniteScroll ? eval(attrs.crnInfiniteScroll) : attrs.crnDatasource ? eval(attrs.crnDatasource): undefined;
-        if (dataSource) {
-          let nextPageInfinite = {
-            isVisible: false,
-            checkVisibility: function(visible) {
+        let nextPageInfinite = {
+          isVisible: false,
+          checkVisibility: function(visible) {
+            var dataSource = attrs.crnInfiniteScroll ? scope.$eval(attrs.crnInfiniteScroll) : attrs.crnDatasource ? scope.$eval(attrs.crnDatasource): undefined;
+            if (dataSource) {
               if (nextPageInfinite.isVisible !== visible) {
                 nextPageInfinite.isVisible = visible;
                 if (nextPageInfinite.isVisible) {
@@ -5779,21 +6008,21 @@
                   }
                 }
               }
-            },
-            eventScroll: function() {
-              var topElem = element.offset().top;
-              var botElem = element.offset().top + element.outerHeight();
-              var botScrn = $(window).scrollTop() + $(window).innerHeight();
-              var topScrn = $(window).scrollTop();
-              nextPageInfinite.checkVisibility((botScrn > topElem) && (topScrn < botElem));
             }
-          };
-          $(window).scroll(nextPageInfinite.eventScroll);
-          $(window).ready(nextPageInfinite.eventScroll);
-        }
+          },
+          eventScroll: function() {
+            var topElem = element.offset().top;
+            var botElem = element.offset().top + element.outerHeight();
+            var botScrn = $(window).scrollTop() + $(window).innerHeight();
+            var topScrn = $(window).scrollTop();
+            nextPageInfinite.checkVisibility((botScrn > topElem) && (topScrn < botElem));
+          }
+        };
+        $(window).scroll(nextPageInfinite.eventScroll);
+        $(window).ready(nextPageInfinite.eventScroll);
       }
-    }
-  }])
+    };
+  }]);
 
 }(app));
 
@@ -6022,6 +6251,12 @@ function maskDirective($compile, $translate, $parse, attrName) {
               if (type == 'time' || type == 'time-local') {
                 momentDate = momentDate.year(1970).dayOfYear(1).month(0);
               }
+              if (typeof value === "string" && (value.length < mask.length)) {
+                let tempValue = formatWithMomentAs(mask, useUTC, value, "string");
+                if (tempValue.startsWith(value) && (value.length < tempValue.length) && (isNaN(tempValue[value.length]) || tempValue[value.length] === " ")) {
+                  ngModelCtrl.$$element.val(tempValue.substring(0, value.length + 1));
+                }
+              }
               return momentDate.toDate();
             }
 
@@ -6797,6 +7032,9 @@ app.kendoHelper = {
                   self.options.combobox.options.expanded = true;
                 }
                 e.success(data);
+                if (self?.options?.combobox?.span) {
+                  self.options.$compile(self.options.combobox.span)(self.options.scope);
+                }
                 self.options.kendoCallback = e;
                 if (self.options && self.options.combobox && self.options.combobox.element[0].id) {
                   var expToFind = " .k-animation-container";
@@ -7258,6 +7496,33 @@ function cronReportViewer($compile) {
 
       executeReport(attrs.options);
 
+      // Não inicia em em Tab não ativa
+      // Verifica se esta dentro de um tab
+      let elementTab = element[0].parentElement;
+      while (elementTab) {
+        if (elementTab.tagName === "BODY") {
+          elementTab = null;
+        } else if (elementTab.classList.contains("tab-pane")) {
+          break;
+        } else {
+          elementTab = elementTab.parentElement;
+        }
+      }
+      // Se estiver dentro de um tab e esta não estiver ativa, inclui observador para ler o relatorio ao ativar a tab
+      if (elementTab && !elementTab.classList.contains("active")) {
+        let observerClassChange = new MutationObserver(function(mutationsList, observer) {
+          for (let mutation of mutationsList) {
+            if (mutation.attributeName === "class" && mutation.target.classList.contains("active")) {
+              executeReport(attrs.options);
+              // Desconecta observador, pois só precisa ser executado uma vez.
+              observer.disconnect();
+              break;
+            }
+          }
+        });
+        observerClassChange.observe(elementTab, { attributes: true });
+      }
+
       var filterTimeout = null;
       scope.$watch(function(){ return attrs.options }, function(value, old){
         if (value !== old) {
@@ -7276,4 +7541,5 @@ function cronReportViewer($compile) {
 
     }
   };
-}
+}
+