Add tenders card

src/app/[locale]/tenders/page.tsx

@@ -4,10 +4,16 @@ import React from "react";
 
 const Tenders = () => {
   return (
+    <div className="bg-[#E4F1FB]">
       <Container>
-      <Title text="Тендеры" size="md" className="text-lg font-bold mb-[39px]" />
+        <Title
+          text="Тендеры"
+          size="md"
+          className="text-lg font-bold mb-[39px] pt-[101px]"
+        />
         <TendersList />
       </Container>
+    </div>
   );
 };
 

src/entities/TenderCard.tsx

@@ -0,0 +1,47 @@
+import { Title } from "@/shared/ui";
+import React from "react";
+
+interface Props {
+  id: number;
+  id_of_card: string;
+  data_rk: string;
+  name_of_organization: string;
+  type_of_buy: string;
+  name_of_buy: string;
+  date_of_publication_datetime: string;
+  date_of_offer_datetime: string;
+  current_timestamp: string;
+}
+const TenderCard: React.FC<Props> = ({
+  id,
+  id_of_card,
+  data_rk,
+  name_of_organization,
+  type_of_buy,
+  name_of_buy,
+  date_of_publication_datetime,
+  date_of_offer_datetime,
+  current_timestamp,
+}: Props) => {
+  return (
+    <div className="w-full min-h-[213px] bg-white shadow-sm rounded-sm flex gap-[82px] items-center p-6">
+      <div className="w-[840px]">
+        <Title
+          text={`№ ${id_of_card}`}
+          className="font-bold text-[24px] mb-[48px]"
+        />
+        <Title
+          text={name_of_buy}
+          className="text-[18px] font-semibold leading-6 text-[#489FE1] mb-6"
+        />
+        <Title
+          text={name_of_organization}
+          className="text-[18px] leading-6 font-normal"
+        />
+      </div>
+      <div className="w-[285px]"></div>
+    </div>
+  );
+};
+
+export default TenderCard;

src/widgets/TendersList/TendersList.tsx

@@ -2,6 +2,7 @@
 import React, { useEffect, useState } from "react";
 import { useTendersStore } from "./tendersStore";
 import { data } from "autoprefixer";
+import TenderCard from "@/entities/TenderCard";
 
 interface Props {}
 const TendersList = () => {
@@ -11,8 +12,27 @@ const TendersList = () => {
   useEffect(() => {
     getTenders(ordering);
   }, []);
-  console.log(data);
-  return <div>df</div>;
+  console.log(tenders);
+  return (
+    <div className="bg-#E4F1FB">
+      <div className="flex flex-col gap-2">
+        {tenders?.results?.map((tender) => (
+          <TenderCard
+            key={tender.id}
+            id={tender.id}
+            id_of_card={tender.id_of_card}
+            data_rk={tender.data_rk}
+            name_of_organization={tender.name_of_organization}
+            type_of_buy={tender.type_of_buy}
+            name_of_buy={tender.name_of_buy}
+            date_of_publication_datetime={tender.date_of_publication_datetime}
+            date_of_offer_datetime={tender.date_of_offer_datetime}
+            current_timestamp={tender.current_timestamp}
+          />
+        ))}
+      </div>
+    </div>
+  );
 };
 
 export default TendersList;

src/widgets/TendersList/tendersStore.ts

@@ -22,8 +22,8 @@ export const useTendersStore = create<useTendersStore>((set) => ({
     try {
       set({ isLoading: true });
 
-      const res = await apiInstance.get(`/procurements/?ordering${ordering}`);
-      set({ data: res.data.results });
+      const res = await apiInstance.get(`/procurements/?ordering=${ordering}`);
+      set({ data: res.data });
     } catch (error: unknown) {
       if (error instanceof AxiosError) {
         set({ error: error.message });