[前端]添加比后台比赛列表[CI SKIP]
This commit is contained in:
esp
252
static/src/js/app/admin/contest/add_contest.js
Normal file
252
static/src/js/app/admin/contest/add_contest.js
Normal file
@@ -0,0 +1,252 @@
|
|||||||
|
require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "datetimePicker",
|
||||||
|
"formValidation",],
|
||||||
|
function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) {
|
||||||
|
avalon.vmodels.add_contest = null;
|
||||||
|
$("#add-contest-form")
|
||||||
|
.formValidation({
|
||||||
|
framework: "bootstrap",
|
||||||
|
fields: {
|
||||||
|
name: {
|
||||||
|
validators: {
|
||||||
|
notEmpty: {
|
||||||
|
message: "请填写比赛名称"
|
||||||
|
},
|
||||||
|
stringLength: {
|
||||||
|
min: 1,
|
||||||
|
max: 30,
|
||||||
|
message: "名称不能超过30个字"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
description: {
|
||||||
|
validators: {
|
||||||
|
notEmpty: {
|
||||||
|
message: "请输入描述"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
start_time: {
|
||||||
|
validators: {
|
||||||
|
notEmpty: {
|
||||||
|
message: "请填写开始时间"
|
||||||
|
|
||||||
|
},
|
||||||
|
date: {
|
||||||
|
format: "YYYY-MM-DD h:m",
|
||||||
|
message: "请输入一个正确的日期格式"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
end_time: {
|
||||||
|
validators: {
|
||||||
|
notEmpty: {
|
||||||
|
message: "请填写结束时间"
|
||||||
|
},
|
||||||
|
date: {
|
||||||
|
format: "YYYY-MM-DD h:m",
|
||||||
|
message: "请输入一个正确的日期格式"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
password: {
|
||||||
|
validators: {
|
||||||
|
stringLength: {
|
||||||
|
min: 0,
|
||||||
|
max: 30,
|
||||||
|
message: "密码不能超过10个字符"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"problem_name[]": {
|
||||||
|
validators: {
|
||||||
|
notEmpty: {
|
||||||
|
message: "请输入题目名称"
|
||||||
|
},
|
||||||
|
stringLength: {
|
||||||
|
min: 1,
|
||||||
|
max: 30,
|
||||||
|
message: "题目不能超过30个字符"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"cpu[]": {
|
||||||
|
validators: {
|
||||||
|
notEmpty: {
|
||||||
|
message: "请输入时间限制"
|
||||||
|
},
|
||||||
|
integer: {
|
||||||
|
message: "时间限制用整数表示"
|
||||||
|
},
|
||||||
|
between: {
|
||||||
|
inclusive: true,
|
||||||
|
min: 1,
|
||||||
|
max: 5000,
|
||||||
|
message: "只能在1-5000之间"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"memory[]": {
|
||||||
|
validators: {
|
||||||
|
notEmpty: {
|
||||||
|
message: "请输入内存"
|
||||||
|
},
|
||||||
|
integer: {
|
||||||
|
message: "请输入一个合法的数字"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.on("success.form.fv", function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var data = {
|
||||||
|
title: vm.title,
|
||||||
|
description: vm.description,
|
||||||
|
start_time: vm.startTime,
|
||||||
|
end_time: vm.endTime,
|
||||||
|
password: vm.password,
|
||||||
|
mode: vm.model,
|
||||||
|
show_rank: vm.openRank
|
||||||
|
};
|
||||||
|
$.ajax({
|
||||||
|
beforeSend: csrfTokenHeader,
|
||||||
|
url: "/api/admin/contest/",
|
||||||
|
dataType: "json",
|
||||||
|
data: data,
|
||||||
|
method: "post",
|
||||||
|
contentType: "application/json",
|
||||||
|
success: function (data) {
|
||||||
|
if (!data.code) {
|
||||||
|
bsAlert("添加成功！");
|
||||||
|
console.log(data);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
bsAlert(data.data);
|
||||||
|
console.log(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
console.log(data);
|
||||||
|
});
|
||||||
|
function make_id() {
|
||||||
|
var text = "";
|
||||||
|
var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
|
||||||
|
for (var i = 0; i < 5; i++)
|
||||||
|
text += possible.charAt(Math.floor(Math.random() * possible.length));
|
||||||
|
return text;
|
||||||
|
}
|
||||||
|
var upLoaderInited = false;
|
||||||
|
editor("#editor");
|
||||||
|
|
||||||
|
var vm = avalon.define({
|
||||||
|
$id: "add_contest",
|
||||||
|
title: "",
|
||||||
|
problemCount: 0,
|
||||||
|
description: "",
|
||||||
|
startTime: "",
|
||||||
|
endTime: "",
|
||||||
|
password: "",
|
||||||
|
model: "",
|
||||||
|
openRank: false,
|
||||||
|
problems: [],
|
||||||
|
problemNo: "-1",
|
||||||
|
add_problem: function () {
|
||||||
|
var problem_id = make_id();
|
||||||
|
var problem = {
|
||||||
|
id: problem_id,
|
||||||
|
title: "",
|
||||||
|
cpu: 1000,
|
||||||
|
memory: 256,
|
||||||
|
description: "",
|
||||||
|
samples: [],
|
||||||
|
visible: true,
|
||||||
|
test_case_id: "",
|
||||||
|
testCaseList: [],
|
||||||
|
hint: "",
|
||||||
|
difficulty: 0,
|
||||||
|
uploadSuccess: false
|
||||||
|
};
|
||||||
|
vm.problems.push(problem);
|
||||||
|
var id = vm.problems.length - 1;
|
||||||
|
editor("#problem-" + problem_id + "-description");
|
||||||
|
var hinteditor = editor("#problem-" + problem_id +"-hint");
|
||||||
|
$("#add-contest-form").formValidation('addField', $('[name="problem_name[]"]'));
|
||||||
|
$("#add-contest-form").formValidation('addField', $('[name="cpu[]"]'));
|
||||||
|
$("#add-contest-form").formValidation('addField', $('[name="memory[]"]'));
|
||||||
|
},
|
||||||
|
del_problem: function (problem) {
|
||||||
|
if (confirm("你确定要删除么?")) {
|
||||||
|
vm.problems.remove(problem);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toggle: function (item) {
|
||||||
|
item.visible = !item.visible;
|
||||||
|
},
|
||||||
|
add_sample: function (problem) {
|
||||||
|
problem.samples.push({id: make_id(), visible: true, input: "", output: ""});
|
||||||
|
},
|
||||||
|
del_sample: function (problem, sample) {
|
||||||
|
if (confirm("你确定要删除么?")) {
|
||||||
|
problem.samples.remove(sample);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getBtnContent: function (item) {
|
||||||
|
if (item.visible)
|
||||||
|
return "折叠";
|
||||||
|
return "展开";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
uploader("#uploader", "/api/admin/test_case_upload/", function (file, respond) {
|
||||||
|
if (respond.code)
|
||||||
|
bsAlert(respond.data);
|
||||||
|
else {
|
||||||
|
var index = parseInt(vm.problemNo)-1;
|
||||||
|
vm.problems[index].test_case_id = respond.data.test_case_id;
|
||||||
|
vm.problems[index].uploadSuccess = true;
|
||||||
|
vm.problems[index].testCaseList = [];
|
||||||
|
for (var i = 0; i < respond.data.file_list.input.length; i++) {
|
||||||
|
vm.problems[index].testCaseList.push({
|
||||||
|
input: respond.data.file_list.input[i],
|
||||||
|
output: respond.data.file_list.output[i]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
bsAlert("测试数据添加成功！共添加"+vm.problems[index].testCaseList.length +"组测试数据");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
function(){
|
||||||
|
console.log(vm.problemNo);
|
||||||
|
if (vm.problemNo == "-1")
|
||||||
|
{
|
||||||
|
bsAlert("你还未指定一道题目！");
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
isUploaderInited = true;
|
||||||
|
|
||||||
|
avalon.scan();
|
||||||
|
|
||||||
|
$("#contest_start_time").datetimepicker({
|
||||||
|
format: "yyyy-mm-dd hh:ii",
|
||||||
|
minuteStep: 5,
|
||||||
|
weekStart: 1,
|
||||||
|
language: "zh-CN"
|
||||||
|
});
|
||||||
|
$("#contest_end_time").datetimepicker({
|
||||||
|
format: "yyyy-mm-dd hh:ii",
|
||||||
|
minuteStep: 5,
|
||||||
|
weekStart: 1,
|
||||||
|
language: "zh-CN"
|
||||||
|
});
|
||||||
|
$("#contest_start_time").datetimepicker()
|
||||||
|
.on("hide", function (ev) {
|
||||||
|
$("#add-contest-form")
|
||||||
|
.formValidation("revalidateField", "start_time");
|
||||||
|
});
|
||||||
|
$("#contest_end_time").datetimepicker()
|
||||||
|
.on("hide", function (ev) {
|
||||||
|
$("#add-contest-form")
|
||||||
|
.formValidation("revalidateField", "end_time");
|
||||||
|
});
|
||||||
|
});
|
||||||
87
static/src/js/app/admin/contest/contest_list.js
Normal file
87
static/src/js/app/admin/contest/contest_list.js
Normal file
@@ -0,0 +1,87 @@
|
|||||||
|
require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "datetimePicker"], function ($, avalon, csrfTokenHeader, bsAlert, editor) {
|
||||||
|
|
||||||
|
avalon.ready(function () {
|
||||||
|
if(avalon.vmodels.contestList){
|
||||||
|
vm = avalon.vmodels.contestList;
|
||||||
|
vm.editingContest = 0;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
var vm = avalon.define({
|
||||||
|
$id: "contestList",
|
||||||
|
contestList: [],
|
||||||
|
previousPage: 0,
|
||||||
|
nextPage: 0,
|
||||||
|
page: 1,
|
||||||
|
totalPage: 1,
|
||||||
|
keyword: "",
|
||||||
|
editingContestId: 0,
|
||||||
|
editTitle: "",
|
||||||
|
getNext: function () {
|
||||||
|
if (!vm.nextPage)
|
||||||
|
return;
|
||||||
|
getPageData(vm.page + 1);
|
||||||
|
},
|
||||||
|
getPrevious: function () {
|
||||||
|
if (!vm.previousPage)
|
||||||
|
return;
|
||||||
|
getPageData(vm.page - 1);
|
||||||
|
},
|
||||||
|
getBtnClass: function (btn) {
|
||||||
|
if (btn == "next") {
|
||||||
|
return vm.nextPage ? "btn btn-primary" : "btn btn-primary disabled";
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
return vm.previousPage ? "btn btn-primary" : "btn btn-primary disabled";
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getPage: function (page_index) {
|
||||||
|
getPageData(page_index);
|
||||||
|
},
|
||||||
|
showEditContestArea: function (contestId) {
|
||||||
|
if (contestId == vm.editingContestId)
|
||||||
|
vm.editingContestId = 0;
|
||||||
|
else {
|
||||||
|
vm.editingContestId = contestId;
|
||||||
|
vm.editTitle = vm.contestList[contestId-1].title;
|
||||||
|
editor("#editor").setValue(vm.contestList[contestId-1].description);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
getPageData(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getPageData(page) {
|
||||||
|
/*
|
||||||
|
var url = "/api/admin/contest/?paging=true&page=" + page + "&page_size=10";
|
||||||
|
if (vm.keyword != "")
|
||||||
|
url += "&keyword=" + vm.keyword;
|
||||||
|
$.ajax({
|
||||||
|
url: url,
|
||||||
|
dataType: "json",
|
||||||
|
method: "get",
|
||||||
|
success: function (data) {
|
||||||
|
if (!data.code) {
|
||||||
|
vm.contestList = data.data.results;
|
||||||
|
vm.totalPage = data.data.total_page;
|
||||||
|
vm.previousPage = data.data.previous_page;
|
||||||
|
vm.nextPage = data.data.next_page;
|
||||||
|
vm.page = page;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
bsAlert(data.data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
vm.contestList =[{id: 1, title:"The first contest", created_by: {username:"owen"}, description:"<p>this contest is just for<h1>fun</h1></p>"}];
|
||||||
|
vm.totalPage = 1;
|
||||||
|
vm.previousPage = false;
|
||||||
|
vm.nextPage = false;
|
||||||
|
vm.page = 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
avalon.scan();
|
||||||
|
});
|
||||||
96
template/admin/contest/contest_list.html
Normal file
96
template/admin/contest/contest_list.html
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
<div ms-controller="contestList" class="col-md-9">
|
||||||
|
<h1>比赛列表</h1>
|
||||||
|
|
||||||
|
<div class="right">
|
||||||
|
<form class="form-inline" onsubmit="return false;">
|
||||||
|
<div class="form-group-sm">
|
||||||
|
<label>搜索</label>
|
||||||
|
<input name="keyWord" class="form-control" placeholder="请输入关键词" ms-duplex="keyword">
|
||||||
|
<input type="submit" value="搜索" class="btn btn-primary" ms-click="getPage(1)">
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<br>
|
||||||
|
</div>
|
||||||
|
<table class="table table-striped">
|
||||||
|
<tr>
|
||||||
|
<th>ID</th>
|
||||||
|
<th>比赛</th>
|
||||||
|
<th>比赛类型</th>
|
||||||
|
<th>比赛模式</th>
|
||||||
|
<th>公开排名</th>
|
||||||
|
<th>开始时间</th>
|
||||||
|
<th>结束时间</th>
|
||||||
|
<th>创建时间</th>
|
||||||
|
<th>创建者</th>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr ms-repeat="contestList">
|
||||||
|
<td>{{ el.id }}</td>
|
||||||
|
<td>{{ el.title }}</td>
|
||||||
|
<td>{{ el.type }}</td>
|
||||||
|
<td>{{ el.mode }}</td>
|
||||||
|
<td>{{ el.show_rank }}</td>
|
||||||
|
<td>{{ el.start_time|date("yyyy-MM-dd HH:mm:ss")}}</td>
|
||||||
|
<td>{{ el.end_time|date("yyyy-MM-dd HH:mm:ss")}}</td>
|
||||||
|
<td>{{ el.create_time|date("yyyy-MM-dd HH:mm:ss")}}</td>
|
||||||
|
<td>{{ el.created_by.username }}</td>
|
||||||
|
<td>
|
||||||
|
<button class="btn-sm btn-info" ms-click="showEditContestArea($index+1)">详情</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
<div class="text-right">
|
||||||
|
页数：{{ page }}/{{ totalPage }}
|
||||||
|
<button ms-attr-class="getBtnClass('pre')" ms-click="getPrevious">上一页</button>
|
||||||
|
<button ms-attr-class="getBtnClass('next')" ms-click="getNext">下一页</button>
|
||||||
|
</div>
|
||||||
|
<div ms-visible="editingContestId">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<label>比赛名称</label>
|
||||||
|
<input type="text" name="name" class="form-control" ms-duplex="editTitle">
|
||||||
|
<label>说明</label>
|
||||||
|
<textarea id="editor" placeholder="这里输入内容" autofocus ms-duplex="editDescription"></textarea>
|
||||||
|
<small ms-visible="description==''" style="color:red">请填写比赛描述</small>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<label>开始时间</label>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<label>结束时间</label>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<input type="text" class="form-control" name="start_time" id="contest_start_time"
|
||||||
|
ms-duplex="editStartTime">
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<input type="text" class="form-control" name="editEnd_time" id="contest_end_time" ms-duplex="endTime">
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<label>密码保护</label>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-3">
|
||||||
|
<label>模式</label>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-3">
|
||||||
|
<label>结束前是否开放排名</label>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<input type="text" class="form-control" name="password" placeholder="留空就是公开赛" ms-duplex="editPassword">
|
||||||
|
</div>
|
||||||
|
<div class="col-md-3">
|
||||||
|
<label><input type="radio" name="mode" ms-duplex-checked="editMode">
|
||||||
|
<small>OI</small>
|
||||||
|
</label>
|
||||||
|
<label><input type="radio" name="mode">
|
||||||
|
<small>ACM</small>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-3">
|
||||||
|
<label class="text"><input type="checkbox" ms-duplex-checked="editShowRank">
|
||||||
|
<small>开放排名</small>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script src="/static/js/app/admin/contest/contest_list.js"></script>
|
||||||
Reference in New Issue
Block a user