UI: Minor improvement for ai models
This commit is contained in:
Vladyslav_Prykhodko
parent
f3071fcfbc
commit
28ce6ca8c8
@ -94,7 +94,7 @@
|
||||
toolbarSuffixButton
|
||||
matTooltip="{{ 'rule-node-config.ai.response-json-schema-hint' | translate }}"
|
||||
matTooltipPosition="above">
|
||||
<mat-icon style="color: #7b7b7b">info</mat-icon>
|
||||
<mat-icon class="material-icons">info_outline</mat-icon>
|
||||
</button>
|
||||
</tb-json-object-edit>
|
||||
}
|
||||
@ -105,29 +105,31 @@
|
||||
<mat-expansion-panel-header style="padding: 16px">
|
||||
<mat-panel-title translate>rule-node-config.ai.advanced-settings</mat-panel-title>
|
||||
</mat-expansion-panel-header>
|
||||
<div class="tb-form-panel no-border no-padding-top" style="margin-top: 0">
|
||||
<div class="tb-form-row space-between flex-1 columns-xs">
|
||||
<div tb-hint-tooltip-icon="{{'rule-node-config.ai.timeout-hint' | translate}}">{{ 'rule-node-config.ai.timeout' | translate }}</div>
|
||||
<div class="flex flex-row items-center justify-start gap-2">
|
||||
<tb-time-unit-input
|
||||
required
|
||||
inlineField
|
||||
requiredText="{{ 'rule-node-config.ai.timeout-required' | translate }}"
|
||||
minErrorText="{{ 'rule-node-config.ai.timeout-validation' | translate }}"
|
||||
maxErrorText="{{ 'rule-node-config.ai.timeout-validation' | translate }}"
|
||||
[maxTime]="600"
|
||||
[minTime]="1"
|
||||
formControlName="timeoutSeconds">
|
||||
</tb-time-unit-input>
|
||||
<ng-template matExpansionPanelContent>
|
||||
<div class="tb-form-panel no-border no-padding-top" style="margin-top: 0">
|
||||
<div class="tb-form-row space-between flex-1 columns-xs">
|
||||
<div tb-hint-tooltip-icon="{{'rule-node-config.ai.timeout-hint' | translate}}">{{ 'rule-node-config.ai.timeout' | translate }}</div>
|
||||
<div class="flex flex-row items-center justify-start gap-2">
|
||||
<tb-time-unit-input
|
||||
required
|
||||
inlineField
|
||||
requiredText="{{ 'rule-node-config.ai.timeout-required' | translate }}"
|
||||
minErrorText="{{ 'rule-node-config.ai.timeout-validation' | translate }}"
|
||||
maxErrorText="{{ 'rule-node-config.ai.timeout-validation' | translate }}"
|
||||
[maxTime]="600"
|
||||
[minTime]="1"
|
||||
formControlName="timeoutSeconds">
|
||||
</tb-time-unit-input>
|
||||
</div>
|
||||
</div>
|
||||
<div tb-hint-tooltip-icon="{{ 'rule-node-config.ai.force-acknowledgement-hint' | translate }}"
|
||||
class="tb-form-row same-padding">
|
||||
<mat-slide-toggle class="mat-slide margin" formControlName="forceAck">
|
||||
{{ 'rule-node-config.ai.force-acknowledgement' | translate }}
|
||||
</mat-slide-toggle>
|
||||
</div>
|
||||
</div>
|
||||
<div tb-hint-tooltip-icon="{{ 'rule-node-config.ai.force-acknowledgement-hint' | translate }}"
|
||||
class="tb-form-row same-padding">
|
||||
<mat-slide-toggle class="mat-slide margin" formControlName="forceAck">
|
||||
{{ 'rule-node-config.ai.force-acknowledgement' | translate }}
|
||||
</mat-slide-toggle>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</mat-expansion-panel>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -65,9 +65,7 @@ export class AiModelsTableConfigResolver {
|
||||
new EntityTableColumn<AiModel>('provider', 'ai-models.provider', '33%',
|
||||
entity => this.translate.instant(AiProviderTranslations.get(entity.configuration.provider))
|
||||
),
|
||||
new EntityTableColumn<AiModel>('aiModel', 'ai-models.model', '33%',
|
||||
entity => entity.configuration.modelId, () => ({}), false
|
||||
)
|
||||
new EntityTableColumn<AiModel>('modelId', 'ai-models.model', '33%', entity => entity.configuration.modelId)
|
||||
)
|
||||
|
||||
this.config.deleteEntityTitle = model => this.translate.instant('ai-models.delete-model-title', {modelName: model.name});
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
limitations under the License.
|
||||
|
||||
-->
|
||||
<div class="flex flex-col" style="background: #fff;" [class.fill-height]="fillHeight"
|
||||
<div class="tb-json-object flex flex-col" style="background: #fff;" [class.fill-height]="fillHeight"
|
||||
tb-fullscreen
|
||||
[fullscreen]="fullscreen" (fullscreenChanged)="onFullscreen()">
|
||||
<div class="tb-json-object-toolbar flex flex-row items-center justify-start">
|
||||
|
||||
@ -13,49 +13,49 @@
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
:host {
|
||||
.tb-json-object {
|
||||
position: relative;
|
||||
|
||||
.fill-height {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.tb-json-object-toolbar {
|
||||
button.mat-mdc-button-base, button.mat-mdc-button-base.tb-mat-32 {
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
min-width: 32px;
|
||||
min-height: 15px;
|
||||
padding: 4px;
|
||||
margin: 0;
|
||||
font-size: .8rem;
|
||||
line-height: 15px;
|
||||
color: #7b7b7b;
|
||||
background: rgba(220, 220, 220, .35);
|
||||
.tb-json-object-toolbar {
|
||||
button.mat-mdc-button-base, button.mat-mdc-button-base.tb-mat-32 {
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
min-width: 32px;
|
||||
min-height: 15px;
|
||||
padding: 4px;
|
||||
margin: 0;
|
||||
font-size: .8rem;
|
||||
line-height: 15px;
|
||||
color: #7b7b7b;
|
||||
background: rgba(220, 220, 220, .35);
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: 4px;
|
||||
&:not(:last-child) {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
button.mat-mdc-button-base:not(.mat-mdc-icon-button) {
|
||||
height: 23px;
|
||||
}
|
||||
}
|
||||
button.mat-mdc-button-base:not(.mat-mdc-icon-button) {
|
||||
height: 23px;
|
||||
}
|
||||
}
|
||||
|
||||
.tb-json-object-panel {
|
||||
height: 100%;
|
||||
margin-left: 15px;
|
||||
border: 1px solid #c0c0c0;
|
||||
|
||||
#tb-json-input {
|
||||
width: 100%;
|
||||
min-width: 200px;
|
||||
.tb-json-object-panel {
|
||||
height: 100%;
|
||||
min-height: 300px;
|
||||
margin-left: 15px;
|
||||
border: 1px solid #c0c0c0;
|
||||
|
||||
&:not(.fill-height) {
|
||||
min-height: 200px;
|
||||
#tb-json-input {
|
||||
width: 100%;
|
||||
min-width: 200px;
|
||||
height: 100%;
|
||||
min-height: 300px;
|
||||
|
||||
&:not(.fill-height) {
|
||||
min-height: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -19,21 +19,23 @@ import {
|
||||
Component,
|
||||
ElementRef,
|
||||
forwardRef,
|
||||
HostBinding,
|
||||
Input,
|
||||
OnDestroy,
|
||||
OnInit,
|
||||
ViewChild
|
||||
ViewChild,
|
||||
ViewEncapsulation
|
||||
} from '@angular/core';
|
||||
import {
|
||||
AbstractControl,
|
||||
ControlValueAccessor,
|
||||
UntypedFormControl,
|
||||
NG_VALIDATORS,
|
||||
NG_VALUE_ACCESSOR,
|
||||
Validator,
|
||||
AbstractControl, ValidationErrors
|
||||
UntypedFormControl,
|
||||
ValidationErrors,
|
||||
Validator
|
||||
} from '@angular/forms';
|
||||
import { Ace } from 'ace-builds';
|
||||
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
||||
import { ActionNotificationHide, ActionNotificationShow } from '@core/notification/notification.actions';
|
||||
import { Store } from '@ngrx/store';
|
||||
import { AppState } from '@core/core.state';
|
||||
@ -48,6 +50,7 @@ export const jsonRequired = (control: AbstractControl): ValidationErrors | null
|
||||
selector: 'tb-json-object-edit',
|
||||
templateUrl: './json-object-edit.component.html',
|
||||
styleUrls: ['./json-object-edit.component.scss'],
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
providers: [
|
||||
{
|
||||
provide: NG_VALUE_ACCESSOR,
|
||||
@ -63,6 +66,8 @@ export const jsonRequired = (control: AbstractControl): ValidationErrors | null
|
||||
})
|
||||
export class JsonObjectEditComponent implements OnInit, ControlValueAccessor, Validator, OnDestroy {
|
||||
|
||||
@HostBinding('style.position') position = 'relative';
|
||||
|
||||
@ViewChild('jsonEditor', {static: true})
|
||||
jsonEditorElmRef: ElementRef;
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user