完成前端界面设计

This commit is contained in:
F嘉阳
2018-02-08 21:25:23 +08:00
parent 213cad2a74
commit f43146a590
11 changed files with 726 additions and 137 deletions

View File

@@ -25,17 +25,17 @@ public class NavController {
return "/home/home"; return "/home/home";
} }
@GetMapping(value = {"/feedback"}) @GetMapping(value = {"/home/feedback"})
public String toFeedbackPage(){ public String toFeedbackPage(){
return "/home/feedback"; return "/home/feedback";
} }
@GetMapping(value = {"/about"}) @GetMapping(value = {"/home/about"})
public String toAboutPage(){ public String toAboutPage(){
return "/home/about"; return "/home/about";
} }
@GetMapping(value = {"/user"}) @GetMapping(value = {"/home/user"})
public String toUserPage(){ public String toUserPage(){
return "/home/user"; return "/home/user";
} }

View File

@@ -6,7 +6,7 @@ import org.springframework.web.servlet.config.annotation.PathMatchConfigurer;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry; import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer; import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
/*@Configuration*/ @Configuration
public class WebAppConfig implements WebMvcConfigurer { public class WebAppConfig implements WebMvcConfigurer {
/** /**

View File

@@ -2,19 +2,8 @@ var Main = {
data() { data() {
return { return {
activeIndex: '1', activeIndex: '1',
formInline: {
user: '',
region: ''
},
form: { form: {
name: '', content: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
}, },
feedbackData:[ feedbackData:[
{ {
@@ -24,6 +13,30 @@ var Main = {
} }
], ],
logData:[ logData:[
{
ip:'127.0.0.1',
header:'bug',
time:'2018-2-3',
username:'root'
},
{
ip:'127.0.0.1',
header:'bug',
time:'2018-2-3',
username:'root'
},
{
ip:'127.0.0.1',
header:'bug',
time:'2018-2-3',
username:'root'
},
{
ip:'127.0.0.1',
header:'bug',
time:'2018-2-3',
username:'root'
},
{ {
ip:'127.0.0.1', ip:'127.0.0.1',
header:'bug', header:'bug',
@@ -34,6 +47,9 @@ var Main = {
} }
}, },
methods: { methods: {
ClickToJump(targe){
window.location.href="http://localhost:8080/cms/" + targe;
},
handleSelect(key, keyPath) { handleSelect(key, keyPath) {
console.log(key, keyPath); console.log(key, keyPath);
}, },

View File

@@ -201,7 +201,7 @@ var Main = {
} }
}) })
console.log(this.$refs.content.value) console.log(this.$refs.content.value)
this.openSuccess("成功","反馈成功!") this.openNotiSuccess("成功","反馈成功!")
//this.$options.methods.openNotiSuccess.bind(this)(); //this.$options.methods.openNotiSuccess.bind(this)();
//alert('submit!'); //alert('submit!');
} else { } else {

View File

@@ -0,0 +1,94 @@
var Main = {
data() {
return {
activeIndex: '1',
formInline: {
user: '',
region: ''
},
tableData3: [{
id:'1',
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'2',
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'3',
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'4',
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'5',
date: '2016-05-08',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'6',
date: '2016-05-06',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'7',
date: '2016-05-07',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
multipleSelection: []
}
},
methods: {
togglePost(url){
axios({
url: 'http://localhost:8080/cms/'+url,
method: 'post',
data: {
id:this.multipleSelection
},
transformRequest: [function (data) {
// Do whatever you want to transform the data
let ret = ''
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
return ret
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})
},
handleSelect(key, keyPath) {
console.log(key, keyPath);
},
ClickToJump(targe){
window.location.href="http://localhost:8080/cms/" + targe;
},
toggleSelection(rows) {
if (rows) {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
handleSelectionChange(val) {
this.multipleSelection = val;
console.log(val)
},
onSubmit() {
console.log('submit!');
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')

View File

@@ -0,0 +1,94 @@
var Main = {
data() {
return {
activeIndex: '1',
formInline: {
user: '',
region: ''
},
tableData3: [{
id:'1',
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'2',
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'3',
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'4',
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'5',
date: '2016-05-08',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'6',
date: '2016-05-06',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'7',
date: '2016-05-07',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
multipleSelection: []
}
},
methods: {
togglePost(url){
axios({
url: 'http://localhost:8080/cms/'+url,
method: 'post',
data: {
id:this.multipleSelection
},
transformRequest: [function (data) {
// Do whatever you want to transform the data
let ret = ''
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
return ret
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})
},
handleSelect(key, keyPath) {
console.log(key, keyPath);
},
ClickToJump(targe){
window.location.href="http://localhost:8080/cms/" + targe;
},
toggleSelection(rows) {
if (rows) {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
handleSelectionChange(val) {
this.multipleSelection = val;
console.log(val)
},
onSubmit() {
console.log('submit!');
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')

View File

@@ -0,0 +1,92 @@
var Main = {
data() {
return {
activeIndex: '1',
tableData3: [{
id:'1',
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'2',
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'3',
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'4',
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'5',
date: '2016-05-08',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'6',
date: '2016-05-06',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id:'7',
date: '2016-05-07',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
multipleSelection: []
}
},
methods: {
togglePost(url){
/*axios({
url: 'http://localhost:8080/cms/'+url,
method: 'post',
data: {
id:this.multipleSelection
},
transformRequest: [function (data) {
// Do whatever you want to transform the data
let ret = ''
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
return ret
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})*/
console.log(this.multipleSelection)
//console.log(this.$refs.id.value);
},
handleSelect(key, keyPath) {
console.log(key, keyPath);
},
ClickToJump(targe){
window.location.href="http://localhost:8080/cms/" + targe;
},
toggleSelection(rows) {
if (rows) {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
handleSelectionChange(val) {
this.multipleSelection = val;
console.log(val)
},
onSubmit() {
console.log('submit!');
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')

View File

@@ -36,103 +36,70 @@
</el-header> </el-header>
<el-main> <el-main>
<el-col :md="4" :lg="4" :xl="4" class="hidden-sm-and-down"> <el-col :md="4" :lg="4" :xl="4" class="hidden-sm-and-down">
<el-row>
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>用户名</span><br> <span>用户名</span><br>
<span>学号</span> <span>学号</span>
</div> </div>
<div class="item"> <div class="item">
<el-button type="text" @click="ClickToJump('home')">首页</el-button><br> <el-button type="text" @click="ClickToJump('home')">首页</el-button>
<el-button type="text" @click="ClickToJump('user')">个人中心</el-button><br> <br>
<el-button type="text" @click="ClickToJump('about')">关于</el-button><br> <el-button type="text" @click="ClickToJump('user')">个人中心</el-button>
<br>
<el-button type="text" @click="ClickToJump('about')">关于</el-button>
<br>
<el-button type="text" @click="ClickToJump('feedback')">意见反馈</el-button> <el-button type="text" @click="ClickToJump('feedback')">意见反馈</el-button>
</div> </div>
</el-card> </el-card>
</el-row>
<el-row>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>管理员</span><br>
<span>管理员号</span>
</div>
<div class="item">
<el-button type="text" @click="ClickToJump('home')">用户管理</el-button>
<br>
<el-button type="text" @click="ClickToJump('user')">课程/老师管理</el-button>
<br>
<el-button type="text" @click="ClickToJump('about')">作业管理</el-button>
<br>
<el-button type="text" @click="ClickToJump('feedback')">公告/日志</el-button>
</div>
</el-card>
</el-row>
</el-col> </el-col>
<el-col :md="12" :lg="12" :xl="12" :sm="16" :xs="23" :offset="1"> <el-col :md="13" :lg="13" :xl="13" :sm="18" :xs="23" :offset="1">
<h4>添加老师</h4> <el-row>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="老师名字">
<el-input v-model="formInline.user" placeholder="老师名字"></el-input>
</el-form-item>
<el-form-item label="用户号">
<el-select v-model="formInline.region" placeholder="用户号">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">添加</el-button>
</el-form-item>
</el-form>
<h4>添加课程</h4>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="课程名">
<el-input v-model="formInline.user" placeholder="课程名"></el-input>
</el-form-item>
<el-form-item label="教师名">
<el-select v-model="formInline.region" placeholder="教师名">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">添加</el-button>
</el-form-item>
</el-form>
<h4>添加作业</h4>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="作业名称">
<el-input v-model="formInline.user" placeholder="作业名称"></el-input>
</el-form-item>
<el-form-item label="模板文件名称">
<el-select v-model="formInline.region" placeholder="模板文件名称">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="课程名称">
<el-select v-model="formInline.region" placeholder="课程名称">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="存储文件夹">
<el-input v-model="formInline.user" placeholder="存储文件夹"></el-input>
</el-form-item>
<el-form-item label="作业内容">
<el-input v-model="formInline.user" placeholder="作业内容" type="textarea"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">添加</el-button>
</el-form-item>
</el-form>
<h4>发布公告</h4> <h4>发布公告</h4>
<el-form :inline="true" :model="formInline" class="demo-form-inline"> <el-form :model="form">
<el-form-item label="公告内容"> <el-form-item label="公告内容">
<el-input v-model="formInline.user" placeholder="公告内容" type="textarea"></el-input> <el-input v-model="form.content" placeholder="公告内容" type="textarea"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">添加</el-button>
</el-form-item>
</el-form>
<h4>添加管理员</h4>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="管理员名">
<el-input v-model="formInline.user" placeholder="管理员名"></el-input>
</el-form-item>
<el-form-item label="用户号">
<el-select v-model="formInline.region" placeholder="用户号">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSubmit">添加</el-button> <el-button type="primary" @click="onSubmit">添加</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-row>
<el-row>
<span>近期登陆日志</span><br>
<template>
<el-table :data="logData" height="300" :default-sort="{prop: 'time', order: 'descending'}">
<el-table-column prop="username" label="用户名" sortable>
</el-table-column>
<el-table-column prop="header" label="请求头" sortable>
</el-table-column>
<el-table-column prop="time" label="时间" sortable>
</el-table-column>
<el-table-column prop="ip" label="ip地址" sortable>
</el-table-column>
</el-table>
</template>
</el-row>
</el-col> </el-col>
<el-col :md="7" :lg="7" :sm="7" :xl="7" class="hidden-xs-only"> <el-col :md="5" :lg="5" :sm="5" :xl="5" class="hidden-xs-only" :offset="1">
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<div class="grid-content"> <div class="grid-content">
@@ -155,36 +122,13 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<el-row>
<el-col :span="24">
<div class="grid-content">
<el-card class="box-card hidden-xs-only">
<div slot="header" class="clearfix">
<span>近期登陆日志</span>
</div>
<div class="text item">
<el-table :data="logData" style="width: 100%"
:default-sort="{prop: 'time', order: 'descending'}">
<el-table-column prop="username" label="用户名" sortable>
</el-table-column>
<el-table-column prop="header" label="请求头" sortable>
</el-table-column>
<el-table-column prop="time" label="时间" sortable>
</el-table-column>
<el-table-column prop="ip" label="ip地址" sortable>
</el-table-column>
</el-table>
</div>
</el-card>
</div>
</el-col>
</el-row>
</el-col> </el-col>
</el-main> </el-main>
<el-footer> <el-footer>
<div class="footer"> <div class="footer">
© 2018 作业提交系统 © 2018 作业提交系统
</div></el-footer> </div>
</el-footer>
</el-container> </el-container>
</el-container> </el-container>
</div> </div>

View File

@@ -0,0 +1,129 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>作业管理</title>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!--<link rel="stylesheet" href="https://unpkg.com/element-ui@2.1.0/lib/theme-chalk/display.css">-->
<link rel="stylesheet" href="../../static/css/style.css">
</head>
<body>
<!-- 先引入 Vue -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<div id="app">
<el-container>
<el-container>
<el-header>
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
<el-menu-item index="1">首页</el-menu-item>
<el-submenu index="2">
<template slot="title">个人中心</template>
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
<el-menu-item index="2-3">选项3</el-menu-item>
</el-submenu>
<el-menu-item index="3" @click="ClickToJump('about')">关于</el-menu-item>
<el-menu-item index="4" @click="ClickToJump('feedback')">意见反馈</el-menu-item>
<el-menu-item index="5"><a href="login.jsp">登出</a></el-menu-item>
</el-menu>
</el-header>
<el-main>
<el-col :md="4" :lg="4" :xl="4" class="hidden-sm-and-down">
<el-row><el-card class="box-card">
<div slot="header" class="clearfix">
<span>用户名</span><br>
<span>学号</span>
</div>
<div class="item">
<el-button type="text" @click="ClickToJump('home')">首页</el-button><br>
<el-button type="text" @click="ClickToJump('user')">个人中心</el-button><br>
<el-button type="text" @click="ClickToJump('about')">关于</el-button><br>
<el-button type="text" @click="ClickToJump('feedback')">意见反馈</el-button>
</div>
</el-card>
</el-row>
<el-row>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>管理员</span><br>
<span>管理员号</span>
</div>
<div class="item">
<el-button type="text" @click="ClickToJump('home')">用户管理</el-button><br>
<el-button type="text" @click="ClickToJump('user')">课程/老师管理</el-button><br>
<el-button type="text" @click="ClickToJump('about')">作业管理</el-button><br>
<el-button type="text" @click="ClickToJump('feedback')">公告/日志</el-button>
</div>
</el-card></el-row>
</el-col>
<el-col :md="12" :lg="12" :xl="12" :sm="16" :xs="23" :offset="1">
<el-row>
<template>
<div style="margin-bottom: 20px">
<el-button @click="toggleSelection([tableData3[1], tableData3[2]])">切换第二、第三行的选中状态</el-button>
<el-button @click="toggleSelection()">取消选择</el-button>
<el-button @click="togglePost()" type="danger" plain>删除作业</el-button>
</div>
<el-table ref="multipleTable" :data="tableData3"
tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column type="selection" prop='id' width="55">
</el-table-column>
<el-table-column label="日期" width="120">
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column prop="name" label="姓名" width="120">
</el-table-column>
<el-table-column prop="address" label="地址" show-overflow-tooltip>
</el-table-column>
</el-table>
</template></el-row>
<el-row>
<h4>添加作业</h4>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="作业名称">
<el-input v-model="formInline.user" placeholder="作业名称"></el-input>
</el-form-item>
<el-form-item label="模板文件名称">
<el-select v-model="formInline.region" placeholder="模板文件名称">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="课程名称">
<el-select v-model="formInline.region" placeholder="课程名称">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="存储文件夹">
<el-input v-model="formInline.user" placeholder="存储文件夹"></el-input>
</el-form-item>
<el-form-item label="作业内容">
<el-input v-model="formInline.user" placeholder="作业内容" type="textarea"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">添加</el-button>
</el-form-item>
</el-form>
</el-row>
</el-col>
<el-col :md="7" :lg="7" :sm="7" :xl="7" class="hidden-xs-only">
</el-col>
</el-main>
<el-footer>
<div class="footer">
© 2018 作业提交系统
</div></el-footer>
</el-container>
</el-container>
</div>
<script src="../../static/js/homework.js"></script>
<script src="../../static/js/msg.js"></script>
</body>
</html>

View File

@@ -0,0 +1,119 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>课程|老师 管理</title>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!--<link rel="stylesheet" href="https://unpkg.com/element-ui@2.1.0/lib/theme-chalk/display.css">-->
<link rel="stylesheet" href="../../static/css/style.css">
</head>
<body>
<!-- 先引入 Vue -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<div id="app">
<el-container>
<el-container>
<el-header>
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
<el-menu-item index="1">首页</el-menu-item>
<el-submenu index="2">
<template slot="title">个人中心</template>
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
<el-menu-item index="2-3">选项3</el-menu-item>
</el-submenu>
<el-menu-item index="3" @click="ClickToJump('about')">关于</el-menu-item>
<el-menu-item index="4" @click="ClickToJump('feedback')">意见反馈</el-menu-item>
<el-menu-item index="5"><a href="login.jsp">登出</a></el-menu-item>
</el-menu>
</el-header>
<el-main>
<el-col :md="4" :lg="4" :xl="4" class="hidden-sm-and-down">
<el-row><el-card class="box-card">
<div slot="header" class="clearfix">
<span>用户名</span><br>
<span>学号</span>
</div>
<div class="item">
<el-button type="text" @click="ClickToJump('home')">首页</el-button><br>
<el-button type="text" @click="ClickToJump('user')">个人中心</el-button><br>
<el-button type="text" @click="ClickToJump('about')">关于</el-button><br>
<el-button type="text" @click="ClickToJump('feedback')">意见反馈</el-button>
</div>
</el-card>
</el-row>
<el-row>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>管理员</span><br>
<span>管理员号</span>
</div>
<div class="item">
<el-button type="text" @click="ClickToJump('home')">用户管理</el-button><br>
<el-button type="text" @click="ClickToJump('user')">课程/老师管理</el-button><br>
<el-button type="text" @click="ClickToJump('about')">作业管理</el-button><br>
<el-button type="text" @click="ClickToJump('feedback')">公告/日志</el-button>
</div>
</el-card></el-row>
</el-col>
<el-col :md="12" :lg="12" :xl="12" :sm="16" :xs="23" :offset="1">
<el-row>
<template>
<div style="margin-bottom: 20px">
<el-button @click="toggleSelection([tableData3[1], tableData3[2]])">切换第二、第三行的选中状态</el-button>
<el-button @click="toggleSelection()">取消选择</el-button>
<el-button @click="togglePost()" type="danger" plain>删除课程</el-button>
</div>
<el-table ref="multipleTable" :data="tableData3"
tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column type="selection" prop='id' width="55">
</el-table-column>
<el-table-column label="日期" width="120">
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column prop="name" label="姓名" width="120">
</el-table-column>
<el-table-column prop="address" label="地址" show-overflow-tooltip>
</el-table-column>
</el-table>
</template>
</el-row>
<el-row>
<h4>添加课程</h4>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="课程名">
<el-input v-model="formInline.user" placeholder="课程名"></el-input>
</el-form-item>
<el-form-item label="教师名">
<el-select v-model="formInline.region" placeholder="教师名">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">添加</el-button>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-col :md="7" :lg="7" :sm="7" :xl="7" class="hidden-xs-only">
</el-col>
</el-main>
<el-footer>
<div class="footer">
© 2018 作业提交系统
</div></el-footer>
</el-container>
</el-container>
</div>
<script src="../../static/js/managecourse.js"></script>
<script src="../../static/js/msg.js"></script>
</body>
</html>

View File

@@ -0,0 +1,101 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户管理</title>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!--<link rel="stylesheet" href="https://unpkg.com/element-ui@2.1.0/lib/theme-chalk/display.css">-->
<link rel="stylesheet" href="../../static/css/style.css">
</head>
<body>
<!-- 先引入 Vue -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<div id="app">
<el-container>
<el-container>
<el-header>
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
<el-menu-item index="1">首页</el-menu-item>
<el-submenu index="2">
<template slot="title">个人中心</template>
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
<el-menu-item index="2-3">选项3</el-menu-item>
</el-submenu>
<el-menu-item index="3" @click="ClickToJump('about')">关于</el-menu-item>
<el-menu-item index="4" @click="ClickToJump('feedback')">意见反馈</el-menu-item>
<el-menu-item index="5"><a href="login.jsp">登出</a></el-menu-item>
</el-menu>
</el-header>
<el-main>
<el-col :md="4" :lg="4" :xl="4" class="hidden-sm-and-down">
<el-row><el-card class="box-card">
<div slot="header" class="clearfix">
<span>用户名</span><br>
<span>学号</span>
</div>
<div class="item">
<el-button type="text" @click="ClickToJump('home')">首页</el-button><br>
<el-button type="text" @click="ClickToJump('user')">个人中心</el-button><br>
<el-button type="text" @click="ClickToJump('about')">关于</el-button><br>
<el-button type="text" @click="ClickToJump('feedback')">意见反馈</el-button>
</div>
</el-card>
</el-row>
<el-row>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>管理员</span><br>
<span>管理员号</span>
</div>
<div class="item">
<el-button type="text" @click="ClickToJump('home')">用户管理</el-button><br>
<el-button type="text" @click="ClickToJump('user')">课程/老师管理</el-button><br>
<el-button type="text" @click="ClickToJump('about')">作业管理</el-button><br>
<el-button type="text" @click="ClickToJump('feedback')">公告/日志</el-button>
</div>
</el-card></el-row>
</el-col>
<el-col :md="12" :lg="12" :xl="12" :sm="16" :xs="23" :offset="1">
<template>
<div style="margin-bottom: 20px">
<el-button @click="toggleSelection([tableData3[1], tableData3[2]])">切换第二、第三行的选中状态</el-button>
<el-button @click="toggleSelection()">取消选择</el-button>
<el-button @click="togglePost()" type="primary" plain>设为老师</el-button>
<el-button @click="togglePost()" type="warning" plain>设为管理员</el-button>
<el-button @click="togglePost()" type="danger" plain>删除用户</el-button>
</div>
<el-table ref="multipleTable" :data="tableData3" @selection-change="handleSelectionChange"
tooltip-effect="dark" style="width: 100%" >
<el-table-column type="selection" prop='id' width="55">
</el-table-column>
<el-table-column label="日期" width="120">
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column prop="name" label="姓名" width="120">
</el-table-column>
<el-table-column prop="address" label="地址" show-overflow-tooltip>
</el-table-column>
</el-table>
</template>
</el-col>
<el-col :md="7" :lg="7" :sm="7" :xl="7" class="hidden-xs-only">
</el-col>
</el-main>
<el-footer>
<div class="footer">
© 2018 作业提交系统
</div></el-footer>
</el-container>
</el-container>
</div>
<script src="../../static/js/manageuser.js"></script>
<script src="../../static/js/msg.js"></script>
</body>
</html>