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

refactoring

Browse Source
This commit is contained in:
mpetrov 2024-07-10 11:07:38 +03:00
parent d9807e797b
commit a1d26e29b3
5 changed files with 30 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html
View File

@ -19,7 +19,7 @@
<div class="tb-form-row column-xs" fxLayoutAlign="space-between center"> <div class="tb-form-row column-xs" fxLayoutAlign="space-between center">
<div class="fixed-title-width tb-required" [style.width.%]="50" <div class="fixed-title-width tb-required" [style.width.%]="50"
tb-hint-tooltip-icon="{{ 'gateway.max-number-of-workers-hint' | translate }}"> tb-hint-tooltip-icon="{{ 'gateway.max-number-of-workers-hint' | translate }}">
{{ 'gateway.max-number-of-workers' | translate }} <div tbTruncateTooltip>{{ 'gateway.max-number-of-workers' | translate }}</div>
</div> </div>
<div class="tb-flex no-gap"> <div class="tb-flex no-gap">
<mat-form-field class="tb-flex no-gap" appearance="outline" subscriptSizing="dynamic"> <mat-form-field class="tb-flex no-gap" appearance="outline" subscriptSizing="dynamic">
@ -41,7 +41,7 @@
<div class="tb-form-row column-xs" fxLayoutAlign="space-between center"> <div class="tb-form-row column-xs" fxLayoutAlign="space-between center">
<div class="fixed-title-width tb-required" [style.width.%]="50" <div class="fixed-title-width tb-required" [style.width.%]="50"
tb-hint-tooltip-icon="{{ 'gateway.max-messages-queue-for-worker-hint' | translate }}"> tb-hint-tooltip-icon="{{ 'gateway.max-messages-queue-for-worker-hint' | translate }}">
{{ 'gateway.max-messages-queue-for-worker' | translate }} <div tbTruncateTooltip>{{ 'gateway.max-messages-queue-for-worker' | translate }}</div>
</div> </div>
<div class="tb-flex no-gap"> <div class="tb-flex no-gap">
<mat-form-field class="tb-flex no-gap" appearance="outline" subscriptSizing="dynamic"> <mat-form-field class="tb-flex no-gap" appearance="outline" subscriptSizing="dynamic">

2
ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts
View File

@ -33,6 +33,7 @@ import { CommonModule } from '@angular/common';
import { WorkersConfig } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { WorkersConfig } from '@home/components/widget/lib/gateway/gateway-widget.models';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { TooltipDirective } from '@shared/directives/tooltip/tooltip.directive';
@Component({ @Component({
selector: 'tb-workers-config-control', selector: 'tb-workers-config-control',
@ -42,6 +43,7 @@ import { takeUntil } from 'rxjs/operators';
imports: [ imports: [
CommonModule, CommonModule,
SharedModule, SharedModule,
TooltipDirective,
], ],
providers: [ providers: [
{ {

14
ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html
View File

@ -15,12 +15,8 @@
limitations under the License. limitations under the License.
--> -->
<div class="tb-hint-tooltip"> <ng-content class="tb-hint-tooltip-content"></ng-content>
<div class="tb-hint-tooltip-content"> <tb-icon class="tb-hint-tooltip-icon tb-mat-18"
<ng-content></ng-content> *ngIf="tooltipText"
</div> matTooltip="{{ tooltipText }}"
<tb-icon class="tb-hint-tooltip-icon tb-mat-18" [matTooltipPosition]="tooltipPosition">{{ hintIcon }}</tb-icon>
*ngIf="tooltipText"
matTooltip="{{ tooltipText }}"
[matTooltipPosition]="tooltipPosition">{{ hintIcon }}</tb-icon>
</div>

39
ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss
View File

@ -13,30 +13,29 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
:host(.tb-hint-tooltip) {
display: flex;
flex-direction: row;
align-items: center;
gap: 4px;
}
:host { :host {
.tb-hint-tooltip { .tb-hint-tooltip-content {
display: flex; flex: 1 1 auto;
flex-direction: row; min-width: 0;
align-items: center; max-width: fit-content;
gap: 4px; }
&-content { .tb-hint-tooltip-icon {
flex: 1 1 auto; color: #E0E0E0;
min-width: 0; overflow: visible;
max-width: fit-content; order: 3;
} margin-left: 4px;
flex-shrink: 0;
&-icon { &:hover {
color: #E0E0E0; color: #9E9E9E;
overflow: visible;
order: 3;
margin-left: 4px;
flex-shrink: 0;
&:hover {
color: #9E9E9E;
}
} }
} }
} }

3
ui-ngx/src/app/shared/components/hint-tooltip-icon.component.ts
View File

@ -14,7 +14,7 @@
/// limitations under the License. /// limitations under the License.
/// ///
import { Component, Input } from '@angular/core'; import { Component, HostBinding, Input } from '@angular/core';
import { TooltipPosition } from '@angular/material/tooltip'; import { TooltipPosition } from '@angular/material/tooltip';
@Component({ @Component({
@ -24,6 +24,7 @@ import { TooltipPosition } from '@angular/material/tooltip';
}) })
export class HintTooltipIconComponent { export class HintTooltipIconComponent {
@HostBinding('class.tb-hint-tooltip')
@Input('tb-hint-tooltip-icon') tooltipText: string; @Input('tb-hint-tooltip-icon') tooltipText: string;
@Input() @Input()