ajout composant fileExistsDialog (non fonctionnel)

This commit is contained in:
Alexandre_BRAVO 2024-11-25 18:23:00 +01:00
parent cf18c7638e
commit 5625de925a
3 changed files with 36 additions and 9 deletions

View File

@ -1,17 +1,17 @@
<template> <template>
<div class="fixed inset-0 flex items-center justify-center bg-gray-700 bg-opacity-50 z-50"> <div class="fixed inset-0 flex items-center justify-center bg-gray-700 bg-opacity-50 z-50">
<div v-if="!displayRename" class="bg-NcBlack rounded-lg shadow-lg p-6 w-96"> <div v-if="!displayRename && !displayOverwrite" class="bg-NcBlack rounded-lg shadow-lg p-6 w-96">
<h2 class="text-lg font-semibold mb-4">Le fichier existe déjà</h2> <h2 class="text-lg font-semibold mb-4">Le fichier existe déjà</h2>
<p>Le fichier "{{ fileName }}" existe déjà. Que voulez-vous faire ?</p> <p>Le fichier "{{ fileName }}" existe déjà. Que voulez-vous faire ?</p>
<div class="flex justify-end mt-4 space-x-2"> <div class="flex justify-end mt-4 space-x-2">
<button @click="onOverwrite">Écraser</button> <button @click="toggleOverwrite">Écraser</button>
<button @click="toggleRename">Renommer</button> <button @click="toggleRename">Renommer</button>
<button @click="onCancel">Annuler</button> <button @click="onCancel">Annuler</button>
</div> </div>
</div> </div>
<!-- Renommer le fichier --> <!-- Renommer le fichier -->
<div v-else class="bg-NcBlack rounded-lg shadow-lg p-6 w-96"> <div v-if="displayRename" class="bg-NcBlack rounded-lg shadow-lg p-6 w-96">
<h2 class="text-lg font-semibold mb-4">Modifier le nom du fichier</h2> <h2 class="text-lg font-semibold mb-4">Modifier le nom du fichier</h2>
<input <input
type="text" type="text"
@ -26,6 +26,18 @@
<button @click="toggleRename" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300 transition">Annuler</button> <button @click="toggleRename" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300 transition">Annuler</button>
</div> </div>
</div> </div>
<!-- Appliquer l'ecrasement a tous -->
<div v-if="displayOverwrite" class="bg-NcBlack rounded-lg shadow-lg p-6 w-96">
<div class="flex items-center content-evenly">
<input type="checkbox" v-model="forAll" />
<p>Appliquer à tous</p>
</div>
<div class="flex justify-end mt-4 space-x-2">
<button @click="onOverwrite" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300 transition">Valider</button>
<button @click="toggleOverwrite" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300 transition">Annuler</button>
</div>
</div>
</div> </div>
</template> </template>
@ -50,6 +62,8 @@ export default {
return { return {
displayRename: false, displayRename: false,
displayOverwrite: false,
forAll: false,
oldFileName, oldFileName,
newFileName, newFileName,
extension, extension,
@ -57,7 +71,7 @@ export default {
}, },
methods: { methods: {
onOverwrite() { onOverwrite() {
this.$emit('overwrite', {forAll : false}); this.$emit('overwrite', {forAll : this.forAll});
}, },
onCancel() { onCancel() {
this.$emit('cancel'); this.$emit('cancel');
@ -65,6 +79,9 @@ export default {
toggleRename() { toggleRename() {
this.displayRename = !this.displayRename; this.displayRename = !this.displayRename;
}, },
toggleOverwrite(){
this.displayOverwrite = !this.displayOverwrite;
},
save() { save() {
if(this.newFileName !== ''){ if(this.newFileName !== ''){
// Séparer le nom de fichier sans l'extension // Séparer le nom de fichier sans l'extension
@ -77,8 +94,7 @@ export default {
this.newFileName = newFileNameWithOriginalExtension; this.newFileName = newFileNameWithOriginalExtension;
} }
this.$emit("rename", { initialFileName: this.initialFileName, newFileName: this.newFileName }); this.$emit("rename", { oldFileName: this.oldFileName, newFileName: this.newFileName });
this.onCancel();
} }
}, },
onInputChange() { onInputChange() {

View File

@ -120,7 +120,7 @@
<EditFileName v-if="!editDialogDisabled" :initialFileName="initialFileName" :isDirectory="isDirectory" @update="updateFileName" @close="closeEditDialog"> <EditFileName v-if="!editDialogDisabled" :initialFileName="initialFileName" :isDirectory="isDirectory" @update="updateFileName" @close="closeEditDialog">
</EditFileName> </EditFileName>
<FileExistsDialog v-if="!fileExistDialogDisabled" :fileName="initialFileName" @overwrite="" @rename="" @cancel="fileExistDialogDisabled = true"> <FileExistsDialog v-if="!fileExistDialogDisabled" :fileName="initialFileName" @overwrite="" @rename="" @cancel="closeFileExistsDialog">
</FileExistsDialog> </FileExistsDialog>
</div> </div>
</template> </template>
@ -192,7 +192,7 @@ export default {
async fetchFiles() { async fetchFiles() {
try { try {
const client = getClient(); const client = getClient();
const directoryItems = await client.getDirectoryContents(this.root_path + this.current_dir); // Remplacez "admin" par le nom de l'utilisateur courant const directoryItems = await client.getDirectoryContents(this.root_path + this.current_dir);
this.files = directoryItems.map(file => ({ this.files = directoryItems.map(file => ({
basename: file.basename, basename: file.basename,
@ -425,6 +425,9 @@ export default {
closeEditDialog() { closeEditDialog() {
this.editDialogDisabled = true; this.editDialogDisabled = true;
}, },
closeFileExistsDialog() {
this.fileExistDialogDisabled = true;
},
/** /**
* Change le nom du fichier sur le serveur Cloud via un client WebDAV * Change le nom du fichier sur le serveur Cloud via un client WebDAV
* @param names Contient un initialFileName et un newFileName * @param names Contient un initialFileName et un newFileName

View File

@ -741,6 +741,14 @@ video {
flex-direction: column; flex-direction: column;
} }
.content-center {
align-content: center;
}
.content-evenly {
align-content: space-evenly;
}
.items-start { .items-start {
align-items: flex-start; align-items: flex-start;
} }