xuyue/OnlineJudge
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[前端]添加比赛页面进一步完善,添加字段包括是否显示提交,比赛模式,问题分值,允许参加比赛的用户组,并完善内部逻辑,基本可用了,只是没写ajax提交数据,和拉取小组信息的部分[CI SKIP]

Browse Source
This commit is contained in:
esp
2015-08-19 10:50:09 +08:00
parent 766fc20dbe
commit 78050548aa
3 changed files with 153 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
static/src/css/add_contest.css Normal file
View File

@@ -0,0 +1,5 @@
.group-tag {
padding-left: 5px; color: #46799b; background: #e0eaf1; white-space: nowrap;
overflow: hidden; cursor: pointer; border-radius: 2px 0 0 2px;
float: left; padding: 0 4px;box-sizing: border-box;list-style-type: none; margin: 5px;
}

135
static/src/js/app/admin/contest/add_contest.js
View File

@@ -3,44 +3,44 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) { function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) {
avalon.vmodels.add_contest = null; avalon.vmodels.add_contest = null;
$("#add-contest-form").validator().on('submit', function (e) { $("#add-contest-form").validator().on('submit', function (e) {
e.preventDefault(); if (!e.isDefaultPrevented()){
var data = { alert("smoething went wrong!");
title: vm.title, }
description: vm.description, else{
start_time: vm.startTime, var data = {
end_time: vm.endTime, title: vm.title,
password: vm.password, description: vm.description,
mode: vm.model, start_time: vm.startTime,
show_rank: vm.openRank end_time: vm.endTime,
}; password: vm.password,
$.ajax({ mode: vm.model,
beforeSend: csrfTokenHeader, show_rank: vm.openRank
url: "/api/admin/contest/", };
dataType: "json", $.ajax({
data: data, beforeSend: csrfTokenHeader,
method: "post", url: "/api/admin/contest/",
contentType: "application/json", dataType: "json",
success: function (data) { data: data,
if (!data.code) { method: "post",
bsAlert("添加成功！"); contentType: "application/json",
console.log(data); success: function (data) {
} if (!data.code) {
else { bsAlert("添加成功！");
bsAlert(data.data); console.log(data);
console.log(data); }
} else {
} bsAlert(data.data);
}); console.log(data);
console.log(data); }
}
});
console.log(data);
}
return false;
}) })
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;
}
editor("#editor"); editor("#editor");
editor("#problemDescriptionEditor");
editor("#problemHintEditor");
var vm = avalon.define({ var vm = avalon.define({
$id: "add_contest", $id: "add_contest",
@@ -49,27 +49,36 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
startTime: "", startTime: "",
endTime: "", endTime: "",
password: "", password: "",
model: "", mode: "",
openRank: false, showRank: false,
showSubmission: false,
problems: [], problems: [],
editingProblemId: 0, editingProblemId: 0,
editSamples: [], editSamples: [],
editTestCaseList: [], editTestCaseList: [],
group: "-1",
groupList: [{name:"Every one", id:1, choosed: false},{name:"Group one", id :3, choosed: false},{name:"Group two", id:5, choosed: false}],
choosedGroupList: [],
showProblemEditArea: function (problemIndex) { showProblemEditArea: function (problemIndex) {
if (vm.editingProblemId == problemIndex){ if (vm.editingProblemId == problemIndex){
vm.problems[vm.editingProblemId-1].samples = vm.editSamples; vm.problems[vm.editingProblemId-1].samples = vm.editSamples;
vm.editingProblemId = 0; vm.editingProblemId = 0;
} }
else { else {
vm.problems[problemIndex-1].samples = vm.editSamples; if (vm.editingProblemId)
vm.problems[problemIndex-1].testCaseList = vm.editTestCaseList; {
vm.editingProblemId = problemIndex; vm.problems[vm.editingProblemId-1].samples = vm.editSamples;
editSamples = vm.problems[vm.editingProblemId-1].samples; vm.problems[vm.editingProblemId-1].testCaseList = vm.editTestCaseList;
editTestCaseList = vm.problems[vm.editingProblemId-1].testCaseList; }
vm.editingProblemId = problemIndex;
vm.editSamples = [];
vm.editSamples = vm.problems[vm.editingProblemId-1].samples;
vm.editTestCaseList = [];
vm.editTestCaseList = vm.problems[vm.editingProblemId-1].testCaseList;
} }
}, },
passwordUsable: false,
add_problem: function () { add_problem: function () {
var problem_id = make_id();
var problem = { var problem = {
title: "", title: "",
timeLimit: 1000, timeLimit: 1000,
@@ -101,7 +110,6 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
item.visible = !item.visible; item.visible = !item.visible;
}, },
add_sample: function () { add_sample: function () {
//vm.problems[vm.editingProblemId-1].samples.push({visible: true, input: "", output: ""});
vm.editSamples.push({visible: true, input: "", output: ""}); vm.editSamples.push({visible: true, input: "", output: ""});
}, },
del_sample: function (sample) { del_sample: function (sample) {
@@ -113,7 +121,29 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
if (item.visible) if (item.visible)
return "折叠"; return "折叠";
return "展开"; return "展开";
} },
addGroup: function() {
if (vm.group == -1) return;
if (vm.groupList[vm.group].id == 1){
vm.passwordUsable = true;
vm.choosedGroupList = [];
for (var key in vm.groupList){
vm.groupList[key].choosed = true;
}
}
vm.groupList[vm.group]. choosed = true;
vm.choosedGroupList .push({name:vm.groupList[vm.group].name, index:vm.group, id:vm.groupList[vm.group].id});
},
unchoosed: function(groupIndex){
if (vm.groupList[vm.choosedGroupList[groupIndex].index].id == 1){
vm.passwordUsable = false;
for (key in vm.groupList){
vm.groupList[key].choosed = false;
}
}
vm.groupList[vm.choosedGroupList[groupIndex].index].choosed = false;
vm.choosedGroupList.remove(vm.choosedGroupList[groupIndex]);
}
}); });
uploader("#uploader", "/api/admin/test_case_upload/", function (file, respond) { uploader("#uploader", "/api/admin/test_case_upload/", function (file, respond) {
@@ -130,11 +160,10 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
}); });
} }
vm.problems[vm.editingProblemId-1].testCaseList = vm.editTestCaseList; vm.problems[vm.editingProblemId-1].testCaseList = vm.editTestCaseList;
bsAlert("测试数据添加成功！共添加"+editTestCaseList.length +"组测试数据"); bsAlert("测试数据添加成功！共添加"+vm.editTestCaseList.length +"组测试数据");
} }
}, },
function(){ function(){
console.log(vm.problemNo);
if (vm.editingProblemId == 0) if (vm.editingProblemId == 0)
{ {
bsAlert("你还未指定一道题目！"); bsAlert("你还未指定一道题目！");
@@ -157,14 +186,4 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
weekStart: 1, weekStart: 1,
language: "zh-CN" 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");
});
}); });

111
template/admin/contest/add_contest.html
View File

@@ -6,7 +6,9 @@
</div> </div>
<div class="col-md-12"> <div class="col-md-12">
<div class="form-group"> <div class="form-group">
<input type="text" name="name" class="form-control" ms-duplex="title"> <input type="text" name="name" class="form-control" ms-duplex="title"
data-error="请填写比赛名称(名称不能超过50个字)" required>
<div class="help-block with-errors"></div>
</div> </div>
</div> </div>
<div class="col-md-12"> <div class="col-md-12">
@@ -15,6 +17,7 @@
<div class="col-md-12"> <div class="col-md-12">
<div class="form-group"> <div class="form-group">
<textarea id="editor" placeholder="这里输入内容" autofocus ms-duplex="description"></textarea> <textarea id="editor" placeholder="这里输入内容" autofocus ms-duplex="description"></textarea>
<div class="help-block with-errors"></div>
<small ms-visible="description==''" style="color:red">请填写比赛描述</small> <small ms-visible="description==''" style="color:red">请填写比赛描述</small>
</div> </div>
</div> </div>
@@ -27,51 +30,75 @@
<div class="col-md-6"> <div class="col-md-6">
<div class="form-group"> <div class="form-group">
<input type="text" class="form-control" name="start_time" id="contest_start_time" <input type="text" class="form-control" name="start_time" id="contest_start_time"
ms-duplex="startTime"> ms-duplex="startTime" data-error="请填写比赛开始时间" required>
<div class="help-block with-errors"></div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="form-group"> <div class="form-group">
<input type="text" class="form-control" name="end_time" id="contest_end_time" ms-duplex="endTime"> <input type="text" class="form-control" name="end_time" id="contest_end_time"
ms-duplex="endTime" data-error="请填写比赛结束时间" required>
<div class="help-block with-errors"></div>
</div> </div>
</div> </div>
<div class="col-md-6">
<div class="col-md-6"> <label>允许参加的用户</label>
</div>
<div class="col-md-6" >
<label>密码保护</label> <label>密码保护</label>
</div> </div>
<div class="col-md-3"> <div class="col-md-6">
<label> <div class="form-group">
模式 <select class="form-control" name="password" ms-duplex="group" ms-change="addGroup" value="-1">
</label> <option value="-1">请选择</option>
</div> <option ms-repeat="groupList" ms-attr-value="$index" ms-visible="!el.choosed">{{el.name}}</option>
<div class="col-md-3"> </select>
<label> </div>
结束前是否开放排名
</label>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="form-group"> <div class="form-group">
<input type="text" class="form-control" name="password" placeholder="留空就是公开赛" ms-duplex="password"> <input type="text" class="form-control" name="password" placeholder="留空就是公开赛" ms-duplex="password" ms-attr-readonly="!passwordUsable">
</div> </div>
</div> </div>
<div class="col-md-12">
<div ms-repeat="choosedGroupList" class="group-tag" ms-click="unchoosed($index)">{{el.name}}</div>
</div>
<div class="col-md-6">
<label>排名方式</label>
</div>
<div class="col-md-3"> <div class="col-md-3">
<label>结束前是否开放排名</label>
</div>
<div class="col-md-3">
<label>是否公开提交记录</label>
</div>
<div class="col-md-6">
<div class="form-group"> <div class="form-group">
<label><input type="radio" name="mode" ms-duplex-checked="model"> <label><input type="radio" name="mode" ms-duplex-string="mode" value="0">
<small>OI</small>
</label>
<label><input type="radio" name="mode">
<small>ACM</small> <small>ACM</small>
</label> </label>
<label><input type="radio" name="mode" ms-duplex-string="mode" value="1">
<small>AC数量</small>
</label>
<label><input type="radio" name="mode" ms-duplex-string="mode" value="2">
<small>分数</small>
</label>
</div> </div>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<div class="form-group"> <div class="form-group">
<label class="text"><input type="checkbox" ms-duplex-checked="openRank"> <label class="text"><input type="checkbox" ms-duplex-checked="showRank">
<small>开放排名</small> <small>开放排名</small>
</label> </label>
</div> </div>
</div> </div>
<div class="col-md-3">
<div class="form-group">
<label class="text"><input type="checkbox" ms-duplex-checked="showSbumission">
<small>允许查看提交记录</small>
</label>
</div>
</div>
<div class="col-md-12"> <div class="col-md-12">
<label>添加题目</label> <label>添加题目</label>
<a href="javascript:void(0)" class="btn btn-primary btn-sm" ms-click="add_problem()">添加</a> <a href="javascript:void(0)" class="btn btn-primary btn-sm" ms-click="add_problem()">添加</a>
@@ -100,17 +127,14 @@
<div class="panel panel-default problem-panel"> <div class="panel panel-default problem-panel">
<div class="panel-heading"> <div class="panel-heading">
<span class="panel-title">题目{{editingProblemId}} </span> <span class="panel-title">题目{{editingProblemId}} </span>
<a href="javascript:void(0)" class="btn btn-primary btn-sm" ms-click="hidden()"> <a href="javascript:void(0)" class="btn btn-primary btn-sm" ms-click="hidden()">隐藏</a>
隐藏 <a href="javascript:void(0)" class="btn btn-danger btn-sm" ms-click="del_problem(editingProblemId)">删除</a>
</a>
<a href="javascript:void(0)" class="btn btn-danger btn-sm" ms-click="del_problem(editingProblemId)">
删除
</a>
</div> </div>
<div class="panel-body" > <div class="panel-body" >
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>题目标题</label> <label>题目标题</label>
<input type="text" name="problemName" class="form-control" ms-duplex="problems[editingProblemId-1].title"> <input type="text" name="problemName" class="form-control" ms-duplex="problems[editingProblemId-1].title"data-error="请填写题目标题" required>
<div class="help-block with-errors"></div>
</div> </div>
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>题目描述</label> <label>题目描述</label>
@@ -125,15 +149,18 @@
</div> </div>
<div class="col-md-3 form-group"> <div class="col-md-3 form-group">
<label>cpu</label> <label>cpu</label>
<input type="number" class="form-control" ms-duplex="problems[editingProblemId-1].timeLimit"> <input type="number" class="form-control" ms-duplex="problems[editingProblemId-1].timeLimit" data-error="请填写时间限制" required>
<div class="help-block with-errors"></div>
</div> </div>
<div class="col-md-3 form-group"> <div class="col-md-3 form-group">
<label>内存</label> <label>内存</label>
<input type="number" class="form-control" ms-duplex="problems[editingProblemId-1].memoryLimit"> <input type="number" class="form-control" ms-duplex="problems[editingProblemId-1].memoryLimit" data-error="请填写内存限制" required>
<div class="help-block with-errors"></div>
</div> </div>
<div class="col-md-3 form-group"> <div class="col-md-3 form-group" ms-visible="mode==2">
<label>分值</label> <label>分值</label>
<input type="number" class="form-control" ms-duplex="problems[editingProblemId-1].score"> <input type="number" class="form-control" ms-duplex="problems[editingProblemId-1].score" data-error="请填写题目分值" required>
<div class="help-block with-errors"></div>
</div> </div>
<div class="col-md-12"> <div class="col-md-12">
<label>样例</label> <label>样例</label>
@@ -168,14 +195,9 @@
</div> </div>
</div> </div>
<div class="col-md-12"> <div class="col-md-12">
<label>上传测试测试数据</label>
<div id="uploader"> <label>测试数据</label>
<div>选择文件</div> <table class="table table-striped">
</div>
<small class="text-info">请将所有测试用例打包在一个文件中上传，所有文件要在压缩包的根目录，且输入输出文件名要以从1开始连续数字标识要对应例如：<br>
1.in 1.out 2.in 2.out
</small>
<table class="table table-striped" ms-visible="problems[editingProblemId-1].uploadSuccess">
<tr> <tr>
<td>编号</td> <td>编号</td>
<td>输入文件名</td> <td>输入文件名</td>
@@ -193,6 +215,14 @@
</div> </div>
</div> </div>
<div class="col-md-12"> <div class="col-md-12">
<label>上传测试测试数据</label>
<div id="uploader">
<div>选择文件</div>
</div>
<small class="text-info">请将所有测试用例打包在一个文件中上传，所有文件要在压缩包的根目录，且输入输出文件名要以从1开始连续数字标识要对应例如：<br>
1.in 1.out 2.in 2.out
</small><br>
<input type="submit" class="btn btn-success btn-lg" value="发布比赛"> <input type="submit" class="btn btn-success btn-lg" value="发布比赛">
</div> </div>
</div> </div>
@@ -201,3 +231,4 @@
</div> </div>
<script src="/static/js/app/admin/contest/add_contest.js"></script> <script src="/static/js/app/admin/contest/add_contest.js"></script>
<link href="/static/css/add_contest.css" rel="stylesheet">