@acorex/components 3.0.34 → 3.0.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/acorex-components.metadata.json +1 -1
- package/bundles/acorex-components.umd.js +76 -53
- package/bundles/acorex-components.umd.js.map +1 -1
- package/bundles/acorex-components.umd.min.js +11 -11
- package/bundles/acorex-components.umd.min.js.map +1 -1
- package/esm2015/lib/calendar/scheduler/scheduler.component.js +1 -1
- package/esm2015/lib/calendar/scheduler/views/daytime/scheduler-daytime-view.component.js +1 -1
- package/esm2015/lib/calendar/scheduler/views/month/scheduler-month-view.component.js +1 -1
- package/esm2015/lib/color-picker/color-box/color-box.component.js +1 -1
- package/esm2015/lib/data-filter/filter-panel/filter-panel.component.js +1 -1
- package/esm2015/lib/data-list/list/list.component.js +1 -1
- package/esm2015/lib/dialog/dialog.component.js +1 -1
- package/esm2015/lib/menu/menu2.component.js +1 -1
- package/esm2015/lib/panel-box/panel-box.component.js +1 -1
- package/esm2015/lib/popup/popup.component.js +1 -1
- package/esm2015/lib/property-editor/editors/column-editor/column.editor.js +1 -1
- package/esm2015/lib/property-editor/editors/conditional-color-editor/conditional-color.editor.js +1 -1
- package/esm2015/lib/property-editor/editors/range-editor/range.editor.js +1 -1
- package/esm2015/lib/query-builder/query-builder.component.js +1 -1
- package/esm2015/lib/switch/switch.component.js +1 -1
- package/esm2015/lib/toast/toast-message/toast-message.component.js +1 -1
- package/esm2015/lib/toast/toast-wrapper/toast-wrapper.component.js +1 -1
- package/esm2015/lib/toolbar/search/toolbar-search.component.js +1 -1
- package/esm2015/lib/toolbar/toolbar.component.js +1 -1
- package/esm2015/lib/tree-view/tree-view.component.js +33 -15
- package/esm5/lib/calendar/scheduler/scheduler.component.js +1 -1
- package/esm5/lib/calendar/scheduler/views/daytime/scheduler-daytime-view.component.js +1 -1
- package/esm5/lib/calendar/scheduler/views/month/scheduler-month-view.component.js +1 -1
- package/esm5/lib/color-picker/color-box/color-box.component.js +1 -1
- package/esm5/lib/data-filter/filter-panel/filter-panel.component.js +1 -1
- package/esm5/lib/data-list/list/list.component.js +1 -1
- package/esm5/lib/dialog/dialog.component.js +1 -1
- package/esm5/lib/menu/menu2.component.js +1 -1
- package/esm5/lib/panel-box/panel-box.component.js +1 -1
- package/esm5/lib/popup/popup.component.js +1 -1
- package/esm5/lib/property-editor/editors/column-editor/column.editor.js +1 -1
- package/esm5/lib/property-editor/editors/conditional-color-editor/conditional-color.editor.js +1 -1
- package/esm5/lib/property-editor/editors/range-editor/range.editor.js +1 -1
- package/esm5/lib/query-builder/query-builder.component.js +1 -1
- package/esm5/lib/switch/switch.component.js +1 -1
- package/esm5/lib/toast/toast-message/toast-message.component.js +1 -1
- package/esm5/lib/toast/toast-wrapper/toast-wrapper.component.js +1 -1
- package/esm5/lib/toolbar/search/toolbar-search.component.js +1 -1
- package/esm5/lib/toolbar/toolbar.component.js +1 -1
- package/esm5/lib/tree-view/tree-view.component.js +33 -15
- package/fesm2015/acorex-components.js +51 -33
- package/fesm2015/acorex-components.js.map +1 -1
- package/fesm5/acorex-components.js +51 -33
- package/fesm5/acorex-components.js.map +1 -1
- package/lib/tree-view/tree-view.component.d.ts +2 -1
- package/package.json +4 -4
|
@@ -152,7 +152,7 @@ var AXPopupComponent = /** @class */ (function (_super) {
|
|
|
152
152
|
Component({
|
|
153
153
|
template: "<div class=\"popup-wrapper\" role=\"dialog\" [attr.aria-labelledby]=\"'dialog'+uid+'_label'\" aria-modal=\"true\" cdkTrapFocus>\r\n <div class=\"popup-container {{size}}\" tabindex=\"0\" cdkDrag [class.has-border]=\"!modal\">\r\n <div class=\"ax-popup-header\" cdkDragHandle [attr.id]=\"'dialog'+uid+'_label'\">\r\n <span>\r\n {{title}}\r\n </span>\r\n <span class=\"ax-buttons-containers\">\r\n <i class=\"far fa-expand ax-popup-header-button\" (click)=\"onFullScreen()\" *ngIf=\"maximizable\" tabindex=\"2\"\r\n title=\"\u062A\u0645\u0627\u0645 \u0635\u0641\u062D\u0647\"></i>\r\n <i class=\"far fa-times ax-popup-header-button\" (click)=\"onCloseClick()\" *ngIf=\"closable\" tabindex=\"1\"\r\n title=\"\u0628\u0633\u062A\u0646\"></i>\r\n </span>\r\n </div>\r\n <div class=\"ax-popup-body ax-loading-host\">\r\n <div class=\"ax-popup-body-container\">\r\n <div [hidden]=\"isLoading\">\r\n <ng-template #popupBody></ng-template>\r\n </div>\r\n </div>\r\n <div class=\"ax-popup-footer\" *ngIf=\"!isLoading && footerButtons.length > 0\">\r\n <div class=\"ax-buttons-containers\">\r\n <ng-container *ngFor=\"let button of footerButtons\">\r\n <ax-button [type]=\"button.style\" [icon]=\"button.icon\" [submitBehavior]=\"button.submitBehavior\"\r\n [disabled]=\"button.disable\" [cancelBehavior]=\"button.cancelBehavior\"\r\n (click)=\"handleFooterButtonClick(button)\">\r\n {{button.text}}\r\n </ax-button>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>",
|
|
154
154
|
encapsulation: ViewEncapsulation.None,
|
|
155
|
-
styles: [".popup-wrapper .popup-container{opacity:1;background:var(--ax-white-color);display
|
|
155
|
+
styles: [".popup-wrapper .popup-container{opacity:1;background:var(--ax-white-color);display:flex;flex-direction:column;border-radius:var(--ax-size-border-radius);-webkit-border-radius:var(--ax-size-border-radius);-moz-border-radius:var(--ax-size-border-radius);overflow:hidden;max-height:95vh;height:-webkit-fit-content;height:fit-content;height:-moz-fit-content}.popup-wrapper .popup-container.has-border{border:1px solid var(--ax-border-color);box-shadow:1px 1px 10px var(--ax-border-color)}@media all and (min-width:1280px){.popup-wrapper .popup-container.sm{width:420px!important}.popup-wrapper .popup-container.md{width:680px!important}.popup-wrapper .popup-container.lg{width:1024px!important}}@media all and (min-width:1024px) and (max-width:1279px){.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}.popup-wrapper .popup-container.md{width:500px!important}.popup-wrapper .popup-container.lg{width:900px!important}}@media all and (min-width:768px) and (max-width:1023px){.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}.popup-wrapper .popup-container.md{width:500px!important}.popup-wrapper .popup-container.lg{width:700px!important}}@media all and (min-width:425px) and (max-width:767px){.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}.popup-wrapper .popup-container.lg,.popup-wrapper .popup-container.md{width:460px!important}}@media all and (min-width:0px) and (max-width:424px){.popup-wrapper .popup-container.lg,.popup-wrapper .popup-container.md,.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}}.popup-wrapper .popup-container:focus{box-shadow:0 0 0 .2rem rgba(var(--outline-color),.8);outline-color:transparent}.popup-wrapper .popup-container.full{width:95vw}.popup-wrapper .popup-container .ax-popup-header{background:var(--ax-gray-trans-dark-color);color:var(--ax-dark-color);display:flex;flex-direction:row;justify-content:space-between;align-items:center;font-size:1.2rem;font-weight:500;padding:0 1rem;height:calc(var(--ax-base-size) * var(--ax-base-ratio))!important}.popup-wrapper .popup-container .ax-popup-header .ax-buttons-containers{display:flex;flex-direction:row}.popup-wrapper .popup-container .ax-popup-header .ax-buttons-containers .ax-popup-header-button{width:1em;height:1em;padding:1em;background:rgba(0,0,0,.05);border-radius:50%;font-size:1.2rem;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-margin-start:.5em;margin-inline-start:.5em}.popup-wrapper .popup-container .ax-popup-body{max-height:90vh;min-height:100px;position:relative;overflow:hidden;display:flex;flex-direction:column}@media only screen and (min-device-width:320px) and (max-device-width:480px) and (-webkit-min-device-pixel-ratio:2){.popup-wrapper .popup-container .ax-popup-body{min-height:93vh!important}}.popup-wrapper .popup-container .ax-popup-body .ax-popup-body-container{overflow:auto}.popup-wrapper .popup-container .ax-popup-body .ax-footer{background:var(--ax-white-color);border-top:1px solid;border-color:var(--ax-border-color);-webkit-margin-before:.5em;margin-block-start:.5em;padding:.4em .5em;display:flex;align-items:center}.popup-wrapper .popup-container .ax-popup-body .ax-footer .button{min-width:100px;-webkit-margin-end:.5em;margin-inline-end:.5em}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer{background-color:var(--ax-white-color);display:flex;flex-direction:row;align-items:center;padding:.5em;border-top:1px solid var(--ax-border-color);-webkit-margin-before:.5em;margin-block-start:.5em}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer .ax-buttons-containers{flex:1;max-width:-webkit-fit-content;max-width:fit-content;max-width:-moz-fit-content}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer .ax-buttons-containers .button{-webkit-margin-end:.5em;margin-inline-end:.5em;min-width:80px}"]
|
|
156
156
|
}),
|
|
157
157
|
__metadata("design:paramtypes", [ComponentFactoryResolver,
|
|
158
158
|
ElementRef,
|
|
@@ -106,7 +106,7 @@ var ColumnPropertyEditorComponent = /** @class */ (function (_super) {
|
|
|
106
106
|
ColumnPropertyEditorComponent = __decorate([
|
|
107
107
|
Component({
|
|
108
108
|
template: "<div *ngFor=\"let c of columns\" class=\"column-item\">\r\n <div>\r\n <div>{{c.fieldName}} - {{c.caption}}</div>\r\n </div>\r\n <div>\r\n <div>\r\n </div>\r\n <div class=\"remove-button\" (click)=\"handleRemoveClick(c)\"><i class=\"far fa-trash-alt\"></i></div>\r\n </div>\r\n</div>\r\n<ax-button icon=\"far fa-plus\" size=\"sm\" type=\"success outline\" (click)=\"handleAddClick()\">\u0633\u062A\u0648\u0646 \u0647\u0627</ax-button>\r\n<ng-template #tplEdit>\r\n <ax-page>\r\n <ax-page-content>\r\n <div class=\"container\">\r\n <div class=\"ax-mrg-md\"></div>\r\n <div class=\"table\">\r\n <div class=\"thead\">\r\n <div class=\"tr\">\r\n <div class=\"th\">\r\n <div style=\"width: 5px;\"></div>\r\n \u0646\u0627\u0645\r\n </div>\r\n <div class=\"th\">\u0639\u0646\u0648\u0627\u0646</div>\r\n <div class=\"th\">\u0646\u0648\u0639</div>\r\n <div class=\"th\">\u0646\u0648\u0639 \u0646\u0645\u0627\u06CC\u0634</div>\r\n <div class=\"th\">\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0647\u062F\u0631</div>\r\n <div class=\"th\">\u062A\u06A9\u0645\u06CC\u0644 \u062A\u0648\u0633\u0637 \u06A9\u0627\u0631\u0628\u0631</div>\r\n <div class=\"th\">\u0639\u0645\u0644\u06CC\u0627\u062A</div>\r\n </div>\r\n </div>\r\n <div class=\"tbody\">\r\n <div cdkDropList class=\"drag-drop-table-item\" (cdkDropListDropped)=\"drop($event)\">\r\n <div class=\"tr drag-drop-item-box\" *ngFor=\"let c of columns\" cdkDrag>\r\n <div class=\"td\">\r\n <div>\r\n </div>\r\n <ax-text-box size=\"sm\" [(value)]=\"c.fieldName\" [allowClear]=\"true\"></ax-text-box>\r\n </div>\r\n <div class=\"td\">\r\n <ax-text-box size=\"sm\" [(value)]=\"c.caption\" [allowClear]=\"true\"></ax-text-box>\r\n </div>\r\n <div class=\"td\">\r\n <ax-select-box size=\"sm\" textField=\"title\" valueField=\"id\">\r\n <ax-data-source [provideData]=\"handleDataReceived\"></ax-data-source>\r\n </ax-select-box>\r\n </div>\r\n <div class=\"td\">\r\n <ax-text-box size=\"sm\" [(value)]=\"c.displayType\"></ax-text-box>\r\n </div>\r\n <div class=\"td\">\r\n <ax-check-box size=\"md\" [(value)]=\"c.rowHeader\"></ax-check-box>\r\n </div>\r\n <div class=\"td\">\r\n <ax-check-box size=\"md\" [(value)]=\"c.fillByUser\"></ax-check-box>\r\n </div>\r\n <div class=\"td\">\r\n <ax-button type=\"danger blank\" icon=\"far fa-trash-alt\" (click)=\"handleRemoveClick(c)\">\r\n </ax-button>\r\n <ax-button type=\"primary blank\" icon=\"far fa-ellipsis-v\">\r\n </ax-button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"ax-mrg-md\"></div>\r\n <div style=\"display: flex; justify-content: flex-end;margin-left: 15px;\">\r\n <ax-button icon=\"far fa-plus\" size=\"sm\" type=\"primary\" (click)=\"handleAddColumn()\">\u0627\u0641\u0632\u0648\u062F\u0646 \u0633\u062A\u0648\u0646 \u062C\u062F\u06CC\u062F\r\n </ax-button>\r\n </div>\r\n </ax-page-content>\r\n </ax-page>\r\n</ng-template>",
|
|
109
|
-
styles: [".column-item{border:1px solid var(--ax-gray-light-color);margin-bottom:5px;display
|
|
109
|
+
styles: [".column-item{border:1px solid var(--ax-gray-light-color);margin-bottom:5px;display:flex;padding:5px;border-radius:5px;justify-content:space-between;font-weight:500;align-items:center}.column-item .remove-button{color:var(--ax-danger-color);padding:var(--ax-size-sm);display:flex;justify-content:center;cursor:pointer}.column-item .remove-button:hover{background-color:var(--ax-danger-trans-light-color)}.column-item div:first-child{display:flex;align-items:center}.column-item div:first-child div:first-child{width:100px;height:25px;border-radius:3px}.column-item div:first-child div:last-child{-webkit-margin-start:10px;margin-inline-start:10px}.column-item div:last-child{display:flex;align-items:center}.column-item div:last-child button{background-color:transparent;border:none;cursor:pointer}.column-item div:last-child button i{color:var(--ax-danger-color)}.column-item div:last-child div{min-width:40px}.column-item div:last-child div.min{color:var(--ax-danger-color)}.column-item div:last-child div.max{color:var(--ax-success-color)}.add-item{border:1px solid var(--ax-success-color);background-color:transparent;color:var(--ax-success-color)}table{width:100%;margin-top:1em}table thead th{text-align:right;padding:.4em;border:1px solid #00000029;background-color:var(--ax-primary-trans-dark-color)}table tbody tr td{text-align:center}.table{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}.table .thead{width:100%;display:flex;align-items:center;justify-content:center}.table .thead .tr{width:100%;display:flex;border:1px solid var(--ax-border-color);background-color:var(--ax-primary-trans-light-color)}.table .thead .tr .th{width:calc(100% / 7);height:100%;display:flex;justify-content:center;flex-direction:column;border-left:1px solid var(--ax-border-color);padding:.5em;font-weight:700}.table .tbody{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}.table .tbody .tr{width:100%;height:100%;display:flex;border:1px solid var(--ax-border-color);border-top:0;align-items:center;justify-content:center}.table .tbody .tr .td{width:calc(100% / 7);height:45px;padding:0 .4em;border-left:1px solid var(--ax-border-color);text-align:center;align-items:center;justify-content:center;display:flex}.table .tbody .tr .td:first-child{padding-right:0!important}.table .tbody .tr .td div{width:12px;background-color:var(--ax-border-color);margin-left:.4em;height:100%;cursor:move}.table .tbody .tr .td:last-child{border-left:0!important}.table .tr:first-child{overflow:hidden}.table .th:last-child{border-left:0!important}.drag-drop-table-item{width:100%}.drag-drop-item-box{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px;z-index:700000!important}.cdk-drag-preview{box-sizing:border-box;border-radius:var(--ax-size-border-radius);box-shadow:0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12)}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating,.drag-drop-table-item.cdk-drop-list-dragging .drag-drop-item-box:not(.cdk-drag-placeholder){transition:transform 250ms cubic-bezier(0,0,.2,1)}"]
|
|
110
110
|
}),
|
|
111
111
|
__metadata("design:paramtypes", [ChangeDetectorRef, AXPopupService])
|
|
112
112
|
], ColumnPropertyEditorComponent);
|
package/esm5/lib/property-editor/editors/conditional-color-editor/conditional-color.editor.js
CHANGED
|
@@ -203,7 +203,7 @@ var AXConditionalColorPropertyEditorComponent = /** @class */ (function (_super)
|
|
|
203
203
|
Component({
|
|
204
204
|
template: "<div *ngFor=\"let r of ranges\" [style.border-color]=\"r.color\" class=\"range-item\" (click)=\"handleEditClick(r)\">\r\n <div>\r\n <div [style.background-color]=\"r.color\"></div>\r\n <div>{{ r.display }}</div>\r\n </div>\r\n <div [attr.title]=\"getTitle(r.operator)\">\r\n <div class=\"value\">{{r.value}}</div>\r\n <div>\r\n <i class=\"far {{getIcon(r.operator)}}\"></i>\r\n </div>\r\n <div class=\"value-text\">{{'common.value' | trans}}</div>\r\n <div class=\"remove-button\" (click)=\"handleRemoveClick(r)\"><i class=\"far fa-trash-alt\"></i></div>\r\n </div>\r\n</div>\r\n<ax-button icon=\"far fa-plus\" type=\"success outline\" (click)=\"handleAddClick()\">{{ 'common.add-item' | trans }}\r\n</ax-button>\r\n<ng-template #tplEdit>\r\n <ax-page>\r\n <ax-page-content>\r\n <div class=\"container\">\r\n <ax-validation-form (onInit)=\"onFormInit($event)\">\r\n\r\n <div class=\"row\">\r\n <div class=\"col-12\">\r\n <ax-label>{{ 'common.condition' | trans }}</ax-label>\r\n <ax-select-box [(selectedValues)]=\"editRow.operator\" [allowSearch]=\"false\"\r\n [allowNull]=\"false\" [items]=\"operators\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-select-box>\r\n </div>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-12\">\r\n <ax-label>{{ 'common.value' | trans }}</ax-label>\r\n <div [ngSwitch]=\"dataType\">\r\n <ax-text-box *ngSwitchCase=\"'string'\" [(value)]=\"editRow.value\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-text-box>\r\n <ax-select-box *ngSwitchCase=\"'boolean'\" [(selectedValues)]=\"editRow.value\"\r\n [allowSearch]=\"false\" [allowNull]=\"false\" [items]=\"booleanItems\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-select-box>\r\n <ax-number-box *ngSwitchDefault [(value)]=\"editRow.value\"\r\n [showSeparator]=\"showSeparator\" [decimalNumber]=\"decimalNumber\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-number-box>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-12\">\r\n <ax-label>{{ 'conditional-color-property-editor.replaced-color' | trans }}</ax-label>\r\n <ax-color-picker [(value)]=\"editRow.color\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-color-picker>\r\n </div>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-12\">\r\n <ax-label>{{ 'conditional-color-property-editor.replaced-title' | trans }}</ax-label>\r\n <ax-text-box [(value)]=\"editRow.display\">\r\n </ax-text-box>\r\n </div>\r\n </div>\r\n </ax-validation-form>\r\n </div>\r\n <div class=\"ax-mrg-md\"></div>\r\n </ax-page-content>\r\n </ax-page>\r\n</ng-template>",
|
|
205
205
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
206
|
-
styles: [".range-item{border:1px solid var(--ax-gray-color);margin-bottom:5px;display
|
|
206
|
+
styles: [".range-item{border:1px solid var(--ax-gray-color);margin-bottom:5px;display:flex;padding:5px;border-radius:5px;justify-content:space-between;align-items:center;cursor:pointer}.range-item .remove-button{color:var(--ax-danger-color);padding:var(--ax-size-sm);display:flex;justify-content:center;cursor:pointer}.range-item .remove-button:hover{background-color:var(--ax-danger-trans-light-color)}.range-item div:first-child{display:flex;align-items:center}.range-item div:first-child div:first-child{width:25px;height:25px;border-radius:3px}.range-item div:first-child div:last-child{-webkit-margin-start:10px;margin-inline-start:10px}.range-item div:last-child{display:flex;align-items:center}.range-item div:last-child button{background-color:transparent;border:none;cursor:pointer}.range-item div:last-child button i{color:var(--ax-danger-color)}.range-item div:last-child div{min-width:40px}.range-item div:last-child div.value-text{color:var(--ax-success-color)}.range-item div:last-child div.value{color:var(--ax-danger-color)}"]
|
|
207
207
|
}),
|
|
208
208
|
__metadata("design:paramtypes", [ChangeDetectorRef, AXPopupService])
|
|
209
209
|
], AXConditionalColorPropertyEditorComponent);
|
|
@@ -131,7 +131,7 @@ var AXRangePropertyEditorComponent = /** @class */ (function (_super) {
|
|
|
131
131
|
Component({
|
|
132
132
|
template: "<div *ngFor=\"let r of ranges\" [style.border-color]=\"r.color\" class=\"range-item\" (click)=\"handleEditClick(r)\">\r\n <div>\r\n <div [style.background-color]=\"r.color\"></div>\r\n <div>{{r.title}}</div>\r\n </div>\r\n <div>\r\n <div class=\"min\" title=\"minimum {{r.minValue}}\">{{r.minValue}}</div>\r\n <div>\r\n <i class=\"far fa-long-arrow-left\"></i>\r\n </div>\r\n <div class=\"max\" title=\"maxmimum {{r.maxValue}}\">{{r.maxValue}}</div>\r\n <div class=\"remove-button\" (click)=\"handleRemoveClick(r)\"><i class=\"far fa-trash-alt\"></i></div>\r\n </div>\r\n</div>\r\n<ax-button icon=\"far fa-plus\" type=\"success outline\" (click)=\"handleAddClick()\">{{ 'common.add-item' | trans }}\r\n</ax-button>\r\n<ng-template #tplEdit>\r\n <ax-page>\r\n <ax-page-content>\r\n <div class=\"container\">\r\n <ax-validation-form (onInit)=\"onFormInit($event)\">\r\n <div class=\"row\">\r\n <div class=\"col-12\">\r\n <ax-label>{{ 'common.title' | trans }}</ax-label>\r\n <ax-text-box [(value)]=\"editRow.title\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-text-box>\r\n </div>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <ax-label>{{ 'common.min-value' | trans }}</ax-label>\r\n <ax-number-box [(value)]=\"editRow.minValue\" [showSeparator]=\"showSeparator\"\r\n [decimalNumber]=\"decimalNumber\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-number-box>\r\n </div>\r\n <div class=\"col-6\">\r\n <ax-label>{{ 'common.max-value' | trans }}</ax-label>\r\n <ax-number-box [(value)]=\"editRow.maxValue\" [showSeparator]=\"showSeparator\"\r\n [decimalNumber]=\"decimalNumber\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-number-box>\r\n </div>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-12\">\r\n <ax-label>{{ 'common.color' | trans }}</ax-label>\r\n <ax-color-picker [(value)]=\"editRow.color\">\r\n <ax-validation>\r\n <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n </ax-validation>\r\n </ax-color-picker>\r\n </div>\r\n </div>\r\n </ax-validation-form>\r\n </div>\r\n <div class=\"ax-mrg-md\"></div>\r\n </ax-page-content>\r\n </ax-page>\r\n</ng-template>",
|
|
133
133
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
134
|
-
styles: [".range-item{border:1px solid var(--ax-gray-color);margin-bottom:5px;display
|
|
134
|
+
styles: [".range-item{border:1px solid var(--ax-gray-color);margin-bottom:5px;display:flex;padding:5px;border-radius:5px;justify-content:space-between;align-items:center;cursor:pointer}.range-item .remove-button{color:var(--ax-danger-color);padding:var(--ax-size-sm);display:flex;justify-content:center;cursor:pointer}.range-item .remove-button:hover{background-color:var(--ax-danger-trans-light-color)}.range-item div:first-child{display:flex;align-items:center}.range-item div:first-child div:first-child{width:25px;height:25px;border-radius:3px}.range-item div:first-child div:last-child{-webkit-margin-start:10px;margin-inline-start:10px}.range-item div:last-child{display:flex;align-items:center}.range-item div:last-child button{background-color:transparent;border:none;cursor:pointer}.range-item div:last-child button i{color:var(--ax-danger-color)}.range-item div:last-child div{min-width:40px}.range-item div:last-child div.min{color:var(--ax-danger-color)}.range-item div:last-child div.max{color:var(--ax-success-color)}"]
|
|
135
135
|
}),
|
|
136
136
|
__metadata("design:paramtypes", [ChangeDetectorRef, AXPopupService])
|
|
137
137
|
], AXRangePropertyEditorComponent);
|
|
@@ -91,7 +91,7 @@ var AXQueryBuilderComponent = /** @class */ (function (_super) {
|
|
|
91
91
|
selector: 'ax-query-builder',
|
|
92
92
|
template: "<ax-query-group #queryGroup [mode]=\"mode\" [group]=\"rootGroup\" [fields]=\"fields\"\r\n (groupRuleChanged)=\"ruleChanged($event)\">\r\n</ax-query-group>",
|
|
93
93
|
encapsulation: ViewEncapsulation.None,
|
|
94
|
-
styles: [".ax-query-group{display
|
|
94
|
+
styles: [".ax-query-group{display:flex;flex-direction:column;margin:5px;-webkit-padding-start:0;padding-inline-start:0}.ax-query-group .add-buttons{display:flex;margin:5px;flex-direction:row}.ax-query-group .add-buttons .handler{display:flex;align-items:center;background-color:var(--ax-primary-trans-light-color);color:var(--ax-primary-color);padding:5px;cursor:move;border:1px solid var(--ax-primary-trans-light-color);border-start-start-radius:4px;border-end-start-radius:4px}.ax-query-group .buttons-list{-webkit-margin-start:10px;margin-inline-start:10px;display:flex;align-items:center}.ax-query-group .buttons-list .button{cursor:pointer;-webkit-margin-end:.5em;margin-inline-end:.5em;width:2.3em;height:2.3em;display:flex;align-items:center;justify-content:center;border-radius:50px;position:relative}.ax-query-group .buttons-list .button ax-check-box{opacity:0;width:100%;height:100%;position:absolute;z-index:1;left:0;top:0}.ax-query-group .buttons-list .variable{color:var(--ax-warning-color);background:var(--ax-warning-trans-light-color)}.ax-query-group .buttons-list .variable.active-button{background:var(--ax-warning-light-color);color:var(--ax-white-color);opacity:.7}.ax-query-group .buttons-list .commit{color:var(--ax-success-color);background:var(--ax-success-trans-light-color)}.ax-query-group .buttons-list .remove{color:var(--ax-danger-color);background:var(--ax-danger-trans-light-color)}.ax-query-group .buttons-list .edit{color:var(--ax-primary-color);background:var(--ax-primary-trans-light-color)}.ax-query-group .group-item{transition:.5s}.ax-query-group .group-item .condition{width:40px;display:flex;align-items:center;background:linear-gradient(180deg,rgba(2,0,36,0) 49%,var(--ax-gray-light-color) 49%,var(--ax-gray-light-color) 55%,rgba(0,212,255,0) 50%)}.ax-query-group .group-item .condition .text{-webkit-margin-start:-50%;margin-inline-start:-50%;border-radius:50%;width:35px;height:35px;display:flex;align-items:center;justify-content:center}.ax-query-group .group-item .condition .text.OR{background:var(--ax-warning-color);color:var(--ax-warning-fore-color)}.ax-query-group .group-item .condition .text.AND{background:var(--ax-success-color);color:var(--ax-success-fore-color)}.ax-query-group .header{display:flex;flex-direction:row}.ax-query-group .header .handler{display:flex;align-items:center;background-color:var(--ax-light-light-color);color:var(--ax-light-fore-color);padding:5px;cursor:move;border:1px solid var(--ax-light-light-color);border-start-start-radius:4px;border-end-start-radius:4px}.ax-query-group .header .caption{padding:.5rem;background-color:var(--ax-gray-trans-light-color);color:var(--ax-gray-dark-color);font-weight:700;cursor:pointer}.ax-query-group .header .detail{padding:.5rem;background-color:var(--ax-gray-trans-light-color);border-right:none;border-start-end-radius:4px;border-end-end-radius:4px;cursor:pointer}.ax-query-group .header .detail.OR{background-color:var(--ax-warning-trans-light-color)}.ax-query-group .header .detail.AND{background-color:var(--ax-success-trans-light-color)}.ax-query-group .rules{-webkit-margin-start:10px;margin-inline-start:10px;-webkit-border-start:2px solid var(--ax-gray-light-color);border-inline-start:2px solid var(--ax-gray-light-color)}.ax-query-group .rules .rules{-webkit-margin-start:48px;margin-inline-start:48px}.ax-query-group .ax-query-rule{display:flex;margin:5px;flex-direction:row;transition:.5s}.ax-query-group .ax-query-rule .handler{display:flex;align-items:center;background-color:var(--ax-light-light-color);color:var(--ax-light-fore-color);padding:.5em;cursor:move;border:1px solid var(--ax-light-light-color);border-start-start-radius:4px;border-end-start-radius:4px}.ax-query-group .ax-query-rule .caption{padding:.5rem;background-color:var(--ax-gray-trans-light-color);border:1px solid var(--ax-gray-light-color);color:#333;font-weight:700;cursor:pointer}.ax-query-group .ax-query-rule .caption.editable{width:200px}.ax-query-group .ax-query-rule .operator{border-top:1px solid var(--ax-gray-light-color);border-bottom:1px solid var(--ax-gray-light-color);background-color:var(--ax-gray-trans-light-color);padding:.5rem}.ax-query-group .ax-query-rule .operator.editable{width:200px}.ax-query-group .ax-query-rule .operator .text{color:var(--ax-primary-color);font-weight:700;-webkit-text-decoration:underline dashed;text-decoration:underline dashed;cursor:pointer}.ax-query-group .ax-query-rule .operator.radius{border-top-left-radius:4px;border-bottom-left-radius:4px;border:1px solid var(--ax-gray-light-color);border-right:none}.ax-query-group .ax-query-rule .value{padding:.5rem;background-color:var(--ax-light-light-color);color:#000;border:1px solid var(--ax-gray-light-color);border-right:none;border-start-end-radius:4px;border-end-end-radius:4px;cursor:pointer}.ax-query-group .ax-query-rule .value.editable{width:200px}.ax-query-group .ax-query-rule .add-rule{border-top:1px dashed var(--ax-gray-light-color);border-bottom:1px dashed var(--ax-gray-light-color);color:var(--ax-gray-dark-color);padding:.5rem;font-weight:700;cursor:pointer}.ax-query-group .ax-query-rule .add-group:hover,.ax-query-group .ax-query-rule .add-rule:hover{background-color:var(--ax-gray-light-color)}.ax-query-group .ax-query-rule .add-condition,.ax-query-group .ax-query-rule .add-group{border-top:1px dashed var(--ax-gray-light-color);border-bottom:1px dashed var(--ax-gray-light-color);color:var(--ax-gray-dark-color);padding:.5rem;border:1px dashed var(--ax-gray-light-color);border-top-left-radius:4px;border-bottom-left-radius:4px;cursor:pointer}.ax-query-group .ax-query-rule .add-condition.OR{background-color:var(--ax-warning-trans-light-color);color:var(--ax-warning-dark-color)}.ax-query-group .ax-query-rule .add-condition.AND{background-color:var(--ax-success-trans-light-color);color:var(--ax-success-dark-color)}.ax-query-group .ax-query-rule .add-condition:hover.OR{background-color:var(--ax-warning-trans-light-color);color:var(--ax-warning-dark-color)}.ax-query-group .ax-query-rule .add-condition:hover.AND{background-color:var(--ax-success-trans-light-color);color:var(--ax-success-dark-color)}"]
|
|
95
95
|
}),
|
|
96
96
|
__metadata("design:paramtypes", [ElementRef, AXToastService])
|
|
97
97
|
], AXQueryBuilderComponent);
|
|
@@ -70,7 +70,7 @@ var AXSwitchComponent = /** @class */ (function (_super) {
|
|
|
70
70
|
template: "<label class=\"ax ax-switch\" >\r\n <input type=\"checkbox\" [(ngModel)]=\"value\" [ngModelOptions]=\"{standalone: true}\" [attr.tabindex]=\"tabIndex\">\r\n <span class=\"slider round\"></span>\r\n</label>",
|
|
71
71
|
encapsulation: ViewEncapsulation.None,
|
|
72
72
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
73
|
-
styles: [".ax.ax-switch{position:relative;display:inline-block;width:46px;height:25px;margin:5px}.ax.ax-switch>input{opacity:0;width:0;height:0}.ax.ax-switch>input:checked+.slider{background-color:var(--ax-primary-color)}.ax.ax-switch>input:checked+.slider::before{
|
|
73
|
+
styles: [".ax.ax-switch{position:relative;display:inline-block;width:46px;height:25px;margin:5px}.ax.ax-switch>input{opacity:0;width:0;height:0}.ax.ax-switch>input:checked+.slider{background-color:var(--ax-primary-color)}.ax.ax-switch>input:checked+.slider::before{transform:translateX(21px)}.ax.ax-switch:focus-within .slider{outline:1px solid var(--ax-primary-color)}.ax.ax-switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.2s}.ax.ax-switch .slider::before{content:\"\";position:absolute;height:21px;width:21px;left:2px;bottom:2px;background-color:#fff;transition:.2s}.ax.ax-switch .slider.round{border-radius:25px}.ax.ax-switch .slider.round:before{border-radius:50%}"]
|
|
74
74
|
}),
|
|
75
75
|
__metadata("design:paramtypes", [ChangeDetectorRef])
|
|
76
76
|
], AXSwitchComponent);
|
|
@@ -81,7 +81,7 @@ var AXToastMessageComponent = /** @class */ (function () {
|
|
|
81
81
|
Component({
|
|
82
82
|
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>",
|
|
83
83
|
encapsulation: ViewEncapsulation.None,
|
|
84
|
-
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;border-radius:var(--ax-size-border-radius)}.toast-container header{display
|
|
84
|
+
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;border-radius:var(--ax-size-border-radius)}.toast-container header{display:flex;justify-content:space-between;padding:1rem;font-weight:500}.toast-container .content{padding:1rem;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}}"]
|
|
85
85
|
}),
|
|
86
86
|
__metadata("design:paramtypes", [ElementRef])
|
|
87
87
|
], AXToastMessageComponent);
|
|
@@ -9,7 +9,7 @@ var AXToastWrapperComponent = /** @class */ (function () {
|
|
|
9
9
|
selector: 'ax-toast-wrapper',
|
|
10
10
|
template: '',
|
|
11
11
|
encapsulation: ViewEncapsulation.None,
|
|
12
|
-
styles: ["ax-toast-wrapper{min-width:300px;max-width:360px;height:auto;position:fixed;bottom:0;right:50%;left:50%;display
|
|
12
|
+
styles: ["ax-toast-wrapper{min-width:300px;max-width:360px;height:auto;position:fixed;bottom:0;right:50%;left:50%;display:flex;flex-direction:column;margin:auto auto auto -150px;z-index:10003;flex-wrap:wrap}"]
|
|
13
13
|
}),
|
|
14
14
|
__metadata("design:paramtypes", [])
|
|
15
15
|
], AXToastWrapperComponent);
|
|
@@ -62,7 +62,7 @@ var AXToolbarSearchComponent = /** @class */ (function () {
|
|
|
62
62
|
selector: 'ax-toolbar-search',
|
|
63
63
|
template: "<div class=\"search-bar\">\r\n <input #input type=\"text\" placeholder=\"\u062C\u0633\u062A\u062C\u0648 ...\" (input)=\"onSearchChanged($event.target.value)\" />\r\n <i class=\"far fa-search text-secondary\"></i>\r\n</div>",
|
|
64
64
|
providers: [{ provide: AXToolbarItem, useExisting: AXToolbarSearchComponent_1 }],
|
|
65
|
-
styles: [".search-bar{display
|
|
65
|
+
styles: [".search-bar{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--ax-border-color);border-radius:var(--ax-size-border-radius);padding:.3em .6em;background:var(--ax-white-color)}.search-bar input{border:none!important;background-color:transparent;outline-color:transparent!important;flex:1;font-family:inherit;font-size:inherit}.search-bar input::-moz-placeholder{color:var(--ax-gray-color)}.search-bar input::placeholder{color:var(--ax-gray-color)}.search-bar i{color:var(--ax-gray-color)}"]
|
|
66
66
|
}),
|
|
67
67
|
__metadata("design:paramtypes", [])
|
|
68
68
|
], AXToolbarSearchComponent);
|
|
@@ -9,7 +9,7 @@ var AXToolbarComponent = /** @class */ (function () {
|
|
|
9
9
|
selector: 'ax-toolbar',
|
|
10
10
|
template: "<div class=\"ax-toolbar\">\r\n <ng-content>\r\n </ng-content>\r\n</div>",
|
|
11
11
|
encapsulation: ViewEncapsulation.None,
|
|
12
|
-
styles: ["ax-toolbar{width:100%}ax-toolbar .ax-toolbar{display
|
|
12
|
+
styles: ["ax-toolbar{width:100%}ax-toolbar .ax-toolbar{display:flex;width:100%;justify-content:space-between;align-items:center}"]
|
|
13
13
|
}),
|
|
14
14
|
__metadata("design:paramtypes", [])
|
|
15
15
|
], AXToolbarComponent);
|