|
|
|
|
@ -17,7 +17,7 @@ |
|
|
|
|
<el-table-column prop="createTime" label="导入时间" 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 |
|
|
|
|
{{ (scope.row.fileSize / 1024 / 1024).toFixed(3) }}MB |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column prop="fileFormat" label="格式" width="100" align="center"></el-table-column> |
|
|
|
|
@ -66,13 +66,13 @@ |
|
|
|
|
:props="{ |
|
|
|
|
label: 'categoryName' |
|
|
|
|
}" |
|
|
|
|
@node-click="getTable" |
|
|
|
|
@node-click="typeClick" |
|
|
|
|
> |
|
|
|
|
</el-tree> |
|
|
|
|
</div> |
|
|
|
|
<el-main style="padding-top: 0;padding-bottom: 0;"> |
|
|
|
|
<el-card shadow="hover"> |
|
|
|
|
<el-input style="width: 250px;margin-bottom: 15px;" placeholder="请输入表名称" v-model="keyword" suffix-icon="el-icon-search" clearable size="small"></el-input> |
|
|
|
|
<el-input style="width: 250px;margin-bottom: 15px;" placeholder="请输入表名称" v-model="keywordTable" suffix-icon="el-icon-search" clearable size="small"></el-input> |
|
|
|
|
<el-table :data="tables" class="cus-table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange"> |
|
|
|
|
<el-table-column width="40" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
@ -108,15 +108,22 @@ |
|
|
|
|
</el-container> |
|
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
|
<el-button @click="importVisible = false">取 消</el-button> |
|
|
|
|
<el-button type="primary" :loading="submited" @click="confirmImport">确 定</el-button> |
|
|
|
|
<el-button class="cus-btn" type="primary" :loading="submited" @click="confirmImport">确 定</el-button> |
|
|
|
|
</span> |
|
|
|
|
</el-dialog> |
|
|
|
|
<el-dialog title="预览" :visible.sync="previewVisible" width="60%" center :close-on-click-modal="false"> |
|
|
|
|
<el-table :data="previewData" class="table" stripe header-align="center" row-key="id"> |
|
|
|
|
<el-table :data="previewData" class="cus-table" stripe header-align="center" row-key="id"> |
|
|
|
|
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column> |
|
|
|
|
<el-table-column v-for="(item,index) in previewHead" :prop="item.field" :key="index" :label="item.comment" align="center"></el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
</el-dialog> |
|
|
|
|
<!-- 购买弹框 --> |
|
|
|
|
<el-dialog title="温馨提示" :visible.sync="buyVisible" width="400px" center :close-on-click-modal="false"> |
|
|
|
|
<div class="buy"> |
|
|
|
|
<p class="tips">当前院校暂未购买该数据库，请扫码咨询购买</p> |
|
|
|
|
<img src="@/assets/images/wechat-code.jpeg" alt=""> |
|
|
|
|
</div> |
|
|
|
|
</el-dialog> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
@ -160,18 +167,25 @@ export default { |
|
|
|
|
previewVisible: false, |
|
|
|
|
previewHead: [], |
|
|
|
|
previewData: [], |
|
|
|
|
buyVisible: false |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
components: { |
|
|
|
|
breadcrumb |
|
|
|
|
}, |
|
|
|
|
watch: { |
|
|
|
|
keyword: function(val) { |
|
|
|
|
clearTimeout(this.searchTimer) |
|
|
|
|
this.searchTimer = setTimeout(() => { |
|
|
|
|
this.initData() |
|
|
|
|
},500) |
|
|
|
|
} |
|
|
|
|
keyword: function(val) { |
|
|
|
|
clearTimeout(this.searchTimer) |
|
|
|
|
this.searchTimer = setTimeout(() => { |
|
|
|
|
this.initData() |
|
|
|
|
},500) |
|
|
|
|
}, |
|
|
|
|
keywordTable: function(val) { |
|
|
|
|
clearTimeout(this.searchTimer) |
|
|
|
|
this.searchTimer = setTimeout(() => { |
|
|
|
|
this.initTable() |
|
|
|
|
},500) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
created() { |
|
|
|
|
this.loading = true |
|
|
|
|
@ -282,17 +296,27 @@ export default { |
|
|
|
|
this.curTable = '' |
|
|
|
|
this.tables = [] |
|
|
|
|
this.importLoading = true |
|
|
|
|
this.importVisible = true |
|
|
|
|
this.$post(this.api.getDataProductBoughtByOurSchool).then(({ data }) => { |
|
|
|
|
this.importTypeList = data |
|
|
|
|
this.importLoading = false |
|
|
|
|
if (data.length) { |
|
|
|
|
this.importVisible = true |
|
|
|
|
} else { |
|
|
|
|
this.buyVisible = true |
|
|
|
|
// this.$message.error('当前院校暂未购买该数据库，请购买后再尝试') |
|
|
|
|
} |
|
|
|
|
}).catch(res => { |
|
|
|
|
this.importLoading = false |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
// 分类点击回调 |
|
|
|
|
typeClick() { |
|
|
|
|
this.keywordTable = '' |
|
|
|
|
this.getTable() |
|
|
|
|
}, |
|
|
|
|
// 查询分类下的表 |
|
|
|
|
getTable(){ |
|
|
|
|
this.$post(`${this.api.getPurchasedTableByCategory}?categoryId=${this.$refs.typeTree.getCurrentKey()}&pageNum=${this.pageTable}&pageSize=${this.pageSizeTable}`).then(({ data }) => { |
|
|
|
|
this.$post(`${this.api.getPurchasedTableByCategory}?categoryId=${this.$refs.typeTree.getCurrentKey()}&pageNum=${this.pageTable}&pageSize=${this.pageSizeTable}&name=${this.keywordTable}`).then(({ data }) => { |
|
|
|
|
const list = data.records |
|
|
|
|
list.map(e => { |
|
|
|
|
// 开始结束日期不用显示时间，所以只需要截取日期 |
|
|
|
|
@ -310,42 +334,39 @@ export default { |
|
|
|
|
this.totalTable = data.total |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
}, |
|
|
|
|
// 重置表分页 |
|
|
|
|
initTable() { |
|
|
|
|
this.pageTable = 1 |
|
|
|
|
this.getTable() |
|
|
|
|
}, |
|
|
|
|
handleCurrentChangeTable(val) { |
|
|
|
|
this.pageTable = val |
|
|
|
|
this.getTable() |
|
|
|
|
}, |
|
|
|
|
// 预览 |
|
|
|
|
preview(row){ |
|
|
|
|
this.$get(`${this.api.previewData}?tableName=${row.name}&tableId=${row.id}`).then(res => { |
|
|
|
|
let comment = res.comment |
|
|
|
|
let previewHead = [] |
|
|
|
|
this.curComment = comment // 用来修改表头的，先保存完整的表头，修改表头的时候需要传给后端 |
|
|
|
|
comment.map(n => { |
|
|
|
|
// 表格上不用展示id和操作时间 |
|
|
|
|
n.field != 'id' && n.field != 'operation_time' && previewHead.push(n) |
|
|
|
|
}) |
|
|
|
|
this.previewHead = previewHead |
|
|
|
|
|
|
|
|
|
let data = res.data |
|
|
|
|
// 如果是自定义表头，则在数据最前面加个custom的行，用来修改表头 |
|
|
|
|
isEdit && data.unshift({ |
|
|
|
|
custom: true |
|
|
|
|
}) |
|
|
|
|
data.map(n => { |
|
|
|
|
for(let i in n){ |
|
|
|
|
// 如果是以+0000结尾的,就表明这个是时间,则转化为正常的时间格式 |
|
|
|
|
if(typeof n[i] == 'string' && n[i].endsWith('+0000')) n[i] = this.formatDate('yyyy-MM-dd hh:mm:ss',new Date(n[i])) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
this.previewData = data |
|
|
|
|
this.previewVisible = true // 非自定义表头进来的，才需要显示预览弹框 |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
this.$get(`${this.api.previewData}?tableName=${row.name}&tableId=${row.id}`).then(({ comment, data }) => { |
|
|
|
|
let previewHead = [] |
|
|
|
|
comment.map(n => { |
|
|
|
|
// 表格上不用展示id和操作时间 |
|
|
|
|
n.field != 'id' && n.field != 'operation_time' && previewHead.push(n) |
|
|
|
|
}) |
|
|
|
|
this.previewHead = previewHead |
|
|
|
|
data.map(n => { |
|
|
|
|
for(let i in n){ |
|
|
|
|
// 如果是以+0000结尾的,就表明这个是时间,则转化为正常的时间格式 |
|
|
|
|
if(typeof n[i] == 'string' && n[i].endsWith('+0000')) n[i] = this.formatDate('yyyy-MM-dd hh:mm:ss',new Date(n[i])) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
this.previewData = data |
|
|
|
|
this.previewVisible = true |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
}, |
|
|
|
|
// 上传到python数据列表 |
|
|
|
|
importData(file) { |
|
|
|
|
importData(file, row) { |
|
|
|
|
this.$post(this.api.importData, { |
|
|
|
|
fileFormat: file.fileType || file.fileFormat, |
|
|
|
|
fileName: file.originalFileName || file.fileName, |
|
|
|
|
fileName: row.tableComment || file.fileName, |
|
|
|
|
filePath: file.fileUrl || file.filePath, |
|
|
|
|
fileSize: file.fileSize, |
|
|
|
|
ossFileName: file.ossFileName |
|
|
|
|
@ -371,7 +392,7 @@ export default { |
|
|
|
|
const { name } = row |
|
|
|
|
this.submited = true |
|
|
|
|
// 查询某表的Excel文件是否存在 |
|
|
|
|
this.$post(`${this.api.lookupTableFile}?tableName=${name}`).then(({ data }) => { |
|
|
|
|
this.$post(`${this.api.lookupTableFile}?tableName=${row.tableComment}`).then(({ data }) => { |
|
|
|
|
// 如果不存在，则下载该表并上传到阿里云 |
|
|
|
|
if (!data) { |
|
|
|
|
// 通过预览接口获取字段 |
|
|
|
|
@ -387,7 +408,7 @@ export default { |
|
|
|
|
// 把该表上传到阿里云 |
|
|
|
|
const form = new FormData() |
|
|
|
|
form.append('file', new Blob([res.data], {type: 'application/vnd.ms-excel'})) |
|
|
|
|
form.append('tableName', name) |
|
|
|
|
form.append('tableName', row.name.replace(/(\r|\n)+/, '')) |
|
|
|
|
form.append('token', this.token) |
|
|
|
|
axios({ |
|
|
|
|
method: 'post', |
|
|
|
|
@ -398,7 +419,7 @@ export default { |
|
|
|
|
'Content-Type': 'multipart/form-data' |
|
|
|
|
}, |
|
|
|
|
}).then(({ data }) => { |
|
|
|
|
this.importData(data.filesResult) |
|
|
|
|
this.importData(data.filesResult, row) |
|
|
|
|
}).catch(res => { |
|
|
|
|
this.submited = false |
|
|
|
|
}) |
|
|
|
|
@ -410,7 +431,7 @@ export default { |
|
|
|
|
}) |
|
|
|
|
} else { |
|
|
|
|
// 如果数据库里已经有这个表，则直接调导入数据的接口 |
|
|
|
|
this.importData(data) |
|
|
|
|
this.importData(data, {}) |
|
|
|
|
} |
|
|
|
|
}).catch(res => { |
|
|
|
|
this.submited = false |
|
|
|
|
@ -456,9 +477,12 @@ export default { |
|
|
|
|
display: inline-flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
height: 100px; |
|
|
|
|
border: 1px solid #ccc; |
|
|
|
|
height: 80px; |
|
|
|
|
font-size: 16px; |
|
|
|
|
color: #333; |
|
|
|
|
border-radius: 8px; |
|
|
|
|
background-color: #F6F8FA; |
|
|
|
|
border: 1px solid transparent; |
|
|
|
|
cursor: pointer; |
|
|
|
|
img { |
|
|
|
|
width: 90%; |
|
|
|
|
@ -477,9 +501,29 @@ export default { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.buy { |
|
|
|
|
text-align: center; |
|
|
|
|
.tips { |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
} |
|
|
|
|
img { |
|
|
|
|
width: 85%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/deep/.check-table { |
|
|
|
|
.el-radio__label { |
|
|
|
|
display: none; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/deep/.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content { |
|
|
|
|
background-color: #e8f0ff; |
|
|
|
|
} |
|
|
|
|
/deep/.el-radio__input.is-checked .el-radio__inner { |
|
|
|
|
border-color: #007eff; |
|
|
|
|
background: #007eff; |
|
|
|
|
} |
|
|
|
|
/deep/.el-radio__inner:hover { |
|
|
|
|
border-color: #007eff; |
|
|
|
|
} |
|
|
|
|
</style> |
