|
|
@ -1,10 +1,11 @@ |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<div class="wrap"> |
|
|
|
<div class="wrap"> |
|
|
|
<div class="inner"> |
|
|
|
<div class="inner"> |
|
|
|
|
|
|
|
<el-page-header @back="$router.back()" content="我的数据"></el-page-header> |
|
|
|
<div class="tool"> |
|
|
|
<div class="tool"> |
|
|
|
<el-input style="width: 250px" placeholder="请输入文件名称" v-model="keyword" suffix-icon="el-icon-search" clearable size="small"></el-input> |
|
|
|
<el-input style="width: 250px" placeholder="请输入文件名称" v-model="keyword" suffix-icon="el-icon-search" clearable size="small"></el-input> |
|
|
|
<div class="action"> |
|
|
|
<div class="action"> |
|
|
|
<el-upload :headers="{token}" :action="api.fileUpload" name="file" :limit="1" :show-file-list="false" :before-upload="beforeImport" :on-success="successImport"> |
|
|
|
<el-upload :headers="{token}" :action="api.fileUpload" name="file" :limit="1000" :show-file-list="false" :before-upload="beforeImport" :on-success="successImport"> |
|
|
|
<el-button type="primary" size="small">导入数据</el-button> |
|
|
|
<el-button type="primary" size="small">导入数据</el-button> |
|
|
|
</el-upload> |
|
|
|
</el-upload> |
|
|
|
<el-button style="margin-left: 10px;" type="danger" size="small" @click="delAll">批量删除</el-button> |
|
|
|
<el-button style="margin-left: 10px;" type="danger" size="small" @click="delAll">批量删除</el-button> |
|
|
@ -14,9 +15,13 @@ |
|
|
|
<el-table :data="list" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange"> |
|
|
|
<el-table :data="list" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange"> |
|
|
|
<el-table-column type="selection" width="80" align="center"></el-table-column> |
|
|
|
<el-table-column type="selection" width="80" align="center"></el-table-column> |
|
|
|
<el-table-column type="index" label="序号" width="55" align="center"></el-table-column> |
|
|
|
<el-table-column type="index" label="序号" width="55" align="center"></el-table-column> |
|
|
|
<el-table-column prop="fileName" label="文件名称" align="center"></el-table-column> |
|
|
|
<el-table-column prop="fileName" label="文件名称" align="center" show-overflow-tooltip></el-table-column> |
|
|
|
<el-table-column prop="createTime" label="导入时间" align="center"></el-table-column> |
|
|
|
<el-table-column prop="createTime" label="导入时间" align="center"></el-table-column> |
|
|
|
<el-table-column prop="fileSize" label="文件大小" width="120" align="center"></el-table-column> |
|
|
|
<el-table-column prop="fileSize" label="文件大小" width="120" align="center"> |
|
|
|
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
|
|
|
{{ (scope.row.fileSize / 1024 / 1024).toFixed(2) }}MB |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="fileFormat" label="格式" width="100" align="center"></el-table-column> |
|
|
|
<el-table-column prop="fileFormat" label="格式" width="100" align="center"></el-table-column> |
|
|
|
<el-table-column label="文件路径" align="center"> |
|
|
|
<el-table-column label="文件路径" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<template slot-scope="scope"> |
|
|
@ -81,12 +86,11 @@ export default { |
|
|
|
// 导入前的钩子 |
|
|
|
// 导入前的钩子 |
|
|
|
beforeImport(file) { |
|
|
|
beforeImport(file) { |
|
|
|
const { size, name } = file |
|
|
|
const { size, name } = file |
|
|
|
console.log(size, name) |
|
|
|
|
|
|
|
if (util.isVideo(name.substring(name.lastIndexOf('.') + 1))) { |
|
|
|
if (util.isVideo(name.substring(name.lastIndexOf('.') + 1))) { |
|
|
|
this.$message.error('不支持上传视频,请选择其他文件!') |
|
|
|
this.$message.error('不支持上传视频,请选择其他文件!') |
|
|
|
return false |
|
|
|
return false |
|
|
|
} |
|
|
|
} |
|
|
|
if (size / 1000000 > 10) { |
|
|
|
if (size / 1024 / 1024 > 10) { |
|
|
|
this.$message.error('请上传10M以内的文件!') |
|
|
|
this.$message.error('请上传10M以内的文件!') |
|
|
|
return false |
|
|
|
return false |
|
|
|
} |
|
|
|
} |
|
|
@ -171,7 +175,7 @@ export default { |
|
|
|
.tool { |
|
|
|
.tool { |
|
|
|
display: flex; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
justify-content: space-between; |
|
|
|
margin-bottom: 20px; |
|
|
|
margin: 20px 0; |
|
|
|
} |
|
|
|
} |
|
|
|
.action { |
|
|
|
.action { |
|
|
|
display: inline-flex; |
|
|
|
display: inline-flex; |
|
|
|