完成前端上传页面设计
This commit is contained in:
F嘉阳
@@ -26,7 +26,7 @@ public class WebAppConfig implements WebMvcConfigurer {
|
||||
public void addResourceHandlers(ResourceHandlerRegistry registry) {
|
||||
registry.addResourceHandler("/cms/js/**").addResourceLocations("classpath:/js/");
|
||||
registry.addResourceHandler("/cms/css/**").addResourceLocations("classpath:/css/");
|
||||
registry.addResourceHandler("/css/**").addResourceLocations("classpath:/css/");
|
||||
//registry.addResourceHandler("/css/**").addResourceLocations("classpath:/css/");
|
||||
registry.addResourceHandler("/cms/fonts/**").addResourceLocations("classpath:/fonts/");
|
||||
registry.addResourceHandler("/cms/images/**").addResourceLocations("classpath:/images/");
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
@charset "utf-8";
|
||||
/* CSS Document */
|
||||
@import url("https://unpkg.com/element-ui@2.1.0/lib/theme-chalk/display.css");
|
||||
@font-face {
|
||||
/* font-properties */
|
||||
font-family: element-icons;
|
||||
@@ -9,3 +10,51 @@
|
||||
.loginTitle{
|
||||
text-align: center;
|
||||
}
|
||||
.el-row {
|
||||
margin-bottom: 20px;
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.row-bg {
|
||||
padding: 10px 0;
|
||||
}
|
||||
.text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.item {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
.clearfix:after {
|
||||
clear: both
|
||||
}
|
||||
|
||||
.box-card {
|
||||
width: 100%;
|
||||
}
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
.demo-table-expand {
|
||||
font-size: 0;
|
||||
}
|
||||
.demo-table-expand label {
|
||||
width: 90px;
|
||||
color: #99a9bf;
|
||||
}
|
||||
.demo-table-expand .el-form-item {
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
width: 50%;
|
||||
}
|
||||
.footer{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,12 +1,3 @@
|
||||
/*var data = "";
|
||||
axios.get('http://localhost:8080/cms/download/findall')
|
||||
.then(function (response) {
|
||||
console.log(response.data);
|
||||
data = response.data;
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});*/
|
||||
var Main = {
|
||||
data() {
|
||||
var checkName = (rule, value, callback) => {
|
||||
@@ -44,6 +35,8 @@ var Main = {
|
||||
}
|
||||
};
|
||||
return {
|
||||
activeIndex: '1',
|
||||
dialogVisible: false,
|
||||
ruleForm2: {
|
||||
colname: '',
|
||||
colpassword: '',
|
||||
@@ -78,14 +71,59 @@ var Main = {
|
||||
],
|
||||
},
|
||||
activeName:'login',
|
||||
fileList: [{
|
||||
name: 'food.jpeg',
|
||||
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
|
||||
fileList: [],
|
||||
DownloadList: [],
|
||||
tableHomeworkData: [{
|
||||
subject: '信息安全',
|
||||
date: '2018-05-02',
|
||||
name: '实验报告',
|
||||
content: '实验报告',
|
||||
remark:'3000字以上',
|
||||
tempfile:'15251101238.docx'
|
||||
}, {
|
||||
name: 'food2.jpeg',
|
||||
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
|
||||
subject: '信息安全',
|
||||
date: '2018-05-02',
|
||||
name: '实验报告',
|
||||
content: '实验报告',
|
||||
remark:'3000字以上',
|
||||
tempfile:'15251101238.docx'
|
||||
}, {
|
||||
subject: '信息安全',
|
||||
date: '2018-05-02',
|
||||
name: '实验报告',
|
||||
content: '实验报告',
|
||||
remark:'3000字以上',
|
||||
tempfile:'15251101238.docx'
|
||||
}, {
|
||||
subject: '信息安全',
|
||||
date: '2018-05-02',
|
||||
name: '实验报告',
|
||||
content: '实验报告',
|
||||
remark:'3000字以上',
|
||||
tempfile:'15251101238.docx'
|
||||
}],
|
||||
DownloadList: []
|
||||
tableData2: [{
|
||||
date: '2016-05-02',
|
||||
}, {
|
||||
date: '2016-05-04',
|
||||
}, {
|
||||
date: '2016-05-01',
|
||||
}, {
|
||||
date: '2016-05-03',
|
||||
}],
|
||||
tableData3: [{
|
||||
date: '2016-05-02',
|
||||
name: '王小虎'
|
||||
}, {
|
||||
date: '2016-05-04',
|
||||
name: '王小虎'
|
||||
}, {
|
||||
date: '2016-05-01',
|
||||
name: '王小虎'
|
||||
}, {
|
||||
date: '2016-05-03',
|
||||
name: '王小虎'
|
||||
}]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
@@ -125,6 +163,9 @@ var Main = {
|
||||
handleRemove(file, fileList) {
|
||||
console.log(file, fileList);
|
||||
},
|
||||
ClickToJump(targe){
|
||||
window.open("http://localhost:8080/cms/" + targe);
|
||||
},
|
||||
handleDownload(row) {
|
||||
/*var url = window.location.protocol+"://"+window.location.host+":"+window.location.port+"/"*/
|
||||
window.open("http://localhost:8080/cms/download/dodownload?fileId=" + row.colfileid);
|
||||
@@ -147,6 +188,13 @@ var Main = {
|
||||
handleClose(key, keyPath) {
|
||||
console.log(key, keyPath);
|
||||
},
|
||||
dialogClose(done) {
|
||||
this.$confirm('确认关闭？')
|
||||
.then(_ => {
|
||||
done();
|
||||
})
|
||||
.catch(_ => {});
|
||||
},
|
||||
showMsg(msg) {
|
||||
this.$message({
|
||||
message: msg,
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<body>
|
||||
<div th:insert="~{dist/thymeleaf/common_head :: #body_js}"></div>
|
||||
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
||||
<div id="app">
|
||||
<!--<div id="app">
|
||||
<el-container>
|
||||
<el-aside th:include="dist/thymeleaf/layout :: asider"></el-aside>
|
||||
<el-container>
|
||||
@@ -54,8 +54,267 @@
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>-->
|
||||
<div id="app">
|
||||
<el-container>
|
||||
<!--<el-aside width="200px">
|
||||
<el-row class="tac">
|
||||
<el-col :span="24">
|
||||
<h5>默认颜色</h5>
|
||||
<el-menu default-active="2" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose">
|
||||
<el-submenu index="1">
|
||||
<template slot="title">
|
||||
<i class="el-icon-location"></i>
|
||||
<span>导航一</span>
|
||||
</template>
|
||||
<el-menu-item-group>
|
||||
<template slot="title">分组一</template>
|
||||
<el-menu-item index="1-1">选项1</el-menu-item>
|
||||
<el-menu-item index="1-2">选项2</el-menu-item>
|
||||
</el-menu-item-group>
|
||||
<el-menu-item-group title="分组2">
|
||||
<el-menu-item index="1-3">选项3</el-menu-item>
|
||||
</el-menu-item-group>
|
||||
<el-submenu index="1-4">
|
||||
<template slot="title">选项4</template>
|
||||
<el-menu-item index="1-4-1">选项1</el-menu-item>
|
||||
</el-submenu>
|
||||
</el-submenu>
|
||||
<el-menu-item index="2">
|
||||
<i class="el-icon-menu"></i>
|
||||
<span slot="title">导航二</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3">
|
||||
<i class="el-icon-setting"></i>
|
||||
<span slot="title">导航三</span>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-aside>-->
|
||||
|
||||
<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-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-col>
|
||||
<el-col :md="14" :lg="14" :xl="14" :sm="18" :xs="23" offset="1">
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<template>
|
||||
<el-table :data="tableHomeworkData" style="width: 100%">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
<el-form label-position="left" inline class="demo-table-expand">
|
||||
<el-form-item label="科目">
|
||||
<span>{{ props.row.subject }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="作业名称">
|
||||
<span>{{ props.row.name }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="内容">
|
||||
<span>{{ props.row.name }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="提交时间">
|
||||
<span>{{ props.row.date }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="特殊要求">
|
||||
<span>{{ props.row.remark }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="模板下载">
|
||||
<span>{{ props.row.tempfile }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="科目" prop="subject">
|
||||
</el-table-column>
|
||||
<el-table-column label="作业名称" prop="name">
|
||||
</el-table-column>
|
||||
<el-table-column label="内容" prop="content">
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="dialogVisible = true" type="success" plain
|
||||
size="small">
|
||||
上传作业
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--<el-table :data="tableData1" style="width: 100%">
|
||||
<el-table-column prop="subject" label="科目">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="作业名称">
|
||||
</el-table-column>
|
||||
<el-table-column prop="content" label="内容">
|
||||
</el-table-column>
|
||||
<el-table-column prop="date" label="提交时间">
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="dialogVisible = true" type="success" plain
|
||||
size="small">
|
||||
查看详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>-->
|
||||
</template>
|
||||
<el-dialog title="上传作业" :visible.sync="dialogVisible" width="50%"
|
||||
:before-close="dialogClose">
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<span>上传文件</span>
|
||||
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<el-upload class="upload-demo" ref="upload"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove" :file-list="fileList" :auto-upload="false"
|
||||
name="imageFile">
|
||||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
|
||||
<el-button style="margin-left: 10px;" size="small" type="success"
|
||||
@click="submitUpload">
|
||||
上传到服务器
|
||||
</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!--<el-row>
|
||||
<el-col :md="12" :lg="12" :xl="12">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<el-upload class="upload-demo" ref="upload"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove" :file-list="fileList" :auto-upload="false"
|
||||
name="imageFile">
|
||||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
|
||||
<el-button style="margin-left: 10px;" size="small" type="success"
|
||||
@click="submitUpload">
|
||||
上传到服务器
|
||||
</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>-->
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<el-table :data="DownloadList" height="350" border style="width: 100%">
|
||||
<el-table-column label="已提交的文件">
|
||||
<el-table-column prop="colfilename" label="文件名" width="180">
|
||||
</el-table-column>
|
||||
<el-table-column prop="colfilesize" label="大小" width="80">
|
||||
</el-table-column>
|
||||
<el-table-column prop="colip" label="地址">
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleClick(scope.row)" type="success" plain
|
||||
size="small">
|
||||
下载
|
||||
</el-button>
|
||||
<el-button type="danger" plain size="small">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :md="5" :lg="5" :sm="5" :xl="5" class="hidden-xs-only">
|
||||
<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 v-for="o in 4" :key="o" class="text item">
|
||||
{{'倒计时 ' + o }}
|
||||
</div>
|
||||
</el-card>
|
||||
<!--<template>
|
||||
<el-table :data="tableData2" style="width: 100%">
|
||||
<el-table-column prop="date" label="作业提交倒计时">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>-->
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-card class="box-card hidden-xs-only">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>公告</span>
|
||||
</div>
|
||||
<div v-for="o in 4" :key="o" class="text item">
|
||||
{{'公告内容 ' + o }}
|
||||
</div>
|
||||
</el-card>
|
||||
<!--<template>
|
||||
<el-table :data="tableData3" style="width: 100%">
|
||||
<el-table-column label="公告">
|
||||
<el-table-column prop="date" label="公告内容">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="公告内容时间">
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>-->
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-main>
|
||||
<el-footer>
|
||||
<div class="footer">
|
||||
© 2018 作业提交系统
|
||||
</div></el-footer>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
<!--<div th:include="/dist/thymeleaf/footer :: copyright"></div>-->
|
||||
<script th:src="@{js/homePage.js}"></script>
|
||||
<script th:src="@{js/msg.js}"></script>
|
||||
</body>
|
||||
|
||||
@@ -7,6 +7,7 @@
|
||||
<link rel="stylesheet" type="text/css" href="styles.css">
|
||||
-->
|
||||
<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>
|
||||
|
||||
@@ -17,7 +18,7 @@
|
||||
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
|
||||
<div id="app">
|
||||
<el-container>
|
||||
<el-aside width="200px">
|
||||
<!--<el-aside width="200px">
|
||||
<el-row class="tac">
|
||||
<el-col :span="24">
|
||||
<h5>默认颜色</h5>
|
||||
@@ -51,28 +52,121 @@
|
||||
</el-menu>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-aside>
|
||||
</el-aside>-->
|
||||
|
||||
<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-menu-item index="1">首页</el-menu-item>
|
||||
<el-submenu index="2">
|
||||
<template slot="title">我的工作台</template>
|
||||
<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"><a href="login.jsp">登出</a></el-menu-item>
|
||||
<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-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-col>
|
||||
<el-col :md="14" :lg="14" :xl="14" :sm="18" :xs="23" offset="1">
|
||||
<el-row>
|
||||
<el-col :md="12" :lg="12" :xl="12">
|
||||
<el-col :span="23">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<el-upload class="upload-demo" ref="upload" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview"
|
||||
:on-remove="handleRemove" :file-list="fileList" :auto-upload="false" name="imageFile">
|
||||
<template>
|
||||
<el-table :data="tableHomeworkData" style="width: 100%">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
<el-form label-position="left" inline class="demo-table-expand">
|
||||
<el-form-item label="科目">
|
||||
<span>{{ props.row.subject }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="作业名称">
|
||||
<span>{{ props.row.name }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="内容">
|
||||
<span>{{ props.row.name }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="提交时间">
|
||||
<span>{{ props.row.date }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="特殊要求">
|
||||
<span>{{ props.row.remark }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="模板下载">
|
||||
<span>{{ props.row.tempfile }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="科目" prop="subject">
|
||||
</el-table-column>
|
||||
<el-table-column label="作业名称" prop="name">
|
||||
</el-table-column>
|
||||
<el-table-column label="内容" prop="content">
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="dialogVisible = true" type="success" plain
|
||||
size="small">
|
||||
上传作业
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--<el-table :data="tableData1" style="width: 100%">
|
||||
<el-table-column prop="subject" label="科目">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="作业名称">
|
||||
</el-table-column>
|
||||
<el-table-column prop="content" label="内容">
|
||||
</el-table-column>
|
||||
<el-table-column prop="date" label="提交时间">
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="dialogVisible = true" type="success" plain
|
||||
size="small">
|
||||
查看详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>-->
|
||||
</template>
|
||||
<el-dialog title="上传作业" :visible.sync="dialogVisible" width="50%"
|
||||
:before-close="dialogClose">
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<span>上传文件</span>
|
||||
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<el-upload class="upload-demo" ref="upload"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove" :file-list="fileList" :auto-upload="false"
|
||||
name="imageFile">
|
||||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
|
||||
<el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">
|
||||
<el-button style="margin-left: 10px;" size="small" type="success"
|
||||
@click="submitUpload">
|
||||
上传到服务器
|
||||
</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
@@ -80,10 +174,37 @@
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :md="24" :lg="12" :xl="12">
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!--<el-row>
|
||||
<el-col :md="12" :lg="12" :xl="12">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<el-table :data="DownloadList" height="250" border style="width: 100%">
|
||||
<el-upload class="upload-demo" ref="upload"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove" :file-list="fileList" :auto-upload="false"
|
||||
name="imageFile">
|
||||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
|
||||
<el-button style="margin-left: 10px;" size="small" type="success"
|
||||
@click="submitUpload">
|
||||
上传到服务器
|
||||
</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>-->
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<div class="grid-content bg-purple-dark">
|
||||
<el-table :data="DownloadList" height="350" border style="width: 100%">
|
||||
<el-table-column label="已提交的文件">
|
||||
<el-table-column prop="colfilename" label="文件名" width="180">
|
||||
</el-table-column>
|
||||
<el-table-column prop="colfilesize" label="大小" width="80">
|
||||
@@ -92,17 +213,66 @@
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleClick(scope.row)" type="success" plain size="small">
|
||||
<el-button @click="handleClick(scope.row)" type="success" plain
|
||||
size="small">
|
||||
下载
|
||||
</el-button>
|
||||
<el-button type="danger" plain size="small">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :md="5" :lg="5" :sm="5" :xl="5" class="hidden-xs-only">
|
||||
<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 v-for="o in 4" :key="o" class="text item">
|
||||
{{'倒计时 ' + o }}
|
||||
</div>
|
||||
</el-card>
|
||||
<!--<template>
|
||||
<el-table :data="tableData2" style="width: 100%">
|
||||
<el-table-column prop="date" label="作业提交倒计时">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>-->
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-card class="box-card hidden-xs-only">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>公告</span>
|
||||
</div>
|
||||
<div v-for="o in 4" :key="o" class="text item">
|
||||
{{'公告内容 ' + o }}
|
||||
</div>
|
||||
</el-card>
|
||||
<!--<template>
|
||||
<el-table :data="tableData3" style="width: 100%">
|
||||
<el-table-column label="公告">
|
||||
<el-table-column prop="date" label="公告内容">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="公告内容时间">
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>-->
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-main>
|
||||
<el-footer>
|
||||
<div class="footer">
|
||||
© 2018 作业提交系统
|
||||
</div></el-footer>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user