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

[前端]修改比赛列表页面,添加了编辑比赛,编辑比赛题目[CI SKIP]

Browse Source
This commit is contained in:
esp
2015-08-23 17:44:52 +08:00
parent 018727ffbc
commit 2411968962
2 changed files with 380 additions and 248 deletions
Download Patch File Download Diff File Expand all files Collapse all files

363
static/src/js/app/admin/contest/contest_list.js
View File

@@ -1,93 +1,220 @@
require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "datetimePicker"], function ($, avalon, csrfTokenHeader, bsAlert, editor) {
require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "datetimePicker", "validator"], 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,
group: "-1",
groupList: [],
keyword: "",
editingContestId: 0,
editTitle: "",
editProblemList: [],
editPassword: "",
editStartTime: "",
editEndTime: "",
editMode: "",
editShowRank: false,
editShowSubmission: false,
editProblemList: [],
editingProblemId: 0,
editSamples: [],
editTestCaseList: [],
editChoseGroupList: [],
modelNameList: ["ACM", "AC总数", "分数"],
contestTypeNameList: ["小组赛", "公开赛", "有密码保护的公开赛"],
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;
vm.editEndTime = vm.contestList[contestId-1].end_time;
vm.editPassword = vm.contestList[contestId-1].password;
vm.editStartTime = vm.contestList[contestId-1].start_time;
vm.editMode = vm.contestList[contestId-1].mode;
vm.editChoseGroupList = [];
//= vm.contestList[contestId-1].group;//
/*for (var key in vm.contestList[contestId-1].groups){
var id = parseInt(vm.contestList[contestId-1].groups);
for ()
vm.editChoseGroupList.push({
name:vm.groupList[vm.group].name,
index:index,
id:parseInt(vm.contestList[contestId-1].groups)
});
}*/
vm.editShowRank = vm.contestList[contestId-1].show_rank;
vm.editShowSubmission = vm.contestList[contestId-1].show_user_submission;
//vm.editProblemList = vm.contestList[contestId-1].problems
editor("#editor").setValue(vm.contestList[contestId-1].description);
vm.editingProblemList = vm.contestList[contestId-1].problemList;
}
}
});
getPageData(1);
}
avalon.vmodels.contestList=null;
$("#edit-contest-form").validator().on('submit', function (e) {
if (!e.isDefaultPrevented()){
e.preventDefault();
var ajaxData = {
id: vm.contestList[vm.editingContestId-1].id,
title: vm.editTitle,
description: vm.editDescription,
mode: vm.editMode,
contest_type: 0,
show_rank: vm.editShowRank,
show_user_submission: vm.editShowSubmission,
start_time: vm.editStartTime,
end_time: vm.editEndTime,
visible: vm.editVisible
};
if (vm.choseGroupList.length == 0) {
bsAlert("你没有选择参赛用户!");
return false;
}
if (vm.choseGroupList[0].id == 0) //everyone | public contest
if (vm.password == "")
ajaxData.contest_type = 1;
else{
ajaxData.password = vm.password;
}
else { // Add groups info
ajaxData.groups = [];
for (var i = 0; vm.choseGroupList[i]; i++)
ajaxData.groups.push(parseInt(vm.choseGroupList[i].id))
}
console.log(ajaxData);
$.ajax({ // Add contest
beforeSend: csrfTokenHeader,
url: "/api/admin/contest/",
dataType: "json",
contentType: "application/json",
data: JSON.stringify(ajaxData),
method: "put",
contentType: "application/json",
success: function (data) {
if (!data.code) {
bsAlert("修改成功!");
console.log(data);
vm.getPage(1);
}
else {
bsAlert(data.data);
console.log(data);
}
}
});
console.log(JSON.stringify(ajaxData));
}
return false;
});
var vm = avalon.define({
$id: "contestList",
contestList: [],
previousPage: 0,
nextPage: 0,
page: 1,
totalPage: 1,
group: "-1",
groupList: [],
choseGroupList: [],
passwordUsable: false,
keyword: "",
editingContestId: 0,
editTitle: "",
editDescription: "",
editProblemList: [],
editPassword: "",
editStartTime: "",
editEndTime: "",
editMode: "",
editShowRank: false,
editShowSubmission: false,
editProblemList: [],
editVisible: false,
editChoseGroupList: [],
editingProblemContestIndex: 0,
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;
vm.editPassword = vm.contestList[contestId-1].password;
vm.editStartTime = vm.contestList[contestId-1].start_time.substring(0,16).replace("T"," ");
vm.editEndTime = vm.contestList[contestId-1].end_time.substring(0,16).replace("T"," ");
vm.editMode = vm.contestList[contestId-1].mode;
editVisible = vm.contestList[contestId-1].visible;
vm.editChoseGroupList = [];
for (var i = 0; i < vm.contestList[contestId-1].groups.length; i++){
var id = parseInt(vm.contestList[contestId-1].groups[i]);
var index = 0;
for (; vm.groupList[index]; index++) {
if (vm.groupList[index].id == id)
break;
}
vm.groupList[index].chose = true;
vm.choseGroupList.push({
name:vm.groupList[i].name,
index:index,
id:id
});
}
vm.editShowRank = vm.contestList[contestId-1].show_rank;
vm.editShowSubmission = vm.contestList[contestId-1].show_user_submission;
editor("#editor").setValue(vm.contestList[contestId-1].description);
vm.editingProblemContestIndex = 0;
}
},
showEditProblemArea: function(contestId) {
if (vm.editingProblemContestIndex == contestId) {
vm.editingProblemContestIndex = 0;
return;
}
if (vm.editingContestId&&!confirm("如果继续将丢失为保存的信息,是否继续?")){
return;
}
$.ajax({ // Get the problem list of current contest
beforeSend: csrfTokenHeader,
url: "/api/admin/contest_problem/?contest_id=" + vm.contestList[contestId-1].id,
method: "get",
dataType: "json",
success: function (data) {
if (!data.code) {
vm.editProblemList = data.data;
}
else {
bsAlert(data.data);
}
}
});
vm.editingContestId = 0;
vm.editingProblemContestIndex = contestId;
},
addGroup: function() {
if (vm.group == -1) return;
if (vm.groupList[vm.group].id == 0){
vm.passwordUsable = true;
vm.choseGroupList = [];
for (var key in vm.groupList){
vm.groupList[key].chose = true;
}
}
vm.groupList[vm.group]. chose = true;
vm.choseGroupList.push({name:vm.groupList[vm.group].name, index:vm.group, id:vm.groupList[vm.group].id});
vm.group = -1;
},
removeGroup: function(groupIndex){
if (vm.groupList[vm.choseGroupList[groupIndex].index].id == 0){
vm.passwordUsable = false;
for (key in vm.groupList){
vm.groupList[key].chose = false;
}
}
vm.groupList[vm.choseGroupList[groupIndex].index].chose = false;
vm.choseGroupList.remove(vm.choseGroupList[groupIndex]);
},
add_problem: function () {
vm.$fire("up!showContestProblemPage", 0, vm.contestList[vm.editingProblemContestIndex-1].id);
},
showProblemEditor: function(el) {
console.log(el);
vm.$fire("up!showContestProblemPage", el.id, vm.contestList[vm.editingProblemContestIndex-1].id);
}
});
getPageData(1);
vm.editingContestId = 0;
vm.editingProblemContestIndex = 0;
//init time picker
$("#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"
});
function getPageData(page) {
var url = "/api/admin/contest/?paging=true&page=" + page + "&page_size=10";
if (vm.keyword != "")
url += "&keyword=" + vm.keyword;
@@ -109,52 +236,44 @@ require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "datetimePicker"]
}
});
}
var isSuperAdmin = true;
$.ajax({ //用于获取该用户创建的所有小组的ajax请求
url: "/api/admin/group/",
// Get group list
$.ajax({ // Get current user type
url: "/api/user/",
method: "get",
dataType: "json",
success: function (data) {
if (!data.code) {
if (!data.data.length) {
bsAlert("您的用户权限只能创建组内比赛，但是您还没有创建过小组");
return;
if (data.data.admin_type == 2) { // Is super user
vm.isGlobal = true;
vm.groupList.push({id:0,name:"所有人",chose:false});
}
for (var i = 0; i < data.data.length; i++) {
var item = data.data[i];
item["chose"] = false;
vm.groupList.push(item);
$.ajax({ // Get the group list of current user
beforeSend: csrfTokenHeader,
url: "/api/admin/group/",
method: "get",
dataType: "json",
success: function (data) {
if (!data.code) {
if (!data.data.length) {
//bsAlert("您的用户权限只能创建组内比赛，但是您还没有创建过小组");
return;
}
for (var i = 0; i < data.data.length; i++) {
var item = data.data[i];
item["chose"] = false;
vm.groupList.push(item);
}
}
else {
bsAlert(data.data);
}
}
}
else {
bsAlert(data.data);
}
});
}
}
});
beforeSend: csrfTokenHeader,
url: url,
dataType: "json",
method: "get",
contentType: "application/json",
success: function (data) {
if (!data.code) {
if (isSuperAdmin)
vm.groupList.push({id:0, name:"所有人", chose: false});
for (var key in data.data) {
data.data[key].chose = false;
vm.groupList.push(data.data[key]);
}
}
else {
bsAlert(data.data);
console.log(data);
}
}
});
});
avalon.scan();
});

265
template/admin/contest/contest_list.html
View File

@@ -15,22 +15,23 @@
<tr>
<th>ID</th>
<th>比赛</th>
<th>比赛类型</th>
<th>公开排名</th>
<th>开始时间</th>
<th>结束时间</th>
<th>可见</th>
<th>创建时间</th>
<th>创建者</th>
<th></th>
</tr>
<tr ms-repeat="contestList" ms-click="showEditContestArea($index+1)">
<tr ms-repeat="contestList">
<td>{{ el.id }}</td>
<td>{{ el.title }}</td>
<td>{{ contestTypeNameList[el.contest_type] }}</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.visible }}</td>
<td>{{ el.create_time|date("yyyy-MM-dd HH:mm:ss")}}</td>
<td>{{ el.created_by.username }}</td>
<td>
<a class="btn btn-info" href="javascript:void(0)" ms-click="showEditContestArea($index+1)">编辑</a>
<a class="btn btn-primary" href="javascript:void(0)" ms-click="showEditProblemArea($index+1)">编辑问题</a>
</td>
</tr>
</table>
<div class="text-right">
@@ -39,130 +40,142 @@
<button ms-attr-class="getBtnClass('next')" ms-click="getNext">下一页</button>
</div>
<div ms-visible="editingContestId">
<div class="col-md-12">
<label>比赛名称</label>
</div>
<div class="col-md-12">
<div class="form-group">
<input type="text" name="name" class="form-control" ms-duplex="editTitle"
data-error="请填写比赛名称(名称不能超过50个字)" required>
<form id="edit-contest-form">
<div class="col-md-12">
<label>比赛名称</label>
</div>
<div class="col-md-12">
<div class="form-group">
<input type="text" name="name" class="form-control" ms-duplex="editTitle"
data-error="请填写比赛名称(名称不能超过50个字)" required>
<div class="help-block with-errors"></div>
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="col-md-12">
<label>说明</label>
</div>
<div class="col-md-12">
<div class="form-group">
<textarea id="editor" placeholder="这里输入内容" autofocus ms-duplex="editDescription"></textarea>
<div class="help-block with-errors"></div>
<small ms-visible="description==''" style="color:red">请填写比赛描述</small>
<div class="col-md-12">
<label>说明</label>
</div>
</div>
<div class="col-md-6">
<label>开始时间</label>
</div>
<div class="col-md-6">
<label>结束时间</label>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="text" class="form-control" name="start_time" id="contest_start_time"
ms-duplex="editStartTime" 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="editEndTime" 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-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.chose">{{el.name}}</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="text" class="form-control" name="password" placeholder="留空就是公开赛" ms-duplex="editPassword"
ms-attr-readonly="!passwordUsable">
</div>
</div>
<div class="col-md-12">
<div ms-repeat="choseGroupList" class="group-tag" ms-click="unchose($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-string="editMode" value="0">
<small>ACM</small>
</label>
<label><input type="radio" name="mode" ms-duplex-string="editMode" value="1">
<small>AC数量</small>
</label>
<label><input type="radio" name="mode" ms-duplex-string="editMode" 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="editShowRank">
<small>开放排名</small>
</label>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="text"><input type="checkbox" ms-duplex-checked="editShowSubmission">
<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>
<table class="table table-striped">
<tr>
<th>编号</th>
<th>题目</th>
<th>测试数据</th>
<td></td>
</tr>
<tr ms-repeat="editProblemList">
<td>题目{{ $index+1 }}</td>
<td>{{ el.title }}</td>
<td>{{ el.testCaseList.length }}组</td>
<td>
<a href="javascript:void(0)" class="btn-sm btn-info"
ms-click="showProblemEditArea($index+1)">编辑</a>
<a href="javascript:void(0)" class="btn-sm btn-danger" ms-click="del_problem($index+1)">删除</a>
</td>
</tr>
</table>
<div class="col-md-12">
<div class="form-group">
<textarea id="editor" placeholder="这里输入内容" autofocus ms-duplex="editDescription"></textarea>
</div>
<div class="help-block with-errors"></div>
<small ms-visible="editDescription==''" style="color:red">请填写比赛描述</small>
</div>
</div>
<div class="col-md-6">
<label>开始时间</label>
<div class="form-group">
<input type="text" class="form-control" name="start_time" id="contest_start_time"
ms-duplex="editStartTime" data-error="请填写比赛开始时间" required>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-md-6">
<label>结束时间</label>
<div class="form-group">
<input type="text" class="form-control" name="end_time" id="contest_end_time"
ms-duplex="editEndTime" data-error="请填写比赛结束时间" required>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-md-6">
<label>允许参加的用户</label>
<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.chose">{{el.name}}</option>
</select>
</div>
</div>
<div class="col-md-6" ms-visible="passwordUsable">
<label>密码保护</label>
<input type="text" class="form-control" name="password" placeholder="留空就是公开赛" ms-duplex="editPassword">
</div>
<div class="col-md-12">
<div ms-repeat="choseGroupList" class="group-tag" ms-click="removeGroup($index)">{{el.name}}</div>
</div>
<div class="col-md-6">
</div>
<div class="col-md-3">
</div>
<div class="col-md-3">
</div>
<div class="col-md-4">
<label>排名方式</label>
<div class="form-group">
<label><input type="radio" name="mode" ms-duplex-string="editMode" value="0">
<small>ACM</small>
</label>
<label><input type="radio" name="mode" ms-duplex-string="editMode" value="1">
<small>AC数量</small>
</label>
<label><input type="radio" name="mode" ms-duplex-string="editMode" value="2">
<small>分数</small>
</label>
</div>
</div>
<div class="col-md-2">
<label>是否可见</label><br>
<label><input type="checkbox" ms-duplex-checked="editVisible">
<small> 可见</small>
</label>
</div>
<div class="col-md-3">
<label>结束前是否开放排名</label>
<div class="form-group">
<label class="text"><input type="checkbox" ms-duplex-checked="editShowRank">
<small>开放排名</small>
</label>
</div>
</div>
<div class="col-md-3">
<label>是否公开提交记录</label>
<div class="form-group">
<label class="text"><input type="checkbox" ms-duplex-checked="editShowSubmission">
<small>允许查看提交记录</small>
</label>
</div>
</div>
<div class="col-md-12">
<button class="btn btn-primary" type="submit">保存修改</button>
</div>
</form>
</div>
<div class="col-md-12" ms-visible="editingProblemContestIndex">
<label>题目列表</label>
<a href="javascript:void(0)" class="btn btn-success btn-sm" ms-click="add_problem()">添加</a>
<table class="table table-striped">
<tr>
<th>编号</th>
<th>题目</th>
<th>创建时间</th>
<td></td>
</tr>
<tr ms-repeat="editProblemList">
<td>{{ el.sort_index }}</td>
<td>{{ el.title }}</td>
<td>{{ el.create_time|date("yyyy-MM-dd HH:mm:ss") }}</td>
<td>
<a href="javascript:void(0)" class="btn-sm btn-info"
ms-click="showProblemEditor(el)">编辑</a>
</td>
</tr>
</table>
</div>
</div>
<script src="/static/js/app/admin/contest/contest_list.js"></script>