@webilix/ngx-helper-m3 0.0.33 → 0.0.35
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.
@@ -31,7 +31,9 @@ import { trigger, transition, style, animate } from '@angular/animations';
|
|
31
31
|
import * as i1$5 from '@angular/common/http';
|
32
32
|
import { HttpHeaders, HttpEventType } from '@angular/common/http';
|
33
33
|
import * as i1$4 from '@angular/platform-browser';
|
34
|
-
import * as i1$6 from '
|
34
|
+
import * as i1$6 from 'ng2-pdf-viewer';
|
35
|
+
import { PdfViewerModule } from 'ng2-pdf-viewer';
|
36
|
+
import * as i1$7 from '@angular/cdk/drag-drop';
|
35
37
|
import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
|
36
38
|
|
37
39
|
const NGX_HELPER_CONFIG = new InjectionToken('NGX-HELPER-CONFIG');
|
@@ -1863,6 +1865,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
|
|
1863
1865
|
args: ['style.bottom']
|
1864
1866
|
}] } });
|
1865
1867
|
|
1868
|
+
class PdfComponent {
|
1869
|
+
className = 'ngx-helper-m3-pdf';
|
1870
|
+
uint8Array;
|
1871
|
+
close;
|
1872
|
+
checkEscape(event) {
|
1873
|
+
if (!(event instanceof KeyboardEvent))
|
1874
|
+
return;
|
1875
|
+
if (event.code === 'Escape') {
|
1876
|
+
event.preventDefault();
|
1877
|
+
this.close();
|
1878
|
+
}
|
1879
|
+
}
|
1880
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: PdfComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
1881
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.0", type: PdfComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "pdf" }, listeners: { "window:keydown": "checkEscape($event)" }, properties: { "className": "this.className" } }, ngImport: i0, template: "<div class=\"background\"></div>\n<button class=\"close\" mat-icon-button (click)=\"close()\"><mat-icon>close</mat-icon></button>\n\n<pdf-viewer [src]=\"uint8Array\" [render-text]=\"true\" [original-size]=\"false\" [external-link-target]=\"'blank'\"></pdf-viewer>\n", styles: [""], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: PdfViewerModule }, { kind: "component", type: i1$6.PdfViewerComponent, selector: "pdf-viewer", inputs: ["src", "c-maps-url", "page", "render-text", "render-text-mode", "original-size", "show-all", "stick-to-page", "zoom", "zoom-scale", "rotation", "external-link-target", "autoresize", "fit-to-page", "show-borders"], outputs: ["after-load-complete", "page-rendered", "pages-initialized", "text-layer-rendered", "error", "on-progress", "pageChange"] }] });
|
1882
|
+
}
|
1883
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: PdfComponent, decorators: [{
|
1884
|
+
type: Component,
|
1885
|
+
args: [{ host: { selector: 'pdf', '(window:keydown)': 'checkEscape($event)' }, imports: [MatIcon, MatIconButton, PdfViewerModule], template: "<div class=\"background\"></div>\n<button class=\"close\" mat-icon-button (click)=\"close()\"><mat-icon>close</mat-icon></button>\n\n<pdf-viewer [src]=\"uint8Array\" [render-text]=\"true\" [original-size]=\"false\" [external-link-target]=\"'blank'\"></pdf-viewer>\n" }]
|
1886
|
+
}], propDecorators: { className: [{
|
1887
|
+
type: HostBinding,
|
1888
|
+
args: ['className']
|
1889
|
+
}] } });
|
1890
|
+
|
1866
1891
|
class UploadComponent {
|
1867
1892
|
httpClient;
|
1868
1893
|
host = true;
|
@@ -2052,17 +2077,45 @@ class NgxHelperHttpService {
|
|
2052
2077
|
this.components.push({ id, componentRef });
|
2053
2078
|
this.updatePositions();
|
2054
2079
|
}
|
2055
|
-
|
2056
|
-
|
2057
|
-
|
2058
|
-
|
2059
|
-
|
2060
|
-
|
2061
|
-
|
2062
|
-
|
2080
|
+
//#region PDF
|
2081
|
+
getPDF = (data, config) => {
|
2082
|
+
return new Promise((resolve, reject) => {
|
2083
|
+
if (typeof data !== 'string') {
|
2084
|
+
resolve(new Blob([data], { type: 'application/pdf' }));
|
2085
|
+
return;
|
2086
|
+
}
|
2087
|
+
this.getBuffer(data, 'دریافت فایل', config || {}).then((arrayBuffer) => resolve(new Blob([arrayBuffer], { type: 'application/pdf' })), () => reject());
|
2088
|
+
});
|
2089
|
+
};
|
2090
|
+
showPDF(data, config) {
|
2091
|
+
this.getPDF(data, config).then(async (blob) => {
|
2092
|
+
let uint8Array;
|
2093
|
+
try {
|
2094
|
+
uint8Array = new Uint8Array(await blob.arrayBuffer());
|
2095
|
+
}
|
2096
|
+
catch (error) {
|
2097
|
+
this.ngxHelperToastService.error('امکان نمایش فایل وجود ندارد.');
|
2098
|
+
return;
|
2099
|
+
}
|
2100
|
+
const componentRef = createComponent(PdfComponent, {
|
2101
|
+
environmentInjector: this.applicationRef.injector,
|
2102
|
+
elementInjector: this.injector,
|
2063
2103
|
});
|
2064
|
-
|
2065
|
-
|
2104
|
+
componentRef.instance.uint8Array = uint8Array;
|
2105
|
+
componentRef.instance.close = () => {
|
2106
|
+
this.applicationRef.detachView(componentRef.hostView);
|
2107
|
+
document.body.removeChild(htmlElement);
|
2108
|
+
componentRef.destroy();
|
2109
|
+
document.body.style.overflow = 'visible';
|
2110
|
+
};
|
2111
|
+
const htmlElement = componentRef.hostView.rootNodes[0];
|
2112
|
+
this.applicationRef.attachView(componentRef.hostView);
|
2113
|
+
document.body.appendChild(htmlElement);
|
2114
|
+
document.body.style.overflow = 'hidden';
|
2115
|
+
});
|
2116
|
+
}
|
2117
|
+
printPDF(data, config) {
|
2118
|
+
this.getPDF(data, config).then((blob) => {
|
2066
2119
|
try {
|
2067
2120
|
const prevIframe = document.getElementById('ngx-helper-http-pdf-download-iframe');
|
2068
2121
|
if (prevIframe)
|
@@ -2337,7 +2390,7 @@ class GetComponent {
|
|
2337
2390
|
}
|
2338
2391
|
}
|
2339
2392
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: GetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
2340
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: GetComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "get" }, listeners: { "window:keydown": "checkEscape($event)" }, properties: { "className": "this.className" } }, ngImport: i0, template: "<div\n id=\"ngx-helper-m3-route-map\"\n class=\"map\"\n (dblclick)=\"setCoordinates($event)\"\n (contextmenu)=\"setCoordinates($event)\"\n></div>\n\n<div class=\"route\">\n <div class=\"header\">\n <div class=\"title\">ROUTE</div>\n <mat-icon (click)=\"close()\">close</mat-icon>\n </div>\n\n <div class=\"coordinates\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\n @for (item of route; track $index) {\n <div class=\"coordinate ngx-helper-m3-route-coordinate\" cdkDrag cdkDragLockAxis=\"y\" cdkDragBoundary=\".coordinates\">\n <!-- DRAG -->\n @if (route.length > 1) { <mat-icon cdkDragHandle>drag_indicator</mat-icon> }\n <div class=\"index\" [style.padding-left]=\"route.length > 1 ? '0' : '0.5rem'\">{{ $index + 1 }}</div>\n <div class=\"value\" (click)=\"animate($index)\">{{ item.latitude.toFixed(5) }}</div>\n <div class=\"value\" (click)=\"animate($index)\">{{ item.longitude.toFixed(5) }}</div>\n <mat-icon class=\"delete\" (click)=\"delete($index)\">delete</mat-icon>\n </div>\n }\n </div>\n\n <div class=\"footer\">\n <div class=\"distance\">{{ distance.length | number }} M</div>\n <mat-icon [class.disabled]=\"route.length < 2\" (click)=\"selectRoute()\">done_all</mat-icon>\n </div>\n</div>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.coordinates.cdk-drop-list-dragging .coordinates:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1$
|
2393
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: GetComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "get" }, listeners: { "window:keydown": "checkEscape($event)" }, properties: { "className": "this.className" } }, ngImport: i0, template: "<div\n id=\"ngx-helper-m3-route-map\"\n class=\"map\"\n (dblclick)=\"setCoordinates($event)\"\n (contextmenu)=\"setCoordinates($event)\"\n></div>\n\n<div class=\"route\">\n <div class=\"header\">\n <div class=\"title\">ROUTE</div>\n <mat-icon (click)=\"close()\">close</mat-icon>\n </div>\n\n <div class=\"coordinates\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\n @for (item of route; track $index) {\n <div class=\"coordinate ngx-helper-m3-route-coordinate\" cdkDrag cdkDragLockAxis=\"y\" cdkDragBoundary=\".coordinates\">\n <!-- DRAG -->\n @if (route.length > 1) { <mat-icon cdkDragHandle>drag_indicator</mat-icon> }\n <div class=\"index\" [style.padding-left]=\"route.length > 1 ? '0' : '0.5rem'\">{{ $index + 1 }}</div>\n <div class=\"value\" (click)=\"animate($index)\">{{ item.latitude.toFixed(5) }}</div>\n <div class=\"value\" (click)=\"animate($index)\">{{ item.longitude.toFixed(5) }}</div>\n <mat-icon class=\"delete\" (click)=\"delete($index)\">delete</mat-icon>\n </div>\n }\n </div>\n\n <div class=\"footer\">\n <div class=\"distance\">{{ distance.length | number }} M</div>\n <mat-icon [class.disabled]=\"route.length < 2\" (click)=\"selectRoute()\">done_all</mat-icon>\n </div>\n</div>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.coordinates.cdk-drop-list-dragging .coordinates:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1$7.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i1$7.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i1$7.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: DecimalPipe, name: "number" }] });
|
2341
2394
|
}
|
2342
2395
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: GetComponent, decorators: [{
|
2343
2396
|
type: Component,
|