添加题目列表组件;完善创建题目组件

This commit is contained in:
LiYang 2016-08-14 16:24:41 +08:00
parent a9099b80a4
commit 39fa2872a0
7 changed files with 203 additions and 39 deletions

View File

@ -10,8 +10,8 @@
"test": "" "test": ""
}, },
"dependencies": { "dependencies": {
"vue": "^1.0.21", "babel-runtime": "^6.0.0",
"babel-runtime": "^6.0.0" "vue": "^1.0.21"
}, },
"devDependencies": { "devDependencies": {
"babel-core": "^6.0.0", "babel-core": "^6.0.0",
@ -46,7 +46,6 @@
"vue-resource": "^0.9.3", "vue-resource": "^0.9.3",
"vue-router": "^0.7.13", "vue-router": "^0.7.13",
"vue-style-loader": "^1.0.0", "vue-style-loader": "^1.0.0",
"vue-tagsinput": "^0.3.1",
"webpack": "^1.12.2", "webpack": "^1.12.2",
"webpack-dev-middleware": "^1.4.0", "webpack-dev-middleware": "^1.4.0",
"webpack-hot-middleware": "^2.6.0", "webpack-hot-middleware": "^2.6.0",

View File

@ -48,8 +48,6 @@
import Router from 'vue-router' import Router from 'vue-router'
import pager from '../utils/pager.vue' import pager from '../utils/pager.vue'
//import editUser from './editUser.vue'
export default { export default {
data: function () { data: function () {
return { return {
@ -103,8 +101,6 @@
search() { search() {
sessionStorage.userListSearchKeyword = this.keyword; sessionStorage.userListSearchKeyword = this.keyword;
this.$router.go({path: "/user/1", query: {_: (new Date()).getTime()}}); this.$router.go({path: "/user/1", query: {_: (new Date()).getTime()}});
// pager goto page 1
// url -> /user/1
}, },
edit(userId) { edit(userId) {
this.$router.go("/user/edit/" + userId) this.$router.go("/user/edit/" + userId)

View File

@ -0,0 +1,77 @@
<template>
<div class="rows">
<back></back>
<h3>{{ $t("problem.createProblem") }}</h3>
<div class="form-group col-md-12">
<label>{{ $t("adminUtils.title") }}</label>
<input type="text" class="form-control" maxlength="50" required>
</div>
<div class="form-group col-md-12">
<label>{{ $t("adminUtils.description") }}</label>
<simditor></simditor>
</div>
<div class="col-md-3">
<div class="form-group">
<label>{{ $t("problem.timeLimit") }}</label>
<input type="number" class="form-control" required>
</div>
</div>
<div class="col-md-3">
<div class="form-group"><label>{{ $t("problem.memoryLimit") }}</label>
<input type="number" class="form-control" required>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label>{{ $t("problem.difficulty") }}</label>
<select class="form-control" required>
<option value="1" selected="selected">{{ $t("problem.easy") }}</option>
<option value="2">{{ $t("problem.medium") }}</option>
<option value="3">{{ $t("problem.hard") }}</option>
</select>
</div>
</div>
<div class="col-md-3 form-group">
<label>{{ $t("adminUtils.isVisible")}}</label><br>
<input type="checkbox">可见
</div>
<div class="col-md-12">
<label>{{ $t("problem.tag") }}</label>
<tag-input :tag-list.sync="tagList"></tag-input>
</div>
<problem-sample v-ref:sample></problem-sample>
<test-case-mgnt v-ref:testcase></test-case-mgnt>
</div>
</template>
<script>
import testCaseMgnt from "./testCaseMgnt.vue"
import problemSample from "./problemSample.vue"
import back from "../utils/back.vue"
import simditor from "../utils/simditor.vue"
import tagInput from "../utils/tagInput.vue"
export default({
data() {
return {
tagList: ["1234", "呵呵哒"]
}
},
components: {
testCaseMgnt,
problemSample,
back,
simditor,
tagInput
},
ready() {
this.$refs.testcase.setTestCase([{input_name: "1.in", output_name: "1.out"}], false);
}
})
</script>

View File

@ -1,15 +0,0 @@
<template>
<div>
<test-case-mgnt></test-case-mgnt>
</div>
</template>
<script>
import testCaseMgnt from "./testCaseMgnt.vue"
export default({
components: {
testCaseMgnt
}
})
</script>

View File

@ -0,0 +1,93 @@
<template>
<h3>{{ $t("problem.problemList") }}</h3>
<div>
<form class="form-inline" onsubmit="return false;">
<div class="form-group-sm">
<label>{{ $t("adminUtils.search") }}</label>
<input name="keyword" class="form-control" placeholder='{{ $t("adminUtils.inputKeyword") }}'
v-model="keyword">
<button type="button" class="btn btn-primary" v-on:click="search">{{ $t("adminUtils.search") }}
</button>
</div>
</form>
<br>
</div>
<table class="table table-striped">
<tr>
<th>ID</th>
<th>{{ $t("adminUtils.title") }}</th>
<th>{{ $t("adminUtils.createTime") }}</th>
<th>{{ $t("adminUtils.createdBy") }}</th>
<th>{{ $t("adminUtils.isVisible") }}</th>
<th>{{ $t("adminUtils.management") }}</th>
</tr>
<tr v-for="problem in problemList">
<td>{{ problem.id }}</td>
<td>{{ problem.title }}</td>
<td>{{ problem.create_time }}</td>
<td>{{ problem.created_by.username }}</td>
<td>{{ $t(problemStatus[problem.visible?1:0]) }}</td>
<td>
<button class="btn-sm btn-info" v-on:click="edit(problem.id)">{{ $t("adminUtils.edit") }}</button>
</td>
</tr>
</table>
<pager :pagination="pagination" :callback="loadData"></pager>
</template>
<script>
import pager from "../utils/pager.vue"
export default({
data() {
return {
keyword: "",
problemStatus: ["adminUtils.visible", "adminUtils.invisible"],
problemList: [],
pagination: {
currentPage: 1,
totalPages: 10
}
}
},
methods: {
loadData() {
var url = "/api/admin/problem/?paging=true&page_size=2&page=" + this.pagination.currentPage;
if (this.keyword) {
url += ("&keyword=" + this.keyword)
}
this.request({
url: url,
method: "GET",
success: (data)=> {
this.problemList = data.data.results;
this.pagination.totalPages = data.data.total_page;
}
})
},
edit(problemId){
this.$router.go("/problem/edit/" + problemId)
},
search() {
sessionStorage.problemListSearchKeyword = this.keyword;
this.$router.go({path: "/problem/1", query: {_: (new Date()).getTime()}});
},
},
route: {
data(){
if (sessionStorage.problemListSearchKeyword) {
this.keyword = sessionStorage.problemListSearchKeyword;
}
this.loadData();
}
},
components: {
pager
}
})
</script>
<style>
</style>

View File

@ -7,8 +7,11 @@ export default {
cancel: "取消" cancel: "取消"
}, },
nav: { nav: {
general: "通用",
userManagement: "用户管理", userManagement: "用户管理",
announcementManagement: "公告管理" announcementManagement: "公告管理",
problemManagement: "题目管理",
createProblem: "创建题目",
}, },
pagination: { pagination: {
firstPage: "首页", firstPage: "首页",
@ -53,6 +56,8 @@ export default {
contentCanNotBeEmpty: "内容不能为空" contentCanNotBeEmpty: "内容不能为空"
}, },
problem: { problem: {
problemList: "题目列表",
createProblem: "创建题目",
sample: "样例", sample: "样例",
addSample: "添加样例", addSample: "添加样例",
fold: "折叠", fold: "折叠",
@ -61,8 +66,17 @@ export default {
testCase: "测试用例", testCase: "测试用例",
uploadProgress: "上传进度", uploadProgress: "上传进度",
OIMode: "OI模式", OIMode: "OI模式",
score: "分数" score: "分数",
timeLimit: "时间限制",
memoryLimit: "内存限制",
tag: "标签",
hard: "难",
medium: "中等",
easy: "简单",
difficulty: "难度"
},
tag: {
hint: "回车创建标签"
}, },
adminUtils: { adminUtils: {
search: "搜索", search: "搜索",
@ -71,6 +85,7 @@ export default {
edit: "编辑", edit: "编辑",
title: "标题", title: "标题",
description: "描述",
createTime: "创建时间", createTime: "创建时间",
lastUpdateTime: "最后更新", lastUpdateTime: "最后更新",
createdBy: "创建人", createdBy: "创建人",

View File

@ -12,10 +12,13 @@ import getCookie from "./utils/cookie"
import userList from "./components/account/userList.vue" import userList from "./components/account/userList.vue"
import editUser from "./components/account/editUser.vue" import editUser from "./components/account/editUser.vue"
import problem from "./components/problem/problem.vue"
import announcementList from "./components/announcement/announcementList.vue" import announcementList from "./components/announcement/announcementList.vue"
import editAnnouncement from "./components/announcement/editAnnouncement.vue" import editAnnouncement from "./components/announcement/editAnnouncement.vue"
import createProblem from "./components/problem/createProblem.vue"
import problemList from "./components/problem/problemList.vue"
// i18n settings // i18n settings
Vue.use(VueI18n); Vue.use(VueI18n);
@ -87,33 +90,25 @@ var router = new VueRouter({linkActiveClass: "active"});
router.map({ router.map({
"/user/:page": { "/user/:page": {
name: "userList",
component: userList component: userList
}, },
"/user/edit/:userId": { "/user/edit/:userId": {
name: "editUser",
component: editUser component: editUser
}, },
"/problem/create": { "/problem/create": {
name: "createProblem", component: createProblem
component: problem },
"/problem/:page": {
component: problemList
}, },
"/announcement/:page": { "/announcement/:page": {
name: "announcementList",
component: announcementList component: announcementList
}, },
"/announcement/edit/:announcementId": { "/announcement/edit/:announcementId": {
name: "editAnnouncement",
component: editAnnouncement component: editAnnouncement
},
"/problem": {
component: problem
} }
}); });
// hide loading
document.getElementById("loading").style.display = "none";
// override window.alert // override window.alert
window.alert = function bootboxAlert(content) { window.alert = function bootboxAlert(content) {
bootbox.dialog({ bootbox.dialog({
@ -157,6 +152,10 @@ window.confirm = function bootboxConfirm(content, okCallback, cancelCallback) {
router.redirect({"/user": "/user/1"}); router.redirect({"/user": "/user/1"});
router.redirect({"/announcement": "/announcement/1"}); router.redirect({"/announcement": "/announcement/1"});
router.redirect({"/problem": "problem/1"});
setTimeout(function(){
// hide loading
document.getElementById("loading").style.display = "none";
router.start(App, '#app'); router.start(App, '#app');
}, 1500);