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;
}

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

@@ -3,7 +3,10 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) {
avalon.vmodels.add_contest = null;
$("#add-contest-form").validator().on('submit', function (e) {
e.preventDefault();
if (!e.isDefaultPrevented()){
alert("smoething went wrong!");
}
else{
var data = {
title: vm.title,
description: vm.description,
@@ -32,15 +35,12 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
}
});
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;
}
return false;
})
editor("#editor");
editor("#problemDescriptionEditor");
editor("#problemHintEditor");
var vm = avalon.define({
$id: "add_contest",
@@ -49,27 +49,36 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
startTime: "",
endTime: "",
password: "",
model: "",
openRank: false,
mode: "",
showRank: false,
showSubmission: false,
problems: [],
editingProblemId: 0,
editSamples: [],
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) {
if (vm.editingProblemId == problemIndex){
vm.problems[vm.editingProblemId-1].samples = vm.editSamples;
vm.editingProblemId = 0;
}
else {
vm.problems[problemIndex-1].samples = vm.editSamples;
vm.problems[problemIndex-1].testCaseList = vm.editTestCaseList;
if (vm.editingProblemId)
{
vm.problems[vm.editingProblemId-1].samples = vm.editSamples;
vm.problems[vm.editingProblemId-1].testCaseList = vm.editTestCaseList;
}
vm.editingProblemId = problemIndex;
editSamples = vm.problems[vm.editingProblemId-1].samples;
editTestCaseList = vm.problems[vm.editingProblemId-1].testCaseList;
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 () {
var problem_id = make_id();
var problem = {
title: "",
timeLimit: 1000,
@@ -101,7 +110,6 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
item.visible = !item.visible;
},
add_sample: function () {
//vm.problems[vm.editingProblemId-1].samples.push({visible: true, input: "", output: ""});
vm.editSamples.push({visible: true, input: "", output: ""});
},
del_sample: function (sample) {
@@ -113,6 +121,28 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
if (item.visible)
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]);
}
});
@@ -130,11 +160,10 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
});
}
vm.problems[vm.editingProblemId-1].testCaseList = vm.editTestCaseList;
bsAlert("测试数据添加成功！共添加"+editTestCaseList.length +"组测试数据");
bsAlert("测试数据添加成功！共添加"+vm.editTestCaseList.length +"组测试数据");
}
},
function(){
console.log(vm.problemNo);
if (vm.editingProblemId == 0)
{
bsAlert("你还未指定一道题目！");
@@ -157,14 +186,4 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "date
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");
});
});

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

@@ -6,7 +6,9 @@
</div>
<div class="col-md-12">
<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 class="col-md-12">
@@ -15,6 +17,7 @@
<div class="col-md-12">
<div class="form-group">
<textarea id="editor" placeholder="这里输入内容" autofocus ms-duplex="description"></textarea>
<div class="help-block with-errors"></div>
<small ms-visible="description==''" style="color:red">请填写比赛描述</small>
</div>
</div>
@@ -27,51 +30,75 @@
<div class="col-md-6">
<div class="form-group">
<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 class="col-md-6">
<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 class="col-md-6">
<label>允许参加的用户</label>
</div>
<div class="col-md-6" >
<label>密码保护</label>
</div>
<div class="col-md-3">
<label>
模式
</label>
<div class="col-md-6">
<div class="form-group">
<select class="form-control" name="password" ms-duplex="group" ms-change="addGroup" value="-1">
<option value="-1">请选择</option>
<option ms-repeat="groupList" ms-attr-value="$index" ms-visible="!el.choosed">{{el.name}}</option>
</select>
</div>
<div class="col-md-3">
<label>
结束前是否开放排名
</label>
</div>
<div class="col-md-6">
<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 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">
<label>结束前是否开放排名</label>
</div>
<div class="col-md-3">
<label>是否公开提交记录</label>
</div>
<div class="col-md-6">
<div class="form-group">
<label><input type="radio" name="mode" ms-duplex-checked="model">
<small>OI</small>
</label>
<label><input type="radio" name="mode">
<label><input type="radio" name="mode" ms-duplex-string="mode" value="0">
<small>ACM</small>
</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 class="col-md-3">
<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>
</label>
</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">
<label>添加题目</label>
<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-heading">
<span class="panel-title">题目{{editingProblemId}} </span>
<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 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>
</div>
<div class="panel-body" >
<div class="form-group col-md-12">
<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 class="form-group col-md-12">
<label>题目描述</label>
@@ -125,15 +149,18 @@
</div>
<div class="col-md-3 form-group">
<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 class="col-md-3 form-group">
<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 class="col-md-3 form-group">
<div class="col-md-3 form-group" ms-visible="mode==2">
<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 class="col-md-12">
<label>样例</label>
@@ -168,14 +195,9 @@
</div>
</div>
<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>
<table class="table table-striped" ms-visible="problems[editingProblemId-1].uploadSuccess">
<label>测试数据</label>
<table class="table table-striped">
<tr>
<td>编号</td>
<td>输入文件名</td>
@@ -193,6 +215,14 @@
</div>
</div>
<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="发布比赛">
</div>
</div>
@@ -201,3 +231,4 @@
</div>
<script src="/static/js/app/admin/contest/add_contest.js"></script>
<link href="/static/css/add_contest.css" rel="stylesheet">