@masterkeymaterial/ui 0.2.25 → 0.2.27
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.
|
@@ -6809,6 +6809,7 @@ class GridFilterBar {
|
|
|
6809
6809
|
clearGroups = output();
|
|
6810
6810
|
collapseGroups = output();
|
|
6811
6811
|
expandGroups = output();
|
|
6812
|
+
clickOpcoesListagem = output();
|
|
6812
6813
|
outsideMenuActionsTop = computed(() => {
|
|
6813
6814
|
return (this.config().actionsTop ?? []).filter(a => a.inmenu == false && a.showAction);
|
|
6814
6815
|
}, ...(ngDevMode ? [{ debugName: "outsideMenuActionsTop" }] : /* istanbul ignore next */ []));
|
|
@@ -6840,12 +6841,12 @@ class GridFilterBar {
|
|
|
6840
6841
|
this.expandGroups.emit();
|
|
6841
6842
|
}
|
|
6842
6843
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: GridFilterBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6843
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: GridFilterBar, isStandalone: true, selector: "lib-grid-filter-bar", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, colunasDefinidas: { classPropertyName: "colunasDefinidas", publicName: "colunasDefinidas", isSignal: true, isRequired: true, transformFunction: null }, colAgrupadoAtual: { classPropertyName: "colAgrupadoAtual", publicName: "colAgrupadoAtual", isSignal: true, isRequired: true, transformFunction: null }, isAgrupado: { classPropertyName: "isAgrupado", publicName: "isAgrupado", isSignal: true, isRequired: true, transformFunction: null }, filterCollapsed: { classPropertyName: "filterCollapsed", publicName: "filterCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searchInput: "searchInput", actionTriggered: "actionTriggered", filterToggle: "filterToggle", groupByColumn: "groupByColumn", clearGroups: "clearGroups", collapseGroups: "collapseGroups", expandGroups: "expandGroups" }, ngImport: i0, template: "@if(config().showControlBar) {\n<div class=\"table-topo-container table-styles\">\n\n\t@if(config().showActionsTop) {\n\t<div class=\"table-actions-outside\">\n\t\t@for (action of outsideMenuActionsTop(); track $index;) {\n\t\t<ui-button tipo=\"fill\" tema=\"primary\" [title]=\"action.display\" (click)=\"onClickAction(action)\"\n\t\t\t[icone]=\"action.icon\">\n\t\t\t{{ action?.display ?? '' }}\n\t\t</ui-button>\n\t\t}\n\t</div>\n\t}\n\n\t<div class=\"table-top-right-container table-conjunto-actions\">\n\t\t@if(config().showSearch) {\n\t\t<div class=\"table-conjunto-actions-item table-pesquisar\">\n\t\t\t<ui-procurar (inputed)=\"onInputSearch($event)\" [autoColapse]=\"true\"></ui-procurar>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showFilterBar) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onClickOpenCloseFilterZone()\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2z\" />\n\t\t\t\t</svg>\n\t\t\t\t<span class=\"table-collapse-ico\" [class.ativo]=\"!filterCollapsed()\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z\" />\n\t\t\t\t\t</svg>\n\t\t\t\t</span>\n\t\t\t</ui-button>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showGridMenu != false) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t<ui-button slot=\"botao\" tipo=\"nofill\" tema=\"primary\" class=\"filtro-menu\"\n\t\t\t\t\t[title]=\"config().actionsTopConfig?.menuDisplay\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"stroke-icone\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0\" />\n\t\t\t\t\t</svg>\n\t\t\t\t\t{{ config().actionsTopConfig?.menuDisplay }}\n\t\t\t\t</ui-button>\n\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\tOp\u00E7\u00F5es da Listagem\n\t\t\t\t</div>\n\n\t\t\t\t@for (action of menuActionsTop(); track $index;) {\n\t\t\t\t@if(action.actions != null) {\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" [title]=\"action.display\"\n\t\t\t\t\t\t[style.--ui-border-radius]=\"'0px'\" [icone]=\"action.icon\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</div>\n\t\t\t\t\t@for(subAction of action.actions; track $index) {\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(subAction)\"\n\t\t\t\t\t\t[icone]=\"subAction?.showIcon ? (subAction?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t\t{{ subAction?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t}\n\t\t\t\t</ui-menu>\n\t\t\t\t} @else {\n\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(action)\"\n\t\t\t\t\t[icone]=\"action?.showIcon ? (action?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t</ui-button>\n\t\t\t\t}\n\t\t\t\t}@empty {\n\t\t\t\t<div class=\"p-2 text-center text-muted\">\n\t\t\t\t\tNenhuma a\u00E7\u00E3o dispon\u00EDvel.\n\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" icone=\"fa fa-object-group\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\">\n\t\t\t\t\t\t\tAgrupar Por\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t<div class=\"menu-sub-title\">\n\t\t\t\t\t\t\tAgrupar por\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@for (coluna of colunasDefinidas(); track $index) {\n\t\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onAgruparPor(coluna)\"\n\t\t\t\t\t\t\t[icone]=\"isAgrupado() && colAgrupadoAtual()?.prop === coluna.prop ? 'bi bi-check2-square' : 'bi bi-square'\">\n\t\t\t\t\t\t\t{{ coluna.titulo }}\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</ui-menu>\n\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\t\t\t\t\t[disabled]=\"!isAgrupado()\">\n\t\t\t\t\t\tDesagrupar\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\">\n\t\t\t\t\t\tRecolher Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\">\n\t\t\t\t\t\tExpandir Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t</ui-menu>\n\t\t\t</ui-menu>\n\t\t</div>\n\t\t}\n\t</div>\n\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n", ":host{display:block}.stroke-icone{stroke:var(--mk-grid-primary, #000) 1px;fill:var(--mk-grid-primary, #000)}\n"], dependencies: [{ kind: "component", type: UiButton, selector: "ui-button", inputs: ["icone", "iconeAntes", "iconeDepois", "iconeCategory", "disabled", "eventPropagation", "radiusTabFormat", "tabindex", "tipo", "tema", "classes", "ativo"], outputs: ["iconeChange", "iconeAntesChange", "iconeDepoisChange", "iconeCategoryChange", "clicked", "temaChange"] }, { kind: "component", type: UiMenu, selector: "ui-menu", inputs: ["disabled", "icone", "autoCloseInCascade", "posicao", "isOpened"], outputs: ["autoCloseInCascadeChange", "posicaoChange", "isOpenedChange"] }, { kind: "component", type: UiProcurar, selector: "ui-procurar", inputs: ["value", "colapsed", "autoColapse", "name", "placeholder", "disabled"], outputs: ["inputed", "changed", "valueChange", "colapsedChange", "autoColapseChange"] }] });
|
|
6844
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: GridFilterBar, isStandalone: true, selector: "lib-grid-filter-bar", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, colunasDefinidas: { classPropertyName: "colunasDefinidas", publicName: "colunasDefinidas", isSignal: true, isRequired: true, transformFunction: null }, colAgrupadoAtual: { classPropertyName: "colAgrupadoAtual", publicName: "colAgrupadoAtual", isSignal: true, isRequired: true, transformFunction: null }, isAgrupado: { classPropertyName: "isAgrupado", publicName: "isAgrupado", isSignal: true, isRequired: true, transformFunction: null }, filterCollapsed: { classPropertyName: "filterCollapsed", publicName: "filterCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searchInput: "searchInput", actionTriggered: "actionTriggered", filterToggle: "filterToggle", groupByColumn: "groupByColumn", clearGroups: "clearGroups", collapseGroups: "collapseGroups", expandGroups: "expandGroups", clickOpcoesListagem: "clickOpcoesListagem" }, ngImport: i0, template: "@if(config().showControlBar) {\n<div class=\"table-topo-container table-styles\">\n\n\t@if(config().showActionsTop) {\n\t<div class=\"table-actions-outside\">\n\t\t@for (action of outsideMenuActionsTop(); track $index;) {\n\t\t<ui-button tipo=\"fill\" tema=\"primary\" [title]=\"action.display\" (click)=\"onClickAction(action)\"\n\t\t\t[icone]=\"action.icon\">\n\t\t\t{{ action?.display ?? '' }}\n\t\t</ui-button>\n\t\t}\n\t</div>\n\t}\n\n\t<div class=\"table-top-right-container table-conjunto-actions\">\n\t\t@if(config().showSearch) {\n\t\t<div class=\"table-conjunto-actions-item table-pesquisar\">\n\t\t\t<ui-procurar (inputed)=\"onInputSearch($event)\" [autoColapse]=\"true\"></ui-procurar>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showFilterBar) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onClickOpenCloseFilterZone()\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2z\" />\n\t\t\t\t</svg>\n\t\t\t\t<span class=\"table-collapse-ico\" [class.ativo]=\"!filterCollapsed()\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z\" />\n\t\t\t\t\t</svg>\n\t\t\t\t</span>\n\t\t\t</ui-button>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showGridMenu != false) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t<ui-button slot=\"botao\" tipo=\"nofill\" tema=\"primary\" class=\"filtro-menu\"\n\t\t\t\t\t[title]=\"config().actionsTopConfig?.menuDisplay\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"stroke-icone\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0\" />\n\t\t\t\t\t</svg>\n\t\t\t\t\t{{ config().actionsTopConfig?.menuDisplay }}\n\t\t\t\t</ui-button>\n\t\t\t\t<div class=\"menu-title\" (click)=\"clickOpcoesListagem.emit()\">\n\t\t\t\t\tOp\u00E7\u00F5es da Listagem\n\t\t\t\t</div>\n\n\t\t\t\t@for (action of menuActionsTop(); track $index;) {\n\t\t\t\t@if(action.actions != null) {\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" [title]=\"action.display\"\n\t\t\t\t\t\t[style.--ui-border-radius]=\"'0px'\" [icone]=\"action.icon\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</div>\n\t\t\t\t\t@for(subAction of action.actions; track $index) {\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(subAction)\"\n\t\t\t\t\t\t[icone]=\"subAction?.showIcon ? (subAction?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t\t{{ subAction?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t}\n\t\t\t\t</ui-menu>\n\t\t\t\t} @else {\n\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(action)\"\n\t\t\t\t\t[icone]=\"action?.showIcon ? (action?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t</ui-button>\n\t\t\t\t}\n\t\t\t\t}@empty {\n\t\t\t\t<div class=\"p-2 text-center text-muted\">\n\t\t\t\t\tNenhuma a\u00E7\u00E3o dispon\u00EDvel.\n\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" icone=\"fa fa-object-group\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\">\n\t\t\t\t\t\t\tAgrupar Por\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t<div class=\"menu-sub-title\">\n\t\t\t\t\t\t\tAgrupar por\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@for (coluna of colunasDefinidas(); track $index) {\n\t\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onAgruparPor(coluna)\"\n\t\t\t\t\t\t\t[icone]=\"isAgrupado() && colAgrupadoAtual()?.prop === coluna.prop ? 'bi bi-check2-square' : 'bi bi-square'\">\n\t\t\t\t\t\t\t{{ coluna.titulo }}\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</ui-menu>\n\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\t\t\t\t\t[disabled]=\"!isAgrupado()\">\n\t\t\t\t\t\tDesagrupar\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\">\n\t\t\t\t\t\tRecolher Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\">\n\t\t\t\t\t\tExpandir Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t</ui-menu>\n\t\t\t</ui-menu>\n\t\t</div>\n\t\t}\n\t</div>\n\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n", ":host{display:block}.stroke-icone{stroke:var(--mk-grid-primary, #000) 1px;fill:var(--mk-grid-primary, #000)}\n"], dependencies: [{ kind: "component", type: UiButton, selector: "ui-button", inputs: ["icone", "iconeAntes", "iconeDepois", "iconeCategory", "disabled", "eventPropagation", "radiusTabFormat", "tabindex", "tipo", "tema", "classes", "ativo"], outputs: ["iconeChange", "iconeAntesChange", "iconeDepoisChange", "iconeCategoryChange", "clicked", "temaChange"] }, { kind: "component", type: UiMenu, selector: "ui-menu", inputs: ["disabled", "icone", "autoCloseInCascade", "posicao", "isOpened"], outputs: ["autoCloseInCascadeChange", "posicaoChange", "isOpenedChange"] }, { kind: "component", type: UiProcurar, selector: "ui-procurar", inputs: ["value", "colapsed", "autoColapse", "name", "placeholder", "disabled"], outputs: ["inputed", "changed", "valueChange", "colapsedChange", "autoColapseChange"] }] });
|
|
6844
6845
|
}
|
|
6845
6846
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: GridFilterBar, decorators: [{
|
|
6846
6847
|
type: Component,
|
|
6847
|
-
args: [{ selector: 'lib-grid-filter-bar', imports: [UiButton, UiMenu, UiProcurar], template: "@if(config().showControlBar) {\n<div class=\"table-topo-container table-styles\">\n\n\t@if(config().showActionsTop) {\n\t<div class=\"table-actions-outside\">\n\t\t@for (action of outsideMenuActionsTop(); track $index;) {\n\t\t<ui-button tipo=\"fill\" tema=\"primary\" [title]=\"action.display\" (click)=\"onClickAction(action)\"\n\t\t\t[icone]=\"action.icon\">\n\t\t\t{{ action?.display ?? '' }}\n\t\t</ui-button>\n\t\t}\n\t</div>\n\t}\n\n\t<div class=\"table-top-right-container table-conjunto-actions\">\n\t\t@if(config().showSearch) {\n\t\t<div class=\"table-conjunto-actions-item table-pesquisar\">\n\t\t\t<ui-procurar (inputed)=\"onInputSearch($event)\" [autoColapse]=\"true\"></ui-procurar>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showFilterBar) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onClickOpenCloseFilterZone()\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2z\" />\n\t\t\t\t</svg>\n\t\t\t\t<span class=\"table-collapse-ico\" [class.ativo]=\"!filterCollapsed()\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z\" />\n\t\t\t\t\t</svg>\n\t\t\t\t</span>\n\t\t\t</ui-button>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showGridMenu != false) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t<ui-button slot=\"botao\" tipo=\"nofill\" tema=\"primary\" class=\"filtro-menu\"\n\t\t\t\t\t[title]=\"config().actionsTopConfig?.menuDisplay\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"stroke-icone\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0\" />\n\t\t\t\t\t</svg>\n\t\t\t\t\t{{ config().actionsTopConfig?.menuDisplay }}\n\t\t\t\t</ui-button>\n\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\tOp\u00E7\u00F5es da Listagem\n\t\t\t\t</div>\n\n\t\t\t\t@for (action of menuActionsTop(); track $index;) {\n\t\t\t\t@if(action.actions != null) {\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" [title]=\"action.display\"\n\t\t\t\t\t\t[style.--ui-border-radius]=\"'0px'\" [icone]=\"action.icon\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</div>\n\t\t\t\t\t@for(subAction of action.actions; track $index) {\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(subAction)\"\n\t\t\t\t\t\t[icone]=\"subAction?.showIcon ? (subAction?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t\t{{ subAction?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t}\n\t\t\t\t</ui-menu>\n\t\t\t\t} @else {\n\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(action)\"\n\t\t\t\t\t[icone]=\"action?.showIcon ? (action?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t</ui-button>\n\t\t\t\t}\n\t\t\t\t}@empty {\n\t\t\t\t<div class=\"p-2 text-center text-muted\">\n\t\t\t\t\tNenhuma a\u00E7\u00E3o dispon\u00EDvel.\n\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" icone=\"fa fa-object-group\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\">\n\t\t\t\t\t\t\tAgrupar Por\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t<div class=\"menu-sub-title\">\n\t\t\t\t\t\t\tAgrupar por\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@for (coluna of colunasDefinidas(); track $index) {\n\t\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onAgruparPor(coluna)\"\n\t\t\t\t\t\t\t[icone]=\"isAgrupado() && colAgrupadoAtual()?.prop === coluna.prop ? 'bi bi-check2-square' : 'bi bi-square'\">\n\t\t\t\t\t\t\t{{ coluna.titulo }}\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</ui-menu>\n\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\t\t\t\t\t[disabled]=\"!isAgrupado()\">\n\t\t\t\t\t\tDesagrupar\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\">\n\t\t\t\t\t\tRecolher Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\">\n\t\t\t\t\t\tExpandir Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t</ui-menu>\n\t\t\t</ui-menu>\n\t\t</div>\n\t\t}\n\t</div>\n\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n", ":host{display:block}.stroke-icone{stroke:var(--mk-grid-primary, #000) 1px;fill:var(--mk-grid-primary, #000)}\n"] }]
|
|
6848
|
-
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], colunasDefinidas: [{ type: i0.Input, args: [{ isSignal: true, alias: "colunasDefinidas", required: true }] }], colAgrupadoAtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "colAgrupadoAtual", required: true }] }], isAgrupado: [{ type: i0.Input, args: [{ isSignal: true, alias: "isAgrupado", required: true }] }], filterCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterCollapsed", required: false }] }], searchInput: [{ type: i0.Output, args: ["searchInput"] }], actionTriggered: [{ type: i0.Output, args: ["actionTriggered"] }], filterToggle: [{ type: i0.Output, args: ["filterToggle"] }], groupByColumn: [{ type: i0.Output, args: ["groupByColumn"] }], clearGroups: [{ type: i0.Output, args: ["clearGroups"] }], collapseGroups: [{ type: i0.Output, args: ["collapseGroups"] }], expandGroups: [{ type: i0.Output, args: ["expandGroups"] }] } });
|
|
6848
|
+
args: [{ selector: 'lib-grid-filter-bar', imports: [UiButton, UiMenu, UiProcurar], template: "@if(config().showControlBar) {\n<div class=\"table-topo-container table-styles\">\n\n\t@if(config().showActionsTop) {\n\t<div class=\"table-actions-outside\">\n\t\t@for (action of outsideMenuActionsTop(); track $index;) {\n\t\t<ui-button tipo=\"fill\" tema=\"primary\" [title]=\"action.display\" (click)=\"onClickAction(action)\"\n\t\t\t[icone]=\"action.icon\">\n\t\t\t{{ action?.display ?? '' }}\n\t\t</ui-button>\n\t\t}\n\t</div>\n\t}\n\n\t<div class=\"table-top-right-container table-conjunto-actions\">\n\t\t@if(config().showSearch) {\n\t\t<div class=\"table-conjunto-actions-item table-pesquisar\">\n\t\t\t<ui-procurar (inputed)=\"onInputSearch($event)\" [autoColapse]=\"true\"></ui-procurar>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showFilterBar) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onClickOpenCloseFilterZone()\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2z\" />\n\t\t\t\t</svg>\n\t\t\t\t<span class=\"table-collapse-ico\" [class.ativo]=\"!filterCollapsed()\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" class=\"stroke-icone\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z\" />\n\t\t\t\t\t</svg>\n\t\t\t\t</span>\n\t\t\t</ui-button>\n\t\t</div>\n\t\t}\n\n\t\t@if(config().showGridMenu != false) {\n\t\t<div class=\"table-conjunto-actions-item\">\n\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t<ui-button slot=\"botao\" tipo=\"nofill\" tema=\"primary\" class=\"filtro-menu\"\n\t\t\t\t\t[title]=\"config().actionsTopConfig?.menuDisplay\" [style.--ui-border-radius]=\"'0px'\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"stroke-icone\">\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0\" />\n\t\t\t\t\t</svg>\n\t\t\t\t\t{{ config().actionsTopConfig?.menuDisplay }}\n\t\t\t\t</ui-button>\n\t\t\t\t<div class=\"menu-title\" (click)=\"clickOpcoesListagem.emit()\">\n\t\t\t\t\tOp\u00E7\u00F5es da Listagem\n\t\t\t\t</div>\n\n\t\t\t\t@for (action of menuActionsTop(); track $index;) {\n\t\t\t\t@if(action.actions != null) {\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" [title]=\"action.display\"\n\t\t\t\t\t\t[style.--ui-border-radius]=\"'0px'\" [icone]=\"action.icon\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t\t</div>\n\t\t\t\t\t@for(subAction of action.actions; track $index) {\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(subAction)\"\n\t\t\t\t\t\t[icone]=\"subAction?.showIcon ? (subAction?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t\t{{ subAction?.display ?? '' }}\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t}\n\t\t\t\t</ui-menu>\n\t\t\t\t} @else {\n\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClickAction(action)\"\n\t\t\t\t\t[icone]=\"action?.showIcon ? (action?.icon ?? 'bi bi-dot') : undefined\">\n\t\t\t\t\t{{ action?.display ?? '' }}\n\t\t\t\t</ui-button>\n\t\t\t\t}\n\t\t\t\t}@empty {\n\t\t\t\t<div class=\"p-2 text-center text-muted\">\n\t\t\t\t\tNenhuma a\u00E7\u00E3o dispon\u00EDvel.\n\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\" icone=\"fa fa-object-group\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<div class=\"menu-title\">\n\t\t\t\t\t\tAgrupamento\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<ui-menu [autoCloseInCascade]=\"false\">\n\t\t\t\t\t\t<ui-button slot=\"botao\" tipo=\"menu-item-category\" tema=\"primary\">\n\t\t\t\t\t\t\tAgrupar Por\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t<div class=\"menu-sub-title\">\n\t\t\t\t\t\t\tAgrupar por\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@for (coluna of colunasDefinidas(); track $index) {\n\t\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onAgruparPor(coluna)\"\n\t\t\t\t\t\t\t[icone]=\"isAgrupado() && colAgrupadoAtual()?.prop === coluna.prop ? 'bi bi-check2-square' : 'bi bi-square'\">\n\t\t\t\t\t\t\t{{ coluna.titulo }}\n\t\t\t\t\t\t</ui-button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</ui-menu>\n\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\t\t\t\t\t[disabled]=\"!isAgrupado()\">\n\t\t\t\t\t\tDesagrupar\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\">\n\t\t\t\t\t\tRecolher Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t\t<ui-button tipo=\"menu-item\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\">\n\t\t\t\t\t\tExpandir Todos\n\t\t\t\t\t</ui-button>\n\t\t\t\t</ui-menu>\n\t\t\t</ui-menu>\n\t\t</div>\n\t\t}\n\t</div>\n\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n", ":host{display:block}.stroke-icone{stroke:var(--mk-grid-primary, #000) 1px;fill:var(--mk-grid-primary, #000)}\n"] }]
|
|
6849
|
+
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], colunasDefinidas: [{ type: i0.Input, args: [{ isSignal: true, alias: "colunasDefinidas", required: true }] }], colAgrupadoAtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "colAgrupadoAtual", required: true }] }], isAgrupado: [{ type: i0.Input, args: [{ isSignal: true, alias: "isAgrupado", required: true }] }], filterCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterCollapsed", required: false }] }], searchInput: [{ type: i0.Output, args: ["searchInput"] }], actionTriggered: [{ type: i0.Output, args: ["actionTriggered"] }], filterToggle: [{ type: i0.Output, args: ["filterToggle"] }], groupByColumn: [{ type: i0.Output, args: ["groupByColumn"] }], clearGroups: [{ type: i0.Output, args: ["clearGroups"] }], collapseGroups: [{ type: i0.Output, args: ["collapseGroups"] }], expandGroups: [{ type: i0.Output, args: ["expandGroups"] }], clickOpcoesListagem: [{ type: i0.Output, args: ["clickOpcoesListagem"] }] } });
|
|
6849
6850
|
|
|
6850
6851
|
class GridEmptyList {
|
|
6851
6852
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: GridEmptyList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -6920,6 +6921,13 @@ class MkGrid {
|
|
|
6920
6921
|
actionsLineConfig: { ...GRID_CONFIG_DEFAULTS.actionsLineConfig, ...c.actionsLineConfig },
|
|
6921
6922
|
};
|
|
6922
6923
|
}, ...(ngDevMode ? [{ debugName: "cfg" }] : /* istanbul ignore next */ []));
|
|
6924
|
+
startSelected = computed(() => {
|
|
6925
|
+
const startSelected = this.cfg().startSelected;
|
|
6926
|
+
if (startSelected) {
|
|
6927
|
+
return startSelected.map(s => s?.toString() ?? '');
|
|
6928
|
+
}
|
|
6929
|
+
return [];
|
|
6930
|
+
}, ...(ngDevMode ? [{ debugName: "startSelected" }] : /* istanbul ignore next */ []));
|
|
6923
6931
|
performance = computed(() => {
|
|
6924
6932
|
return this.cfg().timeRequest
|
|
6925
6933
|
? `${this.cfg().timeRequest}ms`
|
|
@@ -7002,7 +7010,7 @@ class MkGrid {
|
|
|
7002
7010
|
}, 0);
|
|
7003
7011
|
}
|
|
7004
7012
|
iniciarSelectedRows(lista) {
|
|
7005
|
-
let listaSelecionados = this.
|
|
7013
|
+
let listaSelecionados = this.startSelected();
|
|
7006
7014
|
if (!listaSelecionados || !lista) {
|
|
7007
7015
|
this.clearSelections();
|
|
7008
7016
|
return;
|
|
@@ -7553,8 +7561,14 @@ class MkGrid {
|
|
|
7553
7561
|
});
|
|
7554
7562
|
this.calcularColunasExibir();
|
|
7555
7563
|
}
|
|
7564
|
+
onClickOpcoesListagem() {
|
|
7565
|
+
console.log('Listagem', this);
|
|
7566
|
+
console.log('Config', this.cfg());
|
|
7567
|
+
console.log('Lista', this.lista());
|
|
7568
|
+
console.log('Filtro', this.filtro());
|
|
7569
|
+
}
|
|
7556
7570
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: MkGrid, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7557
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: MkGrid, isStandalone: true, selector: "lib-mk-grid", inputs: { lista: { classPropertyName: "lista", publicName: "lista", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, filtro: { classPropertyName: "filtro", publicName: "filtro", isSignal: true, isRequired: false, transformFunction: null }, minLineHeight: { classPropertyName: "minLineHeight", publicName: "minLineHeight", isSignal: true, isRequired: false, transformFunction: null }, isCompacted: { classPropertyName: "isCompacted", publicName: "isCompacted", isSignal: true, isRequired: false, transformFunction: null }, hasGrid: { classPropertyName: "hasGrid", publicName: "hasGrid", isSignal: true, isRequired: false, transformFunction: null }, hasVerticalLine: { classPropertyName: "hasVerticalLine", publicName: "hasVerticalLine", isSignal: true, isRequired: false, transformFunction: null }, hasSeletor: { classPropertyName: "hasSeletor", publicName: "hasSeletor", isSignal: true, isRequired: false, transformFunction: null }, paginationSize: { classPropertyName: "paginationSize", publicName: "paginationSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { minLineHeight: "minLineHeightChange", isCompacted: "isCompactedChange", hasGrid: "hasGridChange", hasVerticalLine: "hasVerticalLineChange", hasSeletor: "hasSeletorChange", paginationSize: "paginationSizeChange" }, viewQueries: [{ propertyName: "gridSize", first: true, predicate: ["gridSize"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "gridfiltro", first: true, predicate: ["gridfiltro"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "filterContainer", first: true, predicate: ["filterContainer"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<lib-grid-filter-bar [config]=\"cfg()\" [colunasDefinidas]=\"$any(colunasDefinidas())\"\n\t[colAgrupadoAtual]=\"colAgrupadoAtual()\" [isAgrupado]=\"isAgrupado()\" [filterCollapsed]=\"filtroCollapsed()\"\n\t(searchInput)=\"onInputSearch($event)\" (filterToggle)=\"onClickOpenCloseFilterZone()\"\n\t(actionTriggered)=\"onClickAction($event)\" (groupByColumn)=\"onAgruparPor($any($event))\" (clearGroups)=\"onClearGroups()\"\n\t(collapseGroups)=\"onRecolherGroups()\" (expandGroups)=\"onExpandirGroups()\">\n</lib-grid-filter-bar>\n\n@if(cfg().showFilterBar) {\n<div class=\"table-filter-container table-styles\" [style.--filter-height.px]=\"filterHeight()\">\n\t<div #filterContainer class=\"table-filter-content\" [class.table-filter-hide]=\"filtroCollapsed()\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n}\n\n@if(currentDevice() == \"Mobile\"){\n<!-- MOBILE INICIO -->\n\n@for (dadosLinha of listaExibir(); track $index;let i = $index) {\n@if( dadosLinha.isColapsed !== true){\n\n@if(dadosLinha.isFullLine?.visible){\n<!-- MOBILE GRUPO LINHA PR\u00D3PRIA -->\n<div class=\"table-row-mobile table-formated table-group table-styles\" (click)=\"onClickGroup(dadosLinha)\">\n\t<div>{{ dadosLinha.groupName }}</div>\n\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t<div class=\"table-group-items-ico\">\n\t\t\t<i class=\"bi bi-caret-down\"></i>\n\t\t</div>\n\t</div>\n</div>\n} @else {\n\n<div class=\"table-overflow mobile\" [style.--table-min-height]=\"isCompacted() ? '20px' : minLineHeight()\">\n\t<div class=\"table-table-mobile\" [class.selected]=\"dadosLinha.selecionado\">\n\n\t\t<!-- MOBILE DADOS -->\n\t\t@if(cfg().showActionsLine){\n\t\t<div class=\"table-header-mobile\" [style.gridArea]=\"'auto / auto / auto / span 2'\">\n\t\t\t@if(hasVerticalLine()){\n\t\t\t<!-- MOBILE VERTICAL DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-vertical-line\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t{{ dadosLinha.ordem }}\n\t\t\t</div>\n\t\t\t}\n\t\t\t@if(hasSeletor()){\n\t\t\t<!-- MOBILE SELECTOR DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-item-seletor\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t<ui-check-box [(value)]=\"dadosLinha.selecionado\" [style.--ui-color]=\"'var(--sys-on-primary)'\"\n\t\t\t\t\t[style.--ui-outline]=\"'var(--sys-on-primary)'\" [single]=\"this.cfg().selectionMode == 'single'\"\n\t\t\t\t\t[style.--ui-size]=\"isCompacted() ? '15px' : undefined\"></ui-check-box>\n\t\t\t</div>\n\t\t\t}\n\t\t\t<div class=\"table-header-mobile-space\" (click)=\"onClickRow(dadosLinha)\"></div>\n\t\t\t<lib-grid-cell-actions [config]=\"cfg()\" [dadosDaLinha]=\"dadosLinha\" [mobileHeader]=\"true\"\n\t\t\t\t(action)=\"onClickCellAction($event)\" [compact]=\"isCompacted()\"></lib-grid-cell-actions>\n\t\t</div>\n\t\t}\n\n\t\t<!-- MOBILE LINHA -->\n\t\t@for (localColuna of colunasOrdenadas(); track $index;) {\n\t\t<div class=\"table-header-mobile\" [class.sortable]=\"localColuna.sortable !== false\"\n\t\t\t[class.sorted-asc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'asc'\"\n\t\t\t[class.sorted-desc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'desc'\"\n\t\t\t(click)=\"localColuna.sortable !== false && alternarOrdenacao(localColuna.prop)\" [style]=\"localColuna.styleHeader\">\n\t\t\t<div class=\"table-header-mobile-text\" [title]=\"localColuna.titulo\"\n\t\t\t\t[innerHTML]=\"localColuna.tituloReduzido ?? localColuna.titulo\">\n\t\t\t</div>\n\t\t\t<div class=\"table-header-controls\">\n\t\t\t\t@if (localColuna.sortable !== false) {\n\t\t\t\t<span class=\"table-ico-sort\">\n\t\t\t\t\t@if (obterDirecaoOrdenacao(localColuna.prop) === 'asc') {\n\t\t\t\t\t<i class=\"fa fa-sort-up asc\"></i>\n\t\t\t\t\t} @else if (obterDirecaoOrdenacao(localColuna.prop) === 'desc') {\n\t\t\t\t\t<i class=\"fa fa-sort-down desc\"></i>\n\t\t\t\t\t}\n\t\t\t\t</span>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t\t<lib-grid-cell-handler class=\"table-item-mobile table-formated\" [class.odd]=\"i % 2 !== 0\" [class.even]=\"i % 2 === 0\"\n\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"localColuna\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t[localColunas]=\"colunasOrdenadas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t}\n\t</div>\n</div>\n}\n}\n} @empty {\n<!-- LINHA DE SEM DADOS -->\n<div class=\"table-styles\"><lib-grid-empty-list></lib-grid-empty-list></div>\n}\n<!-- MOBILE FIM -->\n\n\n} @else {\n<!-- DESKTOP INICIO -->\n<div #gridSize class=\"table-overflow\" [class.compacted]=\"isCompacted()\"\n\t[style.--table-min-height]=\"isCompacted() ? '40px' : minLineHeight()\">\n\t<div class=\"table-table\" [class.table-has-vertical-line]=\"hasVerticalLine()\" [class.table-has-seletor]=\"hasSeletor()\"\n\t\tcdkDropList (cdkDropListDropped)=\"onDropColuna($event)\" [cdkDropListData]=\"colunasExibir()\"\n\t\t[style.gridTemplateColumns]=\"`${this.pxVerticalLine()}${this.pxSelector()}` + this.pxColunas() + this.pxActions()\">\n\t\t<!-- DESKTOP HEADER -->\n\t\t<lib-grid-header-row [colunas]=\"colunasExibir()\" [ordenacoes]=\"ordenacoesSignal()\"\n\t\t\t[todosSelecionados]=\"todosSelecionados()\" [config]=\"cfg()\" [hasSeletor]=\"hasSeletor()\"\n\t\t\t[hasVerticalLine]=\"hasVerticalLine()\" [hasGrid]=\"hasGrid()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[isSelectingAll]=\"isSelectingAll()\" (columnSort)=\"alternarOrdenacao($event)\"\n\t\t\t(selectAll)=\"onChangeTodosSelecionados($event)\"\n\t\t\t(columnResizeStart)=\"onResizeStart($event.event, $any($event.coluna))\"\n\t\t\t(columnResizeDoubleClick)=\"onDoubleClickControls($event.event, $any($event.coluna))\">\n\t\t</lib-grid-header-row>\n\n\t\t<!-- DESKTOP LINHAS DE DADOS -->\n\t\t@for (dadosLinha of listaExibir(); track $index; let i = $index) {@if( dadosLinha.isColapsed !== true){\n\n\t\t@if(dadosLinha.isFullLine?.visible){\n\n\t\t<!-- DESKTOP FULL LINE (COLSPAN HORIZONTAL) -->\n\t\t@if(hasVerticalLine()){\n\t\t<!-- DESKTOP HEADER VERTICAL FULL LINE -->\n\t\t<div class=\"table-header table-formated table-vertical-line\">\n\t\t\t{{ dadosLinha.ordem }}\n\t\t</div>\n\t\t}\n\t\t<!-- DESKTOP GRUPO: ROW -->\n\t\t@if(dadosLinha.isGroup){\n\n\t\t<div class=\"table-row table-formated table-group table-border-bottom-card\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<div class=\"table-group-name\" [class.table-inativo]=\"dadosLinha.inativo\">\n\t\t\t\t<lib-grid-cell-handler class=\"table-item table-dados {{ colAgrupadoAtual()?.classeCell }}\"\n\t\t\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"colAgrupadoAtual()!\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t\t\t[localColunas]=\"colunasDefinidas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t\t</div>\n\t\t\t<ui-button tipo=\"nofill\" (click)=\"onClickGroup(dadosLinha)\">\n\t\t\t\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t\t\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t\t\t\t<div class=\"table-group-items-ico\">\n\t\t\t\t\t\t<i [class]=\"dadosLinha.isFullLine?.colapsed ? 'bi bi-caret-down-fill' : 'bi bi-caret-down'\"></i>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</ui-button>\n\t\t</div>\n\n\t\t} @else {\n\t\t<div class=\"table-row table-formated table-others\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\tNada a exibir nesta linha\n\t\t</div>\n\t\t}\n\n\t\t} @else {\n\n\t\t<!-- LINHA NORMAL via GridRowRenderer -->\n\t\t<lib-grid-row-renderer [dadosLinha]=\"dadosLinha\" [config]=\"cfg()\" [colunas]=\"colunasExibir()\"\n\t\t\t[colunasOrdenadas]=\"colunasOrdenadas()\" [lista]=\"lista()!\" [inputSearchText]=\"inputSearchText()\"\n\t\t\t[hasSeletor]=\"hasSeletor()\" [hasVerticalLine]=\"hasVerticalLine()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[hasGrid]=\"hasGrid()\" [rowIndex]=\"i\" (actionTriggered)=\"onClickCellAction($event)\"\n\t\t\t(rowClicked)=\"onClickRow($event)\" [lastRow]=\"$last\">\n\t\t</lib-grid-row-renderer>\n\n\t\t}}\n\n\t\t<!-- POSSIBILIDADES SEM DADOS -->\n\t\t} @empty {\n\n\t\t<!-- ERRO -->\n\t\t@if(cfg().hasError) {\n\t\t<div class=\"table-row table-formated table-errors\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridError]\"></ng-content>\n\t\t</div>\n\n\t\t<!-- LOADING -->\n\t\t} @else if(!cfg().isLoaded) {\n\t\t<div class=\"table-row table-formated table-loader\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridLoading]\"></ng-content>\n\t\t</div>\n\n\t\t} @else {\n\n\t\t<div class=\"table-row table-empty\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<lib-grid-empty-list></lib-grid-empty-list>\n\t\t</div>\n\t\t}\n\n\t\t}\n\n\t\t<!-- FIM DA LINHA NORMAL -->\n\n\n\t</div>\n</div>\n<!-- DESKTOP FIM -->\n}\n\n\n@if(cfg().showPagination){\n<lib-grid-pagination [paginacao]=\"paginacaoSignal()\" [totalPaginas]=\"totalPaginas()\" [performance]=\"performance()\"\n\t[pageSizeOptions]=\"pageSizeOptions()\" [(paginationSize)]=\"paginationSize\" (pageChange)=\"irParaPagina($event)\">\n</lib-grid-pagination>\n}\n\n\n\n\n@if(cfg().showInfoBar){\n<!-- Informa\u00E7\u00F5es de Ordena\u00E7\u00E3o -->\n@if (ordenacoesSignal().length > 0) {\n<div class=\"table-info-row table-styles\">\n\t@if (ordenacoesSignal().length > 0) {\n\t<div>Ordenado por: {{ getOrdenacaoTexto() }}</div>\n\t}\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClickClearInfo()\" icone=\"bi bi-x-lg\"></ui-button>\n</div>\n}\n<!-- Informa\u00E7\u00F5es de Agrupamento -->\n@if (this.isAgrupado()) {\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-object-group\"></i>\n\t<div class=\"flex flex-wrap gap-1 f-t-b\">\n\t\tAgrupado por {{ colAgrupadoAtual()?.titulo }} (h\u00E1 {{ gruposEncontrados.itens.size }} grupos)\n\t\t<div class=\"campoSemForm\">\n\t\t\t<ui-select [value]=\"colAgrupadoAtual()?.prop\" [options]=\"this.colunasKVDefinidas()\"\n\t\t\t\t(changed)=\"onChangedAgrupamento($event)\"></ui-select>\n\t\t</div>\n\n\t</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\"\n\t\ttitle=\"Recolher Todos\"></ui-button>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\"\n\t\ttitle=\"Expandir Todos\"></ui-button>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\ttitle=\"Desagrupar\"></ui-button>\n</div>\n}\n}\n\n\n@if(devMode){\n<!-- MODO DESENVOLVIMENTO -->\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-microscope\"></i>\n\t<div>Fun\u00E7\u00F5es extras</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasGrid()\" (click)=\"onChangeHasGrid()\" icone='bi bi-grid-3x3'\n\t\ttitle=\"Grid\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"isCompacted()\" (click)=\"onChangeCompacted()\"\n\t\ticone='fa fa-arrows-to-circle' title=\"Compactar\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasVerticalLine()\" (click)=\"onChangeLineNumber()\"\n\t\ticone='bi bi-layout-sidebar' title=\"Linha Vertical\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasSeletor()\" (click)=\"onChangeSeletor()\" icone='fa fa-check-double'\n\t\ttitle=\"Seletor\"></ui-button>\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n"], dependencies: [{ kind: "component", type: GridEmptyList, selector: "lib-grid-empty-list" }, { kind: "component", type: UiButton, selector: "ui-button", inputs: ["icone", "iconeAntes", "iconeDepois", "iconeCategory", "disabled", "eventPropagation", "radiusTabFormat", "tabindex", "tipo", "tema", "classes", "ativo"], outputs: ["iconeChange", "iconeAntesChange", "iconeDepoisChange", "iconeCategoryChange", "clicked", "temaChange"] }, { kind: "component", type: UiSelect, selector: "ui-select", inputs: ["value", "options", "name", "placeholder", "disabled", "multiple", "canUnselect", "textEmpty"], outputs: ["valueChange", "changed"] }, { kind: "component", type: UiCheckBox, selector: "ui-check-box", inputs: ["value", "disabled", "focused", "focus", "single", "hasDash"], outputs: ["valueChange", "focusedChange", "changed"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: GridFilterBar, selector: "lib-grid-filter-bar", inputs: ["config", "colunasDefinidas", "colAgrupadoAtual", "isAgrupado", "filterCollapsed"], outputs: ["searchInput", "actionTriggered", "filterToggle", "groupByColumn", "clearGroups", "collapseGroups", "expandGroups"] }, { kind: "component", type: GridPagination, selector: "lib-grid-pagination", inputs: ["paginacao", "totalPaginas", "performance", "pageSizeOptions", "paginationSize"], outputs: ["paginationSizeChange", "pageChange"] }, { kind: "component", type: GridHeaderRow, selector: "lib-grid-header-row", inputs: ["colunas", "ordenacoes", "todosSelecionados", "config", "hasSeletor", "hasVerticalLine", "hasGrid", "isCompacted", "isSelectingAll"], outputs: ["columnSort", "selectAll", "columnResizeStart", "columnResizeDoubleClick"] }, { kind: "component", type: GridRowRenderer, selector: "lib-grid-row-renderer", inputs: ["dadosLinha", "config", "colunas", "colunasOrdenadas", "lista", "inputSearchText", "hasSeletor", "hasVerticalLine", "isCompacted", "hasGrid", "rowIndex", "lastRow"], outputs: ["actionTriggered", "rowClicked"] }, { kind: "component", type: GridCellHandler, selector: "lib-grid-cell-handler", inputs: ["lista", "linha", "config", "localColuna", "localColunas", "inputSearchText"] }, { kind: "component", type: GridCellActions, selector: "lib-grid-cell-actions", inputs: ["config", "dadosDaLinha", "mobileHeader", "compact"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7571
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: MkGrid, isStandalone: true, selector: "lib-mk-grid", inputs: { lista: { classPropertyName: "lista", publicName: "lista", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, filtro: { classPropertyName: "filtro", publicName: "filtro", isSignal: true, isRequired: false, transformFunction: null }, minLineHeight: { classPropertyName: "minLineHeight", publicName: "minLineHeight", isSignal: true, isRequired: false, transformFunction: null }, isCompacted: { classPropertyName: "isCompacted", publicName: "isCompacted", isSignal: true, isRequired: false, transformFunction: null }, hasGrid: { classPropertyName: "hasGrid", publicName: "hasGrid", isSignal: true, isRequired: false, transformFunction: null }, hasVerticalLine: { classPropertyName: "hasVerticalLine", publicName: "hasVerticalLine", isSignal: true, isRequired: false, transformFunction: null }, hasSeletor: { classPropertyName: "hasSeletor", publicName: "hasSeletor", isSignal: true, isRequired: false, transformFunction: null }, paginationSize: { classPropertyName: "paginationSize", publicName: "paginationSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { minLineHeight: "minLineHeightChange", isCompacted: "isCompactedChange", hasGrid: "hasGridChange", hasVerticalLine: "hasVerticalLineChange", hasSeletor: "hasSeletorChange", paginationSize: "paginationSizeChange" }, viewQueries: [{ propertyName: "gridSize", first: true, predicate: ["gridSize"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "gridfiltro", first: true, predicate: ["gridfiltro"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "filterContainer", first: true, predicate: ["filterContainer"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<lib-grid-filter-bar [config]=\"cfg()\" [colunasDefinidas]=\"$any(colunasDefinidas())\"\n\t[colAgrupadoAtual]=\"colAgrupadoAtual()\" [isAgrupado]=\"isAgrupado()\" [filterCollapsed]=\"filtroCollapsed()\"\n\t(searchInput)=\"onInputSearch($event)\" (filterToggle)=\"onClickOpenCloseFilterZone()\"\n\t(actionTriggered)=\"onClickAction($event)\" (groupByColumn)=\"onAgruparPor($any($event))\" (clearGroups)=\"onClearGroups()\"\n\t(collapseGroups)=\"onRecolherGroups()\" (expandGroups)=\"onExpandirGroups()\"\n\t(clickOpcoesListagem)=\"onClickOpcoesListagem()\">\n</lib-grid-filter-bar>\n\n@if(cfg().showFilterBar) {\n<div class=\"table-filter-container table-styles\" [style.--filter-height.px]=\"filterHeight()\">\n\t<div #filterContainer class=\"table-filter-content\" [class.table-filter-hide]=\"filtroCollapsed()\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n}\n\n@if(currentDevice() == \"Mobile\"){\n<!-- MOBILE INICIO -->\n\n@for (dadosLinha of listaExibir(); track $index;let i = $index) {\n@if( dadosLinha.isColapsed !== true){\n\n@if(dadosLinha.isFullLine?.visible){\n<!-- MOBILE GRUPO LINHA PR\u00D3PRIA -->\n<div class=\"table-row-mobile table-formated table-group table-styles\" (click)=\"onClickGroup(dadosLinha)\">\n\t<div>{{ dadosLinha.groupName }}</div>\n\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t<div class=\"table-group-items-ico\">\n\t\t\t<i class=\"bi bi-caret-down\"></i>\n\t\t</div>\n\t</div>\n</div>\n} @else {\n\n<div class=\"table-overflow mobile\" [style.--table-min-height]=\"isCompacted() ? '20px' : minLineHeight()\">\n\t<div class=\"table-table-mobile\" [class.selected]=\"dadosLinha.selecionado\">\n\n\t\t<!-- MOBILE DADOS -->\n\t\t@if(cfg().showActionsLine){\n\t\t<div class=\"table-header-mobile\" [style.gridArea]=\"'auto / auto / auto / span 2'\">\n\t\t\t@if(hasVerticalLine()){\n\t\t\t<!-- MOBILE VERTICAL DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-vertical-line\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t{{ dadosLinha.ordem }}\n\t\t\t</div>\n\t\t\t}\n\t\t\t@if(hasSeletor()){\n\t\t\t<!-- MOBILE SELECTOR DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-item-seletor\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t<ui-check-box [(value)]=\"dadosLinha.selecionado\" [style.--ui-color]=\"'var(--sys-on-primary)'\"\n\t\t\t\t\t[style.--ui-outline]=\"'var(--sys-on-primary)'\" [single]=\"this.cfg().selectionMode == 'single'\"\n\t\t\t\t\t[style.--ui-size]=\"isCompacted() ? '15px' : undefined\"></ui-check-box>\n\t\t\t</div>\n\t\t\t}\n\t\t\t<div class=\"table-header-mobile-space\" (click)=\"onClickRow(dadosLinha)\"></div>\n\t\t\t<lib-grid-cell-actions [config]=\"cfg()\" [dadosDaLinha]=\"dadosLinha\" [mobileHeader]=\"true\"\n\t\t\t\t(action)=\"onClickCellAction($event)\" [compact]=\"isCompacted()\"></lib-grid-cell-actions>\n\t\t</div>\n\t\t}\n\n\t\t<!-- MOBILE LINHA -->\n\t\t@for (localColuna of colunasOrdenadas(); track $index;) {\n\t\t<div class=\"table-header-mobile\" [class.sortable]=\"localColuna.sortable !== false\"\n\t\t\t[class.sorted-asc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'asc'\"\n\t\t\t[class.sorted-desc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'desc'\"\n\t\t\t(click)=\"localColuna.sortable !== false && alternarOrdenacao(localColuna.prop)\" [style]=\"localColuna.styleHeader\">\n\t\t\t<div class=\"table-header-mobile-text\" [title]=\"localColuna.titulo\"\n\t\t\t\t[innerHTML]=\"localColuna.tituloReduzido ?? localColuna.titulo\">\n\t\t\t</div>\n\t\t\t<div class=\"table-header-controls\">\n\t\t\t\t@if (localColuna.sortable !== false) {\n\t\t\t\t<span class=\"table-ico-sort\">\n\t\t\t\t\t@if (obterDirecaoOrdenacao(localColuna.prop) === 'asc') {\n\t\t\t\t\t<i class=\"fa fa-sort-up asc\"></i>\n\t\t\t\t\t} @else if (obterDirecaoOrdenacao(localColuna.prop) === 'desc') {\n\t\t\t\t\t<i class=\"fa fa-sort-down desc\"></i>\n\t\t\t\t\t}\n\t\t\t\t</span>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t\t<lib-grid-cell-handler class=\"table-item-mobile table-formated\" [class.odd]=\"i % 2 !== 0\" [class.even]=\"i % 2 === 0\"\n\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"localColuna\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t[localColunas]=\"colunasOrdenadas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t}\n\t</div>\n</div>\n}\n}\n} @empty {\n<!-- LINHA DE SEM DADOS -->\n<div class=\"table-styles\"><lib-grid-empty-list></lib-grid-empty-list></div>\n}\n<!-- MOBILE FIM -->\n\n\n} @else {\n<!-- DESKTOP INICIO -->\n<div #gridSize class=\"table-overflow\" [class.compacted]=\"isCompacted()\"\n\t[style.--table-min-height]=\"isCompacted() ? '40px' : minLineHeight()\">\n\t<div class=\"table-table\" [class.table-has-vertical-line]=\"hasVerticalLine()\" [class.table-has-seletor]=\"hasSeletor()\"\n\t\tcdkDropList (cdkDropListDropped)=\"onDropColuna($event)\" [cdkDropListData]=\"colunasExibir()\"\n\t\t[style.gridTemplateColumns]=\"`${this.pxVerticalLine()}${this.pxSelector()}` + this.pxColunas() + this.pxActions()\">\n\t\t<!-- DESKTOP HEADER -->\n\t\t<lib-grid-header-row [colunas]=\"colunasExibir()\" [ordenacoes]=\"ordenacoesSignal()\"\n\t\t\t[todosSelecionados]=\"todosSelecionados()\" [config]=\"cfg()\" [hasSeletor]=\"hasSeletor()\"\n\t\t\t[hasVerticalLine]=\"hasVerticalLine()\" [hasGrid]=\"hasGrid()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[isSelectingAll]=\"isSelectingAll()\" (columnSort)=\"alternarOrdenacao($event)\"\n\t\t\t(selectAll)=\"onChangeTodosSelecionados($event)\"\n\t\t\t(columnResizeStart)=\"onResizeStart($event.event, $any($event.coluna))\"\n\t\t\t(columnResizeDoubleClick)=\"onDoubleClickControls($event.event, $any($event.coluna))\">\n\t\t</lib-grid-header-row>\n\n\t\t<!-- DESKTOP LINHAS DE DADOS -->\n\t\t@for (dadosLinha of listaExibir(); track $index; let i = $index) {@if( dadosLinha.isColapsed !== true){\n\n\t\t@if(dadosLinha.isFullLine?.visible){\n\n\t\t<!-- DESKTOP FULL LINE (COLSPAN HORIZONTAL) -->\n\t\t@if(hasVerticalLine()){\n\t\t<!-- DESKTOP HEADER VERTICAL FULL LINE -->\n\t\t<div class=\"table-header table-formated table-vertical-line\">\n\t\t\t{{ dadosLinha.ordem }}\n\t\t</div>\n\t\t}\n\t\t<!-- DESKTOP GRUPO: ROW -->\n\t\t@if(dadosLinha.isGroup){\n\n\t\t<div class=\"table-row table-formated table-group table-border-bottom-card\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<div class=\"table-group-name\" [class.table-inativo]=\"dadosLinha.inativo\">\n\t\t\t\t<lib-grid-cell-handler class=\"table-item table-dados {{ colAgrupadoAtual()?.classeCell }}\"\n\t\t\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"colAgrupadoAtual()!\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t\t\t[localColunas]=\"colunasDefinidas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t\t</div>\n\t\t\t<ui-button tipo=\"nofill\" (click)=\"onClickGroup(dadosLinha)\">\n\t\t\t\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t\t\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t\t\t\t<div class=\"table-group-items-ico\">\n\t\t\t\t\t\t<i [class]=\"dadosLinha.isFullLine?.colapsed ? 'bi bi-caret-down-fill' : 'bi bi-caret-down'\"></i>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</ui-button>\n\t\t</div>\n\n\t\t} @else {\n\t\t<div class=\"table-row table-formated table-others\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\tNada a exibir nesta linha\n\t\t</div>\n\t\t}\n\n\t\t} @else {\n\n\t\t<!-- LINHA NORMAL via GridRowRenderer -->\n\t\t<lib-grid-row-renderer [dadosLinha]=\"dadosLinha\" [config]=\"cfg()\" [colunas]=\"colunasExibir()\"\n\t\t\t[colunasOrdenadas]=\"colunasOrdenadas()\" [lista]=\"lista()!\" [inputSearchText]=\"inputSearchText()\"\n\t\t\t[hasSeletor]=\"hasSeletor()\" [hasVerticalLine]=\"hasVerticalLine()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[hasGrid]=\"hasGrid()\" [rowIndex]=\"i\" (actionTriggered)=\"onClickCellAction($event)\"\n\t\t\t(rowClicked)=\"onClickRow($event)\" [lastRow]=\"$last\">\n\t\t</lib-grid-row-renderer>\n\n\t\t}}\n\n\t\t<!-- POSSIBILIDADES SEM DADOS -->\n\t\t} @empty {\n\n\t\t<!-- ERRO -->\n\t\t@if(cfg().hasError) {\n\t\t<div class=\"table-row table-formated table-errors\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridError]\"></ng-content>\n\t\t</div>\n\n\t\t<!-- LOADING -->\n\t\t} @else if(!cfg().isLoaded) {\n\t\t<div class=\"table-row table-formated table-loader\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridLoading]\"></ng-content>\n\t\t</div>\n\n\t\t} @else {\n\n\t\t<div class=\"table-row table-empty\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<lib-grid-empty-list></lib-grid-empty-list>\n\t\t</div>\n\t\t}\n\n\t\t}\n\n\t\t<!-- FIM DA LINHA NORMAL -->\n\n\n\t</div>\n</div>\n<!-- DESKTOP FIM -->\n}\n\n\n@if(cfg().showPagination){\n<lib-grid-pagination [paginacao]=\"paginacaoSignal()\" [totalPaginas]=\"totalPaginas()\" [performance]=\"performance()\"\n\t[pageSizeOptions]=\"pageSizeOptions()\" [(paginationSize)]=\"paginationSize\" (pageChange)=\"irParaPagina($event)\">\n</lib-grid-pagination>\n}\n\n\n\n\n@if(cfg().showInfoBar){\n<!-- Informa\u00E7\u00F5es de Ordena\u00E7\u00E3o -->\n@if (ordenacoesSignal().length > 0) {\n<div class=\"table-info-row table-styles\">\n\t@if (ordenacoesSignal().length > 0) {\n\t<div>Ordenado por: {{ getOrdenacaoTexto() }}</div>\n\t}\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClickClearInfo()\" icone=\"bi bi-x-lg\"></ui-button>\n</div>\n}\n<!-- Informa\u00E7\u00F5es de Agrupamento -->\n@if (this.isAgrupado()) {\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-object-group\"></i>\n\t<div class=\"flex flex-wrap gap-1 f-t-b\">\n\t\tAgrupado por {{ colAgrupadoAtual()?.titulo }} (h\u00E1 {{ gruposEncontrados.itens.size }} grupos)\n\t\t<div class=\"campoSemForm\">\n\t\t\t<ui-select [value]=\"colAgrupadoAtual()?.prop\" [options]=\"this.colunasKVDefinidas()\"\n\t\t\t\t(changed)=\"onChangedAgrupamento($event)\"></ui-select>\n\t\t</div>\n\n\t</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\"\n\t\ttitle=\"Recolher Todos\"></ui-button>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\"\n\t\ttitle=\"Expandir Todos\"></ui-button>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\ttitle=\"Desagrupar\"></ui-button>\n</div>\n}\n}\n\n\n@if(devMode){\n<!-- MODO DESENVOLVIMENTO -->\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-microscope\"></i>\n\t<div>Fun\u00E7\u00F5es extras</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasGrid()\" (click)=\"onChangeHasGrid()\" icone='bi bi-grid-3x3'\n\t\ttitle=\"Grid\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"isCompacted()\" (click)=\"onChangeCompacted()\"\n\t\ticone='fa fa-arrows-to-circle' title=\"Compactar\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasVerticalLine()\" (click)=\"onChangeLineNumber()\"\n\t\ticone='bi bi-layout-sidebar' title=\"Linha Vertical\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasSeletor()\" (click)=\"onChangeSeletor()\" icone='fa fa-check-double'\n\t\ttitle=\"Seletor\"></ui-button>\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n"], dependencies: [{ kind: "component", type: GridEmptyList, selector: "lib-grid-empty-list" }, { kind: "component", type: UiButton, selector: "ui-button", inputs: ["icone", "iconeAntes", "iconeDepois", "iconeCategory", "disabled", "eventPropagation", "radiusTabFormat", "tabindex", "tipo", "tema", "classes", "ativo"], outputs: ["iconeChange", "iconeAntesChange", "iconeDepoisChange", "iconeCategoryChange", "clicked", "temaChange"] }, { kind: "component", type: UiSelect, selector: "ui-select", inputs: ["value", "options", "name", "placeholder", "disabled", "multiple", "canUnselect", "textEmpty"], outputs: ["valueChange", "changed"] }, { kind: "component", type: UiCheckBox, selector: "ui-check-box", inputs: ["value", "disabled", "focused", "focus", "single", "hasDash"], outputs: ["valueChange", "focusedChange", "changed"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: GridFilterBar, selector: "lib-grid-filter-bar", inputs: ["config", "colunasDefinidas", "colAgrupadoAtual", "isAgrupado", "filterCollapsed"], outputs: ["searchInput", "actionTriggered", "filterToggle", "groupByColumn", "clearGroups", "collapseGroups", "expandGroups", "clickOpcoesListagem"] }, { kind: "component", type: GridPagination, selector: "lib-grid-pagination", inputs: ["paginacao", "totalPaginas", "performance", "pageSizeOptions", "paginationSize"], outputs: ["paginationSizeChange", "pageChange"] }, { kind: "component", type: GridHeaderRow, selector: "lib-grid-header-row", inputs: ["colunas", "ordenacoes", "todosSelecionados", "config", "hasSeletor", "hasVerticalLine", "hasGrid", "isCompacted", "isSelectingAll"], outputs: ["columnSort", "selectAll", "columnResizeStart", "columnResizeDoubleClick"] }, { kind: "component", type: GridRowRenderer, selector: "lib-grid-row-renderer", inputs: ["dadosLinha", "config", "colunas", "colunasOrdenadas", "lista", "inputSearchText", "hasSeletor", "hasVerticalLine", "isCompacted", "hasGrid", "rowIndex", "lastRow"], outputs: ["actionTriggered", "rowClicked"] }, { kind: "component", type: GridCellHandler, selector: "lib-grid-cell-handler", inputs: ["lista", "linha", "config", "localColuna", "localColunas", "inputSearchText"] }, { kind: "component", type: GridCellActions, selector: "lib-grid-cell-actions", inputs: ["config", "dadosDaLinha", "mobileHeader", "compact"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7558
7572
|
}
|
|
7559
7573
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: MkGrid, decorators: [{
|
|
7560
7574
|
type: Component,
|
|
@@ -7570,7 +7584,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
|
|
|
7570
7584
|
GridRowRenderer,
|
|
7571
7585
|
GridCellHandler,
|
|
7572
7586
|
GridCellActions
|
|
7573
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<lib-grid-filter-bar [config]=\"cfg()\" [colunasDefinidas]=\"$any(colunasDefinidas())\"\n\t[colAgrupadoAtual]=\"colAgrupadoAtual()\" [isAgrupado]=\"isAgrupado()\" [filterCollapsed]=\"filtroCollapsed()\"\n\t(searchInput)=\"onInputSearch($event)\" (filterToggle)=\"onClickOpenCloseFilterZone()\"\n\t(actionTriggered)=\"onClickAction($event)\" (groupByColumn)=\"onAgruparPor($any($event))\" (clearGroups)=\"onClearGroups()\"\n\t(collapseGroups)=\"onRecolherGroups()\" (expandGroups)=\"onExpandirGroups()\">\n</lib-grid-filter-bar>\n\n@if(cfg().showFilterBar) {\n<div class=\"table-filter-container table-styles\" [style.--filter-height.px]=\"filterHeight()\">\n\t<div #filterContainer class=\"table-filter-content\" [class.table-filter-hide]=\"filtroCollapsed()\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n}\n\n@if(currentDevice() == \"Mobile\"){\n<!-- MOBILE INICIO -->\n\n@for (dadosLinha of listaExibir(); track $index;let i = $index) {\n@if( dadosLinha.isColapsed !== true){\n\n@if(dadosLinha.isFullLine?.visible){\n<!-- MOBILE GRUPO LINHA PR\u00D3PRIA -->\n<div class=\"table-row-mobile table-formated table-group table-styles\" (click)=\"onClickGroup(dadosLinha)\">\n\t<div>{{ dadosLinha.groupName }}</div>\n\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t<div class=\"table-group-items-ico\">\n\t\t\t<i class=\"bi bi-caret-down\"></i>\n\t\t</div>\n\t</div>\n</div>\n} @else {\n\n<div class=\"table-overflow mobile\" [style.--table-min-height]=\"isCompacted() ? '20px' : minLineHeight()\">\n\t<div class=\"table-table-mobile\" [class.selected]=\"dadosLinha.selecionado\">\n\n\t\t<!-- MOBILE DADOS -->\n\t\t@if(cfg().showActionsLine){\n\t\t<div class=\"table-header-mobile\" [style.gridArea]=\"'auto / auto / auto / span 2'\">\n\t\t\t@if(hasVerticalLine()){\n\t\t\t<!-- MOBILE VERTICAL DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-vertical-line\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t{{ dadosLinha.ordem }}\n\t\t\t</div>\n\t\t\t}\n\t\t\t@if(hasSeletor()){\n\t\t\t<!-- MOBILE SELECTOR DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-item-seletor\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t<ui-check-box [(value)]=\"dadosLinha.selecionado\" [style.--ui-color]=\"'var(--sys-on-primary)'\"\n\t\t\t\t\t[style.--ui-outline]=\"'var(--sys-on-primary)'\" [single]=\"this.cfg().selectionMode == 'single'\"\n\t\t\t\t\t[style.--ui-size]=\"isCompacted() ? '15px' : undefined\"></ui-check-box>\n\t\t\t</div>\n\t\t\t}\n\t\t\t<div class=\"table-header-mobile-space\" (click)=\"onClickRow(dadosLinha)\"></div>\n\t\t\t<lib-grid-cell-actions [config]=\"cfg()\" [dadosDaLinha]=\"dadosLinha\" [mobileHeader]=\"true\"\n\t\t\t\t(action)=\"onClickCellAction($event)\" [compact]=\"isCompacted()\"></lib-grid-cell-actions>\n\t\t</div>\n\t\t}\n\n\t\t<!-- MOBILE LINHA -->\n\t\t@for (localColuna of colunasOrdenadas(); track $index;) {\n\t\t<div class=\"table-header-mobile\" [class.sortable]=\"localColuna.sortable !== false\"\n\t\t\t[class.sorted-asc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'asc'\"\n\t\t\t[class.sorted-desc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'desc'\"\n\t\t\t(click)=\"localColuna.sortable !== false && alternarOrdenacao(localColuna.prop)\" [style]=\"localColuna.styleHeader\">\n\t\t\t<div class=\"table-header-mobile-text\" [title]=\"localColuna.titulo\"\n\t\t\t\t[innerHTML]=\"localColuna.tituloReduzido ?? localColuna.titulo\">\n\t\t\t</div>\n\t\t\t<div class=\"table-header-controls\">\n\t\t\t\t@if (localColuna.sortable !== false) {\n\t\t\t\t<span class=\"table-ico-sort\">\n\t\t\t\t\t@if (obterDirecaoOrdenacao(localColuna.prop) === 'asc') {\n\t\t\t\t\t<i class=\"fa fa-sort-up asc\"></i>\n\t\t\t\t\t} @else if (obterDirecaoOrdenacao(localColuna.prop) === 'desc') {\n\t\t\t\t\t<i class=\"fa fa-sort-down desc\"></i>\n\t\t\t\t\t}\n\t\t\t\t</span>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t\t<lib-grid-cell-handler class=\"table-item-mobile table-formated\" [class.odd]=\"i % 2 !== 0\" [class.even]=\"i % 2 === 0\"\n\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"localColuna\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t[localColunas]=\"colunasOrdenadas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t}\n\t</div>\n</div>\n}\n}\n} @empty {\n<!-- LINHA DE SEM DADOS -->\n<div class=\"table-styles\"><lib-grid-empty-list></lib-grid-empty-list></div>\n}\n<!-- MOBILE FIM -->\n\n\n} @else {\n<!-- DESKTOP INICIO -->\n<div #gridSize class=\"table-overflow\" [class.compacted]=\"isCompacted()\"\n\t[style.--table-min-height]=\"isCompacted() ? '40px' : minLineHeight()\">\n\t<div class=\"table-table\" [class.table-has-vertical-line]=\"hasVerticalLine()\" [class.table-has-seletor]=\"hasSeletor()\"\n\t\tcdkDropList (cdkDropListDropped)=\"onDropColuna($event)\" [cdkDropListData]=\"colunasExibir()\"\n\t\t[style.gridTemplateColumns]=\"`${this.pxVerticalLine()}${this.pxSelector()}` + this.pxColunas() + this.pxActions()\">\n\t\t<!-- DESKTOP HEADER -->\n\t\t<lib-grid-header-row [colunas]=\"colunasExibir()\" [ordenacoes]=\"ordenacoesSignal()\"\n\t\t\t[todosSelecionados]=\"todosSelecionados()\" [config]=\"cfg()\" [hasSeletor]=\"hasSeletor()\"\n\t\t\t[hasVerticalLine]=\"hasVerticalLine()\" [hasGrid]=\"hasGrid()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[isSelectingAll]=\"isSelectingAll()\" (columnSort)=\"alternarOrdenacao($event)\"\n\t\t\t(selectAll)=\"onChangeTodosSelecionados($event)\"\n\t\t\t(columnResizeStart)=\"onResizeStart($event.event, $any($event.coluna))\"\n\t\t\t(columnResizeDoubleClick)=\"onDoubleClickControls($event.event, $any($event.coluna))\">\n\t\t</lib-grid-header-row>\n\n\t\t<!-- DESKTOP LINHAS DE DADOS -->\n\t\t@for (dadosLinha of listaExibir(); track $index; let i = $index) {@if( dadosLinha.isColapsed !== true){\n\n\t\t@if(dadosLinha.isFullLine?.visible){\n\n\t\t<!-- DESKTOP FULL LINE (COLSPAN HORIZONTAL) -->\n\t\t@if(hasVerticalLine()){\n\t\t<!-- DESKTOP HEADER VERTICAL FULL LINE -->\n\t\t<div class=\"table-header table-formated table-vertical-line\">\n\t\t\t{{ dadosLinha.ordem }}\n\t\t</div>\n\t\t}\n\t\t<!-- DESKTOP GRUPO: ROW -->\n\t\t@if(dadosLinha.isGroup){\n\n\t\t<div class=\"table-row table-formated table-group table-border-bottom-card\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<div class=\"table-group-name\" [class.table-inativo]=\"dadosLinha.inativo\">\n\t\t\t\t<lib-grid-cell-handler class=\"table-item table-dados {{ colAgrupadoAtual()?.classeCell }}\"\n\t\t\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"colAgrupadoAtual()!\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t\t\t[localColunas]=\"colunasDefinidas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t\t</div>\n\t\t\t<ui-button tipo=\"nofill\" (click)=\"onClickGroup(dadosLinha)\">\n\t\t\t\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t\t\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t\t\t\t<div class=\"table-group-items-ico\">\n\t\t\t\t\t\t<i [class]=\"dadosLinha.isFullLine?.colapsed ? 'bi bi-caret-down-fill' : 'bi bi-caret-down'\"></i>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</ui-button>\n\t\t</div>\n\n\t\t} @else {\n\t\t<div class=\"table-row table-formated table-others\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\tNada a exibir nesta linha\n\t\t</div>\n\t\t}\n\n\t\t} @else {\n\n\t\t<!-- LINHA NORMAL via GridRowRenderer -->\n\t\t<lib-grid-row-renderer [dadosLinha]=\"dadosLinha\" [config]=\"cfg()\" [colunas]=\"colunasExibir()\"\n\t\t\t[colunasOrdenadas]=\"colunasOrdenadas()\" [lista]=\"lista()!\" [inputSearchText]=\"inputSearchText()\"\n\t\t\t[hasSeletor]=\"hasSeletor()\" [hasVerticalLine]=\"hasVerticalLine()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[hasGrid]=\"hasGrid()\" [rowIndex]=\"i\" (actionTriggered)=\"onClickCellAction($event)\"\n\t\t\t(rowClicked)=\"onClickRow($event)\" [lastRow]=\"$last\">\n\t\t</lib-grid-row-renderer>\n\n\t\t}}\n\n\t\t<!-- POSSIBILIDADES SEM DADOS -->\n\t\t} @empty {\n\n\t\t<!-- ERRO -->\n\t\t@if(cfg().hasError) {\n\t\t<div class=\"table-row table-formated table-errors\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridError]\"></ng-content>\n\t\t</div>\n\n\t\t<!-- LOADING -->\n\t\t} @else if(!cfg().isLoaded) {\n\t\t<div class=\"table-row table-formated table-loader\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridLoading]\"></ng-content>\n\t\t</div>\n\n\t\t} @else {\n\n\t\t<div class=\"table-row table-empty\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<lib-grid-empty-list></lib-grid-empty-list>\n\t\t</div>\n\t\t}\n\n\t\t}\n\n\t\t<!-- FIM DA LINHA NORMAL -->\n\n\n\t</div>\n</div>\n<!-- DESKTOP FIM -->\n}\n\n\n@if(cfg().showPagination){\n<lib-grid-pagination [paginacao]=\"paginacaoSignal()\" [totalPaginas]=\"totalPaginas()\" [performance]=\"performance()\"\n\t[pageSizeOptions]=\"pageSizeOptions()\" [(paginationSize)]=\"paginationSize\" (pageChange)=\"irParaPagina($event)\">\n</lib-grid-pagination>\n}\n\n\n\n\n@if(cfg().showInfoBar){\n<!-- Informa\u00E7\u00F5es de Ordena\u00E7\u00E3o -->\n@if (ordenacoesSignal().length > 0) {\n<div class=\"table-info-row table-styles\">\n\t@if (ordenacoesSignal().length > 0) {\n\t<div>Ordenado por: {{ getOrdenacaoTexto() }}</div>\n\t}\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClickClearInfo()\" icone=\"bi bi-x-lg\"></ui-button>\n</div>\n}\n<!-- Informa\u00E7\u00F5es de Agrupamento -->\n@if (this.isAgrupado()) {\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-object-group\"></i>\n\t<div class=\"flex flex-wrap gap-1 f-t-b\">\n\t\tAgrupado por {{ colAgrupadoAtual()?.titulo }} (h\u00E1 {{ gruposEncontrados.itens.size }} grupos)\n\t\t<div class=\"campoSemForm\">\n\t\t\t<ui-select [value]=\"colAgrupadoAtual()?.prop\" [options]=\"this.colunasKVDefinidas()\"\n\t\t\t\t(changed)=\"onChangedAgrupamento($event)\"></ui-select>\n\t\t</div>\n\n\t</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\"\n\t\ttitle=\"Recolher Todos\"></ui-button>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\"\n\t\ttitle=\"Expandir Todos\"></ui-button>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\ttitle=\"Desagrupar\"></ui-button>\n</div>\n}\n}\n\n\n@if(devMode){\n<!-- MODO DESENVOLVIMENTO -->\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-microscope\"></i>\n\t<div>Fun\u00E7\u00F5es extras</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasGrid()\" (click)=\"onChangeHasGrid()\" icone='bi bi-grid-3x3'\n\t\ttitle=\"Grid\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"isCompacted()\" (click)=\"onChangeCompacted()\"\n\t\ticone='fa fa-arrows-to-circle' title=\"Compactar\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasVerticalLine()\" (click)=\"onChangeLineNumber()\"\n\t\ticone='bi bi-layout-sidebar' title=\"Linha Vertical\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasSeletor()\" (click)=\"onChangeSeletor()\" icone='fa fa-check-double'\n\t\ttitle=\"Seletor\"></ui-button>\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n"] }]
|
|
7587
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<lib-grid-filter-bar [config]=\"cfg()\" [colunasDefinidas]=\"$any(colunasDefinidas())\"\n\t[colAgrupadoAtual]=\"colAgrupadoAtual()\" [isAgrupado]=\"isAgrupado()\" [filterCollapsed]=\"filtroCollapsed()\"\n\t(searchInput)=\"onInputSearch($event)\" (filterToggle)=\"onClickOpenCloseFilterZone()\"\n\t(actionTriggered)=\"onClickAction($event)\" (groupByColumn)=\"onAgruparPor($any($event))\" (clearGroups)=\"onClearGroups()\"\n\t(collapseGroups)=\"onRecolherGroups()\" (expandGroups)=\"onExpandirGroups()\"\n\t(clickOpcoesListagem)=\"onClickOpcoesListagem()\">\n</lib-grid-filter-bar>\n\n@if(cfg().showFilterBar) {\n<div class=\"table-filter-container table-styles\" [style.--filter-height.px]=\"filterHeight()\">\n\t<div #filterContainer class=\"table-filter-content\" [class.table-filter-hide]=\"filtroCollapsed()\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n}\n\n@if(currentDevice() == \"Mobile\"){\n<!-- MOBILE INICIO -->\n\n@for (dadosLinha of listaExibir(); track $index;let i = $index) {\n@if( dadosLinha.isColapsed !== true){\n\n@if(dadosLinha.isFullLine?.visible){\n<!-- MOBILE GRUPO LINHA PR\u00D3PRIA -->\n<div class=\"table-row-mobile table-formated table-group table-styles\" (click)=\"onClickGroup(dadosLinha)\">\n\t<div>{{ dadosLinha.groupName }}</div>\n\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t<div class=\"table-group-items-ico\">\n\t\t\t<i class=\"bi bi-caret-down\"></i>\n\t\t</div>\n\t</div>\n</div>\n} @else {\n\n<div class=\"table-overflow mobile\" [style.--table-min-height]=\"isCompacted() ? '20px' : minLineHeight()\">\n\t<div class=\"table-table-mobile\" [class.selected]=\"dadosLinha.selecionado\">\n\n\t\t<!-- MOBILE DADOS -->\n\t\t@if(cfg().showActionsLine){\n\t\t<div class=\"table-header-mobile\" [style.gridArea]=\"'auto / auto / auto / span 2'\">\n\t\t\t@if(hasVerticalLine()){\n\t\t\t<!-- MOBILE VERTICAL DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-vertical-line\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t{{ dadosLinha.ordem }}\n\t\t\t</div>\n\t\t\t}\n\t\t\t@if(hasSeletor()){\n\t\t\t<!-- MOBILE SELECTOR DIV -->\n\t\t\t<div class=\"table-header-mobile table-formated table-item-seletor\" (click)=\"onClickRow(dadosLinha)\">\n\t\t\t\t<ui-check-box [(value)]=\"dadosLinha.selecionado\" [style.--ui-color]=\"'var(--sys-on-primary)'\"\n\t\t\t\t\t[style.--ui-outline]=\"'var(--sys-on-primary)'\" [single]=\"this.cfg().selectionMode == 'single'\"\n\t\t\t\t\t[style.--ui-size]=\"isCompacted() ? '15px' : undefined\"></ui-check-box>\n\t\t\t</div>\n\t\t\t}\n\t\t\t<div class=\"table-header-mobile-space\" (click)=\"onClickRow(dadosLinha)\"></div>\n\t\t\t<lib-grid-cell-actions [config]=\"cfg()\" [dadosDaLinha]=\"dadosLinha\" [mobileHeader]=\"true\"\n\t\t\t\t(action)=\"onClickCellAction($event)\" [compact]=\"isCompacted()\"></lib-grid-cell-actions>\n\t\t</div>\n\t\t}\n\n\t\t<!-- MOBILE LINHA -->\n\t\t@for (localColuna of colunasOrdenadas(); track $index;) {\n\t\t<div class=\"table-header-mobile\" [class.sortable]=\"localColuna.sortable !== false\"\n\t\t\t[class.sorted-asc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'asc'\"\n\t\t\t[class.sorted-desc]=\"obterDirecaoOrdenacao(localColuna.prop) === 'desc'\"\n\t\t\t(click)=\"localColuna.sortable !== false && alternarOrdenacao(localColuna.prop)\" [style]=\"localColuna.styleHeader\">\n\t\t\t<div class=\"table-header-mobile-text\" [title]=\"localColuna.titulo\"\n\t\t\t\t[innerHTML]=\"localColuna.tituloReduzido ?? localColuna.titulo\">\n\t\t\t</div>\n\t\t\t<div class=\"table-header-controls\">\n\t\t\t\t@if (localColuna.sortable !== false) {\n\t\t\t\t<span class=\"table-ico-sort\">\n\t\t\t\t\t@if (obterDirecaoOrdenacao(localColuna.prop) === 'asc') {\n\t\t\t\t\t<i class=\"fa fa-sort-up asc\"></i>\n\t\t\t\t\t} @else if (obterDirecaoOrdenacao(localColuna.prop) === 'desc') {\n\t\t\t\t\t<i class=\"fa fa-sort-down desc\"></i>\n\t\t\t\t\t}\n\t\t\t\t</span>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t\t<lib-grid-cell-handler class=\"table-item-mobile table-formated\" [class.odd]=\"i % 2 !== 0\" [class.even]=\"i % 2 === 0\"\n\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"localColuna\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t[localColunas]=\"colunasOrdenadas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t}\n\t</div>\n</div>\n}\n}\n} @empty {\n<!-- LINHA DE SEM DADOS -->\n<div class=\"table-styles\"><lib-grid-empty-list></lib-grid-empty-list></div>\n}\n<!-- MOBILE FIM -->\n\n\n} @else {\n<!-- DESKTOP INICIO -->\n<div #gridSize class=\"table-overflow\" [class.compacted]=\"isCompacted()\"\n\t[style.--table-min-height]=\"isCompacted() ? '40px' : minLineHeight()\">\n\t<div class=\"table-table\" [class.table-has-vertical-line]=\"hasVerticalLine()\" [class.table-has-seletor]=\"hasSeletor()\"\n\t\tcdkDropList (cdkDropListDropped)=\"onDropColuna($event)\" [cdkDropListData]=\"colunasExibir()\"\n\t\t[style.gridTemplateColumns]=\"`${this.pxVerticalLine()}${this.pxSelector()}` + this.pxColunas() + this.pxActions()\">\n\t\t<!-- DESKTOP HEADER -->\n\t\t<lib-grid-header-row [colunas]=\"colunasExibir()\" [ordenacoes]=\"ordenacoesSignal()\"\n\t\t\t[todosSelecionados]=\"todosSelecionados()\" [config]=\"cfg()\" [hasSeletor]=\"hasSeletor()\"\n\t\t\t[hasVerticalLine]=\"hasVerticalLine()\" [hasGrid]=\"hasGrid()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[isSelectingAll]=\"isSelectingAll()\" (columnSort)=\"alternarOrdenacao($event)\"\n\t\t\t(selectAll)=\"onChangeTodosSelecionados($event)\"\n\t\t\t(columnResizeStart)=\"onResizeStart($event.event, $any($event.coluna))\"\n\t\t\t(columnResizeDoubleClick)=\"onDoubleClickControls($event.event, $any($event.coluna))\">\n\t\t</lib-grid-header-row>\n\n\t\t<!-- DESKTOP LINHAS DE DADOS -->\n\t\t@for (dadosLinha of listaExibir(); track $index; let i = $index) {@if( dadosLinha.isColapsed !== true){\n\n\t\t@if(dadosLinha.isFullLine?.visible){\n\n\t\t<!-- DESKTOP FULL LINE (COLSPAN HORIZONTAL) -->\n\t\t@if(hasVerticalLine()){\n\t\t<!-- DESKTOP HEADER VERTICAL FULL LINE -->\n\t\t<div class=\"table-header table-formated table-vertical-line\">\n\t\t\t{{ dadosLinha.ordem }}\n\t\t</div>\n\t\t}\n\t\t<!-- DESKTOP GRUPO: ROW -->\n\t\t@if(dadosLinha.isGroup){\n\n\t\t<div class=\"table-row table-formated table-group table-border-bottom-card\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<div class=\"table-group-name\" [class.table-inativo]=\"dadosLinha.inativo\">\n\t\t\t\t<lib-grid-cell-handler class=\"table-item table-dados {{ colAgrupadoAtual()?.classeCell }}\"\n\t\t\t\t\t[linha]=\"dadosLinha.dados\" [localColuna]=\"colAgrupadoAtual()!\" [lista]=\"lista()!\" [config]=\"cfg()\"\n\t\t\t\t\t[localColunas]=\"colunasDefinidas()\" [inputSearchText]=\"inputSearchText()\"></lib-grid-cell-handler>\n\t\t\t</div>\n\t\t\t<ui-button tipo=\"nofill\" (click)=\"onClickGroup(dadosLinha)\">\n\t\t\t\t<div class=\"table-group-items-area\" [class.table-group-collapse]=\"dadosLinha.isFullLine?.colapsed === true\">\n\t\t\t\t\t{{ dadosLinha.isFullLine?.colapsedCount ?? 0 }} item(s)\n\t\t\t\t\t<div class=\"table-group-items-ico\">\n\t\t\t\t\t\t<i [class]=\"dadosLinha.isFullLine?.colapsed ? 'bi bi-caret-down-fill' : 'bi bi-caret-down'\"></i>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</ui-button>\n\t\t</div>\n\n\t\t} @else {\n\t\t<div class=\"table-row table-formated table-others\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\tNada a exibir nesta linha\n\t\t</div>\n\t\t}\n\n\t\t} @else {\n\n\t\t<!-- LINHA NORMAL via GridRowRenderer -->\n\t\t<lib-grid-row-renderer [dadosLinha]=\"dadosLinha\" [config]=\"cfg()\" [colunas]=\"colunasExibir()\"\n\t\t\t[colunasOrdenadas]=\"colunasOrdenadas()\" [lista]=\"lista()!\" [inputSearchText]=\"inputSearchText()\"\n\t\t\t[hasSeletor]=\"hasSeletor()\" [hasVerticalLine]=\"hasVerticalLine()\" [isCompacted]=\"isCompacted()\"\n\t\t\t[hasGrid]=\"hasGrid()\" [rowIndex]=\"i\" (actionTriggered)=\"onClickCellAction($event)\"\n\t\t\t(rowClicked)=\"onClickRow($event)\" [lastRow]=\"$last\">\n\t\t</lib-grid-row-renderer>\n\n\t\t}}\n\n\t\t<!-- POSSIBILIDADES SEM DADOS -->\n\t\t} @empty {\n\n\t\t<!-- ERRO -->\n\t\t@if(cfg().hasError) {\n\t\t<div class=\"table-row table-formated table-errors\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridError]\"></ng-content>\n\t\t</div>\n\n\t\t<!-- LOADING -->\n\t\t} @else if(!cfg().isLoaded) {\n\t\t<div class=\"table-row table-formated table-loader\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<ng-content select=\"[mkGridLoading]\"></ng-content>\n\t\t</div>\n\n\t\t} @else {\n\n\t\t<div class=\"table-row table-empty\"\n\t\t\t[style.gridArea]=\"'auto / auto / auto / span ' + (totalColsVisivel() - (hasVerticalLine() ? 1 : 0))\">\n\t\t\t<lib-grid-empty-list></lib-grid-empty-list>\n\t\t</div>\n\t\t}\n\n\t\t}\n\n\t\t<!-- FIM DA LINHA NORMAL -->\n\n\n\t</div>\n</div>\n<!-- DESKTOP FIM -->\n}\n\n\n@if(cfg().showPagination){\n<lib-grid-pagination [paginacao]=\"paginacaoSignal()\" [totalPaginas]=\"totalPaginas()\" [performance]=\"performance()\"\n\t[pageSizeOptions]=\"pageSizeOptions()\" [(paginationSize)]=\"paginationSize\" (pageChange)=\"irParaPagina($event)\">\n</lib-grid-pagination>\n}\n\n\n\n\n@if(cfg().showInfoBar){\n<!-- Informa\u00E7\u00F5es de Ordena\u00E7\u00E3o -->\n@if (ordenacoesSignal().length > 0) {\n<div class=\"table-info-row table-styles\">\n\t@if (ordenacoesSignal().length > 0) {\n\t<div>Ordenado por: {{ getOrdenacaoTexto() }}</div>\n\t}\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClickClearInfo()\" icone=\"bi bi-x-lg\"></ui-button>\n</div>\n}\n<!-- Informa\u00E7\u00F5es de Agrupamento -->\n@if (this.isAgrupado()) {\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-object-group\"></i>\n\t<div class=\"flex flex-wrap gap-1 f-t-b\">\n\t\tAgrupado por {{ colAgrupadoAtual()?.titulo }} (h\u00E1 {{ gruposEncontrados.itens.size }} grupos)\n\t\t<div class=\"campoSemForm\">\n\t\t\t<ui-select [value]=\"colAgrupadoAtual()?.prop\" [options]=\"this.colunasKVDefinidas()\"\n\t\t\t\t(changed)=\"onChangedAgrupamento($event)\"></ui-select>\n\t\t</div>\n\n\t</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onRecolherGroups()\" icone=\"bi bi-arrows-collapse\"\n\t\ttitle=\"Recolher Todos\"></ui-button>\n\t<ui-button tipo=\"nofill\" tema=\"primary\" (click)=\"onExpandirGroups()\" icone=\"bi bi-arrows-expand\"\n\t\ttitle=\"Expandir Todos\"></ui-button>\n\t<ui-button tipo=\"outlined\" tema=\"primary\" (click)=\"onClearGroups()\" icone=\"fa fa-object-ungroup\"\n\t\ttitle=\"Desagrupar\"></ui-button>\n</div>\n}\n}\n\n\n@if(devMode){\n<!-- MODO DESENVOLVIMENTO -->\n<div class=\"table-info-row table-styles\">\n\t<i class=\"fa fa-microscope\"></i>\n\t<div>Fun\u00E7\u00F5es extras</div>\n\t<div class=\"f-1\"></div>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasGrid()\" (click)=\"onChangeHasGrid()\" icone='bi bi-grid-3x3'\n\t\ttitle=\"Grid\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"isCompacted()\" (click)=\"onChangeCompacted()\"\n\t\ticone='fa fa-arrows-to-circle' title=\"Compactar\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasVerticalLine()\" (click)=\"onChangeLineNumber()\"\n\t\ticone='bi bi-layout-sidebar' title=\"Linha Vertical\"></ui-button>\n\t<ui-button tipo=\"icon\" tema=\"primary\" [ativo]=\"hasSeletor()\" (click)=\"onChangeSeletor()\" icone='fa fa-check-double'\n\t\ttitle=\"Seletor\"></ui-button>\n</div>\n}", styles: [":host{--mk-grid-border-radius: var(--sys-border-radius, 10px);--mk-grid-gap: var(--sys-gap, 8px);--mk-grid-lum-10: var(--sys-lum-10, 95%);--mk-grid-card: var(--sys-card, hsl(216 22% 96%));--mk-grid-background: var(--sys-background, hsl(0 0% 100%));--mk-grid-bg-card: var(--mk-grid-card);--mk-grid-bg: var(--mk-grid-background);--mk-grid-outline: var(--sys-outline, hsl(220 15% 86%));--mk-grid-primary: var(--sys-primary, hsl(224 74% 53%));--mk-grid-on-primary: var(--sys-on-primary, hsl(0 0% 100%));--mk-grid-secondary: var(--sys-secondary, hsl(221 44% 49%));--mk-grid-error: var(--sys-error, hsl(0 66% 47%));--mk-grid-info: var(--sys-info, hsl(210 79% 46%));--mk-grid-high: var(--sys-high, hsl(221 100% 97%));--mk-grid-on-high: var(--sys-on-high, hsl(222 35% 16%));--mk-grid-on-card: var(--sys-on-card, hsl(221 27% 16%));--mk-grid-on-card-variant: var(--sys-on-card-variant, hsl(222 15% 43%));--mk-grid-on-background: var(--sys-on-background, hsl(222 20% 20%));--mk-grid-primary-15: var(--sys-primary-15, hsl(224 74% 53% / 15%))}:host .drag-container{cursor:grab}:host .drag-container:active{cursor:grabbing}:host-context(body:has(.cdk-drag-preview)) .drop-option{outline:1px dashed var(--mk-grid-outline)}:host-context(body:has(.cdk-drag-preview)) .drop-option:hover{outline:1px solid var(--mk-grid-outline);background-color:var(--mk-grid-high)}:host ui-menu>ui-button{border-bottom:1px solid var(--ui-outline-color, var(--mk-grid-outline))}:host .menu-title{font-size:1.2rem;font-weight:600;padding:0 calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2) calc(var(--mk-grid-gap) / 2);border-bottom:1px solid var(--mk-grid-outline);display:flex;justify-content:space-between;align-items:center;gap:var(--mk-grid-gap)}:host .menu-sub-title{font-size:14px;font-weight:500;display:flex;justify-content:flex-start;align-items:center;gap:var(--mk-grid-gap);padding-left:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .menu-sub-value{font-size:14px;font-weight:400;display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--mk-grid-gap) / 2);padding-right:calc(var(--mk-grid-gap) / 2);min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:flex;flex-direction:column}.table-overflow{display:grid;overflow:auto;padding:0;position:relative}.table-overflow.compacted{justify-content:center}.table-overflow.mobile{border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-overflow.mobile{overflow:hidden}.table-table-mobile,.table-table{display:grid;font-size:13px}.table-table-mobile{grid-template-columns:1fr 1fr}.table-header,.table-header-mobile{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);transition:background-color .2s ease;display:flex;flex-wrap:wrap;align-items:center;align-content:stretch;justify-content:center;-webkit-user-select:none;user-select:none;min-height:var(--table-min-height)}.table-header-mobile{padding:0 5px}.table-header-mobile-space{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.table-header-mobile-text,.table-header-text{flex:1;font-weight:600;text-align:center;display:block;align-content:center}.table-header-mobile-text{text-align:start}.table-header-text{height:100%;border-radius:var(--mk-grid-border-radius);position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cdk-drag-preview{font-size:14px!important;background:var(--mk-grid-high);color:var(--mk-grid-on-high);opacity:.6}.cdk-drop-list-receiving:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-info);filter:opacity(.5)}.cdk-drag-placeholder:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--mk-grid-primary)}.textVertical .table-header-text{writing-mode:vertical-lr;text-orientation:upright;letter-spacing:-5px;padding-bottom:5px;text-align:right;align-self:end;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.table-header-controls{width:6px;min-width:6px;max-width:6px;cursor:col-resize;height:100%;display:flex;align-items:center;justify-content:center}.table-ico-sort{font-size:10px;color:color-mix(in srgb,var(--mk-grid-secondary) 50%,var(--mk-grid-on-primary) 50%)}.table-ico-sort .asc{animation:aniSortUp 1s infinite cubic-bezier(.175,.885,.32,1.275)}.table-ico-sort .desc{animation:aniSortDown 1s infinite cubic-bezier(.175,.885,.32,1.275)}@keyframes aniSortUp{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(-3px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes aniSortDown{0%{transform:translateY(0) scale(1)}20%{transform:translateY(0) scale(1)}80%{transform:translateY(3px) scale(1.1)}to{transform:translateY(0) scale(1)}}.table-row,.table-row-mobile{display:flex;justify-content:space-between;align-items:center}.table-row{background:color-mix(in srgb,var(--mk-grid-primary) 10%,var(--mk-grid-background) 90%)}.table-row-mobile{margin-top:10px}.table-group{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2);border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group:has(.table-group-collapse){border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2);border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-group.table-formated{padding-left:10px}.table-group-items-area{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:12px;font-style:italic;color:color-mix(in srgb,var(--mk-grid-on-background) 60%,var(--mk-grid-background) 40%);overflow:hidden}.table-group-items-ico{transition:transform .3s ease;transform:rotate(180deg)}.table-group-name{flex:1;height:100%;display:flex;align-items:center}.table-group-collapse .table-group-items-ico{transition:transform .3s ease;transform:rotate(0);color:color-mix(in srgb,var(--mk-grid-primary) 60%,var(--mk-grid-background) 40%)}.table-formated{min-height:var(--table-min-height);padding:1px 2px;font-size:14px}.table-dados{min-height:var(--table-min-height);padding:1px 2px}.table-item{cursor:pointer}.table-item,.table-header{border-left:0px solid transparent;border-right:0px solid transparent}.table-header:first-child{border-top-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-item.table-item-action.last-row{border-bottom-right-radius:calc(var(--mk-grid-border-radius) / 2)}.header-last-col{border-top-right-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line) .table-item:nth-last-child(-n+1 of div.table-item-seletor){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-table:not(.table-has-vertical-line,.table-has-seletor) .table-dados:nth-last-child(-n+1 of.table-first-col){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header:nth-last-child(-n+1 of div.table-vertical-line){border-bottom-left-radius:calc(var(--mk-grid-border-radius) / 2)}.table-header-mobile.table-vertical-line,.table-header.table-vertical-line,.table-item.table-vertical-line{background:var(--mk-grid-primary);color:var(--mk-grid-on-primary);display:flex;justify-content:center;align-items:center}.table-grupo-seletor,.table-item-seletor{display:flex;justify-content:center;align-items:center}.table-header-mobile.sortable .table-header-text,.table-header.sortable .table-header-text{cursor:pointer;-webkit-user-select:none;user-select:none}.table-header-mobile.sortable:hover,.table-header.sortable:hover,.table-header-mobile.sorted-asc,.table-header-mobile.sorted-desc,.table-header.sorted-asc,.table-header.sorted-desc{background:color-mix(in srgb,var(--mk-grid-secondary) 30%,var(--mk-grid-primary) 70%);color:var(--mk-grid-on-primary)}.table-row.table-errors,.table-row.table-loader{justify-content:center}.table-border-bottom-card{border-bottom:1px solid var(--mk-grid-card)}.table-border-left-darker{border-left:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-right-darker{border-right:1px solid color-mix(in srgb,var(--mk-grid-card) 20%,transparent 80%)}.table-border-left{border-left:1px solid var(--mk-grid-background)}.table-border-right{border-right:1px solid var(--mk-grid-background)}.table-item-mobile,.table-item{transition:background-color .2s cubic-bezier(.075,.82,.165,1);border-bottom:1px solid var(--mk-grid-background);position:relative}.table-item.hashue{background-color:hsl(var(--bghue) 100 var(--mk-grid-lum-10))}.table-item-mobile.odd:before,.table-item.odd:before,.table-item-mobile.even:before,.table-item.even:before,.table-item.table-bg-error:before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;background:var(--mk-grid-background)}.table-item-mobile.odd:before,.table-item.odd:before{opacity:.2}.table-item-mobile.even:before,.table-item.even:before{opacity:.1}.table-item.table-bg-error:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;pointer-events:none;outline-offset:0px;outline:2px solid var(--mk-grid-error);background-color:var(--mk-grid-error);opacity:.04}.table-border-right-error{border-right:1px dashed color-mix(in srgb,var(--mk-grid-error) 50%,transparent 50%)}.table-styles{color:var(--mk-grid-on-card);background:color-mix(in srgb,var(--mk-grid-outline) 20%,var(--mk-grid-card) 80%);border-radius:calc(var(--mk-grid-border-radius) / 2)}.table-show-error{display:flex;justify-content:center;align-items:center;padding:16px;margin-top:10px}.table-topo-container{display:flex;flex-wrap:wrap;align-items:center;font-size:14px;padding:8px;gap:1rem}.table-actions-outside{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px}.table-top-right-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:1}.table-collapse-ico{display:inline-block;line-height:10px;transition:transform .3s;transform-origin:center center;transform:rotate(0)}.table-collapse-ico.ativo{transition:transform .3s ease-in-out;transform:rotate(180deg)}.table-filter-container{overflow:hidden;margin-top:10px;margin-bottom:10px}.table-filter-container:has(.table-filter-hide){pointer-events:none;-webkit-user-select:none;user-select:none;height:0px;margin-bottom:0}.table-filter-content{font-size:14px;padding:8px;overflow:hidden;transition:all .3s cubic-bezier(.075,.82,.165,1);position:relative;opacity:1}.table-filter-content.table-filter-hide{padding:0;opacity:0;margin-top:calc(var(--filter-height, 2000px) * -1);transition:all .3s cubic-bezier(.075,.82,.165,1)}.table-conjunto-actions{position:relative;display:flex;align-items:stretch}.table-conjunto-actions>*{outline:1px solid var(--mk-grid-outline);outline-offset:-1px}.table-conjunto-actions>:first-child{border-radius:var(--mk-grid-border-radius);border-top-right-radius:0;border-bottom-right-radius:0}.table-conjunto-actions>:last-child{border-radius:0 7px 7px 0}.table-conjunto-actions-item{display:flex;align-items:center;justify-content:center;padding:0;min-height:40px}.table-inativo{color:var(--mk-grid-error)}.table-pagination-overflow{display:grid;align-items:center;overflow:auto;margin-top:10px}.table-pagination-overflow.compacted{margin-top:2px;justify-content:center}.table-pagination-container{display:flex;align-items:center;justify-content:space-between;padding:16px;flex-wrap:wrap;gap:16px;flex:1}.table-pagination-overflow.compacted .table-pagination-container{padding:2px 4px;gap:4px}.table-pagination-overflow.compacted.table-has-pages .table-pagination-controls{border-left:1px solid var(--mk-grid-card);border-right:1px solid var(--mk-grid-card)}.table-pagination-info{display:flex;flex-direction:column;color:var(--mk-grid-on-card-variant);font-size:12px}.table-pagination-controls{display:flex;align-items:center;gap:4px}.table-pagination-show{border-radius:var(--mk-grid-border-radius);min-width:47px;min-height:38px;display:flex;justify-content:center;align-items:center;font-size:12px}.table-pagination-per-page{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mk-grid-on-card-variant);flex-wrap:nowrap;white-space:nowrap}.table-pagination-per-page-select{--ui-width: 50px;font-size:12px;text-align:center}.table-performance{font-size:10px;font-style:italic}.compacted .table-pagination-range{display:none}.compacted .table-pagination-totais{font-size:10px}.compacted .table-performance{display:none}.table-empty{display:flex;justify-content:center;align-items:center;padding:16px}.table-info-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;border-left:4px solid var(--mk-grid-primary);padding:12px 16px;margin-top:10px}@media(max-width:768px){.table-pagination-container{flex-direction:column;align-items:stretch;padding:2px}.table-pagination-overflow.compacted .table-pagination-container{padding:0}.table-pagination-controls{justify-content:center}.table-pagination-info{flex-direction:row;justify-content:space-around;gap:10px}.table-pagination-per-page{justify-content:center}}@media(max-width:480px){.table-topo-container{flex-direction:column;align-items:stretch}.table-pagination-container{flex-wrap:wrap;justify-content:space-evenly}.table-small-screen-hide{display:none}}\n"] }]
|
|
7574
7588
|
}], ctorParameters: () => [], propDecorators: { lista: [{ type: i0.Input, args: [{ isSignal: true, alias: "lista", required: true }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], filtro: [{ type: i0.Input, args: [{ isSignal: true, alias: "filtro", required: false }] }], minLineHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minLineHeight", required: false }] }, { type: i0.Output, args: ["minLineHeightChange"] }], isCompacted: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCompacted", required: false }] }, { type: i0.Output, args: ["isCompactedChange"] }], hasGrid: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasGrid", required: false }] }, { type: i0.Output, args: ["hasGridChange"] }], hasVerticalLine: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasVerticalLine", required: false }] }, { type: i0.Output, args: ["hasVerticalLineChange"] }], hasSeletor: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasSeletor", required: false }] }, { type: i0.Output, args: ["hasSeletorChange"] }], gridSize: [{ type: i0.ViewChild, args: ['gridSize', { ...{ read: ElementRef }, isSignal: true }] }], gridfiltro: [{ type: i0.ViewChild, args: ['gridfiltro', { ...{ read: ElementRef }, isSignal: true }] }], paginationSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationSize", required: false }] }, { type: i0.Output, args: ["paginationSizeChange"] }], filterContainer: [{ type: i0.ViewChild, args: ['filterContainer', { ...{ read: ElementRef }, isSignal: true }] }] } });
|
|
7575
7589
|
|
|
7576
7590
|
class GridCell {
|