diff --git a/src/api.jsx b/src/api.jsx
index 6a8b7df..e3df771 100755
--- a/src/api.jsx
+++ b/src/api.jsx
@@ -458,3 +458,55 @@ export const deleteUser = async (id) => {
     throw error;
   }
 };
+
+export const getTotalOrders = async () => {
+  try {
+    const response = await axios.get(`${API_URL}/total-orders`, {
+      headers: {
+        Authorization: `Bearer ${getAuthToken()}`,
+        Accept: "application/json",
+      },
+    });
+    return response.data;
+  } catch (error) {
+    console.log("Ошибка при загрузке общих заказов:", error);
+    throw error;
+  }
+};
+
+export const createTotalOrder = async () => {
+  try {
+    const response = await axios.post(
+      `${API_URL}/total-orders`,
+      {},
+      {
+        headers: {
+          Authorization: `Bearer ${getAuthToken()}`,
+          "Content-Type": "application/json",
+        },
+      }
+    );
+    return response.data;
+  } catch (error) {
+    console.log("Ошибка при создании общего заказа:", error);
+    throw error;
+  }
+};
+
+export const getDeliveryOrders = async (totalOrderId) => {
+  try {
+    const response = await axios.get(
+      `${API_URL}/delivery-orders/total/${totalOrderId}`,
+      {
+        headers: {
+          Authorization: `Bearer ${getAuthToken()}`,
+          Accept: "application/json",
+        },
+      }
+    );
+    return response.data;
+  } catch (error) {
+    console.log("Ошибка при загрузке подзаказов:", error);
+    throw error;
+  }
+};
diff --git a/src/components/DeliveryOrdersList.jsx b/src/components/DeliveryOrdersList.jsx
new file mode 100644
index 0000000..cb41808
--- /dev/null
+++ b/src/components/DeliveryOrdersList.jsx
@@ -0,0 +1,37 @@
+import { getDeliveryOrders } from "../api";
+import React, { useState, useEffect } from "react";
+
+const DeliveryOrdersList = ({ totalOrderId, onSubOrderClick }) => {
+  const [deliveryOrders, setDeliveryOrders] = useState([]);
+
+  useEffect(() => {
+    fetchDeliveryOrders();
+  }, [totalOrderId]);
+
+  const fetchDeliveryOrders = async () => {
+    try {
+      const orders = await getDeliveryOrders(totalOrderId);
+      setDeliveryOrders(orders);
+    } catch (error) {
+      console.error("Ошибка при загрузке подзаказов:", error);
+    }
+  };
+
+  return (
+    <div>
+      {deliveryOrders.map((order, index) => (
+        <div
+          key={order.id}
+          className="card mb-1"
+          onClick={() => onSubOrderClick(order.id)}
+        >
+          <div className="card-body">
+            Подзаказ #{index + 1} {/* Отображение порядкового номера */}
+          </div>
+        </div>
+      ))}
+    </div>
+  );
+};
+
+export default DeliveryOrdersList;
diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
index 7436445..aa087f4 100644
--- a/src/pages/Home.jsx
+++ b/src/pages/Home.jsx
@@ -1,3 +1,74 @@
-const Home = () => {};
+import React, { useState, useEffect } from "react";
+import { useNavigate } from "react-router-dom";
+import DeliveryOrdersList from "../components/DeliveryOrdersList.jsx";
+import { getTotalOrders, createTotalOrder } from "../api.jsx";
+
+const Home = () => {
+  const [totalOrders, setTotalOrders] = useState([]);
+  const [expandedOrderId, setExpandedOrderId] = useState(null);
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    fetchTotalOrders();
+  }, []);
+
+  const fetchTotalOrders = async () => {
+    try {
+      const orders = await getTotalOrders();
+      setTotalOrders(orders);
+    } catch (error) {
+      console.error("Ошибка при загрузке заказов:", error);
+    }
+  };
+
+  const handleCreateOrder = async () => {
+    try {
+      const newOrder = await createTotalOrder();
+      setTotalOrders([...totalOrders, newOrder]);
+    } catch (error) {
+      console.error("Ошибка при создании заказа:", error);
+    }
+  };
+
+  const handleToggleAccordion = (orderId) => {
+    if (expandedOrderId === orderId) {
+      setExpandedOrderId(null);
+    } else {
+      setExpandedOrderId(orderId);
+    }
+  };
+
+  const handleSubOrderClick = (subOrderId) => {
+    navigate(`/sub-orders/${subOrderId}`);
+  };
+
+  return (
+    <div className="container mt-4">
+      <button className="btn btn-primary mb-3" onClick={handleCreateOrder}>
+        + Создать
+      </button>
+
+      {totalOrders.map((order) => (
+        <div key={order.id} className="card mb-2">
+          <div
+            className="card-header"
+            onClick={() => handleToggleAccordion(order.id)}
+          >
+            Заказ от {new Date(order.order_datetime).toLocaleString()}
+          </div>
+
+          {expandedOrderId === order.id && (
+            <div className="card-body">
+              <DeliveryOrdersList
+                totalOrderId={order.id}
+                onSubOrderClick={handleSubOrderClick}
+              />
+            </div>
+          )}
+        </div>
+      ))}
+    </div>
+  );
+};
 
 export default Home;