Browse Source

fix(iot-hub): polish rule chain install dialog layout and copy

- Group the slide-toggle and the conditionally rendered profile
  pickers in a single bordered card via tb-form-panel.stroked,
  matching the 4.3 entity-aggregation 'Apply await timeout' pattern.
- Set the toggle's class to 'mat-slide flex' to match the canonical
  TB idiom; switch the tooltip label to plain interpolation.
- Restore the trailing '?' in install-confirm-title — the confirm
  step is still a real confirmation question for item types that
  don't go through the select-entity flow.
pull/15689/head
dshvaika 4 months ago
parent
commit
af1b888cf0
  1. 50
      ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-install-dialog.component.html
  2. 2
      ui-ngx/src/assets/locale/locale.constant-en_US.json

50
ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-install-dialog.component.html

@ -25,34 +25,34 @@
<h2 class="tb-iot-hub-install-title">{{ 'iot-hub.install-confirm-title' | translate:{ name: item.name } }}</h2> <h2 class="tb-iot-hub-install-title">{{ 'iot-hub.install-confirm-title' | translate:{ name: item.name } }}</h2>
@if (item.type === ItemType.RULE_CHAIN) { @if (item.type === ItemType.RULE_CHAIN) {
<p class="tb-iot-hub-install-desc">{{ 'iot-hub.rule-chain-install-subtitle' | translate }}</p> <p class="tb-iot-hub-install-desc">{{ 'iot-hub.rule-chain-install-subtitle' | translate }}</p>
<form [formGroup]="ruleChainInstallForm" class="flex flex-col gap-3"> <form [formGroup]="ruleChainInstallForm">
<div class="tb-form-row"> <div class="tb-form-panel stroked">
<mat-slide-toggle class="mat-slide" formControlName="setAsDefault"> <mat-slide-toggle class="mat-slide flex" formControlName="setAsDefault">
<div tb-hint-tooltip-icon="{{ 'iot-hub.rule-chain-set-as-profile-default-tooltip' | translate }}" translate> <div tb-hint-tooltip-icon="{{ 'iot-hub.rule-chain-set-as-profile-default-tooltip' | translate }}">
iot-hub.rule-chain-set-as-profile-default-toggle {{ 'iot-hub.rule-chain-set-as-profile-default-toggle' | translate }}
</div> </div>
</mat-slide-toggle> </mat-slide-toggle>
@if (ruleChainInstallForm.controls.setAsDefault.value) {
<div class="flex flex-row gap-4 xs:flex-col xs:gap-0">
<tb-entity-type-select
class="flex-1"
appearance="outline"
[showLabel]="true"
[required]="true"
[allowedEntityTypes]="[EntityType.DEVICE_PROFILE, EntityType.ASSET_PROFILE]"
[filterAllowedEntityTypes]="false"
formControlName="entityType">
</tb-entity-type-select>
<tb-entity-autocomplete
class="flex-1"
appearance="outline"
[required]="true"
[entityType]="ruleChainInstallForm.controls.entityType.value"
formControlName="entityId">
</tb-entity-autocomplete>
</div>
}
</div> </div>
@if (ruleChainInstallForm.controls.setAsDefault.value) {
<div class="flex flex-row gap-4 xs:flex-col xs:gap-0">
<tb-entity-type-select
class="flex-1"
appearance="outline"
[showLabel]="true"
[required]="true"
[allowedEntityTypes]="[EntityType.DEVICE_PROFILE, EntityType.ASSET_PROFILE]"
[filterAllowedEntityTypes]="false"
formControlName="entityType">
</tb-entity-type-select>
<tb-entity-autocomplete
class="flex-1"
appearance="outline"
[required]="true"
[entityType]="ruleChainInstallForm.controls.entityType.value"
formControlName="entityId">
</tb-entity-autocomplete>
</div>
}
</form> </form>
} @else { } @else {
@if (activeSelectEntityConfig?.promptKey) { @if (activeSelectEntityConfig?.promptKey) {

2
ui-ngx/src/assets/locale/locale.constant-en_US.json

@ -3802,7 +3802,7 @@
"changelog": "Changelog", "changelog": "Changelog",
"created-by": "Created by {{name}}", "created-by": "Created by {{name}}",
"install-confirm": "Install {{name}} v{{version}}?", "install-confirm": "Install {{name}} v{{version}}?",
"install-confirm-title": "Install '{{name}}'", "install-confirm-title": "Install '{{name}}'?",
"install-desc": "Installing this will automatically create and configure the necessary resources within your tenant", "install-desc": "Installing this will automatically create and configure the necessary resources within your tenant",
"install-success-desc": "'{{name}}' has been installed successfully", "install-success-desc": "'{{name}}' has been installed successfully",
"remove": "Remove", "remove": "Remove",

Loading…
Cancel
Save