diff --git a/src/modules/pages/connection/components/form_item/form_item.ts b/src/modules/pages/connection/components/form_item/form_item.ts index 3266f08..24dacd8 100644 --- a/src/modules/pages/connection/components/form_item/form_item.ts +++ b/src/modules/pages/connection/components/form_item/form_item.ts @@ -1,5 +1,5 @@ import { shortcut } from '@core/core'; -import { Label, Left, Layout } from 'ui'; +import { Label, Htape, Vertical } from 'ui'; export const FormItemXtype = 'dec.dcm.connection_form_item'; @shortcut(FormItemXtype) export class FormItem extends BI.Widget { @@ -11,30 +11,32 @@ export class FormItem extends BI.Widget { } render () { + const { nameWidth, unit, value } = this.options; + return { - type: Left, + type: Htape, + height: 17, items: [ { - type: Label, - cls: 'bi-font-bold', - width: this.options.nameWidth, - textAlign: 'left', - text: this.options.name, - }, - { - type: Label, - text: this.options.value, - height: 17, - }, - this.options.unit ? - { + el: { type: Label, - text: this.options.unit, - lgap: 5, + cls: 'bi-font-bold', textAlign: 'left', - } : { - type: Layout, + text: this.options.name, }, + width: nameWidth, + }, + { + type: Vertical, + items: [ + { + type: Label, + text: unit ? `${value} ${unit}` : value, + textAlign: 'left', + title: value, + }, + ], + }, ], }; }