69 lines
3.7 KiB
JavaScript
69 lines
3.7 KiB
JavaScript
// import SchoolEditForm from '../../components/SchoolEditForm'
|
|
import React, { useEffect, useState } from "react";
|
|
import Image from 'next/image'
|
|
import { Inter } from 'next/font/google'
|
|
const inter = Inter({ subsets: ['latin'] })
|
|
import NavBar from '../../components/NavBar'
|
|
export default function Modal() {
|
|
const [school, setUser] = useState([]);
|
|
const fetchData = async () => {
|
|
const response = await fetch("https://management.beanstalkedu.com/items/school?filter[status][_eq]=published");
|
|
const data = await response.json();
|
|
return setUser(data.data);
|
|
}
|
|
console.log(school)
|
|
|
|
useEffect(() => {
|
|
fetchData();
|
|
},[])
|
|
|
|
return (
|
|
<main>
|
|
<div>
|
|
<NavBar />
|
|
<section className='container mx-auto px-4 mt-16'>
|
|
<div className="flex justify-end bg-[#FFF6F2] p-2 border-x-2 border-t-2 rounded-t-xl ">
|
|
<a href="/add-school-form" className=" inline-flex place-items-center p-2">
|
|
<img src="/img/3.svg" alt="" />Add School</a>
|
|
</div>
|
|
<div className='flex xl:justify-center overflow-x-scroll pb-4 w-full'>
|
|
<table className=" text-center border-x-2 border-b-2 p-2 w-full">
|
|
<thead className=''>
|
|
<tr className='bg-[#FFF6F2] text-[#1D1D1D] text-xl whitespace-nowrap'>
|
|
<th className=" p-2">ID</th>
|
|
<th className=" p-2">School Name</th>
|
|
<th className=" p-2">Country</th>
|
|
<th className=" p-2">Anual</th>
|
|
<th className=" p-2">Early Start Program</th>
|
|
<th className=" p-2">Toddlers</th>
|
|
<th className=" p-2">Interakto</th>
|
|
<th className=" p-2">Status</th>
|
|
<th className=" p-2 inline-flex"> <img src="/img/3.svg" alt="" />Edit</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{school.map(data=>
|
|
<tr className="border-b-2 whitespace-normal">
|
|
<td className=" p-2">{data.id}</td>
|
|
<td className=" p-2">{data.name}</td>
|
|
<td className="p-2">{data.country}</td>
|
|
<td className="p-2">{data.anual}</td>
|
|
<td className="p-2">{data.early_start_programme}</td>
|
|
<td className="p-2">{data.toddlers}</td>
|
|
<td className="p-2">{data.interakto}</td>
|
|
<td className="p-2">{data.status}</td>
|
|
<td className="p-2"><a href={'/edit-school?school='+data.id} className="flex justify-center place-items-center">
|
|
<svg width="35px" height="35px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" stroke="#166435"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path opacity="0.15" d="M8 16H12L18 10L14 6L8 12V16Z" fill="#166435"></path> <path d="M14 6L8 12V16H12L18 10M14 6L17 3L21 7L18 10M14 6L18 10M10 4L4 4L4 20L20 20V14" stroke="#166435" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </g></svg></a> </td>
|
|
</tr>
|
|
)}
|
|
</tbody>
|
|
{/* <SchoolEditForm /> */}
|
|
</table>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</main>
|
|
)
|
|
|
|
}
|