107 lines
6.9 KiB
HTML
107 lines
6.9 KiB
HTML
{% extends 'base.html' %}
|
||
{% load static %}
|
||
{% block tittle %}登陆{% endblock tittle %}
|
||
{% block body %}
|
||
<section class="spotlight parallax bg-cover bg-size--cover" data-spotlight="fullscreen" style="background-image: url('{% static 'images/backgrounds/img-1.jpg' %}')">
|
||
<span class="mask bg-primary alpha-7"></span>
|
||
<div class="spotlight-holder py-lg pt-lg-xl" style="height: auto;">
|
||
<div class="container align-items-center no-padding">
|
||
<div class="col">
|
||
<div class="row cols-xs-space align-items-center text-center text-md-left justify-content-center">
|
||
<div class="col-7">
|
||
<div class="text-center mt-5">
|
||
<img src="{% static 'images/brand/icon.png' %}" style="width: 80px;" class="img-fluid animated" data-animation-in="jackInTheBox" data-animation-delay="1000">
|
||
<h2 class="heading display-4 font-weight-400 text-white mt-5 animated" data-animation-in="fadeInUp" data-animation-delay="2000">
|
||
贡献题目
|
||
</h2>
|
||
<form id="createForm" onsubmit="event.preventDefault(); submitForm();" enctype="multipart/form-data">
|
||
{% csrf_token %}
|
||
<div class="form-group">
|
||
<label>题目文本</label>
|
||
<textarea id="text" name="text" required class="form-control" placeholder="请输入题目文本，不超过300字" rows="4"></textarea>
|
||
</div>
|
||
<input type="file" name="image" id="image" accept="image/*" onchange="imgChange(this);" class="custom-input-file"/>
|
||
<label for="image">
|
||
<svg class="svg-inline--fa fa-upload fa-w-16" aria-hidden="true" data-prefix="fa" data-icon="upload" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M296 384h-80c-13.3 0-24-10.7-24-24V192h-87.7c-17.8 0-26.7-21.5-14.1-34.1L242.3 5.7c7.5-7.5 19.8-7.5 27.3 0l152.2 152.2c12.6 12.6 3.7 34.1-14.1 34.1H320v168c0 13.3-10.7 24-24 24zm216-8v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h136v8c0 30.9 25.1 56 56 56h80c30.9 0 56-25.1 56-56v-8h136c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z"></path></svg><!-- <i class="fa fa-upload"></i> -->
|
||
<span>上传附图</span>
|
||
</label>
|
||
<img id="image-preview" width="50%" src=""/><br>
|
||
<div class="input-group mb-4">
|
||
<input type="text" id="a" name="a" class="form-control" placeholder="A选项文本" required>
|
||
</div>
|
||
<div class="input-group mb-4">
|
||
<input type="text" id="b" name="b" class="form-control" placeholder="B选项文本" required>
|
||
</div>
|
||
<div class="input-group mb-4">
|
||
<input type="text" id="c" name="c" class="form-control" placeholder="C选项文本" required>
|
||
</div>
|
||
<div class="input-group mb-4">
|
||
<input type="text" id="d" name="d" class="form-control" placeholder="D选项文本" required>
|
||
</div>
|
||
<div class="card col-lg-12">
|
||
<div class="card-body">
|
||
<h5 class="mb-4">答案</h5>
|
||
<div class="custom-control custom-radio mb-3">
|
||
<input type="radio" name="answer" class="custom-control-input" id="ans_A" value="A" checked>
|
||
<label class="custom-control-label" for="ans_A">------A------</label>
|
||
</div>
|
||
<div class="custom-control custom-radio mb-3">
|
||
<input type="radio" name="answer" class="custom-control-input" id="ans_B" value="B">
|
||
<label class="custom-control-label" for="ans_B">------B------</label>
|
||
</div>
|
||
<div class="custom-control custom-radio mb-3">
|
||
<input type="radio" name="answer" class="custom-control-input" id="ans_C" value="C">
|
||
<label class="custom-control-label" for="ans_C">------C------</label>
|
||
</div>
|
||
<div class="custom-control custom-radio mb-3">
|
||
<input type="radio" name="answer" class="custom-control-input" id="ans_D" value="D">
|
||
<label class="custom-control-label" for="ans_D">------D------</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="input-group mb-4">
|
||
<button type="submit" class="btn btn-block btn-primary">提交</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
{% endblock body %}
|
||
|
||
{% block script %}
|
||
<script>
|
||
|
||
function imgChange(obj) {
|
||
var file = document.getElementById("image");
|
||
var imgUrl = window.URL.createObjectURL(file.files[0]);
|
||
var img = document.getElementById('image-preview');
|
||
img.setAttribute('src', imgUrl); // 修改img标签src属性值
|
||
};
|
||
|
||
function submitForm() {
|
||
var formData = new FormData($('#createForm')[0]);
|
||
$.ajax({
|
||
url: "{% url 'exam:create' %}", // Django模板标签，用于生成URL
|
||
type: "POST",
|
||
data: formData,
|
||
contentType: false, // 告诉jQuery不要设置Content-Type请求头
|
||
processData: false, // 告诉jQuery不要处理发送的数据
|
||
success: function(response) {
|
||
if (response.code === 200) {
|
||
alert(response.message); // 成功时的消息框
|
||
window.location.reload();
|
||
} else {
|
||
alert(response.message); // 显示错误信息
|
||
}
|
||
},
|
||
error: function() {
|
||
alert("提交失败");
|
||
}
|
||
});
|
||
}
|
||
</script>
|
||
{% endblock script %} |