docs/docs-web/src/main/webapp/src/partial/docs/settings.workflow.edit.html

<img src="img/loader.gif" ng-show="!workflow && isEdit()" />

<div ng-show="workflow || !isEdit()">
  <h2 ng-show="isEdit()" translate="settings.workflow.edit.edit_workflow_title" translate-values="{ name: workflow.name }"></h2>
  <h2 ng-show="!isEdit()" translate="settings.workflow.edit.add_workflow_title"></h2>

  <form class="form-horizontal" name="editWorkflowForm" novalidate>
    <div class="form-group" ng-class="{ 'has-error': !editWorkflowForm.name.$valid && editWorkflowForm.$dirty, success: editWorkflowForm.name.$valid }">
      <label class="col-sm-2 control-label" for="inputName">{{ 'settings.workflow.edit.name' | translate }}</label>
      <div class="col-sm-7">
        <input name="name" type="text" id="inputName" required class="form-control"
               ng-minlength="3" ng-maxlength="50" ng-attr-placeholder="{{ 'settings.workflow.edit.name' | translate }}" ng-model="workflow.name"/>
      </div>

      <div class="col-sm-3">
        <span class="help-block" ng-show="editWorkflowForm.name.$error.required && editWorkflowForm.$dirty">{{ 'validation.required' | translate }}</span>
        <span class="help-block" ng-show="editWorkflowForm.name.$error.minlength && editWorkflowForm.$dirty">{{ 'validation.too_short' | translate }}</span>
        <span class="help-block" ng-show="editWorkflowForm.name.$error.maxlength && editWorkflowForm.$dirty">{{ 'validation.too_long' | translate }}</span>
      </div>
    </div>

    <div ui-sortable="sortableOptions" ng-model="workflow.steps">
      <div class="panel panel-default" ng-repeat="step in workflow.steps">
        <div class="panel-body">
          <div class="row route-step-row">
            <div class="col-xs-1 text-center">
              <div class="glyphicon glyphicon-move pointer handle" ng-attr-title="{{ 'settings.workflow.edit.drag_help' | translate }}"></div>
            </div>
            <div class="col-xs-1 text-center">
              <div>{{ $index + 1 }}</div>
            </div>
            <div class="col-xs-10">
              <div class="row">
                <div class="col-xs-6 mb-10">
                  <strong>
                    {{ 'settings.workflow.edit.type' | translate }}
                    <span class="glyphicon glyphicon-info-sign"
                          uib-tooltip-html="'{{ 'settings.workflow.edit.target_help' | translate }}'"></span>
                  </strong>
                </div>
                <div class="col-xs-6">
                  <strong>{{ 'settings.workflow.edit.target' | translate }}</strong>
                </div>
              </div>
              <div class="row">
                <div class="col-xs-6">
                  <div class="input-group">
                    <span class="input-group-addon">
                      <span class="glyphicon glyphicon-transfer" ng-if="step.type == 'APPROVE'"></span>
                      <span class="glyphicon glyphicon-ok-circle" ng-if="step.type == 'VALIDATE'"></span>
                    </span>
                    <select class="form-control" name="type-{{ $index }}" ng-model="step.type" required>
                      <option value="APPROVE">{{ 'settings.workflow.edit.type_approve' | translate }}</option>
                      <option value="VALIDATE">{{ 'settings.workflow.edit.type_validate' | translate }}</option>
                    </select>
                  </div>
                </div>
                <div class="col-xs-6" ng-class="{ 'has-error': !editWorkflowForm['target-' + $index].$valid && editWorkflowForm.$dirty }">
                  <input required ng-maxlength="50" class="form-control" type="text" id="inputTarget"
                         ng-attr-placeholder="{{ 'directive.acledit.search_user_group' | translate }}" name="target-{{ $index }}" ng-model="step.target" autocomplete="off"
                         uib-typeahead="target as target.name for target in getTargetAclTypeahead($viewValue)"
                         typeahead-template-url="partial/docs/directive.typeahead.acl.html"
                         typeahead-editable="false"
                         typeahead-wait-ms="200" />
                </div>
              </div>
              <div class="row mt-10">
                <div class="col-xs-12" ng-class="{ 'has-error': !editWorkflowForm['name-' + $index].$valid && editWorkflowForm.$dirty }">
                  <textarea type="text"
                            class="form-control"
                            required
                            ng-maxlength="200"
                            name="name-{{ $index }}"
                            ng-model="step.name"
                            ng-attr-placeholder="{{ 'settings.workflow.edit.name_placeholder' | translate }}"></textarea>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-10 btn-link pointer" ng-click="addStep()">
        <span class="glyphicon glyphicon-plus-sign"></span> {{ 'settings.workflow.edit.add_step' | translate }}
      </div>
    </div>

    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-10">
        <button type="submit" class="btn btn-primary" ng-click="edit()" ng-disabled="!editWorkflowForm.$valid">
          <span class="glyphicon glyphicon-pencil"></span> {{ isEdit() ? 'save' : 'add' | translate }}
        </button>
        <button type="button" class="btn btn-danger" ng-click="remove()" ng-show="isEdit()">
          <span class="glyphicon glyphicon-trash"></span> {{ 'delete' | translate }}
        </button>
      </div>
    </div>
  </form>
</div>