upd

2025-03-20 14:26:57 +05:00
commit eb552cbdc8
55 changed files with 2212 additions and 0 deletions
@@ -0,0 +1,72 @@
+import Button from "../Button.tsx";
+import SessionIcon from "../icons/SessionIcon.tsx";
+import Input from "../Input.tsx";
+import useQueryApps from "../../queries/useQueryApps.ts";
+import useQueryServers from "../../queries/useQueryServers.ts";
+import Select from "../Select.tsx";
+import DisplayIcon from "../icons/DisplayIcon.tsx";
+
+export default function CreateSessionModal() {
+  const { data: apps } = useQueryApps();
+  const { data: servers } = useQueryServers();
+
+  return (
+    <div className="w-[34.375vw] h-full rounded-[0.833vw] bg-white p-[1.667vw] flex flex-col justify-between gap-[1.111vw]">
+      <div className="gap-y-[1.111vw] flex flex-col justify-between">
+        <div className="space-y-[0.556vw]">
+          <div className="p-[0.833vw] ring-1 w-fit rounded-[0.556vw]">
+            <div className="w-[1.389vw] h-[1.389vw]">
+              <DisplayIcon />
+            </div>
+          </div>
+          <p className="text-[1.389vw]">Создание сеанса</p>
+          <p className="text-[0.833vw] text-black/20">
+            Укажите данные клиента, выберите менеджера и стол
+          </p>
+        </div>
+        <hr className="border-black/10" />
+        <div className="flex justify-between items-center">
+          <p className="text-[0.972vw]">
+            Имя <span className="text-[#C6C6C699]">*</span>
+          </p>
+          <div className="outline outline-black/10 rounded-[0.556vw] w-[13.889vw]">
+            <Input placeholder="Константин" required />
+          </div>
+        </div>
+        <div className="flex justify-between items-center">
+          <p className="text-[0.972vw]">
+            Номер <span className="text-[#C6C6C699]">*</span>
+          </p>
+          <div className="outline outline-black/10 rounded-[0.556vw] w-[13.889vw]">
+            <Input placeholder="+ 7 (999) 99 99 99" required type="tel" />
+          </div>
+        </div>
+        <div className="flex justify-between items-center">
+          <p className="text-[0.972vw]">Электронная почта</p>
+          <div className="outline outline-black/10 rounded-[0.556vw] w-[13.889vw]">
+            <Input placeholder="sample@mail.ru" type="email" />
+          </div>
+        </div>
+        {apps && (
+          <div className="flex justify-between items-center">
+            <p className="text-[0.972vw]">Приложение</p>
+            <div className="outline outline-black/10 rounded-[0.556vw] w-[13.889vw]">
+              <Select
+                options={apps.map(({ id, name }) => ({ id, value: name }))}
+              />
+            </div>
+          </div>
+        )}
+        <hr className="border-black/10" />
+      </div>
+      <div className="flex justify-between">
+        <Button className="bg-[#F9F9F9] px-[2.222vw] py-[0.556vw] !rounded-[0.556vw]">
+          <p className="text-black font-medium text-[0.972vw]">Отменить</p>
+        </Button>
+        <Button className="bg-[#2D68F6] px-[2.222vw] py-[0.556vw] !rounded-[0.556vw]">
+          <p className="text-[0.972vw] font-medium">Запустить сеанс</p>
+        </Button>
+      </div>
+    </div>
+  );
+}