StroevVladimir/PIbd-22.-Stroev-V.M.-Internet-Programm
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ТаблицаАбитурентов.Продолжение

Browse Source
This commit is contained in:
DyCTaTOR 2023-12-24 01:28:20 +04:00
parent b59e82edc6
commit c379e58c9c
12 changed files with 126 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
Lab5/data.json
View File

File diff suppressed because one or more lines are too long

9
Lab5/package-lock.json generated
View File

@ -16,6 +16,7 @@
"react-bootstrap-icons": "^1.10.3",
"react-dom": "^18.2.0",
"react-hot-toast": "^2.4.1",
"react-icons": "^4.12.0",
"react-router-dom": "^6.18.0"
},
"devDependencies": {
@ -5212,6 +5213,14 @@
"react-dom": ">=16"
}
},
"node_modules/react-icons": {
"version": "4.12.0",
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.12.0.tgz",
"integrity": "sha512-IBaDuHiShdZqmfc/TwHu6+d6k2ltNCf3AszxNmjJc1KUfXdEeRJOKyNvLmAHaarhzGmTSVygNdyu8/opXv2gaw==",
"peerDependencies": {
"react": "*"
}
},
"node_modules/react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",

1
Lab5/package.json
View File

@ -19,6 +19,7 @@
"react-bootstrap-icons": "^1.10.3",
"react-dom": "^18.2.0",
"react-hot-toast": "^2.4.1",
"react-icons": "^4.12.0",
"react-router-dom": "^6.18.0"
},
"devDependencies": {

19
Lab5/src/components/Directions/Direction.jsx
View File

@ -1,19 +0,0 @@
import PropTypes from 'prop-types';
const Direction = ({ index }) => {
return (
<tr>
<th scope="row">{index + 1}</th>
<td>dcvs</td>
<td>fvdf</td>
<td>5nhghgn</td>
<td>,l/asxxc</td>
</tr>
);
};
Direction.propTypes = {
index: PropTypes.number,
};
export default Direction;

27
Lab5/src/components/Directions/TableDirect.jsx
View File

@ -1,27 +0,0 @@
import PropTypes from 'prop-types';
import { Table } from 'react-bootstrap';
const TableDirect = ({ children }) => {
return (
<Table className='mt-1' striped responsive>
<thead>
<tr>
<th scope = 'col'>№</th>
<th scope='col' className = "w-25">Код</th>
<th scope='col' className ="w-50">Направление</th>
<th scope='col' className ="w-25">Кафедра</th>
<th scope='col' className = "w-75">Предметы(ЕГЭ) по выбору</th>
</tr>
</thead>
<tbody>
{children}
</tbody >
</Table >
);
};
TableDirect.propTypes = {
children: PropTypes.node,
};
export default TableDirect;

20
Lab5/src/components/Directions/direct/Direction.jsx Normal file
View File

@ -0,0 +1,20 @@
import PropTypes from 'prop-types';
const Direction = ({ item }) => {
return (
<tr>
<th style = {{ textAlign: 'center' }} scope="row">{item.id + 1}</th>
<td style = {{ textAlign: 'center' }}>{item.code}</td>
<td style = {{ textAlign: 'center' }}>{item.name}</td>
<td style = {{ textAlign: 'center' }}>{item.department}</td>
<td style = {{ textAlign: 'center' }}>{item.things}</td>
</tr>
);
};
Direction.propTypes = {
index: PropTypes.number,
item: PropTypes.object,
};
export default Direction;

35
Lab5/src/components/Directions/direct/Directions.jsx Normal file
View File

@ -0,0 +1,35 @@
import { Search } from 'react-bootstrap-icons';
import { Button } from 'react-bootstrap';
import TableDirect from './TableDirect.jsx';
import Direction from './Direction.jsx';
import useDirections from '../hooks/DirectionHooks';
const Directions = () => {
const { directions } = useDirections();
return (
<>
<div className = 'd-flex justify-content-center mb-4'>
<input className = "d-flex justify-content-center w-50"
type="search"
id="search1"
name="search"
required>
</input>
<Button style = {{ marginLeft: '5' }} ><Search /></Button>
</div>
<div className = 'd-flex justify-content-center'>
<TableDirect>
{
directions.map((item) =>
<Direction key={item.id}
item = {item}
/>)
}
</TableDirect>
</div>
</>
);
};
export default Directions;

27
Lab5/src/components/Directions/direct/TableDirect.jsx Normal file
View File

@ -0,0 +1,27 @@
import PropTypes from 'prop-types';
import { Table } from 'react-bootstrap';
const TableDirect = ({ children }) => {
return (
<Table className='mt-1' variant = "secondary" striped responsive bordered hover>
<thead>
<tr>
<th style = {{ textAlign: 'center' }} scope = 'col'>№</th>
<th style = {{ textAlign: 'center' }} scope='col' className = "w-25">Код</th>
<th style = {{ textAlign: 'center' }} scope='col' className ="w-50">Направление</th>
<th style = {{ textAlign: 'center' }} scope='col' className ="w-25">Кафедра</th>
<th style = {{ textAlign: 'center' }} scope='col' className = "w-75">Предметы(ЕГЭ) по выбору</th>
</tr>
</thead>
<tbody>
{children}
</tbody >
</Table >
);
};
TableDirect.propTypes = {
children: PropTypes.node,
};
export default TableDirect;

3
Lab5/src/components/Directions/direct/table.css Normal file
View File

@ -0,0 +1,3 @@
.tableRow{
text-align: center;
}

22
Lab5/src/components/Directions/hooks/DirectionHooks.js Normal file
View File

@ -0,0 +1,22 @@
import { useEffect, useState } from 'react';
import DirectionsApiService from './DirectionsApiService';
const useDirections = () => {
const [directions, setDirections] = useState([]);
const getDirections = async () => {
const data = await DirectionsApiService.getAll();
setDirections(data ?? []);
};
useEffect(() => {
getDirections();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return {
directions,
};
};
export default useDirections;

2
Lab5/src/components/Directions/DirectionsApiService.js → Lab5/src/components/Directions/hooks/DirectionsApiService.js
View File

@ -1,4 +1,4 @@
import ApiService from '../api/ApiService';
import ApiService from '../../api/ApiService';
const LinesApiService = new ApiService('directions');

22
Lab5/src/pages/Page3.jsx
View File

@ -1,26 +1,8 @@
import TableDirect from '../components/Directions/TableDirect.jsx';
import Direction from '../components/Directions/Direction.jsx';
import directionsApiService from '../components/Directions/DirectionsApiService';
import Directions from '../components/Directions/direct/Directions.jsx';
const data = directionsApiService.getAll();
const Page3 = () => {
return (
<>
<div className = 'd-flex justify-content-center mb-4'>
<input className = "d-flex justify-content-center w-50"
type="search"
id="search1"
name="search"
required>
</input>
</div>
<div className = 'd-flex justify-content-center'>
<TableDirect>
<Direction key={0}
index={0}></Direction>
</TableDirect>
</div>
</>
<Directions />
);
};