Commit 1e079457c7164d0bb47bd45aaef501780db0a3eb

Authored by Igor Kulikov
1 parent ac963baa

UI: Json React Form - textarea height fix

@@ -56,8 +56,14 @@ class ThingsboardText extends React.Component<JsonFormFieldProps, ThingsboardTex @@ -56,8 +56,14 @@ class ThingsboardText extends React.Component<JsonFormFieldProps, ThingsboardTex
56 } 56 }
57 57
58 const multiline = this.props.form.type === 'textarea'; 58 const multiline = this.props.form.type === 'textarea';
59 - const rows = multiline ? this.props.form.rows : 1;  
60 - const rowsMax = multiline ? this.props.form.rowsMax : 1; 59 + let rows = 1;
  60 + let rowsMax = 1;
  61 + let minHeight = 48;
  62 + if (multiline) {
  63 + rows = this.props.form.rows || 2;
  64 + rowsMax = this.props.form.rowsMax;
  65 + minHeight = 19 * rows + 48;
  66 + }
61 67
62 return ( 68 return (
63 <div> 69 <div>
@@ -77,7 +83,7 @@ class ThingsboardText extends React.Component<JsonFormFieldProps, ThingsboardTex @@ -77,7 +83,7 @@ class ThingsboardText extends React.Component<JsonFormFieldProps, ThingsboardTex
77 rowsMax={rowsMax} 83 rowsMax={rowsMax}
78 onFocus={this.onFocus} 84 onFocus={this.onFocus}
79 onBlur={this.onBlur} 85 onBlur={this.onBlur}
80 - style={this.props.form.style || {width: '100%'}}/> 86 + style={this.props.form.style || {width: '100%', minHeight: minHeight + 'px'}}/>
81 </div> 87 </div>
82 ); 88 );
83 } 89 }
@@ -58,6 +58,15 @@ $previewSize: 100px !default; @@ -58,6 +58,15 @@ $previewSize: 100px !default;
58 58
59 .tb-field { 59 .tb-field {
60 padding-bottom: 18px; 60 padding-bottom: 18px;
  61 +
  62 + .MuiInputBase-multiline {
  63 + flex: 1;
  64 + flex-direction: column;
  65 + .MuiInputBase-inputMultiline {
  66 + flex: 1;
  67 + }
  68 + }
  69 +
61 &.tb-required { 70 &.tb-required {
62 label::after { 71 label::after {
63 font-size: 13px; 72 font-size: 13px;