@morozeckiy/dd-lib 0.7.84 → 0.7.87
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.
|
@@ -826,7 +826,7 @@ class ClickOutsideDirective {
|
|
|
826
826
|
}
|
|
827
827
|
}
|
|
828
828
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ClickOutsideDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
829
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.2", type: ClickOutsideDirective, isStandalone: true, selector: "[ddClickOutside]", inputs: { elements: "elements" }, outputs: { ddClickOutside: "ddClickOutside" }, host: { listeners: { "document:
|
|
829
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.2", type: ClickOutsideDirective, isStandalone: true, selector: "[ddClickOutside]", inputs: { elements: "elements" }, outputs: { ddClickOutside: "ddClickOutside" }, host: { listeners: { "document:mouseup": "onClick($event)" } }, ngImport: i0 }); }
|
|
830
830
|
}
|
|
831
831
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ClickOutsideDirective, decorators: [{
|
|
832
832
|
type: Directive,
|
|
@@ -840,7 +840,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
|
|
|
840
840
|
type: Output
|
|
841
841
|
}], onClick: [{
|
|
842
842
|
type: HostListener,
|
|
843
|
-
args: ['document:
|
|
843
|
+
args: ['document:mouseup', ['$event']]
|
|
844
844
|
}] } });
|
|
845
845
|
|
|
846
846
|
class ResizeTextareaDirective {
|
|
@@ -3140,6 +3140,7 @@ class LibPeriodComponent {
|
|
|
3140
3140
|
this.calendarIsShown = false;
|
|
3141
3141
|
this.periodIsSelected = false;
|
|
3142
3142
|
this.calendarIsSelected = false;
|
|
3143
|
+
this.periodName = 'Период';
|
|
3143
3144
|
}
|
|
3144
3145
|
ngOnInit() {
|
|
3145
3146
|
this.idPeriod = 'period-wrapper-' + LibPeriodComponent.idCounter++;
|
|
@@ -3164,6 +3165,7 @@ class LibPeriodComponent {
|
|
|
3164
3165
|
this.selectedPeriod = undefined;
|
|
3165
3166
|
this.selectedDate = undefined;
|
|
3166
3167
|
this.setPeriodDate.emit(null);
|
|
3168
|
+
this.periodName = 'Период';
|
|
3167
3169
|
}
|
|
3168
3170
|
selectPeriod(type) {
|
|
3169
3171
|
this.periodIsShown = false;
|
|
@@ -3171,8 +3173,11 @@ class LibPeriodComponent {
|
|
|
3171
3173
|
this.periodIsSelected = true;
|
|
3172
3174
|
this.calendarIsSelected = false;
|
|
3173
3175
|
const date = this.dateService.getFormattedDate(type);
|
|
3176
|
+
console.log(type, date);
|
|
3174
3177
|
this.propagateChange(type);
|
|
3175
3178
|
this.setPeriodDate.emit({ [type]: date });
|
|
3179
|
+
const menu = this.dateService.getPeriodMenu(type).find(f => f.active);
|
|
3180
|
+
this.periodName = menu?.title;
|
|
3176
3181
|
}
|
|
3177
3182
|
writeValue(value) {
|
|
3178
3183
|
this.selectedPeriod = value;
|
|
@@ -3181,6 +3186,7 @@ class LibPeriodComponent {
|
|
|
3181
3186
|
selectDate($event) {
|
|
3182
3187
|
this.calendarIsShown = false;
|
|
3183
3188
|
if ($event) {
|
|
3189
|
+
this.periodName = 'за ' + format($event, 'dd.MM.yyyy');
|
|
3184
3190
|
this.selectedPeriod = 'calendar';
|
|
3185
3191
|
this.propagateChange(this.selectedPeriod);
|
|
3186
3192
|
this.periodIsShown = false;
|
|
@@ -3189,6 +3195,7 @@ class LibPeriodComponent {
|
|
|
3189
3195
|
this.setPeriodDate.emit({ calendar: format($event, DEFAULT_FORMAT) });
|
|
3190
3196
|
}
|
|
3191
3197
|
else {
|
|
3198
|
+
this.periodName = 'Период';
|
|
3192
3199
|
this.selectedDate = undefined;
|
|
3193
3200
|
this.setPeriodDate.emit(null);
|
|
3194
3201
|
if (!this.selectedPeriod) {
|
|
@@ -3211,7 +3218,7 @@ class LibPeriodComponent {
|
|
|
3211
3218
|
useExisting: forwardRef(() => LibPeriodComponent),
|
|
3212
3219
|
multi: true,
|
|
3213
3220
|
},
|
|
3214
|
-
], ngImport: i0, template: "<div class=\"pos-relative\">\r\n <dd-lib-filter-button\r\n (clearEvent)=\"clearPeriod()\"\r\n (clickEvent)=\"showPeriod()\"\r\n [active]=\"periodIsSelected || calendarIsSelected\"\r\n [id]=\"idPeriod\"\r\n btnColor=\"transparent\">\r\n <div
|
|
3221
|
+
], ngImport: i0, template: "<div class=\"pos-relative\">\r\n <dd-lib-filter-button\r\n (clearEvent)=\"clearPeriod()\"\r\n (clickEvent)=\"showPeriod()\"\r\n [active]=\"periodIsSelected || calendarIsSelected\"\r\n [id]=\"idPeriod\"\r\n btnColor=\"transparent\">\r\n <div>{{ periodName }}</div>\r\n </dd-lib-filter-button>\r\n @if (periodIsShown) {\r\n <div (ddClickOutside)=\"clickOutside($event)\" [elements]=\"[idPeriod, idCalendar]\" class=\"period__wrapper\">\r\n <dd-lib-card class=\"period__block\" type=\"small\">\r\n <div class=\"full-width\">\r\n <div class=\"period__header\">\r\n <div class=\"period__back\" (click)=\"periodIsShown = false\">\r\n <dd-lib-svg-icon icon=\"toggle_arrow_left\"></dd-lib-svg-icon>\r\n <div class=\"g-h5-title\">\u041F\u0435\u0440\u0438\u043E\u0434</div>\r\n </div>\r\n <div class=\"g-h5-title hide-tablet\">\u041F\u0435\u0440\u0438\u043E\u0434</div>\r\n <div (click)=\"clearPeriod()\" class=\"g-text font-medium green cup\">\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C</div>\r\n </div>\r\n <div class=\"period__list\">\r\n @for (period of periodMenu; track period) {\r\n <dd-lib-radio (changed)=\"selectPeriod($event)\" [(ngModel)]=\"selectedPeriod\" [value]=\"period.name\">{{\r\n period.title\r\n }}</dd-lib-radio>\r\n }\r\n </div>\r\n <div (click)=\"calendarIsShown = !calendarIsShown\" class=\"g-text font-medium green cup mt-8\">\r\n {{ calendarIsShown ? '\u0417\u0430\u043A\u0440\u044B\u0442\u044C' : '\u041E\u0442\u043A\u0440\u044B\u0442\u044C' }} \u043A\u0430\u043B\u0435\u043D\u0434\u0430\u0440\u044C\r\n </div>\r\n </div>\r\n </dd-lib-card>\r\n @if (calendarIsShown) {\r\n <dd-lib-calendar\r\n (emitDate)=\"selectDate($event)\"\r\n [(ngModel)]=\"selectedDate\"\r\n [id]=\"idCalendar\"\r\n [maxDate]=\"maxDate\"\r\n class=\"period__calendar\">\r\n </dd-lib-calendar>\r\n }\r\n </div>\r\n }\r\n</div>\r\n", styles: ["dd-lib-filter-button{position:relative}.period__wrapper{position:absolute;left:0;z-index:400;display:block;width:352px;height:348px;margin-top:8px;animation:filter-show .5s forwards}@media screen and (max-width: 840px){.period__wrapper{position:fixed;top:0;width:100%;height:100%;overflow:auto;margin-top:0;animation:shift .3s}}@media screen and (max-width: 840px){.period__block{height:100%}}.period__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}@media screen and (max-width: 840px){.period__header{padding-bottom:24px;border-bottom:1px solid var(--gray-color-200)}}@media screen and (max-width: 480px){.period__header{padding-top:8px}}.period__back{display:none}@media screen and (max-width: 840px){.period__back{display:flex;align-items:center}}.period__back ::ng-deep svg{margin-right:16px}.period__back ::ng-deep svg path{stroke:var(--menu-arr-color)}.period__list{max-height:400px;overflow:auto}@media screen and (max-width: 840px){.period__list{max-height:none}}.period__list ::ng-deep dd-lib-radio{display:block;margin-bottom:16px}@media screen and (max-width: 840px){.period__list ::ng-deep dd-lib-radio:not(:last-child){padding-bottom:16px;border-bottom:1px solid var(--gray-color-200)}}.period__calendar{margin-top:8px;display:block;animation:filter-show .5s forwards}@media screen and (max-width: 840px){.period__calendar{position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;margin-top:0;animation:shift .3s}}\n"], dependencies: [{ kind: "component", type: LibCardComponent, selector: "dd-lib-card", inputs: ["type", "footerBtn", "sHeight", "skeleton", "parentLvlForSkeleton", "plugs", "borderRadius"], outputs: ["cardBtnEvent"] }, { kind: "component", type: LibFilterButtonComponent, selector: "dd-lib-filter-button", inputs: ["btnTitle", "hintContent"], outputs: ["clearEvent", "hintEvent"] }, { kind: "component", type: LibRadioComponent, selector: "dd-lib-radio", inputs: ["radioId", "disabled", "required", "name", "value", "checked"], outputs: ["changed"] }, { kind: "component", type: LibCalendarComponent, selector: "dd-lib-calendar", inputs: ["type", "formatDate", "formatTime", "rangeMode", "rangeModeFullPeriod", "maxHours", "maxMinutes", "needTime", "mode", "dateStart", "dateEnd", "maxDate", "minDate"], outputs: ["emitDate", "immediatelyEmitDate", "emitPeriod"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[ddClickOutside]", inputs: ["elements"], outputs: ["ddClickOutside"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3215
3222
|
}
|
|
3216
3223
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: LibPeriodComponent, decorators: [{
|
|
3217
3224
|
type: Component,
|
|
@@ -3229,7 +3236,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
|
|
|
3229
3236
|
useExisting: forwardRef(() => LibPeriodComponent),
|
|
3230
3237
|
multi: true,
|
|
3231
3238
|
},
|
|
3232
|
-
], template: "<div class=\"pos-relative\">\r\n <dd-lib-filter-button\r\n (clearEvent)=\"clearPeriod()\"\r\n (clickEvent)=\"showPeriod()\"\r\n [active]=\"periodIsSelected || calendarIsSelected\"\r\n [id]=\"idPeriod\"\r\n btnColor=\"transparent\">\r\n <div
|
|
3239
|
+
], template: "<div class=\"pos-relative\">\r\n <dd-lib-filter-button\r\n (clearEvent)=\"clearPeriod()\"\r\n (clickEvent)=\"showPeriod()\"\r\n [active]=\"periodIsSelected || calendarIsSelected\"\r\n [id]=\"idPeriod\"\r\n btnColor=\"transparent\">\r\n <div>{{ periodName }}</div>\r\n </dd-lib-filter-button>\r\n @if (periodIsShown) {\r\n <div (ddClickOutside)=\"clickOutside($event)\" [elements]=\"[idPeriod, idCalendar]\" class=\"period__wrapper\">\r\n <dd-lib-card class=\"period__block\" type=\"small\">\r\n <div class=\"full-width\">\r\n <div class=\"period__header\">\r\n <div class=\"period__back\" (click)=\"periodIsShown = false\">\r\n <dd-lib-svg-icon icon=\"toggle_arrow_left\"></dd-lib-svg-icon>\r\n <div class=\"g-h5-title\">\u041F\u0435\u0440\u0438\u043E\u0434</div>\r\n </div>\r\n <div class=\"g-h5-title hide-tablet\">\u041F\u0435\u0440\u0438\u043E\u0434</div>\r\n <div (click)=\"clearPeriod()\" class=\"g-text font-medium green cup\">\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C</div>\r\n </div>\r\n <div class=\"period__list\">\r\n @for (period of periodMenu; track period) {\r\n <dd-lib-radio (changed)=\"selectPeriod($event)\" [(ngModel)]=\"selectedPeriod\" [value]=\"period.name\">{{\r\n period.title\r\n }}</dd-lib-radio>\r\n }\r\n </div>\r\n <div (click)=\"calendarIsShown = !calendarIsShown\" class=\"g-text font-medium green cup mt-8\">\r\n {{ calendarIsShown ? '\u0417\u0430\u043A\u0440\u044B\u0442\u044C' : '\u041E\u0442\u043A\u0440\u044B\u0442\u044C' }} \u043A\u0430\u043B\u0435\u043D\u0434\u0430\u0440\u044C\r\n </div>\r\n </div>\r\n </dd-lib-card>\r\n @if (calendarIsShown) {\r\n <dd-lib-calendar\r\n (emitDate)=\"selectDate($event)\"\r\n [(ngModel)]=\"selectedDate\"\r\n [id]=\"idCalendar\"\r\n [maxDate]=\"maxDate\"\r\n class=\"period__calendar\">\r\n </dd-lib-calendar>\r\n }\r\n </div>\r\n }\r\n</div>\r\n", styles: ["dd-lib-filter-button{position:relative}.period__wrapper{position:absolute;left:0;z-index:400;display:block;width:352px;height:348px;margin-top:8px;animation:filter-show .5s forwards}@media screen and (max-width: 840px){.period__wrapper{position:fixed;top:0;width:100%;height:100%;overflow:auto;margin-top:0;animation:shift .3s}}@media screen and (max-width: 840px){.period__block{height:100%}}.period__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}@media screen and (max-width: 840px){.period__header{padding-bottom:24px;border-bottom:1px solid var(--gray-color-200)}}@media screen and (max-width: 480px){.period__header{padding-top:8px}}.period__back{display:none}@media screen and (max-width: 840px){.period__back{display:flex;align-items:center}}.period__back ::ng-deep svg{margin-right:16px}.period__back ::ng-deep svg path{stroke:var(--menu-arr-color)}.period__list{max-height:400px;overflow:auto}@media screen and (max-width: 840px){.period__list{max-height:none}}.period__list ::ng-deep dd-lib-radio{display:block;margin-bottom:16px}@media screen and (max-width: 840px){.period__list ::ng-deep dd-lib-radio:not(:last-child){padding-bottom:16px;border-bottom:1px solid var(--gray-color-200)}}.period__calendar{margin-top:8px;display:block;animation:filter-show .5s forwards}@media screen and (max-width: 840px){.period__calendar{position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;margin-top:0;animation:shift .3s}}\n"] }]
|
|
3233
3240
|
}], ctorParameters: () => [{ type: DateService }, { type: i0.ChangeDetectorRef }], propDecorators: { maxDate: [{
|
|
3234
3241
|
type: Input
|
|
3235
3242
|
}], setPeriodDate: [{
|