sf-crud 13.2.52 → 13.2.54
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/fesm2022/sf-crud.mjs +11 -3
- package/fesm2022/sf-crud.mjs.map +1 -1
- package/package.json +2 -2
package/fesm2022/sf-crud.mjs
CHANGED
|
@@ -2019,7 +2019,8 @@ class FileUploadComponent {
|
|
|
2019
2019
|
return /\.pdf(\?.*)?$/i.test(file.name) || /\.pdf(\?.*)?$/i.test(file.url);
|
|
2020
2020
|
}
|
|
2021
2021
|
getSafeUrl(url) {
|
|
2022
|
-
|
|
2022
|
+
const pdfUrl = `${url}#toolbar=0&navpanes=0&scrollbar=0&view=Fit`;
|
|
2023
|
+
return this.sanitizer.bypassSecurityTrustResourceUrl(pdfUrl);
|
|
2023
2024
|
}
|
|
2024
2025
|
startAnimation() {
|
|
2025
2026
|
const button = document.querySelector('.button-upload');
|
|
@@ -2034,11 +2035,11 @@ class FileUploadComponent {
|
|
|
2034
2035
|
}
|
|
2035
2036
|
}
|
|
2036
2037
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FileUploadComponent, deps: [{ token: i3$1.MessageService }, { token: i2$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
2037
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FileUploadComponent, isStandalone: true, selector: "sf-file-upload", inputs: { limit: "limit", files: "files", loading: "loading", configName: "configName", accept: "accept", referenceImage: "referenceImage" }, outputs: { onUpload: "onUpload", onDeleteFile: "onDeleteFile" }, viewQueries: [{ propertyName: "fileUploader", first: true, predicate: ["fileUpload"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div id=\"screen\" #screen>\r\n <div class=\"fileUp\">\r\n <div class=\"botones\">\r\n <input type=\"file\" (change)=\"appendFiles($event)\" class=\"file-input\" #fileUpload multiple>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" class=\"p-button-info\" (click)=\"fileUpload.click()\"\r\n [disabled]=\"limit == files.length || loading\"></button>\r\n <button *ngIf=\"limit != 1\" pButton pRipple type=\"button\" icon=\"pi pi-upload\" class=\"button-upload p-button-info\"\r\n (click)=\"emitFiles()\" [disabled]=\"files.length == 0 || loading\"></button>\r\n </div>\r\n\r\n <hr>\r\n <div class=\"imgs\">\r\n <div *ngIf=\"referenceImage && files.length === 0\" class=\"reference-image-container\">\r\n <img [src]=\"referenceImage\" alt=\"Referencia del documento\" class=\"reference-image\" />\r\n </div>\r\n <ul>\r\n <li *ngFor=\"let file of files; let i = index\" [class.preview-item]=\"isImage(file) || isPdf(file)\">\r\n <ng-container *ngIf=\"isImage(file); else checkPdf\">\r\n <img [src]=\"file.url\" [alt]=\"file.name\" class=\"uploaded-preview\" />\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-template #checkPdf>\r\n <ng-container *ngIf=\"isPdf(file); else genericFile\">\r\n <iframe [src]=\"getSafeUrl(file.url)\" class=\"pdf-preview\"></iframe>\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #genericFile>\r\n <p>{{i+1}}. {{file.name}}</p>\r\n <div>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-template>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["#screen{container-type:inline-size}iframe{width:100%;padding:10px;text-align:center}.fileUp{border:1.5px solid gray;border-radius:5px;text-align:center}.fileUp .imgs{min-height:40px;margin-block:7px
|
|
2038
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FileUploadComponent, isStandalone: true, selector: "sf-file-upload", inputs: { limit: "limit", files: "files", loading: "loading", configName: "configName", accept: "accept", referenceImage: "referenceImage" }, outputs: { onUpload: "onUpload", onDeleteFile: "onDeleteFile" }, viewQueries: [{ propertyName: "fileUploader", first: true, predicate: ["fileUpload"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div id=\"screen\" #screen>\r\n <div class=\"fileUp\">\r\n <div class=\"botones\">\r\n <input type=\"file\" (change)=\"appendFiles($event)\" class=\"file-input\" #fileUpload multiple>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" class=\"p-button-info\" (click)=\"fileUpload.click()\"\r\n [disabled]=\"limit == files.length || loading\"></button>\r\n <button *ngIf=\"limit != 1\" pButton pRipple type=\"button\" icon=\"pi pi-upload\" class=\"button-upload p-button-info\"\r\n (click)=\"emitFiles()\" [disabled]=\"files.length == 0 || loading\"></button>\r\n </div>\r\n\r\n <hr>\r\n <div class=\"imgs\">\r\n <div *ngIf=\"referenceImage && files.length === 0\" class=\"reference-image-container\">\r\n <img [src]=\"referenceImage\" alt=\"Referencia del documento\" class=\"reference-image\" />\r\n </div>\r\n <ul>\r\n <li *ngFor=\"let file of files; let i = index\" [class.preview-item]=\"isImage(file) || isPdf(file)\">\r\n <ng-container *ngIf=\"isImage(file); else checkPdf\">\r\n <img [src]=\"file.url\" [alt]=\"file.name\" class=\"uploaded-preview\" />\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-template #checkPdf>\r\n <ng-container *ngIf=\"isPdf(file); else genericFile\">\r\n <iframe [src]=\"getSafeUrl(file.url)\" class=\"pdf-preview\" scrolling=\"no\"></iframe>\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #genericFile>\r\n <p>{{i+1}}. {{file.name}}</p>\r\n <div>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-template>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["#screen{container-type:inline-size}iframe{width:100%;padding:10px;text-align:center}.fileUp{border:1.5px solid gray;border-radius:5px;text-align:center}.fileUp .imgs{min-height:40px;margin-block:7px}.fileUp hr{color:gray;margin:0}.fileUp .imgs ul li{text-decoration:none;display:flex;margin-block:5px;padding-inline:5px}.fileUp .imgs ul{padding-inline-start:30px}.fileUp .imgs ul li div{text-decoration:none;display:grid;grid-template-columns:50% 50%;margin-block:5px;margin-right:5px}.fileUp .botones *{margin-block:7px;margin-inline:10px}.fileUp .imgs ul li p{text-align:left;white-space:nowrap;width:100%;overflow:hidden;text-overflow:ellipsis}.fileUp .imgs ul li p,.fileUp .imgs ul li button{margin-block:auto;margin-inline:5px;text-align:left}.fileUp .imgs ul li:not(.preview-item) img,.fileUp .imgs ul li:not(.preview-item) iframe{text-align:center;width:80%;padding-inline:10%}.file-input{display:none}::ng-deep .p-button.p-button-info,.p-buttonset.p-button-info>.p-button,.p-splitbutton.p-button-info>.p-button{background:var(--secondary-color)!important;border:var(--secondary-color)!important;color:#fff}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.animate-pulse{animation:pulse 1.5s infinite}@container (width < 768px){.fileUp .imgs ul li:not(.preview-item){display:grid;grid-template-columns:60% 40%}}.reference-image-container{display:flex;justify-content:center;padding:.5rem}.reference-image{max-width:100%;max-height:200px;object-fit:contain;opacity:.8;border-radius:4px}.fileUp .imgs ul li.preview-item{flex-direction:column;align-items:center}.uploaded-preview{width:100%;height:auto;object-fit:contain;border-radius:4px}.pdf-preview{width:100%;height:280px;border:none;border-radius:4px;overflow:hidden}.fileUp .imgs ul li.preview-item .preview-actions{display:flex;justify-content:center;gap:.5rem;margin-top:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i7.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }] });
|
|
2038
2039
|
}
|
|
2039
2040
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
2040
2041
|
type: Component,
|
|
2041
|
-
args: [{ selector: 'sf-file-upload', imports: [CommonModule, InputTextModule, ButtonModule], standalone: true, template: "<div id=\"screen\" #screen>\r\n <div class=\"fileUp\">\r\n <div class=\"botones\">\r\n <input type=\"file\" (change)=\"appendFiles($event)\" class=\"file-input\" #fileUpload multiple>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" class=\"p-button-info\" (click)=\"fileUpload.click()\"\r\n [disabled]=\"limit == files.length || loading\"></button>\r\n <button *ngIf=\"limit != 1\" pButton pRipple type=\"button\" icon=\"pi pi-upload\" class=\"button-upload p-button-info\"\r\n (click)=\"emitFiles()\" [disabled]=\"files.length == 0 || loading\"></button>\r\n </div>\r\n\r\n <hr>\r\n <div class=\"imgs\">\r\n <div *ngIf=\"referenceImage && files.length === 0\" class=\"reference-image-container\">\r\n <img [src]=\"referenceImage\" alt=\"Referencia del documento\" class=\"reference-image\" />\r\n </div>\r\n <ul>\r\n <li *ngFor=\"let file of files; let i = index\" [class.preview-item]=\"isImage(file) || isPdf(file)\">\r\n <ng-container *ngIf=\"isImage(file); else checkPdf\">\r\n <img [src]=\"file.url\" [alt]=\"file.name\" class=\"uploaded-preview\" />\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-template #checkPdf>\r\n <ng-container *ngIf=\"isPdf(file); else genericFile\">\r\n <iframe [src]=\"getSafeUrl(file.url)\" class=\"pdf-preview\"></iframe>\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #genericFile>\r\n <p>{{i+1}}. {{file.name}}</p>\r\n <div>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-template>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["#screen{container-type:inline-size}iframe{width:100%;padding:10px;text-align:center}.fileUp{border:1.5px solid gray;border-radius:5px;text-align:center}.fileUp .imgs{min-height:40px;margin-block:7px
|
|
2042
|
+
args: [{ selector: 'sf-file-upload', imports: [CommonModule, InputTextModule, ButtonModule], standalone: true, template: "<div id=\"screen\" #screen>\r\n <div class=\"fileUp\">\r\n <div class=\"botones\">\r\n <input type=\"file\" (change)=\"appendFiles($event)\" class=\"file-input\" #fileUpload multiple>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" class=\"p-button-info\" (click)=\"fileUpload.click()\"\r\n [disabled]=\"limit == files.length || loading\"></button>\r\n <button *ngIf=\"limit != 1\" pButton pRipple type=\"button\" icon=\"pi pi-upload\" class=\"button-upload p-button-info\"\r\n (click)=\"emitFiles()\" [disabled]=\"files.length == 0 || loading\"></button>\r\n </div>\r\n\r\n <hr>\r\n <div class=\"imgs\">\r\n <div *ngIf=\"referenceImage && files.length === 0\" class=\"reference-image-container\">\r\n <img [src]=\"referenceImage\" alt=\"Referencia del documento\" class=\"reference-image\" />\r\n </div>\r\n <ul>\r\n <li *ngFor=\"let file of files; let i = index\" [class.preview-item]=\"isImage(file) || isPdf(file)\">\r\n <ng-container *ngIf=\"isImage(file); else checkPdf\">\r\n <img [src]=\"file.url\" [alt]=\"file.name\" class=\"uploaded-preview\" />\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-template #checkPdf>\r\n <ng-container *ngIf=\"isPdf(file); else genericFile\">\r\n <iframe [src]=\"getSafeUrl(file.url)\" class=\"pdf-preview\" scrolling=\"no\"></iframe>\r\n <div class=\"preview-actions\">\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #genericFile>\r\n <p>{{i+1}}. {{file.name}}</p>\r\n <div>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </ng-template>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["#screen{container-type:inline-size}iframe{width:100%;padding:10px;text-align:center}.fileUp{border:1.5px solid gray;border-radius:5px;text-align:center}.fileUp .imgs{min-height:40px;margin-block:7px}.fileUp hr{color:gray;margin:0}.fileUp .imgs ul li{text-decoration:none;display:flex;margin-block:5px;padding-inline:5px}.fileUp .imgs ul{padding-inline-start:30px}.fileUp .imgs ul li div{text-decoration:none;display:grid;grid-template-columns:50% 50%;margin-block:5px;margin-right:5px}.fileUp .botones *{margin-block:7px;margin-inline:10px}.fileUp .imgs ul li p{text-align:left;white-space:nowrap;width:100%;overflow:hidden;text-overflow:ellipsis}.fileUp .imgs ul li p,.fileUp .imgs ul li button{margin-block:auto;margin-inline:5px;text-align:left}.fileUp .imgs ul li:not(.preview-item) img,.fileUp .imgs ul li:not(.preview-item) iframe{text-align:center;width:80%;padding-inline:10%}.file-input{display:none}::ng-deep .p-button.p-button-info,.p-buttonset.p-button-info>.p-button,.p-splitbutton.p-button-info>.p-button{background:var(--secondary-color)!important;border:var(--secondary-color)!important;color:#fff}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.animate-pulse{animation:pulse 1.5s infinite}@container (width < 768px){.fileUp .imgs ul li:not(.preview-item){display:grid;grid-template-columns:60% 40%}}.reference-image-container{display:flex;justify-content:center;padding:.5rem}.reference-image{max-width:100%;max-height:200px;object-fit:contain;opacity:.8;border-radius:4px}.fileUp .imgs ul li.preview-item{flex-direction:column;align-items:center}.uploaded-preview{width:100%;height:auto;object-fit:contain;border-radius:4px}.pdf-preview{width:100%;height:280px;border:none;border-radius:4px;overflow:hidden}.fileUp .imgs ul li.preview-item .preview-actions{display:flex;justify-content:center;gap:.5rem;margin-top:.25rem}\n"] }]
|
|
2042
2043
|
}], ctorParameters: () => [{ type: i3$1.MessageService }, { type: i2$1.DomSanitizer }], propDecorators: { limit: [{
|
|
2043
2044
|
type: Input
|
|
2044
2045
|
}], files: [{
|
|
@@ -2709,6 +2710,13 @@ class ControlComponent {
|
|
|
2709
2710
|
this.sendValueFromObject({ value: match });
|
|
2710
2711
|
this.tempValue = match;
|
|
2711
2712
|
this.cdr.detectChanges();
|
|
2713
|
+
return;
|
|
2714
|
+
}
|
|
2715
|
+
if (this.dataFromService?.length === 1) {
|
|
2716
|
+
const singleResult = this.dataFromService[0];
|
|
2717
|
+
this.sendValueFromObject({ value: singleResult });
|
|
2718
|
+
this.tempValue = singleResult;
|
|
2719
|
+
this.cdr.detectChanges();
|
|
2712
2720
|
}
|
|
2713
2721
|
}
|
|
2714
2722
|
sendDependencyValue(data) {
|