From 145dbf06c42324c2eeff303ccf1b0414f33f6593 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期六, 23 十一月 2024 16:23:12 +0800
Subject: [PATCH] Merge branch 'master' of http://42.193.1.25:9521/r/project_management-vue
---
src/views/projectEngineering/component/FileDialog.vue | 107 ++++++++++++++++++++---------------------------------
1 files changed, 41 insertions(+), 66 deletions(-)
diff --git a/src/views/projectEngineering/component/FileDialog.vue b/src/views/projectEngineering/component/FileDialog.vue
index 31395be..d06e5bd 100644
--- a/src/views/projectEngineering/component/FileDialog.vue
+++ b/src/views/projectEngineering/component/FileDialog.vue
@@ -1,3 +1,4 @@
+
<template>
<div>
<el-dialog
@@ -8,7 +9,7 @@
close-on-click-modal
@close="closeDialog"
>
- <template slot="header">
+ <template slot="title">
<span style="padding-bottom: 18px">
{{ isImportOrExport ? '璇锋寜鐓ч渶姹傚鍑虹洰鏍囧唴瀹�' : '璇锋寜鐓фā鏉挎牱寮忎笂浼犻」鐩枃浠�' }}
</span>
@@ -18,17 +19,17 @@
<el-upload
ref="uploadRef"
class="upload-demo"
- :action="upload.url"
+ :action="uploadUrl"
:limit="1"
:accept="accept"
- :headers="upload.headers"
- :disabled="upload.isUploading"
+ :headers=" uploadHeaders"
+ :disabled="uploadIsUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:auto-upload="false"
drag
>
- <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+ <i class="el-icon-upload"></i>
<div class="el-upload__text">璇蜂笂浼�<em>Zip</em>鏂囦欢锛屽ぇ灏忓湪<em>100M</em>浠ュ唴</div>
</el-upload>
<span>浠呭厑璁稿鍏ip鏍煎紡鏂囦欢銆�</span>
@@ -53,15 +54,10 @@
</template>
<script>
-// import UploadFilled from '@element/icons-vue/es/icons/UploadFilled.vue';
import { globalHeaders } from '@/utils/request';
-import { FileTypeEnum } from '@/enums/fileType';
export default {
name: 'FileDialog',
- // components: {
- // UploadFilled
- // },
props: {
isImportOrExport: {
type: Boolean,
@@ -82,49 +78,18 @@
return {
uploadRef: null,
targetColumn: [],
- accept: `${FileTypeEnum.ZIP}`,
- upload: {
- open: false,
- title: '',
- isUploading: false,
- updateSupport: 0,
- headers: globalHeaders(),
- url: process.env.VITE_APP_BASE_API + '/project/import'
- }
+ accept: `.zip`,
+ uploadUrl: '/project/import',
+ uploadHeaders: globalHeaders(),
+ uploadIsUploading: false
};
- },
- computed: {
- // In Vue 2, computed properties don't use setters and getters as objects.
- // Instead, you define them as functions for reading and use methods for writing.
- // However, in this case, we can use a watcher to update the prop.
- fileDialogVisible: {
- get() {
- return this.isFileDialogVisible;
- },
- set(value) {
- this.$emit('update:fileDialogVisible', value);
- }
- }
- // Note: In Vue 2, you cannot directly define a computed property with a setter for a prop.
- // Instead, you should use a watcher or a method to handle changes.
- // Since `fileDialogVisible` is a prop, we'll use a watcher to sync it with the internal state.
- // However, for simplicity, we'll rename `fileDialogVisible` to `isFileDialogVisible` in data and use a watcher.
- },
- watch: {
- fileDialogVisible(newVal) {
- this.isFileDialogVisible = newVal;
- },
- isFileDialogVisible(newVal) {
- this.$emit('update:fileDialogVisible', newVal);
- }
},
methods: {
handleFileUploadProgress() {
- this.upload.isUploading = true;
+ this.uploadIsUploading = true;
},
handleFileSuccess(response, file) {
- this.upload.open = false;
- this.upload.isUploading = false;
+ this.uploadIsUploading = false;
if (this.uploadRef) {
this.uploadRef.handleRemove(file);
}
@@ -140,24 +105,24 @@
},
handleDownloadFile() {
const self = this;
- fetch(`${process.env.VITE_APP_BASE_API}/project/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);
- });
+ // fetch(`${process.env.VITE_APP_BASE_API}/project/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);
+ // });
},
submitFileForm() {
if (this.uploadRef) {
@@ -172,8 +137,11 @@
this.targetColumn = this.currentColumns.filter(item => item.visible);
}
},
+ mounted() {
+ this.uploadRef = this.$refs.uploadRef;
+ },
created() {
- // Initialize the computed property as a data property in Vue 2
+
this.isFileDialogVisible = this.fileDialogVisible;
}
};
@@ -186,6 +154,7 @@
align-items: center;
flex-direction: column;
height: 300px;
+
.export-button {
margin-left: 0;
margin-bottom: 10px;
@@ -198,4 +167,10 @@
.upload-demo {
width: 100%;
}
+::v-deep .el-upload{
+ width: 100%;
+}
+::v-deep .el-upload .el-upload-dragger{
+ width: 100%;
+}
</style>
--
Gitblit v1.8.0