missions s3

This commit is contained in:
alma 2025-05-06 11:10:39 +02:00
parent 9f9280fbe8
commit cf7538225e

View File

@ -17,7 +17,7 @@ import {
CardContent
} from "../ui/card";
import { Badge } from "../ui/badge";
import { X, Search, UserPlus, Users, PlusCircle, AlertCircle, Check } from "lucide-react";
import { X, Search, UserPlus, Users, PlusCircle, AlertCircle, Check, UploadCloud, File } from "lucide-react";
import { toast } from "../ui/use-toast";
import {
DropdownMenu,
@ -65,6 +65,7 @@ export function MissionsAdminPanel() {
const [activeTab, setActiveTab] = useState<string>("general");
const [isSubmitting, setIsSubmitting] = useState(false);
const [selectedLogoFile, setSelectedLogoFile] = useState<File | null>(null);
const [selectedAttachments, setSelectedAttachments] = useState<File[]>([]);
const [missionData, setMissionData] = useState<{
name?: string;
logo?: string;
@ -416,18 +417,23 @@ export function MissionsAdminPanel() {
const data = await response.json();
// If we have a selected logo file and this is a new mission, upload it now
if (selectedLogoFile && data.mission && data.mission.id) {
console.log('Uploading logo for new mission:', data.mission.id);
const newMissionId = data.mission?.id;
if (!newMissionId) {
throw new Error('Failed to get new mission ID');
}
// Upload logo if selected
if (selectedLogoFile) {
console.log('Uploading logo for new mission:', newMissionId);
const formData = new FormData();
formData.append('file', selectedLogoFile);
formData.append('missionId', data.mission.id);
formData.append('type', 'logo');
const logoFormData = new FormData();
logoFormData.append('file', selectedLogoFile);
logoFormData.append('missionId', newMissionId);
logoFormData.append('type', 'logo');
const logoResponse = await fetch('/api/missions/upload', {
method: 'POST',
body: formData
body: logoFormData
});
if (!logoResponse.ok) {
@ -438,6 +444,42 @@ export function MissionsAdminPanel() {
}
}
// Upload all attachments if there are any
if (selectedAttachments.length > 0) {
console.log(`Uploading ${selectedAttachments.length} attachments for new mission:`, newMissionId);
const uploadPromises = selectedAttachments.map(async (file) => {
const attachmentFormData = new FormData();
attachmentFormData.append('file', file);
attachmentFormData.append('missionId', newMissionId);
attachmentFormData.append('type', 'attachment');
try {
const attachmentResponse = await fetch('/api/missions/upload', {
method: 'POST',
body: attachmentFormData
});
if (!attachmentResponse.ok) {
console.error(`Failed to upload attachment ${file.name}:`, await attachmentResponse.json());
return false;
} else {
console.log(`Attachment ${file.name} uploaded successfully`);
return true;
}
} catch (error) {
console.error(`Error uploading attachment ${file.name}:`, error);
return false;
}
});
// Wait for all attachments to upload
const results = await Promise.allSettled(uploadPromises);
const successCount = results.filter(r => r.status === 'fulfilled' && r.value === true).length;
console.log(`Uploaded ${successCount} of ${selectedAttachments.length} attachments`);
}
toast({
title: "Mission créée avec succès",
description: "Tous les gardiens ont été assignés et la mission a été enregistrée.",
@ -837,11 +879,71 @@ export function MissionsAdminPanel() {
<TabsContent value="attachments" className="space-y-6">
<div>
<label className="block text-sm font-medium mb-1 text-gray-700">Attachements</label>
<AttachmentsList
missionId={missionId || ""}
allowUpload={true}
allowDelete={true}
/>
{/* For new missions */}
{!missionId ? (
<div className="space-y-4">
<div className="border rounded-md p-4 bg-white">
<h4 className="text-sm font-medium mb-3 text-gray-700">Add Attachments</h4>
<p className="text-xs text-gray-500 mb-3">Attachments will be uploaded when you save the mission.</p>
{selectedAttachments.length > 0 && (
<div className="mb-4 border rounded-md p-3 bg-gray-50">
<h5 className="text-sm font-medium mb-2 text-gray-700">Selected Files ({selectedAttachments.length})</h5>
<ul className="divide-y divide-gray-200">
{selectedAttachments.map((file, index) => (
<li key={index} className="py-2 flex items-center justify-between">
<div className="flex items-center">
<File className="h-4 w-4 text-gray-500 mr-2" />
<span className="text-sm text-gray-700">{file.name}</span>
<span className="text-xs text-gray-500 ml-2">({(file.size / 1024).toFixed(1)} KB)</span>
</div>
<Button
variant="ghost"
size="sm"
onClick={() => {
setSelectedAttachments(prev => prev.filter((_, i) => i !== index));
}}
className="text-red-500 hover:text-red-700 hover:bg-red-50 h-7 w-7 p-0"
>
<X className="h-4 w-4" />
</Button>
</li>
))}
</ul>
</div>
)}
<div className="flex items-center justify-center w-full">
<label className="flex flex-col items-center justify-center w-full h-32 border-2 border-gray-300 border-dashed rounded-lg cursor-pointer bg-gray-50 hover:bg-gray-100">
<div className="flex flex-col items-center justify-center pt-5 pb-6">
<UploadCloud className="w-8 h-8 mb-3 text-gray-400" />
<p className="mb-2 text-sm text-gray-500">
<span className="font-semibold">Click to upload</span> or drag and drop
</p>
<p className="text-xs text-gray-500">PDF, DOC, DOCX, XLS, XLSX, JPG, JPEG, PNG</p>
</div>
<input
type="file"
className="hidden"
onChange={(e) => {
if (e.target.files && e.target.files.length > 0) {
const file = e.target.files[0];
setSelectedAttachments(prev => [...prev, file]);
}
}}
/>
</label>
</div>
</div>
</div>
) : (
/* For existing missions */
<AttachmentsList
missionId={missionId || ""}
allowUpload={true}
allowDelete={true}
/>
)}
</div>
</TabsContent>