ngx-redi-core 0.0.13 → 1.0.0
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.
- package/RediGrid/ng-package.json +7 -0
- package/RediGrid/public-api.ts +3 -0
- package/RediGrid/src/modules/redi-grid/redi-grid.component.css +101 -0
- package/RediGrid/src/modules/redi-grid/redi-grid.component.html +21 -0
- package/RediGrid/src/modules/redi-grid/redi-grid.component.spec.ts +23 -0
- package/RediGrid/src/modules/redi-grid/redi-grid.component.ts +67 -0
- package/RediGrid/src/modules/redi-grid.module.ts +18 -0
- package/RediTable/ng-package.json +10 -0
- package/RediTable/public-api.ts +3 -0
- package/RediTable/src/modules/redi-table/redi-table.component.css +101 -0
- package/RediTable/src/modules/redi-table/redi-table.component.html +51 -0
- package/RediTable/src/modules/redi-table/redi-table.component.spec.ts +22 -0
- package/RediTable/src/modules/redi-table/redi-table.component.ts +173 -0
- package/RediTable/src/modules/redi-table.module.ts +28 -0
- package/Security/public-api.ts +4 -0
- package/{src/lib/modules/interceptors/secure.interceptor.spec.ts → Security/src/modules/security-web-intercept/interceptors/redi-secure.interceptor.spec.ts} +3 -3
- package/{src/lib/modules/interceptors/secure.interceptor.ts → Security/src/modules/security-web-intercept/interceptors/redi-secure.interceptor.ts} +10 -13
- package/Security/src/modules/security.module.ts +13 -0
- package/index.ts +2 -0
- package/ng-package.json +1 -1
- package/package.json +5 -2
- package/public-api.ts +5 -0
- package/tsconfig.lib.json +1 -4
- package/src/lib/modules/secure/secure.module.ts +0 -27
- package/src/lib/ngx-redi-core.component.spec.ts +0 -23
- package/src/lib/ngx-redi-core.component.ts +0 -15
- package/src/lib/ngx-redi-core.module.ts +0 -16
- package/src/lib/ngx-redi-core.service.spec.ts +0 -16
- package/src/lib/ngx-redi-core.service.ts +0 -9
- package/src/public-api.ts +0 -7
- /package/{src/lib/modules/secure/model → Security/src/modules/security-web-intercept/models}/secure-factory.model.spec.ts +0 -0
- /package/{src/lib/modules/secure/model → Security/src/modules/security-web-intercept/models}/secure-factory.model.ts +0 -0
- /package/{src/lib/modules/secure/model → Security/src/modules/security-web-intercept/models}/tipo-operacion.enum.ts +0 -0
- /package/{src/lib/modules/secure → Security/src/modules/security-web-intercept}/services/cifrado.service.spec.ts +0 -0
- /package/{src/lib/modules/secure → Security/src/modules/security-web-intercept}/services/cifrado.service.ts +0 -0
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
.container {
|
|
2
|
+
border: 1px solid #f4f4f4;
|
|
3
|
+
overflow: auto;
|
|
4
|
+
max-height: 90vh;
|
|
5
|
+
padding: 0px;
|
|
6
|
+
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
thead {
|
|
10
|
+
text-align: center;
|
|
11
|
+
color: #f9f9f9;
|
|
12
|
+
height: 1.9em;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
thead>tr>th {
|
|
16
|
+
border-right: solid 1px white;
|
|
17
|
+
font-weight: 400;
|
|
18
|
+
background-color: #a5a5a5;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
tbody {
|
|
22
|
+
text-align: center;
|
|
23
|
+
cursor: cell;
|
|
24
|
+
color: #717171
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
input {
|
|
28
|
+
text-align: center;
|
|
29
|
+
color: #717171;
|
|
30
|
+
border: none;
|
|
31
|
+
background: transparent;
|
|
32
|
+
outline: 0;
|
|
33
|
+
width: 100%;
|
|
34
|
+
padding: 0px;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
tbody>tr>td:focus-within {
|
|
38
|
+
border: solid 1px #468b51bd;
|
|
39
|
+
background: #9fd0fb6b;
|
|
40
|
+
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
tbody>tr:nth-child(even) {
|
|
44
|
+
background-color: #f4f4f4;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
tbody>tr:hover {
|
|
48
|
+
background-color: #cddce9;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
tbody>tr>td:last-child,
|
|
52
|
+
thead>tr>th:last-child {
|
|
53
|
+
border-right: solid 0px;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
tbody>tr:last-child{
|
|
57
|
+
border-bottom: solid 1px #e1e1e1;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
td {
|
|
61
|
+
padding: 3px;
|
|
62
|
+
height: 1.5em;
|
|
63
|
+
border-right: solid 1px #e1e1e1;
|
|
64
|
+
border-style: groove;
|
|
65
|
+
min-width: 2em;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
table {
|
|
69
|
+
width: 100%;
|
|
70
|
+
-webkit-user-select: none;
|
|
71
|
+
-ms-user-select: none;
|
|
72
|
+
user-select: none;
|
|
73
|
+
overflow: auto;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
thead tr th {
|
|
77
|
+
position: sticky;
|
|
78
|
+
top: 0;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
cdk-virtual-scroll-viewport {
|
|
82
|
+
min-height: 400px;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
::-webkit-scrollbar {
|
|
86
|
+
width: 6px;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
::-webkit-scrollbar-track {
|
|
90
|
+
background: #cccccc;
|
|
91
|
+
margin-top: 2.6em;
|
|
92
|
+
margin-bottom: 1.4em;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
::-webkit-scrollbar-thumb {
|
|
96
|
+
background: #bc2337bf;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
::-webkit-scrollbar-thumb:hover {
|
|
100
|
+
background: #bc2337;
|
|
101
|
+
}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
<div class="container">
|
|
2
|
+
<cdk-virtual-scroll-viewport #scrollViewport itemSize="25">
|
|
3
|
+
<table>
|
|
4
|
+
<thead>
|
|
5
|
+
<tr>
|
|
6
|
+
<th [style.top]="inverseOfTranslation" *ngIf="enumerate">
|
|
7
|
+
<th [style.top]="inverseOfTranslation" *ngFor="let col of dataGrid.cols">{{col.value}}</th>
|
|
8
|
+
</tr>
|
|
9
|
+
</thead>
|
|
10
|
+
<tbody>
|
|
11
|
+
<tr *cdkVirtualFor="let row of dataGrid.rows;let rowNum = index">
|
|
12
|
+
<td *ngIf="enumerate">{{rowNum+1}}</td>
|
|
13
|
+
<td *ngFor="let cell of row; let colNum=index">
|
|
14
|
+
<input *ngIf="editable" type="text" [value]="cell.value" (focusout)="updateData(rowNum,colNum,$event)" />
|
|
15
|
+
{{!editable?cell.value:''}}
|
|
16
|
+
</td>
|
|
17
|
+
</tr>
|
|
18
|
+
</tbody>
|
|
19
|
+
</table>
|
|
20
|
+
</cdk-virtual-scroll-viewport>
|
|
21
|
+
</div>
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
2
|
+
|
|
3
|
+
import { RediGridComponent } from './redi-grid.component';
|
|
4
|
+
|
|
5
|
+
describe('SpreadsheetComponent', () => {
|
|
6
|
+
let component: RediGridComponent;
|
|
7
|
+
let fixture: ComponentFixture<RediGridComponent>;
|
|
8
|
+
|
|
9
|
+
beforeEach(async () => {
|
|
10
|
+
await TestBed.configureTestingModule({
|
|
11
|
+
declarations: [RediGridComponent]
|
|
12
|
+
})
|
|
13
|
+
.compileComponents();
|
|
14
|
+
|
|
15
|
+
fixture = TestBed.createComponent(RediGridComponent);
|
|
16
|
+
component = fixture.componentInstance;
|
|
17
|
+
fixture.detectChanges();
|
|
18
|
+
});
|
|
19
|
+
|
|
20
|
+
it('should create', () => {
|
|
21
|
+
expect(component).toBeTruthy();
|
|
22
|
+
});
|
|
23
|
+
});
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
|
|
2
|
+
import { AfterViewInit, Component, Input, ViewChild } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
@Component({
|
|
5
|
+
selector: 'mf-spreadsheet',
|
|
6
|
+
templateUrl: './redi-grid.component.html',
|
|
7
|
+
styleUrls: ['./redi-grid.component.css']
|
|
8
|
+
})
|
|
9
|
+
export class RediGridComponent implements AfterViewInit {
|
|
10
|
+
@Input()
|
|
11
|
+
dataGrid: DataGrid;
|
|
12
|
+
|
|
13
|
+
@Input()
|
|
14
|
+
enumerate: boolean;
|
|
15
|
+
|
|
16
|
+
@Input()
|
|
17
|
+
editable: boolean;
|
|
18
|
+
|
|
19
|
+
constructor() {
|
|
20
|
+
this.dataGrid = {} as DataGrid;
|
|
21
|
+
this.enumerate = false;
|
|
22
|
+
this.editable = false;
|
|
23
|
+
}
|
|
24
|
+
ngAfterViewInit(): void {
|
|
25
|
+
if (this.dataGrid) {
|
|
26
|
+
this.editable = this.dataGrid.editable || false;
|
|
27
|
+
this.enumerate = this.dataGrid.enumerate || false;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
@ViewChild(CdkVirtualScrollViewport, { static: false })
|
|
32
|
+
public viewPort!: CdkVirtualScrollViewport;
|
|
33
|
+
public get inverseOfTranslation(): string {
|
|
34
|
+
if (!this.viewPort || !this.viewPort["_renderedContentOffset"]) {
|
|
35
|
+
return "-0px";
|
|
36
|
+
}
|
|
37
|
+
let offset = this.viewPort["_renderedContentOffset"];
|
|
38
|
+
return `-${offset}px`;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
updateData(indexRow: number, indexCol: number, event: Event): void {
|
|
42
|
+
if (this.dataGrid && this.dataGrid.rows) {
|
|
43
|
+
let inputControl: HTMLInputElement = event.target as HTMLInputElement;
|
|
44
|
+
this.dataGrid.rows[indexRow][indexCol] = { value: inputControl.value };
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
export interface Cell {
|
|
50
|
+
col?: number;
|
|
51
|
+
row?: number;
|
|
52
|
+
isValid?: boolean;
|
|
53
|
+
maxLength?: number;
|
|
54
|
+
value?: string;
|
|
55
|
+
}
|
|
56
|
+
export interface DataGrid {
|
|
57
|
+
cols: Array<Cell>;
|
|
58
|
+
rows: Array<Array<Cell>>;
|
|
59
|
+
enumerate?: boolean;
|
|
60
|
+
size?: Size;
|
|
61
|
+
editable?: boolean
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
export interface Size {
|
|
65
|
+
width?: number;
|
|
66
|
+
heigth?: number;
|
|
67
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { NgModule } from '@angular/core';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import { RediGridComponent } from './redi-grid/redi-grid.component';
|
|
4
|
+
import { ScrollingModule } from '@angular/cdk/scrolling';
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
@NgModule({
|
|
9
|
+
declarations: [RediGridComponent],
|
|
10
|
+
imports: [
|
|
11
|
+
CommonModule,
|
|
12
|
+
ScrollingModule
|
|
13
|
+
],
|
|
14
|
+
exports:[
|
|
15
|
+
RediGridComponent
|
|
16
|
+
]
|
|
17
|
+
})
|
|
18
|
+
export class RediGridModule { }
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
.container{
|
|
2
|
+
display: grid;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
tbody{
|
|
6
|
+
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.section{
|
|
10
|
+
overflow: auto;
|
|
11
|
+
height: 300px;
|
|
12
|
+
background-color: white;
|
|
13
|
+
max-height: 90vh;
|
|
14
|
+
border: 1px solid #f4f4f4;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
table {
|
|
18
|
+
width: 100%;
|
|
19
|
+
color: #676a6f;
|
|
20
|
+
|
|
21
|
+
overflow: auto;
|
|
22
|
+
|
|
23
|
+
padding: 0px;
|
|
24
|
+
background-color: #f7f7f7;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.odd {
|
|
28
|
+
background-color: #f4f4f4;
|
|
29
|
+
|
|
30
|
+
font-size: 1.05em;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.even {
|
|
34
|
+
background-color: white;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.odd,.even{
|
|
38
|
+
height: 2.5em;
|
|
39
|
+
cursor: pointer;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
td.mat-cell{
|
|
43
|
+
border: 0px;
|
|
44
|
+
color: #676a6f;
|
|
45
|
+
font-size: 1.05em;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.odd:hover,
|
|
49
|
+
.even:hover {
|
|
50
|
+
background-color: #cddce9;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
th{
|
|
54
|
+
font-size: 1.2em;
|
|
55
|
+
}
|
|
56
|
+
tr.mat-header-row{
|
|
57
|
+
height: 2.55em;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
input{
|
|
61
|
+
min-width: 250px;
|
|
62
|
+
border: solid 2px #dadada;
|
|
63
|
+
float: right;
|
|
64
|
+
margin-bottom: 8px;
|
|
65
|
+
outline: 0;
|
|
66
|
+
padding-right: 2em;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
mat-icon{
|
|
70
|
+
float: right;
|
|
71
|
+
margin-left: -3em;
|
|
72
|
+
position: relative;
|
|
73
|
+
color:#676a6f ;
|
|
74
|
+
margin-top: 1px;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.visible{
|
|
78
|
+
display: contents;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.hidden{
|
|
82
|
+
display: none;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
::-webkit-scrollbar {
|
|
86
|
+
width: 6px;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
::-webkit-scrollbar-track {
|
|
90
|
+
background: #cccccc;
|
|
91
|
+
margin-top: 2.6em;
|
|
92
|
+
margin-bottom: 1.4em;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
::-webkit-scrollbar-thumb {
|
|
96
|
+
background: #bc2337bf;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
::-webkit-scrollbar-thumb:hover {
|
|
100
|
+
background: #bc2337;
|
|
101
|
+
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
<div class="container">
|
|
2
|
+
<div *ngIf="enableFilter">
|
|
3
|
+
<mat-icon>search</mat-icon>
|
|
4
|
+
<input placeholder="Filtro" (keyup)="applyFilter($event)" />
|
|
5
|
+
</div>
|
|
6
|
+
<div class="section">
|
|
7
|
+
<table mat-table [dataSource]="dataSource" matSort>
|
|
8
|
+
<ng-container *ngIf="selectRows" matColumnDef="select">
|
|
9
|
+
<th mat-header-cell *matHeaderCellDef>
|
|
10
|
+
<mat-checkbox (change)="$event ? toggleAllRows() : null"
|
|
11
|
+
[checked]="dataTable.selection.hasValue() && isAllSelected()"
|
|
12
|
+
[indeterminate]="dataTable.selection.hasValue() && !isAllSelected()"
|
|
13
|
+
[aria-label]="checkboxLabel()">
|
|
14
|
+
</mat-checkbox>
|
|
15
|
+
</th>
|
|
16
|
+
<td mat-cell *matCellDef="let row">
|
|
17
|
+
<mat-checkbox (click)="$event.stopPropagation()"
|
|
18
|
+
(change)="$event ? dataTable.selection.toggle(row) : null"
|
|
19
|
+
[checked]="dataTable.selection.isSelected(row)" [aria-label]="checkboxLabel(row)">
|
|
20
|
+
</mat-checkbox>
|
|
21
|
+
</td>
|
|
22
|
+
</ng-container>
|
|
23
|
+
|
|
24
|
+
<ng-container>
|
|
25
|
+
<ng-container [matColumnDef]="column.key" *ngFor="let column of colsEntities">
|
|
26
|
+
<th mat-header-cell *matHeaderCellDef mat-sort-header [attr.disabled]="isSortActive()"> {{column.label ||
|
|
27
|
+
column.key}} </th>
|
|
28
|
+
<td mat-cell *matCellDef="let element"> {{element[column.key]}} </td>
|
|
29
|
+
</ng-container>
|
|
30
|
+
</ng-container>
|
|
31
|
+
<ng-container *ngIf="actions" matColumnDef="actions" stickyEnd>
|
|
32
|
+
<th mat-header-cell *matHeaderCellDef aria-label="row actions"> </th>
|
|
33
|
+
<td mat-cell *matCellDef="let element">
|
|
34
|
+
<button mat-icon-button color="primary" *ngFor="let action of dataTable.actions"
|
|
35
|
+
(click)="action.action(element,dataSource)">
|
|
36
|
+
<mat-icon>{{action.icon || 'apps'}}</mat-icon>
|
|
37
|
+
</button>
|
|
38
|
+
</td>
|
|
39
|
+
</ng-container>
|
|
40
|
+
|
|
41
|
+
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky:true"></tr>
|
|
42
|
+
<tr mat-row *matRowDef="let row; columns: displayedColumns;let rowNum = index" [class.odd]="rowNum%2"
|
|
43
|
+
[class.even]="!(rowNum%2)"></tr>
|
|
44
|
+
</table>
|
|
45
|
+
|
|
46
|
+
</div>
|
|
47
|
+
<div [ngClass]="paginateData?'visible':'hidden'">
|
|
48
|
+
<mat-paginator [pageSizeOptions]="[5,10,20,50,100]" showFirstLastButtons aria-label="Seleccione una pagina">
|
|
49
|
+
</mat-paginator>
|
|
50
|
+
</div>
|
|
51
|
+
</div>
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
2
|
+
|
|
3
|
+
import { RediTableComponent } from './redi-table.component';
|
|
4
|
+
|
|
5
|
+
describe('TableComponent', () => {
|
|
6
|
+
let component: RediTableComponent<any>;
|
|
7
|
+
let fixture: ComponentFixture<RediTableComponent<any>>;
|
|
8
|
+
|
|
9
|
+
beforeEach(async () => {
|
|
10
|
+
await TestBed.configureTestingModule({
|
|
11
|
+
declarations: [RediTableComponent]
|
|
12
|
+
})
|
|
13
|
+
.compileComponents();
|
|
14
|
+
fixture = TestBed.createComponent(RediTableComponent);
|
|
15
|
+
component = fixture.componentInstance;
|
|
16
|
+
fixture.detectChanges();
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
it('should create', () => {
|
|
20
|
+
expect(component).toBeTruthy();
|
|
21
|
+
});
|
|
22
|
+
});
|
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
import { SelectionModel } from '@angular/cdk/collections';
|
|
2
|
+
import { AfterViewInit, Component, Input, OnChanges, SimpleChanges, ViewChild } from '@angular/core';
|
|
3
|
+
import { MatPaginator } from '@angular/material/paginator';
|
|
4
|
+
import { MatSort } from '@angular/material/sort';
|
|
5
|
+
import { MatTableDataSource } from '@angular/material/table';
|
|
6
|
+
|
|
7
|
+
@Component({
|
|
8
|
+
selector: 'redi-table',
|
|
9
|
+
templateUrl: './redi-table.component.html',
|
|
10
|
+
styleUrls: ['./redi-table.component.css']
|
|
11
|
+
})
|
|
12
|
+
export class RediTableComponent<T> implements AfterViewInit, OnChanges {
|
|
13
|
+
@Input()
|
|
14
|
+
public selectRows: boolean = false;
|
|
15
|
+
|
|
16
|
+
@Input()
|
|
17
|
+
public enableFilter: boolean = false;
|
|
18
|
+
|
|
19
|
+
@Input()
|
|
20
|
+
public paginateData: boolean = false;
|
|
21
|
+
|
|
22
|
+
@Input()
|
|
23
|
+
public sortData: boolean = false;
|
|
24
|
+
|
|
25
|
+
public actions: boolean = false;
|
|
26
|
+
|
|
27
|
+
@Input()
|
|
28
|
+
public dataTable: DataTable<T>;
|
|
29
|
+
|
|
30
|
+
public dataSource: MatTableDataSource<any>;
|
|
31
|
+
|
|
32
|
+
@ViewChild(MatSort) sort!: MatSort;
|
|
33
|
+
@ViewChild(MatPaginator) paginator!: MatPaginator;
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
constructor() {
|
|
37
|
+
this.dataTable = {} as DataTable<T>;
|
|
38
|
+
this.dataSource = new MatTableDataSource();
|
|
39
|
+
this.dataSource.data = [];
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
ngOnChanges(changes: SimpleChanges): void {
|
|
43
|
+
let changeSelectedRow = changes['selectRows'];
|
|
44
|
+
if (changeSelectedRow) {
|
|
45
|
+
if (changeSelectedRow.currentValue) {
|
|
46
|
+
this.displayedColumns.unshift('select');
|
|
47
|
+
this.dataTable.selection = new SelectionModel<any>(true, [])
|
|
48
|
+
} else {
|
|
49
|
+
const index = this.displayedColumns.indexOf('select');
|
|
50
|
+
if (index > -1) {
|
|
51
|
+
this.displayedColumns.splice(index, 1);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
let changeFilter = changes['enableFilter'];
|
|
57
|
+
if (changeFilter && !changeFilter.currentValue) {
|
|
58
|
+
this.dataSource.filter = '';
|
|
59
|
+
if (this.paginateData) {
|
|
60
|
+
this.dataSource.paginator = this.paginator;
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
this.dataSource.paginator = null;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
let changePagination = changes['paginateData'];
|
|
68
|
+
if (changePagination) {
|
|
69
|
+
if (changePagination.currentValue) {
|
|
70
|
+
this.dataSource.paginator = this.paginator;
|
|
71
|
+
}
|
|
72
|
+
else {
|
|
73
|
+
this.dataSource.paginator = null;
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
displayedColumns: Array<string> = [];
|
|
79
|
+
|
|
80
|
+
colsEntities: Array<ColumnDefinition> = []
|
|
81
|
+
|
|
82
|
+
public applyFilter(event: Event) {
|
|
83
|
+
const filterValue = (event.target as HTMLInputElement).value;
|
|
84
|
+
this.dataSource.filter = filterValue.trim().toLowerCase();
|
|
85
|
+
if (this.dataSource.paginator) {
|
|
86
|
+
this.dataSource.paginator.firstPage();
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
ngAfterViewInit() {
|
|
91
|
+
if (this.dataTable) {
|
|
92
|
+
this.dataSource = new MatTableDataSource(this.dataTable.dataSource);
|
|
93
|
+
|
|
94
|
+
if (this.dataTable.colums &&
|
|
95
|
+
this.dataTable.colums.length > 0) {
|
|
96
|
+
this.colsEntities.push(...this.dataTable.colums);
|
|
97
|
+
}
|
|
98
|
+
else {
|
|
99
|
+
if (this.dataTable.dataSource.length) {
|
|
100
|
+
this.colsEntities.push(...Object.keys(this.dataTable.dataSource[0] as any).map(x => { return { key: x, label: x } as ColumnDefinition }))
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
this.displayedColumns.push(...this.colsEntities.map(item => { return item.key }));
|
|
104
|
+
this.actions = this.dataTable.actions && this.dataTable.actions.length > 0;
|
|
105
|
+
if (this.actions) {
|
|
106
|
+
this.displayedColumns.push('actions')
|
|
107
|
+
}
|
|
108
|
+
this.dataSource.sort = this.sort;
|
|
109
|
+
}
|
|
110
|
+
this.translatePaginator();
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
private translatePaginator() {
|
|
114
|
+
this.paginator._intl.itemsPerPageLabel = 'Elementos por pagina';
|
|
115
|
+
this.paginator._intl.firstPageLabel = 'Primera pagina';
|
|
116
|
+
this.paginator._intl.itemsPerPageLabel = 'Elementos por pagina';
|
|
117
|
+
this.paginator._intl.lastPageLabel = 'Ultima pagina';
|
|
118
|
+
this.paginator._intl.nextPageLabel = 'Siguiente pagina';
|
|
119
|
+
this.paginator._intl.previousPageLabel = 'Pagina anterior';
|
|
120
|
+
this.paginator._intl.getRangeLabel = (page: number, pageSize: number, length: number) => {
|
|
121
|
+
return `Pagina:${page + 1} de ${pageSize <= length ? length / pageSize : 1}`;
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
isSortActive() {
|
|
126
|
+
if (!this.sortData) {
|
|
127
|
+
this.sort.direction = '';
|
|
128
|
+
this.sort
|
|
129
|
+
}
|
|
130
|
+
return !this.sortData
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
toggleAllRows() {
|
|
134
|
+
if (this.isAllSelected()) {
|
|
135
|
+
this.dataTable.selection.clear();
|
|
136
|
+
return;
|
|
137
|
+
}
|
|
138
|
+
this.dataTable.selection.select(...this.dataSource.data);
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
isAllSelected() {
|
|
142
|
+
const numSelected = this.dataTable.selection.selected.length;
|
|
143
|
+
const numRows = this.dataSource.data.length;
|
|
144
|
+
return numSelected === numRows;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
checkboxLabel(row?: any): string {
|
|
148
|
+
if (!row) {
|
|
149
|
+
return `${this.isAllSelected() ? 'deselect' : 'select'} all`;
|
|
150
|
+
}
|
|
151
|
+
return `${this.dataTable.selection.isSelected(row) ? 'deselect' : 'select'} row ${row.position + 1}`;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
export interface DataTable<T> {
|
|
157
|
+
dataSource: Array<T>;
|
|
158
|
+
colums: Array<ColumnDefinition>;
|
|
159
|
+
actions: Array<RowAction>;
|
|
160
|
+
selection: SelectionModel<T>;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
export type fnRowAction = (itemRow?: any, dataSource?: MatTableDataSource<any>) => {};
|
|
164
|
+
|
|
165
|
+
export interface RowAction {
|
|
166
|
+
icon: string;
|
|
167
|
+
action: fnRowAction;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
export interface ColumnDefinition {
|
|
171
|
+
label: string;
|
|
172
|
+
key: string;
|
|
173
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { NgModule } from '@angular/core';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
import { MatPaginatorModule } from '@angular/material/paginator';
|
|
6
|
+
import { MatIconModule } from '@angular/material/icon';
|
|
7
|
+
import { MatTableModule } from '@angular/material/table'
|
|
8
|
+
import { ScrollingModule } from '@angular/cdk/scrolling';
|
|
9
|
+
import { MatCheckboxModule } from '@angular/material/checkbox'
|
|
10
|
+
import { RediTableComponent } from './redi-table/redi-table.component';
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
@NgModule({
|
|
15
|
+
declarations: [RediTableComponent],
|
|
16
|
+
imports: [
|
|
17
|
+
CommonModule,
|
|
18
|
+
MatPaginatorModule,
|
|
19
|
+
MatIconModule,
|
|
20
|
+
MatTableModule,
|
|
21
|
+
ScrollingModule,
|
|
22
|
+
MatCheckboxModule
|
|
23
|
+
],
|
|
24
|
+
exports: [
|
|
25
|
+
RediTableComponent
|
|
26
|
+
]
|
|
27
|
+
})
|
|
28
|
+
export class RediTableModule { }
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export * from "./src/modules/security.module";
|
|
2
|
+
export * from "./src/modules/security-web-intercept/interceptors/redi-secure.interceptor"
|
|
3
|
+
export * from "./src/modules/security-web-intercept/models/secure-factory.model"
|
|
4
|
+
export * from "./src/modules/security-web-intercept/services/cifrado.service"
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { TestBed } from '@angular/core/testing';
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import { RediSecureInterceptor } from './redi-secure.interceptor';
|
|
4
4
|
|
|
5
5
|
describe('SecureInterceptor', () => {
|
|
6
6
|
beforeEach(() => TestBed.configureTestingModule({
|
|
7
7
|
providers: [
|
|
8
|
-
|
|
8
|
+
RediSecureInterceptor
|
|
9
9
|
]
|
|
10
10
|
}));
|
|
11
11
|
|
|
12
12
|
it('should be created', () => {
|
|
13
|
-
const interceptor:
|
|
13
|
+
const interceptor: RediSecureInterceptor = TestBed.inject(RediSecureInterceptor);
|
|
14
14
|
expect(interceptor).toBeTruthy();
|
|
15
15
|
});
|
|
16
16
|
});
|
|
@@ -10,8 +10,8 @@ import {
|
|
|
10
10
|
} from '@angular/common/http';
|
|
11
11
|
import { Observable } from 'rxjs';
|
|
12
12
|
import { map } from 'rxjs/operators';
|
|
13
|
-
import { CifradoService } from '../
|
|
14
|
-
import { TOKEN_SECURE } from '../
|
|
13
|
+
import { CifradoService } from '../services/cifrado.service';
|
|
14
|
+
import { TOKEN_SECURE } from '../models/secure-factory.model';
|
|
15
15
|
|
|
16
16
|
/** Request token para el contexto Http */
|
|
17
17
|
export const REQUEST_TOKEN = new HttpContextToken<any>(() => { });
|
|
@@ -23,7 +23,7 @@ export const RESPONSE_TOKEN = new HttpContextToken<any>(() => { });
|
|
|
23
23
|
* @decorator `@Injectable()`
|
|
24
24
|
*/
|
|
25
25
|
@Injectable()
|
|
26
|
-
export class
|
|
26
|
+
export class RediSecureInterceptor implements HttpInterceptor {
|
|
27
27
|
constructor(private cifradoService: CifradoService) { }
|
|
28
28
|
|
|
29
29
|
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
|
|
@@ -60,16 +60,13 @@ export class SecureInterceptor implements HttpInterceptor {
|
|
|
60
60
|
*/
|
|
61
61
|
private cifrarRequest(request: HttpRequest<any>): HttpRequest<any> {
|
|
62
62
|
let newRequest: HttpRequest<any> = request;
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
newRequest = request.clone({ url: this.cifrarPeticionUrl(request) });
|
|
71
|
-
break;
|
|
72
|
-
}
|
|
63
|
+
switch (request.method) {
|
|
64
|
+
case 'POST':
|
|
65
|
+
newRequest = request.clone({ body: this.cifrarDatos(request.body) });
|
|
66
|
+
break;
|
|
67
|
+
default:
|
|
68
|
+
newRequest = request.clone({ url: this.cifrarPeticionUrl(request) });
|
|
69
|
+
break;
|
|
73
70
|
}
|
|
74
71
|
return newRequest;
|
|
75
72
|
}
|
package/index.ts
ADDED
package/ng-package.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ngx-redi-core",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/common": "^15.2.0",
|
|
6
6
|
"@angular/core": "^15.2.0"
|
|
@@ -8,5 +8,8 @@
|
|
|
8
8
|
"dependencies": {
|
|
9
9
|
"tslib": "^2.3.0"
|
|
10
10
|
},
|
|
11
|
-
"sideEffects": false
|
|
11
|
+
"sideEffects": false,
|
|
12
|
+
"allowedNonPeerDependencies":[
|
|
13
|
+
"@angular/material"
|
|
14
|
+
]
|
|
12
15
|
}
|
package/public-api.ts
ADDED
package/tsconfig.lib.json
CHANGED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import { NgModule } from '@angular/core';
|
|
2
|
-
import { CommonModule } from '@angular/common';
|
|
3
|
-
import { secure } from './model/secure-factory.model';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
@NgModule({
|
|
8
|
-
declarations: [],
|
|
9
|
-
imports: [
|
|
10
|
-
CommonModule
|
|
11
|
-
],
|
|
12
|
-
exports:[
|
|
13
|
-
]
|
|
14
|
-
})
|
|
15
|
-
export class SecureModule { }
|
|
16
|
-
|
|
17
|
-
export function some() {
|
|
18
|
-
/**
|
|
19
|
-
* Función para la fabrica de decoradores de clases y propiedades
|
|
20
|
-
* @param target Target del decorador
|
|
21
|
-
* @param propertyKey Nombre de la propiedad
|
|
22
|
-
* @returns Function de devolución para la fabrica de decoradores
|
|
23
|
-
*/
|
|
24
|
-
return function (target: any, propertyKey?: string) {
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
2
|
-
|
|
3
|
-
import { NgxRediCoreComponent } from './ngx-redi-core.component';
|
|
4
|
-
|
|
5
|
-
describe('NgxRediCoreComponent', () => {
|
|
6
|
-
let component: NgxRediCoreComponent;
|
|
7
|
-
let fixture: ComponentFixture<NgxRediCoreComponent>;
|
|
8
|
-
|
|
9
|
-
beforeEach(async () => {
|
|
10
|
-
await TestBed.configureTestingModule({
|
|
11
|
-
declarations: [ NgxRediCoreComponent ]
|
|
12
|
-
})
|
|
13
|
-
.compileComponents();
|
|
14
|
-
|
|
15
|
-
fixture = TestBed.createComponent(NgxRediCoreComponent);
|
|
16
|
-
component = fixture.componentInstance;
|
|
17
|
-
fixture.detectChanges();
|
|
18
|
-
});
|
|
19
|
-
|
|
20
|
-
it('should create', () => {
|
|
21
|
-
expect(component).toBeTruthy();
|
|
22
|
-
});
|
|
23
|
-
});
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { NgModule } from '@angular/core';
|
|
2
|
-
import { NgxRediCoreComponent } from './ngx-redi-core.component';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
@NgModule({
|
|
7
|
-
declarations: [
|
|
8
|
-
NgxRediCoreComponent
|
|
9
|
-
],
|
|
10
|
-
imports: [
|
|
11
|
-
],
|
|
12
|
-
exports: [
|
|
13
|
-
NgxRediCoreComponent
|
|
14
|
-
]
|
|
15
|
-
})
|
|
16
|
-
export class NgxRediCoreModule { }
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { TestBed } from '@angular/core/testing';
|
|
2
|
-
|
|
3
|
-
import { NgxRediCoreService } from './ngx-redi-core.service';
|
|
4
|
-
|
|
5
|
-
describe('NgxRediCoreService', () => {
|
|
6
|
-
let service: NgxRediCoreService;
|
|
7
|
-
|
|
8
|
-
beforeEach(() => {
|
|
9
|
-
TestBed.configureTestingModule({});
|
|
10
|
-
service = TestBed.inject(NgxRediCoreService);
|
|
11
|
-
});
|
|
12
|
-
|
|
13
|
-
it('should be created', () => {
|
|
14
|
-
expect(service).toBeTruthy();
|
|
15
|
-
});
|
|
16
|
-
});
|
package/src/public-api.ts
DELETED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|