@acorex/components 16.0.20 → 16.0.21
Sign up to get free protection for your applications and to get access to all the features.
- package/esm2022/lib/calendar/calendar-box/calendar-box.component.mjs +74 -31
- package/esm2022/lib/property-editor/editors/selectbox-editor/selectbox.editor.mjs +4 -4
- package/esm2022/lib/tooltip/tooltip.directive.mjs +16 -5
- package/fesm2022/acorex-components.mjs +86 -31
- package/fesm2022/acorex-components.mjs.map +1 -1
- package/lib/calendar/calendar-box/calendar-box.component.d.ts +8 -4
- package/lib/property-editor/editors/selectbox-editor/selectbox.editor.d.ts +2 -2
- package/lib/tooltip/tooltip.directive.d.ts +1 -0
- package/package.json +1 -1
@@ -973,21 +973,43 @@ class AXCalendarBoxComponent {
|
|
973
973
|
jalali: {
|
974
974
|
locale: AXConfig.get('dateTime.jalali.locale') || 'fa',
|
975
975
|
dir: 'rtl',
|
976
|
-
number: 1
|
976
|
+
number: 1,
|
977
977
|
},
|
978
978
|
gregorian: {
|
979
979
|
locale: AXConfig.get('dateTime.gregorian.locale') || 'en',
|
980
980
|
dir: 'ltr',
|
981
|
-
number: 0
|
982
|
-
}
|
981
|
+
number: 0,
|
982
|
+
},
|
983
983
|
};
|
984
984
|
numRotate;
|
985
985
|
size = 'md';
|
986
986
|
type;
|
987
987
|
locale;
|
988
988
|
dir;
|
989
|
-
|
990
|
-
|
989
|
+
_min;
|
990
|
+
set min(v) {
|
991
|
+
if (v) {
|
992
|
+
this._min = v;
|
993
|
+
this.focusedValue = this.today;
|
994
|
+
this.viewRange = this.today.month.range;
|
995
|
+
this.navigate(0);
|
996
|
+
}
|
997
|
+
}
|
998
|
+
get min() {
|
999
|
+
return this._min;
|
1000
|
+
}
|
1001
|
+
_max;
|
1002
|
+
set max(v) {
|
1003
|
+
if (v) {
|
1004
|
+
this._max = v;
|
1005
|
+
this.focusedValue = this.today;
|
1006
|
+
this.viewRange = this.today.month.range;
|
1007
|
+
this.navigate(0);
|
1008
|
+
}
|
1009
|
+
}
|
1010
|
+
get max() {
|
1011
|
+
return this._max;
|
1012
|
+
}
|
991
1013
|
selectableHoliday = true;
|
992
1014
|
dayStyle = [];
|
993
1015
|
dayMinMaxResoan = '';
|
@@ -1028,7 +1050,7 @@ class AXCalendarBoxComponent {
|
|
1028
1050
|
vv = AXDateTime.convert(v);
|
1029
1051
|
}
|
1030
1052
|
let unValidDate = false;
|
1031
|
-
if (this.
|
1053
|
+
if (this._max || this._min) {
|
1032
1054
|
unValidDate = this.isInMInMaxRange(vv);
|
1033
1055
|
}
|
1034
1056
|
if (!unValidDate) {
|
@@ -1040,7 +1062,7 @@ class AXCalendarBoxComponent {
|
|
1040
1062
|
this.onValueChanged.emit({
|
1041
1063
|
component: this,
|
1042
1064
|
value: this._value?.date,
|
1043
|
-
htmlElement: this.ref.nativeElement
|
1065
|
+
htmlElement: this.ref.nativeElement,
|
1044
1066
|
});
|
1045
1067
|
}
|
1046
1068
|
if (v == undefined) {
|
@@ -1052,7 +1074,7 @@ class AXCalendarBoxComponent {
|
|
1052
1074
|
this.onClick.emit({
|
1053
1075
|
component: this,
|
1054
1076
|
value: this._value?.date,
|
1055
|
-
htmlElement: this.ref.nativeElement
|
1077
|
+
htmlElement: this.ref.nativeElement,
|
1056
1078
|
});
|
1057
1079
|
}
|
1058
1080
|
}
|
@@ -1088,8 +1110,10 @@ class AXCalendarBoxComponent {
|
|
1088
1110
|
return this.dayStyle.find((c) => c.date.split('T')[0] == date.toISOString().split('T')[0]).text;
|
1089
1111
|
}
|
1090
1112
|
else {
|
1091
|
-
if ((this.
|
1092
|
-
|
1113
|
+
if ((this._min &&
|
1114
|
+
this._max &&
|
1115
|
+
date.compaireNew(new AXDateTime(this._min, this.type), 'YMD', this.type) === -1) ||
|
1116
|
+
date.compaireNew(new AXDateTime(this._max, this.type), 'YMD', this.type) === 1) {
|
1093
1117
|
return this.dayMinMaxResoan;
|
1094
1118
|
}
|
1095
1119
|
else {
|
@@ -1143,7 +1167,7 @@ class AXCalendarBoxComponent {
|
|
1143
1167
|
AXTranslator.get(`${path}.wed`, this.locale),
|
1144
1168
|
AXTranslator.get(`${path}.thu`, this.locale),
|
1145
1169
|
AXTranslator.get(`${path}.fri`, this.locale),
|
1146
|
-
AXTranslator.get(`${path}.sat`, this.locale)
|
1170
|
+
AXTranslator.get(`${path}.sat`, this.locale),
|
1147
1171
|
];
|
1148
1172
|
}
|
1149
1173
|
getTodayName() {
|
@@ -1157,7 +1181,11 @@ class AXCalendarBoxComponent {
|
|
1157
1181
|
}
|
1158
1182
|
rotate(array, n) {
|
1159
1183
|
const len = array.length;
|
1160
|
-
return !(n % len)
|
1184
|
+
return !(n % len)
|
1185
|
+
? array
|
1186
|
+
: n > 0
|
1187
|
+
? array.map((e, i, a) => a[(i + n) % len])
|
1188
|
+
: array.map((e, i, a) => a[(len - ((len - i - n) % len)) % len]);
|
1161
1189
|
}
|
1162
1190
|
navigate(value) {
|
1163
1191
|
let start;
|
@@ -1168,7 +1196,10 @@ class AXCalendarBoxComponent {
|
|
1168
1196
|
fd = value.startOf('month');
|
1169
1197
|
}
|
1170
1198
|
else {
|
1171
|
-
fd = this.viewRange.startTime
|
1199
|
+
fd = this.viewRange.startTime
|
1200
|
+
.add('day', 15)
|
1201
|
+
.add('month', value)
|
1202
|
+
.startOf('month');
|
1172
1203
|
}
|
1173
1204
|
start = fd.firstDayOfWeek;
|
1174
1205
|
end = fd.endOf('month').endDayOfWeek;
|
@@ -1191,7 +1222,10 @@ class AXCalendarBoxComponent {
|
|
1191
1222
|
fd = value.startOf('year');
|
1192
1223
|
}
|
1193
1224
|
else {
|
1194
|
-
fd = this.viewRange.startTime
|
1225
|
+
fd = this.viewRange.startTime
|
1226
|
+
.add('day', 15)
|
1227
|
+
.add('year', value)
|
1228
|
+
.startOf('year');
|
1195
1229
|
}
|
1196
1230
|
start = fd;
|
1197
1231
|
end = fd.endOf('year');
|
@@ -1221,7 +1255,8 @@ class AXCalendarBoxComponent {
|
|
1221
1255
|
//
|
1222
1256
|
if (this.view === 'day') {
|
1223
1257
|
this.matrix = this.matrixify(this.applyStyle(this.viewRange.enumurate('day', this.type)), 7);
|
1224
|
-
if (this.matrix.length > 0 &&
|
1258
|
+
if (this.matrix.length > 0 &&
|
1259
|
+
this.matrix[0].find((c) => c.nextMonth === false) === undefined) {
|
1225
1260
|
this.matrix.splice(0, 1);
|
1226
1261
|
}
|
1227
1262
|
if (this.matrix[this.matrix.length - 1].find((c) => c.nextMonth === false) === undefined) {
|
@@ -1241,12 +1276,17 @@ class AXCalendarBoxComponent {
|
|
1241
1276
|
dates.forEach((d, i, j) => {
|
1242
1277
|
const item = {};
|
1243
1278
|
item.date = d;
|
1244
|
-
item.selected =
|
1245
|
-
|
1246
|
-
item.
|
1279
|
+
item.selected =
|
1280
|
+
d.compaireNew(new AXDateTime(this.value, this.type), this.getViewCompaire(this.view), this.type) === 0;
|
1281
|
+
item.focused =
|
1282
|
+
d.compaireNew(this.focusedValue, this.getViewCompaire(this.view), this.type) === 0;
|
1283
|
+
item.today =
|
1284
|
+
this.today &&
|
1285
|
+
d.compaireNew(this.today, this.getViewCompaire(this.view), this.type) === 0;
|
1247
1286
|
if (this.view === 'day') {
|
1248
1287
|
// item.nextMonth = d.compaireNew(this.viewRange.startTime.add('day', 10), 'YM') !== 0;
|
1249
|
-
item.nextMonth =
|
1288
|
+
item.nextMonth =
|
1289
|
+
d.compaireNew(this.viewRange.startTime.add('day', 10), 'YM', this.type) !== 0;
|
1250
1290
|
item.unselect = this.isInMInMaxRange(d);
|
1251
1291
|
this.holidays.forEach((h) => {
|
1252
1292
|
const comp = d.compaireNew(new AXDateTime(h.date, this.type), 'YMD', this.type);
|
@@ -1298,16 +1338,18 @@ class AXCalendarBoxComponent {
|
|
1298
1338
|
isInMInMaxRange(d) {
|
1299
1339
|
let r = false;
|
1300
1340
|
if (d !== undefined) {
|
1301
|
-
if (this.
|
1302
|
-
r =
|
1341
|
+
if (this._min && !this._max) {
|
1342
|
+
r =
|
1343
|
+
d.compaireNew(new AXDateTime(this._min, this.type), this.getViewCompaire(this.view), this.type) === -1;
|
1303
1344
|
}
|
1304
|
-
if (this.
|
1305
|
-
r =
|
1345
|
+
if (this._max && !this._min) {
|
1346
|
+
r =
|
1347
|
+
d.compaireNew(new AXDateTime(this._max, this.type), this.getViewCompaire(this.view), this.type) === 1;
|
1306
1348
|
}
|
1307
|
-
if (this.
|
1349
|
+
if (this._min && this._max) {
|
1308
1350
|
r =
|
1309
|
-
d.compaireNew(new AXDateTime(this.
|
1310
|
-
d.compaireNew(new AXDateTime(this.
|
1351
|
+
d.compaireNew(new AXDateTime(this._min, this.type), this.getViewCompaire(this.view), this.type) === -1 ||
|
1352
|
+
d.compaireNew(new AXDateTime(this._max, this.type), this.getViewCompaire(this.view), this.type) === 1;
|
1311
1353
|
}
|
1312
1354
|
}
|
1313
1355
|
return r;
|
@@ -1318,7 +1360,9 @@ class AXCalendarBoxComponent {
|
|
1318
1360
|
}
|
1319
1361
|
else {
|
1320
1362
|
this.view = 'day';
|
1321
|
-
this.setFocus(new AXDateTime(this.value, this.type)
|
1363
|
+
this.setFocus(new AXDateTime(this.value, this.type)
|
1364
|
+
.set('year', date.year)
|
1365
|
+
.set('month', date.monthOfYear));
|
1322
1366
|
}
|
1323
1367
|
event.stopPropagation();
|
1324
1368
|
}
|
@@ -1651,6 +1695,11 @@ class AXTooltipDirective {
|
|
1651
1695
|
this.hide();
|
1652
1696
|
}
|
1653
1697
|
}
|
1698
|
+
onMouseClick() {
|
1699
|
+
if (this.tooltip && this.tooltipTitle) {
|
1700
|
+
this.hide();
|
1701
|
+
}
|
1702
|
+
}
|
1654
1703
|
show() {
|
1655
1704
|
this.create();
|
1656
1705
|
this.setPosition();
|
@@ -1686,7 +1735,10 @@ class AXTooltipDirective {
|
|
1686
1735
|
setPosition() {
|
1687
1736
|
const hostPos = this.el.nativeElement.getBoundingClientRect();
|
1688
1737
|
const tooltipPos = this.tooltip.getBoundingClientRect();
|
1689
|
-
const scrollPos = window.pageYOffset ||
|
1738
|
+
const scrollPos = window.pageYOffset ||
|
1739
|
+
document.documentElement.scrollTop ||
|
1740
|
+
document.body.scrollTop ||
|
1741
|
+
0;
|
1690
1742
|
let top;
|
1691
1743
|
let left;
|
1692
1744
|
if (this.placement === 'top') {
|
@@ -1709,12 +1761,12 @@ class AXTooltipDirective {
|
|
1709
1761
|
this.renderer.setStyle(this.tooltip, 'left', `${left}px`);
|
1710
1762
|
}
|
1711
1763
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AXTooltipDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
|
1712
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: AXTooltipDirective, selector: "[axTooltip]", inputs: { tooltipTitle: ["tooltip", "tooltipTitle"], placement: "placement", delay: "delay" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, ngImport: i0 });
|
1764
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: AXTooltipDirective, selector: "[axTooltip]", inputs: { tooltipTitle: ["tooltip", "tooltipTitle"], placement: "placement", delay: "delay" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "click": "onMouseClick()" } }, ngImport: i0 });
|
1713
1765
|
}
|
1714
1766
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AXTooltipDirective, decorators: [{
|
1715
1767
|
type: Directive,
|
1716
1768
|
args: [{
|
1717
|
-
selector: '[axTooltip]'
|
1769
|
+
selector: '[axTooltip]',
|
1718
1770
|
}]
|
1719
1771
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { tooltipTitle: [{
|
1720
1772
|
type: Input,
|
@@ -1729,6 +1781,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1729
1781
|
}], onMouseLeave: [{
|
1730
1782
|
type: HostListener,
|
1731
1783
|
args: ['mouseleave']
|
1784
|
+
}], onMouseClick: [{
|
1785
|
+
type: HostListener,
|
1786
|
+
args: ['click']
|
1732
1787
|
}] } });
|
1733
1788
|
|
1734
1789
|
class AXMenuItemClickEvent extends AXEvent {
|
@@ -13189,7 +13244,7 @@ class AXSelectBoxPropertyEditorComponent extends AXProperyEditorComponent {
|
|
13189
13244
|
selectionMode = 'single';
|
13190
13245
|
selectionDataMode = 'value';
|
13191
13246
|
allowSearch = true;
|
13192
|
-
allowNull =
|
13247
|
+
allowNull = true;
|
13193
13248
|
disabled = false;
|
13194
13249
|
items = [];
|
13195
13250
|
remoteOperation = false;
|