diff --git a/frontend/src/pages/ItemPage.jsx b/frontend/src/pages/ItemPage.jsx
new file mode 100644
index 0000000..e3571e4
--- /dev/null
+++ b/frontend/src/pages/ItemPage.jsx
@@ -0,0 +1,150 @@
+import PageLayout from "../components/PageLayout";
+import { useState, useEffect } from "react";
+import { useParams } from "react-router-dom";
+import { getItem, addToCart } from "../api/index";
+import Arrow from "../components/Arrow";
+
+export default function ItemPage() {
+ const { id } = useParams();
+ const [item, setItem] = useState(null);
+ const [loading, setLoading] = useState(true);
+ const [quantity, setQuantity] = useState(1);
+
+ useEffect(() => {
+ getItem(id)
+ .then((res) => setItem(res.data))
+ .catch(() => { })
+ .finally(() => setLoading(false));
+ }, [id]);
+
+ const isPiece = item?.unit_type === "piece";
+ const step = isPiece ? 1 : 0.1;
+ const minValue = isPiece ? 1 : 0.1;
+
+ useEffect(() => {
+ if (item) setQuantity(isPiece ? 1 : 0.1);
+ }, [item, isPiece]);
+
+ const handleIncrement = () => {
+ setQuantity((prev) => parseFloat((prev + step).toFixed(3)));
+ };
+ const handleDecrement = () => {
+ setQuantity((prev) =>
+ prev > minValue ? parseFloat((prev - step).toFixed(3)) : minValue,
+ );
+ };
+
+ const handleAddToCart = async () => {
+ try {
+ await addToCart({ item_id: item.id, quantity });
+ alert(`${item.name} добавлен в корзину`);
+ } catch {
+ alert("Не удалось добавить товар в корзину");
+ }
+ };
+
+ if (loading) {
+ return (
+
+ Загрузка...
+
+ );
+ }
+
+ if (!item) {
+ return (
+
+ Товар не найден
+
+ );
+ }
+
+ return (
+
+
+
+ {/* ЛЕВО — фото */}
+
+
+
+
+ {/* ПРАВО — всё инфо в одной колонке */}
+
+
+ {item.name}
+
+
+
+ {item.price} ₽
+ / {item.unit}
+
+
+
+
+ Категория
+ {item.category}
+
+
+ Город
+ {item.city}
+
+
+ Тип
+ {isPiece ? "Поштучно" : "На вес"}
+
+
+ В наличии
+ 0 ? "text-green-400" : "text-red-400"}
+ >
+ {item.stock > 0 ? `${item.stock} ${item.unit}` : "нет"}
+
+
+
+
+
+ Количество:
+
+
+ {quantity} {item.unit}
+
+
+
+
+
+ Стоимость:{" "}
+
+ {parseFloat((quantity * item.price).toFixed(2))} ₽
+
+
+
+
+
+
navigate(`/items/${oi.item.id}`)}
/>
{oi.item?.name}