Commit 29b4dd1a authored by Vasyl Bodnaruk's avatar Vasyl Bodnaruk

add style for add job view

parent 41ec7f0a
...@@ -7,7 +7,6 @@ from django.utils.decorators import method_decorator ...@@ -7,7 +7,6 @@ from django.utils.decorators import method_decorator
from .models import Spider, Job from .models import Spider, Job
from .service import Service from .service import Service
from .periodic_task_creator import test
@method_decorator(login_required, name='post') @method_decorator(login_required, name='post')
...@@ -71,7 +70,6 @@ class NewJobCreateView(CreateView): ...@@ -71,7 +70,6 @@ class NewJobCreateView(CreateView):
query = request.POST.get('query') query = request.POST.get('query')
if query == 'j': if query == 'j':
query = '' query = ''
test()
Job.objects.create(name=name, spider=spider, query=query) Job.objects.create(name=name, spider=spider, query=query)
......
This source diff could not be displayed because it is too large. You can view the blob instead.
/*!
* Datetimepicker for Bootstrap 3
* version : 4.17.47
* https://github.com/Eonasdan/bootstrap-datetimepicker/
*/.bootstrap-datetimepicker-widget{list-style:none}.bootstrap-datetimepicker-widget.dropdown-menu{display:block;margin:2px 0;padding:4px;width:19em}@media (min-width:768px){.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs{width:38em}}@media (min-width:992px){.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs{width:38em}}@media (min-width:1200px){.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs{width:38em}}.bootstrap-datetimepicker-widget.dropdown-menu:before,.bootstrap-datetimepicker-widget.dropdown-menu:after{content:'';display:inline-block;position:absolute}.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #ccc;border-bottom-color:rgba(0,0,0,0.2);top:-7px;left:7px}.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after{border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid white;top:-6px;left:8px}.bootstrap-datetimepicker-widget.dropdown-menu.top:before{border-left:7px solid transparent;border-right:7px solid transparent;border-top:7px solid #ccc;border-top-color:rgba(0,0,0,0.2);bottom:-7px;left:6px}.bootstrap-datetimepicker-widget.dropdown-menu.top:after{border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid white;bottom:-6px;left:7px}.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before{left:auto;right:6px}.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after{left:auto;right:7px}.bootstrap-datetimepicker-widget .list-unstyled{margin:0}.bootstrap-datetimepicker-widget a[data-action]{padding:6px 0}.bootstrap-datetimepicker-widget a[data-action]:active{box-shadow:none}.bootstrap-datetimepicker-widget .timepicker-hour,.bootstrap-datetimepicker-widget .timepicker-minute,.bootstrap-datetimepicker-widget .timepicker-second{width:54px;font-weight:bold;font-size:1.2em;margin:0}.bootstrap-datetimepicker-widget button[data-action]{padding:6px}.bootstrap-datetimepicker-widget .btn[data-action="incrementHours"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Increment Hours"}.bootstrap-datetimepicker-widget .btn[data-action="incrementMinutes"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Increment Minutes"}.bootstrap-datetimepicker-widget .btn[data-action="decrementHours"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Decrement Hours"}.bootstrap-datetimepicker-widget .btn[data-action="decrementMinutes"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Decrement Minutes"}.bootstrap-datetimepicker-widget .btn[data-action="showHours"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Show Hours"}.bootstrap-datetimepicker-widget .btn[data-action="showMinutes"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Show Minutes"}.bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Toggle AM/PM"}.bootstrap-datetimepicker-widget .btn[data-action="clear"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Clear the picker"}.bootstrap-datetimepicker-widget .btn[data-action="today"]::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Set the date to today"}.bootstrap-datetimepicker-widget .picker-switch{text-align:center}.bootstrap-datetimepicker-widget .picker-switch::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Toggle Date and Time Screens"}.bootstrap-datetimepicker-widget .picker-switch td{padding:0;margin:0;height:auto;width:auto;line-height:inherit}.bootstrap-datetimepicker-widget .picker-switch td span{line-height:2.5;height:2.5em;width:100%}.bootstrap-datetimepicker-widget table{width:100%;margin:0}.bootstrap-datetimepicker-widget table td,.bootstrap-datetimepicker-widget table th{text-align:center;border-radius:4px}.bootstrap-datetimepicker-widget table th{height:20px;line-height:20px;width:20px}.bootstrap-datetimepicker-widget table th.picker-switch{width:145px}.bootstrap-datetimepicker-widget table th.disabled,.bootstrap-datetimepicker-widget table th.disabled:hover{background:none;color:#777;cursor:not-allowed}.bootstrap-datetimepicker-widget table th.prev::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Previous Month"}.bootstrap-datetimepicker-widget table th.next::after{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;content:"Next Month"}.bootstrap-datetimepicker-widget table thead tr:first-child th{cursor:pointer}.bootstrap-datetimepicker-widget table thead tr:first-child th:hover{background:#eee}.bootstrap-datetimepicker-widget table td{height:54px;line-height:54px;width:54px}.bootstrap-datetimepicker-widget table td.cw{font-size:.8em;height:20px;line-height:20px;color:#777}.bootstrap-datetimepicker-widget table td.day{height:20px;line-height:20px;width:20px}.bootstrap-datetimepicker-widget table td.day:hover,.bootstrap-datetimepicker-widget table td.hour:hover,.bootstrap-datetimepicker-widget table td.minute:hover,.bootstrap-datetimepicker-widget table td.second:hover{background:#eee;cursor:pointer}.bootstrap-datetimepicker-widget table td.old,.bootstrap-datetimepicker-widget table td.new{color:#777}.bootstrap-datetimepicker-widget table td.today{position:relative}.bootstrap-datetimepicker-widget table td.today:before{content:'';display:inline-block;border:solid transparent;border-width:0 0 7px 7px;border-bottom-color:#337ab7;border-top-color:rgba(0,0,0,0.2);position:absolute;bottom:4px;right:4px}.bootstrap-datetimepicker-widget table td.active,.bootstrap-datetimepicker-widget table td.active:hover{background-color:#337ab7;color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,0.25)}.bootstrap-datetimepicker-widget table td.active.today:before{border-bottom-color:#fff}.bootstrap-datetimepicker-widget table td.disabled,.bootstrap-datetimepicker-widget table td.disabled:hover{background:none;color:#777;cursor:not-allowed}.bootstrap-datetimepicker-widget table td span{display:inline-block;width:54px;height:54px;line-height:54px;margin:2px 1.5px;cursor:pointer;border-radius:4px}.bootstrap-datetimepicker-widget table td span:hover{background:#eee}.bootstrap-datetimepicker-widget table td span.active{background-color:#337ab7;color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,0.25)}.bootstrap-datetimepicker-widget table td span.old{color:#777}.bootstrap-datetimepicker-widget table td span.disabled,.bootstrap-datetimepicker-widget table td span.disabled:hover{background:none;color:#777;cursor:not-allowed}.bootstrap-datetimepicker-widget.usetwentyfour td.hour{height:27px;line-height:27px}.bootstrap-datetimepicker-widget.wider{width:21em}.bootstrap-datetimepicker-widget .datepicker-decades .decade{line-height:1.8em !important}.input-group.date .input-group-addon{cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}
\ No newline at end of file
{% extends 'base.html' %} {% extends 'base.html' %}
{% block content %} {% block content %}
<main class="pt-2 pb-5"> <main></main>
<div class="container"> <div class="container">
<form class="form" method="post"> <h2 class="display-4">New job</h2>
{% csrf_token %} <section class="mb-5 mt-5">
<section class="mb-5"> <!-- Name -->
<h5 class="offset-1 display-5 mb-2">New job</h5> <div class="form-group row">
<!-- Name --> <label for="name" class="offset-1 col-2 col-form-label"><strong>Name:</strong></label>
<div class="col-6">
<input class="form-control" type="text" placeholder="Name job..." id="name" name="name">
</div>
</div>
<div class="form-group row">
<label for="spider" class="offset-1 col-2 col-form-label"><strong>Spider:</strong></label>
<div class="col-6">
<select name="spider" id="spider" class="form-control">
<option value="1">MobileHealthNews</option>
<option value="2">Techcrunch</option>
</select>
</div>
</div>
<div class="form-group row">
<label for="name" class="offset-1 col-2 col-form-label"><strong>Date:</strong></label>
<div class="col-6">
<input class="form-control" type="text" placeholder="Select date" id="date" name="date">
</div>
</div>
<div class="form-group row">
<label for="name" class="offset-1 col-8 col-form-label"><strong>Interval:</strong></label>
<div class="offset-1 col-8 mt-4">
<div class="form-group row"> <div class="form-group row">
<label for="name" class="offset-1 col-2 col-form-label">Name</label> <div class="col-md-3">
<div class="col-6"> <label class="custom-control custom-radio">
<input class="form-control" type="text" placeholder="Name job..." id="name" name="name"> <input id="radio1" name="interval" type="radio" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Day</span>
</label>
</div> </div>
</div> <div class="col-md-3">
<div class="form-group row"> <label class="custom-control custom-radio">
<label for="spider" class="offset-1 col-2 col-form-label">Spider</label> <input id="radio2" name="interval" type="radio" class="custom-control-input">
<div class="col-6"> <span class="custom-control-indicator"></span>
<select name="spider" id="spider" class="form-control"> <span class="custom-control-description">Week</span>
{% for i in spiders %} </label>
<option value="{{ i.id }}">{{ i.name }}</option> </div>
{% endfor %} <div class="col-md-3">
</select> <label class="custom-control custom-radio">
<input id="radio3" name="interval" type="radio" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Month</span>
</label>
</div>
<div class="col-md-3">
<label class="custom-control custom-radio">
<input id="radio4" name="interval" type="radio" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">After finish</span>
</label>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label for="name" class="offset-1 col-2 col-form-label">SQL query</label> <div class="offset-md-9 col-md-1">
<div class="col-6"> <label for="count" class="col-form-label">Every:</label>
<input class="form-control" type="text" placeholder="Input query" id="query" name="query"> </div>
<div class="col-md-2">
<input class="form-control" type="text" placeholder="N" id="count" name="count">
</div> </div>
</div> </div>
</div>
</div>
<div class="form-group row">
<label for="name" class="offset-1 col-2 col-form-label"><strong>SQL query:</strong></label>
<div class="col-6">
<input class="form-control" type="text" placeholder="Input query" id="query" name="query">
</div>
</div>
<div class="form-group row"> <div class="form-group row">
<div class="offset-5 col-2"> <div class="offset-5 col-2">
<a class="form-control btn btn-danger" href="/job/">Cancel</a> <button type="submit" class="form-control btn btn-primary">Create</button>
</div>
<div class="col-2">
<a class="form-control btn btn-danger" href="/job/">Cancel</a>
</div>
</div>
</section>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="js/datetimepicker.js"></script>
<script>
$('#date').datetimepicker();
$('.custom-control').on('click', function() {
var input = $(this).find('input');
if (input.prop('id') === 'radio4') {
$('#count').val('').prop('disabled', true)
} else {
$('#count').val('').prop('disabled', false)
}
})
</div>
<div class="col-2 pull-right">
<button type="submit" class="form-control btn btn-primary">Create</button>
</div>
</div> // Only numbers on count
</section> $("#count").keydown(function (e) {
</form> // Allow: backspace, delete, tab, escape, enter and .
</div> if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
</main> // Allow: Ctrl+A, Command+A
(e.keyCode === 65 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: home, end, left, right, down, up
(e.keyCode >= 35 && e.keyCode <= 40)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
</script>
{% endblock %} {% endblock %}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment