297 lines
17 KiB
HTML
297 lines
17 KiB
HTML
|
|
<form class="row container" name="editForm" auto-save-form auto-save-watch="myform.form_fields" auto-save-callback="update">
|
|
|
|
<div class="col-xs-2 col-sm-4 col-md-5 add-field" id="hello">
|
|
|
|
<div class="row add-field-title">
|
|
<h3 class="col-md-12 hidden-sm hidden-xs">Click to Add New Field</h3>
|
|
<h4 class="col-sm-12 hidden-xs hidden-md hidden-lg">Add New Field</h5>
|
|
<h5 class="col-sm-12 hidden-sm hidden-md hidden-lg">Add Field</h5>
|
|
</div>
|
|
<div class="panel-group row" class="draggable" ng-model="addField.types">
|
|
<div class="col-xs-12 col-sm-12 col-md-6" ng-repeat="type in addField.types">
|
|
<div class="panel panel-default" style="background-color:#f5f5f5;">
|
|
<div class="panel-heading" ng-click="addNewField(true, type.name)" style="cursor: pointer; font-size:14px;">
|
|
<span>
|
|
<field-icon-directive type-name="{{type.name}}"></field-icon-directive>
|
|
</span>
|
|
|
|
<span class="hidden-xs" style="padding-left:0.3em;">{{type.value}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs-10 col-sm-8 col-md-7 current-fields container">
|
|
<div class="row">
|
|
<div class="col-sm-12 col-md-10">
|
|
<accordion close-others="accordion.oneAtATime" ui-sortable="dropzone" ng-model="myform.form_fields" class="dropzone">
|
|
|
|
<!-- <accordion-group is-open="accordion[$index].isOpen" ng-if="myform.startPage.showStart">
|
|
|
|
<accordion-heading>
|
|
|
|
<div class="handle">
|
|
|
|
<span style="padding-left:1.2em;">
|
|
Start Page
|
|
<span ng-show="field.required">*</span>
|
|
</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>
|
|
</div>
|
|
</accordion-heading>
|
|
<div class="accordion-edit container">
|
|
|
|
<div class="row hidden-sm hidden-xs">
|
|
<div class="col-md-12">
|
|
<h4>Preview Field</h4>
|
|
</div>
|
|
<ul class="col-md-12 container" style="list-style:none;border:2px lightgray solid;">
|
|
<div class="field row text-center">
|
|
<div class="col-xs-12 text-center">
|
|
<h1>Welcome to {{myform.title}}</h1>
|
|
</div>
|
|
<div class="col-xs-10 col-xs-offset-1 text-center">
|
|
<p>{{form.startPage.introText}}</p>
|
|
</div>
|
|
</div>
|
|
<div class="row form-actions">
|
|
<p ng-repeat="button in form.startPage.buttons" class="col-xs-6 col-xs-offset-3 text-center">
|
|
<button class="btn btn-info" type="button" ng-style="{background-color:button.backgroundColor; color:button.color;}">
|
|
<a href="{{button.url}}" style="font-size: 1.6em; text-decoration: none;"> {{button.buttonText}}</a>
|
|
</button>
|
|
</p>
|
|
</div>
|
|
<div class="row form-actions">
|
|
<p class="col-xs-6 col-xs-offset-3 text-center">
|
|
<button class="btn btn-info" type="button">
|
|
<a ng-click="exitStartPage()" style="color:white; font-size: 1.6em; text-decoration: none;">Continue to Form</a>
|
|
</button>
|
|
</p>
|
|
</div>
|
|
</ul>
|
|
<hr>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-xs-12">
|
|
<h4>Edit StartPage</h4>
|
|
<br>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row question">
|
|
<div class="col-md-4 col-sm-12">Intro Text:</div>
|
|
<div class="col-md-8 col-sm-12">
|
|
<input type="text"
|
|
ng-model="myform.startPage.introText"
|
|
name="introTextStartPage"
|
|
value="{{myform.startPage.introText}}" required>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row"><br></div>
|
|
|
|
<div class="row options">
|
|
<div class="col-md-4 col-xs-12">Buttons:</div>
|
|
<div class="col-md-8 col-xs-12">
|
|
<div ng-repeat="button in myform.startPage.buttons" class="row">
|
|
|
|
<input type="text"
|
|
name="{{button.buttonText}}_buttonText_StartPage"
|
|
ng-model="button.buttonText"
|
|
value="{{button.buttonText}}"
|
|
placeholder="My Button"
|
|
class="col-xs-4">
|
|
|
|
<input type="text"
|
|
name="{{button.url}}_url_StartPage"
|
|
ng-model="button.url"
|
|
value="{{button.url}}"
|
|
placeholder="http://aeouaou.com/aoeuoa"
|
|
class="col-xs-6">
|
|
|
|
<a class="btn btn-danger btn-mini right" type="button" ng-click="deleteButton(button)" class="col-xs-2">
|
|
<i class="fa fa-trash-o"></i>
|
|
</a>
|
|
|
|
</div>
|
|
<div class="row">
|
|
<button class="btn btn-primary btn-small ol-md-12 col-sm-6 col-sm-offset-6 col-xs-6 col-xs-offset-6" type="button" ng-click="addButton(field)">
|
|
<i class="icon-plus icon-white"></i> Add Button
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</accordion-group> -->
|
|
|
|
|
|
|
|
<accordion-group ng-repeat="field in myform.form_fields" is-open="accordion[$index].isOpen" on-finish-render="editFormFields" ng-if="!field.deletePreserved">
|
|
|
|
<accordion-heading>
|
|
|
|
<div class="handle">
|
|
|
|
<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 ng-show="field.required">*</span>
|
|
</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>
|
|
</div>
|
|
</accordion-heading>
|
|
<div class="accordion-edit container">
|
|
|
|
<div class="row hidden-sm hidden-xs">
|
|
<div class="col-md-12">
|
|
<h4>Preview Field</h4>
|
|
</div>
|
|
<ul class="col-md-12 container" style="list-style:none;border:2px lightgray solid;">
|
|
<field-directive field="field" validate="false">
|
|
</field-directive>
|
|
</ul>
|
|
<hr>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-xs-12">
|
|
<h4>Edit Field</h4>
|
|
<br>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row question">
|
|
<div class="col-md-4 col-sm-12">Question Title:</div>
|
|
<div class="col-md-8 col-sm-12">
|
|
<input type="text" ng-model="field.title" name="title{{field._id}}" value="{{field.title}}" required></div>
|
|
</div>
|
|
|
|
<div class="row"><br></div>
|
|
|
|
<div class="row description">
|
|
<div class="col-md-4 col-sm-12">Description:</div>
|
|
<div class="col-md-8 col-sm-12"><textarea type="text" ng-model="field.description" name="description{{field._id}}"value="{{field.description}}"></textarea> </div>
|
|
</div>
|
|
|
|
<div class="row" ng-show="showAddOptions(field)"><br></div>
|
|
<div class="row options" ng-show="showAddOptions(field)">
|
|
<div class="col-md-4 col-xs-12">Options:</div>
|
|
<div class="col-md-8 col-xs-12">
|
|
<div ng-repeat="option in field.fieldOptions" class="row">
|
|
<input type="text" name="{{option.option_title}}{{field._id}}" ng-model="option.option_title" value="{{option.option_title}}" class="col-xs-5">
|
|
|
|
<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 col-md-4 hidden-xs hidden-sm">
|
|
Value: {{ option.option_value }}
|
|
</span>
|
|
</div>
|
|
<div class="row">
|
|
<button class="btn btn-primary btn-small ol-md-12 col-sm-4 col-sm-offset-4 col-xs-6 col-xs-offset-6" type="button" ng-click="addOption(field)">
|
|
<i class="icon-plus icon-white"></i> Add Option
|
|
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row"><br></div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-4 col-xs-12 field-title">Required:</div>
|
|
<div class="col-md-8 col-xs-12 field-input">
|
|
<label class="btn col-xs-5">
|
|
<input type="radio" ng-value="true" ng-model="field.required" name="required{{field._id}}"/>
|
|
<span> Yes</span>
|
|
</label>
|
|
|
|
<label class="btn col-xs-5 col-xs-offset-1">
|
|
<input type="radio" ng-value="false" ng-model="field.required" name="required{{field._id}}"/>
|
|
<span> No</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-4 col-xs-12 field-input">Disabled:</div>
|
|
<div class="col-md-8 col-xs-12 field-input">
|
|
<label class="btn col-xs-5">
|
|
<input type="radio" ng-value="true"
|
|
ng-model="field.disabled" name="disabled{{field._id}}"/>
|
|
<span> Yes</span>
|
|
</label>
|
|
|
|
<label class="btn col-xs-5 col-xs-offset-1">
|
|
<input type="radio" ng-value="false"
|
|
ng-model="field.disabled" name="disabled{{field._id}}"/>
|
|
<span> No</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- <div class="row"><br><hr></div>
|
|
|
|
<div class="row">
|
|
<div class="col-sm-4 col-sm-offset-4">
|
|
<button class="btn btn-primary btn-large" type="button" ng-click="update()">
|
|
<i class="icon-arrow-left icon-white"></i> Save Changes
|
|
</button>
|
|
</div>
|
|
</div> -->
|
|
</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-md-1 hidden-xs hidden-sm" style="padding:0 5px;" >
|
|
<div class="panel-group tool-panel text-center">
|
|
<div class="panel panel-default" ng-repeat="field in myform.form_fields" ng-if="!field.deletePreserved">
|
|
<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-md-1 hidden-xs hidden-sm" style="padding:0 5px;">
|
|
<div class="panel-group tool-panel text-center">
|
|
<div class="panel panel-default" ng-repeat="field in myform.form_fields" ng-if="!field.deletePreserved">
|
|
<div class="panel-heading" style="padding: 10px 10px; height: 37px;" ng-click="duplicateField($index)">
|
|
<span class="text-center">
|
|
<a href="" class="fa fa-files-o"></a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|