Fixed DELETE

Author: SecurityTrip

organizer-frontend/src/components/EventTable/EventTable.jsx

@@ -1,7 +1,7 @@
 import React from "react";
 import EventTableRow from "../EventTableRow/EventTableRow.jsx";
 
-function EventTable({ events, selected, onSelect, onSelectAll, onRowClick }) {
+function EventTable({ events, selected, onSelect, onSelectAll, onRowClick, onDelete }) {
     return (
         <table style={{width: '100%', borderCollapse: 'collapse', background: '#fff', borderRadius: 12, overflow: 'hidden', boxShadow: '0 2px 8px rgba(0,0,0,0.04)'}}>
             <thead style={{background: '#87D2A7', color: '#0F114B'}}>
@@ -18,6 +18,7 @@ function EventTable({ events, selected, onSelect, onSelectAll, onRowClick }) {
                     <th style={{padding: '12px', textAlign: 'left'}}>Место</th>
                     <th style={{padding: '12px', textAlign: 'left'}}>Описание</th>
                     <th style={{padding: '12px', textAlign: 'left'}}>Изображение</th>
+                    <th style={{padding: '12px', textAlign: 'left'}}>Действия</th>
                 </tr>
             </thead>
             <tbody>
@@ -29,6 +30,7 @@ function EventTable({ events, selected, onSelect, onSelectAll, onRowClick }) {
                         selected={selected}
                         onSelect={onSelect}
                         onClick={onRowClick}
+                        onDelete={onDelete}
                     />
                 ))}
             </tbody>

organizer-frontend/src/components/EventTableRow/EventTableRow.jsx

@@ -1,6 +1,6 @@
 import React from "react";
 
-function EventTableRow({ event, index, selected, onSelect, onClick }) {
+function EventTableRow({ event, index, selected, onSelect, onClick, onDelete }) {
     // Проверка на пустой event
     if (!event) return null;
     return (
@@ -23,6 +23,13 @@ function EventTableRow({ event, index, selected, onSelect, onClick }) {
                     <span style={{color:'#aaa'}}>Нет изображения</span>
                 )}
             </td>
+            <td style={{padding: '10px'}} onClick={e => e.stopPropagation()}>
+                <button
+                    style={{background: '#e57373', color: '#fff', border: 'none', borderRadius: 6, padding: '4px 12px', cursor: 'pointer', fontWeight: 500}}
+                    onClick={() => onDelete && onDelete(event.id)}
+                    title="Удалить мероприятие"
+                >Удалить</button>
+            </td>
         </tr>
     );
 }

organizer-frontend/src/components/EventsList.jsx

@@ -60,11 +60,17 @@ function EventsList({}) {
     };
 
     const handleDeleteSelected = async () => {
-        for (const idx of selected) {
-            const event = events[idx];
-            await fetch(`${API_URL}/${event.id}`, { method: 'DELETE' });
+        // Собираем id выбранных событий
+        const idsToDelete = selected.map(idx => events[idx]?.id).filter(Boolean);
+        for (const id of idsToDelete) {
+            await fetch(`${API_URL}/${id}`, {
+                method: 'DELETE',
+                headers: {
+                    'Authorization': `Bearer ${token}`
+                }
+            });
         }
-        setEvents(events.filter((_, idx) => !selected.includes(idx)));
+        setEvents(events => events.filter(ev => !idsToDelete.includes(ev.id)));
         setSelected([]);
     };
 
@@ -125,6 +131,7 @@ function EventsList({}) {
                                     onSelect={handleSelect}
                                     onSelectAll={handleSelectAll}
                                     onRowClick={setSelectedEventIdx}
+                                    onDelete={handleDeleteEvent}
                                 />
                                 {showModal && (
                                     <EventCreateForm onAdd={handleAddEvent} onClose={() => setShowModal(false)} />