@sumaris-net/ngx-components 1.19.17 → 1.19.20
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/bundles/sumaris-net.ngx-components.umd.js +106 -73
- package/bundles/sumaris-net.ngx-components.umd.js.map +1 -1
- package/bundles/sumaris-net.ngx-components.umd.min.js +1 -1
- package/bundles/sumaris-net.ngx-components.umd.min.js.map +1 -1
- package/doc/changelog.md +4 -0
- package/esm2015/src/app/core/account/account.js +16 -4
- package/esm2015/src/app/core/services/platform.service.js +15 -3
- package/esm2015/src/app/core/services/storage/entities-storage.service.js +28 -27
- package/esm2015/src/app/shared/material/datetime/material.datetime.js +4 -7
- package/esm2015/src/app/shared/material/datetime/testing/mat-date-time.test.js +6 -4
- package/esm2015/src/app/shared/platforms.js +2 -1
- package/fesm2015/sumaris-net.ngx-components.js +64 -39
- package/fesm2015/sumaris-net.ngx-components.js.map +1 -1
- package/package.json +1 -1
- package/src/app/core/services/platform.service.d.ts +1 -0
- package/src/app/core/services/storage/entities-storage.service.d.ts +5 -5
- package/sumaris-net.ngx-components.metadata.json +1 -1
|
@@ -1366,6 +1366,7 @@
|
|
|
1366
1366
|
if (_cache.mobile === null || _cache.mobile === undefined) {
|
|
1367
1367
|
_cache.mobile = isCordova(window)
|
|
1368
1368
|
|| isAndroid(win) || isIOS(window)
|
|
1369
|
+
// Workaround, for MS Windows touch screen (detected as mobile, but forced as desktop)
|
|
1369
1370
|
|| (isTouchUi(win) && !isWindows(win));
|
|
1370
1371
|
}
|
|
1371
1372
|
return _cache.mobile;
|
|
@@ -6062,7 +6063,7 @@
|
|
|
6062
6063
|
// Workaround because ion-datetime has issue (do not returned a ISO date)
|
|
6063
6064
|
this._keyboardHideDelay = this.mobile && KEYBOARD_HIDE_DELAY_MS || 0;
|
|
6064
6065
|
this.required = isNotNilBoolean(this.required) ? this.required : (this.formControl.validator === i1.Validators.required || isBlankString(this.required));
|
|
6065
|
-
// Add 'validDate' validator (when existing validator are null or required, to be sure to keep
|
|
6066
|
+
// Add 'validDate' validator (when existing validator are null or required, to be sure to keep)
|
|
6066
6067
|
if (!this.formControl.validator || this.formControl.validator === i1.Validators.required) {
|
|
6067
6068
|
this.formControl.setValidators(this.required ? [i1.Validators.required, SharedValidators.validDate] : SharedValidators.validDate);
|
|
6068
6069
|
}
|
|
@@ -6071,12 +6072,9 @@
|
|
|
6071
6072
|
[this.formControl.validator, SharedValidators.validDate]);
|
|
6072
6073
|
}
|
|
6073
6074
|
// Create the day control
|
|
6074
|
-
this.dayControl = this.formBuilder.control(null
|
|
6075
|
+
this.dayControl = this.formBuilder.control(null);
|
|
6075
6076
|
// Create the hour control
|
|
6076
|
-
|
|
6077
|
-
(this.mobile ? i1.Validators.required : i1.Validators.compose([i1.Validators.required, i1.Validators.pattern(HOUR_REGEXP)])) :
|
|
6078
|
-
(this.mobile ? null : i1.Validators.pattern(HOUR_REGEXP));
|
|
6079
|
-
this.hourControl = this.formBuilder.control(null, timeValidator);
|
|
6077
|
+
this.hourControl = this.formBuilder.control(null, this.mobile ? null : i1.Validators.pattern(HOUR_REGEXP));
|
|
6080
6078
|
// Get patterns to display date and date+time
|
|
6081
6079
|
this._subscription.add(this.translate.get(['COMMON.DATE_PATTERN', 'COMMON.DATE_TIME_PATTERN'])
|
|
6082
6080
|
.subscribe(function (patterns) { return _this.updatePattern(patterns); }));
|
|
@@ -13869,6 +13867,58 @@
|
|
|
13869
13867
|
enumerable: false,
|
|
13870
13868
|
configurable: true
|
|
13871
13869
|
});
|
|
13870
|
+
EntitiesStorage.prototype.ngOnStart = function () {
|
|
13871
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
13872
|
+
var now;
|
|
13873
|
+
var _this = this;
|
|
13874
|
+
return __generator(this, function (_a) {
|
|
13875
|
+
switch (_a.label) {
|
|
13876
|
+
case 0:
|
|
13877
|
+
now = Date.now();
|
|
13878
|
+
console.info("[entities-storage] Starting entity storage...");
|
|
13879
|
+
// Restore stores
|
|
13880
|
+
return [4 /*yield*/, this.restoreLocally()];
|
|
13881
|
+
case 1:
|
|
13882
|
+
// Restore stores
|
|
13883
|
+
_a.sent();
|
|
13884
|
+
// Start a save timer
|
|
13885
|
+
this.registerSubscription(rxjs.merge(this._$save, rxjs.timer(this._saveTimerPeriod, this._saveTimerPeriod))
|
|
13886
|
+
.pipe(
|
|
13887
|
+
// Avoid to many call (e.g. when $save AND timer are triggered
|
|
13888
|
+
operators.throttleTime(this._saveTimerPeriod))
|
|
13889
|
+
.subscribe(function () { return _this.storeLocally({ skipIfPristine: true }); }));
|
|
13890
|
+
// Save, when platform is in pause
|
|
13891
|
+
this.registerSubscription(this.platform.pause.subscribe(function () { return __awaiter(_this, void 0, void 0, function () {
|
|
13892
|
+
return __generator(this, function (_a) {
|
|
13893
|
+
switch (_a.label) {
|
|
13894
|
+
case 0:
|
|
13895
|
+
console.warn("[entities-storage] Platform will pause: saving...");
|
|
13896
|
+
return [4 /*yield*/, this.storeLocally({ skipIfPristine: true })];
|
|
13897
|
+
case 1:
|
|
13898
|
+
_a.sent();
|
|
13899
|
+
console.warn("[entities-storage] Platform will pause: saving [OK]");
|
|
13900
|
+
return [2 /*return*/];
|
|
13901
|
+
}
|
|
13902
|
+
});
|
|
13903
|
+
}); }));
|
|
13904
|
+
console.info("[entities-storage] Starting [OK] in " + (Date.now() - now) + "ms");
|
|
13905
|
+
return [2 /*return*/, this._data];
|
|
13906
|
+
}
|
|
13907
|
+
});
|
|
13908
|
+
});
|
|
13909
|
+
};
|
|
13910
|
+
EntitiesStorage.prototype.ngOnStop = function () {
|
|
13911
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
13912
|
+
return __generator(this, function (_a) {
|
|
13913
|
+
switch (_a.label) {
|
|
13914
|
+
case 0: return [4 /*yield*/, this.storeLocally({ skipIfPristine: true })];
|
|
13915
|
+
case 1:
|
|
13916
|
+
_a.sent();
|
|
13917
|
+
return [2 /*return*/];
|
|
13918
|
+
}
|
|
13919
|
+
});
|
|
13920
|
+
});
|
|
13921
|
+
};
|
|
13872
13922
|
EntitiesStorage.prototype.watchAll = function (entityName, variables, opts) {
|
|
13873
13923
|
var _this = this;
|
|
13874
13924
|
// Make sure store is ready
|
|
@@ -14279,52 +14329,8 @@
|
|
|
14279
14329
|
};
|
|
14280
14330
|
EntitiesStorage.prototype.persist = function (opts) {
|
|
14281
14331
|
if (opts === void 0) { opts = { skipIfPristine: true }; }
|
|
14282
|
-
// Skip if pristine
|
|
14283
|
-
if (opts.skipIfPristine && !this._dirty)
|
|
14284
|
-
return Promise.resolve();
|
|
14285
14332
|
return this.storeLocally(opts);
|
|
14286
14333
|
};
|
|
14287
|
-
EntitiesStorage.prototype.ngOnStart = function () {
|
|
14288
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
14289
|
-
var now;
|
|
14290
|
-
var _this = this;
|
|
14291
|
-
return __generator(this, function (_a) {
|
|
14292
|
-
switch (_a.label) {
|
|
14293
|
-
case 0:
|
|
14294
|
-
now = Date.now();
|
|
14295
|
-
console.info("[entities-storage] Starting entity storage...");
|
|
14296
|
-
// Restore sequences
|
|
14297
|
-
return [4 /*yield*/, this.restoreLocally()];
|
|
14298
|
-
case 1:
|
|
14299
|
-
// Restore sequences
|
|
14300
|
-
_a.sent();
|
|
14301
|
-
// Start a save timer
|
|
14302
|
-
this.registerSubscription(rxjs.merge(this._$save, rxjs.timer(this._saveTimerPeriod, this._saveTimerPeriod))
|
|
14303
|
-
.pipe(
|
|
14304
|
-
// Avoid to many call (e.g. when $save AND timer are triggered
|
|
14305
|
-
operators.throttleTime(this._saveTimerPeriod))
|
|
14306
|
-
.subscribe(function () { return _this.storeLocally(); }));
|
|
14307
|
-
console.info("[entities-storage] Starting [OK] in " + (Date.now() - now) + "ms");
|
|
14308
|
-
return [2 /*return*/, this._data];
|
|
14309
|
-
}
|
|
14310
|
-
});
|
|
14311
|
-
});
|
|
14312
|
-
};
|
|
14313
|
-
EntitiesStorage.prototype.ngOnStop = function () {
|
|
14314
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
14315
|
-
return __generator(this, function (_a) {
|
|
14316
|
-
switch (_a.label) {
|
|
14317
|
-
case 0:
|
|
14318
|
-
if (!this.dirty) return [3 /*break*/, 2];
|
|
14319
|
-
return [4 /*yield*/, this.storeLocally()];
|
|
14320
|
-
case 1:
|
|
14321
|
-
_a.sent();
|
|
14322
|
-
_a.label = 2;
|
|
14323
|
-
case 2: return [2 /*return*/];
|
|
14324
|
-
}
|
|
14325
|
-
});
|
|
14326
|
-
});
|
|
14327
|
-
};
|
|
14328
14334
|
/* -- protected methods -- */
|
|
14329
14335
|
EntitiesStorage.prototype.getEntityStore = function (name, opts) {
|
|
14330
14336
|
var store = this._data[name];
|
|
@@ -18275,7 +18281,7 @@
|
|
|
18275
18281
|
switch (platformName) {
|
|
18276
18282
|
case 'mobile':
|
|
18277
18283
|
case 'mobileweb':
|
|
18278
|
-
// Exclude Windows touch screens - see
|
|
18284
|
+
// Exclude Windows touch screens - see sumaris-app issues #323 and #346
|
|
18279
18285
|
return this.platform.is(platformName) && !isWindows(window);
|
|
18280
18286
|
default:
|
|
18281
18287
|
return this.platform.is(platformName);
|
|
@@ -18348,6 +18354,7 @@
|
|
|
18348
18354
|
this._cordova = this.is('cordova');
|
|
18349
18355
|
this._android = this.is('android');
|
|
18350
18356
|
this._ios = this.is('ios');
|
|
18357
|
+
this.configureClassList(this._mobile);
|
|
18351
18358
|
this.configureCordovaPlugins();
|
|
18352
18359
|
// Force some settings
|
|
18353
18360
|
this.settings.mobile = this._mobile;
|
|
@@ -18393,7 +18400,7 @@
|
|
|
18393
18400
|
_this.accountService.tokenType = tokenType;
|
|
18394
18401
|
});
|
|
18395
18402
|
// Hide the splashscreen (if mobile) - after 1s - and play start sound
|
|
18396
|
-
if (this.
|
|
18403
|
+
if (this._mobile) {
|
|
18397
18404
|
setTimeout(function () {
|
|
18398
18405
|
var _a;
|
|
18399
18406
|
(_a = _this.splashScreen) === null || _a === void 0 ? void 0 : _a.hide();
|
|
@@ -18498,6 +18505,18 @@
|
|
|
18498
18505
|
//}
|
|
18499
18506
|
};
|
|
18500
18507
|
/* -- protected methods -- */
|
|
18508
|
+
PlatformService.prototype.configureClassList = function (mobile, win) {
|
|
18509
|
+
if (win === void 0) { win = window; }
|
|
18510
|
+
var _a, _b;
|
|
18511
|
+
if (mobile)
|
|
18512
|
+
return; // Nothing to do
|
|
18513
|
+
// Workaround, for MS Windows touch screen (detected as mobile, but forced as desktop)
|
|
18514
|
+
if (!mobile && (((_a = win.document.documentElement) === null || _a === void 0 ? void 0 : _a.classList.contains('plt-mobile')) || ((_b = win.document.documentElement.classList) === null || _b === void 0 ? void 0 : _b.contains('plt-mobileweb')))) {
|
|
18515
|
+
console.warn('[platform] Force class list to: <html class="plt-desktop">. Workaround for Windows touch screen.');
|
|
18516
|
+
win.document.documentElement.classList.remove('plt-mobile', 'plt-mobileweb');
|
|
18517
|
+
win.document.documentElement.classList.add('plt-desktop');
|
|
18518
|
+
}
|
|
18519
|
+
};
|
|
18501
18520
|
PlatformService.prototype.configureCordovaPlugins = function () {
|
|
18502
18521
|
console.info('[platform] Configuring Cordova plugins...');
|
|
18503
18522
|
if (this.statusBar) {
|
|
@@ -22013,7 +22032,7 @@
|
|
|
22013
22032
|
};
|
|
22014
22033
|
AccountPage.prototype.refresh = function (event) {
|
|
22015
22034
|
return __awaiter(this, void 0, void 0, function () {
|
|
22016
|
-
return __generator(this, function (
|
|
22035
|
+
return __generator(this, function (_c) {
|
|
22017
22036
|
this.disable();
|
|
22018
22037
|
this.markAsLoading();
|
|
22019
22038
|
return [2 /*return*/, this.accountService.reload()];
|
|
@@ -22034,8 +22053,8 @@
|
|
|
22034
22053
|
AccountPage.prototype.sendConfirmationEmail = function (event) {
|
|
22035
22054
|
return __awaiter(this, void 0, void 0, function () {
|
|
22036
22055
|
var json, err_1;
|
|
22037
|
-
return __generator(this, function (
|
|
22038
|
-
switch (
|
|
22056
|
+
return __generator(this, function (_c) {
|
|
22057
|
+
switch (_c.label) {
|
|
22039
22058
|
case 0:
|
|
22040
22059
|
json = this.form.value;
|
|
22041
22060
|
json.email = this.form.controls['email'].value;
|
|
@@ -22045,17 +22064,17 @@
|
|
|
22045
22064
|
}
|
|
22046
22065
|
this.email.sending = true;
|
|
22047
22066
|
console.debug('[account] Sending confirmation email...');
|
|
22048
|
-
|
|
22067
|
+
_c.label = 1;
|
|
22049
22068
|
case 1:
|
|
22050
|
-
|
|
22069
|
+
_c.trys.push([1, 3, , 4]);
|
|
22051
22070
|
return [4 /*yield*/, this.accountService.sendConfirmationEmail(json.email, json.settings && json.settings.locale || this.translate.currentLang)];
|
|
22052
22071
|
case 2:
|
|
22053
|
-
|
|
22072
|
+
_c.sent();
|
|
22054
22073
|
console.debug('[account] Confirmation email sent.');
|
|
22055
22074
|
this.email.sending = false;
|
|
22056
22075
|
return [3 /*break*/, 4];
|
|
22057
22076
|
case 3:
|
|
22058
|
-
err_1 =
|
|
22077
|
+
err_1 = _c.sent();
|
|
22059
22078
|
this.email.sending = false;
|
|
22060
22079
|
this.email.error = err_1 && err_1.message || err_1;
|
|
22061
22080
|
return [3 /*break*/, 4];
|
|
@@ -22067,38 +22086,38 @@
|
|
|
22067
22086
|
AccountPage.prototype.save = function (event) {
|
|
22068
22087
|
return __awaiter(this, void 0, void 0, function () {
|
|
22069
22088
|
var newAccount, err_2;
|
|
22070
|
-
return __generator(this, function (
|
|
22071
|
-
switch (
|
|
22089
|
+
return __generator(this, function (_c) {
|
|
22090
|
+
switch (_c.label) {
|
|
22072
22091
|
case 0:
|
|
22073
22092
|
if (this.saving)
|
|
22074
22093
|
return [2 /*return*/, false];
|
|
22075
22094
|
if (!!this.form.valid) return [3 /*break*/, 2];
|
|
22076
22095
|
return [4 /*yield*/, AppFormUtils.waitWhilePending(this.form)];
|
|
22077
22096
|
case 1:
|
|
22078
|
-
|
|
22097
|
+
_c.sent();
|
|
22079
22098
|
if (this.form.invalid) {
|
|
22080
22099
|
AppFormUtils.logFormErrors(this.form);
|
|
22081
22100
|
this.form.markAllAsTouched();
|
|
22082
22101
|
return [2 /*return*/, false];
|
|
22083
22102
|
}
|
|
22084
|
-
|
|
22103
|
+
_c.label = 2;
|
|
22085
22104
|
case 2:
|
|
22086
22105
|
this.submitted = true;
|
|
22087
22106
|
this.saving = true;
|
|
22088
22107
|
this.error = undefined;
|
|
22089
22108
|
newAccount = exports.Account.fromObject(Object.assign(Object.assign({}, (this.accountService.account.asObject())), (this.form.value)));
|
|
22090
22109
|
console.debug('[account] Saving account...', newAccount);
|
|
22091
|
-
|
|
22110
|
+
_c.label = 3;
|
|
22092
22111
|
case 3:
|
|
22093
|
-
|
|
22112
|
+
_c.trys.push([3, 5, 6, 7]);
|
|
22094
22113
|
this.disable();
|
|
22095
22114
|
return [4 /*yield*/, this.accountService.save(newAccount)];
|
|
22096
22115
|
case 4:
|
|
22097
|
-
|
|
22116
|
+
_c.sent();
|
|
22098
22117
|
this.markAsPristine();
|
|
22099
22118
|
return [2 /*return*/, true];
|
|
22100
22119
|
case 5:
|
|
22101
|
-
err_2 =
|
|
22120
|
+
err_2 = _c.sent();
|
|
22102
22121
|
console.error(err_2);
|
|
22103
22122
|
this.error = err_2 && err_2.message || err_2;
|
|
22104
22123
|
return [2 /*return*/, false];
|
|
@@ -22120,9 +22139,21 @@
|
|
|
22120
22139
|
this.form.controls.pubkey.disable();
|
|
22121
22140
|
// Always disable some additional fields
|
|
22122
22141
|
this.additionalFields
|
|
22123
|
-
.filter(function (field) { return field.extra && field.extra.account && field.extra.account.disabled || false; })
|
|
22124
22142
|
.forEach(function (field) {
|
|
22125
|
-
|
|
22143
|
+
var _a, _b;
|
|
22144
|
+
var control = _this.form.controls[field.key];
|
|
22145
|
+
if (!control)
|
|
22146
|
+
return; // Skip
|
|
22147
|
+
var disabled = ((_a = field.extra) === null || _a === void 0 ? void 0 : _a.account) && field.extra.account.disabled || false;
|
|
22148
|
+
if (disabled && control.enabled) {
|
|
22149
|
+
control.disable();
|
|
22150
|
+
}
|
|
22151
|
+
var required = ((_b = field.extra) === null || _b === void 0 ? void 0 : _b.account) && field.extra.account.required || false;
|
|
22152
|
+
if (!field.required && required) {
|
|
22153
|
+
control.setValidators(control.validator
|
|
22154
|
+
? i1.Validators.compose([control.validator, i1.Validators.required])
|
|
22155
|
+
: i1.Validators.required);
|
|
22156
|
+
}
|
|
22126
22157
|
});
|
|
22127
22158
|
this.markForCheck();
|
|
22128
22159
|
};
|
|
@@ -22131,7 +22162,7 @@
|
|
|
22131
22162
|
cancel: { get: function () { return _super_1.prototype.cancel; } }
|
|
22132
22163
|
});
|
|
22133
22164
|
return __awaiter(this, void 0, void 0, function () {
|
|
22134
|
-
return __generator(this, function (
|
|
22165
|
+
return __generator(this, function (_c) {
|
|
22135
22166
|
_super.cancel.call(this);
|
|
22136
22167
|
return [2 /*return*/];
|
|
22137
22168
|
});
|
|
@@ -30793,7 +30824,8 @@
|
|
|
30793
30824
|
this.memoryMobile = true;
|
|
30794
30825
|
this.stringify = JSON.stringify;
|
|
30795
30826
|
this.form = formBuilder.group({
|
|
30796
|
-
empty: [null
|
|
30827
|
+
empty: [null],
|
|
30828
|
+
emptyRequired: [null, i1.Validators.required],
|
|
30797
30829
|
enable: [null, i1.Validators.required],
|
|
30798
30830
|
disable: [null, i1.Validators.required],
|
|
30799
30831
|
readonly: [null]
|
|
@@ -30818,7 +30850,8 @@
|
|
|
30818
30850
|
return __generator(this, function (_a) {
|
|
30819
30851
|
now = moment$7();
|
|
30820
30852
|
data = {
|
|
30821
|
-
empty:
|
|
30853
|
+
empty: null,
|
|
30854
|
+
emptyRequired: null,
|
|
30822
30855
|
enable: toDateISOString(now),
|
|
30823
30856
|
disable: now,
|
|
30824
30857
|
readonly: now
|
|
@@ -30872,7 +30905,7 @@
|
|
|
30872
30905
|
DateTimeTestPage.decorators = [
|
|
30873
30906
|
{ type: i0.Component, args: [{
|
|
30874
30907
|
selector: 'app-data-time-test',
|
|
30875
|
-
template: "<ion-header>\n <ion-toolbar color=\"primary\">\n\n <ion-buttons slot=\"start\">\n <ion-back-button></ion-back-button>\n </ion-buttons>\n\n <ion-title>Date/Time field test page</ion-title>\n </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"ion-padding\">\n\n <form class=\"form-container\" [formGroup]=\"form\" (ngSubmit)=\"doSubmit($event)\">\n\n <ion-grid>\n\n <!-- debugging memory leak -->\n <ion-row><ion-col><ion-text><h4>Debug memory leak</h4></ion-text></ion-col></ion-row>\n <ion-row>\n <ion-col size=\"2\">\n <ion-button *ngIf=\"!memoryTimer\" (click)=\"startMemoryTimer()\">Start timer</ion-button>\n <ion-button *ngIf=\"memoryTimer\" (click)=\"stopMemoryTimer()\">Stop timer</ion-button>\n </ion-col>\n <ion-col size=\"2\">\n <mat-form-field floatLabel=\"never\">\n <input matInput type=\"text\" hidden>\n <mat-checkbox (change)=\"memoryMobile=$event.checked\" [value]=\"memoryMobile\">\n Mobile ?\n </mat-checkbox>\n </mat-form-field>\n </ion-col>\n <ion-col>\n <mat-date-time-field formControlName=\"empty\"\n *ngIf=\"!memoryHide\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"memoryMobile\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-col>\n </ion-row>\n\n <!-- Mobile mode -->\n <ion-row><ion-col><ion-text><h4>Mobile mode</h4></ion-text></ion-col></ion-row>\n <ion-row>\n <ion-col>\n\n <!-- Empty value -->\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Empty value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"empty\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"true\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Enable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n With value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"enable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"true\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Disable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Disable\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"disable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n\n </ion-card-content>\n </ion-card>\n </ion-col>\n </ion-row>\n <!-- debug console -->\n <ion-row>\n <!-- buttons -->\n <ion-col size=\"2\">\n <!-- submit form -->\n <ion-button (click)=\"doSubmit($event)\"\n fill=\"outline\">\n <ion-icon name=\"checkmark\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n\n <!-- clear log -->\n <ion-button (click)=\"clearLogPanel()\"\n fill=\"outline\">\n <ion-icon name=\"trash\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-col>\n <ion-col size=\"10\" *ngIf=\"showLogPanel\">\n <ion-text color=\"primary\">Log:<br/></ion-text>\n <div class=\"ion-padding-start\">\n <ion-text color=\"medium\">\n <small [innerHTML]=\"logContent\"></small>\n </ion-text>\n </div>\n </ion-col>\n </ion-row>\n\n <!-- Desktop mode -->\n <ion-row><ion-col><ion-text><h4>Desktop mode</h4></ion-text></ion-col></ion-row>\n <ion-row>\n <ion-col>\n\n <!-- Empty value -->\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Empty value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"empty\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"false\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Enable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n With value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"enable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"false\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Disable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Disable\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"disable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"false\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Readonly -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Readonly toggle\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.readonly.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-checkbox (change)=\"readonlyField.readonly=$event.checked\" [checked]=\"readonlyField.readonly\">\n </mat-checkbox>\n\n <mat-date-time-field #readonlyField formControlName=\"readonly\"\n placeholder=\"Date/Time\"\n [readonly]=\"true\"\n [mobile]=\"false\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n </ion-row>\n </ion-grid>\n </form>\n\n</ion-content>\n"
|
|
30908
|
+
template: "<ion-header>\n <ion-toolbar color=\"primary\">\n\n <ion-buttons slot=\"start\">\n <ion-back-button></ion-back-button>\n </ion-buttons>\n\n <ion-title>Date/Time field test page</ion-title>\n </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"ion-padding\">\n\n <form class=\"form-container\" [formGroup]=\"form\" (ngSubmit)=\"doSubmit($event)\">\n\n <ion-grid>\n\n <!-- debugging memory leak -->\n <ion-row><ion-col><ion-text><h4>Debug memory leak</h4></ion-text></ion-col></ion-row>\n <ion-row>\n <ion-col size=\"2\">\n <ion-button *ngIf=\"!memoryTimer\" (click)=\"startMemoryTimer()\">Start timer</ion-button>\n <ion-button *ngIf=\"memoryTimer\" (click)=\"stopMemoryTimer()\">Stop timer</ion-button>\n </ion-col>\n <ion-col size=\"2\">\n <mat-form-field floatLabel=\"never\">\n <input matInput type=\"text\" hidden>\n <mat-checkbox (change)=\"memoryMobile=$event.checked\" [value]=\"memoryMobile\">\n Mobile ?\n </mat-checkbox>\n </mat-form-field>\n </ion-col>\n <ion-col>\n <mat-date-time-field formControlName=\"empty\"\n *ngIf=\"!memoryHide\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"memoryMobile\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-col>\n </ion-row>\n\n <!-- Mobile mode -->\n <ion-row><ion-col><ion-text><h4>Mobile mode</h4></ion-text></ion-col></ion-row>\n <ion-row>\n <ion-col>\n\n <!-- Empty value -->\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Empty value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"empty\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"true\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Enable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n With value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"enable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"true\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Disable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Disable\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"disable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n\n </ion-card-content>\n </ion-card>\n </ion-col>\n </ion-row>\n <!-- debug console -->\n <ion-row>\n <!-- buttons -->\n <ion-col size=\"2\">\n <!-- submit form -->\n <ion-button (click)=\"doSubmit($event)\"\n fill=\"outline\">\n <ion-icon name=\"checkmark\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n\n <!-- clear log -->\n <ion-button (click)=\"clearLogPanel()\"\n fill=\"outline\">\n <ion-icon name=\"trash\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-col>\n <ion-col size=\"10\" *ngIf=\"showLogPanel\">\n <ion-text color=\"primary\">Log:<br/></ion-text>\n <div class=\"ion-padding-start\">\n <ion-text color=\"medium\">\n <small [innerHTML]=\"logContent\"></small>\n </ion-text>\n </div>\n </ion-col>\n </ion-row>\n\n <!-- Desktop mode -->\n <ion-row><ion-col><ion-text><h4>Desktop mode</h4></ion-text></ion-col></ion-row>\n <ion-row>\n <ion-col>\n\n <!-- Empty value -->\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Empty value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"empty\"\n placeholder=\"Date/Time\"\n [mobile]=\"false\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Empty required value -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Empty value + required\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"emptyRequired\"\n placeholder=\"Date/Time\"\n required\n [mobile]=\"false\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Enable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n With value\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"enable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"false\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Disable -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Disable\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-date-time-field formControlName=\"disable\"\n placeholder=\"Date/Time\"\n [required]=\"true\"\n [mobile]=\"false\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <!-- Readonly -->\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">\n Readonly toggle\n </ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <small><pre>{{stringify(form.controls.readonly.value)}}</pre></small>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-checkbox (change)=\"readonlyField.readonly=$event.checked\" [checked]=\"readonlyField.readonly\">\n </mat-checkbox>\n\n <mat-date-time-field #readonlyField formControlName=\"readonly\"\n placeholder=\"Date/Time\"\n [readonly]=\"true\"\n [mobile]=\"false\"\n [clearable]=\"true\">\n <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n </mat-date-time-field>\n </ion-card-content>\n </ion-card>\n </ion-col>\n </ion-row>\n </ion-grid>\n </form>\n\n</ion-content>\n"
|
|
30876
30909
|
},] }
|
|
30877
30910
|
];
|
|
30878
30911
|
DateTimeTestPage.ctorParameters = function () { return [
|