Skip to content

Commit

Permalink
#2045 Fix TTP modal's form validation
Browse files Browse the repository at this point in the history
  • Loading branch information
nadouani committed May 31, 2021
1 parent 5b025a8 commit 0abb682
Show file tree
Hide file tree
Showing 2 changed files with 99 additions and 78 deletions.
Original file line number Diff line number Diff line change
@@ -1,77 +1,77 @@
/**
* Controller for About TheHive modal page
*/
(function() {
(function () {
'use strict';

angular.module('theHiveControllers').controller('AddProcedureModalCtrl', function($rootScope, $scope, $uibModalInstance, NotificationSrv, ProcedureSrv, AttackPatternSrv, caseId) {
var self = this;
angular.module('theHiveControllers').controller('AddProcedureModalCtrl', function ($rootScope, $scope, $uibModalInstance, NotificationSrv, ProcedureSrv, AttackPatternSrv, caseId) {
var self = this;

this.caseId = caseId;
this.caseId = caseId;

this.close = function() {
$uibModalInstance.close();
};

this.cancel = function() {
if($rootScope.markdownEditorObjects.procedure) {
$rootScope.markdownEditorObjects.procedure.hidePreview();
}
this.close = function () {
$uibModalInstance.close();
};

$uibModalInstance.dismiss();
};
this.cancel = function () {
if ($rootScope.markdownEditorObjects && $rootScope.markdownEditorObjects.procedure) {
$rootScope.markdownEditorObjects.procedure.hidePreview();
}

this.addProcedure = function() {
self.state.loading = true;
$uibModalInstance.dismiss();
};

ProcedureSrv.create({
caseId: self.caseId,
tactic: self.procedure.tactic,
description: self.procedure.description,
patternId: self.procedure.patternId,
occurDate: self.procedure.occurDate
}).then(function(/*response*/) {
self.state.loading = false;
$uibModalInstance.close();
NotificationSrv.log('Tactic, Technique and Procedure added successfully', 'success');
}).catch(function(err) {
NotificationSrv.error('Add TTP', err.data, err.status);
self.state.loading = false;
});
};
this.addProcedure = function () {
self.state.loading = true;

this.showTechniques = function() {
AttackPatternSrv.getByTactic(self.procedure.tactic)
.then(function(techniques) {
self.state.techniques = techniques;
ProcedureSrv.create({
caseId: self.caseId,
tactic: self.procedure.tactic,
description: self.procedure.description,
patternId: self.procedure.patternId,
occurDate: self.procedure.occurDate
}).then(function (/*response*/) {
self.state.loading = false;
$uibModalInstance.close();
NotificationSrv.log('Tactic, Technique and Procedure added successfully', 'success');
}).catch(function (err) {
NotificationSrv.error('Add TTP', err.data, err.status);
self.state.loading = false;
});
};

self.procedure.patternId = null;
});
};
this.showTechniques = function () {
AttackPatternSrv.getByTactic(self.procedure.tactic)
.then(function (techniques) {
self.state.techniques = techniques;

this.$onInit = function() {
this.markdownEditorOptions = {
iconlibrary: 'fa',
addExtraButtons: true,
resize: 'vertical'
};
self.procedure.patternId = null;
});
};

this.procedure = {
tactic: null,
description: null,
patternId: null
};
this.$onInit = function () {
this.markdownEditorOptions = {
iconlibrary: 'fa',
addExtraButtons: true,
resize: 'vertical'
};

this.tactics = AttackPatternSrv.tactics;
this.procedure = {
tactic: null,
description: null,
patternId: null
};

this.state = {
loading: false,
selectedTactic: null,
techniques: null
};
this.tactics = AttackPatternSrv.tactics;

$scope.$broadcast('beforeProcedureModalShow');
this.state = {
loading: false,
selectedTactic: null,
techniques: null
};
}

$scope.$broadcast('beforeProcedureModalShow');
};
}
);
})();
Original file line number Diff line number Diff line change
@@ -1,38 +1,46 @@
<form class="procedureForm" class="procedure-modal" ng-submit="$modal.addProcedure()" novalidate>
<form name="procedureForm" class="procedure-modal" ng-submit="$modal.addProcedure()" novalidate>
<div class="modal-header bg-primary">
<h3 class="modal-title">Add Tactic, Technique and Procedure</h3>
</div>
<div class="modal-body">

<div class="row">
<div class="col-sm-6">
<div class="form-group" ng-class="{ 'has-error' : procedureForm.tactic.$invalid && !procedureForm.tactic.$pristine }">
<div class="form-group"
ng-class="{ 'has-error' : procedureForm.tactic.$invalid && !procedureForm.tactic.$pristine }">
<label>
Tactic
<i class="fa fa-asterisk text-danger"></i>
</label>
<select class="form-control" name="tactic" ng-model="$modal.procedure.tactic" autofocus="beforeProcedureModalShow"
ng-options="tactic as $modal.tactics.values[tactic].label for tactic in $modal.tactics.keys" required ng-change="$modal.showTechniques()">
<select class="form-control" name="tactic" ng-model="$modal.procedure.tactic"
autofocus="beforeProcedureModalShow"
ng-options="tactic as $modal.tactics.values[tactic].label for tactic in $modal.tactics.keys"
required ng-change="$modal.showTechniques()">
</select>
<p class="help-block" ng-show="procedureForm.tactic.$invalid && !procedureForm.tactic.$pristine">This field is required.</p>
<p class="help-block" ng-show="procedureForm.tactic.$invalid && !procedureForm.tactic.$pristine">
This field is required.</p>
</div>
</div>
<div class="col-sm-6">
<div class="form-group" ng-class="{ 'has-error' : procedureForm.occureDate.$invalid && !procedureForm.occureDate.$pristine }">
<div class="form-group"
ng-class="{ 'has-error' : procedureForm.occureDate.$invalid && !procedureForm.occureDate.$pristine }">
<label>
Occur Date
<i class="fa fa-asterisk text-danger"></i>
</label>
<div>
<date-time-picker date="$modal.procedure.occurDate" name="occurDate"></date-time-picker>
<p class="help-block" ng-show="procedureForm.occureDate.$invalid && !procedureForm.occureDate.$pristine">The field is required.</p>
<p class="help-block"
ng-show="procedureForm.occureDate.$invalid && !procedureForm.occureDate.$pristine">The field
is required.</p>
</div>
</div>
</div>
</div>


<div class="form-group" ng-class="{ 'has-error' : procedureForm.pattern.$invalid && !procedureForm.pattern.$pristine }">
<div class="form-group"
ng-class="{ 'has-error' : procedureForm.pattern.$invalid && !procedureForm.pattern.$pristine }">
<label>
Technique
<i class="fa fa-asterisk text-danger"></i>
Expand All @@ -43,35 +51,43 @@ <h3 class="modal-title">Add Tactic, Technique and Procedure</h3>
</div>

<div ng-show="$modal.procedure.tactic">
<input type="text" class="form-control mv-xxxs" placeholder="Filter techniques" ng-model="$modal.state.search">
<input type="hidden"ng-model="$modal.procedure.patternId" required>
<input type="text" class="form-control mv-xxxs" placeholder="Filter techniques"
ng-model="$modal.state.search">
<input type="hidden" ng-model="$modal.procedure.patternId" required>
<div class="procedure-techniques-list p-xxs">

<div ng-repeat="technique in $modal.state.techniques | filter:$modal.state.search">
<div class="procedure-techniques-item" ng-class="{'active': $modal.procedure.patternId === technique.patternId}"
<div class="procedure-techniques-item"
ng-class="{'active': $modal.procedure.patternId === technique.patternId}"
ng-click="$modal.procedure.patternId = technique.patternId">
<div class="radio">
<label class="procedure-technique" ng-class="{'sub-technique': technique.isSubTechnique}">
<input type="radio" name="pattern" ng-value="technique.patternId" ng-model="$modal.procedure.patternId">
<label class="procedure-technique"
ng-class="{'sub-technique': technique.isSubTechnique}">
<input type="radio" name="pattern" ng-value="technique.patternId"
ng-model="$modal.procedure.patternId">

<span ng-if="!!!technique.isSubTechnique">{{technique.patternId}} - {{technique.name}}</span>
<span ng-if="!!technique.isSubTechnique">{{technique.patternId}} - {{technique.extraData.parent.name}}:{{technique.name}}</span>
<span ng-if="!!!technique.isSubTechnique">{{technique.patternId}} -
{{technique.name}}</span>
<span ng-if="!!technique.isSubTechnique">{{technique.patternId}} -
{{technique.extraData.parent.name}}:{{technique.name}}</span>

<span class="pull-right ml-xxs">
<a href="{{technique.url}}" target="_blank">
<i class="fa fa-external-link"></i>
</a>
</span>
<span class="pull-right">
<i class="fa fa-question-circle" uib-tooltip="{{technique.description}}" tooltip-placement="left-center"></i>
<i class="fa fa-question-circle" uib-tooltip="{{technique.description}}"
tooltip-placement="left-center"></i>
</span>

</label>
</div>
</div>
</div>
</div>
<p class="help-block" ng-show="procedureForm.pattern.$invalid && !procedureForm.pattern.$pristine">This field is required.</p>
<p class="help-block" ng-show="procedureForm.pattern.$invalid && !procedureForm.pattern.$pristine">This
field is required.</p>
</div>


Expand All @@ -82,26 +98,31 @@ <h3 class="modal-title">Add Tactic, Technique and Procedure</h3>
<a href ng-click="$modal.showProcedure = true"><i class="fa fa-plus"></i> Add Procedure</a>
</div>

<div class="form-group" ng-if="$modal.showProcedure" ng-class="{ 'has-error' : procedureForm.description.$invalid && !procedureForm.description.$pristine }">
<div class="form-group" ng-if="$modal.showProcedure"
ng-class="{ 'has-error' : procedureForm.description.$invalid && !procedureForm.description.$pristine }">
<label>Procedure</label>
<div>
<div class="clearfix">
<a class="pull-right" href="https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet" target="_blank">
<a class="pull-right" href="https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet"
target="_blank">
<i class="fa fa-question-circle"></i> Markdown Reference
</a>
</div>

<textarea name="procedure" class="content-box" markdown-editor="$modal.markdownEditorOptions" rows="10"
ng-model="$modal.procedure.description" required></textarea>

<p class="help-block" ng-show="procedureForm.description.$invalid && !procedureForm.description.$pristine">This field is required.</p>
<p class="help-block"
ng-show="procedureForm.description.$invalid && !procedureForm.description.$pristine">This field is
required.</p>
</div>
</div>
</div>
<div class="modal-footer text-left">
<button class="btn btn-default" ng-click="$modal.cancel()" type="button">Cancel</button>

<button class="btn btn-primary pull-right" type="submit" ng-disabled="$modal.state.loading || procedureForm.$invalid">
<button class="btn btn-primary pull-right" type="submit"
ng-disabled="$modal.state.loading || procedureForm.$invalid">
Add TTP
</button>
</div>
Expand Down

0 comments on commit 0abb682

Please sign in to comment.