| | |
| | | <template slot="default"> |
| | | <div v-if="!isImportOrExport" class="dialog-content"> |
| | | <el-upload |
| | | ref="uploadRef" |
| | | ref="upload" |
| | | class="upload-demo" |
| | | :action="uploadUrl" |
| | | :action="upload.url" |
| | | :limit="1" |
| | | :accept="accept" |
| | | :headers="uploadHeaders" |
| | | :disabled="uploadIsUploading" |
| | | :headers="upload.headers" |
| | | :disabled="upload.isUploading" |
| | | :on-progress="handleFileUploadProgress" |
| | | :on-success="handleFileSuccess" |
| | | :auto-upload="false" |
| | |
| | | </div> |
| | | <div v-else-if="isImportOrExport" class="dialog-content"> |
| | | <el-button class="export-button" @click="handleDownloadTargetList">导出目标列表内容</el-button> |
| | | <el-button class="export-button">导出所有列表内容</el-button> |
| | | <el-button class="export-button">导出目标项目详情</el-button> |
| | | <el-button class="export-button">导出所有项目详情</el-button> |
| | | <el-button class="export-button" @click="handleDownloadAllList">导出所有列表内容</el-button> |
| | | <el-button class="export-button" @click="handleDownloadDetailList">导出目标项目详情</el-button> |
| | | <el-button class="export-button" @click="handleDownloadAllList">导出所有项目详情</el-button> |
| | | </div> |
| | | </template> |
| | | <template slot="footer"> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { globalHeaders } from '@/utils/request'; |
| | | |
| | | import {getToken} from "@/utils/auth"; |
| | | |
| | | export default { |
| | |
| | | default: function () { |
| | | return []; |
| | | } |
| | | } |
| | | }, |
| | | dataIdList: { |
| | | type: Array, |
| | | default: function () { |
| | | return []; |
| | | } |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | | uploadRef: null, |
| | | queryParams: {}, |
| | | targetColumn: [], |
| | | accept: `.zip`, |
| | | uploadUrl: '/project/import', |
| | | uploadHeaders: {}, |
| | | uploadIsUploading: false |
| | | upload:{ |
| | | // 是否显示弹出层(用户导入) |
| | | open: false, |
| | | // 弹出层标题(用户导入) |
| | | title: '', |
| | | // 是否禁用上传 |
| | | isUploading: false, |
| | | // 设置上传的请求头部 |
| | | headers: { Authorization: "Bearer " + getToken() }, |
| | | // 上传的地址 |
| | | url: process.env.VUE_APP_BASE_API + '/project/info/import' |
| | | }, |
| | | }; |
| | | }, |
| | | methods: { |
| | |
| | | console.log("子组件submit") |
| | | }, |
| | | handleFileUploadProgress() { |
| | | this.uploadIsUploading = true; |
| | | this.upload.uploadIsUploading = true; |
| | | }, |
| | | handleFileSuccess(response, file) { |
| | | this.uploadIsUploading = false; |
| | | if (this.uploadRef) { |
| | | this.uploadRef.handleRemove(file); |
| | | } |
| | | if (response.code === 200) { |
| | | this.$emit('fileDialogCancel'); |
| | | this.$message({ |
| | | message: response.msg, |
| | | type: 'success' |
| | | }); |
| | | } else { |
| | | this.$message.error(response.msg); |
| | | } |
| | | // 文件上传成功处理 |
| | | handleFileSuccess(response, file, fileList) { |
| | | this.upload.open = false; |
| | | this.upload.isUploading = false; |
| | | this.$refs.upload.clearFiles(); |
| | | this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true }); |
| | | }, |
| | | handleDownloadFile() { |
| | | // fetch(`${process.env.VITE_APP_BASE_API}/project/info/export/template`, { |
| | | // method: 'GET', |
| | | // headers: self.upload.headers |
| | | // }) |
| | | // .then(response => response.blob()) |
| | | // .then(blob => { |
| | | // const url = window.URL.createObjectURL(blob); |
| | | // const a = document.createElement('a'); |
| | | // a.style.display = 'none'; |
| | | // a.href = url; |
| | | // a.download = `项目文件模板_${new Date().getTime()}.zip`; |
| | | // document.body.appendChild(a); |
| | | // a.click(); |
| | | // window.URL.revokeObjectURL(url); |
| | | // }) |
| | | // .catch(error => { |
| | | // console.error('文件下载失败:', error); |
| | | // }); |
| | | |
| | | const url = process.env.VUE_APP_BASE_API + '/project/info/export/template'; |
| | | axios.post(url, [], { // 发送一个空数组而不是空对象 |
| | | responseType: 'blob', // 告诉axios期望服务器返回的是blob类型 |
| | | headers: { |
| | | 'Content-Type': 'application/json', |
| | | Authorization: "Bearer " + getToken() |
| | | } |
| | | }) |
| | | .then(response => { |
| | | // 处理文件下载 |
| | | const blob = new Blob([response.data], { type: 'application/zip' }); // 指定MIME类型为zip |
| | | const url = window.URL.createObjectURL(blob); |
| | | const a = document.createElement('a'); |
| | | a.style.display = 'none'; |
| | | a.href = url; |
| | | a.download = `项目文件模板_${new Date().getTime()}.zip`; |
| | | document.body.appendChild(a); |
| | | a.click(); |
| | | document.body.removeChild(a); |
| | | window.URL.revokeObjectURL(url); |
| | | }) |
| | | .catch(error => { |
| | | console.error('There was an error!', error); |
| | | }); |
| | | this.download('/project/info/export/template', {}, `项目文件模板_${new Date().getTime()}.zip`) |
| | | }, |
| | | submitFileForm() { |
| | | if (this.uploadRef) { |
| | | this.uploadRef.submit(); |
| | | } |
| | | this.$refs.upload.submit(); |
| | | }, |
| | | closeDialog() { |
| | | this.$emit('fileDialogCancel'); |
| | | }, |
| | | handleDownloadTargetList() { |
| | | console.log('导出目标列表内容', this.currentColumns); |
| | | this.targetColumn = this.currentColumns.filter(item => item.visible); |
| | | this.queryParams.fieldList = this.currentColumns.filter(item => item.visible).map(item =>item.id); |
| | | this.queryParams.requireFile = false; |
| | | this.download('project/info/export', { |
| | | ...this.queryParams |
| | | }, `项目库${new Date().getTime()}.xlsx`) |
| | | }, |
| | | handleDownloadAllList() { |
| | | this.queryParams.fieldList = this.currentColumns; |
| | | this.queryParams.requireFile = false; |
| | | this.download('project/info/export', { |
| | | ...this.queryParams |
| | | }, `项目库${new Date().getTime()}.xlsx`) |
| | | }, |
| | | handleDownloadDetailList() { |
| | | this.queryParams.dataIdList = this.dataIdList |
| | | this.queryParams.requireFile = true; |
| | | this.download('project/info/export', { |
| | | ...this.queryParams |
| | | }, `项目库${new Date().getTime()}.zip`) |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.uploadRef = this.$refs.uploadRef; |
| | | }, |
| | | created() { |
| | | |
| | | this.isFileDialogVisible = this.fileDialogVisible; |
| | | } |
| | | }; |
| | | </script> |
| | | |