<form name="futureTask" ng-submit="addNewFutureTask()">
    <div class="modal-header">
        <h3><span translate>complaints.comp.approvalRouting.future.task.modal.title</span></h3>
    </div>
    <div class="modal-body">
        <div class="well-sm">
            <div class="row">
                <div class="col-sm-6 form-group">
                    <label for="assignee" translate> complaints.comp.approvalRouting.future.task.modal.assignee </label>
                    <span class="required-asterisk">*</span>
                    <input type="text" id="assignee" ng-model="pickedUserName" class="input-md form-control"
                            placeholder="{{ 'complaints.userOrGroupSearch.search.placeholder' | translate }}" id="assignee"
                            style="background-color: white;" ng-click="userOrGroupSearch()" ng-required="true" readonly>
                </div>
                <div class="col-sm-6 form-group">
                    <label for="owningGroup" translate> complaints.comp.approvalRouting.future.task.modal.owningGroup </label>
                    <input type="text" id="owningGroup" ng-model="pickedGroupName"
                            class="input-md form-control ng-pristine ng-untouched ng-valid"
                            placeholder="{{ 'complaints.userOrGroupSearch.search.placeholder' | translate }}" id="owningGroup"
                            ng-required="false" ng-disabled="true" readonly>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-12 form-group">
                    <label for="subject" translate> complaints.comp.approvalRouting.future.task.modal.subject.label </label>
                    <span class="required-asterisk">*</span>
                    <input type="text" id="subject" ng-required="true" ng-model="futureTaskTitle" name="subject"
                            class="input-md form-control"
                            placeholder="{{ 'complaints.comp.approvalRouting.future.task.modal.subject.placeholder'  | translate }}"
                            id="subject">
                </div>
            </div>
            <div class="row">
                <div class="col-sm-12 form-group">
                    <label translate> complaints.comp.approvalRouting.future.task.modal.details.label </label>
                    <summernote config="options" ng-model="futureTaskDetails"></summernote>
                </div>
            </div>
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-secondary btn-sm" data-toggle="tooltip" data-title="Cancel" ng-click="cancelModal()">
            <span translate> complaints.comp.approvalRouting.future.task.modal.cancel.button </span>
        </button>
        <button type="submit" ng-disabled="futureTask.$invalid" class="btn btn-primary btn-sm" data-toggle="tooltip" id="saveButton"
                data-title="Save">
            <i class="fa fa-floppy-o" ng-hide="loading"></i>
            <i class="fa fa-circle-o-notch fa-spin" ng-show="loading"></i>
            <span translate> complaints.comp.approvalRouting.future.task.modal.save.button </span>
        </button>
    </div>
</form>