<div class="modal" ng-controller="SaveDecisionTableCtrl">
    <div class="modal-dialog">
        <div class="modal-content">
            <form name="decisionTableForm">
                <div class="modal-header"><h2>{{'DECISION-TABLE.POPUP.SAVE-DECISION-TABLE-TITLE' | translate}}</h2></div>
                <div class="modal-body">
                    <p>{{'DECISION-TABLE.POPUP.SAVE-DESCRIPTION' | translate}}</p>
                    <div ng-if="saveDialog.errorMessage && saveDialog.errorMessage.length > 0" class="alert error" style="font-size: 14px; margin-top:20px">
	                  <div class="popup-error" style="font-size: 14px">
	                    <span class="glyphicon glyphicon-remove-circle"></span>
	                    <span>{{saveDialog.errorMessage}}</span>
	                  </div>
	                </div>
                    <div class="form-group"  ng-class="{'has-error': decisionTableForm.name.$invalid}">
                        <label for="decisiontableName">{{'DECISION-TABLE.NAME' | translate}}</label>
                        <input ng-disabled="model.loading" type="text" class="form-control" name="name" ng-required="true"
                               id="decisiontableName" ng-model="saveDialog.name" maxlength="400" auto-focus editor-input-check>
                    </div>
                    <div class="form-group" ng-class="{'has-error': decisionTableForm.key.$invalid}">
                        <label for="decisiontableKey">{{'DECISION-TABLE.KEY' | translate}}</label>
                        <input ng-disabled="model.loading" type="text" class="form-control" name="key" maxlength="255" ng-required="true"
                               id="decisiontableKey" data-ng-trim="false" spaceless-value ng-model="saveDialog.key"
                               editor-input-check ng-pattern="keyFieldPattern" >
                    </div>
                    <div class="form-group">
                        <label for="decisiontableDescription">{{'DECISION-TABLE.DESCRIPTION' | translate}}</label>
                        <textarea ng-disabled="model.loading" class="form-control" id="decisiontableDescription" rows="5" ng-model="saveDialog.description"></textarea>
                    </div>
                    <div class="checkbox" ng-show="!error && !error.isConflict">
                        <label>
                            <input type="checkbox" ng-disabled="status.loading" ng-model="saveDialog.newVersion">
                            {{'MODEL.SAVE.NEWVERSION' | translate}}
                        </label>
                    </div>
                    <div class="form-group" ng-if="saveDialog.newVersion">
                        <label for="commentTextArea">{{'MODEL.SAVE.COMMENT' | translate}}</label>
                        <textarea id="commentTextArea" class="form-control" ng-model="saveDialog.comment" ng-disabled="status.loading"></textarea>
                    </div>
                    <div ng-if="saveDialog.validationErrors" class="alert error" style="font-size: 14px; margin-top:20px">
                        <div class="popup-error" style="font-size: 14px">
                            <span class="glyphicon glyphicon-remove-circle"></span>
                            <span translate="MODEL.VALIDATIONERRORS" translate-values="error"></span>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <div class="pull-right">
                        <button class="btn btn-sm btn-default" ng-click="cancel()" ng-disabled="model.loading" translate>GENERAL.ACTION.CANCEL</button>
                        <button class="btn btn-primary" ng-click="saveAndClose()" ng-disabled="status.loading || !decisionTableForm.$valid || readOnly" ng-show="!error && !error.isConflict" translate>ACTION.SAVE-AND-CLOSE</button>
                        <button class="btn btn-primary" ng-click="save()" ng-disabled="status.loading || !decisionTableForm.$valid || readOnly" ng-show="!error && !error.isConflict" translate>ACTION.SAVE</button>
                    </div>
                    <div class="loading pull-right" ng-show="model.loading">
                        <div class="l1"></div><div class="l2"></div><div class="l2"></div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>