104 lines
4.3 KiB
TypeScript
104 lines
4.3 KiB
TypeScript
// a simple CRUD componenet for congregations for admins
|
||
|
||
import { useEffect, useState } from 'react';
|
||
import axiosInstance from '../../../src/axiosSecure';
|
||
import toast from 'react-hot-toast';
|
||
import Layout from '../../../components/layout';
|
||
import ProtectedRoute from '../../../components/protectedRoute';
|
||
import { UserRole } from '@prisma/client';
|
||
import { useRouter } from 'next/router';
|
||
|
||
export default function CongregationCRUD() {
|
||
const [congregations, setCongregations] = useState([]);
|
||
const [newCongregation, setNewCongregation] = useState('');
|
||
const router = useRouter();
|
||
|
||
const fetchCongregations = async () => {
|
||
try {
|
||
const { data: congregationsData } = await axiosInstance.get(`/api/data/congregations`);
|
||
setCongregations(congregationsData);
|
||
} catch (error) {
|
||
console.error(error);
|
||
}
|
||
};
|
||
|
||
const addCongregation = async () => {
|
||
try {
|
||
await axiosInstance.post(`/api/data/congregations`, { name: newCongregation, address: "" });
|
||
toast.success('Успешно добавен сбор');
|
||
setNewCongregation('');
|
||
fetchCongregations();
|
||
} catch (error) {
|
||
console.error(error);
|
||
}
|
||
};
|
||
|
||
const deleteCongregation = async (id) => {
|
||
try {
|
||
await axiosInstance.delete(`/api/data/congregations/${id}`);
|
||
toast.success('Успешно изтрит сбор');
|
||
fetchCongregations();
|
||
} catch (error) {
|
||
console.error(error);
|
||
}
|
||
};
|
||
useEffect(() => {
|
||
fetchCongregations();
|
||
}, []);
|
||
|
||
return (
|
||
<ProtectedRoute allowedRoles={[UserRole.ADMIN]}>
|
||
<div className="h-5/6 grid place-items-start px-4 pt-8">
|
||
<div className="flex flex-col w-full px-4">
|
||
<h1 className="text-2xl font-bold text-center">Сборове</h1>
|
||
<div className="flex gap-2 mb-4">
|
||
<input
|
||
type="text"
|
||
value={newCongregation}
|
||
onChange={(e) => setNewCongregation(e.target.value)}
|
||
placeholder="Име на сбор"
|
||
className="px-4 py-2 rounded-md border border-gray-300"
|
||
/>
|
||
<button
|
||
onClick={addCongregation}
|
||
className="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
|
||
>
|
||
Добави
|
||
</button>
|
||
</div>
|
||
<table className="w-full">
|
||
<thead>
|
||
<tr>
|
||
<th>Име</th>
|
||
<th>Действия</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{congregations.map((congregation) => (
|
||
<tr key={congregation.id}>
|
||
<td>{congregation.name}</td>
|
||
<td className='right'>
|
||
{/* <button
|
||
onClick={() => router.push(`/cart/publishers/congregation/${congregation.id}`)}
|
||
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
|
||
>
|
||
Преглед
|
||
</button> */}
|
||
<button
|
||
onClick={() => deleteCongregation(congregation.id)}
|
||
className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
|
||
>
|
||
Изтрий
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
))}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</ProtectedRoute>
|
||
);
|
||
}
|
||
|