150 lines
8.3 KiB
HTML
150 lines
8.3 KiB
HTML
<form class="row" name="fieldForm" form-locator auto-save-form="update()" form="form" novalidation>
|
|
<div class="add-field col-xs-5">
|
|
<!-- <select ng-model="addField.new" ng-options="type.name as type.value for type in addField.types"></select>
|
|
<button type="submit" class="btn" ng-click="addNewField()">
|
|
<i class="icon-plus"></i> Add Field
|
|
</button> -->
|
|
<div class="row add-field-title">
|
|
<h3 class="col-xs-12">Add New Field</h3>
|
|
<span ng-if="form.$dirty && form.$valid" class="help-block">Updating ...</span>
|
|
</div>
|
|
<div class="panel-group row">
|
|
<div class="col-xs-6" ng-repeat="type in addField.types" on-finish-render>
|
|
<div class="panel panel-default" style="background-color:#f5f5f5;">
|
|
<div class="panel-heading" ng-click="addNewField(type.name)" style="cursor: pointer; font-size:14px;">
|
|
<span class="pull-left">
|
|
<field-icon-directive type-name="{{type.name}}"></field-icon-directive>
|
|
</span>
|
|
|
|
<span style="padding-left:0.3em;">{{type.value}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-sm-7 current-fields">
|
|
<!-- <p ng-show="form.form_fields.length == 0">No fields added yet.</p> -->
|
|
<div class="row">
|
|
<div class="col-xs-10">
|
|
<accordion close-others="accordion.oneAtATime">
|
|
<accordion-group ng-repeat="field in form.form_fields" is-open="accordion[$index].isOpen" on-finish-render="setFormValid()">
|
|
|
|
<accordion-heading>
|
|
<span class="pull-left" ng-switch="field.fieldType">
|
|
<field-icon-directive type-name="{{field.fieldType}}"></field-icon-directive>
|
|
</span>
|
|
<span style="padding-left:1.2em;">{{field.title}}</span>
|
|
<span class="pull-right">
|
|
<i class="fa fa-chevron-right" ng-hide="accordion[$index].isOpen">
|
|
</i>
|
|
<i class="fa fa-chevron-down" ng-show="accordion[$index].isOpen">
|
|
</i>
|
|
</span>
|
|
</accordion-heading>
|
|
<div class="accordion-edit container">
|
|
<!-- <button class="btn btn-danger pull-right" type="button" ng-click="deleteField(field.client_id)"><i class="icon-trash icon-white"></i> Delete</button> -->
|
|
<div class="row">
|
|
<div class="col-xs-12">
|
|
<h4>Preview</h4>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<ul class="col-xs-4 container" style="list-style:none;border:2px lightgray solid;">
|
|
<field-directive field="field" required="">
|
|
</field-directive>
|
|
</ul>
|
|
</div>
|
|
<div class="clear"></div> <hr>
|
|
<div class="row">
|
|
<div class="col-xs-2">Field Type:</div>
|
|
<div class="col-xs-4">{{field.fieldType}}</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-xs-2">Field Title:</div>
|
|
<div class="col-xs-4"><input type="text" ng-model="field.title" value="{{field.title}}" required></div>
|
|
</div>
|
|
<br><br>
|
|
<hr>
|
|
<div class="row" ng-show="showAddOptions(field)">
|
|
<div class="col-xs-2">Field Options:</div>
|
|
<div class="col-xs-6 container">
|
|
<div ng-repeat="option in field.field_options" class="row">
|
|
<input type="text" name="{{option.option_title}}" ng-model="option.option_title" value="{{option.option_title}}" class="col-xs-4">
|
|
|
|
<a class="btn btn-danger btn-mini right" type="button" ng-click="deleteOption(field, option)" class="col-xs-3"><i class="fa fa-trash-o"></i></a>
|
|
<span class="label label-inverse">Value: {{ option.option_value }}</span>
|
|
</div>
|
|
<button class="btn btn-primary btn-small" type="button" ng-click="addOption(field)"><i class="icon-plus icon-white"></i> Add Option</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="clear"></div> <hr>
|
|
|
|
<div class="row">
|
|
<div class="col-xs-2">Required:</div>
|
|
<div class="col-xs-4">
|
|
<label>
|
|
<input type="radio" ng-value="true" ng-selected ng-model="field.required"/>
|
|
Yes
|
|
</label>
|
|
<label>
|
|
<input type="radio" ng-value="false" ng-model="field.required"/>
|
|
No
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="clear"></div> <hr>
|
|
|
|
<div class="row">
|
|
<div class="col-xs-2">Disabled:</div>
|
|
<div class="col-xs-4">
|
|
<label>
|
|
<input type="radio" ng-value="true" ng-selected ng-model="field.disabled"/>
|
|
Yes
|
|
</label>
|
|
<label>
|
|
<input type="radio" ng-value="false" ng-model="field.disabled"/>
|
|
No
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
|
|
</div>
|
|
</accordion-group>
|
|
<div class="panel panel-default" style="border-style: dashed; border-color: #a9a9a9;">
|
|
<div class="panel-heading">
|
|
<h4 class="panel-title text-center" style="color: #a9a9a9;">
|
|
Drag and Drop new fields here
|
|
</h4>
|
|
</div>
|
|
</div>
|
|
</accordion>
|
|
</div>
|
|
<div class="col-xs-1" style="padding:0 5px;" >
|
|
<div class="panel-group tool-panel text-center">
|
|
<div class="panel panel-default" ng-repeat="field in form.form_fields">
|
|
<div class="panel-heading" style="padding: 10px 10px; height: 37px;" ng-click="deleteField(field.$$hashKey)">
|
|
<span class="text-center">
|
|
<a href="" class="fa fa-trash-o"></a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xs-1" style="padding:0 5px;">
|
|
<div class="panel-group tool-panel text-center">
|
|
<div class="panel panel-default" ng-repeat="field in form.form_fields">
|
|
<div class="panel-heading" style="padding: 10px 10px; height: 37px;" ng-click="duplicateField(field, $index)">
|
|
<span class="text-center">
|
|
<a href="" class="fa fa-files-o"></a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form> |