KAZ/webtransfer
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' of https://github.com/Pl4yep2on/webtransfer into dev

Browse Source
This commit is contained in:
Alexandre_BRAVO 2024-12-02 14:32:14 +01:00
commit 50fa1dedd0
6 changed files with 19 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/App.vue
View File

@ -1,15 +1,15 @@
<template> <template>
<div id="app" class="h-full w-full bg-black/80"> <div id="app" class="h-full w-full dark:bg-black/80 bg-white/80">
<!-- Conteneur principal, ajustement en flex-row à partir de sm --> <!-- Conteneur principal, ajustement en flex-row à partir de sm -->
<div class="h-full w-full flex flex-col sm:flex-row"> <div class="h-full w-full flex flex-col sm:flex-row">
<!-- Première section --> <!-- Première section -->
<div <div
class="w-full sm:w-1/3 max-sm:h-2/5 p-4 sm:m-6 sm:mr-0 rounded-xl bg-NcBlack/40"> class="w-full sm:w-1/3 max-sm:h-2/5 p-4 sm:m-6 sm:mr-0 rounded-xl dark:bg-NcBlack/40 bg-white/80">
<WebContentViewer :translate="translate" @zip-upload="handleZipUpload" @file-upload="handleFileUpload" @dragEnded="toggleDragEnded" zipUrl="http://localhost:8000/dummyZip.zip"/> <WebContentViewer :translate="translate" @zip-upload="handleZipUpload" @file-upload="handleFileUpload" @dragEnded="toggleDragEnded" zipUrl="http://localhost:8000/dummyZip.zip"/>
</div> </div>
<!-- Deuxième section --> <!-- Deuxième section -->
<div <div
class="w-full sm:w-2/3 max-sm:h-3/5 p-4 sm:m-6 sm:ml-4 bg-NcBlack rounded-xl"> class="w-full sm:w-2/3 max-sm:h-3/5 p-4 sm:m-6 sm:ml-4 dark:bg-NcBlack bg-white rounded-xl">
<FileTable :file="sharedFile" :zip="zip" :dragEnded="dragEnded" :translate="translate" @dragEnded="toggleDragEnded"/> <FileTable :file="sharedFile" :zip="zip" :dragEnded="dragEnded" :translate="translate" @dragEnded="toggleDragEnded"/>
</div> </div>
</div> </div>

2
src/components/EditFileName.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="fixed inset-0 flex items-center justify-center bg-gray-700 bg-opacity-50 z-50" @click="closeModal"> <div class="fixed inset-0 flex items-center justify-center bg-gray-700 bg-opacity-50 z-50" @click="closeModal">
<div class="bg-NcBlack rounded-lg shadow-lg p-6 w-96" @click.stop> <div class="dark:bg-NcBlack bg-white rounded-lg shadow-lg p-6 w-96" @click.stop>
<h2 class="text-lg font-semibold mb-4">{{ translate('modify.file.name') }}</h2> <h2 class="text-lg font-semibold mb-4">{{ translate('modify.file.name') }}</h2>
<input <input
type="text" type="text"

6
src/components/FileExistsDialog.vue
View File

@ -1,6 +1,6 @@
<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 && !displayOverwrite" class="bg-NcBlack rounded-lg shadow-lg p-6 w-96"> <div v-if="!displayRename && !displayOverwrite" class="dark:bg-NcBlack bg-white rounded-lg shadow-lg p-6 w-96">
<h2 class="text-lg font-semibold mb-4">{{ translate('file.already.exist') }}</h2> <h2 class="text-lg font-semibold mb-4">{{ translate('file.already.exist') }}</h2>
<p>{{ translate('file.pt.1') }}{{ fileName }}{{ translate('file.pt.2') }}</p> <p>{{ translate('file.pt.1') }}{{ fileName }}{{ translate('file.pt.2') }}</p>
<div class="flex justify-end mt-4 space-x-2"> <div class="flex justify-end mt-4 space-x-2">
@ -11,7 +11,7 @@
</div> </div>
<!-- Renommer le fichier --> <!-- Renommer le fichier -->
<div v-if="displayRename" class="bg-NcBlack rounded-lg shadow-lg p-6 w-96"> <div v-if="displayRename" class="dark:bg-NcBlack bg-white rounded-lg shadow-lg p-6 w-96">
<h2 class="text-lg font-semibold mb-4">{{ translate('change.file.name') }}</h2> <h2 class="text-lg font-semibold mb-4">{{ translate('change.file.name') }}</h2>
<input <input
type="text" type="text"
@ -28,7 +28,7 @@
</div> </div>
<!-- Appliquer l'ecrasement a tous --> <!-- Appliquer l'ecrasement a tous -->
<div v-if="displayOverwrite" class="bg-NcBlack rounded-lg shadow-lg p-6 w-96"> <div v-if="displayOverwrite" class="dark:bg-NcBlack bg-white rounded-lg shadow-lg p-6 w-96">
<h2 class="text-lg font-semibold mb-4">{{ translate('you.are.going.to.erase.file.folder') }}</h2> <h2 class="text-lg font-semibold mb-4">{{ translate('you.are.going.to.erase.file.folder') }}</h2>
<div class="flex items-center content-evenly"> <div class="flex items-center content-evenly">
<input type="checkbox" v-model="forAll" /> <input type="checkbox" v-model="forAll" />

14
src/components/FileTable.vue
View File

@ -44,7 +44,7 @@
<!-- Popup pour la création de fichier --> <!-- Popup pour la création de fichier -->
<div v-if="isAddFilePopupVisible" <div v-if="isAddFilePopupVisible"
class="fixed inset-0 flex items-center justify-center bg-gray-700 bg-opacity-50 z-50"> class="fixed inset-0 flex items-center justify-center bg-gray-700 bg-opacity-50 z-50">
<div class="bg-NcBlack rounded-lg shadow-lg p-6 w-96"> <div class="dark:bg-NcBlack bg-white rounded-lg shadow-lg p-6 w-96">
<h2 class="text-lg font-semibold mb-4">{{ translate('create.new.file') }}</h2> <h2 class="text-lg font-semibold mb-4">{{ translate('create.new.file') }}</h2>
<input v-model="newFileName" type="text" :placeholder="translate('name.of.file')" <input v-model="newFileName" type="text" :placeholder="translate('name.of.file')"
class="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" /> class="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" />
@ -78,12 +78,12 @@
@dragleave.prevent="onDragLeave($event)" @dragend="onDragEnd"> @dragleave.prevent="onDragLeave($event)" @dragend="onDragEnd">
<div v-for="file in files" :key="file.filename" <div v-for="file in files" :key="file.filename"
class="flex h-16 items-center hover:bg-NcGray rounded-lg border-b last:border-b-0 border-gray-300" class="flex h-16 items-center dark:hover:bg-NcGray hover:bg-NcWhite rounded-lg border-b last:border-b-0 border-gray-300 cursor-pointer"
@click="handleClickElem(file)"> @click="handleClickElem(file)">
<!-- Nom --> <!-- Nom -->
<div class="w-7/12 flex items-center px-4 py-2 border-r border-gray-300"> <div class="w-7/12 flex items-center px-4 py-2 border-r border-gray-300 cursor-pointer">
<div class="w-12 h-12 flex items-center justify-center"> <div class="w-12 h-12 flex items-center justify-cente cursor-pointer">
<template v-if="file.type === 'directory'"> <template v-if="file.type === 'directory'">
<svg fill="currentColor" viewBox="0 0 24 24" class="text-NcBlue w-10 h-10 "> <svg fill="currentColor" viewBox="0 0 24 24" class="text-NcBlue w-10 h-10 ">
<path <path
@ -92,7 +92,7 @@
</svg> </svg>
</template> </template>
<template v-if="file.type === 'file' && file.basename.split('.').pop() !== 'zip'"> <template v-if="file.type === 'file' && file.basename.split('.').pop() !== 'zip'">
<div :class="['flex items-center justify-center']"> <div :class="['flex items-center justify-center cursor-pointer']">
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" <svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xml:space="preserve"
class="w-10 h-10" class="w-10 h-10"
style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"> style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2">
@ -114,12 +114,12 @@
</div> </div>
<!-- Type --> <!-- Type -->
<div class="w-2/12 px-4 py-2 border-r border-gray-300"> <div class="w-2/12 px-4 py-2 border-r border-gray-300 cursor-pointer">
{{ file.type === 'directory' ? 'Dossier' : 'Fichier' }} {{ file.type === 'directory' ? 'Dossier' : 'Fichier' }}
</div> </div>
<!-- Taille --> <!-- Taille -->
<div class="w-2/12 px-4 py-2"> <div class="w-2/12 px-4 py-2 cursor-pointer">
{{ file.type === 'directory' ? '-' : formatFileSize(file.size) }} {{ file.type === 'directory' ? '-' : formatFileSize(file.size) }}
</div> </div>

6
src/components/WebContentViewer.vue
View File

@ -6,7 +6,7 @@
</div> </div>
<!-- Fichier .zip --> <!-- Fichier .zip -->
<div class="flex h-16 hover:bg-NcGray items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300" v-if="!isLoading && zipContent.length !== 0" <div class="flex h-16 dark:hover:bg-NcGray hover:bg-NcWhite items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300" v-if="!isLoading && zipContent.length !== 0"
draggable="true" @dragstart="dragZip()" @dragend="onDragEnd"> draggable="true" @dragstart="dragZip()" @dragend="onDragEnd">
<template> <template>
<div class="flex items-center justify-center cursor-pointer"> <div class="flex items-center justify-center cursor-pointer">
@ -28,7 +28,7 @@
<div v-if="!isLoading && zipContent.length !== 0" class="overflow-y-auto h-full"> <div v-if="!isLoading && zipContent.length !== 0" class="overflow-y-auto h-full">
<div v-for="(file, index) in sortedFiles" :key="file.fullPath" class="flex flex-col"> <div v-for="(file, index) in sortedFiles" :key="file.fullPath" class="flex flex-col">
<div class="flex h-16 hover:bg-NcGray items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300" <div class="flex h-16 dark:hover:bg-NcGray hover:bg-NcWhite items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300"
:style="{ :style="{
'padding-left': `${0.5 * (file.depth + 1)}rem` 'padding-left': `${0.5 * (file.depth + 1)}rem`
}" }"
@ -55,7 +55,7 @@
<div class="w-1/6 px-4 py-2 cursor-pointer">-</div> <div class="w-1/6 px-4 py-2 cursor-pointer">-</div>
</div> </div>
<div class="flex h-16 hover:bg-NcGray items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300" <div class="flex h-16 dark:hover:bg-NcGray hover:bg-NcWhite items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300"
:style="{ :style="{
'padding-left': `${0.5 * (file.depth + 1)}rem` 'padding-left': `${0.5 * (file.depth + 1)}rem`
}" }"

2
tailwind.config.js
View File

@ -4,12 +4,14 @@ module.exports = {
"./src/**/*.{html,js,jsx,vue}", // Fichiers dans le dossier `src` "./src/**/*.{html,js,jsx,vue}", // Fichiers dans le dossier `src`
"./templates/**/*.{html,php}", // Fichiers dans le dossier `templates` "./templates/**/*.{html,php}", // Fichiers dans le dossier `templates`
], ],
darkMode: ['selector', '[data-themes="dark"], [data-themes="default"]'],
theme: { theme: {
extend: { extend: {
colors: { colors: {
NcBlack: '#171717', NcBlack: '#171717',
NcBlue: '#0072c3', NcBlue: '#0072c3',
NcGray: '#212121', NcGray: '#212121',
NcWhite: '#ededed',
}, },
}, },
}, },