Files
rengine/web/startScan/templates/organization/schedule_scan_ui.html
T
2021-08-28 18:03:48 +05:30

216 lines
8.8 KiB
HTML

{% extends 'base/base.html' %}
{% load static %}
{% block title %}
Schedule Scan for Organization
{% endblock title %}
{% block custom_js_css_link %}>
<link href="{% static 'assets/css/components/custom-list-group.css' %}" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="{% static 'assets/css/elements/alert.css' %}">
<link href="{% static 'assets/css/components/tabs/custom-tabs.css' %}" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="{% static 'plugins/bootstrap-select/bootstrap-select.min.css' %}">
<link href="{% static 'plugins/flatpickr/flatpickr.css' %}" rel="stylesheet" type="text/css">
<link href="{% static 'assets/css/components/tabs/custom-accordions.css' %}" rel="stylesheet" type="text/css" />
<link href="{% static 'plugins/jquery-step/jquery.steps.css' %}" rel="stylesheet" type="text/css" />
<link href="{% static 'plugins/select2/select2.min.css' %}" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="{% static 'assets/css/custom.css' %}">
{% endblock custom_js_css_link %}
{% block breadcrumb_title %}
<li class="breadcrumb-item"><a href="{% url 'list_organization' %}">Organization</a></li>
<li class="breadcrumb-item active">Schedule Scan</li>
<li class="breadcrumb-item active" aria-current="page">{{organization.name}}</li>
{% endblock breadcrumb_title %}
{% block main_content %}
<div class="statbox widget box box-shadow">
<div class="widget-header">
<div class="row">
<div class="col-12">
<h4>Schedule scan for organization <b>{{organization.name}}</b></h4>
</div>
</div>
</div>
<div class="widget-content widget-content-area">
<h6><span class="badge outline-badge-dark">{{ domain_list|length }}</span>&nbsp;&nbsp;Domains/Targets associated with organization <b>{{organization.name}}:</b></h6>
{% for domain in domain_list %}
<span class="badge badge-info m-1">{{domain.name}}</span>
{% endfor %}
<div class="mb-4">
</div>
<form method="POST" id="start-scan-form">
{% csrf_token %}
<div id="example-basic">
<h3>Choose the scheduler</h3>
<div class="">
<select class="form-control" data-width='100%' onchange="schedulerChanged(this)" name="scheduled_mode">
<option value="periodic">Periodic Scan</option>
<option value="clocked">Clocked Scan</option>
</select>
<div class="widget-content widget-content-area animated-underline-content">
<div class="tab-content" id="animateLineContent-4">
<div class="tab-pane fade show active" id="periodic-div" role="tabpanel" aria-labelledby="periodic-tab-tab">
<div class="mb-4">
<p>Run scan every</p>
<div class="row">
<div class='col-4'>
<input id="t-text" type="number" name="frequency" value="30" class="form-control">
</div>
<div class="col-8">
<select class="form-control basic" name="frequency_type" >
<option value="minutes">Minutes</option>
<option value="hours">Hours</option>
<option value="days">Days</option>
<option value="weeks">Weeks</option>
<option value="months">Months</option>
</select>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="clocked-div" role="tabpanel" aria-labelledby="clocked-tab-tab">
<div class="mb-4">
<p>Run scan exactly at</p>
<div class="row">
<div class="col-12">
<div class="form-group mb-0">
<input id="clockedTime" value="{% now "Y-m-d H:i" %}" class="form-control flatpickr flatpickr-input active" type="text" placeholder="Select Date and time" name="scheduled_time">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<h3>Choose Scan Engine</h3>
<div class="">
<div class="form-row">
<div class="col-md-12 mb-4">
<h6>Select Scan Engine</h6>
{% if custom_engine_count == 0 %}
<div class="alert custom-alert-1 mb-4" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" data-dismiss="alert" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x close"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg></button>
<div class="media">
<div class="alert-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path><path d="M13.73 21a2 2 0 0 1-3.46 0"></path></svg>
</div>
<div class="media-body">
<div class="alert-text">
<span><b>Tips! </b>You don't have any custom engines! Did you know you can create your own scan engine?</span>
</div>
<div class="alert-btn">./<sub></sub>
<a href="{% url 'add_engine' %}" class="btn btn-default btn-dismiss">Create Engine</a>
</div>
</div>
</div>
</div>
{% endif %}
{% include "startScan/_items/scanEngine_select.html" %}
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
{% endblock main_content %}
{% block page_level_script %}
<script src="{% static 'assets/js/scrollspyNav.js' %}"></script>
<script src="{% static 'plugins/bootstrap-select/bootstrap-select.min.js' %}"></script>
<script src="{% static 'plugins/flatpickr/flatpickr.js' %}"></script>
<script src="{% static 'plugins/jquery-step/jquery.steps.min.js' %}"></script>
<script src="{% static 'plugins/select2/select2.min.js' %}"></script>
<script type="text/javascript">
function schedulerChanged(selectObject){
selectedValue = selectObject.value;
if (selectedValue == 'periodic') {
var clockedDiv = document.getElementById("clocked-div");
clockedDiv.classList.remove("show");
clockedDiv.classList.remove("active");
var periodicDiv = document.getElementById("periodic-div");
periodicDiv.classList.add("show");
periodicDiv.classList.add("active");
}
else if (selectedValue == 'clocked') {
var periodicDiv = document.getElementById("periodic-div");
periodicDiv.classList.remove("show");
periodicDiv.classList.remove("active");
var clockedDiv = document.getElementById("clocked-div");
clockedDiv.classList.add("show");
clockedDiv.classList.add("active");
}
}
var buttonEnabled = true;
var globalTimeout = 0;
function disableNext(){
var nextButton = $(".actions ul li:nth-child(2) a");
nextButton.attr("href", "#");
buttonEnabled = $(".actions ul li:nth-child(2)").addClass("disabled").attr("aria-disabled", "true");
}
function enableNext(){
var nextButton = $(".actions ul li:nth-child(2) a");
nextButton.attr("href", "#next");
buttonEnabled = $(".actions ul li:nth-child(2)").removeClass("disabled").attr("aria-disabled", "false");
}
function updateButton(){
var text = $("input[type=radio][name=scan_mode]").val();
if(text === ''){
disableNext();
return false;
}else{
enableNext();
return true;
}
}
function initTimer() {
if (globalTimeout) clearTimeout(globalTimeout);
globalTimeout = setTimeout(updateButton, 400);
}
$(function(){
$("#example-basic").steps({
headerTag: "h3",
bodyTag: "div",
transitionEffect: "slide",
cssClass: 'pill wizard',
enableKeyNavigation: false,
onStepChanging: updateButton,
labels: {finish: "Start Scan"},
onInit :function (event, current) {
$(".actions ul li:nth-child(3) a").attr('onclick', `$(this).closest('form').submit()`);
flatpickr(document.getElementById('clockedTime'), {
enableTime: true,
dateFormat: "Y-m-d H:i",
});
$(".basic").select2({
minimumResultsForSearch: -1
});
},
onStepChanged: function (event, currentIndex, priorIndex) {
if (currentIndex == 1){
$("input[type=radio][name=scan_mode]").change(initTimer).keyup(initTimer);
disableNext();
}
}
});
});
</script>
{% endblock page_level_script %}