@acorex/components 1.3.93 → 3.0.1
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/acorex-components.metadata.json +1 -1
- package/bundles/acorex-components.umd.js +33 -21
- package/bundles/acorex-components.umd.js.map +1 -1
- package/bundles/acorex-components.umd.min.js +1 -1
- package/bundles/acorex-components.umd.min.js.map +1 -1
- package/esm2015/lib/base/element.class.js +16 -9
- package/esm2015/lib/button/button.component.js +2 -2
- package/esm2015/lib/calendar/calendar-box/calendar-box.component.js +2 -2
- package/esm2015/lib/checkbox/checkbox.component.js +2 -5
- package/esm2015/lib/form-group/form-group.component.js +3 -3
- package/esm2015/lib/menu/menu2.component.js +1 -1
- package/esm2015/lib/selectbox/selectbox.component.js +5 -2
- package/esm2015/lib/toast/toast-message/toast-message.component.js +3 -3
- package/esm2015/lib/tree-view/tree-view.component.js +6 -2
- package/esm5/lib/base/element.class.js +17 -9
- package/esm5/lib/button/button.component.js +2 -2
- package/esm5/lib/calendar/calendar-box/calendar-box.component.js +2 -2
- package/esm5/lib/checkbox/checkbox.component.js +2 -5
- package/esm5/lib/form-group/form-group.component.js +3 -3
- package/esm5/lib/menu/menu2.component.js +1 -1
- package/esm5/lib/selectbox/selectbox.component.js +5 -2
- package/esm5/lib/toast/toast-message/toast-message.component.js +3 -3
- package/esm5/lib/tree-view/tree-view.component.js +6 -2
- package/fesm2015/acorex-components.js +32 -21
- package/fesm2015/acorex-components.js.map +1 -1
- package/fesm5/acorex-components.js +33 -21
- package/fesm5/acorex-components.js.map +1 -1
- package/lib/base/element.class.d.ts +1 -1
- package/package.json +1 -1
|
@@ -303,26 +303,33 @@ var AXValidatableComponent = /** @class */ (function (_super) {
|
|
|
303
303
|
return Promise.resolve({ result: true });
|
|
304
304
|
}
|
|
305
305
|
};
|
|
306
|
-
AXValidatableComponent.prototype.clearValidationStyle = function (element) {
|
|
307
|
-
|
|
306
|
+
AXValidatableComponent.prototype.clearValidationStyle = function (element, clear) {
|
|
307
|
+
if (clear === void 0) { clear = false; }
|
|
308
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
308
309
|
var formGroup = element.closest('.form-group');
|
|
309
310
|
var formItem = ((_a = formGroup) === null || _a === void 0 ? void 0 : _a.querySelector('.form-item')) || element.closest('.form-item') || element.querySelector('.form-item');
|
|
310
311
|
;
|
|
311
312
|
var label = (_b = formGroup) === null || _b === void 0 ? void 0 : _b.querySelector('.form-group-label');
|
|
312
313
|
var parent = ((_c = formItem) === null || _c === void 0 ? void 0 : _c.parentElement) || element.parentElement;
|
|
313
|
-
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.remove('
|
|
314
|
-
(_e =
|
|
314
|
+
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.remove('success-state');
|
|
315
|
+
(_e = formItem) === null || _e === void 0 ? void 0 : _e.classList.remove('error-state');
|
|
316
|
+
//formItem?.classList.remove('required-state');
|
|
317
|
+
if (!clear) {
|
|
318
|
+
(_f = formItem) === null || _f === void 0 ? void 0 : _f.classList.add('success-state');
|
|
319
|
+
}
|
|
320
|
+
(_g = label) === null || _g === void 0 ? void 0 : _g.classList.remove('error-text');
|
|
315
321
|
if (parent.querySelector('span.error-text')) {
|
|
316
322
|
parent.removeChild(parent.querySelector('span.error-text'));
|
|
317
323
|
}
|
|
318
324
|
};
|
|
319
325
|
AXValidatableComponent.prototype.applyValidationStyle = function (element, v) {
|
|
320
|
-
var _a, _b, _c, _d, _e;
|
|
326
|
+
var _a, _b, _c, _d, _e, _f;
|
|
321
327
|
var formGroup = element.closest('.form-group');
|
|
322
328
|
var formItem = ((_a = formGroup) === null || _a === void 0 ? void 0 : _a.querySelector('.form-item')) || element.closest('.form-item') || element.querySelector('.form-item');
|
|
323
329
|
var label = (_b = formGroup) === null || _b === void 0 ? void 0 : _b.querySelector('.form-group-label');
|
|
324
330
|
var parent = ((_c = formItem) === null || _c === void 0 ? void 0 : _c.parentElement) || element.parentElement;
|
|
325
|
-
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.add('error');
|
|
331
|
+
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.add('error-state');
|
|
332
|
+
(_e = formItem) === null || _e === void 0 ? void 0 : _e.classList.remove('success-state');
|
|
326
333
|
if (parent.querySelector('span.error-text')) {
|
|
327
334
|
parent.removeChild(parent.querySelector('span.error-text'));
|
|
328
335
|
}
|
|
@@ -332,7 +339,7 @@ var AXValidatableComponent = /** @class */ (function (_super) {
|
|
|
332
339
|
span.classList.add('ax', 'error-text');
|
|
333
340
|
parent.appendChild(span);
|
|
334
341
|
}
|
|
335
|
-
(
|
|
342
|
+
(_f = label) === null || _f === void 0 ? void 0 : _f.classList.add('error-text');
|
|
336
343
|
};
|
|
337
344
|
__decorate([
|
|
338
345
|
Input(),
|
|
@@ -411,7 +418,8 @@ var AXBaseTextComponent = /** @class */ (function (_super) {
|
|
|
411
418
|
isUserChange: this.userChange
|
|
412
419
|
});
|
|
413
420
|
this.userChange = false;
|
|
414
|
-
|
|
421
|
+
debugger;
|
|
422
|
+
this.clearValidationStyle(this.input.nativeElement, v ? false : true);
|
|
415
423
|
this.cdr.detectChanges();
|
|
416
424
|
}
|
|
417
425
|
},
|
|
@@ -1023,7 +1031,7 @@ var AXButtonComponent = /** @class */ (function (_super) {
|
|
|
1023
1031
|
Component({
|
|
1024
1032
|
selector: 'ax-button',
|
|
1025
1033
|
encapsulation: ViewEncapsulation.None,
|
|
1026
|
-
template: "<button #container class=\"ax button form-control {{type}} {{size}}\" [class.selected]=\"selected\" [class.icon]=\"icon\"\r\n [class.icon]=\"loading\" [class.disabled]=\"disabled || loading\" (click)=\"handleClick($event)\" [disabled]=\"disabled\"\r\n [ngStyle]=\"{'width.%': block ? 100 : 'auto'}\" [attr.tabindex]=\"tabIndex\">\r\n <div class=\"button-inner-content\">\r\n <ng-container *ngIf=\"icon && !loading\">\r\n <i class=\"{{icon}} icon\"></i
|
|
1034
|
+
template: "<button #container class=\"ax button form-control {{type}} {{size}}\" [class.selected]=\"selected\" [class.icon]=\"icon\"\r\n [class.icon]=\"loading\" [class.disabled]=\"disabled || loading\" (click)=\"handleClick($event)\" [disabled]=\"disabled\"\r\n [ngStyle]=\"{'width.%': block ? 100 : 'auto'}\" [attr.tabindex]=\"tabIndex\">\r\n <div class=\"button-inner-content\">\r\n <ng-container *ngIf=\"icon && !loading\">\r\n <i class=\"{{icon}} icon\"></i>\r\n <ng-container *ngIf=\"refContent.innerText.length==0 && refContent.children.length == 0\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"loading\">\r\n <i class=\"far fa-circle-notch fa-spin icon\"></i>\r\n <ng-container *ngIf=\"refContent.innerText.length==0 && refContent.children.length == 0\"></ng-container>\r\n </ng-container>\r\n <div class=\"ax-wrapper\" #refContent>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</button>"
|
|
1027
1035
|
}),
|
|
1028
1036
|
__metadata("design:paramtypes", [ElementRef])
|
|
1029
1037
|
], AXButtonComponent);
|
|
@@ -1494,7 +1502,7 @@ var AXCalendarBoxComponent = /** @class */ (function () {
|
|
|
1494
1502
|
AXCalendarBoxComponent = __decorate([
|
|
1495
1503
|
Component({
|
|
1496
1504
|
selector: 'ax-calendar-box',
|
|
1497
|
-
template: "<div class=\"calendar-body ax {{size}}\" [ngClass]=\"type\"
|
|
1505
|
+
template: "<div class=\"calendar-body ax {{size}}\" [ngClass]=\"type\">\r\n <div class=\"calendar-selector\">\r\n <div class=\"arrows left-arrow\" (click)=\"prev()\">\r\n <i class=\"far fa-chevron-left\"></i>\r\n </div>\r\n <div class=\"selector-name\" (click)=\"changeView()\" [ngSwitch]=\"view\">\r\n <ng-container *ngSwitchCase=\"'day'\">\r\n {{viewRange.startTime.add('day',10) | dt:\"MMM YYYY\"}}\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'month'\">\r\n {{viewRange.startTime | dt:\"YYYY\"}}\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n {{viewRange.startTime | dt:\"YYYY\"}} - {{viewRange.endTime | dt:\"YYYY\"}}\r\n </ng-container>\r\n </div>\r\n <div class=\"arrows right-arrow\" (click)=\"next()\">\r\n <i class=\"far fa-chevron-right\"></i>\r\n </div>\r\n </div>\r\n <div class=\"view\">\r\n <ng-container [ngSwitch]=\"view\">\r\n <ng-container *ngSwitchCase=\"'day'\">\r\n <table>\r\n <thead>\r\n <tr class=\"days-name calendar-row\">\r\n <th class=\"calendar-item\" *ngFor='let w of weekdays'>{{w}}</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr class=\"calendar-row\" *ngFor=\"let r of matrix\">\r\n <td *ngFor=\"let d of r;trackBy:trackByFn\" class=\"calendar-item \" [title]=\"getTitle(d.date)\" [ngClass]=\"{'selected': d.selected,'focused':d.focused,'today':d.today,'next-month':d.nextMonth , 'holiday':d.holiday , 'unselect':d.unselect}\" [ngStyle]=\"(findDay(d.date)) ? getStyle(d.date):''\"\r\n (click)=\"setDayClick($event,d)\">\r\n <div>\r\n {{d.date.dayInMonth}}\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'month'\">\r\n <table>\r\n <tbody>\r\n <tr class=\"calendar-row\" *ngFor=\"let r of matrix\">\r\n <td class=\"calendar-item month-item\" *ngFor=\"let d of r;trackBy:trackByFn\" [ngClass]=\"{'selected': d.selected,'focused':d.focused,'today':d.today}\" (click)=\"setMonthClick($event,d.date)\">\r\n <div>\r\n {{d.date| dt:\"MMM\"}}\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'year'\">\r\n <table>\r\n <tbody>\r\n <tr class=\"calendar-row\" *ngFor=\"let r of matrix\">\r\n <td class=\"calendar-item year-item\" *ngFor=\"let d of r;trackBy:trackByFn\" [ngClass]=\"{'selected': d.selected,'focused':d.focused,'today':d.today}\" (click)=\"setYearClick($event,d.date)\">\r\n <div>\r\n {{d.date | dt:\"YYYY\"}}\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <div style=\"padding: 5px;\">\r\n <!-- TODO: Add buttons -->\r\n <ax-button (click)=\"setToday()\" *ngIf=\"showTodayButton\" size=\"sm\" type=\"primary\" block=\"'true'\">\r\n {{getTodayName()}}\r\n </ax-button>\r\n </div>\r\n</div>",
|
|
1498
1506
|
encapsulation: ViewEncapsulation.None,
|
|
1499
1507
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
1500
1508
|
}),
|
|
@@ -3224,7 +3232,7 @@ var AXMenu2Component = /** @class */ (function () {
|
|
|
3224
3232
|
selector: 'ax-menu2',
|
|
3225
3233
|
template: "\n <div class=\"ax ax-menu ax-menu-vertical\" [attr.data-level]=\"level\">\n <ax-menu-item\n *ngFor=\"let item of items\"\n [level]=\"level\"\n [item]=\"item\"\n (showSubMenu)=\"showSubmenu($event)\">\n </ax-menu-item>\n </div>\n ",
|
|
3226
3234
|
encapsulation: ViewEncapsulation.None,
|
|
3227
|
-
styles: [".ax.ax-menu{display:flex}.ax.ax-menu.ax-menu-vertical[data-level=\"0\"]{display:flex;flex-direction:row}.ax.ax-menu.ax-menu-vertical:not([data-level=\"0\"]){display:flex;transition:opacity .3s;min-width:12em;box-shadow:0 1px 7px 0 var(--ax-border-color);background:#fff;flex-direction:column}.ax.ax-menu.ax-menu-vertical .ax-menu-item{display:flex;white-space:nowrap;cursor:pointer;padding:0 10px;font-weight:400;font-size:1rem;line-height:40px;text-decoration:none;align-items:center}.ax.ax-menu.ax-menu-vertical .ax-menu-item .icon:first-child{-webkit-margin-end:var(--ax-size-md);margin-inline-end:var(--ax-size-md)}.ax.ax-menu.ax-menu-vertical .ax-menu-item .icon:last-child{-webkit-margin-start:var(--ax-size-md);margin-inline-start:var(--ax-size-md)}.ax.ax-menu.ax-menu-vertical .ax-menu-item.disabled{color:var(--ax-gray-color)!important;background-color:var(--ax-gray-trans-light-color)!important;cursor:not-allowed!important}.ax.ax-menu.ax-menu-vertical .ax-menu-item.disabled .icon{color:var(--ax-gray-dark-color)!important}.ax.ax-menu.ax-menu-vertical .ax-menu-item.disabled:hover{background:var(--ax-light-light-color)!important;border-color:var(--ax-light-light-color)!important;color:var(--ax-gray-dark-color)!important;cursor:not-allowed!important}"]
|
|
3235
|
+
styles: [".ax.ax-menu{display:flex}.ax.ax-menu.ax-menu-vertical[data-level=\"0\"]{display:flex;flex-direction:row}.ax.ax-menu.ax-menu-vertical:not([data-level=\"0\"]){display:flex;transition:opacity .3s;min-width:12em;box-shadow:0 1px 7px 0 var(--ax-border-color);background:#fff;flex-direction:column}.ax.ax-menu.ax-menu-vertical .ax-menu-item{display:flex;white-space:nowrap;cursor:pointer;padding:0 10px;font-weight:400;font-size:1rem;line-height:40px;text-decoration:none;align-items:center}.ax.ax-menu.ax-menu-vertical .ax-menu-item .icon:first-child{-webkit-margin-end:var(--ax-size-md);margin-inline-end:var(--ax-size-md)}.ax.ax-menu.ax-menu-vertical .ax-menu-item .icon:last-child{-webkit-margin-start:var(--ax-size-md);margin-inline-start:var(--ax-size-md)}.ax.ax-menu.ax-menu-vertical .ax-menu-item span{flex:1}.ax.ax-menu.ax-menu-vertical .ax-menu-item.disabled{color:var(--ax-gray-color)!important;background-color:var(--ax-gray-trans-light-color)!important;cursor:not-allowed!important}.ax.ax-menu.ax-menu-vertical .ax-menu-item.disabled .icon{color:var(--ax-gray-dark-color)!important}.ax.ax-menu.ax-menu-vertical .ax-menu-item.disabled:hover{background:var(--ax-light-light-color)!important;border-color:var(--ax-light-light-color)!important;color:var(--ax-gray-dark-color)!important;cursor:not-allowed!important}"]
|
|
3228
3236
|
}),
|
|
3229
3237
|
__metadata("design:paramtypes", [Overlay,
|
|
3230
3238
|
ViewContainerRef,
|
|
@@ -3405,10 +3413,7 @@ var AXCheckBoxComponent = /** @class */ (function (_super) {
|
|
|
3405
3413
|
};
|
|
3406
3414
|
AXCheckBoxComponent.prototype.handleClick = function (e) {
|
|
3407
3415
|
if (!this.disabled && !this.readonly) {
|
|
3408
|
-
e.preventDefault();
|
|
3409
|
-
e.stopPropagation();
|
|
3410
3416
|
//TODO: check intermddiate;
|
|
3411
|
-
this.value = !this.value;
|
|
3412
3417
|
this.onClick.emit({
|
|
3413
3418
|
component: this,
|
|
3414
3419
|
htmlElement: this.ref.nativeElement,
|
|
@@ -3469,7 +3474,7 @@ var AXCheckBoxComponent = /** @class */ (function (_super) {
|
|
|
3469
3474
|
AXCheckBoxComponent = __decorate([
|
|
3470
3475
|
Component({
|
|
3471
3476
|
selector: 'ax-check-box',
|
|
3472
|
-
template: "<label class=\"ax checkbox {{size}}\" for=\"{{uid}}\" [ngClass]=\"{ 'disabled': disabled, 'readonly': readonly }\"\r\n (click)=\"handleClick($event)\">\r\n {{ label }}\r\n <input #input type=\"checkbox\" id=\"{{uid}}\" [readonly]=\"readonly\" [checked]=\"value\"\r\n [disabled]=\"disabled || readonly\" />\r\n <span class=\"checkmark\" [ngClass]=\"{'indeterminate': indeterminate && value == null}\"></span>\r\n\r\n</label>",
|
|
3477
|
+
template: "<!-- <label class=\"ax checkbox {{size}}\" for=\"{{uid}}\" [ngClass]=\"{ 'disabled': disabled, 'readonly': readonly }\"\r\n (click)=\"handleClick($event)\">\r\n {{ label }}\r\n <input #input type=\"checkbox\" id=\"{{uid}}\" [readonly]=\"readonly\" [checked]=\"value\"\r\n [disabled]=\"disabled || readonly\" />\r\n <span class=\"checkmark\" [ngClass]=\"{'indeterminate': indeterminate && value == null}\"></span>\r\n\r\n</label> -->\r\n\r\n<label for=\"{{uid}}\" class=\"ax-checkbox-container\" (click)=\"handleClick($event)\">\r\n <input #input type=\"checkbox\" class=\"ax-checkbox\" [ngClass]=\"{'indeterminate': indeterminate && value == null}\"\r\n id=\"{{uid}}\" [readonly]=\"readonly\" [checked]=\"value\" [(ngModel)]=\"value\" [disabled]=\"disabled || readonly\" />\r\n <span>{{ label ? label : ' ' }}</span>\r\n</label>",
|
|
3473
3478
|
encapsulation: ViewEncapsulation.None,
|
|
3474
3479
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
3475
3480
|
}),
|
|
@@ -4474,9 +4479,9 @@ var AXToastMessageComponent = /** @class */ (function () {
|
|
|
4474
4479
|
], AXToastMessageComponent.prototype, "type", void 0);
|
|
4475
4480
|
AXToastMessageComponent = __decorate([
|
|
4476
4481
|
Component({
|
|
4477
|
-
template: "<div class=\"toast-container\">\r\n
|
|
4482
|
+
template: "<div class=\"toast-container\">\r\n <header *ngIf=\"title\" class=\"ax toast {{ style }}\">\r\n <div>\r\n <i class=\"{{icon}}\"></i> {{ title }}\r\n </div>\r\n <div *ngIf=\"closeable\" (click)=\"close()\" class=\"toast-close\">\r\n <i class=\"far fa-times-circle\"></i>\r\n </div>\r\n </header>\r\n <div class=\"content ax toast {{ style }}\">\r\n {{ message }}\r\n <div *ngIf=\"!title && closeable\" (click)=\"close()\" class=\"toast-close\">\r\n <i class=\"far fa-times-circle\"></i>\r\n </div>\r\n <div class=\"toast-progress\" [style.animation-duration.ms]=\"timeOut\"></div>\r\n </div>\r\n</div>",
|
|
4478
4483
|
encapsulation: ViewEncapsulation.None,
|
|
4479
|
-
styles: [".rtl .toast-progress{right:0;left:inherit!important}.toast-container{overflow:hidden;margin:.8em 0;box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);animation:.3s cubic-bezier(.25,.46,.45,.94) both slide-in-bottom;-webkit-animation:.3s cubic-bezier(.25,.46,.45,.94) both slide-in-bottom}.toast-container header{display:flex;justify-content:space-between;padding:.8em}.toast-container .content{padding:.8em;display:flex;align-items:center;justify-content:space-between}.toast-container .toast-close{cursor:pointer}.toast-container .toast-progress{position:absolute;background:rgba(0,0,0,.5);width:100%;bottom:0;left:0;padding:.15em 0;
|
|
4484
|
+
styles: [".rtl .toast-progress{right:0;left:inherit!important}.toast-container{overflow:hidden;margin:.8em 0;box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);animation:.3s cubic-bezier(.25,.46,.45,.94) both slide-in-bottom;-webkit-animation:.3s cubic-bezier(.25,.46,.45,.94) both slide-in-bottom}.toast-container header{display:flex;justify-content:space-between;padding:.8em}.toast-container .content{padding:.8em;display:flex;align-items:center;justify-content:space-between}.toast-container .toast-close{cursor:pointer}.toast-container .toast-progress{position:absolute;background:rgba(0,0,0,.5);width:100%;bottom:0;left:0;padding:.15em 0;-webkit-animation-duration:4s;animation-duration:4s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-name:progressBar;animation-name:progressBar}@-webkit-keyframes progressBar{0%{width:100%}100%{width:0%}}@keyframes progressBar{0%{width:100%}100%{width:0%}}@-webkit-keyframes slide-in-top{0%{transform:translateY(-1000px);opacity:0}100%{transform:translateY(0);opacity:1}}@keyframes slide-in-top{0%{transform:translateY(-1000px);opacity:0}100%{transform:translateY(0);opacity:1}}@-webkit-keyframes slide-in-bottom{0%{transform:translateY(1000px);opacity:0}100%{transform:translateY(0);opacity:1}}@keyframes slide-in-bottom{0%{transform:translateY(1000px);opacity:0}100%{transform:translateY(0);opacity:1}}"]
|
|
4480
4485
|
}),
|
|
4481
4486
|
__metadata("design:paramtypes", [ElementRef])
|
|
4482
4487
|
], AXToastMessageComponent);
|
|
@@ -6060,7 +6065,7 @@ var AXFormGroupComponent = /** @class */ (function (_super) {
|
|
|
6060
6065
|
var _a, _b, _c;
|
|
6061
6066
|
this.required = (_c = (_b = (_a = this.component) === null || _a === void 0 ? void 0 : _a.validation) === null || _b === void 0 ? void 0 : _b.rules) === null || _c === void 0 ? void 0 : _c.some(function (c) { return c.type === 'required'; });
|
|
6062
6067
|
if (this.required) {
|
|
6063
|
-
this.div.nativeElement.classList.add('required');
|
|
6068
|
+
this.div.nativeElement.classList.add('required-state');
|
|
6064
6069
|
}
|
|
6065
6070
|
};
|
|
6066
6071
|
AXFormGroupComponent.ctorParameters = function () { return [
|
|
@@ -6081,7 +6086,7 @@ var AXFormGroupComponent = /** @class */ (function (_super) {
|
|
|
6081
6086
|
AXFormGroupComponent = __decorate([
|
|
6082
6087
|
Component({
|
|
6083
6088
|
selector: 'ax-form-group',
|
|
6084
|
-
template: "<div class=\"ax form-group {{size}}\">\r\n <ng-content select=\"ax-label\"></ng-content>\r\n <div #div class=\"ax form-item\" [ngClass]=\"{'required': required}\">\r\n <div class=\"ax buttons start-buttons\" #startButtons>\r\n <ng-content select=\"ax-button[start]\"></ng-content>\r\n </div>\r\n <div class=\"content\" #content>\r\n <ng-content></ng-content>\r\n </div>\r\n <div class=\"ax buttons end-buttons\" #endButtons>\r\n <ng-content select=\"ax-button[end]\"></ng-content>\r\n <ng-content select=\"ax-button\"></ng-content>\r\n </div>\r\n </div>\r\n</div>",
|
|
6089
|
+
template: "<div class=\"ax form-group {{size}}\">\r\n <ng-content select=\"ax-label\"></ng-content>\r\n <div #div class=\"ax form-item\" [ngClass]=\"{'required-state': required}\">\r\n <div class=\"ax buttons start-buttons\" #startButtons>\r\n <ng-content select=\"ax-button[start]\"></ng-content>\r\n </div>\r\n <div class=\"content\" #content>\r\n <ng-content></ng-content>\r\n </div>\r\n <div class=\"ax buttons end-buttons\" #endButtons>\r\n <ng-content select=\"ax-button[end]\"></ng-content>\r\n <ng-content select=\"ax-button\"></ng-content>\r\n </div>\r\n </div>\r\n</div>",
|
|
6085
6090
|
encapsulation: ViewEncapsulation.None,
|
|
6086
6091
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
6087
6092
|
host: { style: 'display: contents;' }
|
|
@@ -8226,6 +8231,7 @@ var AXSelectBoxComponent = /** @class */ (function (_super) {
|
|
|
8226
8231
|
_this.showCheckBox = true;
|
|
8227
8232
|
_this.readonly = false;
|
|
8228
8233
|
_this.rtl = AXConfig.get('layout.rtl');
|
|
8234
|
+
_this.disabled = false;
|
|
8229
8235
|
_this.size = 'md';
|
|
8230
8236
|
_this.allowNull = true;
|
|
8231
8237
|
_this.textAlign = null;
|
|
@@ -8708,6 +8714,7 @@ var AXSelectBoxComponent = /** @class */ (function (_super) {
|
|
|
8708
8714
|
};
|
|
8709
8715
|
AXSelectBoxComponent.prototype.onFocusTextBox = function (e) { };
|
|
8710
8716
|
AXSelectBoxComponent.prototype.onTextBoxClick = function (e) {
|
|
8717
|
+
debugger;
|
|
8711
8718
|
if (this.disabled == false && this.readonly == false) {
|
|
8712
8719
|
this.dropdown.open();
|
|
8713
8720
|
}
|
|
@@ -8745,6 +8752,7 @@ var AXSelectBoxComponent = /** @class */ (function (_super) {
|
|
|
8745
8752
|
_this.serchBox.focus();
|
|
8746
8753
|
}
|
|
8747
8754
|
}, 0);
|
|
8755
|
+
e.stopPropagation();
|
|
8748
8756
|
};
|
|
8749
8757
|
AXSelectBoxComponent.prototype.handleKeyEventSearch = function (e) {
|
|
8750
8758
|
var _this = this;
|
|
@@ -9227,7 +9235,7 @@ var AXSelectBoxComponent = /** @class */ (function (_super) {
|
|
|
9227
9235
|
AXSelectBoxComponent = AXSelectBoxComponent_1 = __decorate([
|
|
9228
9236
|
Component({
|
|
9229
9237
|
selector: 'ax-select-box',
|
|
9230
|
-
template: "<ax-drop-down [size]=\"size\" [rtl]=\"rtl\" [showDropDownButton]=\"showDropDownButton\" [disabled]=\"disabled\"
|
|
9238
|
+
template: "<ax-drop-down [size]=\"size\" [rtl]=\"rtl\" [showDropDownButton]=\"showDropDownButton\" [disabled]=\"disabled\" [readonly]=\"readonly\" #d (dropdownToggle)=\"dropdownToggle($event)\">\r\n <ng-container start>\r\n <ng-content select=\"[start]\">\r\n </ng-content>\r\n </ng-container>\r\n <ng-container header>\r\n <div class=\"ax chips-container\" [horizontalScroll]=\"40\">\r\n <div class=\"chips\" [class.chips-blank]=\"mode === 'single'\" [title]=\"item[textField]\" *ngFor=\"let item of selectedItems\">\r\n <span class=\"chips-text\">\r\n {{item[textField]}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\" *ngIf=\"(readonly!=true || itemRemove ==true)&& disabled!=true && (allowNull==true || (selectedItems.length > 1))\">\r\n <i class=\"far fa-times-circle close\"></i>\r\n </span>\r\n </div>\r\n <div class=\"search-wrapper\" (click)=\"onTextBoxClick($event)\">\r\n <ax-text-box #textBoxSelectBox [textAlign]=\"textAlign\" [placeholder]=\"selectedItems.length == 0 ? placeholder : ''\" [readonly]=\"readonly\" [disabled]=\"disabled\" (onkey)=\"handleKeyEvent($event)\" [size]=\"size\" (onFocus)=\"onFocusTextBox($event)\">\r\n </ax-text-box>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container end>\r\n <ng-content select=\"[end]\">\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container panel>\r\n <div *ngIf=\"allowSearch\" class=\"search-wrapper\" style=\"padding: 0.7em;\">\r\n <ax-search-box #serchBox [(value)]=\"text\" (onkey)=\"handleKeyEventSearch($event)\" (textChanged)=\"textChanged($event)\" (onButtonClick)=\"textChanged($event)\">\r\n </ax-search-box>\r\n </div>\r\n <div class=\"ax list-container\">\r\n <div #listContainer style=\"max-height: 300px;overflow-y: auto;width: 100%;\" (scroll)=\"scrolled($event)\">\r\n <ng-container *ngIf=\"getItems().length>0; then thenTemplate; else elseTemplate\"></ng-container>\r\n <ng-template #thenTemplate>\r\n <div class=\"list-item\" *ngFor=\"let item of getItems();let i = index\" [class.focused]=\"i==currentfocusedIndex\" [class.selected]=\"isItemSelected(item)\" (click)=\"handleItemClick($event,item)\">\r\n <div style=\"display: flex;\">\r\n <ax-check-box *ngIf=\"showCheckBox\" [size]=\"size\" [value]=\"isItemSelected(item)\" [disabled]=\"!allowNull && selectedItems.length === 1 && isItemSelected(item)\">\r\n </ax-check-box>\r\n <ng-container *ngIf=\"rowTemplate; else elseTemplate\">\r\n <div style=\"white-space: nowrap;text-overflow: ellipsis;overflow: hidden;\" [title]=\"item[textField]\" [ngStyle]=\"(showCheckBox) ? {'padding-inline-start': '0.5rem'}:''\">\r\n <ng-container *ngTemplateOutlet=\"rowTemplate; context:{ $implicit: item }\">\r\n </ng-container>\r\n </div>\r\n\r\n </ng-container>\r\n <ng-template #elseTemplate>\r\n <div style=\"white-space: nowrap;text-overflow: ellipsis;overflow: hidden;\" [title]=\"item[textField]\" [ngStyle]=\"(showCheckBox) ? {'padding-inline-start': '0.5rem'}:''\">\r\n {{ item[textField] }}\r\n </div>\r\n </ng-template>\r\n\r\n </div>\r\n\r\n </div>\r\n\r\n </ng-template>\r\n <div *ngIf=\"showLoading\" class=\"ax-pad-sm\" style=\"text-align: center;\">\r\n <i class=\"far fa-spinner-third fa-pulse fa-2x\" style=\"color: var(--ax-primary-color);\"></i>\r\n\r\n </div>\r\n <!-- <ax-loading-indicator ></ax-loading-indicator> -->\r\n <ng-template #elseTemplate>\r\n <ng-container *ngIf=\"showLoading == true; then searchTemplate else noDataTemplate\"></ng-container>\r\n <ng-template #searchTemplate>\r\n <div class=\"list-item\">\r\n {{'common.searching' | trans}}\r\n </div>\r\n </ng-template>\r\n <ng-template #noDataTemplate>\r\n <div class=\"list-item\">\r\n {{'common.noDataFound' | trans}}\r\n </div>\r\n </ng-template>\r\n\r\n </ng-template>\r\n\r\n </div>\r\n\r\n </div>\r\n </ng-container>\r\n\r\n</ax-drop-down>",
|
|
9231
9239
|
encapsulation: ViewEncapsulation.None,
|
|
9232
9240
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
9233
9241
|
host: { style: 'display: contents;' },
|
|
@@ -13476,6 +13484,7 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
|
|
|
13476
13484
|
AXTreeViewComponent.prototype.internalSelectItem = function (item, userChange) {
|
|
13477
13485
|
var _this = this;
|
|
13478
13486
|
if (userChange === void 0) { userChange = true; }
|
|
13487
|
+
debugger;
|
|
13479
13488
|
if (item[this.hasChildField] === false || this.selectionMode === 'single') {
|
|
13480
13489
|
item.select = !item.select;
|
|
13481
13490
|
if (item.parentNode && this.selectionMode !== 'single') {
|
|
@@ -13651,6 +13660,7 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
|
|
|
13651
13660
|
};
|
|
13652
13661
|
AXTreeViewComponent.prototype.handleOnNodeClick = function (e, item, flag) {
|
|
13653
13662
|
if (flag === void 0) { flag = false; }
|
|
13663
|
+
// this.internalSelectItem(item);
|
|
13654
13664
|
this.onItemClick.emit({
|
|
13655
13665
|
component: this,
|
|
13656
13666
|
htmlEvent: e,
|
|
@@ -13703,6 +13713,7 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
|
|
|
13703
13713
|
_this.hideLoading(null);
|
|
13704
13714
|
_this.list = _data.data.result;
|
|
13705
13715
|
_this.list.forEach(function (el) {
|
|
13716
|
+
el.disabledCheckBox = false;
|
|
13706
13717
|
el.select = false;
|
|
13707
13718
|
if (_this.selectionLevel == 'nodes' && el[_this.hasChildField] == true) {
|
|
13708
13719
|
el.disabledCheckBox = true;
|
|
@@ -13747,6 +13758,7 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
|
|
|
13747
13758
|
if (_this.list.length !== 0) {
|
|
13748
13759
|
if (_this.itemRow[_this.childField] && _this.itemRow[_this.childField].length > 0) {
|
|
13749
13760
|
result_1.forEach(function (el) {
|
|
13761
|
+
el.disabledCheckBox = false;
|
|
13750
13762
|
_this.itemRow[_this.childField][_this.itemRow[_this.childField].length] = el;
|
|
13751
13763
|
});
|
|
13752
13764
|
}
|
|
@@ -14114,7 +14126,7 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
|
|
|
14114
14126
|
AXTreeViewComponent = __decorate([
|
|
14115
14127
|
Component({
|
|
14116
14128
|
selector: 'ax-tree-view',
|
|
14117
|
-
template: "<ul class=\"ax treeview {{size}}\">\r\n
|
|
14129
|
+
template: "<ul class=\"ax treeview {{size}}\">\r\n <ng-template #recursiveList let-list>\r\n <ng-container *ngFor=\"let item of list\">\r\n <li class=\"active {{item[hasChildField] ? '':'node'}}\" [class.bordered]=\"bordered\" [class.selected]=\"item.select\" [draggable]=\"allowDrag\" (dragstart)=\"onDragStart($event, item)\" [attr.data-id]=\"item[keyField]\" (dragleave)=\"onDragEnd($event,item)\" (dragend)=drop($event)>\r\n <div axContextMenu [contextDataItem]=\"item\" [contextMenuItems]=\"contextMenuItems\" [contextMenu]=\"menu\" (onContextMenuItemClick)=\"handleOnContextMenuItem($event)\" style=\"display: flex; cursor: pointer;align-items: center;\">\r\n <div class=\"start-side\">\r\n <div *ngIf=\"item[hasChildField]\" class=\"collapse-icon\" (click)=\"handleOnNodeClick($event,item,true)\">\r\n <i class=\"fal\" [ngClass]=\"{'fa-minus': !!item.toggle , 'fa-plus': !item.toggle , 'fa-spinner fa-spin':item.loading }\"></i>\r\n </div>\r\n\r\n <ax-check-box *ngIf=\"showSelectBox\" [disabled]=\"item.disabledCheckBox\" [size]=\"size\" [indeterminate]=\"true\" [value]=\"item.select\" (onClick)=\"internalSelectItem(item)\">\r\n </ax-check-box>\r\n\r\n\r\n </div>\r\n <div class=\"text-list\" (click)=\"handleOnNodeClick($event,item)\" (dblclick)=\"itemdbClick($event,item)\">\r\n <ng-container *ngIf=\"nodeTemplate; else elseTemplate\">\r\n <ng-container *ngTemplateOutlet=\"nodeTemplate; context:{ $implicit: item }\"></ng-container>\r\n </ng-container>\r\n <ng-template #elseTemplate>\r\n {{item.title}}\r\n </ng-template>\r\n </div>\r\n </div>\r\n <ul *ngIf=\"item.loading\">\r\n <i class=\"far \"></i>\r\n </ul>\r\n <ul class=\"child\" *ngIf=\"item.toggle\" style=\"background-color: white !important;\">\r\n <ng-container *ngTemplateOutlet=\"recursiveList; context:{ $implicit: item.childeren }\">\r\n </ng-container>\r\n </ul>\r\n </li>\r\n </ng-container>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"recursiveList; context:{ $implicit: list }\"></ng-container>\r\n</ul>\r\n\r\n<ax-context-menu #menu></ax-context-menu>",
|
|
14118
14130
|
encapsulation: ViewEncapsulation.None
|
|
14119
14131
|
}),
|
|
14120
14132
|
__metadata("design:paramtypes", [ElementRef])
|