@farris/jit-engine 1.3.184-dev → 1.3.186

package/lib/template/ui/mobilevue/lookup-input.pug

@@ -1,23 +1,31 @@
--variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+//- -variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.id = variable.replacedId? String(variable.replacedId) : undefined 
+-attrs.placeholder = variable.placeholder? String(variable.placeholder) : undefined 
+-attrs.label = variable.title? String(variable.title) : undefined 
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var require = variable.require ? String(variable.require.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var disable = variable.disable ? String(variable.disable.value) : undefined;
+-var binding = variable.binding && variable.binding.path ? "form."+variable.binding.path+".value" : undefined 
 
-div(v-if!=variable.visible?variable.visible+"":"false" class="fm-input-wrapper")
+div(
+  v-if=visible
+  class="fm-input-wrapper" 
+)
   fm-lookup-input(
-    style=(variable.appearance && variable.appearance.style)  
-    class=(variable.appearance && variable.appearance.class)  
-    inputClass=variable.direction === 'vertical' ? "fm-input-vertical" : undefined
-    v-if!=variable.isTextArea?"!stateMachine['showStaticText']":undefined 
-    id=variable.id?""+variable.id:undefined 
-    label=variable.title?""+variable.title:undefined 
+    v-model=binding
+    :required=require
+    :readonly=readonly
+    :disabled=disable
+    :modelValue=variable.value ? variable.value+"":undefined 
+    direction=variable.direction?variable.direction+"":undefined
     title=variable.title?""+variable.title:undefined 
     navTitle=variable.navTitle?""+variable.navTitle:undefined 
     groupTitle=variable.groupTitle?""+variable.groupTitle:undefined 
-    disabled!=variable.disabled?""+variable.disabled:undefined 
-    :readonly!=variable.readonly?""+variable.readonly:undefined
-    :required!=variable.require?variable.require+"":undefined
     :clearable!=variable.clearable?variable.clearable+"":undefined
-    placeholder=variable.placeholder?""+variable.placeholder:undefined 
-    v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value":undefined 
-    modelValue=variable.value ?""+variable.value:undefined 
     url=variable.dataSource.uri?""+variable.dataSource.uri:undefined 
     data=variable.data?""+variable.data:undefined
     idField=variable.dataSource.idField?""+variable.dataSource.idField:undefined 
@@ -52,14 +60,19 @@ div(v-if!=variable.visible?variable.visible+"":"false" class="fm-input-wrapper")
     :labelWidth!=variable.labelWidth?variable.labelWidth+"":undefined
     :formatter!=variable.formatter?""+variable.formatter:undefined 
     :error-message!=variable.errorMessage
-
     error-message-align=variable.errorMessage ? "right" : undefined
     @confirm=variable.lookupPicked?""+variable.lookupPicked:undefined 
     @valueChange=variable.valueChange?""+variable.valueChange:undefined 
-  )
+  )&attributes(attrs)
+    if(variable.leftTemplate)
+      template(#left-icon)
+        | !{variable.leftTemplate}
     if(variable.rightTemplate)
       template(#right-icon)
         | !{variable.rightTemplate}
+    if(variable.extraTemplate)
+      template(v-slot:extra="slotProps")
+        | !{variable.extraTemplate}
     if(variable.inputTemplate)
       template(v-slot:template="slotProps")
         | !{variable.inputTemplate}
@@ -69,9 +82,6 @@ div(v-if!=variable.visible?variable.visible+"":"false" class="fm-input-wrapper")
     if(variable.cellTemplate)
       template(v-slot:cell="slotProps")
         | !{variable.cellTemplate}
-    if(variable.extraTemplate)
-      template(v-slot:extra="slotProps")
-        | !{variable.extraTemplate}
     if(variable.labelTips) 
       template(#title)
         <span>!{variable.title}</span>

package/lib/template/ui/mobilevue/nav-bar.pug

@@ -1,17 +1,19 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-var visible = variable.visible ? String(variable.visible.value) : undefined;
+
 fm-navbar(
-  style=(variable.appearance && variable.appearance.style)  
-  class=(variable.appearance && variable.appearance.class)  
+  v-if=visible
   id=variable.replaceId 
   title=variable.title?""+variable.title:undefined 
   :leftArrow=variable.leftArrow!==undefined?""+variable.leftArrow:undefined 
   @click-left=variable.leftClick?""+variable.leftClick:undefined 
   @click-right=variable.rightClick?""+variable.rightClick:undefined 
-  v-if=variable.visible?variable.visible+"":"false"
-)
+)&attributes(attrs)
   if variable.leftTemplate
     template(#left)
       | !{variable.leftTemplate}
-      //- van-icon( name="arrow-left" size="18" color="#333" )
   if variable.titleTemplate  
     template(#title)
       | !{variable.titleTemplate}

package/lib/template/ui/mobilevue/number.pug

@@ -1,19 +1,27 @@
--variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
-//- -variable.errorMessage = variable.binding && variable.binding.path? `form.${variable.binding.path}.validationResult && form.${variable.binding.path}.validationResult.message`:undefined 
+//- -variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+-var attrs = {};
+-attrs.type = "number"
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.id = variable.replacedId? String(variable.replacedId) : undefined 
+-attrs.placeholder = variable.placeholder? String(variable.placeholder) : undefined 
+-attrs.label = variable.title? String(variable.title) : undefined 
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var require = variable.require ? String(variable.require.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var disable = variable.disable ? String(variable.disable.value) : undefined;
+-var binding = variable.binding && variable.binding.path ? "form."+variable.binding.path+".value" : undefined 
 
-div(class="fm-input-wrapper" v-if=variable.visible?variable.visible+"":"false")
+div(
+  v-if=visible
+  class="fm-input-wrapper" 
+  )
   fm-input(
-    style=(variable.appearance && variable.appearance.style)  
-    class=variable.className
-    id=variable.id?"" + variable.id:undefined 
-    v-if=variable.isTextArea?"!stateMachine['showStaticText']":undefined 
-    v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value":undefined 
-    label=variable.title?variable.title:undefined 
-    placeholder=variable.placeholder?""+variable.placeholder:undefined 
-    type="number"
-    :readonly!=variable.readonly?variable.readonly+"":undefined
-    :required!=variable.require?variable.require+"":undefined
-    :disabled!=variable.disabled?variable.disabled+"":undefined
+    v-model=binding
+    :required=require
+    :readonly=readonly
+    :disabled=disable
+    :modelValue=variable.modelValue ? variable.modelValue+"":undefined 
     :clearable!=variable.clearable?variable.clearable+"":undefined
     :is-link!=variable.isLink?variable.isLink+"":undefined
     :minValue!=variable.minValue?variable.minValue+"":undefined
@@ -21,10 +29,11 @@ div(class="fm-input-wrapper" v-if=variable.visible?variable.visible+"":"false")
     :precision=variable.precision || variable.precision===0?variable.precision+"":undefined
     input-align="right"
     :labelWidth!=variable.labelWidth?variable.labelWidth+"":undefined
+    direction=variable.direction?variable.direction+"":undefined
     extra=variable.suffix?variable.suffix+"":undefined
     :error-message!=variable.errorMessage
     error-message-align=variable.errorMessage ? "right" : undefined
-  )
+  )&attributes(attrs)
     if(variable.rightTemplate)
       template(#right-icon)
         | !{variable.rightTemplate}

package/lib/template/ui/mobilevue/page-content-container.pug

@@ -0,0 +1,10 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-var visible = variable.visible ? variable.visible.value : undefined;
+
+  div(
+    v-if=visible
+    id=variable.replacedId?""+variable.replacedId:undefined   
+  )&attributes(attrs)
+    | {{content}}

package/lib/template/ui/mobilevue/page-footer-container.pug

@@ -0,0 +1,10 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-var visible = variable.visible ? variable.visible.value : undefined;
+
+  div(
+    v-if=visible
+    id=variable.replacedId?""+variable.replacedId:undefined   
+  )&attributes(attrs)
+    | {{content}}

package/lib/template/ui/mobilevue/page-header-container.pug

@@ -0,0 +1,10 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-var visible = variable.visible ? variable.visible.value : undefined;
+
+  div(
+    v-if=visible
+    id=variable.replacedId?""+variable.replacedId:undefined   
+  )&attributes(attrs)
+    | {{content}}

package/lib/template/ui/mobilevue/picker.pug

@@ -1,32 +1,48 @@
--variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+//- -variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.id = variable.replacedId? String(variable.replacedId) : undefined 
+-attrs.placeholder = variable.placeholder? String(variable.placeholder) : undefined 
+-attrs.label = variable.title? String(variable.title) : undefined 
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var require = variable.require ? String(variable.require.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var disable = variable.disable ? String(variable.disable.value) : undefined;
+-var binding = variable.binding && variable.binding.path ? "form."+variable.binding.path+".value" : undefined 
+-var items = variable.dataSourceType === 'dynamic' ? String(variable.bindDataSource.value) : variable.enumData
 
-div(class="fm-input-wrapper" v-if!=variable.visible?variable.visible+"":"false")
+div(
+  v-if=visible
+  class="fm-input-wrapper" 
+)
   fm-picker(
-    style=(variable.appearance && variable.appearance.style)  
-    class=(variable.appearance && variable.appearance.class)  
-    inputClass=variable.direction === 'vertical' ? "fm-input-vertical" : undefined
-    v-if=variable.isTextArea?"!stateMachine['showStaticText']":undefined 
-    id=variable.title?""+variable.id:undefined 
-    label=variable.title?""+variable.title:undefined 
+    v-model=binding
+    :required=require
+    :readonly=readonly
+    :disabled=disable
+    :modelValue=variable.modelValue ? variable.modelValue+"":undefined 
     title=variable.title?""+variable.title:undefined
-    :disable!=variable.disable?""+variable.disable:undefined  
-    :readonly!=variable.readonly?""+variable.readonly:undefined
-    :required!=variable.require?variable.require+"":undefined
-    placeholder=variable.placeholder?""+variable.placeholder:undefined
     show-toolbar
-    v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value":undefined 
-    :data!=variable.enumData? JSON.stringify(variable.enumData).replace(/"/g, "'") :undefined
+    :data=items
     idField=variable.idField?""+variable.idField:undefined
     textField=variable.textField?""+variable.textField:undefined
     valueField=variable.valueField?""+variable.valueField:undefined
     input-align="right"
+    direction=variable.direction?variable.direction+"":undefined
     :labelWidth!=variable.labelWidth?variable.labelWidth+"":undefined
     :error-message!=variable.errorMessage
     error-message-align=variable.errorMessage ? "right" : undefined
-  )
+  )&attributes(attrs)
+    if(variable.leftTemplate)
+      template(#left-icon)
+        | !{variable.leftTemplate}
     if(variable.rightTemplate)
       template(#right-icon)
         | !{variable.rightTemplate}
+    if(variable.extraTemplate)
+      template(#extra)
+        | !{variable.extraTemplate}
     if(variable.valueTemplate)
       template(v-slot:value="slotProps")
         | !{variable.valueTemplate}

package/lib/template/ui/mobilevue/radio-group.pug

@@ -1,27 +1,41 @@
--variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
--var attrs = variable.direction === 'vertical' ? {'#default': ''} : {'#value': ''}
--var direction = variable.displayType === 'button' ? 'horizontal' : variable.direction
+//- -variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.label = variable.title? String(variable.title) : undefined 
 -var checkerStyle = variable.checkerWidth ? { width: variable.checkerWidth + 'px' } : undefined
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var require = variable.require ? String(variable.require.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var disable = variable.disable ? String(variable.disable.value) : undefined;
+-var binding = variable.binding && variable.binding.path ? "form."+variable.binding.path+".value" : undefined 
+-var inputDirection = variable.displayType !== 'button' ? 'vertical' : variable.direction
+-var direction = variable.displayType === 'button' ? 'horizontal' : variable.direction
+-var groupClass = inputDirection === 'horizontal' ? 'd-flex justify-content-end' : undefined
+-var items = variable.dataSourceType === 'dynamic' ? String(variable.bindDataSource.value) : variable.enumData
 
-div(class="fm-input-wrapper" v-if!=variable.visible?variable.visible+"":"false")
+div(
+  v-if=visible
+  class="fm-input-wrapper" 
+)
   fm-input(
-    class="fm-input-vertical"
-    label=variable.title?""+variable.title:undefined 
-    :required!=variable.require?variable.require+"":undefined
+    center
+    :required=require
+    input-align="right"
     :labelWidth!=variable.labelWidth?variable.labelWidth+"":undefined
+    direction=inputDirection?inputDirection+"":undefined
     :error-message!=variable.errorMessage
     error-message-align=variable.errorMessage ? "right" : undefined
-  )
+  )&attributes(attrs)
     template(#default)
       fm-radio-group(
-        class=(variable.appearance && variable.appearance.class)
-        style=(variable.appearance && variable.appearance.style)
-        v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value":undefined 
-        :items=variable.enumData?""+variable.enumData:undefined
+        class=groupClass
+        v-model=binding
+        :readonly=readonly
+        :disabled=disable
+        :items=items?items:undefined
         valueField=variable.valueField?""+variable.valueField:undefined
         textField=variable.textField?""+variable.textField:undefined
-        :disabled!=variable.readonly?variable.readonly+"":undefined
-        :readonly!=variable.readonly?variable.readonly+"":undefined
         direction=direction?direction+"":undefined
         :checkerStyle=checkerStyle
         :checked-color=variable.checkedColor?variable.checkedColor+"":undefined

package/lib/template/ui/mobilevue/rich-text-editor.pug

@@ -1,37 +1,48 @@
--variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+//- -variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-var placeholder = variable.placeholder? String(variable.placeholder) : undefined 
+-var id = variable.replacedId? String(variable.replacedId) : undefined 
+-var label = variable.title? String(variable.title) : undefined 
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var require = variable.require ? String(variable.require.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var disable = variable.disable ? String(variable.disable.value) : undefined;
+-var binding = variable.binding && variable.binding.path ? "form."+variable.binding.path+".value" : undefined 
 
 if(variable.noInput) 
   fm-rich-editor(
-    v-if!=variable.visible?variable.visible+"":"false"
-    class=(variable.appearance && variable.appearance.class)
-    style=(variable.appearance && variable.appearance.style)
-    v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value": variable.modelValue ? ""+variable.modelValue: undefined 
-    :readonly!=variable.readonly ?""+variable.readonly:undefined
-    placeholder=variable.placeholder ?""+variable.placeholder:undefined
+    v-if=visible
+    v-model=binding 
+    :readonly=readonly
+    :disabled=disable
+    :modelValue=variable.modelValue ? variable.modelValue+"":undefined 
+    placeholder=placeholder
     position=variable.position ?""+variable.position:undefined
     :border=variable.border ?""+variable.border:"false"
-  )
+  )&attributes(attrs)
 else 
-  div(class="fm-input-wrapper" v-if=variable.visible?variable.visible+"":"false")
+  div(
+    v-if=visible
+    class="fm-input-wrapper" 
+    )
     fm-input(
-      id=variable.id?"" + variable.id:undefined 
-      class="fm-input-vertical " + (variable.appearance && variable.appearance.class)
-      style=(variable.appearance && variable.appearance.style)
-      label=variable.title?variable.title:undefined 
-      :required!=variable.require?variable.require+"":undefined
-      :readonly!=variable.readonly ?""+variable.readonly:undefined
-      :disabled!=variable.disabled?variable.disabled+"":undefined
+      id=id
+      class="fm-input-vertical"
+      :required=require
+      label=label
       :labelWidth!=variable.labelWidth?variable.labelWidth+"":undefined
       :error-message!=variable.errorMessage
       error-message-align=variable.errorMessage ? "right" : undefined
-    )
+    )&attributes(attrs)
       template(#value)
         fm-rich-editor(
-          class=(variable.appearance && variable.appearance.class)
-          style=(variable.appearance && variable.appearance.style)
-          v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value":undefined 
-          :readonly!=variable.readonly ?""+variable.readonly:undefined
-          placeholder=variable.placeholder ?""+variable.placeholder:undefined
+          v-model=binding
+          :readonly=readonly
+          :disabled=disable
+          :modelValue=variable.modelValue ? variable.modelValue+"":undefined 
+          placeholder=placeholder
           position=variable.position ?""+variable.position:undefined
           :border=variable.border ?""+variable.border:"false"
         )

package/lib/template/ui/mobilevue/search.pug

@@ -0,0 +1,20 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.id = variable.replacedId ? String(variable.replacedId) : undefined;
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var disabled = variable.disabled ? String(variable.disabled.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var value = variable.value ? String(variable.value.value) : undefined;
+
+fm-search(
+  v-if=visible
+  :readonly=readonly
+  :disabled=disabled
+  :modelValue=value
+  :clearable=variable.clearable ? String(variable.clearable) : undefined 
+  placeholder=variable.placeholder ? String(variable.placeholder) : undefined 
+  shape=variable.shape ? String(variable.shape) : undefined 
+  @input=variable.change ? String(variable.change) : undefined 
+  @search=variable.search ? String(variable.search) : undefined 
+)&attributes(attrs)

package/lib/template/ui/mobilevue/section.pug

@@ -23,13 +23,9 @@ div(
             block 
             plain 
             noBorder 
+            icon=item.iconType?""+item.iconType:undefined
             :disabled=item.disable?""+item.disable:undefined 
             @click=item.click
-          )
-            fm-icon(
-              class="fm-btn-icon" 
-              name=item.iconType?""+item.iconType:undefined
-            )
-            span(class="fm-btn-text")=item.text
+          )=item.text
       else if(variable.footerTemplate)
         | !{variable.footerTemplate}

package/lib/template/ui/mobilevue/switch.pug

@@ -1,16 +1,38 @@
--variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+//- -variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+-var attrs = {};
+-attrs.type = "text"
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.id = variable.replacedId? String(variable.replacedId) : undefined 
+-attrs.placeholder = variable.placeholder? String(variable.placeholder) : undefined 
+-attrs.title = variable.title? String(variable.title) : undefined 
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var require = variable.require ? String(variable.require.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var disable = variable.disable ? String(variable.disable.value) : undefined;
+-var binding = variable.binding && variable.binding.path ? "form."+variable.binding.path+".value" : undefined 
 
-div(class="fm-input-wrapper" v-if=variable.visible?variable.visible+"":"false")
+div(
+  v-if=visible
+  class="fm-input-wrapper" 
+  )
   fm-switch-cell(
-    style=(variable.appearance && variable.appearance.style)  
-    class=variable.className
-    v-if=variable.isTextArea?"!stateMachine['showStaticText']":undefined 
-    id=variable.id?""+variable.id:undefined 
-    title=variable.title?""+variable.title:undefined 
-    :disabled!=variable.readonly?variable.readonly+"":undefined
-    v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value":undefined 
+    v-model=binding
+    :required=require
+    :readonly=readonly
+    :disabled=disable
+    :modelValue=variable.modelValue ? variable.modelValue+"":undefined 
     size=variable.size?""+variable.size:undefined 
-  )
+  )&attributes(attrs)
+    if(variable.leftTemplate)
+      template(#left-icon)
+        | !{variable.leftTemplate}
+    if(variable.rightTemplate)
+      template(#right-icon)
+        | !{variable.rightTemplate}
+    if(variable.extraTemplate)
+      template(#extra)
+        | !{variable.extraTemplate}
     if(variable.labelTips) 
       template(#title)
         <span>!{variable.title}</span>

package/lib/template/ui/mobilevue/tab-bar.pug

@@ -1,8 +1,14 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var binding = variable.binding ? String(variable.binding.value) : undefined;
+
 fm-tab-bar(
-  v-if=variable.visible?variable.visible+"":"false"
-  class=(variable.appearance && variable.appearance.class)
-  style=(variable.appearance && variable.appearance.style)
-  :items=variable.items ? ""+variable.items:undefined
-  type="nav"
-)
+  v-if=visible
+  type=variable.displayType?variable.displayType:undefined
+  :modelValue=binding
+  :items=variable.items?variable.items:undefined
+  @change=variable.change?String(variable.change):undefined
+)&attributes(attrs)
   | {{content}}

package/lib/template/ui/mobilevue/tabpage.pug

@@ -1,9 +1,14 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.name = variable.replacedId ? String(variable.replacedId) : undefined;
+-var bindTitle = variable.bindTitle ? variable.bindTitle.path ? 'uiState.' + variable.bindTitle.path : variable.bindTitle : undefined
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var title = !bindTitle && variable.title ? String(variable.title) : undefined
+
 fm-tab(
-  style=(variable.appearance && variable.appearance.style)  
-  class=(variable.appearance && variable.appearance.class)  
-  v-if=variable.visible?variable.visible+"":"false"
-  title=variable.title?""+variable.title:undefined
-  :title=variable.bindTitle?""+variable.bindTitle:undefined
-  name=variable.id?""+variable.id:undefined
-  )
+  v-if=visible
+  title= title
+  :title=bindTitle
+)&attributes(attrs)
   | {{content}}

package/lib/template/ui/mobilevue/tabs.pug

@@ -1,11 +1,15 @@
+-var attrs = {};
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.ref = variable.replacedId
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+
 fm-tabs(
-  style=(variable.appearance && variable.appearance.style)  
-  class=(variable.appearance && variable.appearance.class)  
-  v-if=variable.visible?variable.visible+"":"false"
-  ref=variable.replacedId
-  :value=variable.value?""+variable.value:undefined
-  @change=variable.tabChange?""+variable.tabChange:undefined
-  )
+  v-if=visible
+  :value=variable.value ? String(variable.value) : undefined
+  :fill=variable.fill ? String(variable.fill) : undefined
+  @change=variable.tabChange ? String(variable.tabChange) : undefined
+)&attributes(attrs)
   if(variable.titleTemplate)
     template(v-slot:title="props")
       | !{variable.titleTemplate}

package/lib/template/ui/mobilevue/text-area.pug

@@ -1,18 +1,27 @@
--variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
-//- -variable.errorMessage = variable.binding && variable.binding.path? `form.${variable.binding.path}.validationResult && form.${variable.binding.path}.validationResult.message`:undefined 
+//- -variable.readonly = variable.readonly?String(variable.readonly).replace(/"/g, "'")+"":undefined;
+-var attrs = {};
+-attrs.type = "textarea"
+-attrs.class = variable.appearance && variable.appearance.class;
+-attrs.style = variable.appearance && variable.appearance.style;
+-attrs.id = variable.replacedId? String(variable.replacedId) : undefined 
+-attrs.placeholder = variable.placeholder? String(variable.placeholder) : undefined 
+-attrs.label = variable.title? String(variable.title) : undefined 
+-var visible = variable.visible ? String(variable.visible.value) : 'false';
+-var require = variable.require ? String(variable.require.value) : undefined;
+-var readonly = variable.readonly ? String(variable.readonly.value) : undefined;
+-var disable = variable.disable ? String(variable.disable.value) : undefined;
+-var binding = variable.binding && variable.binding.path ? "form."+variable.binding.path+".value" : undefined 
 
-div(class="fm-input-wrapper" v-if!=variable.visible?variable.visible+"":"false")
+div(
+  v-if=visible
+  class="fm-input-wrapper" 
+)
   fm-input(
-    style=(variable.appearance && variable.appearance.style)  
-    class=(variable.appearance && variable.appearance.class)  
-    id=variable.id?"" + variable.id:undefined 
-    v-model=variable.binding && variable.binding.path?"form."+variable.binding.path+".value":undefined 
-    label=variable.title?variable.title:undefined 
-    placeholder=variable.placeholder?""+variable.placeholder:undefined 
-    type="textarea"
-    :readonly!=variable.readonly?variable.readonly+"":undefined
-    :required!=variable.require?variable.require+"":undefined
-    :disabled!=variable.disabled?variable.disabled+"":undefined
+    v-model=binding
+    :required=require
+    :readonly=readonly
+    :disabled=disable
+    :modelValue=variable.modelValue ? variable.modelValue+"":undefined 
     :clearable!=variable.clearable?variable.clearable+"":undefined
     :showWordLimit!=variable.showWordLimit?variable.showWordLimit+"":undefined
     :maxlength!=variable.maxlength?variable.maxlength+"":undefined
@@ -20,7 +29,7 @@ div(class="fm-input-wrapper" v-if!=variable.visible?variable.visible+"":"false")
     :labelWidth!=variable.labelWidth?variable.labelWidth+"":undefined
     :error-message!=variable.errorMessage
     error-message-align=variable.errorMessage ? "right" : undefined
-  )
+  )&attributes(attrs)
     if(variable.rightTemplate)
       template(#right-icon)
         | !{variable.rightTemplate}