feat: Ordner-Freigaben zeigen Dateiliste + Download/Loeschen
Share-Links fuer Ordner verhalten sich jetzt je nach Berechtigung: read (Nur Lesen): - Zeigt alle Dateien im Ordner mit Name, Groesse, Typ - Download-Button pro Datei - Kein Upload, kein Loeschen write (Lesen+Schreiben): - Zeigt alle Dateien im Ordner - Download-Button pro Datei - Loeschen-Button pro Datei - Upload-Zone (Drag & Drop + Button) - Nach Upload wird Dateiliste automatisch aktualisiert upload_only (Nur Upload): - Kein Dateilisting, kein Ordnername sichtbar - Nur Upload-Zone Backend-Endpunkte: - GET /share/<token>/files - Dateien im geteilten Ordner auflisten - GET /share/<token>/files/<id>/download - Einzeldatei herunterladen - DELETE /share/<token>/files/<id> - Datei loeschen (nur write) - Alle Endpunkte pruefen Passwort, Ablaufdatum und Berechtigung - Dateien muessen direkte Kinder des geteilten Ordners sein (kein Ausbruch) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Stefan Hacker
parent
38d6acb1a1
commit
7a26788ad2
|
|
@ -503,6 +503,121 @@ def share_info(token):
|
|||
}), 200
|
||||
|
||||
|
||||
@api_bp.route('/share/<token>/files', methods=['GET'])
|
||||
def share_list_files(token):
|
||||
"""List files in a shared folder (read or write permission required)."""
|
||||
link = ShareLink.query.filter_by(token=token).first()
|
||||
if not link:
|
||||
return jsonify({'error': 'Link nicht gefunden'}), 404
|
||||
|
||||
if link.is_expired():
|
||||
return jsonify({'error': 'Link abgelaufen'}), 410
|
||||
|
||||
if link.permission == 'upload_only':
|
||||
return jsonify({'error': 'Dieser Link erlaubt keinen Einblick'}), 403
|
||||
|
||||
# Check password via header
|
||||
if link.password_hash:
|
||||
password = request.args.get('password', '') or request.headers.get('X-Share-Password', '')
|
||||
if not bcrypt.check_password_hash(link.password_hash, password):
|
||||
return jsonify({'error': 'Passwort erforderlich'}), 401
|
||||
|
||||
f = db.session.get(File, link.file_id)
|
||||
if not f.is_folder:
|
||||
return jsonify({'error': 'Kein Ordner'}), 400
|
||||
|
||||
files = File.query.filter_by(parent_id=f.id)\
|
||||
.order_by(File.is_folder.desc(), File.name).all()
|
||||
|
||||
return jsonify([{
|
||||
'id': fi.id,
|
||||
'name': fi.name,
|
||||
'is_folder': fi.is_folder,
|
||||
'size': fi.size,
|
||||
'mime_type': fi.mime_type,
|
||||
'updated_at': fi.updated_at.isoformat() if fi.updated_at else None,
|
||||
} for fi in files]), 200
|
||||
|
||||
|
||||
@api_bp.route('/share/<token>/files/<int:file_id>/download', methods=['GET'])
|
||||
def share_download_file(token, file_id):
|
||||
"""Download a specific file from a shared folder."""
|
||||
link = ShareLink.query.filter_by(token=token).first()
|
||||
if not link:
|
||||
return jsonify({'error': 'Link nicht gefunden'}), 404
|
||||
|
||||
if link.is_expired():
|
||||
return jsonify({'error': 'Link abgelaufen'}), 410
|
||||
|
||||
if link.permission not in ('read', 'write'):
|
||||
return jsonify({'error': 'Download nicht erlaubt'}), 403
|
||||
|
||||
if link.password_hash:
|
||||
password = request.args.get('password', '') or request.headers.get('X-Share-Password', '')
|
||||
if not bcrypt.check_password_hash(link.password_hash, password):
|
||||
return jsonify({'error': 'Passwort erforderlich'}), 401
|
||||
|
||||
# Verify file belongs to the shared folder
|
||||
target_file = db.session.get(File, file_id)
|
||||
if not target_file:
|
||||
return jsonify({'error': 'Datei nicht gefunden'}), 404
|
||||
|
||||
# Check file is inside shared folder (direct child)
|
||||
shared_folder = db.session.get(File, link.file_id)
|
||||
if target_file.parent_id != shared_folder.id:
|
||||
return jsonify({'error': 'Datei gehoert nicht zu diesem Ordner'}), 403
|
||||
|
||||
if target_file.is_folder:
|
||||
return jsonify({'error': 'Ordner koennen nicht heruntergeladen werden'}), 400
|
||||
|
||||
filepath = Path(current_app.config['UPLOAD_PATH']) / str(target_file.owner_id) / target_file.storage_path
|
||||
if not filepath.exists():
|
||||
return jsonify({'error': 'Datei nicht gefunden'}), 404
|
||||
|
||||
link.download_count += 1
|
||||
db.session.commit()
|
||||
|
||||
return send_file(str(filepath), mimetype=target_file.mime_type, as_attachment=True,
|
||||
download_name=target_file.name)
|
||||
|
||||
|
||||
@api_bp.route('/share/<token>/files/<int:file_id>', methods=['DELETE'])
|
||||
def share_delete_file(token, file_id):
|
||||
"""Delete a file from a shared folder (write permission required)."""
|
||||
link = ShareLink.query.filter_by(token=token).first()
|
||||
if not link:
|
||||
return jsonify({'error': 'Link nicht gefunden'}), 404
|
||||
|
||||
if link.is_expired():
|
||||
return jsonify({'error': 'Link abgelaufen'}), 410
|
||||
|
||||
if link.permission != 'write':
|
||||
return jsonify({'error': 'Loeschen nicht erlaubt'}), 403
|
||||
|
||||
if link.password_hash:
|
||||
password = request.headers.get('X-Share-Password', '')
|
||||
if not bcrypt.check_password_hash(link.password_hash, password):
|
||||
return jsonify({'error': 'Passwort erforderlich'}), 401
|
||||
|
||||
target_file = db.session.get(File, file_id)
|
||||
if not target_file:
|
||||
return jsonify({'error': 'Datei nicht gefunden'}), 404
|
||||
|
||||
shared_folder = db.session.get(File, link.file_id)
|
||||
if target_file.parent_id != shared_folder.id:
|
||||
return jsonify({'error': 'Datei gehoert nicht zu diesem Ordner'}), 403
|
||||
|
||||
# Delete from disk
|
||||
if target_file.storage_path:
|
||||
filepath = Path(current_app.config['UPLOAD_PATH']) / str(target_file.owner_id) / target_file.storage_path
|
||||
if filepath.exists():
|
||||
filepath.unlink()
|
||||
|
||||
db.session.delete(target_file)
|
||||
db.session.commit()
|
||||
return jsonify({'message': 'Datei geloescht'}), 200
|
||||
|
||||
|
||||
@api_bp.route('/share/<token>/verify', methods=['POST'])
|
||||
def share_verify(token):
|
||||
link = ShareLink.query.filter_by(token=token).first()
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="share-container">
|
||||
<div class="share-card">
|
||||
<div class="share-card" :class="{ wide: fileInfo?.is_folder && fileInfo?.permission !== 'upload_only' }">
|
||||
<i class="pi pi-cloud" style="font-size: 2rem; color: var(--p-primary-color)"></i>
|
||||
|
||||
<div v-if="loading" class="share-loading">
|
||||
|
|
@ -17,8 +17,8 @@
|
|||
<h2 v-if="fileInfo.permission !== 'upload_only'">{{ fileInfo.name }}</h2>
|
||||
<h2 v-else>Datei-Upload</h2>
|
||||
<p class="file-size" v-if="fileInfo.size && !fileInfo.is_folder && fileInfo.permission !== 'upload_only'">{{ formatSize(fileInfo.size) }}</p>
|
||||
<Tag v-if="fileInfo.is_folder && fileInfo.permission !== 'upload_only'" value="Ordner" severity="info" />
|
||||
|
||||
<!-- Password gate -->
|
||||
<div v-if="fileInfo.has_password && !authenticated" class="password-form">
|
||||
<p>Diese Freigabe ist passwortgeschuetzt.</p>
|
||||
<div class="field">
|
||||
|
|
@ -28,23 +28,54 @@
|
|||
<Button label="Entsperren" @click="verifyPassword" :loading="verifying" fluid />
|
||||
</div>
|
||||
|
||||
<!-- Authenticated content -->
|
||||
<div v-else class="actions-section">
|
||||
<!-- Download (files only, not upload_only) -->
|
||||
|
||||
<!-- Single file: download -->
|
||||
<div v-if="!fileInfo.is_folder && fileInfo.download_allowed" class="action-block">
|
||||
<Button
|
||||
label="Herunterladen"
|
||||
icon="pi pi-download"
|
||||
size="large"
|
||||
@click="downloadFile"
|
||||
/>
|
||||
<Button label="Herunterladen" icon="pi pi-download" size="large" @click="downloadFile" />
|
||||
</div>
|
||||
|
||||
<!-- Upload-only hint -->
|
||||
<!-- Folder: file listing (read + write) -->
|
||||
<div v-if="fileInfo.is_folder && fileInfo.permission !== 'upload_only'" class="folder-content">
|
||||
<div class="folder-toolbar">
|
||||
<span class="folder-count">{{ folderFiles.length }} Dateien</span>
|
||||
<Button v-if="fileInfo.upload_allowed" icon="pi pi-upload" label="Hochladen" size="small" @click="$refs.uploadInput.click()" />
|
||||
</div>
|
||||
|
||||
<div v-if="loadingFiles" class="loading-small">
|
||||
<i class="pi pi-spin pi-spinner"></i> Lade Dateien...
|
||||
</div>
|
||||
|
||||
<div v-else class="file-list">
|
||||
<div v-for="f in folderFiles" :key="f.id" class="file-item">
|
||||
<div class="file-info">
|
||||
<i :class="f.is_folder ? 'pi pi-folder' : 'pi pi-file'"></i>
|
||||
<div class="file-details">
|
||||
<span class="file-name">{{ f.name }}</span>
|
||||
<span class="file-meta">{{ f.is_folder ? 'Ordner' : formatSize(f.size) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="file-actions">
|
||||
<Button v-if="!f.is_folder" icon="pi pi-download" text size="small"
|
||||
@click="downloadFolderFile(f)" />
|
||||
<Button v-if="fileInfo.permission === 'write'" icon="pi pi-trash" text size="small"
|
||||
severity="danger" @click="deleteFolderFile(f)" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!folderFiles.length" class="empty-folder">
|
||||
<i class="pi pi-folder-open"></i>
|
||||
<p>Ordner ist leer</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Upload only hint -->
|
||||
<p v-if="fileInfo.permission === 'upload_only'" class="upload-only-hint">
|
||||
Dieser Link erlaubt nur das Hochladen von Dateien.
|
||||
</p>
|
||||
|
||||
<!-- Upload (folders only) -->
|
||||
<!-- Upload zone (write + upload_only) -->
|
||||
<div v-if="fileInfo.upload_allowed" class="action-block">
|
||||
<div class="upload-area"
|
||||
@dragover.prevent="isDragging = true"
|
||||
|
|
@ -77,7 +108,6 @@ import axios from 'axios'
|
|||
import Button from 'primevue/button'
|
||||
import Password from 'primevue/password'
|
||||
import Message from 'primevue/message'
|
||||
import Tag from 'primevue/tag'
|
||||
import ProgressBar from 'primevue/progressbar'
|
||||
|
||||
const route = useRoute()
|
||||
|
|
@ -91,6 +121,9 @@ const authenticated = ref(false)
|
|||
const authError = ref('')
|
||||
const verifying = ref(false)
|
||||
|
||||
const folderFiles = ref([])
|
||||
const loadingFiles = ref(false)
|
||||
|
||||
const isDragging = ref(false)
|
||||
const uploading = ref(false)
|
||||
const uploadPercent = ref(0)
|
||||
|
|
@ -98,19 +131,31 @@ const uploadStatus = ref('')
|
|||
const uploadSuccess = ref('')
|
||||
|
||||
function formatSize(bytes) {
|
||||
if (!bytes) return ''
|
||||
if (!bytes) return '0 B'
|
||||
const units = ['B', 'KB', 'MB', 'GB']
|
||||
let i = 0
|
||||
let size = bytes
|
||||
let i = 0; let size = bytes
|
||||
while (size >= 1024 && i < units.length - 1) { size /= 1024; i++ }
|
||||
return `${size.toFixed(i > 0 ? 1 : 0)} ${units[i]}`
|
||||
}
|
||||
|
||||
function getAuthHeaders() {
|
||||
const headers = {}
|
||||
if (fileInfo.value?.has_password && password.value) {
|
||||
headers['X-Share-Password'] = password.value
|
||||
}
|
||||
return headers
|
||||
}
|
||||
|
||||
async function loadInfo() {
|
||||
try {
|
||||
const res = await axios.get(`/api/share/${token}/info`)
|
||||
fileInfo.value = res.data
|
||||
if (!res.data.has_password) authenticated.value = true
|
||||
if (!res.data.has_password) {
|
||||
authenticated.value = true
|
||||
if (res.data.is_folder && res.data.permission !== 'upload_only') {
|
||||
await loadFolderFiles()
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
error.value = err.response?.data?.error || 'Link nicht gefunden oder abgelaufen'
|
||||
} finally {
|
||||
|
|
@ -124,6 +169,9 @@ async function verifyPassword() {
|
|||
try {
|
||||
await axios.post(`/api/share/${token}/verify`, { password: password.value })
|
||||
authenticated.value = true
|
||||
if (fileInfo.value?.is_folder && fileInfo.value?.permission !== 'upload_only') {
|
||||
await loadFolderFiles()
|
||||
}
|
||||
} catch (err) {
|
||||
authError.value = err.response?.data?.error || 'Falsches Passwort'
|
||||
} finally {
|
||||
|
|
@ -131,6 +179,18 @@ async function verifyPassword() {
|
|||
}
|
||||
}
|
||||
|
||||
async function loadFolderFiles() {
|
||||
loadingFiles.value = true
|
||||
try {
|
||||
const res = await axios.get(`/api/share/${token}/files`, { headers: getAuthHeaders() })
|
||||
folderFiles.value = res.data
|
||||
} catch {
|
||||
folderFiles.value = []
|
||||
} finally {
|
||||
loadingFiles.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function downloadFile() {
|
||||
let url = `/api/share/${token}/download`
|
||||
if (fileInfo.value?.has_password && password.value) {
|
||||
|
|
@ -139,6 +199,23 @@ function downloadFile() {
|
|||
window.location.href = url
|
||||
}
|
||||
|
||||
function downloadFolderFile(file) {
|
||||
let url = `/api/share/${token}/files/${file.id}/download`
|
||||
if (fileInfo.value?.has_password && password.value) {
|
||||
url += `?password=${encodeURIComponent(password.value)}`
|
||||
}
|
||||
window.location.href = url
|
||||
}
|
||||
|
||||
async function deleteFolderFile(file) {
|
||||
try {
|
||||
await axios.delete(`/api/share/${token}/files/${file.id}`, { headers: getAuthHeaders() })
|
||||
folderFiles.value = folderFiles.value.filter(f => f.id !== file.id)
|
||||
} catch (err) {
|
||||
alert(err.response?.data?.error || 'Fehler beim Loeschen')
|
||||
}
|
||||
}
|
||||
|
||||
async function onDrop(e) {
|
||||
isDragging.value = false
|
||||
const files = Array.from(e.dataTransfer.files)
|
||||
|
|
@ -163,19 +240,12 @@ async function uploadFiles(files) {
|
|||
try {
|
||||
const formData = new FormData()
|
||||
formData.append('file', file)
|
||||
if (fileInfo.value?.has_password && password.value) {
|
||||
formData.append('password', password.value)
|
||||
}
|
||||
if (password.value) formData.append('password', password.value)
|
||||
await axios.post(`/api/share/${token}/upload`, formData, {
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data',
|
||||
...(password.value ? { 'X-Share-Password': password.value } : {}),
|
||||
},
|
||||
headers: { 'Content-Type': 'multipart/form-data', ...getAuthHeaders() },
|
||||
})
|
||||
uploaded++
|
||||
} catch {
|
||||
errors++
|
||||
}
|
||||
} catch { errors++ }
|
||||
uploadPercent.value = Math.round(((uploaded + errors) / files.length) * 100)
|
||||
}
|
||||
|
||||
|
|
@ -185,6 +255,11 @@ async function uploadFiles(files) {
|
|||
} else {
|
||||
uploadSuccess.value = `${uploaded} Datei${uploaded !== 1 ? 'en' : ''} erfolgreich hochgeladen`
|
||||
}
|
||||
|
||||
// Reload file list
|
||||
if (fileInfo.value?.is_folder && fileInfo.value?.permission !== 'upload_only') {
|
||||
await loadFolderFiles()
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(loadInfo)
|
||||
|
|
@ -193,26 +268,49 @@ onMounted(loadInfo)
|
|||
<style scoped>
|
||||
.share-container {
|
||||
min-height: 100vh; display: flex; align-items: center; justify-content: center;
|
||||
background: var(--p-surface-50);
|
||||
background: var(--p-surface-50); padding: 1rem;
|
||||
}
|
||||
.share-card {
|
||||
background: var(--p-surface-0); border-radius: 12px; padding: 3rem;
|
||||
background: var(--p-surface-0); border-radius: 12px; padding: 2.5rem;
|
||||
text-align: center; max-width: 500px; width: 100%;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,0.08);
|
||||
}
|
||||
.share-card.wide { max-width: 700px; }
|
||||
.share-card h2 { margin: 1rem 0 0.25rem; font-size: 1.25rem; }
|
||||
.file-size { color: var(--p-text-muted-color); margin-bottom: 1rem; }
|
||||
.password-form { text-align: left; margin-top: 1.5rem; }
|
||||
.password-form p { margin-bottom: 1rem; color: var(--p-text-muted-color); }
|
||||
.field { margin-bottom: 1rem; }
|
||||
.actions-section { margin-top: 1.5rem; }
|
||||
.action-block { margin-bottom: 1.5rem; }
|
||||
.actions-section { margin-top: 1.5rem; text-align: left; }
|
||||
.action-block { margin-bottom: 1.5rem; text-align: center; }
|
||||
.share-loading, .share-error { margin-top: 1.5rem; }
|
||||
|
||||
/* Folder content */
|
||||
.folder-content { margin-bottom: 1.5rem; }
|
||||
.folder-toolbar {
|
||||
display: flex; align-items: center; justify-content: space-between;
|
||||
margin-bottom: 0.75rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--p-surface-200);
|
||||
}
|
||||
.folder-count { font-size: 0.85rem; color: var(--p-text-muted-color); }
|
||||
.file-list { max-height: 400px; overflow-y: auto; }
|
||||
.file-item {
|
||||
display: flex; align-items: center; justify-content: space-between;
|
||||
padding: 0.5rem 0; border-bottom: 1px solid var(--p-surface-100);
|
||||
}
|
||||
.file-info { display: flex; align-items: center; gap: 0.5rem; flex: 1; min-width: 0; }
|
||||
.file-info i { font-size: 1.1rem; color: var(--p-surface-500); flex-shrink: 0; }
|
||||
.file-details { display: flex; flex-direction: column; min-width: 0; }
|
||||
.file-name { font-size: 0.875rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.file-meta { font-size: 0.75rem; color: var(--p-text-muted-color); }
|
||||
.file-actions { display: flex; flex-shrink: 0; }
|
||||
.empty-folder { text-align: center; padding: 2rem; color: var(--p-text-muted-color); }
|
||||
.empty-folder i { font-size: 1.5rem; }
|
||||
.loading-small { text-align: center; padding: 1rem; color: var(--p-text-muted-color); }
|
||||
|
||||
/* Upload */
|
||||
.upload-area {
|
||||
border: 2px dashed var(--p-surface-300); border-radius: 10px;
|
||||
padding: 2rem; text-align: center; cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
padding: 2rem; text-align: center; transition: all 0.2s;
|
||||
}
|
||||
.upload-area:hover, .upload-area.dragging {
|
||||
border-color: var(--p-primary-color); background: var(--p-primary-50);
|
||||
|
|
@ -222,5 +320,5 @@ onMounted(loadInfo)
|
|||
.upload-area p { margin: 0.5rem 0; color: var(--p-text-muted-color); font-size: 0.9rem; }
|
||||
.upload-progress { margin-top: 1rem; }
|
||||
.upload-progress p { font-size: 0.85rem; color: var(--p-text-muted-color); margin-top: 0.5rem; }
|
||||
.upload-only-hint { color: var(--p-text-muted-color); font-size: 0.9rem; margin-bottom: 1rem; }
|
||||
.upload-only-hint { color: var(--p-text-muted-color); font-size: 0.9rem; margin-bottom: 1rem; text-align: center; }
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue