first commmit

2026-06-04 09:06:22 +03:00
commit f240b55dda
53 changed files with 6445 additions and 0 deletions
@@ -0,0 +1,114 @@
+import { useState } from "react";
+import * as api from "../api"; // Импортируем все функции из api/index.js
+import Header from "../components/Header";
+
+export default function Dashboard() {
+  const [formData, setFormData] = useState({
+    name: "",
+    unit: "",
+    city: "",
+    price: "",
+    category: "",
+  });
+
+  const handleChange = (e) => {
+    const { name, value } = e.target;
+    setFormData({
+      ...formData,
+      [name]: value,
+    });
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+
+    const payload = {
+      ...formData,
+      price: parseFloat(formData.price) || 0,
+    };
+
+    try {
+      const response = await api.addItem(payload);
+      console.log("Товар добавлен", response.data);
+
+      setFormData({ name: "", unit: "", city: "", price: "", category: "" });
+    } catch (err) {
+      console.error(err);
+      alert(err);
+    }
+  };
+
+  return (
+    <div>
+      <Header />
+      <div className="max-w-md mx-auto mt-10 p-6 bg-white rounded-lg shadow-md border">
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <div>
+            <label className="block text-sm font-medium text-slate-500 mb-1">
+              Название товара
+            </label>
+            <input
+              className="w-full border p-2 rounded focus:ring-2 focus:ring-blue-500 outline-none"
+              type="text"
+              name="unit"
+              required
+              value={formData.unit}
+              onChange={handleChange}
+              placeholder="кг, шт, упаковка"
+            ></input>
+            <label className="block text-sm font-medium text-slate-500 mb-1">
+              Город
+            </label>
+            <input
+              className="w-full border p-2 rounded focus:ring-2 focus:ring-blue-500 outline-none"
+              type="text"
+              name="city"
+              required
+              value={formData.city}
+              onChange={handleChange}
+              placeholder="Город"
+            ></input>
+            <label className="block text-sm font-medium text-slate-500 mb-1">
+              Название товара
+            </label>
+            <input
+              className="w-full border p-2 rounded focus:ring-2 focus:ring-blue-500 outline-none"
+              type="text"
+              name="name"
+              required
+              value={formData.name}
+              onChange={handleChange}
+              placeholder="Название товара"
+            ></input>
+            <label className="block text-sm font-medium text-slate-500 mb-1">
+              Стоимость
+            </label>
+            <input
+              className="w-full border p-2 rounded focus:ring-2 focus:ring-blue-500 outline-none"
+              type="number"
+              name="price"
+              required
+              value={formData.price}
+              onChange={handleChange}
+              placeholder="Стоимость"
+            ></input>
+            <label className="block text-sm font-medium text-slate-500 mb-1">
+              Категория
+            </label>
+            <input
+              className="w-full border p-2 rounded focus:ring-2 focus:ring-blue-500 outline-none"
+              type="text"
+              name="category"
+              required
+              value={formData.category}
+              onChange={handleChange}
+              placeholder="Рыба, крабы, гребешки"
+            ></input>
+
+            <button type="submit">Добавить товар</button>
+          </div>
+        </form>
+      </div>
+    </div>
+  );
+}
@@ -0,0 +1,52 @@
+import { useEffect, useState } from "react";
+import * as api from "../api"; // Импортируем все функции из api/index.js
+import Header from "../components/Header";
+import Footer from "../components/Footer";
+
+export default function Dashboard() {
+  const [items, setItems] = useState([]);
+
+  useEffect(() => {
+    api
+      .getAllItems()
+      .then((res) => {
+        setItems(res.data);
+      })
+      .catch((err) => {
+        console.error("Ошибка при получении товара с сервера", err);
+      });
+  }, []);
+
+  return (
+    <div>
+      <Header />
+      <div className="p-4 flex flex-col w-full gap-4">
+        {Array.isArray(items) &&
+          items.map((item) => (
+            <div
+              key={item.id}
+              className="bg-white flex flex-col justify-center items-start p-4 border border-slate-500 rounded-lg shadow-sm"
+            >
+              <div className="text-gray-500 text-xs">ID: ${item.id}</div>
+              <div className="text-xl font-black text-slate-800">
+                {item.name}
+              </div>
+              <div className="text-xl font-black text-slate-800">
+                {item.price}
+              </div>
+              <div className="text-xl font-black text-slate-800">
+                {item.name}
+              </div>
+              <div className="text-xl font-black text-slate-800">
+                {item.category}
+              </div>
+              <div className="text-xl font-black text-slate-800">
+                {item.unit}
+              </div>
+            </div>
+          ))}
+      </div>
+      <Footer />
+    </div>
+  );
+}