@esfaenza/forms-and-validations 15.2.46 → 15.2.47
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/esm2020/lib/forms/form-file/form-file.component.mjs +27 -13
- package/fesm2015/esfaenza-forms-and-validations.mjs +26 -12
- package/fesm2015/esfaenza-forms-and-validations.mjs.map +1 -1
- package/fesm2020/esfaenza-forms-and-validations.mjs +26 -12
- package/fesm2020/esfaenza-forms-and-validations.mjs.map +1 -1
- package/lib/forms/form-file/form-file.component.d.ts +4 -2
- package/package.json +1 -1
|
@@ -2315,6 +2315,8 @@ class FormFileComponent extends BaseFormControl {
|
|
|
2315
2315
|
this.MaxSize = 0;
|
|
2316
2316
|
/** Sportivo */
|
|
2317
2317
|
this.FancyMode = false;
|
|
2318
|
+
/** Legge sempre il contenuto del file e ne estrapola il base64 */
|
|
2319
|
+
this.ReadFile = false;
|
|
2318
2320
|
//Per questo componente non posso permettermi che il modello sia nullo
|
|
2319
2321
|
this.Model = new AppFile();
|
|
2320
2322
|
}
|
|
@@ -2326,6 +2328,8 @@ class FormFileComponent extends BaseFormControl {
|
|
|
2326
2328
|
this.ngControl.control.setValidators(this._validators);
|
|
2327
2329
|
this.ngControl.control.updateValueAndValidity();
|
|
2328
2330
|
}
|
|
2331
|
+
if (this.ReadFile && this.Multiple)
|
|
2332
|
+
throw new Error("Impossibile utilizzare ReadFile e Multiple nello stesso form-file.");
|
|
2329
2333
|
}
|
|
2330
2334
|
validate(control) {
|
|
2331
2335
|
if (this.Required && !this.Model.filename)
|
|
@@ -2347,7 +2351,6 @@ class FormFileComponent extends BaseFormControl {
|
|
|
2347
2351
|
* @param {boolean} clear Indica se bisogna svuotare l'input o meno
|
|
2348
2352
|
*/
|
|
2349
2353
|
fileChange(clear = false) {
|
|
2350
|
-
console.log("dong");
|
|
2351
2354
|
let files = [];
|
|
2352
2355
|
let model = this.Model;
|
|
2353
2356
|
let ne = this.inputEl.nativeElement;
|
|
@@ -2367,8 +2370,21 @@ class FormFileComponent extends BaseFormControl {
|
|
|
2367
2370
|
}
|
|
2368
2371
|
files.push(file);
|
|
2369
2372
|
}
|
|
2370
|
-
|
|
2371
|
-
|
|
2373
|
+
// Modalità Upload Singolo File
|
|
2374
|
+
if (ne.files.length == 1) {
|
|
2375
|
+
let fileUploaded = ne.files[0];
|
|
2376
|
+
model.filename = fileUploaded.name;
|
|
2377
|
+
if (this.ReadFile) {
|
|
2378
|
+
let reader = new FileReader();
|
|
2379
|
+
reader.readAsDataURL(fileUploaded);
|
|
2380
|
+
reader.onload = () => {
|
|
2381
|
+
let fileSource = reader.result.toString();
|
|
2382
|
+
let fileSourceSegments = fileSource.split(',');
|
|
2383
|
+
model.fileb64 = fileSourceSegments[fileSourceSegments.length - 1];
|
|
2384
|
+
};
|
|
2385
|
+
}
|
|
2386
|
+
}
|
|
2387
|
+
// Modalità Upload Multiple File
|
|
2372
2388
|
if (ne.files.length > 1)
|
|
2373
2389
|
model.filename = ne.files.length + " " + this.lc.loc("Files Selected");
|
|
2374
2390
|
model.nativefiles = files;
|
|
@@ -2378,35 +2394,31 @@ class FormFileComponent extends BaseFormControl {
|
|
|
2378
2394
|
this.changed(null, true, true);
|
|
2379
2395
|
}
|
|
2380
2396
|
/** Permette di scaricare l'eventuale file selezionato */
|
|
2381
|
-
|
|
2397
|
+
onDownloadFile() {
|
|
2382
2398
|
let model = this.Model;
|
|
2383
2399
|
this.utiExts.saveFile(model.fileb64, model.filename);
|
|
2384
2400
|
}
|
|
2385
2401
|
/** @ignore */
|
|
2386
2402
|
onNotNullValueSet() { }
|
|
2403
|
+
// FancyMode - Drag Over
|
|
2387
2404
|
onFileDragOver(event) {
|
|
2388
2405
|
event.preventDefault();
|
|
2389
2406
|
event.stopPropagation();
|
|
2390
2407
|
}
|
|
2408
|
+
// FancyMode - File Dropped
|
|
2391
2409
|
onFileDropped(event) {
|
|
2392
2410
|
event.preventDefault();
|
|
2393
2411
|
event.stopPropagation();
|
|
2394
2412
|
let ne = this.inputEl.nativeElement;
|
|
2395
2413
|
ne.files = event.dataTransfer?.files;
|
|
2396
2414
|
this.fileChange();
|
|
2397
|
-
// let files = Array.from(event.dataTransfer?.files || []);
|
|
2398
|
-
// let model = new AppFile();
|
|
2399
|
-
// model.filename = files[0].name;
|
|
2400
|
-
// model.fileb64 = null;
|
|
2401
|
-
// model.nativefiles = files;
|
|
2402
|
-
// this.writeValue(model);
|
|
2403
2415
|
}
|
|
2404
2416
|
}
|
|
2405
2417
|
FormFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FormFileComponent, deps: [{ token: i1$1.MessageService }, { token: i0.ChangeDetectorRef }, { token: i1$1.UtilityService }, { token: i2.NgControl, optional: true, self: true }, { token: NG_VALIDATORS, optional: true }, { token: i3.AccessControlService, optional: true }, { token: i3.ComponentContext, optional: true }, { token: ACO_CUSTOMKEY, optional: true }, { token: i1.LocalizationService }, { token: FAV_DEBUG_MODE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
2406
|
-
FormFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FormFileComponent, selector: "form-file", inputs: { Multiple: "Multiple", AllowDownload: "AllowDownload", MaxSize: "MaxSize", FancyMode: "FancyMode" }, providers: [{ provide: LocalizationService, useClass: FormFileComponentLoc }], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FancyMode && !FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"!FancyMode && FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n
|
|
2418
|
+
FormFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FormFileComponent, selector: "form-file", inputs: { Multiple: "Multiple", AllowDownload: "AllowDownload", MaxSize: "MaxSize", FancyMode: "FancyMode", ReadFile: "ReadFile" }, providers: [{ provide: LocalizationService, useClass: FormFileComponentLoc }], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!--Per la DisplayMode, a differenza di TUTTI gli altri forms, ho dovuto inserire \"Model?.filename\", in quanto \r\nEvaluatedModel \u00E8 una stringa valorizzata col modello AppFile, e non posso farci ragionamenti sopra a causa del compilatore-->\r\n\r\n<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FancyMode && !FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"!FancyMode && FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}{{Label ? \":\" : \"\"}}</label>\r\n <span *ngIf=\"DisplayMode && DisplayLayout == 'inline' && InlineSeparator != ''\">{{InlineSeparator}}</span>\r\n <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <span class=\"app-link\" style=\"display: inline;\" *ngIf=\"Model?.filename\" (click)=\"onDownloadFile()\">{{ Model?.filename }}</span>\r\n <span *ngIf=\"!Model?.filename\">N/A</span>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n <div class=\"input-group file-upload\">\r\n <input type=\"file\" (change)=\"fileChange()\" id=\"{{GeneratedName}}\" #fileInput class=\"file-upload-btn app-pointer\" [multiple]=\"Multiple ? true : null\" />\r\n <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && Model.filename && Model.fileb64\" class=\"form-control checking-field\" placeholder=\"{{Placeholder || ('Select a file' | localize : lc)}}...\" [(ngModel)]=\"Model.filename\" name=\"dsfile_{{GeneratedName}}\" #validationControl=\"ngModel\" />\r\n \r\n <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && Model.filename && Model.fileb64\" (click)=\"onDownloadFile()\"></a>\r\n <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"Model.filename\"></i>\r\n <span class=\"input-group-btn\">\r\n <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n </span>\r\n </div>\r\n</ng-template>\r\n\r\n<!--Fancy Mode-->\r\n<div *ngIf=\"FancyMode\" (drop)=\"onFileDropped($event)\" (dragover)=\"onFileDragOver($event)\">\r\n <!--Drop-->\r\n <label for=\"{{GeneratedName}}\" class=\"drop-container\">\r\n <span class=\"drop-title\">{{Label}}</span>\r\n <div class=\"file-name-container\">{{Model.filename || 'Nessun file selezionato'}}</div>\r\n <!--Hidden Forms-->\r\n <input hidden type=\"file\" (change)=\"fileChange()\" id=\"{{GeneratedName}}\" #fileInput class=\"file-upload-btn app-pointer\" [multiple]=\"Multiple ? true : null\" />\r\n <input hidden type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && Model.filename && Model.fileb64\" class=\"form-control checking-field\" \r\n placeholder=\"{{Placeholder || ('Select a file' | localize : lc)}}...\" [(ngModel)]=\"Model.filename\" name=\"dsfile_{{GeneratedName}}\" #validationControl=\"ngModel\" />\r\n <!--Clean-->\r\n <i class=\"fa fa-times file-delete-btn\" (click)=\"fileChange(true); $event.stopPropagation(); false;\" *ngIf=\"Model.filename\"></i>\r\n <!--Download-->\r\n <div *ngIf=\"AllowDownload && Model.filename && Model.fileb64\" class=\"app-pointer file-download-btn\" (click)=\"onDownloadFile(); $event.stopPropagation(); false;\">\r\n <span class=\"file-download-btn-text\">Download <i class=\"fa fa-download\"></i></span>\r\n </div>\r\n </label>\r\n</div>", styles: [".frm-padding-left-22{padding-left:22px}.drop-container{position:relative;display:flex;gap:10px;flex-direction:column;justify-content:center;align-items:center;height:200px;padding:20px;border-radius:10px;border:2px dashed #0d45a5;color:#444;cursor:pointer;transition:background .2s ease-in-out,border .2s ease-in-out}.drop-container:hover{background:#eee;border-color:#111}.drop-container:hover .drop-title{color:#222}.drop-title{color:#444;font-size:20px;font-weight:700;text-align:center;transition:color .2s ease-in-out}input[type=file]{width:350px;max-width:100%;color:#444;padding:5px;background:#fff;border-radius:10px;border:1px solid #555}input[type=file]::file-selector-button{margin-right:20px;border:none;background:#084cdf;padding:10px 20px;border-radius:10px;color:#fff;cursor:pointer;transition:background .2s ease-in-out}input[type=file]::file-selector-button:hover{background:#0d45a5}.file-download-btn{border-radius:5px;padding:5px 10px;background-color:#0d45a5}.file-download-btn:hover{background-color:#084cdf}.file-download-btn-text{color:#fff}.file-delete-btn{color:red;position:absolute;right:10px;top:10px}.file-name-container{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow-y:clip;text-align:center}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { 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: "pipe", type: i1.LocalizePipe, name: "localize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2407
2419
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FormFileComponent, decorators: [{
|
|
2408
2420
|
type: Component,
|
|
2409
|
-
args: [{ selector: "form-file", providers: [{ provide: LocalizationService, useClass: FormFileComponentLoc }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FancyMode && !FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"!FancyMode && FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n
|
|
2421
|
+
args: [{ selector: "form-file", providers: [{ provide: LocalizationService, useClass: FormFileComponentLoc }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--Per la DisplayMode, a differenza di TUTTI gli altri forms, ho dovuto inserire \"Model?.filename\", in quanto \r\nEvaluatedModel \u00E8 una stringa valorizzata col modello AppFile, e non posso farci ragionamenti sopra a causa del compilatore-->\r\n\r\n<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FancyMode && !FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"!FancyMode && FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}{{Label ? \":\" : \"\"}}</label>\r\n <span *ngIf=\"DisplayMode && DisplayLayout == 'inline' && InlineSeparator != ''\">{{InlineSeparator}}</span>\r\n <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <span class=\"app-link\" style=\"display: inline;\" *ngIf=\"Model?.filename\" (click)=\"onDownloadFile()\">{{ Model?.filename }}</span>\r\n <span *ngIf=\"!Model?.filename\">N/A</span>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n <div class=\"input-group file-upload\">\r\n <input type=\"file\" (change)=\"fileChange()\" id=\"{{GeneratedName}}\" #fileInput class=\"file-upload-btn app-pointer\" [multiple]=\"Multiple ? true : null\" />\r\n <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && Model.filename && Model.fileb64\" class=\"form-control checking-field\" placeholder=\"{{Placeholder || ('Select a file' | localize : lc)}}...\" [(ngModel)]=\"Model.filename\" name=\"dsfile_{{GeneratedName}}\" #validationControl=\"ngModel\" />\r\n \r\n <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && Model.filename && Model.fileb64\" (click)=\"onDownloadFile()\"></a>\r\n <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"Model.filename\"></i>\r\n <span class=\"input-group-btn\">\r\n <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n </span>\r\n </div>\r\n</ng-template>\r\n\r\n<!--Fancy Mode-->\r\n<div *ngIf=\"FancyMode\" (drop)=\"onFileDropped($event)\" (dragover)=\"onFileDragOver($event)\">\r\n <!--Drop-->\r\n <label for=\"{{GeneratedName}}\" class=\"drop-container\">\r\n <span class=\"drop-title\">{{Label}}</span>\r\n <div class=\"file-name-container\">{{Model.filename || 'Nessun file selezionato'}}</div>\r\n <!--Hidden Forms-->\r\n <input hidden type=\"file\" (change)=\"fileChange()\" id=\"{{GeneratedName}}\" #fileInput class=\"file-upload-btn app-pointer\" [multiple]=\"Multiple ? true : null\" />\r\n <input hidden type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && Model.filename && Model.fileb64\" class=\"form-control checking-field\" \r\n placeholder=\"{{Placeholder || ('Select a file' | localize : lc)}}...\" [(ngModel)]=\"Model.filename\" name=\"dsfile_{{GeneratedName}}\" #validationControl=\"ngModel\" />\r\n <!--Clean-->\r\n <i class=\"fa fa-times file-delete-btn\" (click)=\"fileChange(true); $event.stopPropagation(); false;\" *ngIf=\"Model.filename\"></i>\r\n <!--Download-->\r\n <div *ngIf=\"AllowDownload && Model.filename && Model.fileb64\" class=\"app-pointer file-download-btn\" (click)=\"onDownloadFile(); $event.stopPropagation(); false;\">\r\n <span class=\"file-download-btn-text\">Download <i class=\"fa fa-download\"></i></span>\r\n </div>\r\n </label>\r\n</div>", styles: [".frm-padding-left-22{padding-left:22px}.drop-container{position:relative;display:flex;gap:10px;flex-direction:column;justify-content:center;align-items:center;height:200px;padding:20px;border-radius:10px;border:2px dashed #0d45a5;color:#444;cursor:pointer;transition:background .2s ease-in-out,border .2s ease-in-out}.drop-container:hover{background:#eee;border-color:#111}.drop-container:hover .drop-title{color:#222}.drop-title{color:#444;font-size:20px;font-weight:700;text-align:center;transition:color .2s ease-in-out}input[type=file]{width:350px;max-width:100%;color:#444;padding:5px;background:#fff;border-radius:10px;border:1px solid #555}input[type=file]::file-selector-button{margin-right:20px;border:none;background:#084cdf;padding:10px 20px;border-radius:10px;color:#fff;cursor:pointer;transition:background .2s ease-in-out}input[type=file]::file-selector-button:hover{background:#0d45a5}.file-download-btn{border-radius:5px;padding:5px 10px;background-color:#0d45a5}.file-download-btn:hover{background-color:#084cdf}.file-download-btn-text{color:#fff}.file-delete-btn{color:red;position:absolute;right:10px;top:10px}.file-name-container{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow-y:clip;text-align:center}\n"] }]
|
|
2410
2422
|
}], ctorParameters: function () { return [{ type: i1$1.MessageService }, { type: i0.ChangeDetectorRef }, { type: i1$1.UtilityService }, { type: i2.NgControl, decorators: [{
|
|
2411
2423
|
type: Optional
|
|
2412
2424
|
}, {
|
|
@@ -2438,6 +2450,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
2438
2450
|
type: Input
|
|
2439
2451
|
}], FancyMode: [{
|
|
2440
2452
|
type: Input
|
|
2453
|
+
}], ReadFile: [{
|
|
2454
|
+
type: Input
|
|
2441
2455
|
}], inputEl: [{
|
|
2442
2456
|
type: ViewChild,
|
|
2443
2457
|
args: ["fileInput", { static: false }]
|