dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: refactor mobile app qr code widgets validationm, cleanup widgets json

Browse Source
This commit is contained in:
rusikv 2024-05-10 16:46:32 +03:00
parent bb8be2705a
commit ffbb2c7c73
7 changed files with 133 additions and 149 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
application/src/main/data/json/system/widget_types/home_mobile_app_qr_code.json
View File

@ -15,7 +15,7 @@
"settingsSchema": "", "settingsSchema": "",
"dataKeySettingsSchema": "", "dataKeySettingsSchema": "",
"settingsDirective": "", "settingsDirective": "",
"defaultConfig": "{\"datasources\":[{\"type\":\"static\",\"name\":\"function\",\"dataKeys\":[{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Random\",\"color\":\"#2196f3\",\"settings\":{},\"_hash\":0.15479322438769105,\"funcBody\":\"var value = prevValue + Math.random() * 100 - 50;\\nvar multiplier = Math.pow(10, 2 || 0);\\nvar value = Math.round(value * multiplier) / multiplier;\\nif (value < -1000) {\\n\\tvalue = -1000;\\n} else if (value > 1000) {\\n\\tvalue = 1000;\\n}\\nreturn value;\"}]}],\"timewindow\":{\"realtime\":{\"timewindowMs\":60000}},\"showTitle\":false,\"backgroundColor\":\"rgb(255, 255, 255)\",\"color\":\"rgba(0, 0, 0, 0.87)\",\"padding\":\"8px\",\"settings\":{\"cardHtml\":\"<div class='card'>HTML code here</div>\",\"cardCss\":\".card {\\n font-weight: bold;\\n font-size: 32px;\\n color: #999;\\n width: 100%;\\n height: 100%;\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n}\"},\"title\":\"Home page mobile app QR code\",\"dropShadow\":false,\"enableFullscreen\":false,\"widgetStyle\":{},\"widgetCss\":\"\",\"pageSize\":1024,\"noDataDisplayMessage\":\"\",\"showTitleIcon\":false,\"titleTooltip\":\"\",\"titleStyle\":{\"fontSize\":\"16px\",\"fontWeight\":400}}" "defaultConfig": "{\"showTitle\":false,\"backgroundColor\":\"rgb(255, 255, 255)\",\"color\":\"rgba(0, 0, 0, 0.87)\",\"padding\":\"8px\",\"settings\":{},\"title\":\"Home page mobile app QR code\",\"dropShadow\":true}"
}, },
"tags": [ "tags": [
"ios", "ios",

2
application/src/main/data/json/system/widget_types/mobile_app_qr_code.json
View File

@ -15,7 +15,7 @@
"settingsSchema": "", "settingsSchema": "",
"dataKeySettingsSchema": "", "dataKeySettingsSchema": "",
"settingsDirective": "tb-mobile-app-qr-code-widget-settings", "settingsDirective": "tb-mobile-app-qr-code-widget-settings",
"defaultConfig": "{\"datasources\":[{\"type\":\"static\",\"name\":\"function\",\"dataKeys\":[{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Random\",\"color\":\"#2196f3\",\"settings\":{},\"_hash\":0.15479322438769105,\"funcBody\":\"var value = prevValue + Math.random() * 100 - 50;\\nvar multiplier = Math.pow(10, 2 || 0);\\nvar value = Math.round(value * multiplier) / multiplier;\\nif (value < -1000) {\\n\\tvalue = -1000;\\n} else if (value > 1000) {\\n\\tvalue = 1000;\\n}\\nreturn value;\"}]}],\"timewindow\":{\"realtime\":{\"timewindowMs\":60000}},\"showTitle\":true,\"backgroundColor\":\"rgb(255, 255, 255)\",\"color\":\"rgba(0, 0, 0, 0.87)\",\"padding\":\"8px\",\"settings\":{\"useDefaultApp\":true,\"androidConfig\":{\"enabled\":true,\"appPackage\":\"\",\"sha256CertFingerprints\":\"\"},\"iosConfig\":{\"enabled\":true,\"appId\":\"\"},\"qrCodeConfig\":{\"badgeEnabled\":true,\"badgeStyle\":\"ORIGINAL\",\"badgePosition\":\"RIGHT\",\"qrCodeLabelEnabled\":true,\"qrCodeLabel\":\"Scan to connect or download mobile app\"}},\"title\":\"Mobile app QR code\",\"dropShadow\":true,\"enableFullscreen\":false,\"widgetStyle\":{},\"widgetCss\":\"\",\"pageSize\":1024,\"noDataDisplayMessage\":\"\",\"showTitleIcon\":false,\"titleTooltip\":\"\",\"titleStyle\":{\"fontSize\":\"16px\",\"fontWeight\":400}}" "defaultConfig": "{\n \"showTitle\": true,\n \"backgroundColor\": \"rgb(255, 255, 255)\",\n \"color\": \"rgba(0, 0, 0, 0.87)\",\n \"padding\": \"8px\",\n \"settings\": {\n \"useDefaultApp\": true,\n \"androidConfig\": {\n \"enabled\": true,\n \"appPackage\": \"\",\n \"sha256CertFingerprints\": \"\"\n },\n \"iosConfig\": {\n \"enabled\": true,\n \"appId\": \"\"\n },\n \"qrCodeConfig\": {\n \"badgeEnabled\": true,\n \"badgeStyle\": \"ORIGINAL\",\n \"badgePosition\": \"RIGHT\",\n \"qrCodeLabelEnabled\": true,\n \"qrCodeLabel\": \"Scan to connect or download mobile app\"\n }\n },\n \"title\": \"Mobile app QR code\",\n \"dropShadow\": true,\n \"enableFullscreen\": false,\n \"widgetStyle\": {},\n \"widgetCss\": \"\",\n \"pageSize\": 1024,\n \"noDataDisplayMessage\": \"\",\n \"showTitleIcon\": false,\n \"titleTooltip\": \"\",\n \"titleStyle\": {\n \"fontSize\": \"16px\",\n \"fontWeight\": 400\n }\n}"
}, },
"tags": [ "tags": [
"ios", "ios",

9
ui-ngx/src/app/modules/home/components/widget/lib/settings/cards/mobile-app-qr-code-widget-settings.component.html
View File

@ -123,6 +123,15 @@
</mat-slide-toggle> </mat-slide-toggle>
<mat-form-field class="flex" appearance="outline" subscriptSizing="dynamic"> <mat-form-field class="flex" appearance="outline" subscriptSizing="dynamic">
<input matInput formControlName="qrCodeLabel" maxlength="50" placeholder="{{'admin.mobile-app.set' | translate}}"> <input matInput formControlName="qrCodeLabel" maxlength="50" placeholder="{{'admin.mobile-app.set' | translate}}">
<mat-icon matSuffix
matTooltipPosition="above"
matTooltipClass="tb-error-tooltip"
[matTooltip]="'admin.mobile-app.label-required' | translate"
*ngIf="mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabel').hasError('required')
&& mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabel').touched"
class="tb-error">
warning
</mat-icon>
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>

100
ui-ngx/src/app/modules/home/components/widget/lib/settings/cards/mobile-app-qr-code-widget-settings.component.ts
View File

@ -49,22 +49,22 @@ export class MobileAppQrCodeWidgetSettingsComponent extends WidgetSettingsCompon
protected onSettingsSet(settings: WidgetSettings) { protected onSettingsSet(settings: WidgetSettings) {
this.mobileAppQRCodeWidgetSettingsForm = this.fb.group({ this.mobileAppQRCodeWidgetSettingsForm = this.fb.group({
useDefaultApp: [settings.useDefaultApp, []], useDefaultApp: [settings.useDefaultApp],
androidConfig: this.fb.group({ androidConfig: this.fb.group({
enabled: [settings.androidConfig.enabled, []], enabled: [settings.androidConfig.enabled],
appPackage: [settings.androidConfig.appPackage, []], appPackage: [settings.androidConfig.appPackage, [Validators.required]],
sha256CertFingerprints: [settings.androidConfig.sha256CertFingerprints, []] sha256CertFingerprints: [settings.androidConfig.sha256CertFingerprints, [Validators.required]]
}), }),
iosConfig: this.fb.group({ iosConfig: this.fb.group({
enabled: [settings.iosConfig.enabled, []], enabled: [settings.iosConfig.enabled],
appId: [settings.iosConfig.appId, []] appId: [settings.iosConfig.appId, [Validators.required]]
}), }),
qrCodeConfig: this.fb.group({ qrCodeConfig: this.fb.group({
badgeEnabled: [settings.qrCodeConfig.badgeEnabled, []], badgeEnabled: [settings.qrCodeConfig.badgeEnabled],
badgeStyle: [{value: settings.qrCodeConfig.badgeStyle, disabled: true}, []], badgeStyle: [{value: settings.qrCodeConfig.badgeStyle, disabled: true}],
badgePosition: [{value: settings.qrCodeConfig.badgePosition, disabled: true}, []], badgePosition: [{value: settings.qrCodeConfig.badgePosition, disabled: true}],
qrCodeLabelEnabled: [settings.qrCodeConfig.qrCodeLabelEnabled, []], qrCodeLabelEnabled: [settings.qrCodeConfig.qrCodeLabelEnabled],
qrCodeLabel: [settings.qrCodeConfig.qrCodeLabel, []] qrCodeLabel: [settings.qrCodeConfig.qrCodeLabel, [Validators.required]]
}) })
}); });
} }
@ -81,76 +81,46 @@ export class MobileAppQrCodeWidgetSettingsComponent extends WidgetSettingsCompon
const qrCodeLabelEnabled = this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabelEnabled').value; const qrCodeLabelEnabled = this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabelEnabled').value;
if (useDefaultApp) { if (useDefaultApp) {
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').clearValidators(); this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').clearValidators(); this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').clearValidators(); this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').disable({emitEvent: false});
} else { } else {
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').setValidators([Validators.required]);
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').setValidators([Validators.required]);
this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').setValidators([Validators.required]);
}
if (androidEnabled) { if (androidEnabled) {
if (!useDefaultApp) { this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').enable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').setValidators([Validators.required]); this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').enable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').setValidators([Validators.required]);
}
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeEnabled').enable({emitEvent: false});
if (badgeEnabled) {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').enable();
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').enable();
}
} else { } else {
if (!useDefaultApp) { this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').clearValidators(); this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').clearValidators();
} }
if (!iosEnabled) {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeEnabled').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').disable();
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').disable();
}
}
if (iosEnabled) { if (iosEnabled) {
if (!useDefaultApp) { this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').enable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').setValidators([Validators.required]);
}
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeEnabled').enable({emitEvent: false});
if (badgeEnabled) {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').enable();
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').enable();
}
} else { } else {
if (!useDefaultApp) { this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').clearValidators();
}
if (!androidEnabled) {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeEnabled').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').disable();
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').disable();
} }
} }
if (badgeEnabled) { if (!androidEnabled && !iosEnabled) {
if (androidEnabled || iosEnabled) { this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeEnabled').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').enable(); this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').enable(); this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').disable({emitEvent: false});
} }
if (androidEnabled || iosEnabled) {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeEnabled').enable({emitEvent: false});
if (badgeEnabled) {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').enable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').enable({emitEvent: false});
} else { } else {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').disable(); this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgeStyle').disable({emitEvent: false});
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').disable(); this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.badgePosition').disable({emitEvent: false});
}
} }
if (qrCodeLabelEnabled) { if (qrCodeLabelEnabled) {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabel').enable(); this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabel').enable({emitEvent: false});
} else { } else {
this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabel').disable(); this.mobileAppQRCodeWidgetSettingsForm.get('qrCodeConfig.qrCodeLabel').disable({emitEvent: false});
} }
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.appPackage').updateValueAndValidity({emitEvent});
this.mobileAppQRCodeWidgetSettingsForm.get('androidConfig.sha256CertFingerprints').updateValueAndValidity({emitEvent});
this.mobileAppQRCodeWidgetSettingsForm.get('iosConfig.appId').updateValueAndValidity({emitEvent});
} }
} }

9
ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.html
View File

@ -140,6 +140,15 @@
</mat-slide-toggle> </mat-slide-toggle>
<mat-form-field class="flex" appearance="outline" subscriptSizing="dynamic"> <mat-form-field class="flex" appearance="outline" subscriptSizing="dynamic">
<input matInput formControlName="qrCodeLabel" maxlength="50" placeholder="{{'admin.mobile-app.set' | translate}}"> <input matInput formControlName="qrCodeLabel" maxlength="50" placeholder="{{'admin.mobile-app.set' | translate}}">
<mat-icon matSuffix
matTooltipPosition="above"
matTooltipClass="tb-error-tooltip"
[matTooltip]="'admin.mobile-app.label-required' | translate"
*ngIf="mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabel').hasError('required')
&& mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabel').touched"
class="tb-error">
warning
</mat-icon>
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>

149
ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.ts
View File

@ -29,7 +29,6 @@ import {
badgeStyleTranslationsMap, badgeStyleTranslationsMap,
MobileAppQRCodeSettings MobileAppQRCodeSettings
} from '@shared/models/mobile-app.models'; } from '@shared/models/mobile-app.models';
import { AuthService } from '@core/auth/auth.service';
@Component({ @Component({
selector: 'tb-mobile-app-settings', selector: 'tb-mobile-app-settings',
@ -58,95 +57,49 @@ export class MobileAppSettingsComponent extends PageComponent implements HasConf
takeUntil(this.destroy$) takeUntil(this.destroy$)
).subscribe(value => { ).subscribe(value => {
if (value) { if (value) {
this.mobileAppSettingsForm.get('androidConfig.appPackage').clearValidators(); this.mobileAppSettingsForm.get('androidConfig.appPackage').disable({emitEvent: false});
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').clearValidators(); this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').disable({emitEvent: false});
this.mobileAppSettingsForm.get('iosConfig.appId').clearValidators(); this.mobileAppSettingsForm.get('iosConfig.appId').disable({emitEvent: false});
} else { } else {
this.mobileAppSettingsForm.get('androidConfig.appPackage').setValidators([Validators.required]); if (this.mobileAppSettingsForm.get('androidConfig.enabled').value) {
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').setValidators([Validators.required]); this.mobileAppSettingsForm.get('androidConfig.appPackage').enable({emitEvent: false});
this.mobileAppSettingsForm.get('iosConfig.appId').setValidators([Validators.required]); this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').enable({emitEvent: false});
}
if (this.mobileAppSettingsForm.get('iosConfig.enabled').value) {
this.mobileAppSettingsForm.get('iosConfig.appId').enable({emitEvent: false});
}
} }
this.mobileAppSettingsForm.get('androidConfig.appPackage').updateValueAndValidity();
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').updateValueAndValidity();
this.mobileAppSettingsForm.get('iosConfig.appId').updateValueAndValidity();
}); });
this.mobileAppSettingsForm.get('androidConfig.enabled').valueChanges.pipe( this.mobileAppSettingsForm.get('androidConfig.enabled').valueChanges.pipe(
takeUntil(this.destroy$) takeUntil(this.destroy$)
).subscribe(value => { ).subscribe(value => {
if (!this.mobileAppSettingsForm.get('useDefaultApp').value) { this.androidEnableChanged(value);
if (value) {
this.mobileAppSettingsForm.get('androidConfig.appPackage').setValidators([Validators.required]);
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').setValidators([Validators.required]);
} else {
this.mobileAppSettingsForm.get('androidConfig.appPackage').clearValidators();
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').clearValidators();
}
this.mobileAppSettingsForm.get('androidConfig.appPackage').updateValueAndValidity();
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').updateValueAndValidity();
}
if (this.mobileAppSettingsForm.get('qrCodeConfig.showOnHomePage').value) {
if (value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').enable();
if (this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').enable();
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').enable();
}
} else {
if (!this.mobileAppSettingsForm.get('iosConfig.enabled').value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').disable();
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').disable();
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').disable();
}
}
}
}); });
this.mobileAppSettingsForm.get('iosConfig.enabled').valueChanges.pipe( this.mobileAppSettingsForm.get('iosConfig.enabled').valueChanges.pipe(
takeUntil(this.destroy$) takeUntil(this.destroy$)
).subscribe(value => { ).subscribe(value => {
if (!this.mobileAppSettingsForm.get('useDefaultApp').value) { this.iosEnableChanged(value);
if (value) {
this.mobileAppSettingsForm.get('iosConfig.appId').setValidators([Validators.required]);
} else {
this.mobileAppSettingsForm.get('iosConfig.appId').clearValidators();
}
this.mobileAppSettingsForm.get('iosConfig.appId').updateValueAndValidity();
}
if (this.mobileAppSettingsForm.get('qrCodeConfig.showOnHomePage').value) {
if (value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').enable();
if (this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').enable();
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').enable();
}
} else {
if (!this.mobileAppSettingsForm.get('androidConfig.enabled').value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').disable();
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').disable();
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').disable();
}
}
}
}); });
this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').valueChanges.pipe( this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').valueChanges.pipe(
takeUntil(this.destroy$) takeUntil(this.destroy$)
).subscribe(value => { ).subscribe(value => {
if (value) { if (value) {
if (this.mobileAppSettingsForm.get('androidConfig.enabled').value || this.mobileAppSettingsForm.get('iosConfig.enabled').value) { if (this.mobileAppSettingsForm.get('androidConfig.enabled').value || this.mobileAppSettingsForm.get('iosConfig.enabled').value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').enable(); this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').enable({emitEvent: false});
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').enable(); this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').enable({emitEvent: false});
} }
} else { } else {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').disable(); this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').disable({emitEvent: false});
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').disable(); this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').disable({emitEvent: false});
} }
}); });
this.mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabelEnabled').valueChanges.pipe( this.mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabelEnabled').valueChanges.pipe(
takeUntil(this.destroy$) takeUntil(this.destroy$)
).subscribe(value => { ).subscribe(value => {
if (value) { if (value) {
this.mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabel').enable(); this.mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabel').enable({emitEvent: false});
} else { } else {
this.mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabel').disable(); this.mobileAppSettingsForm.get('qrCodeConfig.qrCodeLabel').disable({emitEvent: false});
} }
}); });
} }
@ -159,23 +112,23 @@ export class MobileAppSettingsComponent extends PageComponent implements HasConf
private buildMobileAppSettingsForm() { private buildMobileAppSettingsForm() {
this.mobileAppSettingsForm = this.fb.group({ this.mobileAppSettingsForm = this.fb.group({
useDefaultApp: [true, []], useDefaultApp: [true],
androidConfig: this.fb.group({ androidConfig: this.fb.group({
enabled: [true, []], enabled: [true],
appPackage: ['', []], appPackage: [{value: '', disabled: true}, [Validators.required]],
sha256CertFingerprints: ['', []] sha256CertFingerprints: [{value: '', disabled: true}, [Validators.required]]
}), }),
iosConfig: this.fb.group({ iosConfig: this.fb.group({
enabled: [true, []], enabled: [true],
appId: ['', []] appId: [{value: '', disabled: true}, [Validators.required]]
}), }),
qrCodeConfig: this.fb.group({ qrCodeConfig: this.fb.group({
showOnHomePage: [true, []], showOnHomePage: [true],
badgeEnabled: [true, []], badgeEnabled: [true],
badgeStyle: [{value: BadgeStyle.ORIGINAL, disabled: true}, []], badgeStyle: [{value: BadgeStyle.ORIGINAL, disabled: true}],
badgePosition: [{value: BadgePosition.RIGHT, disabled: true}, []], badgePosition: [{value: BadgePosition.RIGHT, disabled: true}],
qrCodeLabelEnabled: [true, []], qrCodeLabelEnabled: [true],
qrCodeLabel: ['', []] qrCodeLabel: ['', [Validators.required]]
}) })
}); });
} }
@ -185,6 +138,48 @@ export class MobileAppSettingsComponent extends PageComponent implements HasConf
this.mobileAppSettingsForm.reset(this.mobileAppSettings); this.mobileAppSettingsForm.reset(this.mobileAppSettings);
} }
private androidEnableChanged(value: boolean): void {
if (value) {
if (!this.mobileAppSettingsForm.get('useDefaultApp').value) {
this.mobileAppSettingsForm.get('androidConfig.appPackage').enable({emitEvent: false});
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').enable({emitEvent: false});
}
} else {
this.mobileAppSettingsForm.get('androidConfig.appPackage').disable({emitEvent: false});
this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').disable({emitEvent: false});
}
this.updateBadgeControls(value);
}
private iosEnableChanged(value: boolean): void {
if (value) {
if (!this.mobileAppSettingsForm.get('useDefaultApp').value) {
this.mobileAppSettingsForm.get('iosConfig.appId').enable({emitEvent: false});
}
} else {
this.mobileAppSettingsForm.get('iosConfig.appId').disable({emitEvent: false});
}
this.updateBadgeControls(value);
}
private updateBadgeControls(value: boolean) {
if (this.mobileAppSettingsForm.get('qrCodeConfig.showOnHomePage').value) {
if (value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').enable({emitEvent: false});
if (this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').enable({emitEvent: false});
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').enable({emitEvent: false});
}
} else {
if (!this.mobileAppSettingsForm.get('iosConfig.enabled').value && !this.mobileAppSettingsForm.get('androidConfig.enabled').value) {
this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').disable({emitEvent: false});
this.mobileAppSettingsForm.get('qrCodeConfig.badgeStyle').disable({emitEvent: false});
this.mobileAppSettingsForm.get('qrCodeConfig.badgePosition').disable({emitEvent: false});
}
}
}
}
save(): void { save(): void {
this.mobileAppSettings = {...this.mobileAppSettings, ...this.mobileAppSettingsForm.getRawValue()}; this.mobileAppSettings = {...this.mobileAppSettings, ...this.mobileAppSettingsForm.getRawValue()};
this.mobileAppService.saveMobileAppSettings(this.mobileAppSettings) this.mobileAppService.saveMobileAppSettings(this.mobileAppSettings)

1
ui-ngx/src/assets/locale/locale.constant-en_US.json
View File

@ -440,6 +440,7 @@
"original": "Original", "original": "Original",
"white": "White", "white": "White",
"label": "Label", "label": "Label",
"label-required": "Label is required",
"right": "Right", "right": "Right",
"left": "Left", "left": "Left",
"set": "Set", "set": "Set",