diff --git a/Lab5/Bookfill/src/components/lines/form/LinesForm.jsx b/Lab5/Bookfill/src/components/lines/form/LinesForm.jsx index bc9a59a..5bdc212 100644 --- a/Lab5/Bookfill/src/components/lines/form/LinesForm.jsx +++ b/Lab5/Bookfill/src/components/lines/form/LinesForm.jsx @@ -1,40 +1,23 @@ import PropTypes from 'prop-types'; import { Button, Form } from 'react-bootstrap'; import { useNavigate } from 'react-router-dom'; -import useLinesItemForm from '../hooks/LinesItemFormHook'; import LinesItemForm from './LinesItemForm.jsx'; -const LinesForm = ({ id }) => { +const LinesForm = ({ item }) => { const navigate = useNavigate(); - const { - item, - validated, - handleSubmit, - handleChange, - } = useLinesItemForm(id); - const onBack = () => { navigate(-1); }; - const onSubmit = async (event) => { - if (await handleSubmit(event)) { - onBack(); - } - }; - return ( <> -
- + + - @@ -42,7 +25,7 @@ const LinesForm = ({ id }) => { }; LinesForm.propTypes = { - id: PropTypes.string, + item: PropTypes.object, }; export default LinesForm; diff --git a/Lab5/Bookfill/src/components/lines/form/LinesItemForm.jsx b/Lab5/Bookfill/src/components/lines/form/LinesItemForm.jsx index 13d5cb2..81f99d7 100644 --- a/Lab5/Bookfill/src/components/lines/form/LinesItemForm.jsx +++ b/Lab5/Bookfill/src/components/lines/form/LinesItemForm.jsx @@ -1,32 +1,45 @@ import PropTypes from 'prop-types'; -import imgPlaceholder from '../../../assets/200.png'; -import Input from '../../input/Input.jsx'; -import Select from '../../input/Select.jsx'; -import useTypes from '../../types/hooks/TypesHook'; +import { FilePost } from 'react-bootstrap-icons'; import './LinesItemForm.css'; -const LinesItemForm = ({ item, handleChange }) => { - const { types } = useTypes(); +const LinesItemForm = ({ item }) => { + // Функция для конвертации base64 строки в Blob + const base64ToBlob = (base64) => { + // Кодируем строку base64 обратно в массив байтов + const byteCharacters = atob(base64.split(',')[1]); + const byteNumbers = Array.from(byteCharacters).map((char) => char.charCodeAt(0)); + const byteArray = new Uint8Array(byteNumbers); + + // Создаем Blob из типизированного массива байтов + return new Blob([byteArray], { type: 'application/pdf' }); + }; + + const openFile = (base64) => { + const base64Prefix = 'data:application/pdf;base64,'; + const content = base64.includes(base64Prefix) ? base64 : `${base64Prefix}${base64}`; + + // Создаем Blob из base64 строки + const blob = base64ToBlob(content); + + // Создаем URL для Blob + const fileURL = URL.createObjectURL(blob); + + // Открываем URL в новой вкладке + window.open(fileURL); + // openFile(line.datafile)}> + }; return ( <> -
+
placeholder -
-
- - - - - + src={item.image} /> +
+

Name: {item.book_name}

+

Author: {item.author_name}

+

Price: {item.price}

+ openFile(item.datafile)}> +
); @@ -34,7 +47,6 @@ const LinesItemForm = ({ item, handleChange }) => { LinesItemForm.propTypes = { item: PropTypes.object, - handleChange: PropTypes.func, }; export default LinesItemForm; diff --git a/Lab5/Bookfill/src/components/lines/hooks/LinesItemHook.js b/Lab5/Bookfill/src/components/lines/hooks/LinesItemHook.js index aa0ae04..5c6de28 100644 --- a/Lab5/Bookfill/src/components/lines/hooks/LinesItemHook.js +++ b/Lab5/Bookfill/src/components/lines/hooks/LinesItemHook.js @@ -3,14 +3,12 @@ import LinesApiService from '../service/LinesApiService'; const useLinesItem = (id) => { const emptyItem = { - id: '', + typeId: '', book_name: '', author_name: '', - typeId: '', - price: '0', - count: '0', + price: '', image: '', - data_file: '', + datafile: '', }; const [item, setItem] = useState({ ...emptyItem }); diff --git a/Lab5/Bookfill/src/components/lines/table/BookCarousel.jsx b/Lab5/Bookfill/src/components/lines/table/BookCarousel.jsx index 8b2cb33..b7c662c 100644 --- a/Lab5/Bookfill/src/components/lines/table/BookCarousel.jsx +++ b/Lab5/Bookfill/src/components/lines/table/BookCarousel.jsx @@ -1,6 +1,7 @@ import PropTypes from 'prop-types'; import { Carousel } from 'react-bootstrap'; import { Heart } from 'react-bootstrap-icons'; +import { useNavigate } from 'react-router-dom'; import useCart from '../../cart/CartHook'; import './LinesTableRow.css'; // Предполагается, что стили для карусели описаны здесь @@ -12,38 +13,20 @@ const BookCarousel = ({ action(); }; + const navigate = useNavigate(); + + const handlePageClick = (event, path) => { + event.preventDefault(); + navigate(path); + }; + const { addToCart } = useCart(); - // Функция для конвертации base64 строки в Blob - const base64ToBlob = (base64) => { - // Кодируем строку base64 обратно в массив байтов - const byteCharacters = atob(base64.split(',')[1]); - const byteNumbers = Array.from(byteCharacters).map((char) => char.charCodeAt(0)); - const byteArray = new Uint8Array(byteNumbers); - - // Создаем Blob из типизированного массива байтов - return new Blob([byteArray], { type: 'application/pdf' }); - }; - - const openFile = (base64) => { - const base64Prefix = 'data:application/pdf;base64,'; - const content = base64.includes(base64Prefix) ? base64 : `${base64Prefix}${base64}`; - - // Создаем Blob из base64 строки - const blob = base64ToBlob(content); - - // Создаем URL для Blob - const fileURL = URL.createObjectURL(blob); - - // Открываем URL в новой вкладке - window.open(fileURL); - }; - return ( {lines.map((line) => ( - openFile(line.datafile)}> + handlePageClick(event, `/page-edit/${line.id}`)}> , }, { diff --git a/Lab5/Bookfill/src/pages/PageEdit.jsx b/Lab5/Bookfill/src/pages/PageEdit.jsx index 624bb27..66855bc 100644 --- a/Lab5/Bookfill/src/pages/PageEdit.jsx +++ b/Lab5/Bookfill/src/pages/PageEdit.jsx @@ -1,11 +1,13 @@ import { useParams } from 'react-router-dom'; import LinesForm from '../components/lines/form/LinesForm.jsx'; +import useLinesItem from '../components/lines/hooks/LinesItemHook'; const PageEdit = () => { const { id } = useParams(); + const { item } = useLinesItem(id); return ( - + ); };