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.
134 lines
7.3 KiB
134 lines
7.3 KiB
<div class="subheader editor-toolbar" id="editor-header">
|
|
<div class="fixed-container">
|
|
<div class="btn-group">
|
|
<div class="btn-toolbar pull-left" ng-controller="FormToolbarController" ng-cloak>
|
|
<button id="{{item.id}}"
|
|
title="{{item.title | translate}}"
|
|
ng-repeat="item in items"
|
|
ng-switch on="item.type"
|
|
class="btn btn-inverse" ng-class="{'separator': item.type == 'separator'}"
|
|
ng-disabled="item.type == 'separator' || item.enabled == false"
|
|
ng-click="toolbarButtonClicked($index)">
|
|
|
|
<i ng-switch-when="button" ng-class="item.cssClass" class="toolbar-button" data-toggle="tooltip"
|
|
title="{{item.title | translate}}"></i>
|
|
|
|
<div ng-switch-when="separator" ng-class="item.cssClass"></div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="btn-group pull-right" ng-show="!secondaryItems.length">
|
|
<div class="btn-toolbar pull-right" ng-controller="FormToolbarController">
|
|
<button title="{{item.title | translate}}" ng-repeat="item in secondaryItems track by $index"
|
|
ng-switch on="item.type" class="btn btn-inverse"
|
|
ng-class="{'separator': item.type == 'separator'}"
|
|
ng-disabled="item.type == 'separator'" ng-click="toolbarSecondaryButtonClicked($index)"
|
|
id="{{item.id}}">
|
|
<i ng-switch-when="button" ng-class="item.cssClass" class="toolbar-button" data-toggle="tooltip"
|
|
title="{{item.title | translate}}"></i>
|
|
|
|
<div ng-switch-when="separator" ng-class="item.cssClass"></div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="inset fixed-container form-palette" ng-mousedown="cancelEditing($event)">
|
|
<div class="col-sm-2" auto-height style="overflow: auto;">
|
|
<ul style="font-family: Arial, Regular;font-size: 17px;color: #323437;list-style: none;padding:0;">
|
|
<li class="stencil-item" ng-repeat="palletteElement in palletteElements"
|
|
class="palette-entry"
|
|
ng-model="draggedElement"
|
|
id="{{palletteElement.type}}"
|
|
title="{{palletteElement.title}}"
|
|
dnd-draggable="palletteElement"
|
|
dnd-type="'width-1'">
|
|
<img width="32" height="32" ng-src="{{palletteElement.icon}}"/>
|
|
{{palletteElement.title}}
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-sm-10" style="height:100%; overflow: auto;">
|
|
<div class="center-pane">
|
|
<div class="content">
|
|
<div class="header clearfix">
|
|
<h2>{{currentForm.name}}</h2>
|
|
|
|
<div class="pull-left badge-wrapper">
|
|
<span class="badge">{{'FORM-BUILDER.VERSION' | translate:currentForm}}</span>
|
|
<span> {{'FORM-BUILDER.LAST-UPDATED' | translate:currentForm}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="tabs-wrapper">
|
|
|
|
<div tab-control="tabs" active-tab="formBuilder.activeTab">
|
|
</div>
|
|
<div id="canvasSection" class="content-canvas-wrapper"
|
|
ng-show="formBuilder.activeTab == 'design'"
|
|
ng-class="{'editing': editState.editing}">
|
|
|
|
<ul style="min-height:400px; width: 100%"
|
|
class="form-canvas content-canvas"
|
|
dnd-list="formItems"
|
|
dnd-allowed-types="['width-1']"
|
|
dnd-drop="onFieldDrop(item, formItems, event, index)"
|
|
dnd-after-drop="afterDropField(item,formItems,event)">
|
|
<li ng-repeat="field in formItems track by field._guid" class="form-field-wrapper"
|
|
dnd-draggable="field"
|
|
dnd-effect-allowed="move"
|
|
dnd-type="'width-1'"
|
|
dnd-moved="onFieldMoved(field, formItems)">
|
|
<div draggable="true" id="{{field._guid}}" form-builder-element form-element="field" edit-state="editState"
|
|
drop="onFieldDrop(item, list, event, index)" moved="onFieldMoved(item, list)" class="canvas-element">
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div ng-show="formBuilder.activeTab == 'outcome'" class="detail-wrapper">
|
|
<div class="well">
|
|
<p>{{'FORM-BUILDER.OUTCOMES.DESCRIPTION' | translate}}</p>
|
|
|
|
<div class="radio">
|
|
<label>
|
|
<input type="radio" name="outcome" ng-value="false" ng-model="model.useOutcomes">
|
|
{{'FORM-BUILDER.OUTCOMES.NO-OUTCOMES-OPTION' | translate}}
|
|
</label>
|
|
</div>
|
|
<div class="radio">
|
|
<label>
|
|
<input type="radio" name="outcome" ng-value="true" ng-model="model.useOutcomes">
|
|
{{'FORM-BUILDER.OUTCOMES.OUTCOMES-OPTION' | translate}}
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div ng-if="model.useOutcomes">
|
|
<h4>{{'FORM-BUILDER.OUTCOMES.POSSIBLE-OUTCOMES' | translate}}</h4>
|
|
|
|
<div class="clearfix" ng-repeat="outcome in currentOutcomes track by $index"
|
|
style="margin-bottom:5px">
|
|
<div class="col-xs-8">
|
|
<input type="text" class="form-control"
|
|
placeholder="{{'FORM-BUILDER.OUTCOMES.NEW-OUTCOME-PLACEHOLDER' | translate}}"
|
|
ng-model="outcome.name">
|
|
</div>
|
|
<div class="col-xs-2">
|
|
<button style="width:110px" ng-show="$index > 0" class="btn btn-default"
|
|
ng-click="removeOutcome($index)">{{'FORM-BUILDER.OUTCOMES.REMOVE' | translate}}
|
|
</button>
|
|
</div>
|
|
<div class="col-xs-2">
|
|
<button style="width:110px" ng-show="($index + 1) === currentOutcomes.length"
|
|
class="btn btn-default" ng-click="addOutcome()">
|
|
{{'FORM-BUILDER.OUTCOMES.ADD' | translate}}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|