Merge pull request #12249 from vvlladd28/enhachment/mobile-cenet/help-whitespace
Improved mobile center
This commit is contained in:
		
						commit
						bec41c5bf6
					
				@ -30,6 +30,22 @@
 | 
			
		||||
    <mat-form-field class="flex-1" appearance="outline" subscriptSizing="dynamic">
 | 
			
		||||
      <mat-label translate>mobile.page-name</mat-label>
 | 
			
		||||
      <input required matInput formControlName="label">
 | 
			
		||||
      <mat-icon matSuffix
 | 
			
		||||
                matTooltipPosition="above"
 | 
			
		||||
                matTooltipClass="tb-error-tooltip"
 | 
			
		||||
                matTooltip="{{ 'mobile.page-name-required' | translate }}"
 | 
			
		||||
                *ngIf="customMobilePageForm.get('label').hasError('required') && customMobilePageForm.get('label').touched"
 | 
			
		||||
                class="tb-error">
 | 
			
		||||
        warning
 | 
			
		||||
      </mat-icon>
 | 
			
		||||
      <mat-icon matSuffix
 | 
			
		||||
                matTooltipPosition="above"
 | 
			
		||||
                matTooltipClass="tb-error-tooltip"
 | 
			
		||||
                matTooltip="{{ 'mobile.page-name-cannot-contain-only-spaces' | translate }}"
 | 
			
		||||
                *ngIf="customMobilePageForm.get('label').hasError('pattern') && customMobilePageForm.get('label').touched"
 | 
			
		||||
                class="tb-error">
 | 
			
		||||
        warning
 | 
			
		||||
      </mat-icon>
 | 
			
		||||
    </mat-form-field>
 | 
			
		||||
  </div>
 | 
			
		||||
  <mat-form-field appearance="outline" subscriptSizing="dynamic">
 | 
			
		||||
@ -59,7 +75,7 @@
 | 
			
		||||
      <input required matInput formControlName="url">
 | 
			
		||||
      <mat-hint></mat-hint>
 | 
			
		||||
      <mat-error *ngIf="customMobilePageForm.get('url').hasError('pattern')">
 | 
			
		||||
        {{ 'mobile.url-pattern' | translate }}
 | 
			
		||||
        {{ 'mobile.invalid-url-format' | translate }}
 | 
			
		||||
      </mat-error>
 | 
			
		||||
    </mat-form-field>
 | 
			
		||||
  </ng-container>
 | 
			
		||||
@ -69,7 +85,7 @@
 | 
			
		||||
      <input required matInput formControlName="path">
 | 
			
		||||
      <mat-hint></mat-hint>
 | 
			
		||||
      <mat-error *ngIf="customMobilePageForm.get('path').hasError('pattern')">
 | 
			
		||||
        {{ 'mobile.path-pattern' | translate }}
 | 
			
		||||
        {{ 'mobile.invalid-path-format' | translate }}
 | 
			
		||||
      </mat-error>
 | 
			
		||||
    </mat-form-field>
 | 
			
		||||
  </ng-container>
 | 
			
		||||
 | 
			
		||||
@ -60,7 +60,7 @@ export class CustomMobilePageComponent implements ControlValueAccessor, Validato
 | 
			
		||||
  customMobilePageForm = this.fb.group({
 | 
			
		||||
    visible: [true],
 | 
			
		||||
    icon: ['star'],
 | 
			
		||||
    label: ['', Validators.required],
 | 
			
		||||
    label: ['', [Validators.required, Validators.pattern(/\S/)]],
 | 
			
		||||
    type: [MobilePageType.DASHBOARD],
 | 
			
		||||
    dashboardId: this.fb.control<string>(null, Validators.required),
 | 
			
		||||
    url: [{value:'', disabled: true}, [Validators.required, Validators.pattern(/^(https?:\/\/)?(localhost|([\w\-]+\.)+[\w\-]+)(:\d+)?(\/[\w\-._~:\/?#[\]@!$&'()*+,;=%]*)?$/)]],
 | 
			
		||||
 | 
			
		||||
@ -42,6 +42,14 @@
 | 
			
		||||
                    class="tb-error">
 | 
			
		||||
            warning
 | 
			
		||||
          </mat-icon>
 | 
			
		||||
          <mat-icon matSuffix
 | 
			
		||||
                    matTooltipPosition="above"
 | 
			
		||||
                    matTooltipClass="tb-error-tooltip"
 | 
			
		||||
                    matTooltip="{{ 'mobile.page-name-cannot-contain-only-spaces' | translate }}"
 | 
			
		||||
                    *ngIf="mobilePageRowForm.get('label').hasError('pattern') && mobilePageRowForm.get('label').touched"
 | 
			
		||||
                    class="tb-error">
 | 
			
		||||
            warning
 | 
			
		||||
          </mat-icon>
 | 
			
		||||
        </mat-form-field>
 | 
			
		||||
        <mat-form-field *ngIf="isCustomMenuItem"
 | 
			
		||||
                        class="tb-mobile-page-item-info flex" appearance="outline" subscriptSizing="dynamic">
 | 
			
		||||
 | 
			
		||||
@ -99,7 +99,7 @@ export class MobilePageItemRowComponent implements ControlValueAccessor, OnInit,
 | 
			
		||||
  mobilePageRowForm = this.fb.group({
 | 
			
		||||
    visible: [true, []],
 | 
			
		||||
    icon: ['', []],
 | 
			
		||||
    label: ['', []],
 | 
			
		||||
    label: ['', [Validators.pattern(/\S/)]],
 | 
			
		||||
    type: [MobilePageType.DEFAULT]
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -72,7 +72,7 @@
 | 
			
		||||
      <div class="flex-1" translate>mobile.configuration-step.more-information</div>
 | 
			
		||||
      <a mat-stroked-button
 | 
			
		||||
         color="primary"
 | 
			
		||||
         href="https://docs.flutter.dev/learn-flutter"
 | 
			
		||||
         href="https://docs.flutter.dev/get-started/learn-flutter"
 | 
			
		||||
         target="_blank">
 | 
			
		||||
        <mat-icon class="tb-mat-24">rocket_launch</mat-icon>{{ 'mobile.configuration-step.getting-started' | translate }}
 | 
			
		||||
      </a>
 | 
			
		||||
 | 
			
		||||
@ -193,8 +193,8 @@ export const HelpLinks = {
 | 
			
		||||
    scadaSymbolDev: `${helpBaseUrl}/docs${docPlatformPrefix}/user-guide/scada/scada-symbols-dev-guide/`,
 | 
			
		||||
    scadaSymbolDevAnimation: `${helpBaseUrl}/docs${docPlatformPrefix}/user-guide/scada/scada-symbols-dev-guide/#scadasymbolanimation`,
 | 
			
		||||
    mobileApplication: `${helpBaseUrl}/docs${docPlatformPrefix}/user-guide/ui/mobile-qr-code/`,
 | 
			
		||||
    mobileBundle: `${helpBaseUrl}/docs${docPlatformPrefix}/user-guide/ui/mobile-qr-code/`,
 | 
			
		||||
    mobileQrCode: `${helpBaseUrl}/docs${docPlatformPrefix}/user-guide/ui/mobile-qr-code/`,
 | 
			
		||||
    mobileBundle: `${helpBaseUrl}/docs${docPlatformPrefix}/mobile-center/mobile-center/`,
 | 
			
		||||
    mobileQrCode: `${helpBaseUrl}/docs${docPlatformPrefix}/mobile-center/applications/`,
 | 
			
		||||
  }
 | 
			
		||||
};
 | 
			
		||||
/* eslint-enable max-len */
 | 
			
		||||
 | 
			
		||||
@ -3551,6 +3551,7 @@
 | 
			
		||||
        "max-element-number": "Max elements number",
 | 
			
		||||
        "page-name": "Page name",
 | 
			
		||||
        "page-name-required": "Page name is required.",
 | 
			
		||||
        "page-name-cannot-contain-only-spaces": "Page name cannot contain only spaces.",
 | 
			
		||||
        "page-type": "Page type",
 | 
			
		||||
        "pages-types": {
 | 
			
		||||
            "dashboard": "Dashboard",
 | 
			
		||||
@ -3558,9 +3559,9 @@
 | 
			
		||||
            "custom": "Custom"
 | 
			
		||||
        },
 | 
			
		||||
        "url": "URL",
 | 
			
		||||
        "url-pattern": "Invalid URL",
 | 
			
		||||
        "invalid-url-format": "Invalid URL format",
 | 
			
		||||
        "path": "Path",
 | 
			
		||||
        "path-pattern": "Invalid path",
 | 
			
		||||
        "invalid-path-format": "Invalid path format",
 | 
			
		||||
        "custom-page": "Custom page",
 | 
			
		||||
        "edit-page": "Edit page",
 | 
			
		||||
        "edit-custom-page": "Edit custom page",
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user