You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
ocr/htmlweb/modeler/views/templates/form-builder-element-templa...

133 lines
6.7 KiB

<div class="form-field" ng-switch="formElement.type" ng-class="{'editing': editState.field == formElement}">
<div class="actions" ng-show="(!formMode || formMode != 'read')">
<button class="btn btn-clean" ng-click="openFieldPopover()"><i class="glyphicon glyphicon-pencil"></i></button>
<button class="btn btn-clean" ng-click="removeFormElement(formElement)"><i class="icon icon-remove"></i></button>
</div>
<div ng-switch-when="text" class="form-group">
<label class="control-label form-field-label">{{formElement.name}}</label><span class="marker" ng-if="formElement.required">*</span>
<input type="text" class="form-control" style="cursor:default;background-color:#fff;" value="Text" disabled>
</div>
<div ng-switch-when="password" class="form-group">
<label class="control-label form-field-label">{{formElement.name}}</label><span class="marker" ng-if="formElement.required">*</span>
<input type="text" class="form-control" style="cursor:default;background-color:#fff;" value="Password" disabled>
</div>
<div ng-switch-when="multi-line-text" class="form-group">
<label class="control-label form-field-label">{{formElement.name}}</label><span class="marker" ng-if="formElement.required">*</span>
<textarea rows="4" class="form-control" style="cursor:default;background-color:#fff;" value="Text" disabled></textarea>
</div>
<div ng-switch-when="date" class="form-group">
<label class="control-label form-field-label"><i class="glyphicon glyphicon-calendar"></i> {{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<input type="text" class="form-control" name="date" disabled>
</div>
<div ng-switch-when="boolean" class="checkbox" style="padding-left:0;">
<label class="control-label form-field-label"></label>
<div style="padding-left: 20px;">
<input type="checkbox" class="checkbox-inline" disabled>{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span>
</div>
</div>
<div ng-switch-when="radio-buttons" class="form-group">
<label class="control-label form-field-label">{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<div ng-show="formElement.options && formElement.options.length > 0" class="radio" ng-repeat="option in formElement.options">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios{{$index}}" value="option{{$index}}" ng-checked="formElement.value == option.name" disabled>{{option.name}}</input>
</label>
</div>
<div ng-show="!formElement.options && formElement.options.length === 0 && !formElement.optionsExpression" class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" disabled>
Option 1
</label>
</div>
<div ng-show="formElement.optionsExpression" ng-style="{'font-size': '1em'}">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="none" disabled>
{{formElement.optionsExpression}}
</input>
</label>
</div>
<div class="clearfix"></div>
</div>
<div ng-switch-when="integer" class="form-group">
<label class="control-label form-field-label">{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<input type="number" class="form-control" style="cursor:default;background-color:#fff;" value="123" disabled>
</div>
<div ng-switch-when="decimal" class="form-group">
<label class="control-label form-field-label">{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<input type="number" class="form-control" style="cursor:default;background-color:#fff;" value="123.12" disabled>
</div>
<div ng-switch-when="dropdown" class="form-group">
<label class="control-label form-field-label">{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<select class="form-control" style="cursor:default;" disabled>
<option>Select...</option>
</select>
</div>
<div ng-switch-when="people" class="form-group">
<label class="control-label form-field-label">{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<div class="input-group">
<span class="input-group-addon"><i class="icon icon-user-add"></i></span>
<input type="text" class="form-control" style="cursor:default;background-color:#fff;" placeholder="{{'FORM-BUILDER.LABEL.PERSON' | translate}}" value="{{formElement.placeholder}}" disabled>
</div>
</div>
<div ng-switch-when="functional-group" class="form-group">
<label class="control-label form-field-label">{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<div class="input-group">
<span class="input-group-addon"></span>
<input type="text" class="form-control" style="cursor:default;background-color:#fff;" placeholder="{{'FORM-BUILDER.LABEL.FUNCTIONAL-GROUP' | translate}}" value="{{formElement.placeholder}}" >
</div>
</div>
<div ng-switch-when="upload" class="form-group">
<label class="control-label form-field-label">{{formElement.name}} <span class="marker" ng-if="formElement.required">*</span></label>
<div class="input-group clearfix">
<span class="input-group-addon"><i class="icon icon-folder"></i></span>
<input type="text" class="form-control" style="cursor:default;background-color:#fff;" value="Upload or import content..." disabled>
</div>
</div>
<div ng-switch-when="hyperlink" class="form-group">
<label class="control-label form-field-label">{{formElement.name}}<span class="marker" ng-if="formElement.required">*</span></label>
<div class="message" ng-show="formElement.params.hyperlinkUrl">{{formElement.params.hyperlinkUrl}}</div>
</div>
<div ng-switch-when="spacer" class="form-group">
<br />
</div>
<div ng-switch-when="horizontal-line" class="form-group">
<hr>
</div>
<div ng-switch-when="headline" class="form-group">
<h4><strong>{{formElement.name}}</strong></h4>
</div>
<div ng-switch-when="headline-with-line" class="form-group">
<h4><strong>{{formElement.name}}</strong></h4>
<hr>
</div>
<div ng-switch-when="expression" class="form-group">
<div class="message" ng-style="{'font-size': formElement.params.size + 'em'}">
<div ng-show="formElement.expression && formElement.expression.length > 0">
{{formElement.expression}}
</div>
<div ng-show="!formElement.expression || formElement.expression.length == 0">
{{'FORM-BUILDER.MESSAGE.EMPTY-EXPRESSION' | translate}}
</div>
</div>
<div class="clearfix"></div>
</div>
</div>