@fxlt/common-ui 0.0.3-rc1 → 0.0.4-beta1
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/components.css +58 -3
- package/fesm2022/fxlt-common-ui.mjs +252 -47
- package/fesm2022/fxlt-common-ui.mjs.map +1 -1
- package/index.d.ts +88 -31
- package/package.json +4 -2
- package/src/lib/styles/components.css +58 -3
- package/src/lib/styles/theme.css +3 -3
- package/src/lib/ui/components/circle-progress-bar/circle-progress-bar.component.html +44 -0
- package/src/lib/ui/components/datetime-picker/datetime-picker.component.html +8 -5
- package/src/lib/ui/components/flow-connection/flow-connection.component.html +10 -0
- package/src/lib/ui/components/tree-diagram/tree-diagram.component.html +40 -0
- package/theme.css +3 -3
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Directive, Input, Component, createComponent, Injectable, ViewChild, Inject, EventEmitter, NgModule, HostListener, PLATFORM_ID, Output, Optional, Self, ChangeDetectionStrategy, TemplateRef, ContentChildren, importProvidersFrom } from '@angular/core';
|
|
3
|
-
import * as
|
|
2
|
+
import { Directive, Input, Component, createComponent, Injectable, ViewChild, Inject, EventEmitter, NgModule, HostListener, PLATFORM_ID, Output, Optional, Self, ChangeDetectionStrategy, TemplateRef, ContentChildren, ViewChildren, importProvidersFrom } from '@angular/core';
|
|
3
|
+
import * as i32 from '@angular/material/paginator';
|
|
4
4
|
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
|
5
|
-
import * as
|
|
5
|
+
import * as i33 from '@angular/material/table';
|
|
6
6
|
import { MatTableDataSource, MatTable, MatTableModule } from '@angular/material/table';
|
|
7
7
|
import * as i2 from '@angular/common';
|
|
8
8
|
import { isPlatformBrowser, CommonModule } from '@angular/common';
|
|
@@ -10,10 +10,10 @@ import * as i1 from '@dimaslz/ng-heroicons';
|
|
|
10
10
|
import { NgHeroiconsModule } from '@dimaslz/ng-heroicons';
|
|
11
11
|
import _, { clamp } from 'lodash';
|
|
12
12
|
import { Observable, firstValueFrom, Subject, debounceTime, BehaviorSubject, throwError, distinctUntilChanged } from 'rxjs';
|
|
13
|
+
import * as i2$1 from '@angular/common/http';
|
|
14
|
+
import { HttpRequest, HttpClient } from '@angular/common/http';
|
|
13
15
|
import * as i1$1 from '@angular/material/dialog';
|
|
14
16
|
import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
|
|
15
|
-
import * as i2$1 from '@angular/common/http';
|
|
16
|
-
import { HttpClient } from '@angular/common/http';
|
|
17
17
|
import * as i1$2 from '@ngx-translate/core';
|
|
18
18
|
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
|
|
19
19
|
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
|
|
@@ -23,33 +23,38 @@ import * as i2$2 from '@angular/router';
|
|
|
23
23
|
import { catchError } from 'rxjs/operators';
|
|
24
24
|
import * as i3$1 from '@angular/material/select';
|
|
25
25
|
import { MatSelectModule } from '@angular/material/select';
|
|
26
|
-
import * as
|
|
26
|
+
import * as i29 from '@angular/material/radio';
|
|
27
27
|
import { MatRadioModule } from '@angular/material/radio';
|
|
28
|
-
import * as
|
|
28
|
+
import * as i30 from '@angular/material/button';
|
|
29
29
|
import { MatButtonModule } from '@angular/material/button';
|
|
30
|
-
import * as
|
|
30
|
+
import * as i31 from '@angular/material/icon';
|
|
31
31
|
import { MatIconModule } from '@angular/material/icon';
|
|
32
|
-
import * as
|
|
32
|
+
import * as i34 from '@angular/material/snack-bar';
|
|
33
33
|
import { MatSnackBarModule } from '@angular/material/snack-bar';
|
|
34
|
-
import * as
|
|
34
|
+
import * as i36 from '@angular/material/checkbox';
|
|
35
35
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
36
|
-
import * as
|
|
36
|
+
import * as i37 from '@angular/material/card';
|
|
37
37
|
import { MatCardModule } from '@angular/material/card';
|
|
38
|
-
import * as
|
|
38
|
+
import * as i38 from '@angular/material/datepicker';
|
|
39
39
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
40
|
-
import * as
|
|
40
|
+
import * as i39 from '@angular/material/timepicker';
|
|
41
41
|
import { MatTimepickerModule } from '@angular/material/timepicker';
|
|
42
|
-
import * as
|
|
42
|
+
import * as i40 from '@angular/material/badge';
|
|
43
43
|
import { MatBadgeModule } from '@angular/material/badge';
|
|
44
|
-
import * as
|
|
44
|
+
import * as i41 from '@angular/material/expansion';
|
|
45
45
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
46
|
-
import * as
|
|
46
|
+
import * as i42 from '@angular/material/form-field';
|
|
47
47
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
48
|
+
import * as i43 from '@angular/material/menu';
|
|
49
|
+
import { MatMenuModule } from '@angular/material/menu';
|
|
48
50
|
import * as i3 from '@danielmoncada/angular-datetime-picker';
|
|
49
|
-
import { OwlDateTimeModule, OwlNativeDateTimeModule } from '@danielmoncada/angular-datetime-picker';
|
|
51
|
+
import { OwlDateTimeModule, OwlNativeDateTimeModule, OWL_DATE_TIME_FORMATS } from '@danielmoncada/angular-datetime-picker';
|
|
50
52
|
import * as i2$3 from 'ngx-echarts';
|
|
51
53
|
import { NgxEchartsModule } from 'ngx-echarts';
|
|
52
54
|
import { __decorate, __param } from 'tslib';
|
|
55
|
+
import * as i26 from 'ngx-vflow';
|
|
56
|
+
import { Vflow } from 'ngx-vflow';
|
|
57
|
+
import { OwlMomentDateTimeModule } from '@danielmoncada/angular-datetime-picker-moment-adapter';
|
|
53
58
|
|
|
54
59
|
class BaseComponent {
|
|
55
60
|
injector;
|
|
@@ -319,6 +324,7 @@ class FxUtils {
|
|
|
319
324
|
}
|
|
320
325
|
return 'critical';
|
|
321
326
|
case 'inprogress':
|
|
327
|
+
case 'processing':
|
|
322
328
|
case 'paused':
|
|
323
329
|
case 'medium':
|
|
324
330
|
return 'warning';
|
|
@@ -379,6 +385,13 @@ class HttpWrapper {
|
|
|
379
385
|
async delete(url, options = {}) {
|
|
380
386
|
return firstValueFrom(this.http.delete(this.baseURL + url, this.addCredentials(options)));
|
|
381
387
|
}
|
|
388
|
+
upload(url, body, options = {}) {
|
|
389
|
+
const req = new HttpRequest('POST', this.baseURL + url, body, {
|
|
390
|
+
reportProgress: true,
|
|
391
|
+
...this.addCredentials(options)
|
|
392
|
+
});
|
|
393
|
+
return this.http.request(req);
|
|
394
|
+
}
|
|
382
395
|
async search(params = {}) {
|
|
383
396
|
return await this.get('/search', params);
|
|
384
397
|
}
|
|
@@ -430,7 +443,7 @@ class BaseTableComponent extends BaseComponent {
|
|
|
430
443
|
dataSource = new MatTableDataSource();
|
|
431
444
|
cols = [];
|
|
432
445
|
total = 0;
|
|
433
|
-
page =
|
|
446
|
+
page = 0;
|
|
434
447
|
pageSize = 10;
|
|
435
448
|
filters = {};
|
|
436
449
|
loading = false;
|
|
@@ -456,11 +469,10 @@ class BaseTableComponent extends BaseComponent {
|
|
|
456
469
|
}
|
|
457
470
|
init() { }
|
|
458
471
|
ngAfterViewInit() {
|
|
459
|
-
this.dataSource.paginator = this.paginator;
|
|
460
472
|
this.ref.detectChanges();
|
|
461
473
|
}
|
|
462
474
|
async refresh() {
|
|
463
|
-
this.page =
|
|
475
|
+
this.page = 0;
|
|
464
476
|
await this.fetch();
|
|
465
477
|
}
|
|
466
478
|
setDataSource(result) {
|
|
@@ -470,7 +482,7 @@ class BaseTableComponent extends BaseComponent {
|
|
|
470
482
|
async fetch() {
|
|
471
483
|
this.loading = true;
|
|
472
484
|
try {
|
|
473
|
-
const params = { page: this.page, pageSize: this.pageSize, ...this.filters };
|
|
485
|
+
const params = { page: this.page + 1, pageSize: this.pageSize, ...this.filters };
|
|
474
486
|
const result = await this.api.search(params);
|
|
475
487
|
this.setDataSource(result);
|
|
476
488
|
}
|
|
@@ -1195,7 +1207,8 @@ const MATERIAL_MODULE = [
|
|
|
1195
1207
|
MatTimepickerModule,
|
|
1196
1208
|
MatBadgeModule,
|
|
1197
1209
|
MatExpansionModule,
|
|
1198
|
-
MatFormFieldModule
|
|
1210
|
+
MatFormFieldModule,
|
|
1211
|
+
MatMenuModule
|
|
1199
1212
|
];
|
|
1200
1213
|
|
|
1201
1214
|
class ButtonComponent {
|
|
@@ -1629,20 +1642,48 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1629
1642
|
type: Output
|
|
1630
1643
|
}] } });
|
|
1631
1644
|
|
|
1645
|
+
class CircleProgressBar {
|
|
1646
|
+
percent = 0;
|
|
1647
|
+
showPercent = false;
|
|
1648
|
+
radius = 35;
|
|
1649
|
+
stroke = 10;
|
|
1650
|
+
normalizedRadius = this.radius - this.stroke / 2;
|
|
1651
|
+
circumference = 2 * Math.PI * this.normalizedRadius;
|
|
1652
|
+
get dashOffset() {
|
|
1653
|
+
const clamped = Math.max(0, Math.min(100, this.percent));
|
|
1654
|
+
return this.circumference - (clamped / 100) * this.circumference;
|
|
1655
|
+
}
|
|
1656
|
+
get ariaLabel() {
|
|
1657
|
+
return `${Math.round(this.percent)}%`;
|
|
1658
|
+
}
|
|
1659
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: CircleProgressBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1660
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: CircleProgressBar, isStandalone: false, selector: "fx-ui-circle-progress-bar", inputs: { percent: "percent", showPercent: "showPercent" }, ngImport: i0, template: "<div class=\"flex items-center justify-center w-full h-full\">\n <svg\n class=\"transform -rotate-90 block\"\n [attr.viewBox]=\"'0 0 ' + radius * 2 + ' ' + radius * 2\"\n width=\"100%\"\n height=\"100%\"\n >\n <circle\n class=\"opacity-20\"\n [attr.cx]=\"radius\"\n [attr.cy]=\"radius\"\n [attr.r]=\"normalizedRadius\"\n [attr.stroke-width]=\"stroke\"\n fill=\"transparent\"\n stroke=\"currentColor\"\n ></circle>\n\n <circle\n class=\"stroke-current\"\n [attr.cx]=\"radius\"\n [attr.cy]=\"radius\"\n [attr.r]=\"normalizedRadius\"\n [attr.stroke-width]=\"stroke\"\n fill=\"transparent\"\n stroke-linecap=\"round\"\n [attr.stroke-dasharray]=\"circumference\"\n [attr.stroke-dashoffset]=\"dashOffset\"\n style=\"transition: stroke-dashoffset 300ms linear\"\n ></circle>\n\n @if(showPercent){\n <text\n [attr.x]=\"radius\"\n [attr.y]=\"radius\"\n dominant-baseline=\"central\"\n text-anchor=\"middle\"\n class=\"text-xs font-medium\"\n fill=\"currentColor\"\n >\n {{ percent }}%\n </text>\n }\n </svg>\n</div>\n", styles: [""] });
|
|
1661
|
+
}
|
|
1662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: CircleProgressBar, decorators: [{
|
|
1663
|
+
type: Component,
|
|
1664
|
+
args: [{ selector: 'fx-ui-circle-progress-bar', standalone: false, template: "<div class=\"flex items-center justify-center w-full h-full\">\n <svg\n class=\"transform -rotate-90 block\"\n [attr.viewBox]=\"'0 0 ' + radius * 2 + ' ' + radius * 2\"\n width=\"100%\"\n height=\"100%\"\n >\n <circle\n class=\"opacity-20\"\n [attr.cx]=\"radius\"\n [attr.cy]=\"radius\"\n [attr.r]=\"normalizedRadius\"\n [attr.stroke-width]=\"stroke\"\n fill=\"transparent\"\n stroke=\"currentColor\"\n ></circle>\n\n <circle\n class=\"stroke-current\"\n [attr.cx]=\"radius\"\n [attr.cy]=\"radius\"\n [attr.r]=\"normalizedRadius\"\n [attr.stroke-width]=\"stroke\"\n fill=\"transparent\"\n stroke-linecap=\"round\"\n [attr.stroke-dasharray]=\"circumference\"\n [attr.stroke-dashoffset]=\"dashOffset\"\n style=\"transition: stroke-dashoffset 300ms linear\"\n ></circle>\n\n @if(showPercent){\n <text\n [attr.x]=\"radius\"\n [attr.y]=\"radius\"\n dominant-baseline=\"central\"\n text-anchor=\"middle\"\n class=\"text-xs font-medium\"\n fill=\"currentColor\"\n >\n {{ percent }}%\n </text>\n }\n </svg>\n</div>\n" }]
|
|
1665
|
+
}], propDecorators: { percent: [{
|
|
1666
|
+
type: Input
|
|
1667
|
+
}], showPercent: [{
|
|
1668
|
+
type: Input
|
|
1669
|
+
}] } });
|
|
1670
|
+
|
|
1632
1671
|
class DatetimePicker extends FxComponent {
|
|
1633
1672
|
ref;
|
|
1634
1673
|
label;
|
|
1635
1674
|
placeholder = 'Select date and time';
|
|
1636
1675
|
required = false;
|
|
1637
|
-
|
|
1638
|
-
format = 'YYYY-MM-DD HH:mm:ss';
|
|
1676
|
+
type = 'both';
|
|
1639
1677
|
disabled = false;
|
|
1640
1678
|
errorMessages = {};
|
|
1641
1679
|
validateFn;
|
|
1680
|
+
startAt;
|
|
1642
1681
|
constructor(ngControl, ref) {
|
|
1643
1682
|
super(ngControl);
|
|
1644
1683
|
this.ref = ref;
|
|
1645
1684
|
}
|
|
1685
|
+
ngOnInit() {
|
|
1686
|
+
}
|
|
1646
1687
|
ngAfterViewInit() {
|
|
1647
1688
|
setTimeout(() => {
|
|
1648
1689
|
this.ref.detectChanges();
|
|
@@ -1657,6 +1698,8 @@ class DatetimePicker extends FxComponent {
|
|
|
1657
1698
|
}
|
|
1658
1699
|
writeValue(value) {
|
|
1659
1700
|
this.value = value ?? '';
|
|
1701
|
+
this.startAt = value ?? '';
|
|
1702
|
+
console.log('startAt: ', this.startAt);
|
|
1660
1703
|
this.ref.markForCheck();
|
|
1661
1704
|
}
|
|
1662
1705
|
onValueChange(date) {
|
|
@@ -1664,23 +1707,22 @@ class DatetimePicker extends FxComponent {
|
|
|
1664
1707
|
return;
|
|
1665
1708
|
this.value = date;
|
|
1666
1709
|
this.onChange(date);
|
|
1710
|
+
console.log('date: ', date);
|
|
1667
1711
|
this.onTouched();
|
|
1668
1712
|
}
|
|
1669
1713
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: DatetimePicker, deps: [{ token: i1$3.NgControl }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1670
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
1714
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: DatetimePicker, isStandalone: false, selector: "fx-ui-datetime-picker", inputs: { label: "label", placeholder: "placeholder", required: "required", type: "type", disabled: "disabled", errorMessages: "errorMessages", validateFn: "validateFn" }, usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col mb-4 w-full text-left\">\n @if (label){\n <label class=\"txt-field-label\">\n {{ label }}\n <span *ngIf=\"required\" class=\"txt-required\">*</span>\n </label>\n }\n\n <div class=\"relative\">\n <input\n [owlDateTimeTrigger]=\"picker\"\n [owlDateTime]=\"picker\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n (blur)=\"onBlur()\"\n [value]=\"value\"\n readonly\n class=\"input-default\"\n />\n </div>\n <owl-date-time\n #picker\n [startAt]=\"startAt\"\n [pickerType]=\"type\"\n (afterPickerClosed)=\"onValueChange($event)\"\n ></owl-date-time>\n <div *ngIf=\"invalid\" class=\"txt-invalid\">{{ getErrorMessage(label) }}</div>\n</div>\n", styles: ["::ng-deep .owl-dt-container{border-radius:.75rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(var(--bg-primary-hover) / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));--tw-shadow: 0 20px 25px -5px rgb(var(--shadow-color) / .1), 0 10px 10px -5px rgb(var(--shadow-color) / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 10px 10px -5px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);width:320px!important}::ng-deep .owl-dt-calendar-table{width:100%;border-collapse:collapse}::ng-deep .owl-dt-calendar-table .owl-dt-calendar-cell{border-radius:.375rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(var(--text-secondary) / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}::ng-deep .owl-dt-calendar-table .owl-dt-calendar-cell:hover{background-color:#ef444433}::ng-deep .owl-dt-calendar-table .owl-dt-calendar-cell-selected{--tw-bg-opacity: 1;background-color:rgb(var(--border-selected) / var(--tw-bg-opacity, 1));font-weight:400;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-cell-today:not(.owl-dt-calendar-cell-selected){border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(var(--border-selected) / var(--tw-border-opacity, 1))}::ng-deep .owl-dt-timer-content .owl-dt-timer-input{border-radius:.5rem;--tw-border-opacity: 1;border-color:rgb(var(--border-strong) / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(var(--bg-primary) / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(var(--text-primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-control-period-button .owl-dt-control-button-arrow{display:none}:ng-deep .owl-dt-container-buttons button{height:2.25rem;--tw-bg-opacity: 1;background-color:rgb(var(--bg-primary-hover) / var(--tw-bg-opacity, 1));padding-top:1rem;padding-bottom:1rem}::ng-deep .owl-dt-container-control-button .owl-dt-control-button-content{margin-bottom:1rem;--tw-text-opacity: 1;color:rgb(var(--primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-control-content .owl-dt-control-button-content{--tw-text-opacity: 1;color:rgb(var(--text-primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-control-arrow-button .owl-dt-control-button-content{--tw-text-opacity: 1;color:rgb(var(--text-primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-header{margin-bottom:.5rem;text-align:center;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(var(--text-secondary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-table th{font-size:.75rem;line-height:1rem;font-weight:500;--tw-text-opacity: 1;color:rgb(var(--text-secondary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-inline-container,::ng-deep .owl-dt-popup-container{border-radius:.75rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(var(--border-strong) / var(--tw-border-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(var(--shadow-color) / .1), 0 4px 6px -4px rgb(var(--shadow-color) / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.OwlDateTimeTriggerDirective, selector: "[owlDateTimeTrigger]", inputs: ["owlDateTimeTrigger", "disabled"] }, { kind: "directive", type: i3.OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["required", "owlDateTime", "owlDateTimeFilter", "_disabled", "min", "max", "selectMode", "rangeSeparator", "value", "values"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { kind: "component", type: i3.OwlDateTimeComponent, selector: "owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "endAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "beforePickerOpen", "afterPickerOpen", "yearSelected", "monthSelected", "dateSelected"], exportAs: ["owlDateTime"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1671
1715
|
}
|
|
1672
1716
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: DatetimePicker, decorators: [{
|
|
1673
1717
|
type: Component,
|
|
1674
|
-
args: [{ selector: 'fx-ui-datetime-picker', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col mb-4 w-full text-left\">\n
|
|
1718
|
+
args: [{ selector: 'fx-ui-datetime-picker', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col mb-4 w-full text-left\">\n @if (label){\n <label class=\"txt-field-label\">\n {{ label }}\n <span *ngIf=\"required\" class=\"txt-required\">*</span>\n </label>\n }\n\n <div class=\"relative\">\n <input\n [owlDateTimeTrigger]=\"picker\"\n [owlDateTime]=\"picker\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n (blur)=\"onBlur()\"\n [value]=\"value\"\n readonly\n class=\"input-default\"\n />\n </div>\n <owl-date-time\n #picker\n [startAt]=\"startAt\"\n [pickerType]=\"type\"\n (afterPickerClosed)=\"onValueChange($event)\"\n ></owl-date-time>\n <div *ngIf=\"invalid\" class=\"txt-invalid\">{{ getErrorMessage(label) }}</div>\n</div>\n", styles: ["::ng-deep .owl-dt-container{border-radius:.75rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(var(--bg-primary-hover) / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));--tw-shadow: 0 20px 25px -5px rgb(var(--shadow-color) / .1), 0 10px 10px -5px rgb(var(--shadow-color) / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 10px 10px -5px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);width:320px!important}::ng-deep .owl-dt-calendar-table{width:100%;border-collapse:collapse}::ng-deep .owl-dt-calendar-table .owl-dt-calendar-cell{border-radius:.375rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(var(--text-secondary) / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}::ng-deep .owl-dt-calendar-table .owl-dt-calendar-cell:hover{background-color:#ef444433}::ng-deep .owl-dt-calendar-table .owl-dt-calendar-cell-selected{--tw-bg-opacity: 1;background-color:rgb(var(--border-selected) / var(--tw-bg-opacity, 1));font-weight:400;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-cell-today:not(.owl-dt-calendar-cell-selected){border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(var(--border-selected) / var(--tw-border-opacity, 1))}::ng-deep .owl-dt-timer-content .owl-dt-timer-input{border-radius:.5rem;--tw-border-opacity: 1;border-color:rgb(var(--border-strong) / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(var(--bg-primary) / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(var(--text-primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-control-period-button .owl-dt-control-button-arrow{display:none}:ng-deep .owl-dt-container-buttons button{height:2.25rem;--tw-bg-opacity: 1;background-color:rgb(var(--bg-primary-hover) / var(--tw-bg-opacity, 1));padding-top:1rem;padding-bottom:1rem}::ng-deep .owl-dt-container-control-button .owl-dt-control-button-content{margin-bottom:1rem;--tw-text-opacity: 1;color:rgb(var(--primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-control-content .owl-dt-control-button-content{--tw-text-opacity: 1;color:rgb(var(--text-primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-control-arrow-button .owl-dt-control-button-content{--tw-text-opacity: 1;color:rgb(var(--text-primary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-header{margin-bottom:.5rem;text-align:center;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(var(--text-secondary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-calendar-table th{font-size:.75rem;line-height:1rem;font-weight:500;--tw-text-opacity: 1;color:rgb(var(--text-secondary) / var(--tw-text-opacity, 1))}::ng-deep .owl-dt-inline-container,::ng-deep .owl-dt-popup-container{border-radius:.75rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(var(--border-strong) / var(--tw-border-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(var(--shadow-color) / .1), 0 4px 6px -4px rgb(var(--shadow-color) / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}\n"] }]
|
|
1675
1719
|
}], ctorParameters: () => [{ type: i1$3.NgControl }, { type: i0.ChangeDetectorRef }], propDecorators: { label: [{
|
|
1676
1720
|
type: Input
|
|
1677
1721
|
}], placeholder: [{
|
|
1678
1722
|
type: Input
|
|
1679
1723
|
}], required: [{
|
|
1680
1724
|
type: Input
|
|
1681
|
-
}],
|
|
1682
|
-
type: Input
|
|
1683
|
-
}], format: [{
|
|
1725
|
+
}], type: [{
|
|
1684
1726
|
type: Input
|
|
1685
1727
|
}], disabled: [{
|
|
1686
1728
|
type: Input
|
|
@@ -1734,16 +1776,27 @@ class DndUploadComponent {
|
|
|
1734
1776
|
return;
|
|
1735
1777
|
const files = Array.from(input.files);
|
|
1736
1778
|
this.processFiles(files);
|
|
1737
|
-
input.value = '';
|
|
1779
|
+
input.value = '';
|
|
1738
1780
|
}
|
|
1739
1781
|
processFiles(files) {
|
|
1740
1782
|
const valid = [];
|
|
1783
|
+
const acceptedTypes = this.accept
|
|
1784
|
+
.split(',')
|
|
1785
|
+
.map(t => t.trim().toLowerCase())
|
|
1786
|
+
.filter(t => t);
|
|
1741
1787
|
for (const file of files) {
|
|
1742
1788
|
const sizeMB = file.size / 1024 / 1024;
|
|
1743
1789
|
if (this.strictSize && sizeMB > this.maxSizeMB) {
|
|
1744
1790
|
this.uploadError.emit({
|
|
1745
1791
|
file,
|
|
1746
|
-
reason: `File too large: ${
|
|
1792
|
+
reason: `File too large: ${sizeMB.toFixed(2)} MB > ${this.maxSizeMB} MB`
|
|
1793
|
+
});
|
|
1794
|
+
continue;
|
|
1795
|
+
}
|
|
1796
|
+
if (acceptedTypes.length && !this.isAccepted(file, acceptedTypes)) {
|
|
1797
|
+
this.uploadError.emit({
|
|
1798
|
+
file,
|
|
1799
|
+
reason: `File type not allowed: "${file.name}"`
|
|
1747
1800
|
});
|
|
1748
1801
|
continue;
|
|
1749
1802
|
}
|
|
@@ -1758,6 +1811,19 @@ class DndUploadComponent {
|
|
|
1758
1811
|
console.log('Uploading files:', files);
|
|
1759
1812
|
this.uploadComplete.emit(files);
|
|
1760
1813
|
}
|
|
1814
|
+
isAccepted(file, accepted) {
|
|
1815
|
+
const fileType = file.type.toLowerCase();
|
|
1816
|
+
const fileExt = '.' + file.name.split('.').pop().toLowerCase();
|
|
1817
|
+
return accepted.some(a => {
|
|
1818
|
+
if (a.startsWith('.')) {
|
|
1819
|
+
return a === fileExt;
|
|
1820
|
+
}
|
|
1821
|
+
if (a.endsWith('/*')) {
|
|
1822
|
+
return fileType.startsWith(a.replace('/*', ''));
|
|
1823
|
+
}
|
|
1824
|
+
return a === fileType;
|
|
1825
|
+
});
|
|
1826
|
+
}
|
|
1761
1827
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: DndUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1762
1828
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: DndUploadComponent, isStandalone: false, selector: "fx-ui-dnd-upload", inputs: { multiple: "multiple", accept: "accept", maxSizeMB: "maxSizeMB", strictSize: "strictSize" }, outputs: { fileDrop: "fileDrop", fileClick: "fileClick", uploadComplete: "uploadComplete", uploadError: "uploadError" }, ngImport: i0, template: "<div\n class=\"block w-full\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\"\n>\n <div\n role=\"button\"\n tabindex=\"0\"\n class=\"flex flex-col items-center justify-center gap-1 border-2 border-dashed rounded-md p-4 cursor-pointer select-none outline-none focus:ring-2 focus:ring-primary\"\n [ngClass]=\"{\n 'border-border-default bg-bg-hover': !isDragOver,\n 'border-border-interactive bg-secondary': isDragOver\n }\"\n (click)=\"onAreaClick(fileInput, $event)\"\n (keydown.enter)=\"onAreaClick(fileInput, $event)\"\n >\n <div class=\"text-sm text-text-link font-medium\">\n Click to upload <span class=\"text-text-secondary opacity-50\">or drag and drop</span>\n </div>\n <div class=\"text-xs text-text-secondary\">\n Allowed: {{ accept || 'any file type' }} (max {{ maxSizeMB }} MB)\n </div>\n\n <input\n #fileInput\n type=\"file\"\n class=\"hidden\"\n [attr.multiple]=\"multiple ? '' : null\"\n [attr.accept]=\"accept\"\n (change)=\"onFileSelected($event)\"\n />\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
1763
1829
|
}
|
|
@@ -1782,6 +1848,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1782
1848
|
type: Output
|
|
1783
1849
|
}] } });
|
|
1784
1850
|
|
|
1851
|
+
class FlowConnection {
|
|
1852
|
+
nodes = [];
|
|
1853
|
+
edges = [];
|
|
1854
|
+
backgroundColor = '--bg-hover-primary';
|
|
1855
|
+
view = ['100%', '400px'];
|
|
1856
|
+
handleConnection(connection) {
|
|
1857
|
+
this.edges = [
|
|
1858
|
+
...this.edges,
|
|
1859
|
+
{
|
|
1860
|
+
id: `${connection.source} -> ${connection.target}`,
|
|
1861
|
+
...connection,
|
|
1862
|
+
},
|
|
1863
|
+
];
|
|
1864
|
+
}
|
|
1865
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FlowConnection, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1866
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: FlowConnection, isStandalone: false, selector: "fx-ui-flow-connection", inputs: { nodes: "nodes", edges: "edges", backgroundColor: "backgroundColor", view: "view" }, ngImport: i0, template: "<vflow\n [background]=\"{\n type: 'solid',\n color: `rgba(var(${backgroundColor})`\n}\"\n [nodes]=\"nodes\"\n [edges]=\"edges\"\n (onConnect)=\"handleConnection($event)\"\n [view]=\"view\"\n/>\n", styles: [""], dependencies: [{ kind: "component", type: i26.VflowComponent, selector: "vflow", inputs: ["view", "minZoom", "maxZoom", "background", "optimization", "entitiesSelectable", "keyboardShortcuts", "connection", "snapGrid", "elevateNodesOnSelect", "elevateEdgesOnSelect", "nodes", "alignmentHelper", "edges"], outputs: ["onComponentNodeEvent"] }, { kind: "directive", type: i26.ConnectionControllerDirective, selector: "[onConnect], [onReconnect]", outputs: ["onConnect", "onReconnect"] }] });
|
|
1867
|
+
}
|
|
1868
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FlowConnection, decorators: [{
|
|
1869
|
+
type: Component,
|
|
1870
|
+
args: [{ selector: 'fx-ui-flow-connection', standalone: false, template: "<vflow\n [background]=\"{\n type: 'solid',\n color: `rgba(var(${backgroundColor})`\n}\"\n [nodes]=\"nodes\"\n [edges]=\"edges\"\n (onConnect)=\"handleConnection($event)\"\n [view]=\"view\"\n/>\n" }]
|
|
1871
|
+
}], propDecorators: { nodes: [{
|
|
1872
|
+
type: Input
|
|
1873
|
+
}], edges: [{
|
|
1874
|
+
type: Input
|
|
1875
|
+
}], backgroundColor: [{
|
|
1876
|
+
type: Input
|
|
1877
|
+
}], view: [{
|
|
1878
|
+
type: Input
|
|
1879
|
+
}] } });
|
|
1880
|
+
|
|
1785
1881
|
class InputComponent extends FxComponent {
|
|
1786
1882
|
ref;
|
|
1787
1883
|
label = '';
|
|
@@ -2566,6 +2662,109 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2566
2662
|
type: Input
|
|
2567
2663
|
}] } });
|
|
2568
2664
|
|
|
2665
|
+
class TreeDiagram {
|
|
2666
|
+
zone;
|
|
2667
|
+
cdr;
|
|
2668
|
+
data;
|
|
2669
|
+
container;
|
|
2670
|
+
root;
|
|
2671
|
+
children;
|
|
2672
|
+
lines = [];
|
|
2673
|
+
svgWidth = 0;
|
|
2674
|
+
svgHeight = 0;
|
|
2675
|
+
resizeObserver;
|
|
2676
|
+
rafId;
|
|
2677
|
+
constructor(zone, cdr) {
|
|
2678
|
+
this.zone = zone;
|
|
2679
|
+
this.cdr = cdr;
|
|
2680
|
+
}
|
|
2681
|
+
ngAfterViewInit() {
|
|
2682
|
+
this.zone.runOutsideAngular(() => {
|
|
2683
|
+
this.resizeObserver = new ResizeObserver((entries) => {
|
|
2684
|
+
const rect = entries[0].contentRect;
|
|
2685
|
+
if (rect.width === 0 || rect.height === 0)
|
|
2686
|
+
return;
|
|
2687
|
+
this.scheduleDraw();
|
|
2688
|
+
});
|
|
2689
|
+
this.resizeObserver.observe(this.container.nativeElement);
|
|
2690
|
+
setTimeout(() => this.scheduleDraw(), 50);
|
|
2691
|
+
setTimeout(() => this.scheduleDraw(), 150);
|
|
2692
|
+
});
|
|
2693
|
+
this.children.changes.subscribe(() => this.scheduleDraw());
|
|
2694
|
+
}
|
|
2695
|
+
ngOnDestroy() {
|
|
2696
|
+
this.resizeObserver?.disconnect();
|
|
2697
|
+
if (this.rafId)
|
|
2698
|
+
cancelAnimationFrame(this.rafId);
|
|
2699
|
+
}
|
|
2700
|
+
scheduleDraw() {
|
|
2701
|
+
if (this.rafId)
|
|
2702
|
+
cancelAnimationFrame(this.rafId);
|
|
2703
|
+
this.rafId = requestAnimationFrame(() => {
|
|
2704
|
+
this.drawLines();
|
|
2705
|
+
});
|
|
2706
|
+
}
|
|
2707
|
+
drawLines() {
|
|
2708
|
+
if (!this.root || !this.children.length)
|
|
2709
|
+
return;
|
|
2710
|
+
const containerEl = this.container.nativeElement;
|
|
2711
|
+
const rect = containerEl.getBoundingClientRect();
|
|
2712
|
+
if (rect.width === 0 || rect.height === 0)
|
|
2713
|
+
return;
|
|
2714
|
+
const rootRect = this.root.nativeElement.getBoundingClientRect();
|
|
2715
|
+
const rootX = rootRect.left + rootRect.width / 2 - rect.left;
|
|
2716
|
+
const rootBottomY = rootRect.bottom - rect.top;
|
|
2717
|
+
const childRects = this.children.map(c => c.nativeElement.getBoundingClientRect());
|
|
2718
|
+
const childCenters = childRects.map(r => ({
|
|
2719
|
+
x: r.left + r.width / 2 - rect.left,
|
|
2720
|
+
y: r.top - rect.top
|
|
2721
|
+
}));
|
|
2722
|
+
const horizontalY = childCenters[0].y - 24;
|
|
2723
|
+
this.zone.run(() => {
|
|
2724
|
+
this.svgWidth = rect.width;
|
|
2725
|
+
this.svgHeight = rect.height;
|
|
2726
|
+
this.lines = [
|
|
2727
|
+
{
|
|
2728
|
+
x1: rootX,
|
|
2729
|
+
y1: rootBottomY,
|
|
2730
|
+
x2: rootX,
|
|
2731
|
+
y2: horizontalY
|
|
2732
|
+
},
|
|
2733
|
+
{
|
|
2734
|
+
x1: childCenters[0].x,
|
|
2735
|
+
y1: horizontalY,
|
|
2736
|
+
x2: childCenters[childCenters.length - 1].x,
|
|
2737
|
+
y2: horizontalY
|
|
2738
|
+
},
|
|
2739
|
+
...childCenters.map(c => ({
|
|
2740
|
+
x1: c.x,
|
|
2741
|
+
y1: horizontalY,
|
|
2742
|
+
x2: c.x,
|
|
2743
|
+
y2: c.y
|
|
2744
|
+
}))
|
|
2745
|
+
];
|
|
2746
|
+
});
|
|
2747
|
+
this.cdr.detectChanges();
|
|
2748
|
+
}
|
|
2749
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TreeDiagram, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2750
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: TreeDiagram, isStandalone: false, selector: "fx-ui-tree-diagram", inputs: { data: "data" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "root", first: true, predicate: ["root"], descendants: true }, { propertyName: "children", predicate: ["child"], descendants: true }], ngImport: i0, template: "<div class=\"relative p-8\" #container>\n\n <!-- ROOT -->\n <div\n #root\n class=\"mx-auto w-fit bg-blue-600 text-white px-7 py-3 rounded-md font-semibold text-center\"\n >\n {{ data.label }}\n </div>\n\n <!-- CHILDREN -->\n <div class=\"mt-16 flex justify-center gap-16\">\n <div\n *ngFor=\"let child of data.children\"\n #child\n class=\"w-48 bg-rose-600 text-white px-4 py-4 rounded-lg text-center\"\n >\n <div class=\"font-semibold text-lg\">{{ child.label }}</div>\n <div class=\"mt-1 text-sm opacity-90\">{{ child.status }}</div>\n </div>\n </div>\n\n <!-- SVG CONNECTORS -->\n <svg\n class=\"absolute inset-0 pointer-events-none\"\n [attr.width]=\"svgWidth\"\n [attr.height]=\"svgHeight\"\n >\n <line\n *ngFor=\"let line of lines\"\n [attr.x1]=\"line.x1\"\n [attr.y1]=\"line.y1\"\n [attr.x2]=\"line.x2\"\n [attr.y2]=\"line.y2\"\n stroke=\"#1f2937\"\n stroke-width=\"2\"\n />\n </svg>\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
2751
|
+
}
|
|
2752
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TreeDiagram, decorators: [{
|
|
2753
|
+
type: Component,
|
|
2754
|
+
args: [{ selector: 'fx-ui-tree-diagram', standalone: false, template: "<div class=\"relative p-8\" #container>\n\n <!-- ROOT -->\n <div\n #root\n class=\"mx-auto w-fit bg-blue-600 text-white px-7 py-3 rounded-md font-semibold text-center\"\n >\n {{ data.label }}\n </div>\n\n <!-- CHILDREN -->\n <div class=\"mt-16 flex justify-center gap-16\">\n <div\n *ngFor=\"let child of data.children\"\n #child\n class=\"w-48 bg-rose-600 text-white px-4 py-4 rounded-lg text-center\"\n >\n <div class=\"font-semibold text-lg\">{{ child.label }}</div>\n <div class=\"mt-1 text-sm opacity-90\">{{ child.status }}</div>\n </div>\n </div>\n\n <!-- SVG CONNECTORS -->\n <svg\n class=\"absolute inset-0 pointer-events-none\"\n [attr.width]=\"svgWidth\"\n [attr.height]=\"svgHeight\"\n >\n <line\n *ngFor=\"let line of lines\"\n [attr.x1]=\"line.x1\"\n [attr.y1]=\"line.y1\"\n [attr.x2]=\"line.x2\"\n [attr.y2]=\"line.y2\"\n stroke=\"#1f2937\"\n stroke-width=\"2\"\n />\n </svg>\n\n</div>\n" }]
|
|
2755
|
+
}], ctorParameters: () => [{ type: i0.NgZone }, { type: i0.ChangeDetectorRef }], propDecorators: { data: [{
|
|
2756
|
+
type: Input
|
|
2757
|
+
}], container: [{
|
|
2758
|
+
type: ViewChild,
|
|
2759
|
+
args: ['container']
|
|
2760
|
+
}], root: [{
|
|
2761
|
+
type: ViewChild,
|
|
2762
|
+
args: ['root']
|
|
2763
|
+
}], children: [{
|
|
2764
|
+
type: ViewChildren,
|
|
2765
|
+
args: ['child']
|
|
2766
|
+
}] } });
|
|
2767
|
+
|
|
2569
2768
|
const FX_COMPONENTS = [
|
|
2570
2769
|
InputComponent,
|
|
2571
2770
|
SelectComponent,
|
|
@@ -2587,7 +2786,10 @@ const FX_COMPONENTS = [
|
|
|
2587
2786
|
SliderComponent,
|
|
2588
2787
|
SwitchComponent,
|
|
2589
2788
|
RichTextAreaComponent,
|
|
2590
|
-
SkeletonTableLoadingComponent
|
|
2789
|
+
SkeletonTableLoadingComponent,
|
|
2790
|
+
FlowConnection,
|
|
2791
|
+
CircleProgressBar,
|
|
2792
|
+
TreeDiagram,
|
|
2591
2793
|
];
|
|
2592
2794
|
|
|
2593
2795
|
class ConfirmationDialogComponent {
|
|
@@ -2632,48 +2834,49 @@ const DIALOGS_COMPONENT = [
|
|
|
2632
2834
|
ConfirmationDialogComponent
|
|
2633
2835
|
];
|
|
2634
2836
|
|
|
2635
|
-
const
|
|
2636
|
-
parseInput: 'YYYY-MM-DD
|
|
2637
|
-
fullPickerInput: 'YYYY-MM-DD HH:mm
|
|
2638
|
-
datePickerInput: 'YYYY-MM-DD
|
|
2639
|
-
timePickerInput: 'HH:mm
|
|
2837
|
+
const MY_MOMENT_FORMATS = {
|
|
2838
|
+
parseInput: 'YYYY-MM-DD',
|
|
2839
|
+
fullPickerInput: 'YYYY-MM-DD HH:mm',
|
|
2840
|
+
datePickerInput: 'YYYY-MM-DD',
|
|
2841
|
+
timePickerInput: 'HH:mm',
|
|
2640
2842
|
monthYearLabel: 'MMM YYYY',
|
|
2641
|
-
dateA11yLabel: '
|
|
2843
|
+
dateA11yLabel: 'LL',
|
|
2642
2844
|
monthYearA11yLabel: 'MMMM YYYY',
|
|
2643
2845
|
};
|
|
2644
2846
|
class UiModule {
|
|
2645
2847
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: UiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
2646
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: UiModule, declarations: [InputComponent, SelectComponent, RadioButtonComponent, CheckboxComponent, DndUploadComponent, ButtonComponent, RadioButtonToggleComponent, DatetimePicker, LoadingPanel, SearchBarComponent, TabGroupComponent, TabComponent, HeroIconComponent, ToastComponent, ToastContainerComponent, TagComponent, ChartComponent, SliderComponent, SwitchComponent, RichTextAreaComponent, SkeletonTableLoadingComponent, ConfirmationDialogComponent], imports: [CommonModule,
|
|
2848
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: UiModule, declarations: [InputComponent, SelectComponent, RadioButtonComponent, CheckboxComponent, DndUploadComponent, ButtonComponent, RadioButtonToggleComponent, DatetimePicker, LoadingPanel, SearchBarComponent, TabGroupComponent, TabComponent, HeroIconComponent, ToastComponent, ToastContainerComponent, TagComponent, ChartComponent, SliderComponent, SwitchComponent, RichTextAreaComponent, SkeletonTableLoadingComponent, FlowConnection, CircleProgressBar, TreeDiagram, ConfirmationDialogComponent], imports: [CommonModule,
|
|
2647
2849
|
FormsModule,
|
|
2648
2850
|
ReactiveFormsModule,
|
|
2649
2851
|
OwlDateTimeModule,
|
|
2650
2852
|
OwlNativeDateTimeModule,
|
|
2853
|
+
OwlMomentDateTimeModule,
|
|
2651
2854
|
HasPermissionDirective,
|
|
2652
2855
|
TrimOnBlurDirective,
|
|
2653
|
-
NgHeroiconsModule, i2$3.NgxEchartsModule, i3$1.MatSelectModule,
|
|
2856
|
+
NgHeroiconsModule, i26.VflowComponent, i26.HandleComponent, i26.ResizableComponent, i26.SelectableDirective, i26.MiniMapComponent, i26.NodeToolbarComponent, i26.CustomTemplateEdgeComponent, i26.DragHandleDirective, i26.ConnectionControllerDirective, i26.NodeHtmlTemplateDirective, i26.NodeSvgTemplateDirective, i26.GroupNodeTemplateDirective, i26.EdgeLabelHtmlTemplateDirective, i26.EdgeTemplateDirective, i26.ConnectionTemplateDirective, i26.HandleTemplateDirective, i2$3.NgxEchartsModule, i3$1.MatSelectModule, i29.MatRadioModule, i30.MatButtonModule, i31.MatIconModule, i32.MatPaginatorModule, i33.MatTableModule, i34.MatSnackBarModule, i1$1.MatDialogModule, i36.MatCheckboxModule, i37.MatCardModule, i38.MatDatepickerModule, i39.MatTimepickerModule, i40.MatBadgeModule, i41.MatExpansionModule, i42.MatFormFieldModule, i43.MatMenuModule], exports: [InputComponent, SelectComponent, RadioButtonComponent, CheckboxComponent, DndUploadComponent, ButtonComponent, RadioButtonToggleComponent, DatetimePicker, LoadingPanel, SearchBarComponent, TabGroupComponent, TabComponent, HeroIconComponent, ToastComponent, ToastContainerComponent, TagComponent, ChartComponent, SliderComponent, SwitchComponent, RichTextAreaComponent, SkeletonTableLoadingComponent, FlowConnection, CircleProgressBar, TreeDiagram, ConfirmationDialogComponent,
|
|
2654
2857
|
// Module
|
|
2655
2858
|
FormsModule,
|
|
2656
2859
|
ReactiveFormsModule,
|
|
2657
2860
|
OwlDateTimeModule,
|
|
2658
2861
|
OwlNativeDateTimeModule,
|
|
2659
2862
|
HasPermissionDirective,
|
|
2660
|
-
NgHeroiconsModule, i3$1.MatSelectModule,
|
|
2863
|
+
NgHeroiconsModule, i3$1.MatSelectModule, i29.MatRadioModule, i30.MatButtonModule, i31.MatIconModule, i32.MatPaginatorModule, i33.MatTableModule, i34.MatSnackBarModule, i1$1.MatDialogModule, i36.MatCheckboxModule, i37.MatCardModule, i38.MatDatepickerModule, i39.MatTimepickerModule, i40.MatBadgeModule, i41.MatExpansionModule, i42.MatFormFieldModule, i43.MatMenuModule] });
|
|
2661
2864
|
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: UiModule, providers: [
|
|
2662
2865
|
importProvidersFrom(NgHeroiconsModule.forRoot()),
|
|
2663
|
-
|
|
2866
|
+
{ provide: OWL_DATE_TIME_FORMATS, useValue: MY_MOMENT_FORMATS },
|
|
2664
2867
|
], imports: [CommonModule,
|
|
2665
2868
|
FormsModule,
|
|
2666
2869
|
ReactiveFormsModule,
|
|
2667
2870
|
OwlDateTimeModule,
|
|
2668
2871
|
OwlNativeDateTimeModule,
|
|
2669
|
-
|
|
2670
|
-
NgxEchartsModule.forRoot({ echarts: () => import('echarts') }), MATERIAL_MODULE,
|
|
2872
|
+
OwlMomentDateTimeModule,
|
|
2873
|
+
NgHeroiconsModule, i26.VflowComponent, i26.HandleComponent, i26.ResizableComponent, i26.MiniMapComponent, i26.NodeToolbarComponent, i26.CustomTemplateEdgeComponent, NgxEchartsModule.forRoot({ echarts: () => import('echarts') }), MATERIAL_MODULE,
|
|
2671
2874
|
// Module
|
|
2672
2875
|
FormsModule,
|
|
2673
2876
|
ReactiveFormsModule,
|
|
2674
2877
|
OwlDateTimeModule,
|
|
2675
2878
|
OwlNativeDateTimeModule,
|
|
2676
|
-
NgHeroiconsModule, i3$1.MatSelectModule,
|
|
2879
|
+
NgHeroiconsModule, i3$1.MatSelectModule, i29.MatRadioModule, i30.MatButtonModule, i31.MatIconModule, i32.MatPaginatorModule, i33.MatTableModule, i34.MatSnackBarModule, i1$1.MatDialogModule, i36.MatCheckboxModule, i37.MatCardModule, i38.MatDatepickerModule, i39.MatTimepickerModule, i40.MatBadgeModule, i41.MatExpansionModule, i42.MatFormFieldModule, i43.MatMenuModule] });
|
|
2677
2880
|
}
|
|
2678
2881
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: UiModule, decorators: [{
|
|
2679
2882
|
type: NgModule,
|
|
@@ -2685,9 +2888,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2685
2888
|
ReactiveFormsModule,
|
|
2686
2889
|
OwlDateTimeModule,
|
|
2687
2890
|
OwlNativeDateTimeModule,
|
|
2891
|
+
OwlMomentDateTimeModule,
|
|
2688
2892
|
HasPermissionDirective,
|
|
2689
2893
|
TrimOnBlurDirective,
|
|
2690
2894
|
NgHeroiconsModule,
|
|
2895
|
+
...Vflow,
|
|
2691
2896
|
NgxEchartsModule.forRoot({ echarts: () => import('echarts') }),
|
|
2692
2897
|
...MATERIAL_MODULE,
|
|
2693
2898
|
],
|
|
@@ -2706,7 +2911,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2706
2911
|
],
|
|
2707
2912
|
providers: [
|
|
2708
2913
|
importProvidersFrom(NgHeroiconsModule.forRoot()),
|
|
2709
|
-
|
|
2914
|
+
{ provide: OWL_DATE_TIME_FORMATS, useValue: MY_MOMENT_FORMATS },
|
|
2710
2915
|
],
|
|
2711
2916
|
}]
|
|
2712
2917
|
}] });
|
|
@@ -2719,5 +2924,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2719
2924
|
* Generated bundle index. Do not edit.
|
|
2720
2925
|
*/
|
|
2721
2926
|
|
|
2722
|
-
export { AuthInterceptor, AuthStateService, BaseComponent, BaseDialogComponent, BaseResolver, BaseTableComponent, BreadcrumbService, ButtonComponent, ChartComponent, CheckboxComponent, ConfirmationDialogComponent, DatetimePicker, DndUploadComponent, FxLoadingService, FxStorageService, FxToastrService, FxUtils, HasPermissionDirective, HeroIconComponent, HttpLoaderFactory, HttpWrapper, InputComponent, LoadingPanel,
|
|
2927
|
+
export { AuthInterceptor, AuthStateService, BaseComponent, BaseDialogComponent, BaseResolver, BaseTableComponent, BreadcrumbService, ButtonComponent, ChartComponent, CheckboxComponent, CircleProgressBar, ConfirmationDialogComponent, DatetimePicker, DndUploadComponent, FlowConnection, FxLoadingService, FxStorageService, FxToastrService, FxUtils, HasPermissionDirective, HeroIconComponent, HttpLoaderFactory, HttpWrapper, InputComponent, LoadingPanel, MY_MOMENT_FORMATS, PermissionGuard, PermissionService, QuillStyleLoaderService, RadioButtonComponent, RadioButtonToggleComponent, RichTextAreaComponent, SearchBarComponent, SelectComponent, SkeletonTableLoadingComponent, SliderComponent, SwitchComponent, TabComponent, TabGroupComponent, TagComponent, ToastComponent, ToastContainerComponent, TranslationModule, TranslationService, TreeDiagram, TrimOnBlurDirective, UiModule };
|
|
2723
2928
|
//# sourceMappingURL=fxlt-common-ui.mjs.map
|