@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
|
@@ -509,26 +509,33 @@
|
|
|
509
509
|
return Promise.resolve({ result: true });
|
|
510
510
|
}
|
|
511
511
|
};
|
|
512
|
-
AXValidatableComponent.prototype.clearValidationStyle = function (element) {
|
|
513
|
-
|
|
512
|
+
AXValidatableComponent.prototype.clearValidationStyle = function (element, clear) {
|
|
513
|
+
if (clear === void 0) { clear = false; }
|
|
514
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
514
515
|
var formGroup = element.closest('.form-group');
|
|
515
516
|
var formItem = ((_a = formGroup) === null || _a === void 0 ? void 0 : _a.querySelector('.form-item')) || element.closest('.form-item') || element.querySelector('.form-item');
|
|
516
517
|
;
|
|
517
518
|
var label = (_b = formGroup) === null || _b === void 0 ? void 0 : _b.querySelector('.form-group-label');
|
|
518
519
|
var parent = ((_c = formItem) === null || _c === void 0 ? void 0 : _c.parentElement) || element.parentElement;
|
|
519
|
-
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.remove('
|
|
520
|
-
(_e =
|
|
520
|
+
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.remove('success-state');
|
|
521
|
+
(_e = formItem) === null || _e === void 0 ? void 0 : _e.classList.remove('error-state');
|
|
522
|
+
//formItem?.classList.remove('required-state');
|
|
523
|
+
if (!clear) {
|
|
524
|
+
(_f = formItem) === null || _f === void 0 ? void 0 : _f.classList.add('success-state');
|
|
525
|
+
}
|
|
526
|
+
(_g = label) === null || _g === void 0 ? void 0 : _g.classList.remove('error-text');
|
|
521
527
|
if (parent.querySelector('span.error-text')) {
|
|
522
528
|
parent.removeChild(parent.querySelector('span.error-text'));
|
|
523
529
|
}
|
|
524
530
|
};
|
|
525
531
|
AXValidatableComponent.prototype.applyValidationStyle = function (element, v) {
|
|
526
|
-
var _a, _b, _c, _d, _e;
|
|
532
|
+
var _a, _b, _c, _d, _e, _f;
|
|
527
533
|
var formGroup = element.closest('.form-group');
|
|
528
534
|
var formItem = ((_a = formGroup) === null || _a === void 0 ? void 0 : _a.querySelector('.form-item')) || element.closest('.form-item') || element.querySelector('.form-item');
|
|
529
535
|
var label = (_b = formGroup) === null || _b === void 0 ? void 0 : _b.querySelector('.form-group-label');
|
|
530
536
|
var parent = ((_c = formItem) === null || _c === void 0 ? void 0 : _c.parentElement) || element.parentElement;
|
|
531
|
-
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.add('error');
|
|
537
|
+
(_d = formItem) === null || _d === void 0 ? void 0 : _d.classList.add('error-state');
|
|
538
|
+
(_e = formItem) === null || _e === void 0 ? void 0 : _e.classList.remove('success-state');
|
|
532
539
|
if (parent.querySelector('span.error-text')) {
|
|
533
540
|
parent.removeChild(parent.querySelector('span.error-text'));
|
|
534
541
|
}
|
|
@@ -538,7 +545,7 @@
|
|
|
538
545
|
span.classList.add('ax', 'error-text');
|
|
539
546
|
parent.appendChild(span);
|
|
540
547
|
}
|
|
541
|
-
(
|
|
548
|
+
(_f = label) === null || _f === void 0 ? void 0 : _f.classList.add('error-text');
|
|
542
549
|
};
|
|
543
550
|
__decorate([
|
|
544
551
|
core.Input(),
|
|
@@ -617,7 +624,8 @@
|
|
|
617
624
|
isUserChange: this.userChange
|
|
618
625
|
});
|
|
619
626
|
this.userChange = false;
|
|
620
|
-
|
|
627
|
+
debugger;
|
|
628
|
+
this.clearValidationStyle(this.input.nativeElement, v ? false : true);
|
|
621
629
|
this.cdr.detectChanges();
|
|
622
630
|
}
|
|
623
631
|
},
|
|
@@ -1229,7 +1237,7 @@
|
|
|
1229
1237
|
core.Component({
|
|
1230
1238
|
selector: 'ax-button',
|
|
1231
1239
|
encapsulation: core.ViewEncapsulation.None,
|
|
1232
|
-
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
|
|
1240
|
+
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>"
|
|
1233
1241
|
}),
|
|
1234
1242
|
__metadata("design:paramtypes", [core.ElementRef])
|
|
1235
1243
|
], AXButtonComponent);
|
|
@@ -1700,7 +1708,7 @@
|
|
|
1700
1708
|
AXCalendarBoxComponent = __decorate([
|
|
1701
1709
|
core.Component({
|
|
1702
1710
|
selector: 'ax-calendar-box',
|
|
1703
|
-
template: "<div class=\"calendar-body ax {{size}}\" [ngClass]=\"type\"
|
|
1711
|
+
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>",
|
|
1704
1712
|
encapsulation: core.ViewEncapsulation.None,
|
|
1705
1713
|
changeDetection: core.ChangeDetectionStrategy.OnPush
|
|
1706
1714
|
}),
|
|
@@ -3430,7 +3438,7 @@
|
|
|
3430
3438
|
selector: 'ax-menu2',
|
|
3431
3439
|
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 ",
|
|
3432
3440
|
encapsulation: core.ViewEncapsulation.None,
|
|
3433
|
-
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}"]
|
|
3441
|
+
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}"]
|
|
3434
3442
|
}),
|
|
3435
3443
|
__metadata("design:paramtypes", [overlay.Overlay,
|
|
3436
3444
|
core.ViewContainerRef,
|
|
@@ -3611,10 +3619,7 @@
|
|
|
3611
3619
|
};
|
|
3612
3620
|
AXCheckBoxComponent.prototype.handleClick = function (e) {
|
|
3613
3621
|
if (!this.disabled && !this.readonly) {
|
|
3614
|
-
e.preventDefault();
|
|
3615
|
-
e.stopPropagation();
|
|
3616
3622
|
//TODO: check intermddiate;
|
|
3617
|
-
this.value = !this.value;
|
|
3618
3623
|
this.onClick.emit({
|
|
3619
3624
|
component: this,
|
|
3620
3625
|
htmlElement: this.ref.nativeElement,
|
|
@@ -3675,7 +3680,7 @@
|
|
|
3675
3680
|
AXCheckBoxComponent = __decorate([
|
|
3676
3681
|
core.Component({
|
|
3677
3682
|
selector: 'ax-check-box',
|
|
3678
|
-
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>",
|
|
3683
|
+
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>",
|
|
3679
3684
|
encapsulation: core.ViewEncapsulation.None,
|
|
3680
3685
|
changeDetection: core.ChangeDetectionStrategy.OnPush
|
|
3681
3686
|
}),
|
|
@@ -4680,9 +4685,9 @@
|
|
|
4680
4685
|
], AXToastMessageComponent.prototype, "type", void 0);
|
|
4681
4686
|
AXToastMessageComponent = __decorate([
|
|
4682
4687
|
core.Component({
|
|
4683
|
-
template: "<div class=\"toast-container\">\r\n
|
|
4688
|
+
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>",
|
|
4684
4689
|
encapsulation: core.ViewEncapsulation.None,
|
|
4685
|
-
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;
|
|
4690
|
+
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}}"]
|
|
4686
4691
|
}),
|
|
4687
4692
|
__metadata("design:paramtypes", [core.ElementRef])
|
|
4688
4693
|
], AXToastMessageComponent);
|
|
@@ -6266,7 +6271,7 @@
|
|
|
6266
6271
|
var _a, _b, _c;
|
|
6267
6272
|
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'; });
|
|
6268
6273
|
if (this.required) {
|
|
6269
|
-
this.div.nativeElement.classList.add('required');
|
|
6274
|
+
this.div.nativeElement.classList.add('required-state');
|
|
6270
6275
|
}
|
|
6271
6276
|
};
|
|
6272
6277
|
AXFormGroupComponent.ctorParameters = function () { return [
|
|
@@ -6287,7 +6292,7 @@
|
|
|
6287
6292
|
AXFormGroupComponent = __decorate([
|
|
6288
6293
|
core.Component({
|
|
6289
6294
|
selector: 'ax-form-group',
|
|
6290
|
-
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>",
|
|
6295
|
+
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>",
|
|
6291
6296
|
encapsulation: core.ViewEncapsulation.None,
|
|
6292
6297
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
6293
6298
|
host: { style: 'display: contents;' }
|
|
@@ -8432,6 +8437,7 @@
|
|
|
8432
8437
|
_this.showCheckBox = true;
|
|
8433
8438
|
_this.readonly = false;
|
|
8434
8439
|
_this.rtl = core$1.AXConfig.get('layout.rtl');
|
|
8440
|
+
_this.disabled = false;
|
|
8435
8441
|
_this.size = 'md';
|
|
8436
8442
|
_this.allowNull = true;
|
|
8437
8443
|
_this.textAlign = null;
|
|
@@ -8914,6 +8920,7 @@
|
|
|
8914
8920
|
};
|
|
8915
8921
|
AXSelectBoxComponent.prototype.onFocusTextBox = function (e) { };
|
|
8916
8922
|
AXSelectBoxComponent.prototype.onTextBoxClick = function (e) {
|
|
8923
|
+
debugger;
|
|
8917
8924
|
if (this.disabled == false && this.readonly == false) {
|
|
8918
8925
|
this.dropdown.open();
|
|
8919
8926
|
}
|
|
@@ -8951,6 +8958,7 @@
|
|
|
8951
8958
|
_this.serchBox.focus();
|
|
8952
8959
|
}
|
|
8953
8960
|
}, 0);
|
|
8961
|
+
e.stopPropagation();
|
|
8954
8962
|
};
|
|
8955
8963
|
AXSelectBoxComponent.prototype.handleKeyEventSearch = function (e) {
|
|
8956
8964
|
var _this = this;
|
|
@@ -9433,7 +9441,7 @@
|
|
|
9433
9441
|
AXSelectBoxComponent = AXSelectBoxComponent_1 = __decorate([
|
|
9434
9442
|
core.Component({
|
|
9435
9443
|
selector: 'ax-select-box',
|
|
9436
|
-
template: "<ax-drop-down [size]=\"size\" [rtl]=\"rtl\" [showDropDownButton]=\"showDropDownButton\" [disabled]=\"disabled\"
|
|
9444
|
+
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>",
|
|
9437
9445
|
encapsulation: core.ViewEncapsulation.None,
|
|
9438
9446
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
9439
9447
|
host: { style: 'display: contents;' },
|
|
@@ -13682,6 +13690,7 @@
|
|
|
13682
13690
|
AXTreeViewComponent.prototype.internalSelectItem = function (item, userChange) {
|
|
13683
13691
|
var _this = this;
|
|
13684
13692
|
if (userChange === void 0) { userChange = true; }
|
|
13693
|
+
debugger;
|
|
13685
13694
|
if (item[this.hasChildField] === false || this.selectionMode === 'single') {
|
|
13686
13695
|
item.select = !item.select;
|
|
13687
13696
|
if (item.parentNode && this.selectionMode !== 'single') {
|
|
@@ -13857,6 +13866,7 @@
|
|
|
13857
13866
|
};
|
|
13858
13867
|
AXTreeViewComponent.prototype.handleOnNodeClick = function (e, item, flag) {
|
|
13859
13868
|
if (flag === void 0) { flag = false; }
|
|
13869
|
+
// this.internalSelectItem(item);
|
|
13860
13870
|
this.onItemClick.emit({
|
|
13861
13871
|
component: this,
|
|
13862
13872
|
htmlEvent: e,
|
|
@@ -13909,6 +13919,7 @@
|
|
|
13909
13919
|
_this.hideLoading(null);
|
|
13910
13920
|
_this.list = _data.data.result;
|
|
13911
13921
|
_this.list.forEach(function (el) {
|
|
13922
|
+
el.disabledCheckBox = false;
|
|
13912
13923
|
el.select = false;
|
|
13913
13924
|
if (_this.selectionLevel == 'nodes' && el[_this.hasChildField] == true) {
|
|
13914
13925
|
el.disabledCheckBox = true;
|
|
@@ -13953,6 +13964,7 @@
|
|
|
13953
13964
|
if (_this.list.length !== 0) {
|
|
13954
13965
|
if (_this.itemRow[_this.childField] && _this.itemRow[_this.childField].length > 0) {
|
|
13955
13966
|
result_1.forEach(function (el) {
|
|
13967
|
+
el.disabledCheckBox = false;
|
|
13956
13968
|
_this.itemRow[_this.childField][_this.itemRow[_this.childField].length] = el;
|
|
13957
13969
|
});
|
|
13958
13970
|
}
|
|
@@ -14320,7 +14332,7 @@
|
|
|
14320
14332
|
AXTreeViewComponent = __decorate([
|
|
14321
14333
|
core.Component({
|
|
14322
14334
|
selector: 'ax-tree-view',
|
|
14323
|
-
template: "<ul class=\"ax treeview {{size}}\">\r\n
|
|
14335
|
+
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>",
|
|
14324
14336
|
encapsulation: core.ViewEncapsulation.None
|
|
14325
14337
|
}),
|
|
14326
14338
|
__metadata("design:paramtypes", [core.ElementRef])
|