more
This commit is contained in:
parent
886f470f03
commit
1ca82f3368
@ -154,7 +154,7 @@ app.put('/direction/upd/:id', (req, res) => {
|
||||
|
||||
// STUDENT-------------------------------------
|
||||
app.post('/student', (req, res) => {
|
||||
student.create()
|
||||
student.create(req.params.name, req.params.surname, req.params.book, req.params.directionId)
|
||||
.then(response => res.status(200).send(response))
|
||||
.catch(error => res.status(500).send(error))
|
||||
})
|
||||
@ -172,7 +172,7 @@ app.delete('/student/del/:id', (req, res) => {
|
||||
})
|
||||
|
||||
app.put('/student/upd/:id', (req, res) => {
|
||||
student.update(req.params.id, req.params.directionId)
|
||||
student.update(req.params.id, req.params.name, req.params.surname, req.params.book, req.params.directionId)
|
||||
.then(response => res.status(200).send(response))
|
||||
.catch(error => res.status(500).send(error))
|
||||
})
|
||||
@ -180,7 +180,7 @@ app.put('/student/upd/:id', (req, res) => {
|
||||
|
||||
// SCORE-------------------------------------
|
||||
app.post('/score', (req, res) => {
|
||||
score.create(req.body.value, req.body.subjectId, req.body.testId, req.body.teacherId, req.body.stidentId)
|
||||
score.create(req.body.value, req.body.subjectId, req.body.testId, req.body.teacherId, req.body.studentId)
|
||||
.then(response => res.status(200).send(response))
|
||||
.catch(error => res.status(500).send(error))
|
||||
})
|
||||
@ -198,7 +198,7 @@ app.delete('/score/del/:id', (req, res) => {
|
||||
})
|
||||
|
||||
app.put('/score/upd/:id', (req, res) => {
|
||||
score.update(req.params.id, req.body.value, req.body.subjectId, req.body.testId, req.body.teacherId, req.body.stidentId)
|
||||
score.update(req.params.id, req.body.value, req.body.subjectId, req.body.testId, req.body.teacherId, req.body.studentId)
|
||||
.then(response => res.status(200).send(response))
|
||||
.catch(error => res.status(500).send(error))
|
||||
})
|
||||
|
@ -26,7 +26,7 @@ const del = (id) => {
|
||||
pool.query('DELETE FROM teacher WHERE id = $1', [id], (error, result) => {
|
||||
if(error)
|
||||
reject(error)
|
||||
resolve(result.rows)
|
||||
resolve(result)
|
||||
})
|
||||
})
|
||||
}
|
||||
@ -36,7 +36,7 @@ const update = (id, name, surname, post) => {
|
||||
pool.query('UPDATE teacher SET name = $1, surname = $2, post = $3 WHERE id = $4', [name, surname, post, id], (error, result) => {
|
||||
if(error)
|
||||
reject(error)
|
||||
resolve(result.rows)
|
||||
resolve(result)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
6
all/react-postgres/src/App.js
vendored
6
all/react-postgres/src/App.js
vendored
@ -2,6 +2,9 @@ import React from 'react';
|
||||
import { Routes,Route } from "react-router-dom";
|
||||
import Header from "./common/Header";
|
||||
import FacultyPage from "./pages/FacultyPage";
|
||||
import TestPage from './pages/TestPage';
|
||||
import TeacherPage from './pages/TeacherPage';
|
||||
import SubjectPage from './pages/SubjectPage';
|
||||
|
||||
function App() {
|
||||
return (
|
||||
@ -10,6 +13,9 @@ function App() {
|
||||
<Routes>
|
||||
<Route path="/" element={<FacultyPage/>} />
|
||||
<Route path="/faculty" element={<FacultyPage/>} />
|
||||
<Route path="/test" element={<TestPage/>} />
|
||||
<Route path="/teacher" element={<TeacherPage/>} />
|
||||
<Route path="/subject" element={<SubjectPage/>} />
|
||||
</Routes>
|
||||
</>
|
||||
);
|
||||
|
@ -18,6 +18,42 @@ export default function Header() {
|
||||
FACULTY
|
||||
</Link>
|
||||
</li>
|
||||
|
||||
<li className="nav-item">
|
||||
<Link className="nav-link" to="/test">
|
||||
TEST
|
||||
</Link>
|
||||
</li>
|
||||
|
||||
<li className="nav-item">
|
||||
<Link className="nav-link" to="/teacher">
|
||||
TEACHER
|
||||
</Link>
|
||||
</li>
|
||||
|
||||
<li className="nav-item">
|
||||
<Link className="nav-link" to="/subject">
|
||||
SUBJECT
|
||||
</Link>
|
||||
</li>
|
||||
|
||||
<li className="nav-item">
|
||||
<Link className="nav-link" to="/direction">
|
||||
DIRECTION
|
||||
</Link>
|
||||
</li>
|
||||
|
||||
<li className="nav-item">
|
||||
<Link className="nav-link" to="/student">
|
||||
STUDENT
|
||||
</Link>
|
||||
</li>
|
||||
|
||||
<li className="nav-item">
|
||||
<Link className="nav-link" to="/score">
|
||||
SCORE
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
136
all/react-postgres/src/common/Page.jsx
Normal file
136
all/react-postgres/src/common/Page.jsx
Normal file
@ -0,0 +1,136 @@
|
||||
import React, {useState, useEffect} from 'react';
|
||||
import Modal from '../common/Modal';
|
||||
|
||||
export default function Page(props) {
|
||||
const [items, setItems] = useState([]);
|
||||
const [item, setItem] = useState(props.empty)
|
||||
|
||||
const [modalHeader, setModalHeader] = useState('')
|
||||
const [modalConfirm, setModalConfirm] = useState('')
|
||||
const [modalVisible, setModalVisible] = useState(false)
|
||||
const [isEdit, setEdit] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
get()
|
||||
//eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
|
||||
function save(){
|
||||
if(isEdit) upd()
|
||||
else create()
|
||||
get()
|
||||
}
|
||||
|
||||
function get(){
|
||||
fetch(`http://localhost:3001/${props.name}`)
|
||||
.then(response => {return response.json()})
|
||||
.then(data => setItems(data))
|
||||
}
|
||||
|
||||
function create(){
|
||||
fetch(`http://localhost:3001/${props.name}`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function upd(){
|
||||
fetch(`http://localhost:3001/${props.name}/upd/${item.id}`, {
|
||||
method: 'PUT',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function del(id){
|
||||
fetch(`http://localhost:3001/${props.name}/del/${id}`, {
|
||||
method: 'DELETE'
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function handleCreate(){
|
||||
setEdit(false)
|
||||
setModalHeader('Create');
|
||||
setModalConfirm('Add');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
function handleFormChange(event) {
|
||||
setItem({ ...item, [event.target.id]: event.target.value })
|
||||
}
|
||||
|
||||
function handleEdit(data){
|
||||
setItem(data)
|
||||
setEdit(true)
|
||||
setModalHeader('Update');
|
||||
setModalConfirm('Save');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
const hideModal = () => setModalVisible(false)
|
||||
const modalDone = () => save()
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal
|
||||
header={modalHeader}
|
||||
confirm={modalConfirm}
|
||||
visible={modalVisible}
|
||||
onHide={hideModal}
|
||||
onDone={modalDone}>
|
||||
{props.children}
|
||||
</Modal>
|
||||
|
||||
<div className='container'>
|
||||
<button type="button" className="btn btn-success" onClick={handleCreate}>Create</button>
|
||||
|
||||
<table className='table'>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
{
|
||||
props.headers.map(header =>
|
||||
<th key={header.name} scope="col">
|
||||
{header.label}
|
||||
</th>
|
||||
)
|
||||
}
|
||||
<th scope="col"></th>
|
||||
<th scope="col"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{
|
||||
items.map((data, index) =>
|
||||
<tr key={data.id}>
|
||||
<th scope="row">{index + 1}</th>
|
||||
{
|
||||
props.headers.map(header =>
|
||||
<td key={data.id + header.name}>{data[header.name]}</td>
|
||||
)
|
||||
}
|
||||
<td>
|
||||
<div>
|
||||
<button type="button" className="btn btn-warning" onClick={() => handleEdit(data)}>Edit</button>
|
||||
<button type="button" className="btn btn-danger" onClick={() => del(data.id)}>Delete</button>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
)
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
0
all/react-postgres/src/models/Direction.js
vendored
Normal file
0
all/react-postgres/src/models/Direction.js
vendored
Normal file
7
all/react-postgres/src/models/Subject.js
vendored
Normal file
7
all/react-postgres/src/models/Subject.js
vendored
Normal file
@ -0,0 +1,7 @@
|
||||
export default class Subject {
|
||||
constructor(data) {
|
||||
this.id = data?.id;
|
||||
this.name = data?.name || '';
|
||||
this.hours_count = data?.hours_count || '';
|
||||
}
|
||||
}
|
8
all/react-postgres/src/models/Teacher.js
vendored
Normal file
8
all/react-postgres/src/models/Teacher.js
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
export default class Teacher {
|
||||
constructor(data) {
|
||||
this.id = data?.id;
|
||||
this.name = data?.name || '';
|
||||
this.name = data?.surname || '';
|
||||
this.name = data?.post || '';
|
||||
}
|
||||
}
|
6
all/react-postgres/src/models/Test.js
vendored
Normal file
6
all/react-postgres/src/models/Test.js
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
export default class Test {
|
||||
constructor(data) {
|
||||
this.id = data?.id;
|
||||
this.name = data?.name || '';
|
||||
}
|
||||
}
|
141
all/react-postgres/src/pages/SubjectPage.jsx
Normal file
141
all/react-postgres/src/pages/SubjectPage.jsx
Normal file
@ -0,0 +1,141 @@
|
||||
import React, {useState, useEffect} from 'react';
|
||||
import Modal from '../common/Modal';
|
||||
import Subject from '../models/Subject';
|
||||
|
||||
|
||||
export default function SubjectPage() {
|
||||
const [items, setItems] = useState([]);
|
||||
const [item, setItem] = useState(new Subject())
|
||||
|
||||
const [modalHeader, setModalHeader] = useState('')
|
||||
const [modalConfirm, setModalConfirm] = useState('')
|
||||
const [modalVisible, setModalVisible] = useState(false)
|
||||
const [isEdit, setEdit] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
get()
|
||||
//eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
|
||||
function save(){
|
||||
if(isEdit) upd()
|
||||
else create()
|
||||
get()
|
||||
}
|
||||
|
||||
function get(){
|
||||
fetch('http://localhost:3001/subject')
|
||||
.then(response => {return response.json()})
|
||||
.then(data =>{
|
||||
//console.log(data)
|
||||
setItems(data)
|
||||
} )
|
||||
}
|
||||
|
||||
function create(){
|
||||
fetch('http://localhost:3001/subject', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function upd(){
|
||||
fetch(`http://localhost:3001/subject/upd/${item.id}`, {
|
||||
method: 'PUT',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function del(id){
|
||||
fetch(`http://localhost:3001/subject/del/${id}`, {
|
||||
method: 'DELETE'
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function handleCreate(){
|
||||
setEdit(false)
|
||||
setModalHeader('Create');
|
||||
setModalConfirm('Add');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
function handleFormChange(event) {
|
||||
setItem({ ...item, [event.target.id]: event.target.value })
|
||||
}
|
||||
|
||||
function handleEdit(data){
|
||||
setItem(data)
|
||||
setEdit(true)
|
||||
setModalHeader('Update');
|
||||
setModalConfirm('Save');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
const hideModal = () => setModalVisible(false)
|
||||
const modalDone = () => save()
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal
|
||||
header={modalHeader}
|
||||
confirm={modalConfirm}
|
||||
visible={modalVisible}
|
||||
onHide={hideModal}
|
||||
onDone={modalDone}>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="name" className="form-label">Name</label>
|
||||
<input type="text" id="name" className="form-control" required
|
||||
value={item.name} onChange={handleFormChange}/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="hours" className="form-label">Hours</label>
|
||||
<input type="text" id="hours" className="form-control" required
|
||||
value={item.hours_count} onChange={handleFormChange}/>
|
||||
</div>
|
||||
</Modal>
|
||||
|
||||
<div className='container'>
|
||||
<button type="button" className="btn btn-success" onClick={handleCreate}>Create</button>
|
||||
|
||||
<table className='table'>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">name</th>
|
||||
<th scope="col">hours</th>
|
||||
<th scope="col"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{
|
||||
items.map((data, index) =>
|
||||
<tr key={data.id}>
|
||||
<th scope="row">{index + 1}</th>
|
||||
<td>{data.name}</td>
|
||||
<td>{data.hours_count}</td>
|
||||
<td>
|
||||
<div>
|
||||
<button type="button" className="btn btn-warning" onClick={() => handleEdit(data)}>Edit</button>
|
||||
<button type="button" className="btn btn-danger" onClick={() => del(data.id)}>Delete</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
)
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
146
all/react-postgres/src/pages/TeacherPage.jsx
Normal file
146
all/react-postgres/src/pages/TeacherPage.jsx
Normal file
@ -0,0 +1,146 @@
|
||||
import React, {useState, useEffect} from 'react';
|
||||
import Modal from '../common/Modal';
|
||||
import Teacher from '../models/Teacher';
|
||||
|
||||
|
||||
export default function TeacherPage() {
|
||||
const [items, setItems] = useState([]);
|
||||
const [item, setItem] = useState(new Teacher())
|
||||
|
||||
const [modalHeader, setModalHeader] = useState('')
|
||||
const [modalConfirm, setModalConfirm] = useState('')
|
||||
const [modalVisible, setModalVisible] = useState(false)
|
||||
const [isEdit, setEdit] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
get()
|
||||
//eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
|
||||
function save(){
|
||||
if(isEdit) upd()
|
||||
else create()
|
||||
get()
|
||||
}
|
||||
|
||||
function get(){
|
||||
fetch('http://localhost:3001/teacher')
|
||||
.then(response => {return response.json()})
|
||||
.then(data => setItems(data))
|
||||
}
|
||||
|
||||
function create(){
|
||||
fetch('http://localhost:3001/teacher', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function upd(){
|
||||
fetch(`http://localhost:3001/teacher/upd/${item.id}`, {
|
||||
method: 'PUT',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function del(id){
|
||||
fetch(`http://localhost:3001/teacher/del/${id}`, {
|
||||
method: 'DELETE'
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function handleCreate(){
|
||||
setEdit(false)
|
||||
setModalHeader('Create');
|
||||
setModalConfirm('Add');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
function handleFormChange(event) {
|
||||
setItem({ ...item, [event.target.id]: event.target.value })
|
||||
}
|
||||
|
||||
function handleEdit(data){
|
||||
setItem(data)
|
||||
setEdit(true)
|
||||
setModalHeader('Update');
|
||||
setModalConfirm('Save');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
const hideModal = () => setModalVisible(false)
|
||||
const modalDone = () => save()
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal
|
||||
header={modalHeader}
|
||||
confirm={modalConfirm}
|
||||
visible={modalVisible}
|
||||
onHide={hideModal}
|
||||
onDone={modalDone}>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="name" className="form-label">Name</label>
|
||||
<input type="text" id="name" className="form-control" required
|
||||
value={item.name} onChange={handleFormChange}/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="surname" className="form-label">Surname</label>
|
||||
<input type="text" id="surname" className="form-control" required
|
||||
value={item.surname} onChange={handleFormChange}/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="post" className="form-label">Post</label>
|
||||
<input type="text" id="post" className="form-control" required
|
||||
value={item.post} onChange={handleFormChange}/>
|
||||
</div>
|
||||
</Modal>
|
||||
|
||||
<div className='container'>
|
||||
<button type="button" className="btn btn-success" onClick={handleCreate}>Create</button>
|
||||
|
||||
<table className='table'>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">name</th>
|
||||
<th scope="col">surname</th>
|
||||
<th scope="col">post</th>
|
||||
<th scope="col"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{
|
||||
items.map((data, index) =>
|
||||
<tr key={data.id}>
|
||||
<th scope="row">{index + 1}</th>
|
||||
<td>{data.name}</td>
|
||||
<td>{data.surname}</td>
|
||||
<td>{data.post}</td>
|
||||
<td>
|
||||
<div>
|
||||
<button type="button" className="btn btn-warning" onClick={() => handleEdit(data)}>Edit</button>
|
||||
<button type="button" className="btn btn-danger" onClick={() => del(data.id)}>Delete</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
)
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
130
all/react-postgres/src/pages/TestPage.jsx
Normal file
130
all/react-postgres/src/pages/TestPage.jsx
Normal file
@ -0,0 +1,130 @@
|
||||
import React, {useState, useEffect} from 'react';
|
||||
import Modal from '../common/Modal';
|
||||
import Test from '../models/Test';
|
||||
|
||||
|
||||
export default function TestPage() {
|
||||
const [items, setItems] = useState([]);
|
||||
const [item, setItem] = useState(new Test())
|
||||
|
||||
const [modalHeader, setModalHeader] = useState('')
|
||||
const [modalConfirm, setModalConfirm] = useState('')
|
||||
const [modalVisible, setModalVisible] = useState(false)
|
||||
const [isEdit, setEdit] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
get()
|
||||
//eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
|
||||
function save(){
|
||||
if(isEdit) upd()
|
||||
else create()
|
||||
get()
|
||||
}
|
||||
|
||||
function get(){
|
||||
fetch('http://localhost:3001/test')
|
||||
.then(response => {return response.json()})
|
||||
.then(data => setItems(data))
|
||||
}
|
||||
|
||||
function create(){
|
||||
fetch('http://localhost:3001/test', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function upd(){
|
||||
fetch(`http://localhost:3001/test/upd/${item.id}`, {
|
||||
method: 'PUT',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(item)
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function del(id){
|
||||
fetch(`http://localhost:3001/test/del/${id}`, {
|
||||
method: 'DELETE'
|
||||
})
|
||||
.then(response => get())
|
||||
}
|
||||
|
||||
function handleCreate(){
|
||||
setEdit(false)
|
||||
setModalHeader('Create');
|
||||
setModalConfirm('Add');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
function handleFormChange(event) {
|
||||
setItem({ ...item, [event.target.id]: event.target.value })
|
||||
}
|
||||
|
||||
function handleEdit(data){
|
||||
setItem(data)
|
||||
setEdit(true)
|
||||
setModalHeader('Update');
|
||||
setModalConfirm('Save');
|
||||
setModalVisible(true);
|
||||
}
|
||||
|
||||
const hideModal = () => setModalVisible(false)
|
||||
const modalDone = () => save()
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal
|
||||
header={modalHeader}
|
||||
confirm={modalConfirm}
|
||||
visible={modalVisible}
|
||||
onHide={hideModal}
|
||||
onDone={modalDone}>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="name" className="form-label">Name</label>
|
||||
<input type="text" id="name" className="form-control" required
|
||||
value={item.name} onChange={handleFormChange}/>
|
||||
</div>
|
||||
</Modal>
|
||||
|
||||
<div className='container'>
|
||||
<button type="button" className="btn btn-success" onClick={handleCreate}>Create</button>
|
||||
|
||||
<table className='table'>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">name</th>
|
||||
<th scope="col"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{
|
||||
items.map((data, index) =>
|
||||
<tr key={data.id}>
|
||||
<th scope="row">{index + 1}</th>
|
||||
<td>{data.name}</td>
|
||||
<td>
|
||||
<div>
|
||||
<button type="button" className="btn btn-warning" onClick={() => handleEdit(data)}>Edit</button>
|
||||
<button type="button" className="btn btn-danger" onClick={() => del(data.id)}>Delete</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
)
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
Loading…
Reference in New Issue
Block a user