blob: 5dad952fc1feb11a9e4ce0daf5014b08bae881c9 [file] [log] [blame]
<label ng-if="vm.field.type !== 'object' && vm.field.type !== 'array'">
{{vm.field.label}}
<span class="required" ng-if="vm.field.validators.required">*</span>
</label>
<input
xos-custom-validator custom-validator="vm.field.validators.custom || null"
ng-if="vm.field.type !== 'boolean' && vm.field.type !== 'object' && vm.field.type !== 'select' && vm.field.type !== 'array'"
type="{{vm.field.type}}"
name="{{vm.name}}"
class="form-control"
ng-model="vm.ngModel"
ng-minlength="vm.field.validators.minlength || 0"
ng-maxlength="vm.field.validators.maxlength || 2000"
ng-required="vm.field.validators.required || false" />
<select class="form-control" ng-if="vm.field.type === 'select'"
name = "{{vm.name}}"
ng-options="item.id as item.label for item in vm.field.options"
ng-model="vm.ngModel"
ng-required="vm.field.validators.required || false">
</select>
<span class="boolean-field" ng-if="vm.field.type === 'boolean'">
<a
class="btn btn-success"
ng-show="vm.ngModel"
ng-click="vm.ngModel = false">
<i class="fa fa-check"></i>
</a>
<a
class="btn btn-danger"
ng-show="!vm.ngModel"
ng-click="vm.ngModel = true">
<i class="fa fa-remove"></i>
</a>
</span>
<div
class="panel panel-default object-field"
ng-if="vm.field.type == 'object' && (!vm.isEmptyObject(vm.ngModel) || !vm.isEmptyObject(vm.field.properties))"
>
<div class="panel-heading">{{vm.field.label}}</div>
<div class="panel-body">
<div ng-if="!vm.field.properties" ng-repeat="(k, v) in vm.ngModel">
<xos-field
name="k"
field="{label: vm.formatLabel(k), type: vm.getType(v)}"
ng-model="v">
</xos-field>
</div>
<div ng-if="vm.field.properties" ng-repeat="(k, v) in vm.field.properties">
<xos-field
name="k"
field="{
label: v.label || vm.formatLabel(k),
type: v.type,
validators: v.validators
}"
ng-model="vm.ngModel[k]">
</xos-field>
</div>
</div>
</div>
<div
class="panel panel-default array-field"
ng-if="vm.field.type == 'array'">
<div class="panel-heading">{{vm.field.label}}</div>
<div class="panel-body selected">
<ul class="draggable" dnd-list="vm.ngModel">
<li
class="array-element"
ng-repeat="item in vm.ngModel"
dnd-draggable="item"
dnd-moved="vm.ngModel.splice($index, 1)"
dnd-effect-allowed="move"
dnd-selected="models.selected = item"
>
<div class="well well-sm text-center">
{{item}}
</div>
</li>
<div class="clearfix"></div>
</ul>
</div>
<div class="panel-body unselected">
<ul class="draggable" dnd-list="vm.field.availableOptions">
<li
class="array-element"
ng-repeat="item in vm.field.availableOptions"
dnd-draggable="item"
dnd-moved="vm.field.availableOptions.splice($index, 1)"
dnd-effect-allowed="move"
dnd-selected="models.selected = item"
>
<div class="well well-sm text-center">
{{item}}
</div>
</li>
<div class="clearfix"></div>
</ul>
</div>
</div>