transfer folder content
This commit is contained in:
parent
cbf9641e5a
commit
0516a73a2d
@ -133,6 +133,7 @@ export default {
|
||||
breadcrumbParts: [],
|
||||
isAddFilePopupVisible: false,
|
||||
newFileName: '',
|
||||
isTransfering: false,
|
||||
};
|
||||
},
|
||||
async mounted() {
|
||||
@ -171,6 +172,7 @@ export default {
|
||||
return this.current_dir.split('/').filter(part => part);
|
||||
},
|
||||
async handleClickElem(file) {
|
||||
if (this.isTransfering) return;
|
||||
if (file.type === 'directory') {
|
||||
this.current_dir = this.current_dir === '/' ? '/' + file.basename : this.current_dir + '/' + file.basename;
|
||||
this.breadcrumbParts = this.getBreadcrumbParts()
|
||||
@ -180,6 +182,7 @@ export default {
|
||||
}
|
||||
},
|
||||
async handleClickBreadcrumb(index) {
|
||||
if (this.isTransfering) return;
|
||||
let dir = '/';
|
||||
if (index >= -1) {
|
||||
dir = this.generateCrumbHref(index);
|
||||
@ -207,31 +210,78 @@ export default {
|
||||
},
|
||||
async onDrop(event) {
|
||||
event.preventDefault();
|
||||
|
||||
try {
|
||||
const moveFilesOfFolder = async (folder) => {
|
||||
|
||||
await this.createFolder(folder);
|
||||
|
||||
for (const child of folder.children) {
|
||||
if (child.isDirectory) {
|
||||
await moveFilesOfFolder(child);
|
||||
} else {
|
||||
if (child.content && typeof child.content.arrayBuffer === 'function') {
|
||||
child.content = await child.content.arrayBuffer();
|
||||
}
|
||||
await this.moveFileToTarget(child);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
this.isTransfering = true;
|
||||
const file = this.file;
|
||||
if (!file) return;
|
||||
console.log('Fichier déposé :', file);
|
||||
file.content = await file.content.arrayBuffer();
|
||||
await this.moveFileToTarget(file);
|
||||
|
||||
if (file.isDirectory) {
|
||||
await moveFilesOfFolder(file);
|
||||
} else {
|
||||
if (file.content && typeof file.content.arrayBuffer === 'function') {
|
||||
file.content = await file.content.arrayBuffer();
|
||||
}
|
||||
await this.moveFileToTarget(file);
|
||||
}
|
||||
|
||||
this.isTransfering = false;
|
||||
|
||||
} catch (error) {
|
||||
console.error('Erreur lors du drag and drop :', error);
|
||||
console.error('Erreur lors du drop :', error);
|
||||
}
|
||||
},
|
||||
async moveFileToTarget(file) {
|
||||
try {
|
||||
const client = getClient();
|
||||
const path = this.root_path + this.current_dir + file.name;
|
||||
|
||||
// Assurez-vous que le chemin parent est correctement formaté
|
||||
const parentPath = file.parentPath ? `${file.parentPath}/` : '';
|
||||
const fullPath = `${this.root_path}${this.current_dir}${parentPath}${file.name}`;
|
||||
|
||||
if (ArrayBuffer.isView(file.content)) {
|
||||
file.content = Buffer.from(file.content);
|
||||
}
|
||||
|
||||
await client.putFileContents(path, file.content);
|
||||
// Évitez les chemins incorrects en utilisant `path.normalize` si disponible
|
||||
await client.putFileContents(fullPath, file.content);
|
||||
|
||||
// Recharge les fichiers après l'opération
|
||||
await this.fetchFiles();
|
||||
} catch (error) {
|
||||
console.error('Erreur lors du déplacement du fichier:', error);
|
||||
}
|
||||
},
|
||||
async createFolder(folder) {
|
||||
try {
|
||||
const client = getClient();
|
||||
|
||||
// Assurez-vous que le chemin parent est correctement formaté
|
||||
const parentPath = folder.parentPath ? `${folder.parentPath}/` : '';
|
||||
const fullPath = `${this.root_path}${this.current_dir}${parentPath}${folder.name}/`;
|
||||
|
||||
await client.createDirectory(fullPath);
|
||||
await this.fetchFiles();
|
||||
} catch (error) {
|
||||
console.error('Erreur lors de la création du dossier :', error);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
@ -32,7 +32,7 @@
|
||||
class="text-NcBlue w-6 h-6"
|
||||
/>
|
||||
</div>
|
||||
<span class="ml-2 truncate cursor-pointer">{{ file.fullPath }}</span>
|
||||
<span class="ml-2 truncate cursor-pointer">{{ file.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-1/6 px-4 py-2 cursor-pointer">-</div>
|
||||
@ -56,7 +56,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<div class="w-4/6 flex items-center px-4 py-2 truncate cursor-pointer">
|
||||
{{ file.fullPath }}
|
||||
{{ file.name }}
|
||||
</div>
|
||||
<div class="w-2/6 py-2 cursor-pointer">
|
||||
{{ formatFileSize(file.size) }}
|
||||
@ -69,9 +69,10 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import JSZip from 'jszip';
|
||||
import JSZip, { files } from 'jszip';
|
||||
import ChevronRightIcon from 'vue-material-design-icons/ChevronRight.vue';
|
||||
import ChevronDownIcon from 'vue-material-design-icons/ChevronDown.vue';
|
||||
import path from 'path';
|
||||
|
||||
export default {
|
||||
name: 'WebContentViewer',
|
||||
@ -156,11 +157,13 @@ export default {
|
||||
|
||||
if (!existing) {
|
||||
existing = {
|
||||
name: partName,
|
||||
name: pathParts[i],
|
||||
isDirectory,
|
||||
size: isDirectory ? 0 : file._data.uncompressedSize,
|
||||
content: isDirectory ? null : '', // Initialiser 'content' pour les fichiers
|
||||
children: isDirectory ? [] : null,
|
||||
//remove the name of the file from the path
|
||||
parentPath: pathParts.slice(0, i).join('/'),
|
||||
unzip: promise
|
||||
};
|
||||
currentLevel.push(existing);
|
||||
@ -206,9 +209,35 @@ export default {
|
||||
},
|
||||
async onDragStart(file) {
|
||||
console.log('Drag start', file);
|
||||
await file.unzip;
|
||||
this.$emit('file-upload', file);
|
||||
}
|
||||
|
||||
const getFilesFromFolder = (folder) => {
|
||||
const files = [];
|
||||
if (!folder.children || folder.children.length === 0) return files;
|
||||
|
||||
for (let i = 0; i < folder.children.length; i++) {
|
||||
const child = folder.children[i];
|
||||
if (child.isDirectory) {
|
||||
files.push(...getFilesFromFolder(child));
|
||||
} else {
|
||||
files.push(child);
|
||||
}
|
||||
}
|
||||
return files;
|
||||
};
|
||||
|
||||
try {
|
||||
if (file.isDirectory) {
|
||||
const files = getFilesFromFolder(file);
|
||||
const filesToUnzip = files.map(file => file.unzip);
|
||||
await Promise.all(filesToUnzip);
|
||||
} else {
|
||||
await file.unzip;
|
||||
}
|
||||
this.$emit('file-upload', file);
|
||||
} catch (error) {
|
||||
console.error('Erreur lors du drag start :', error);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
Loading…
x
Reference in New Issue
Block a user