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-22 23:49:33 +04:00
parent 77bb8d1170
commit 3828504356
7 changed files with 34 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
Lab5/data.json
View File

File diff suppressed because one or more lines are too long

BIN
Lab5/src/assets/310x200.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

20
Lab5/src/components/lines/News/UpdateNews.jsx
View File

@ -1,5 +1,4 @@
import PropTypes from 'prop-types';
import { useState, useEffect } from 'react';
import {
Button, Container,
} from 'react-bootstrap';
@ -9,28 +8,19 @@ import ModalForm from '../../modal/ModalForm.jsx';
import UpdateNew from './UpdateNew.jsx';
import useLinesDeleteModal from '../hooks/LinesDeleteModalHook';
import useLinesFormModal from '../hooks/LinesFormModalHook';
import LinesApiService from '../service/LinesApiService';
import LinesItemForm from '../form/LinesItemForm.jsx';
import useLines from '../hooks/LinesHook';
// linesChangeHandle изменять состояние => при вызове изменения linesChangeHandle
// должно все перерисовываться
const UpdateNews = () => {
const [news, setNews] = useState([]);
useEffect(() => {
const fetchData = async () => {
const data = await LinesApiService.getAll();
setNews(data ?? []);
};
fetchData();
}, []);
const { lines, handleLinesChange } = useLines();
const {
isDeleteModalShow,
showDeleteModal,
handleDeleteConfirm,
handleDeleteCancel,
} = useLinesDeleteModal();
} = useLinesDeleteModal(handleLinesChange);
const {
isFormModalShow,
isFormValidated,
@ -39,7 +29,7 @@ const UpdateNews = () => {
handleItemChange,
handleFormSubmit,
handleFormClose,
} = useLinesFormModal();
} = useLinesFormModal(handleLinesChange);
return (
<>
@ -52,7 +42,7 @@ const UpdateNews = () => {
Добавить товар</Button>
</div>
<div className="mainDiv row">
{news.map((item) => (
{lines.map((item) => (
<UpdateNew key={item.id}
item={item}
onDelete={() => showDeleteModal(item.id)}

2
Lab5/src/components/lines/form/LinesItemForm.jsx
View File

@ -1,5 +1,5 @@
import PropTypes from 'prop-types';
import imgPlaceholder from '../../../assets/200.png';
import imgPlaceholder from '../../../assets/310x200.png';
import Input from '../../input/Input.jsx';
import './LinesItemForm.css';

6
Lab5/src/components/lines/hooks/LinesHook.js
View File

@ -7,11 +7,7 @@ const useLines = (typeFilter) => {
const handleLinesChange = () => setLinesRefresh(!linesRefresh);
const getLines = async () => {
let expand = '?_expand=type';
if (typeFilter) {
expand = `${expand}&typeId=${typeFilter}`;
}
const data = await LinesApiService.getAll(expand);
const data = await LinesApiService.getAll();
setLines(data ?? []);
};

16
Lab5/src/components/lines/hooks/LinesItemFormHook.js
View File

@ -24,15 +24,15 @@ const useLinesItemForm = (id, linesChangeHandle) => {
};
const getLineObject = (formData) => {
const date = getRealDate();
const name = formData.name.toString();
const description = formData.description.toString();
const image = formData.image.startsWith('data:image') ? formData.image : '';
const Date = getRealDate();
const Name = formData.name.toString();
const Description = formData.description.toString();
const Image = formData.image.startsWith('data:image') ? formData.image : '';
return {
date: date.toString(),
name: name.toString(),
description: description.toString(),
image,
date: Date.toString(),
name: Name,
description: Description,
image: Image,
};
};

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

@ -1,5 +1,5 @@
import { useState } from 'react';
import { Button, Form } from 'react-bootstrap';
import { Button, Form, Input } from 'react-bootstrap';
const Page3 = () => {
const someValue = 'Некоторое значение';
@ -41,74 +41,12 @@ const Page3 = () => {
return (
<div className='row justify-content-center'>
<Form className='col-md-6 m-0' noValidate validated={validated} onSubmit={handleSubmit}>
<Form.Group className='mb-2' controlId='lastname'>
<Form.Label>Фамилия</Form.Label>
<Form.Control type='text' name='lastname' required
value={formData.lastname} onChange={handleChange} />
<Form.Control.Feedback>Фамилия заполнена</Form.Control.Feedback>
<Form.Control.Feedback type='invalid'>Фамилия не заполнена</Form.Control.Feedback>
</Form.Group>
<Form.Group className='mb-2' controlId='firstname'>
<Form.Label>Имя</Form.Label>
<Form.Control type='text' name='firstname' required
value={formData.firstname} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2' controlId='email'>
<Form.Label>E-mail</Form.Label>
<Form.Control type='email' name='email' placeholder='name@example.ru' required
value={formData.email} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2' controlId='password'>
<Form.Label>Пароль</Form.Label>
<Form.Control type='password' name='password' required
value={formData.password} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2' controlId='date'>
<Form.Label>Дата</Form.Label>
<Form.Control type='date' name='date' required
value={formData.date} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2' controlId='disabled'>
<Form.Label>Выключенный компонент</Form.Label>
<Form.Control type='text' name='disabled' disabled
value={formData.disabled} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2' controlId='readonly'>
<Form.Label>Компонент только для чтения</Form.Label>
<Form.Control type='text' name='readonly' readOnly
value={formData.readonly} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2' controlId='color'>
<Form.Label>Выбор цвета</Form.Label>
<Form.Control type='color' name='color'
value={formData.color} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2 d-md-flex flex-md-row'>
<Form.Check className='me-md-3' type='checkbox' name='checkbox1' label='Флажок 1'
value={formData.checkbox1} onChange={handleChange} />
<Form.Check className='me-md-3' type='checkbox' name='checkbox2' label='Флажок 2'
value={formData.checkbox2} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2 d-md-flex flex-md-row'>
<Form.Check className='me-md-3' type='radio' name='radio1' label='Переключатель 1'
value={formData.radio1} onChange={handleChange} />
<Form.Check className='me-md-3' type='switch' name='radio2' label='Переключатель 2'
value={formData.radio2} onChange={handleChange} />
</Form.Group>
<Form.Group className='mb-2'>
<Form.Select name='selected' required
value={formData.selected} onChange={handleChange}>
<option value=''>Выберите значение</option>
<option value='1'>Один</option>
<option value='2'>Два</option>
<option value='3'>Три</option>
</Form.Select>
</Form.Group>
<div className='text-center'>
<Button className='w-50' variant='primary' type='submit'>Отправить</Button>
</div>
</Form>
<Input className = "justify-content-md-center w-50"
value = 'sxasc'
type="search"
id="direction"
name="direction"
required></Input>
</div>
);
};