后台使用封装好的 web 组件

This commit is contained in:
virusdefender
2015-10-18 11:13:44 +08:00
parent 50880e1f36
commit ad73a36944
9 changed files with 86 additions and 94 deletions

View File

@@ -1,10 +1,7 @@
require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "validator", "pager"], require(["jquery", "avalon", "csrfToken", "bsAlert", "validator", "pager", "editorComponent"],
function ($, avalon, csrfTokenHeader, bsAlert, editor) { function ($, avalon, csrfTokenHeader, bsAlert, editor) {
avalon.ready(function () { avalon.ready(function () {
var createAnnouncementEditor = editor("#create-announcement-editor");
var editAnnouncementEditor = editor("#edit-announcement-editor");
if (avalon.vmodels.announcement){ if (avalon.vmodels.announcement){
var vm = avalon.vmodels.announcement; var vm = avalon.vmodels.announcement;
} }
@@ -25,20 +22,30 @@ require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "validator", "pag
getPage(page); getPage(page);
} }
}, },
createAnnouncementEditor: {
editorId: "create-announcement-editor",
placeholder: "公告内容"
},
editAnnouncementEditor: {
editorId: "edit-announcement-editor",
placeholder: "公告内容"
},
editAnnouncement: function (announcement) { editAnnouncement: function (announcement) {
vm.newTitle = announcement.title; vm.newTitle = announcement.title;
vm.announcementId = announcement.id; vm.announcementId = announcement.id;
editAnnouncementEditor.setValue(announcement.content); avalon.vmodels.editAnnouncementEditor.content = announcement.content;
vm.announcementVisible = announcement.visible; vm.announcementVisible = announcement.visible;
vm.isEditing = true; vm.isEditing = true;
editAnnouncementEditor.focus();
}, },
cancelEdit: function () { cancelEdit: function () {
vm.isEditing = false; vm.isEditing = false;
}, },
submitChange: function () { submitChange: function () {
var title = vm.newTitle; var title = vm.newTitle;
var content = editAnnouncementEditor.getValue(); var content = avalon.vmodels.editAnnouncementEditor.content;
if (content == "" || title == "") { if (content == "" || title == "") {
bsAlert("标题和内容都不能为空"); bsAlert("标题和内容都不能为空");
@@ -60,7 +67,6 @@ require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "validator", "pag
if (!data.code) { if (!data.code) {
bsAlert("修改成功"); bsAlert("修改成功");
vm.isEditing = false; vm.isEditing = false;
localStorage.removeItem("/admin/autosave/edit-announcement-editor/");
getPage(1); getPage(1);
} }
else { else {
@@ -101,7 +107,7 @@ require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "validator", "pag
$("#announcement-form").validator().on('submit', function (e) { $("#announcement-form").validator().on('submit', function (e) {
if (!e.isDefaultPrevented()) { if (!e.isDefaultPrevented()) {
var title = $("#title").val(); var title = $("#title").val();
var content = createAnnouncementEditor.getValue(); var content = avalon.vmodels.createAnnouncementEditor.content;
if (content == "") { if (content == "") {
bsAlert("请填写公告内容"); bsAlert("请填写公告内容");
return false; return false;
@@ -119,8 +125,7 @@ require(["jquery", "avalon", "csrfToken", "bsAlert", "editor", "validator", "pag
if (!data.code) { if (!data.code) {
bsAlert("提交成功!"); bsAlert("提交成功!");
$("#title").val(""); $("#title").val("");
createAnnouncementEditor.setValue(""); avalon.vmodels.createAnnouncementEditor.content = "";
localStorage.removeItem("/admin/autosave/create-announcement-editor/");
getPage(1); getPage(1);
} else { } else {
bsAlert(data.data); bsAlert(data.data);

View File

@@ -1,4 +1,4 @@
require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagEditor", "validator", "jqueryUI"], require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagEditor", "validator", "jqueryUI", "editorComponent"],
function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) { function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) {
avalon.ready(function () { avalon.ready(function () {
@@ -9,7 +9,7 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
bsAlert("你还没有上传测试数据!"); bsAlert("你还没有上传测试数据!");
return false; return false;
} }
if (vm.description == "") { if (avalon.vmodels.problemDescriptionEditor.content == "") {
bsAlert("题目描述不能为空!"); bsAlert("题目描述不能为空!");
return false; return false;
} }
@@ -35,12 +35,12 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
var ajaxData = { var ajaxData = {
id: avalon.vmodels.admin.problemId, id: avalon.vmodels.admin.problemId,
title: vm.title, title: vm.title,
description: vm.description, description: avalon.vmodels.problemDescriptionEditor.content,
time_limit: vm.timeLimit, time_limit: vm.timeLimit,
memory_limit: vm.memoryLimit, memory_limit: vm.memoryLimit,
samples: [], samples: [],
test_case_id: vm.testCaseId, test_case_id: vm.testCaseId,
hint: vm.hint, hint: avalon.vmodels.problemHintEditor.content,
source: vm.source, source: vm.source,
visible: vm.visible, visible: vm.visible,
tags: tags, tags: tags,
@@ -77,9 +77,6 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
} }
}); });
var hintEditor = editor("#hint");
var problemDescription = editor("#problemDescription");
if (avalon.vmodels.addProblem) { if (avalon.vmodels.addProblem) {
var vm = avalon.vmodels.addProblem; var vm = avalon.vmodels.addProblem;
} }
@@ -87,13 +84,11 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
var vm = avalon.define({ var vm = avalon.define({
$id: "addProblem", $id: "addProblem",
title: "", title: "",
description: "",
timeLimit: 1000, timeLimit: 1000,
memoryLimit: 128, memoryLimit: 128,
samples: [{input: "", output: "", "visible": true}], samples: [{input: "", output: "", "visible": true}],
hint: "",
visible: true, visible: true,
difficulty: 0, difficulty: "1",
tags: [], tags: [],
inputDescription: "", inputDescription: "",
outputDescription: "", outputDescription: "",
@@ -102,6 +97,16 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
uploadSuccess: false, uploadSuccess: false,
source: "", source: "",
uploadProgress: 0, uploadProgress: 0,
problemDescriptionEditor: {
editorId: "problem-description-editor",
placeholder: "题目描述"
},
problemHintEditor: {
editorId: "problem-hint-editor",
placeholder: "提示"
},
addSample: function () { addSample: function () {
vm.samples.push({input: "", output: "", "visible": true}); vm.samples.push({input: "", output: "", "visible": true});
}, },
@@ -122,8 +127,10 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
var testCaseUploader = uploader("#testCaseFile", "/api/admin/test_case_upload/", var testCaseUploader = uploader("#testCaseFile", "/api/admin/test_case_upload/",
function (file, response) { function (file, response) {
if (response.code) if (response.code) {
vm.uploadProgress = 0;
bsAlert(response.data); bsAlert(response.data);
}
else { else {
vm.testCaseId = response.data.test_case_id; vm.testCaseId = response.data.test_case_id;
vm.uploadSuccess = true; vm.uploadSuccess = true;

View File

@@ -1,4 +1,4 @@
require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagEditor", "validator", "jqueryUI"], require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagEditor", "validator", "jqueryUI", "editorComponent"],
function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) { function ($, avalon, editor, uploader, bsAlert, csrfTokenHeader) {
avalon.ready(function () { avalon.ready(function () {
@@ -10,7 +10,7 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
bsAlert("你还没有上传测试数据!"); bsAlert("你还没有上传测试数据!");
return false; return false;
} }
if (vm.description == "") { if (avalon.vmodels.problemDescriptionEditor.content == "") {
bsAlert("题目描述不能为空!"); bsAlert("题目描述不能为空!");
return false; return false;
} }
@@ -36,12 +36,12 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
var ajaxData = { var ajaxData = {
id: avalon.vmodels.admin.problemId, id: avalon.vmodels.admin.problemId,
title: vm.title, title: vm.title,
description: vm.description, description: avalon.vmodels.problemDescriptionEditor.content,
time_limit: vm.timeLimit, time_limit: vm.timeLimit,
memory_limit: vm.memoryLimit, memory_limit: vm.memoryLimit,
samples: [], samples: [],
test_case_id: vm.testCaseId, test_case_id: vm.testCaseId,
hint: vm.hint, hint: avalon.vmodels.problemHintEditor.content,
source: vm.source, source: vm.source,
visible: vm.visible, visible: vm.visible,
tags: tags, tags: tags,
@@ -85,13 +85,11 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
var vm = avalon.define({ var vm = avalon.define({
$id: "editProblem", $id: "editProblem",
title: "", title: "",
description: "",
timeLimit: -1, timeLimit: -1,
memoryLimit: -1, memoryLimit: -1,
samples: [], samples: [],
hint: "",
visible: true, visible: true,
difficulty: 0, difficulty: "1",
inputDescription: "", inputDescription: "",
outputDescription: "", outputDescription: "",
testCaseIdd: "", testCaseIdd: "",
@@ -99,6 +97,16 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
source: "", source: "",
testCaseList: [], testCaseList: [],
uploadProgress: 0, uploadProgress: 0,
problemDescriptionEditor: {
editorId: "problem-description-editor",
placeholder: "题目描述"
},
problemHintEditor: {
editorId: "problem-hint-editor",
placeholder: "提示"
},
addSample: function () { addSample: function () {
vm.samples.push({input: "", output: "", "visible": true}); vm.samples.push({input: "", output: "", "visible": true});
}, },
@@ -119,12 +127,12 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
avalon.vmodels.admin.template_url = "template/problem/problem_list.html"; avalon.vmodels.admin.template_url = "template/problem/problem_list.html";
} }
}); });
var hintEditor = editor("#hint");
var descriptionEditor = editor("#problemDescription");
var testCaseUploader = uploader("#testCaseFile", "/api/admin/test_case_upload/", var testCaseUploader = uploader("#testCaseFile", "/api/admin/test_case_upload/",
function (file, response) { function (file, response) {
if (response.code) if (response.code) {
vm.uploadProgress = 0;
bsAlert(response.data); bsAlert(response.data);
}
else { else {
vm.testCaseId = response.data.test_case_id; vm.testCaseId = response.data.test_case_id;
vm.uploadSuccess = true; vm.uploadSuccess = true;
@@ -154,7 +162,7 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
else { else {
var problem = data.data; var problem = data.data;
vm.title = problem.title; vm.title = problem.title;
vm.description = problem.description; avalon.vmodels.problemDescriptionEditor.content = problem.description;
vm.timeLimit = problem.time_limit; vm.timeLimit = problem.time_limit;
vm.memoryLimit = problem.memory_limit; vm.memoryLimit = problem.memory_limit;
for (var i = 0; i < problem.samples.length; i++) { for (var i = 0; i < problem.samples.length; i++) {
@@ -164,7 +172,7 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
visible: false visible: false
}) })
} }
vm.hint = problem.hint; avalon.vmodels.problemHintEditor.content = problem.hint;
vm.visible = problem.visible; vm.visible = problem.visible;
vm.difficulty = problem.difficulty; vm.difficulty = problem.difficulty;
vm.inputDescription = problem.input_description; vm.inputDescription = problem.input_description;
@@ -172,8 +180,6 @@ require(["jquery", "avalon", "editor", "uploader", "bsAlert", "csrfToken", "tagE
vm.testCaseId = problem.test_case_id; vm.testCaseId = problem.test_case_id;
vm.source = problem.source; vm.source = problem.source;
var problemTags = problem.tags; var problemTags = problem.tags;
hintEditor.setValue(vm.hint);
descriptionEditor.setValue(vm.description);
$.ajax({ $.ajax({
url: "/api/admin/tag/", url: "/api/admin/tag/",
dataType: "json", dataType: "json",

View File

@@ -1,12 +1,11 @@
require(["jquery", "avalon", "csrfToken", "bsAlert"], function ($, avalon, csrfTokenHeader, bsAlert) { require(["jquery", "avalon", "csrfToken", "bsAlert", "pager"], function ($, avalon, csrfTokenHeader, bsAlert) {
avalon.ready(function () { avalon.ready(function () {
if (avalon.vmodels.submissionList){ if (avalon.vmodels.submissionList) {
var vm = avalon.vmodels.submissionList; var vm = avalon.vmodels.submissionList;
} }
else { else {
var vm = avalon.define({ var vm = avalon.define({
$id: "submissionList", $id: "submissionList",
submissionList: [], submissionList: [],
@@ -14,65 +13,43 @@ require(["jquery", "avalon", "csrfToken", "bsAlert"], function ($, avalon, csrfT
nextPage: 0, nextPage: 0,
page: 1, page: 1,
totalPage: 1, totalPage: 1,
results : { results: {
0: "Accepted", 0: "Accepted",
1: "Runtime Error", 1: "Runtime Error",
2: "Time Limit Exceeded", 2: "Time Limit Exceeded",
3: "Memory Limit Exceeded", 3: "Memory Limit Exceeded",
4: "Compile Error", 4: "Compile Error",
5: "Format Error", 5: "Format Error",
6: "Wrong Answer", 6: "Wrong Answer",
7: "System Error", 7: "System Error",
8: "Waiting" 8: "Waiting"
},
getNext: function () {
if (!vm.nextPage)
return;
getPageData(vm.page + 1);
}, },
getPrevious: function () { pager: {
if (!vm.previousPage) getPage: function (page) {
return; getPage(page);
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) { showProblemListPage: function () {
getPageData(page_index); avalon.vmodels.admin.template_url = "template/problem/problem_list.html";
}, },
showSubmissionDetailPage: function (submissionId) {
}, rejudge: function (submission_id) {
showProblemListPage: function(){
vm.$fire("up!showProblemListPage");
},
rejudge: function(submission_id){
$.ajax({ $.ajax({
beforeSend: csrfTokenHeader,
url: "/api/admin/rejudge/", url: "/api/admin/rejudge/",
method: "post", method: "post",
data: {"submission_id": submission_id}, data: {"submission_id": submission_id},
success: function(data){ success: function (data) {
if(!data.code){ if (!data.code) {
bsAlert("重判任务提交成功"); bsAlert("重判任务提交成功");
} }
} }
}) })
} }
}); });
} }
getPageData(1); function getPage(page) {
var url = "/api/admin/submission/?paging=true&page=" + page + "&page_size=20&problem_id=" + avalon.vmodels.admin.problemId;
function getPageData(page) {
var url = "/api/admin/submission/?paging=true&page=" + page + "&page_size=10&problem_id=" + avalon.vmodels.admin.problemId;
$.ajax({ $.ajax({
url: url, url: url,
dataType: "json", dataType: "json",
@@ -84,6 +61,7 @@ require(["jquery", "avalon", "csrfToken", "bsAlert"], function ($, avalon, csrfT
vm.previousPage = data.data.previous_page; vm.previousPage = data.data.previous_page;
vm.nextPage = data.data.next_page; vm.nextPage = data.data.next_page;
vm.page = page; vm.page = page;
avalon.vmodels.submissionsListPager.totalPage = data.data.total_page;
} }
else { else {
bsAlert(data.data); bsAlert(data.data);

View File

@@ -1,4 +1,4 @@
define("editor", ["simditor", "simditor-autosave"], function(Simditor){ define("editor", ["simditor"], function(Simditor){
function editor(selector){ function editor(selector){
return new Simditor({ return new Simditor({
textarea: $(selector), textarea: $(selector),

View File

@@ -38,7 +38,7 @@
ms-duplex="newTitle"></div> ms-duplex="newTitle"></div>
<div class="form-group"> <div class="form-group">
<label>内容</label> <label>内容</label>
<textarea id="edit-announcement-editor" data-autosave="edit-announcement-editor"></textarea> <ms:editor $id="editAnnouncementEditor" config="editAnnouncementEditor"></ms:editor>
</div> </div>
<div class="form-group"> <div class="form-group">
<label>可见 <input ms-duplex-checked="announcementVisible" type="checkbox"/></label> <label>可见 <input ms-duplex-checked="announcementVisible" type="checkbox"/></label>
@@ -62,8 +62,8 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label>内容</label> <label>内容</label>
<textarea id="create-announcement-editor" placeholder="公告内容" maxlength="10000" data-autosave="create-announcement-editor" required>
</textarea> <ms:editor $id="createAnnouncementEditor" config="createAnnouncementEditor"></ms:editor>
<div class="help-block with-errors"></div> <div class="help-block with-errors"></div>
</div> </div>

View File

@@ -10,8 +10,7 @@
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>题目描述</label> <label>题目描述</label>
<textarea id="problemDescription" placeholder="这里输入内容(此内容不能为空)" ms-duplex="description"></textarea> <ms:editor $id="problemDescriptionEditor" config="problemDescriptionEditor"></ms:editor>
<p class="error-info" ms-visible="description==''">请填写题目描述</p>
</div> </div>
@@ -126,7 +125,7 @@
</div> </div>
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>提示</label> <label>提示</label>
<textarea id="hint" placeholder="这里输入内容" ms-duplex="hint"></textarea> <ms:editor $id="problemHintEditor" config="problemHintEditor"></ms:editor>
</div> </div>
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>来源</label> <label>来源</label>

View File

@@ -16,8 +16,7 @@
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>题目描述</label> <label>题目描述</label>
<textarea id="problemDescription" placeholder="这里输入内容(此内容不能为空)" ms-duplex="description"></textarea> <ms:editor $id="problemDescriptionEditor" config="problemDescriptionEditor"></ms:editor>
<p class="error-info" ms-visible="description==''">请填写题目描述</p>
</div> </div>
@@ -132,7 +131,7 @@
</div> </div>
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>提示</label> <label>提示</label>
<textarea id="hint" placeholder="这里输入内容" ms-duplex="hint"></textarea> <ms:editor $id="problemHintEditor" config="problemHintEditor"></ms:editor>
</div> </div>
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<label>来源</label> <label>来源</label>

View File

@@ -27,9 +27,7 @@
</tr> </tr>
</table> </table>
<div class="text-right"> <div class="text-right">
页数:{{ page }}/{{ totalPage }}&nbsp;&nbsp; <ms:pager $id="submissionsListPager" config="pager"></ms:pager>
<button ms-attr-class="getBtnClass('pre')" ms-click="getPrevious">上一页</button>
<button ms-attr-class="getBtnClass('next')" ms-click="getNext">下一页</button>
</div> </div>
</div> </div>
<script src="/static/js/app/admin/problem/submissionList.js"></script> <script src="/static/js/app/admin/problem/submissionList.js"></script>