blob: b3597fdc900b4008159878870461ab2cd5152c96 [file] [log] [blame]
Matteo Scandolo500e4c42017-08-08 13:05:24 -07001
2<!--
3Copyright 2017-present Open Networking Foundation
4
5Licensed under the Apache License, Version 2.0 (the "License");
6you may not use this file except in compliance with the License.
7You may obtain a copy of the License at
8
9http://www.apache.org/licenses/LICENSE-2.0
10
11Unless required by applicable law or agreed to in writing, software
12distributed under the License is distributed on an "AS IS" BASIS,
13WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14See the License for the specific language governing permissions and
15limitations under the License.
16-->
17
18
Matteo Scandolo80056232017-07-10 16:24:41 -070019<label ng-if="vm.field.type !== 'object' && vm.field.type !== 'array'">
20 {{vm.field.label}}
21 <span class="required" ng-if="vm.field.validators.required">*</span>
22</label>
Matteo Scandoloee655a12016-12-19 15:38:43 -080023<input
24 xos-custom-validator custom-validator="vm.field.validators.custom || null"
25 ng-if="vm.field.type !== 'boolean' && vm.field.type !== 'object' && vm.field.type !== 'select' && vm.field.type !== 'array'"
26 type="{{vm.field.type}}"
27 name="{{vm.name}}"
28 class="form-control"
29 ng-model="vm.ngModel"
30 ng-minlength="vm.field.validators.minlength || 0"
31 ng-maxlength="vm.field.validators.maxlength || 2000"
32 ng-required="vm.field.validators.required || false" />
Matteo Scandoloe7e052d2017-07-31 19:54:31 -070033<select class="form-control" ng-if="vm.field.type === 'select'"
Matteo Scandoloee655a12016-12-19 15:38:43 -080034 name = "{{vm.name}}"
35 ng-options="item.id as item.label for item in vm.field.options"
36 ng-model="vm.ngModel"
37 ng-required="vm.field.validators.required || false">
38</select>
39<span class="boolean-field" ng-if="vm.field.type === 'boolean'">
40 <a
41 class="btn btn-success"
42 ng-show="vm.ngModel"
43 ng-click="vm.ngModel = false">
44 <i class="fa fa-check"></i>
45 </a>
46 <a
47 class="btn btn-danger"
48 ng-show="!vm.ngModel"
49 ng-click="vm.ngModel = true">
50 <i class="fa fa-remove"></i>
51 </a>
52 </span>
53<div
54 class="panel panel-default object-field"
55 ng-if="vm.field.type == 'object' && (!vm.isEmptyObject(vm.ngModel) || !vm.isEmptyObject(vm.field.properties))"
56>
57 <div class="panel-heading">{{vm.field.label}}</div>
58 <div class="panel-body">
59 <div ng-if="!vm.field.properties" ng-repeat="(k, v) in vm.ngModel">
60 <xos-field
61 name="k"
62 field="{label: vm.formatLabel(k), type: vm.getType(v)}"
63 ng-model="v">
64 </xos-field>
65 </div>
66 <div ng-if="vm.field.properties" ng-repeat="(k, v) in vm.field.properties">
67 <xos-field
68 name="k"
69 field="{
70 label: v.label || vm.formatLabel(k),
71 type: v.type,
72 validators: v.validators
73 }"
74 ng-model="vm.ngModel[k]">
75 </xos-field>
76 </div>
77 </div>
78</div>
79<div
80 class="panel panel-default array-field"
81 ng-if="vm.field.type == 'array'">
82 <div class="panel-heading">{{vm.field.label}}</div>
83 <div class="panel-body selected">
84 <ul class="draggable" dnd-list="vm.ngModel">
85 <li
86 class="array-element"
87 ng-repeat="item in vm.ngModel"
88 dnd-draggable="item"
89 dnd-moved="vm.ngModel.splice($index, 1)"
90 dnd-effect-allowed="move"
91 dnd-selected="models.selected = item"
92 >
93 <div class="well well-sm text-center">
94 {{item}}
95 </div>
96 </li>
97 <div class="clearfix"></div>
98 </ul>
99 </div>
100 <div class="panel-body unselected">
101 <ul class="draggable" dnd-list="vm.field.availableOptions">
102 <li
103 class="array-element"
104 ng-repeat="item in vm.field.availableOptions"
105 dnd-draggable="item"
106 dnd-moved="vm.field.availableOptions.splice($index, 1)"
107 dnd-effect-allowed="move"
108 dnd-selected="models.selected = item"
109 >
110 <div class="well well-sm text-center">
111 {{item}}
112 </div>
113 </li>
114 <div class="clearfix"></div>
115 </ul>
116 </div>
117</div>