|
|
|
@ -78,9 +78,82 @@ |
|
|
|
@click="handleImportRelation">导入文献 |
|
|
|
</el-button> |
|
|
|
|
|
|
|
<!-- <el-button v-hasPermi="['system:SysPoint:add']" type="info" plain style="float: left" icon="el-icon-upload2" size="mini"--> |
|
|
|
<!-- @click="handleImportRelation2">导入txt--> |
|
|
|
<!-- </el-button>--> |
|
|
|
<!-- 文件夹上传弹窗 --> |
|
|
|
<el-dialog |
|
|
|
title="选择文件夹" |
|
|
|
:visible.sync="dialogVisible" |
|
|
|
width="50%" |
|
|
|
:close-on-click-modal="false" |
|
|
|
@close="cancelSelect" |
|
|
|
:destroy-on-close="true" |
|
|
|
> |
|
|
|
<div class="folder-upload-container"> |
|
|
|
<!-- 隐藏的原生 input --> |
|
|
|
<input |
|
|
|
type="file" |
|
|
|
ref="folderInput" |
|
|
|
webkitdirectory |
|
|
|
directory |
|
|
|
multiple |
|
|
|
@change="handleFolderSelect" |
|
|
|
style="display: none" |
|
|
|
/> |
|
|
|
<el-radio-group v-model="type" style="margin-bottom: 5px"> |
|
|
|
<el-radio-button label="CNKI"></el-radio-button> |
|
|
|
<el-radio-button label="万方"></el-radio-button> |
|
|
|
<el-radio-button label="维普"></el-radio-button> |
|
|
|
<el-radio-button label="军事"></el-radio-button> |
|
|
|
</el-radio-group> |
|
|
|
<!-- 美观的上传区域 --> |
|
|
|
<el-card shadow="hover" class="upload-card"> |
|
|
|
<div |
|
|
|
class="upload-area" |
|
|
|
@click="triggerFileInput" |
|
|
|
v-if="selectedFiles.length === 0" |
|
|
|
> |
|
|
|
<i class="el-icon-folder-opened upload-icon"></i> |
|
|
|
<p class="tip">点击选择文件夹，或拖拽文件夹到此处</p> |
|
|
|
<p class="sub-tip">支持文件夹上传（Chrome/Edge/Firefox）</p> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 已选择文件列表 --> |
|
|
|
<div v-else> |
|
|
|
<p class="selected-title">已选择 {{ selectedFiles.length }} 个文件</p> |
|
|
|
<el-scrollbar style="max-height: 300px"> |
|
|
|
<div class="file-list"> |
|
|
|
<div |
|
|
|
class="file-item" |
|
|
|
v-for="(file, index) in selectedFiles" |
|
|
|
:key="index" |
|
|
|
> |
|
|
|
<i class="el-icon-document"></i> |
|
|
|
<span class="file-name">{{ file.webkitRelativePath }}</span> |
|
|
|
<i |
|
|
|
class="el-icon-close delete-icon" |
|
|
|
@click="removeFile(index)" |
|
|
|
></i> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-scrollbar> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 操作按钮 --> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
<el-button @click="cancelSelect">取消</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
@click="uploadFolder" |
|
|
|
:disabled="selectedFiles.length === 0" |
|
|
|
> |
|
|
|
开始上传 |
|
|
|
</el-button> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
<el-button v-hasPermi="['system:SysPoint:add']" type="info" plain style="float: left" icon="el-icon-upload2" size="mini" |
|
|
|
@click="dialogVisible = true">导入txt |
|
|
|
</el-button> |
|
|
|
|
|
|
|
<!-- <el-col :span="1.5">--> |
|
|
|
<!-- <el-button--> |
|
|
|
@ -198,11 +271,15 @@ |
|
|
|
|
|
|
|
<script> |
|
|
|
import {listSysPoint, getSysPoint, delSysPoint, addSysPoint, updateSysPoint, deleteAll} from "@/api/system/SysPoint"; |
|
|
|
import {uploadFolder} from "../../../api/system/file"; |
|
|
|
|
|
|
|
export default { |
|
|
|
name: "SysPoint", |
|
|
|
data() { |
|
|
|
return { |
|
|
|
dialogVisible: false, |
|
|
|
selectedFiles:[], |
|
|
|
type:"CNKI", |
|
|
|
upload1: { |
|
|
|
tip: "准备上传文件", |
|
|
|
open: false, |
|
|
|
@ -263,6 +340,74 @@ export default { |
|
|
|
this.getList(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
cancelSelect() { |
|
|
|
this.selectedFiles = []; |
|
|
|
if (this.$refs.folderInput) { |
|
|
|
this.$refs.folderInput.value = ''; |
|
|
|
} |
|
|
|
this.dialogVisible = false; |
|
|
|
}, |
|
|
|
removeFile(index) { |
|
|
|
this.selectedFiles.splice(index, 1); |
|
|
|
// 可选：如果全部删完了，可以自动触发重新选择（非必须） |
|
|
|
// if (this.selectedFiles.length === 0) { |
|
|
|
// this.$refs.folderInput.value = ''; // 清空 input |
|
|
|
// } |
|
|
|
}, |
|
|
|
// 触发隐藏的文件输入框 |
|
|
|
triggerFileInput() { |
|
|
|
this.$refs.folderInput.click(); |
|
|
|
}, |
|
|
|
|
|
|
|
// 处理文件夹选择（变量名不变） |
|
|
|
handleFolderSelect(e) { |
|
|
|
const files = e.target.files; |
|
|
|
this.selectedFiles = Array.from(files); |
|
|
|
this.$message({ |
|
|
|
message: `已选择 ${files.length} 个文件`, |
|
|
|
type: 'success' |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 上传文件夹（变量名不变） |
|
|
|
async uploadFolder() { |
|
|
|
if (this.selectedFiles.length === 0) { |
|
|
|
this.$message.warning('请先选择一个文件夹'); |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
const formData = new FormData(); |
|
|
|
this.selectedFiles.forEach(file => { |
|
|
|
formData.append('files', file, file.webkitRelativePath); |
|
|
|
}); |
|
|
|
|
|
|
|
try { |
|
|
|
formData.append("type",this.type) |
|
|
|
const response = await uploadFolder(formData); |
|
|
|
|
|
|
|
// ✅ 正确：检查后端返回的业务 code |
|
|
|
if (response.code === 200) { |
|
|
|
this.$message.success(response.data.message || '上传成功！'); |
|
|
|
this.dialogVisible = false; |
|
|
|
this.selectedFiles = []; |
|
|
|
} else { |
|
|
|
this.$message.error(response.data.message || '上传失败'); |
|
|
|
} |
|
|
|
} catch (error) { |
|
|
|
console.error('上传出错:', error); |
|
|
|
|
|
|
|
// 更详细的错误提示 |
|
|
|
if (error.response) { |
|
|
|
// 请求发出去了，但返回非 2xx |
|
|
|
this.$message.error(`服务器错误: ${error.response.status}`); |
|
|
|
} else if (error.request) { |
|
|
|
// 请求发不出去（如网络问题、服务未启动） |
|
|
|
this.$message.error('网络错误'); |
|
|
|
} else { |
|
|
|
this.$message.error('请求异常'); |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
handleFileSuccess1(response, file, fileList) { |
|
|
|
this.upload1.open = false; |
|
|
|
this.upload1.isUploading = false; |
|
|
|
@ -413,3 +558,102 @@ export default { |
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style scoped> |
|
|
|
.template-list::v-deep .el-table td, |
|
|
|
.template-list::v-deep .el-table th { |
|
|
|
font-size: 1vw !important; |
|
|
|
color: #67C23A; |
|
|
|
} |
|
|
|
.upload-card { |
|
|
|
border: 1px dashed #d9d9d9; |
|
|
|
border-radius: 8px; |
|
|
|
} |
|
|
|
|
|
|
|
.upload-area { |
|
|
|
text-align: center; |
|
|
|
padding: 40px 20px; |
|
|
|
cursor: pointer; |
|
|
|
color: #606266; |
|
|
|
} |
|
|
|
|
|
|
|
.upload-area:hover { |
|
|
|
background: #f5f7fa; |
|
|
|
} |
|
|
|
.upload-icon { |
|
|
|
font-size: 48px; |
|
|
|
color: #409eff; |
|
|
|
margin-bottom: 10px; |
|
|
|
} |
|
|
|
|
|
|
|
.tip { |
|
|
|
font-size: 16px; |
|
|
|
margin: 0; |
|
|
|
color: #303133; |
|
|
|
} |
|
|
|
|
|
|
|
.sub-tip { |
|
|
|
font-size: 13px; |
|
|
|
color: #909399; |
|
|
|
margin-top: 5px; |
|
|
|
} |
|
|
|
|
|
|
|
.selected-title { |
|
|
|
font-size: 14px; |
|
|
|
color: #303133; |
|
|
|
margin-bottom: 10px; |
|
|
|
} |
|
|
|
|
|
|
|
.file-list { |
|
|
|
padding: 0; |
|
|
|
list-style: none; |
|
|
|
} |
|
|
|
|
|
|
|
.file-item { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
padding: 6px 10px; |
|
|
|
font-size: 14px; |
|
|
|
color: #606266; |
|
|
|
border-bottom: 1px solid #eee; |
|
|
|
} |
|
|
|
|
|
|
|
.file-item i { |
|
|
|
color: #909399; |
|
|
|
margin-right: 8px; |
|
|
|
} |
|
|
|
|
|
|
|
.file-name { |
|
|
|
font-size: 13px; |
|
|
|
color: #333; |
|
|
|
word-break: break-all; |
|
|
|
} |
|
|
|
|
|
|
|
.dialog-footer { |
|
|
|
text-align: right; |
|
|
|
} |
|
|
|
.file-item { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
padding: 6px 0; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
|
|
|
|
.file-name { |
|
|
|
flex: 1; |
|
|
|
margin-left: 8px; |
|
|
|
white-space: nowrap; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
} |
|
|
|
|
|
|
|
.delete-icon { |
|
|
|
font-size: 14px; |
|
|
|
color: #909399; |
|
|
|
cursor: pointer; |
|
|
|
margin-left: 8px; |
|
|
|
} |
|
|
|
|
|
|
|
.delete-icon:hover { |
|
|
|
color: #f56c6c; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
