lib-portal-angular 0.0.33 → 0.0.35
Sign up to get free protection for your applications and to get access to all the features.
- package/esm2022/lib/components/components.module.mjs +28 -14
- package/esm2022/lib/components/confirmation/confirmation.component.mjs +34 -0
- package/esm2022/lib/components/confirmation/confirmation.service.mjs +30 -0
- package/esm2022/lib/components/custom-pagination/custom-pagination.component.mjs +61 -0
- package/esm2022/lib/components/form/form.component.mjs +27 -18
- package/esm2022/lib/components/tables/data-table.component.mjs +173 -0
- package/esm2022/lib/components/tree-node/Itree-node.mjs +2 -0
- package/esm2022/lib/components/tree-node/tree-node.component.mjs +63 -0
- package/esm2022/lib/directive/autofocus-directive/autofocus.directive.mjs +19 -0
- package/esm2022/lib/lib-portal-angular.module.mjs +6 -3
- package/esm2022/public-api.mjs +6 -2
- package/fesm2022/lib-portal-angular.mjs +329 -59
- package/fesm2022/lib-portal-angular.mjs.map +1 -1
- package/lib/components/components.module.d.ts +9 -6
- package/lib/components/confirmation/confirmation.component.d.ts +14 -0
- package/lib/components/confirmation/confirmation.service.d.ts +9 -0
- package/lib/components/custom-pagination/custom-pagination.component.d.ts +17 -0
- package/lib/components/form/form.component.d.ts +8 -2
- package/lib/components/tables/data-table.component.d.ts +56 -0
- package/lib/components/tree-node/Itree-node.d.ts +7 -0
- package/lib/components/tree-node/tree-node.component.d.ts +17 -0
- package/lib/directive/autofocus-directive/autofocus.directive.d.ts +9 -0
- package/package.json +1 -1
- package/public-api.d.ts +5 -1
- package/esm2022/lib/components/tables/bootstrap-table.component.mjs +0 -115
- package/lib/components/tables/bootstrap-table.component.d.ts +0 -33
@@ -1,15 +1,14 @@
|
|
1
1
|
import * as i0 from '@angular/core';
|
2
|
-
import { Component, Input, EventEmitter, ChangeDetectionStrategy, Output, HostListener, forwardRef, ViewChild, NgModule, createComponent, Injectable } from '@angular/core';
|
2
|
+
import { Component, Input, EventEmitter, ChangeDetectionStrategy, Output, HostListener, forwardRef, ViewChild, Directive, NgModule, createComponent, Injectable } from '@angular/core';
|
3
3
|
import * as i1 from '@angular/common';
|
4
4
|
import { CommonModule } from '@angular/common';
|
5
5
|
import * as i2 from '@angular/forms';
|
6
6
|
import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
7
7
|
import hljs from 'highlight.js';
|
8
|
+
import * as i1$1 from '@ng-bootstrap/ng-bootstrap';
|
8
9
|
import { of, Subject } from 'rxjs';
|
9
10
|
import * as i3 from '@ng-select/ng-select';
|
10
11
|
import { NgSelectModule } from '@ng-select/ng-select';
|
11
|
-
import * as i3$1 from 'ngx-pagination';
|
12
|
-
import { NgxPaginationModule } from 'ngx-pagination';
|
13
12
|
|
14
13
|
class AlertComponent {
|
15
14
|
constructor() {
|
@@ -646,14 +645,120 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
646
645
|
args: ['codeElement']
|
647
646
|
}] } });
|
648
647
|
|
648
|
+
class AutofocusDirective {
|
649
|
+
constructor(elementRef) {
|
650
|
+
this.elementRef = elementRef;
|
651
|
+
}
|
652
|
+
ngAfterViewInit() {
|
653
|
+
this.elementRef.nativeElement.focus();
|
654
|
+
}
|
655
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
656
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: AutofocusDirective, selector: "[appAutofocus]", ngImport: i0 }); }
|
657
|
+
}
|
658
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AutofocusDirective, decorators: [{
|
659
|
+
type: Directive,
|
660
|
+
args: [{
|
661
|
+
selector: '[appAutofocus]'
|
662
|
+
}]
|
663
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
|
664
|
+
|
665
|
+
class ConfirmationComponent {
|
666
|
+
constructor(activeModal) {
|
667
|
+
this.activeModal = activeModal;
|
668
|
+
this.title = 'Confirmação';
|
669
|
+
this.message = 'Você tem certeza que deseja continuar?';
|
670
|
+
this.confirmButtonText = 'Sim';
|
671
|
+
this.cancelButtonText = 'Não';
|
672
|
+
}
|
673
|
+
confirm() {
|
674
|
+
this.activeModal.close('confirm');
|
675
|
+
}
|
676
|
+
cancel() {
|
677
|
+
this.activeModal.dismiss('cancel');
|
678
|
+
}
|
679
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationComponent, deps: [{ token: i1$1.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component }); }
|
680
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfirmationComponent, selector: "app-confirmation", inputs: { title: "title", message: "message", confirmButtonText: "confirmButtonText", cancelButtonText: "cancelButtonText" }, ngImport: i0, template: "<div class=\"modal-header\">\n <h5 class=\"modal-title\" id=\"confirmationModalLabel\">{{ title }}</h5>\n</div>\n<div class=\"modal-body\">\n <p>{{ message }}</p>\n</div>\n<div class=\"modal-footer\">\n <button type=\"button\" class=\"btn btn-secondary\" (click)=\"cancel()\">{{ cancelButtonText }}</button>\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"confirm()\" appAutofocus>{{ confirmButtonText }}</button>\n</div>\n", styles: ["@charset \"UTF-8\";.modal-header{background-color:#00444c}.modal-title{font-family:Inter,sans-serif;color:#fff}.modal-body{text-align:center}.modal-body p{color:#666;font-family:Inter,sans-serif;font-size:1.5rem}.modal-footer{background-color:#e9eaeb}.btn-primary{background-color:#00444c;border-color:#00444c;font-family:Inter,sans-serif;transition:opacity .3s,transform .1s}.btn-primary:hover{opacity:.8}.btn-primary:active{transform:scale(.98);background-color:#00444c;border-color:#00444c}.btn-secondary{background-color:#f44336;border-color:#f44336;font-family:Inter,sans-serif;transition:opacity .3s,transform .1s}.btn-secondary:hover{opacity:.8}.btn-secondary:active{transform:scale(.98);background-color:#f44336;border-color:#f44336}\n"], dependencies: [{ kind: "directive", type: AutofocusDirective, selector: "[appAutofocus]" }] }); }
|
681
|
+
}
|
682
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationComponent, decorators: [{
|
683
|
+
type: Component,
|
684
|
+
args: [{ selector: 'app-confirmation', template: "<div class=\"modal-header\">\n <h5 class=\"modal-title\" id=\"confirmationModalLabel\">{{ title }}</h5>\n</div>\n<div class=\"modal-body\">\n <p>{{ message }}</p>\n</div>\n<div class=\"modal-footer\">\n <button type=\"button\" class=\"btn btn-secondary\" (click)=\"cancel()\">{{ cancelButtonText }}</button>\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"confirm()\" appAutofocus>{{ confirmButtonText }}</button>\n</div>\n", styles: ["@charset \"UTF-8\";.modal-header{background-color:#00444c}.modal-title{font-family:Inter,sans-serif;color:#fff}.modal-body{text-align:center}.modal-body p{color:#666;font-family:Inter,sans-serif;font-size:1.5rem}.modal-footer{background-color:#e9eaeb}.btn-primary{background-color:#00444c;border-color:#00444c;font-family:Inter,sans-serif;transition:opacity .3s,transform .1s}.btn-primary:hover{opacity:.8}.btn-primary:active{transform:scale(.98);background-color:#00444c;border-color:#00444c}.btn-secondary{background-color:#f44336;border-color:#f44336;font-family:Inter,sans-serif;transition:opacity .3s,transform .1s}.btn-secondary:hover{opacity:.8}.btn-secondary:active{transform:scale(.98);background-color:#f44336;border-color:#f44336}\n"] }]
|
685
|
+
}], ctorParameters: function () { return [{ type: i1$1.NgbActiveModal }]; }, propDecorators: { title: [{
|
686
|
+
type: Input
|
687
|
+
}], message: [{
|
688
|
+
type: Input
|
689
|
+
}], confirmButtonText: [{
|
690
|
+
type: Input
|
691
|
+
}], cancelButtonText: [{
|
692
|
+
type: Input
|
693
|
+
}] } });
|
694
|
+
|
695
|
+
class CustomPaginationComponent {
|
696
|
+
constructor() {
|
697
|
+
this.totalItems = 0;
|
698
|
+
this.itemsPerPage = 10;
|
699
|
+
this.currentPage = 1;
|
700
|
+
this.maxSize = 5; // Número máximo de botões de página visíveis
|
701
|
+
this.pageText = 'Page'; // Texto para "Page"
|
702
|
+
this.ofText = 'of'; // Texto para "of"
|
703
|
+
this.showPageInfo = true; // Mostrar ou esconder a informação da página
|
704
|
+
this.pageChange = new EventEmitter();
|
705
|
+
}
|
706
|
+
get totalPages() {
|
707
|
+
return Math.ceil(this.totalItems / this.itemsPerPage);
|
708
|
+
}
|
709
|
+
changePage(page) {
|
710
|
+
if (page >= 1 && page <= this.totalPages) {
|
711
|
+
this.currentPage = page;
|
712
|
+
this.pageChange.emit(this.currentPage);
|
713
|
+
}
|
714
|
+
}
|
715
|
+
get pages() {
|
716
|
+
const pages = [];
|
717
|
+
const half = Math.floor(this.maxSize / 2);
|
718
|
+
let start = Math.max(this.currentPage - half, 1);
|
719
|
+
let end = start + this.maxSize - 1;
|
720
|
+
if (end > this.totalPages) {
|
721
|
+
end = this.totalPages;
|
722
|
+
start = Math.max(end - this.maxSize + 1, 1);
|
723
|
+
}
|
724
|
+
for (let i = start; i <= end; i++) {
|
725
|
+
pages.push(i);
|
726
|
+
}
|
727
|
+
return pages;
|
728
|
+
}
|
729
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
730
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CustomPaginationComponent, selector: "custom-pagination", inputs: { totalItems: "totalItems", itemsPerPage: "itemsPerPage", currentPage: "currentPage", maxSize: "maxSize", pageText: "pageText", ofText: "ofText", showPageInfo: "showPageInfo" }, outputs: { pageChange: "pageChange" }, ngImport: i0, template: "<nav *ngIf=\"totalPages > 0\">\n <ul class=\"pagination\">\n <li class=\"page-item\" [class.disabled]=\"currentPage === 1\">\n <a class=\"page-link\" (click)=\"changePage(1)\">««</a>\n </li>\n <li class=\"page-item\" [class.disabled]=\"currentPage === 1\">\n <a class=\"page-link\" (click)=\"changePage(currentPage - 1)\">«</a>\n </li>\n <li class=\"page-item\" *ngFor=\"let page of pages\" [class.active]=\"page === currentPage\">\n <a class=\"page-link\" (click)=\"changePage(page)\">{{ page }}</a>\n </li>\n <li class=\"page-item\" [class.disabled]=\"currentPage === totalPages\">\n <a class=\"page-link\" (click)=\"changePage(currentPage + 1)\">»</a>\n </li>\n <li class=\"page-item\" [class.disabled]=\"currentPage === totalPages\">\n <a class=\"page-link\" (click)=\"changePage(totalPages)\">»»</a>\n </li>\n </ul>\n <div class=\"page-info\" *ngIf=\"showPageInfo\" style=\"font-size: 0.8rem;\">\n {{ pageText }} {{ currentPage }} {{ ofText }} {{ totalPages }}\n </div>\n</nav>\n", styles: [".pagination{display:flex;list-style:none;padding:0;margin:1rem 0;justify-content:center;align-items:center}.page-item{margin:0 .25rem}.page-item.disabled .page-link{cursor:not-allowed;opacity:.5}.page-item.active .page-link{background-color:#00444c;color:#fff}.page-item .page-link{padding:.5rem .75rem;border:1px solid #dee2e6;border-radius:.25rem;text-decoration:none;color:#00444c;cursor:pointer;transition:background-color .2s}.page-item .page-link:hover{background-color:#2ca58d}.page-info{margin-left:1rem;font-size:1rem;color:#00444c;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
731
|
+
}
|
732
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomPaginationComponent, decorators: [{
|
733
|
+
type: Component,
|
734
|
+
args: [{ selector: 'custom-pagination', template: "<nav *ngIf=\"totalPages > 0\">\n <ul class=\"pagination\">\n <li class=\"page-item\" [class.disabled]=\"currentPage === 1\">\n <a class=\"page-link\" (click)=\"changePage(1)\">««</a>\n </li>\n <li class=\"page-item\" [class.disabled]=\"currentPage === 1\">\n <a class=\"page-link\" (click)=\"changePage(currentPage - 1)\">«</a>\n </li>\n <li class=\"page-item\" *ngFor=\"let page of pages\" [class.active]=\"page === currentPage\">\n <a class=\"page-link\" (click)=\"changePage(page)\">{{ page }}</a>\n </li>\n <li class=\"page-item\" [class.disabled]=\"currentPage === totalPages\">\n <a class=\"page-link\" (click)=\"changePage(currentPage + 1)\">»</a>\n </li>\n <li class=\"page-item\" [class.disabled]=\"currentPage === totalPages\">\n <a class=\"page-link\" (click)=\"changePage(totalPages)\">»»</a>\n </li>\n </ul>\n <div class=\"page-info\" *ngIf=\"showPageInfo\" style=\"font-size: 0.8rem;\">\n {{ pageText }} {{ currentPage }} {{ ofText }} {{ totalPages }}\n </div>\n</nav>\n", styles: [".pagination{display:flex;list-style:none;padding:0;margin:1rem 0;justify-content:center;align-items:center}.page-item{margin:0 .25rem}.page-item.disabled .page-link{cursor:not-allowed;opacity:.5}.page-item.active .page-link{background-color:#00444c;color:#fff}.page-item .page-link{padding:.5rem .75rem;border:1px solid #dee2e6;border-radius:.25rem;text-decoration:none;color:#00444c;cursor:pointer;transition:background-color .2s}.page-item .page-link:hover{background-color:#2ca58d}.page-info{margin-left:1rem;font-size:1rem;color:#00444c;font-weight:700}\n"] }]
|
735
|
+
}], propDecorators: { totalItems: [{
|
736
|
+
type: Input
|
737
|
+
}], itemsPerPage: [{
|
738
|
+
type: Input
|
739
|
+
}], currentPage: [{
|
740
|
+
type: Input
|
741
|
+
}], maxSize: [{
|
742
|
+
type: Input
|
743
|
+
}], pageText: [{
|
744
|
+
type: Input
|
745
|
+
}], ofText: [{
|
746
|
+
type: Input
|
747
|
+
}], showPageInfo: [{
|
748
|
+
type: Input
|
749
|
+
}], pageChange: [{
|
750
|
+
type: Output
|
751
|
+
}] } });
|
752
|
+
|
649
753
|
class FormComponent {
|
650
754
|
constructor() {
|
651
755
|
this.cardTitle = 'Default Form Title';
|
652
|
-
this.colClasses = 'col-12'; // Classes de coluna responsiva
|
653
|
-
// Valores de margem dinâmica
|
654
756
|
this.marginTop = 0; // Em rem
|
655
757
|
this.marginLeft = 0; // Em rem
|
656
758
|
this.marginRight = 0; // Em rem
|
759
|
+
this.fontSize = 1.2; // Em rem, equivalente a 42px assumindo 1rem = 16px
|
760
|
+
this.titleAlign = 'left'; // Alinhamento do título
|
761
|
+
this.showSeparator = true; // Mostrar ou esconder a linha separadora
|
657
762
|
}
|
658
763
|
getRowStyles() {
|
659
764
|
return {
|
@@ -662,48 +767,56 @@ class FormComponent {
|
|
662
767
|
'margin-right': `${this.marginRight}rem`
|
663
768
|
};
|
664
769
|
}
|
770
|
+
getTitleStyles() {
|
771
|
+
return {
|
772
|
+
'font-size': `${this.fontSize}rem`,
|
773
|
+
'text-align': this.titleAlign
|
774
|
+
};
|
775
|
+
}
|
665
776
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
666
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormComponent, selector: "sim-app-form", inputs: { cardTitle: "cardTitle",
|
667
|
-
<div class="row" [ngStyle]="getRowStyles()">
|
668
|
-
<div [ngClass]="colClasses">
|
777
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormComponent, selector: "sim-app-form", inputs: { cardTitle: "cardTitle", marginTop: "marginTop", marginLeft: "marginLeft", marginRight: "marginRight", fontSize: "fontSize", titleAlign: "titleAlign", showSeparator: "showSeparator" }, ngImport: i0, template: `
|
778
|
+
<div class="row" [ngStyle]="getRowStyles()">
|
669
779
|
<div class="card">
|
670
|
-
<div class="card-title">
|
780
|
+
<div class="card-title" [ngStyle]="getTitleStyles()">
|
671
781
|
{{ cardTitle }}
|
672
782
|
</div>
|
783
|
+
<div *ngIf="showSeparator" class="separator"></div>
|
673
784
|
<div class="card-content">
|
674
785
|
<ng-content></ng-content>
|
675
786
|
</div>
|
676
|
-
</div>
|
677
|
-
</div>
|
787
|
+
</div>
|
678
788
|
</div>
|
679
|
-
`, isInline: true, styles: [".
|
789
|
+
`, isInline: true, styles: [".card{border:2px solid #ddd;border-radius:.5rem;padding:1rem}.card-title{font-family:Inter;font-weight:400;line-height:1.2;text-align:left;width:100%;margin-bottom:.2rem}.separator{border-bottom:1px solid rgba(0,0,0,.1);margin-top:.2rem;margin-bottom:1rem;width:100%}.card-content{font-family:Inter}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
680
790
|
}
|
681
791
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormComponent, decorators: [{
|
682
792
|
type: Component,
|
683
793
|
args: [{ selector: 'sim-app-form', template: `
|
684
|
-
<div class="row" [ngStyle]="getRowStyles()">
|
685
|
-
<div [ngClass]="colClasses">
|
794
|
+
<div class="row" [ngStyle]="getRowStyles()">
|
686
795
|
<div class="card">
|
687
|
-
<div class="card-title">
|
796
|
+
<div class="card-title" [ngStyle]="getTitleStyles()">
|
688
797
|
{{ cardTitle }}
|
689
798
|
</div>
|
799
|
+
<div *ngIf="showSeparator" class="separator"></div>
|
690
800
|
<div class="card-content">
|
691
801
|
<ng-content></ng-content>
|
692
802
|
</div>
|
693
|
-
</div>
|
694
|
-
</div>
|
803
|
+
</div>
|
695
804
|
</div>
|
696
|
-
`, styles: [".
|
805
|
+
`, styles: [".card{border:2px solid #ddd;border-radius:.5rem;padding:1rem}.card-title{font-family:Inter;font-weight:400;line-height:1.2;text-align:left;width:100%;margin-bottom:.2rem}.separator{border-bottom:1px solid rgba(0,0,0,.1);margin-top:.2rem;margin-bottom:1rem;width:100%}.card-content{font-family:Inter}\n"] }]
|
697
806
|
}], propDecorators: { cardTitle: [{
|
698
807
|
type: Input
|
699
|
-
}], colClasses: [{
|
700
|
-
type: Input
|
701
808
|
}], marginTop: [{
|
702
809
|
type: Input
|
703
810
|
}], marginLeft: [{
|
704
811
|
type: Input
|
705
812
|
}], marginRight: [{
|
706
813
|
type: Input
|
814
|
+
}], fontSize: [{
|
815
|
+
type: Input
|
816
|
+
}], titleAlign: [{
|
817
|
+
type: Input
|
818
|
+
}], showSeparator: [{
|
819
|
+
type: Input
|
707
820
|
}] } });
|
708
821
|
|
709
822
|
class InputComponent {
|
@@ -1273,18 +1386,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1273
1386
|
type: Output
|
1274
1387
|
}] } });
|
1275
1388
|
|
1276
|
-
class
|
1277
|
-
constructor() {
|
1389
|
+
class DataTableComponent {
|
1390
|
+
constructor(cdr) {
|
1391
|
+
this.cdr = cdr;
|
1278
1392
|
this.columns = [];
|
1279
1393
|
this.data = [];
|
1280
1394
|
this.itemsPerPageOptions = [5, 10, 15, 20];
|
1281
1395
|
this.defaultItemsPerPage = 10;
|
1396
|
+
this.itemsPerPageLabel = 'Items per page:';
|
1282
1397
|
this.marginTop = 0;
|
1283
1398
|
this.marginBottom = 0;
|
1284
1399
|
this.marginLeft = 0;
|
1285
1400
|
this.marginRight = 0;
|
1286
1401
|
this.showActionColumn = false;
|
1287
1402
|
this.actionColumnLabel = 'Actions';
|
1403
|
+
this.totalItems = 0;
|
1404
|
+
this.tableFontColor = '#000';
|
1405
|
+
this.tableFontSize = '14px';
|
1406
|
+
this.fetchDataFunction = () => {
|
1407
|
+
return Promise.reject('Implement the fetchDataFunction to fetch paginated data from the back-end.');
|
1408
|
+
}; // Função de busca de dados
|
1409
|
+
this.editPermissions = [];
|
1410
|
+
this.deletePermissions = [];
|
1411
|
+
this.viewPermissions = [];
|
1412
|
+
this.userPermissions = [];
|
1413
|
+
this.showPageInfo = true; // Controle de exibição da informação da página
|
1414
|
+
this.pageText = 'Page'; // Texto para "Page"
|
1415
|
+
this.ofText = 'of'; // Texto para "of"
|
1288
1416
|
this.sortChange = new EventEmitter();
|
1289
1417
|
this.pageChange = new EventEmitter();
|
1290
1418
|
this.itemsPerPageChange = new EventEmitter();
|
@@ -1292,43 +1420,56 @@ class BootstrapTableComponent {
|
|
1292
1420
|
this.onDeleteTable = new EventEmitter();
|
1293
1421
|
this.onViewTable = new EventEmitter();
|
1294
1422
|
this.currentPage = 1;
|
1295
|
-
this.
|
1296
|
-
this.
|
1297
|
-
|
1298
|
-
|
1299
|
-
|
1300
|
-
|
1423
|
+
this.pagedData = [];
|
1424
|
+
this.isLoading = false;
|
1425
|
+
this.labelStyle = {
|
1426
|
+
'font-family': 'Inter, Arial, sans-serif',
|
1427
|
+
'font-size': '14px',
|
1428
|
+
'color': '#000'
|
1301
1429
|
};
|
1302
1430
|
}
|
1303
1431
|
ngOnInit() {
|
1304
|
-
this.
|
1305
|
-
this.
|
1432
|
+
this.fetchData();
|
1433
|
+
this.setDefaultPermissions();
|
1306
1434
|
}
|
1307
1435
|
ngOnChanges(changes) {
|
1308
|
-
if (changes['data']) {
|
1309
|
-
this.
|
1310
|
-
this.updateConfig();
|
1436
|
+
if (changes['totalItems'] || changes['defaultItemsPerPage'] || changes['currentPage'] || changes['data']) {
|
1437
|
+
this.fetchData();
|
1311
1438
|
}
|
1312
1439
|
}
|
1313
|
-
|
1314
|
-
this.
|
1315
|
-
|
1316
|
-
|
1440
|
+
setDefaultPermissions() {
|
1441
|
+
if (!this.userPermissions || this.userPermissions.length === 0) {
|
1442
|
+
this.userPermissions = ['edit', 'delete', 'view'];
|
1443
|
+
}
|
1444
|
+
}
|
1445
|
+
async fetchData() {
|
1446
|
+
if (this.fetchDataFunction) {
|
1447
|
+
this.isLoading = true;
|
1448
|
+
try {
|
1449
|
+
const data = await this.fetchDataFunction(this.currentPage, this.defaultItemsPerPage);
|
1450
|
+
this.pagedData = data.items;
|
1451
|
+
this.totalItems = data.totalItems;
|
1452
|
+
}
|
1453
|
+
finally {
|
1454
|
+
this.isLoading = false;
|
1455
|
+
this.cdr.markForCheck(); // Força a detecção de mudanças
|
1456
|
+
}
|
1457
|
+
}
|
1317
1458
|
}
|
1318
1459
|
onSort(column) {
|
1319
1460
|
this.sortChange.emit(column);
|
1320
1461
|
}
|
1321
1462
|
onPageChange(page) {
|
1322
1463
|
this.currentPage = page;
|
1323
|
-
this.config.currentPage = page;
|
1324
1464
|
this.pageChange.emit(page);
|
1465
|
+
this.fetchData();
|
1325
1466
|
}
|
1326
1467
|
onItemsPerPageChange(event) {
|
1327
1468
|
const itemsPerPage = parseInt(event, 10);
|
1328
1469
|
this.defaultItemsPerPage = itemsPerPage;
|
1329
|
-
this.
|
1470
|
+
this.currentPage = 1;
|
1330
1471
|
this.itemsPerPageChange.emit(itemsPerPage);
|
1331
|
-
this.
|
1472
|
+
this.fetchData();
|
1332
1473
|
}
|
1333
1474
|
handleAction(action, item, index) {
|
1334
1475
|
switch (action) {
|
@@ -1343,13 +1484,19 @@ class BootstrapTableComponent {
|
|
1343
1484
|
break;
|
1344
1485
|
}
|
1345
1486
|
}
|
1346
|
-
|
1347
|
-
|
1487
|
+
hasPermission(requiredPermissions) {
|
1488
|
+
if (!this.userPermissions || this.userPermissions.length === 0) {
|
1489
|
+
return true;
|
1490
|
+
}
|
1491
|
+
return requiredPermissions.every(permission => this.userPermissions.includes(permission));
|
1492
|
+
}
|
1493
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
1494
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataTableComponent, selector: "sim-data-table", inputs: { columns: "columns", data: "data", itemsPerPageOptions: "itemsPerPageOptions", defaultItemsPerPage: "defaultItemsPerPage", itemsPerPageLabel: "itemsPerPageLabel", marginTop: "marginTop", marginBottom: "marginBottom", marginLeft: "marginLeft", marginRight: "marginRight", showActionColumn: "showActionColumn", actionColumnLabel: "actionColumnLabel", totalItems: "totalItems", tableFontColor: "tableFontColor", tableFontSize: "tableFontSize", fetchDataFunction: "fetchDataFunction", editPermissions: "editPermissions", deletePermissions: "deletePermissions", viewPermissions: "viewPermissions", userPermissions: "userPermissions", showPageInfo: "showPageInfo", pageText: "pageText", ofText: "ofText" }, outputs: { sortChange: "sortChange", pageChange: "pageChange", itemsPerPageChange: "itemsPerPageChange", onEditTable: "onEditTable", onDeleteTable: "onDeleteTable", onViewTable: "onViewTable" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"form-group\" [ngStyle]=\"{\n 'margin-top': marginTop + 'rem',\n 'margin-bottom': marginBottom + 'rem',\n 'margin-left': marginLeft + 'rem',\n 'margin-right': marginRight + 'rem'\n}\" style=\"text-align: right;\">\n <label for=\"itemsPerPageSelect\" style=\"margin-right: 0.5rem; margin-bottom: 0.7rem;\" [ngStyle]=\"labelStyle\">{{ itemsPerPageLabel }}</label>\n <select\n id=\"itemsPerPageSelect\"\n class=\"form-control form-control-sm d-inline-block w-auto\"\n [(ngModel)]=\"defaultItemsPerPage\"\n (ngModelChange)=\"onItemsPerPageChange($event)\">\n <option *ngFor=\"let option of itemsPerPageOptions\" [value]=\"option\">{{ option }}</option>\n </select>\n</div>\n\n<div class=\"table-responsive\">\n <table class=\"table table-hover\" [ngStyle]=\"{ 'color': tableFontColor, 'font-size': tableFontSize }\">\n <thead>\n <tr>\n <ng-container *ngFor=\"let column of columns\">\n <th *ngIf=\"hasPermission(column.permissions || [])\" (click)=\"onSort(column.prop)\">\n {{ column.label }}\n </th>\n </ng-container>\n <th *ngIf=\"showActionColumn\">{{ actionColumnLabel }}</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of pagedData; let i = index\">\n <ng-container *ngFor=\"let column of columns\">\n <td *ngIf=\"hasPermission(column.permissions || [])\">\n {{ item[column.prop] }}\n </td>\n </ng-container>\n <td *ngIf=\"showActionColumn\">\n <div class=\"d-flex justify-content-center\">\n <div *ngIf=\"hasPermission(editPermissions)\" (click)=\"handleAction('edit', item, i)\" class=\"btn-icon edit mx-1\"></div>\n <div *ngIf=\"hasPermission(deletePermissions)\" (click)=\"handleAction('delete', item, i)\" class=\"btn-icon delete mx-1\"></div>\n <div *ngIf=\"hasPermission(viewPermissions)\" (click)=\"handleAction('view', item, i)\" class=\"btn-icon view mx-1\"></div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"text-center pagination-controls\">\n <custom-pagination\n [totalItems]=\"totalItems\"\n [itemsPerPage]=\"defaultItemsPerPage\"\n [currentPage]=\"currentPage\"\n [showPageInfo]=\"showPageInfo\"\n [pageText]=\"pageText\"\n [ofText]=\"ofText\"\n (pageChange)=\"onPageChange($event)\">\n </custom-pagination>\n</div>\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap\";:host{font-family:Inter,Arial,sans-serif}.label-style{font-family:Inter,Arial,sans-serif;font-size:14px;color:#000}.table{font-family:Inter,Arial,sans-serif;color:var(--table-font-color, #000);font-size:var(--table-font-size, 14px);border-collapse:separate;border-spacing:0;border-radius:8px;overflow:hidden;border:.13rem solid #00444C}.table thead th{background-color:#00444c;color:#fff;padding:10px;border-bottom:1rem solid rgba(0,68,76,.8);border-right:1rem solid rgba(0,68,76,.8);border-radius:0}.table thead th:last-child{border-right:none}.table tbody td{padding:10px;border-bottom:.1rem solid rgba(0,68,76,.8);border-right:.1rem solid rgba(0,68,76,.8)}.table tbody tr:last-child td{border-bottom:none}.table tbody td:last-child{border-right:none}.table thead th:first-child{border-top-left-radius:0}.table thead th:last-child{border-top-right-radius:0}.table tbody tr:last-child td:first-child{border-bottom-left-radius:8px}.table tbody tr:last-child td:last-child{border-bottom-right-radius:8px}.btn-icon{width:24px;height:24px;background-size:cover;display:inline-block;cursor:pointer;margin-right:16px}.btn-icon.edit{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAABrUlEQVR4nGNgoDI44+PD9b++nona5jLsSC4UupOauvpVVdXLJ4WF128mJkZSzfCdxfViG5dueHtswcr/3/v7wfhxYeF1qvikuLtbbMXG/WduPPvy/+K9t/8PLVwFtuBlZeVLUHBRZHhMdzF3Wk//7XN3Xv27+fzrfxC+dPfNf5BP7qanr6DYcL2CxF2MLj7/oxp7/1+4+wZsCcgnm5Zuersls0KQIsP185N2gwxngOLw+p7/IJ8s37Tv4sbWVnGquJwBCYP4qb199/ImTKDQ8MKEndgM1y9MPOjXWcpLkeFGxYl7GF3pbLjBkHW5/sg1vL47Q8y6JOE0zQwPqEl8h244g6vPf928hH0UGQ4CU2akHbLOjcN0eX7intApWTwUGb6221vn0d7KD5s2VP93LEyAG+5UGn+bYsNBYM/chFlfz7X+B+Etm6r/OxQm/A+oTnpXPyVegmLDMzJcxULDgn883F8PtuDR3oqPs2enHaickEx+wYUMcpKDNps5+P4PDQv+uW9e8sIVfYFGDNQC/xkYGIOD/Z8nxwfujIvzlqaawTBQz8DABMJUNxgKAOk7VoIIOJGlAAAAAElFTkSuQmCC)}.btn-icon.delete{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 viewBox%3D%220%2C0%2C256%2C256%22 width%3D%2224px%22 height%3D%2224px%22%3E%3Cg fill%3D%22%23fb0909%22 fill-rule%3D%22nonzero%22 stroke%3D%22none%22 stroke-width%3D%221%22 stroke-linecap%3D%22butt%22 stroke-linejoin%3D%22miter%22 stroke-miterlimit%3D%2210%22 stroke-dasharray%3D%22%22 stroke-dashoffset%3D%220%22 font-family%3D%22none%22 font-weight%3D%22none%22 font-size%3D%22none%22 text-anchor%3D%22none%22 style%3D%22mix-blend-mode%3A normal%22%3E%3Cg transform%3D%22scale(2%2C2)%22%3E%3Cpath d%3D%22M49%2C1c-1.66%2C0 -3%2C1.34 -3%2C3c0%2C1.66 1.34%2C3 3%2C3h30c1.66%2C0 3%2C-1.34 3%2C-3c0%2C-1.66 -1.34%2C-3 -3%2C-3zM24%2C15c-7.17%2C0 -13%2C5.83 -13%2C13c0%2C7.17 5.83%2C13 13%2C13h77v63c0%2C9.37 -7.63%2C17 -17%2C17h-40c-9.37%2C0 -17%2C-7.63 -17%2C-17v-52c0%2C-1.66 -1.34%2C-3 -3%2C-3c-1.66%2C0 -3%2C1.34 -3%2C3v52c0%2C12.68 10.32%2C23 23%2C23h40c12.68%2C0 23%2C-10.32 23%2C-23v-63.35937c5.72%2C-1.36 10%2C-6.50062 10%2C-12.64062c0%2C-7.17 -5.83%2C-13 -13%2C-13zM24%2C21h80c3.86%2C0 7%2C3.14 7%2C7c0%2C3.86 -3.14%2C7 -7%2C7h-80c-3.86%2C0 -7%2C-3.14 -7%2C-7c0%2C-3.86 3.14%2C-7 7%2C-7zM50%2C55c-1.66%2C0 -3%2C1.34 -3%2C3v46c0%2C1.66 1.34%2C3 3%2C3c1.66%2C0 3%2C-1.34 3%2C-3v-46c0%2C-1.66 -1.34%2C-3 -3%2C-3zM78%2C55c-1.66%2C0 -3%2C1.34 -3%2C3v46c0%2C1.66 1.34%2C3 3%2C3c1.66%2C0 3%2C-1.34 3%2C-3v-46c0%2C-1.66 -1.34%2C-3 -3%2C-3z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\")}.btn-icon.view{background-image:url(data:image/png;base64,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)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CustomPaginationComponent, selector: "custom-pagination", inputs: ["totalItems", "itemsPerPage", "currentPage", "maxSize", "pageText", "ofText", "showPageInfo"], outputs: ["pageChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1348
1495
|
}
|
1349
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type:
|
1496
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataTableComponent, decorators: [{
|
1350
1497
|
type: Component,
|
1351
|
-
args: [{ selector: 'sim-
|
1352
|
-
}], propDecorators: { columns: [{
|
1498
|
+
args: [{ selector: 'sim-data-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-group\" [ngStyle]=\"{\n 'margin-top': marginTop + 'rem',\n 'margin-bottom': marginBottom + 'rem',\n 'margin-left': marginLeft + 'rem',\n 'margin-right': marginRight + 'rem'\n}\" style=\"text-align: right;\">\n <label for=\"itemsPerPageSelect\" style=\"margin-right: 0.5rem; margin-bottom: 0.7rem;\" [ngStyle]=\"labelStyle\">{{ itemsPerPageLabel }}</label>\n <select\n id=\"itemsPerPageSelect\"\n class=\"form-control form-control-sm d-inline-block w-auto\"\n [(ngModel)]=\"defaultItemsPerPage\"\n (ngModelChange)=\"onItemsPerPageChange($event)\">\n <option *ngFor=\"let option of itemsPerPageOptions\" [value]=\"option\">{{ option }}</option>\n </select>\n</div>\n\n<div class=\"table-responsive\">\n <table class=\"table table-hover\" [ngStyle]=\"{ 'color': tableFontColor, 'font-size': tableFontSize }\">\n <thead>\n <tr>\n <ng-container *ngFor=\"let column of columns\">\n <th *ngIf=\"hasPermission(column.permissions || [])\" (click)=\"onSort(column.prop)\">\n {{ column.label }}\n </th>\n </ng-container>\n <th *ngIf=\"showActionColumn\">{{ actionColumnLabel }}</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of pagedData; let i = index\">\n <ng-container *ngFor=\"let column of columns\">\n <td *ngIf=\"hasPermission(column.permissions || [])\">\n {{ item[column.prop] }}\n </td>\n </ng-container>\n <td *ngIf=\"showActionColumn\">\n <div class=\"d-flex justify-content-center\">\n <div *ngIf=\"hasPermission(editPermissions)\" (click)=\"handleAction('edit', item, i)\" class=\"btn-icon edit mx-1\"></div>\n <div *ngIf=\"hasPermission(deletePermissions)\" (click)=\"handleAction('delete', item, i)\" class=\"btn-icon delete mx-1\"></div>\n <div *ngIf=\"hasPermission(viewPermissions)\" (click)=\"handleAction('view', item, i)\" class=\"btn-icon view mx-1\"></div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"text-center pagination-controls\">\n <custom-pagination\n [totalItems]=\"totalItems\"\n [itemsPerPage]=\"defaultItemsPerPage\"\n [currentPage]=\"currentPage\"\n [showPageInfo]=\"showPageInfo\"\n [pageText]=\"pageText\"\n [ofText]=\"ofText\"\n (pageChange)=\"onPageChange($event)\">\n </custom-pagination>\n</div>\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap\";:host{font-family:Inter,Arial,sans-serif}.label-style{font-family:Inter,Arial,sans-serif;font-size:14px;color:#000}.table{font-family:Inter,Arial,sans-serif;color:var(--table-font-color, #000);font-size:var(--table-font-size, 14px);border-collapse:separate;border-spacing:0;border-radius:8px;overflow:hidden;border:.13rem solid #00444C}.table thead th{background-color:#00444c;color:#fff;padding:10px;border-bottom:1rem solid rgba(0,68,76,.8);border-right:1rem solid rgba(0,68,76,.8);border-radius:0}.table thead th:last-child{border-right:none}.table tbody td{padding:10px;border-bottom:.1rem solid rgba(0,68,76,.8);border-right:.1rem solid rgba(0,68,76,.8)}.table tbody tr:last-child td{border-bottom:none}.table tbody td:last-child{border-right:none}.table thead th:first-child{border-top-left-radius:0}.table thead th:last-child{border-top-right-radius:0}.table tbody tr:last-child td:first-child{border-bottom-left-radius:8px}.table tbody tr:last-child td:last-child{border-bottom-right-radius:8px}.btn-icon{width:24px;height:24px;background-size:cover;display:inline-block;cursor:pointer;margin-right:16px}.btn-icon.edit{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAABrUlEQVR4nGNgoDI44+PD9b++nona5jLsSC4UupOauvpVVdXLJ4WF128mJkZSzfCdxfViG5dueHtswcr/3/v7wfhxYeF1qvikuLtbbMXG/WduPPvy/+K9t/8PLVwFtuBlZeVLUHBRZHhMdzF3Wk//7XN3Xv27+fzrfxC+dPfNf5BP7qanr6DYcL2CxF2MLj7/oxp7/1+4+wZsCcgnm5Zuersls0KQIsP185N2gwxngOLw+p7/IJ8s37Tv4sbWVnGquJwBCYP4qb199/ImTKDQ8MKEndgM1y9MPOjXWcpLkeFGxYl7GF3pbLjBkHW5/sg1vL47Q8y6JOE0zQwPqEl8h244g6vPf928hH0UGQ4CU2akHbLOjcN0eX7intApWTwUGb6221vn0d7KD5s2VP93LEyAG+5UGn+bYsNBYM/chFlfz7X+B+Etm6r/OxQm/A+oTnpXPyVegmLDMzJcxULDgn883F8PtuDR3oqPs2enHaickEx+wYUMcpKDNps5+P4PDQv+uW9e8sIVfYFGDNQC/xkYGIOD/Z8nxwfujIvzlqaawTBQz8DABMJUNxgKAOk7VoIIOJGlAAAAAElFTkSuQmCC)}.btn-icon.delete{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 viewBox%3D%220%2C0%2C256%2C256%22 width%3D%2224px%22 height%3D%2224px%22%3E%3Cg fill%3D%22%23fb0909%22 fill-rule%3D%22nonzero%22 stroke%3D%22none%22 stroke-width%3D%221%22 stroke-linecap%3D%22butt%22 stroke-linejoin%3D%22miter%22 stroke-miterlimit%3D%2210%22 stroke-dasharray%3D%22%22 stroke-dashoffset%3D%220%22 font-family%3D%22none%22 font-weight%3D%22none%22 font-size%3D%22none%22 text-anchor%3D%22none%22 style%3D%22mix-blend-mode%3A normal%22%3E%3Cg transform%3D%22scale(2%2C2)%22%3E%3Cpath d%3D%22M49%2C1c-1.66%2C0 -3%2C1.34 -3%2C3c0%2C1.66 1.34%2C3 3%2C3h30c1.66%2C0 3%2C-1.34 3%2C-3c0%2C-1.66 -1.34%2C-3 -3%2C-3zM24%2C15c-7.17%2C0 -13%2C5.83 -13%2C13c0%2C7.17 5.83%2C13 13%2C13h77v63c0%2C9.37 -7.63%2C17 -17%2C17h-40c-9.37%2C0 -17%2C-7.63 -17%2C-17v-52c0%2C-1.66 -1.34%2C-3 -3%2C-3c-1.66%2C0 -3%2C1.34 -3%2C3v52c0%2C12.68 10.32%2C23 23%2C23h40c12.68%2C0 23%2C-10.32 23%2C-23v-63.35937c5.72%2C-1.36 10%2C-6.50062 10%2C-12.64062c0%2C-7.17 -5.83%2C-13 -13%2C-13zM24%2C21h80c3.86%2C0 7%2C3.14 7%2C7c0%2C3.86 -3.14%2C7 -7%2C7h-80c-3.86%2C0 -7%2C-3.14 -7%2C-7c0%2C-3.86 3.14%2C-7 7%2C-7zM50%2C55c-1.66%2C0 -3%2C1.34 -3%2C3v46c0%2C1.66 1.34%2C3 3%2C3c1.66%2C0 3%2C-1.34 3%2C-3v-46c0%2C-1.66 -1.34%2C-3 -3%2C-3zM78%2C55c-1.66%2C0 -3%2C1.34 -3%2C3v46c0%2C1.66 1.34%2C3 3%2C3c1.66%2C0 3%2C-1.34 3%2C-3v-46c0%2C-1.66 -1.34%2C-3 -3%2C-3z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\")}.btn-icon.view{background-image:url(data:image/png;base64,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)}\n"] }]
|
1499
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { columns: [{
|
1353
1500
|
type: Input
|
1354
1501
|
}], data: [{
|
1355
1502
|
type: Input
|
@@ -1357,6 +1504,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1357
1504
|
type: Input
|
1358
1505
|
}], defaultItemsPerPage: [{
|
1359
1506
|
type: Input
|
1507
|
+
}], itemsPerPageLabel: [{
|
1508
|
+
type: Input
|
1360
1509
|
}], marginTop: [{
|
1361
1510
|
type: Input
|
1362
1511
|
}], marginBottom: [{
|
@@ -1369,6 +1518,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1369
1518
|
type: Input
|
1370
1519
|
}], actionColumnLabel: [{
|
1371
1520
|
type: Input
|
1521
|
+
}], totalItems: [{
|
1522
|
+
type: Input
|
1523
|
+
}], tableFontColor: [{
|
1524
|
+
type: Input
|
1525
|
+
}], tableFontSize: [{
|
1526
|
+
type: Input
|
1527
|
+
}], fetchDataFunction: [{
|
1528
|
+
type: Input
|
1529
|
+
}], editPermissions: [{
|
1530
|
+
type: Input
|
1531
|
+
}], deletePermissions: [{
|
1532
|
+
type: Input
|
1533
|
+
}], viewPermissions: [{
|
1534
|
+
type: Input
|
1535
|
+
}], userPermissions: [{
|
1536
|
+
type: Input
|
1537
|
+
}], showPageInfo: [{
|
1538
|
+
type: Input
|
1539
|
+
}], pageText: [{
|
1540
|
+
type: Input
|
1541
|
+
}], ofText: [{
|
1542
|
+
type: Input
|
1372
1543
|
}], sortChange: [{
|
1373
1544
|
type: Output
|
1374
1545
|
}], pageChange: [{
|
@@ -1563,6 +1734,66 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1563
1734
|
type: Output
|
1564
1735
|
}] } });
|
1565
1736
|
|
1737
|
+
class TreeNodeComponent {
|
1738
|
+
constructor() {
|
1739
|
+
this.title = '';
|
1740
|
+
this.nodes = [];
|
1741
|
+
this.isRoot = true;
|
1742
|
+
this.nodeSelected = new EventEmitter();
|
1743
|
+
}
|
1744
|
+
ngOnInit() {
|
1745
|
+
if (this.isRoot && !this.title) {
|
1746
|
+
this.title = 'Tree Node';
|
1747
|
+
}
|
1748
|
+
}
|
1749
|
+
onNodeSelected(node, event) {
|
1750
|
+
node.selected = event.target.checked;
|
1751
|
+
if (node.children) {
|
1752
|
+
this.toggleChildren(node.children, node.selected);
|
1753
|
+
}
|
1754
|
+
this.nodeSelected.emit(node);
|
1755
|
+
}
|
1756
|
+
toggleChildren(children, selected) {
|
1757
|
+
children.forEach(child => {
|
1758
|
+
child.selected = selected;
|
1759
|
+
if (child.children) {
|
1760
|
+
this.toggleChildren(child.children, selected);
|
1761
|
+
}
|
1762
|
+
});
|
1763
|
+
}
|
1764
|
+
onChildNodeSelected(node) {
|
1765
|
+
this.updateParentSelection(this.nodes);
|
1766
|
+
this.nodeSelected.emit(node);
|
1767
|
+
}
|
1768
|
+
updateParentSelection(nodes) {
|
1769
|
+
nodes.forEach(node => {
|
1770
|
+
if (node.children) {
|
1771
|
+
const allChildrenDeselected = node.children.every(child => !child.selected);
|
1772
|
+
node.selected = !allChildrenDeselected;
|
1773
|
+
// Recursive call for nested parents
|
1774
|
+
this.updateParentSelection(node.children);
|
1775
|
+
}
|
1776
|
+
});
|
1777
|
+
}
|
1778
|
+
toggleCollapse(node) {
|
1779
|
+
node.collapsed = !node.collapsed;
|
1780
|
+
}
|
1781
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeNodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
1782
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeNodeComponent, selector: "sim-tree-node", inputs: { title: "title", nodes: "nodes", isRoot: "isRoot" }, outputs: { nodeSelected: "nodeSelected" }, ngImport: i0, template: "<div *ngIf=\"isRoot\" class=\"tree-title\">{{ title || 'Tree Node' }}</div>\n<ul class=\"tree\">\n <li *ngFor=\"let node of nodes\">\n <div class=\"node-content\">\n <span *ngIf=\"node.children\" class=\"toggle-icon\" (click)=\"toggleCollapse(node)\"\n [ngClass]=\"{'collapsed-icon': node.collapsed, 'expanded-icon': !node.collapsed}\">\n {{ node.collapsed ? '\u25B6' : '\u25BC' }}\n </span>\n <label class=\"custom-checkbox\">\n <input type=\"checkbox\" [checked]=\"node.selected\" (change)=\"onNodeSelected(node, $event)\" />\n <span class=\"checkmark\"></span>\n </label>\n <label class=\"node-label\">{{ node.name }}</label>\n </div>\n <sim-tree-node *ngIf=\"node.children && !node.collapsed\" [nodes]=\"node.children\" [isRoot]=\"false\" (nodeSelected)=\"onChildNodeSelected(node)\"></sim-tree-node>\n </li>\n</ul>\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap\";.tree{list-style-type:none;margin:0;padding:0;position:relative;font-family:Inter,sans-serif}.tree li{margin:0;padding:0 0 0 2em;line-height:2em;position:relative;font-size:14px;transition:all .3s ease}.tree li:before{content:\"\";position:absolute;top:0;left:0;border-left:1px solid #ccc;bottom:.75em;transition:border-color .3s ease}.tree li:after{content:\"\";position:absolute;top:1em;left:0;border-top:1px solid #ccc;width:1em;transition:border-color .3s ease}.tree li:last-child:before{height:1em}.node-content{display:flex;align-items:center;color:#333;transition:color .3s ease}.node-content:hover .node-label{color:#00444c;box-shadow:0 4px 8px #0000001a}.toggle-icon{cursor:pointer;margin-right:.5em;font-size:1em;transition:transform .3s ease,color .3s ease}.collapsed-icon{color:orange}.expanded-icon{color:green}.node-content input[type=checkbox]{display:none}.custom-checkbox{position:relative;display:inline-flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.checkmark{position:relative;height:14px;width:14px;background-color:#fff;border:2px solid #00444C;border-radius:3px;transition:background-color .3s ease,border-color .3s ease}.custom-checkbox input:checked+.checkmark{background-color:#00444c;border-color:#00444c;transition:background-color .3s ease,border-color .3s ease}.custom-checkbox .checkmark:after{content:\"\";position:absolute;display:none;left:4px;top:1px;width:3px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .3s ease}.custom-checkbox input:checked+.checkmark:after{display:block}.node-label{margin-left:.5em;transition:color .3s ease,box-shadow .3s ease}.node-content input{margin-right:.5em;transition:transform .3s ease}.tree-title{font-weight:600;margin-bottom:10px;font-size:18px;color:#00444c;transition:color .3s ease}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TreeNodeComponent, selector: "sim-tree-node", inputs: ["title", "nodes", "isRoot"], outputs: ["nodeSelected"] }] }); }
|
1783
|
+
}
|
1784
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeNodeComponent, decorators: [{
|
1785
|
+
type: Component,
|
1786
|
+
args: [{ selector: 'sim-tree-node', template: "<div *ngIf=\"isRoot\" class=\"tree-title\">{{ title || 'Tree Node' }}</div>\n<ul class=\"tree\">\n <li *ngFor=\"let node of nodes\">\n <div class=\"node-content\">\n <span *ngIf=\"node.children\" class=\"toggle-icon\" (click)=\"toggleCollapse(node)\"\n [ngClass]=\"{'collapsed-icon': node.collapsed, 'expanded-icon': !node.collapsed}\">\n {{ node.collapsed ? '\u25B6' : '\u25BC' }}\n </span>\n <label class=\"custom-checkbox\">\n <input type=\"checkbox\" [checked]=\"node.selected\" (change)=\"onNodeSelected(node, $event)\" />\n <span class=\"checkmark\"></span>\n </label>\n <label class=\"node-label\">{{ node.name }}</label>\n </div>\n <sim-tree-node *ngIf=\"node.children && !node.collapsed\" [nodes]=\"node.children\" [isRoot]=\"false\" (nodeSelected)=\"onChildNodeSelected(node)\"></sim-tree-node>\n </li>\n</ul>\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap\";.tree{list-style-type:none;margin:0;padding:0;position:relative;font-family:Inter,sans-serif}.tree li{margin:0;padding:0 0 0 2em;line-height:2em;position:relative;font-size:14px;transition:all .3s ease}.tree li:before{content:\"\";position:absolute;top:0;left:0;border-left:1px solid #ccc;bottom:.75em;transition:border-color .3s ease}.tree li:after{content:\"\";position:absolute;top:1em;left:0;border-top:1px solid #ccc;width:1em;transition:border-color .3s ease}.tree li:last-child:before{height:1em}.node-content{display:flex;align-items:center;color:#333;transition:color .3s ease}.node-content:hover .node-label{color:#00444c;box-shadow:0 4px 8px #0000001a}.toggle-icon{cursor:pointer;margin-right:.5em;font-size:1em;transition:transform .3s ease,color .3s ease}.collapsed-icon{color:orange}.expanded-icon{color:green}.node-content input[type=checkbox]{display:none}.custom-checkbox{position:relative;display:inline-flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.checkmark{position:relative;height:14px;width:14px;background-color:#fff;border:2px solid #00444C;border-radius:3px;transition:background-color .3s ease,border-color .3s ease}.custom-checkbox input:checked+.checkmark{background-color:#00444c;border-color:#00444c;transition:background-color .3s ease,border-color .3s ease}.custom-checkbox .checkmark:after{content:\"\";position:absolute;display:none;left:4px;top:1px;width:3px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .3s ease}.custom-checkbox input:checked+.checkmark:after{display:block}.node-label{margin-left:.5em;transition:color .3s ease,box-shadow .3s ease}.node-content input{margin-right:.5em;transition:transform .3s ease}.tree-title{font-weight:600;margin-bottom:10px;font-size:18px;color:#00444c;transition:color .3s ease}\n"] }]
|
1787
|
+
}], propDecorators: { title: [{
|
1788
|
+
type: Input
|
1789
|
+
}], nodes: [{
|
1790
|
+
type: Input
|
1791
|
+
}], isRoot: [{
|
1792
|
+
type: Input
|
1793
|
+
}], nodeSelected: [{
|
1794
|
+
type: Output
|
1795
|
+
}] } });
|
1796
|
+
|
1566
1797
|
class ComponentsModule {
|
1567
1798
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
1568
1799
|
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: ComponentsModule, declarations: [ButtonComponent,
|
@@ -1574,14 +1805,17 @@ class ComponentsModule {
|
|
1574
1805
|
SelectComponent,
|
1575
1806
|
RadioComponent,
|
1576
1807
|
MultiSelectComponent,
|
1577
|
-
|
1808
|
+
DataTableComponent,
|
1578
1809
|
CodeHighlightComponent,
|
1579
1810
|
BadgeComponent,
|
1580
|
-
AlertComponent
|
1811
|
+
AlertComponent,
|
1812
|
+
ConfirmationComponent,
|
1813
|
+
AutofocusDirective,
|
1814
|
+
CustomPaginationComponent,
|
1815
|
+
TreeNodeComponent], imports: [CommonModule,
|
1581
1816
|
FormsModule,
|
1582
1817
|
ReactiveFormsModule,
|
1583
|
-
NgSelectModule,
|
1584
|
-
NgxPaginationModule], exports: [ButtonComponent,
|
1818
|
+
NgSelectModule], exports: [ButtonComponent,
|
1585
1819
|
CardComponent,
|
1586
1820
|
FormComponent,
|
1587
1821
|
InputComponent,
|
@@ -1593,15 +1827,17 @@ class ComponentsModule {
|
|
1593
1827
|
FormsModule,
|
1594
1828
|
ReactiveFormsModule,
|
1595
1829
|
NgSelectModule,
|
1596
|
-
|
1830
|
+
DataTableComponent,
|
1597
1831
|
CodeHighlightComponent,
|
1598
1832
|
BadgeComponent,
|
1599
|
-
AlertComponent
|
1833
|
+
AlertComponent,
|
1834
|
+
ConfirmationComponent,
|
1835
|
+
CustomPaginationComponent,
|
1836
|
+
TreeNodeComponent] }); }
|
1600
1837
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ComponentsModule, imports: [CommonModule,
|
1601
1838
|
FormsModule,
|
1602
1839
|
ReactiveFormsModule,
|
1603
|
-
NgSelectModule,
|
1604
|
-
NgxPaginationModule, FormsModule,
|
1840
|
+
NgSelectModule, FormsModule,
|
1605
1841
|
ReactiveFormsModule,
|
1606
1842
|
NgSelectModule] }); }
|
1607
1843
|
}
|
@@ -1618,17 +1854,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1618
1854
|
SelectComponent,
|
1619
1855
|
RadioComponent,
|
1620
1856
|
MultiSelectComponent,
|
1621
|
-
|
1857
|
+
DataTableComponent,
|
1622
1858
|
CodeHighlightComponent,
|
1623
1859
|
BadgeComponent,
|
1624
1860
|
AlertComponent,
|
1861
|
+
ConfirmationComponent,
|
1862
|
+
AutofocusDirective,
|
1863
|
+
CustomPaginationComponent,
|
1864
|
+
TreeNodeComponent,
|
1625
1865
|
],
|
1626
1866
|
imports: [
|
1627
1867
|
CommonModule,
|
1628
1868
|
FormsModule,
|
1629
1869
|
ReactiveFormsModule,
|
1630
1870
|
NgSelectModule,
|
1631
|
-
NgxPaginationModule,
|
1632
1871
|
],
|
1633
1872
|
exports: [
|
1634
1873
|
ButtonComponent,
|
@@ -1643,10 +1882,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1643
1882
|
FormsModule,
|
1644
1883
|
ReactiveFormsModule,
|
1645
1884
|
NgSelectModule,
|
1646
|
-
|
1885
|
+
DataTableComponent,
|
1647
1886
|
CodeHighlightComponent,
|
1648
1887
|
BadgeComponent,
|
1649
1888
|
AlertComponent,
|
1889
|
+
ConfirmationComponent,
|
1890
|
+
CustomPaginationComponent,
|
1891
|
+
TreeNodeComponent,
|
1650
1892
|
],
|
1651
1893
|
}]
|
1652
1894
|
}] });
|
@@ -1678,11 +1920,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1678
1920
|
}]
|
1679
1921
|
}], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i0.Injector }]; } });
|
1680
1922
|
|
1923
|
+
class ConfirmationService {
|
1924
|
+
constructor(modalService) {
|
1925
|
+
this.modalService = modalService;
|
1926
|
+
}
|
1927
|
+
confirm(title, message, confirmButtonText = 'Sim', cancelButtonText = 'Não') {
|
1928
|
+
const modalRef = this.modalService.open(ConfirmationComponent, { backdrop: 'static', keyboard: false });
|
1929
|
+
modalRef.componentInstance.title = title;
|
1930
|
+
modalRef.componentInstance.message = message;
|
1931
|
+
modalRef.componentInstance.confirmButtonText = confirmButtonText;
|
1932
|
+
modalRef.componentInstance.cancelButtonText = cancelButtonText;
|
1933
|
+
return modalRef.result.then((result) => {
|
1934
|
+
return result === 'confirm';
|
1935
|
+
}, () => {
|
1936
|
+
return false;
|
1937
|
+
});
|
1938
|
+
}
|
1939
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationService, deps: [{ token: i1$1.NgbModal }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
1940
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationService, providedIn: 'root' }); }
|
1941
|
+
}
|
1942
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationService, decorators: [{
|
1943
|
+
type: Injectable,
|
1944
|
+
args: [{
|
1945
|
+
providedIn: 'root'
|
1946
|
+
}]
|
1947
|
+
}], ctorParameters: function () { return [{ type: i1$1.NgbModal }]; } });
|
1948
|
+
|
1681
1949
|
class LibPortalAngularModule {
|
1682
1950
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LibPortalAngularModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
1683
1951
|
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: LibPortalAngularModule, imports: [ComponentsModule], exports: [ComponentsModule] }); }
|
1684
1952
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LibPortalAngularModule, providers: [
|
1685
|
-
NotificationService
|
1953
|
+
NotificationService,
|
1954
|
+
ConfirmationService
|
1686
1955
|
], imports: [ComponentsModule, ComponentsModule] }); }
|
1687
1956
|
}
|
1688
1957
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LibPortalAngularModule, decorators: [{
|
@@ -1695,7 +1964,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1695
1964
|
ComponentsModule,
|
1696
1965
|
],
|
1697
1966
|
providers: [
|
1698
|
-
NotificationService
|
1967
|
+
NotificationService,
|
1968
|
+
ConfirmationService
|
1699
1969
|
],
|
1700
1970
|
}]
|
1701
1971
|
}] });
|
@@ -1712,5 +1982,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1712
1982
|
* Generated bundle index. Do not edit.
|
1713
1983
|
*/
|
1714
1984
|
|
1715
|
-
export { AlertComponent, BadgeComponent,
|
1985
|
+
export { AlertComponent, BadgeComponent, ButtonClasses, ButtonComponent, CardComponent, CheckboxComponent, CodeHighlightComponent, ComponentsModule, ConfirmationComponent, ConfirmationService, CustomPaginationComponent, DataTableComponent, FormComponent, InputComponent, LibPortalAngularModule, MultiSelectComponent, NotificationService, RadioComponent, SelectComponent, TextareaComponent, TreeNodeComponent };
|
1716
1986
|
//# sourceMappingURL=lib-portal-angular.mjs.map
|