diff --git a/src/Pages/DocumentationPage/DocumentationPage.tsx b/src/Pages/DocumentationPage/DocumentationPage.tsx
index a65dcb2..2a6e2a6 100755
--- a/src/Pages/DocumentationPage/DocumentationPage.tsx
+++ b/src/Pages/DocumentationPage/DocumentationPage.tsx
@@ -1,4 +1,13 @@
-import { Box, Divider, TableOfContents, Title } from "@mantine/core";
+import {
+ Box,
+ Divider,
+ TableOfContents,
+ Title,
+ Text,
+ List,
+ Code,
+ Anchor,
+} from "@mantine/core";
import "./DocumentationPage.css";
import { Helmet } from "react-helmet";
@@ -6,15 +15,19 @@ function DocumentationPage() {
return (
<>
- Documentation | QMolSim
+ Документация | QMolSim
- Документация
+ Руководство пользователя
+
+ Автоматизированная система распределенного расчета энергии основного
+ состояния молекул
+
@@ -26,24 +39,291 @@ function DocumentationPage() {
minDepthToOffset={0}
depthOffset={20}
scrollSpyOptions={{
- selector: "section h1, h2",
+ selector: "section h1, section h2, section h3",
}}
- className=""
getControlProps={({ data }) => ({
onClick: () =>
data
.getNode()
- .scrollIntoView({ behavior: "smooth", block: "center" }),
+ .scrollIntoView({ behavior: "smooth", block: "start" }),
children: data.value,
})}
/>
-
+ {/* ================= 1 ВВЕДЕНИЕ ================= */}
+
1. Введение
+
+
+ 1.1 Область применения
+
+ Требования настоящего документа применяются при:
+
+ предварительных комплексных испытаниях;
+ опытной эксплуатации;
+ приемочных испытаниях;
+ промышленной эксплуатации.
+
+
+
+ 1.2 Краткое описание возможностей
+
+
+ Автоматизированная система распределенного расчета энергии
+ основного состояния молекул с помощью квантовых алгоритмов
+ представляет собой распределенный веб-сервис, предназначенный для
+ выполнения ресурсоемких квантово-химических расчетов с
+ использованием гибридной архитектуры, состоящей из центрального
+ сервера и распределенных квантовых симуляторов.
+
+
+
+ Управление командной работой
+
+
+ Пользователи могут создавать команды, приглашать других
+ исследователей, назначать права доступа.
+
+
+
+ Подключение вычислительных систем
+
+
+ Исследователи регистрируют в системе свои вычислительные узлы. Для
+ каждого узла исследователь задает максимальное количество кубитов,
+ а также предоставляет доступ командам на использование устройства.
+
+
+
+ Создание и запуск экспериментов
+
+
+ В рамках команды пользователь создает эксперимент (набор задач для
+ разных молекул). Для каждой задачи загружается или редактируется
+ структура молекулы в формате XYZ, задаются квантово-химические
+ параметры.
+
+
+
+ Распределенные вычисления VQE
+
+
+ При запуске эксперимента система автоматически распределяет задачи
+ по доступным вычислительным узлам с учетом их ограничений по числу
+ кубит. В процессе расчета на сервер передаются промежуточные
+ результаты.
+
+
+
+ Отказоустойчивость и восстановление
+
+
+ Каждый вычислительный узел каждые 5 секунд отправляет сигнал о
+ своей работоспособности. При выходе узла из строя незавершенная
+ задача автоматически перенаправляется в очередь и назначается на
+ другой узел с сохранением промежуточных весов оптимизации.
+
+
+
+ Визуализация молекул
+
+
+ Для каждой задачи доступна интерактивная 3D-визуализация молекулы
+ в шаростержневой модели.
+
+
+
+ Импорт молекулярных данных
+
+
+ Система поддерживает преобразование молекул в требуемый формат из
+ большинства существующих химических форматов.
+
-
- 1.1 Быстрое начало
+
+ {/* ================= 2 НАЗНАЧЕНИЕ И УСЛОВИЯ ================= */}
+
+ 2. Назначение и условия применения
+
+
+ 2.1 Назначение системы
+
+
+ Система предназначена для автоматизированного распределенного
+ расчета энергии основного состояния молекул с использованием
+ квантового алгоритма VQE. Она обеспечивает создание команд
+ исследователей с настройкой прав доступа, автоматическое
+ распределение вычислительных задач между доступными узлами,
+ мониторинг состояния вычислений и восстановление прогресса расчета
+ при сбое отдельных вычислительных систем. Применение системы
+ позволяет повысить скорость проведения квантово-химических
+ расчетов и снизить нагрузку на пользователя по управлению
+ вычислительным процессом. Система ориентирована на специалистов в
+ области квантовой химии и вычислительных технологий.
+
+
+
+ 2.2 Требования к техническим средствам
+
+
+
+ Клиент-браузер:
+
+
+ Оперативная память от 4 Гб;
+ Свободное пространство на диске от 2 Гб;
+ Процессор 4-ядерный с частотой от 2 ГГц;
+ Скорость подключения в интернет от 50 Мб/c;
+
+ Наличие манипулятора "мышь" или аналогичного устройства для
+ взаимодействия с интерфейсом;
+
+ Наличие Клавиатуры.
+
+
+
+ Клиент-ВС:
+
+
+ Оперативная память от 8 Гб;
+ Свободное пространство на диске от 5 Гб;
+
+ Процессор 8-ядерный с частотой от 2-4,4 ГГц;
+
+ Скорость подключения в интернет от 50 Мб/с;
+
+ Наличие манипулятора "мышь" или аналогичного устройства для
+ взаимодействия с интерфейсом;
+
+ Наличие Клавиатуры.
+
+
+
+ 2.3 Требования к программным средствам
+
+
+
+ Клиент-браузер:
+
+
+ Браузер (Safari 18.1.1, Яндекс Браузер 25.2.1, Google Chrome
+ 110.0.5481.100)
+
+
+
+ Клиент-ВС:
+
+
+ ОС Windows 10, Windows 11, MacOS, Linux
+
+ Браузер (Safari 18.1.1, Яндекс Браузер 25.2.1, Google Chrome
+ 110.0.5481.100)
+
+ Docker
+ Docker-compose v2
+
+
+
+ 3. Условия выполнения программы
+
+
+ Для работы системы требуется веб-браузер, поддерживающий
+ современные функции JavaScript (Google Chrome версии 110 и выше,
+ Яндекс Браузер версии 25.2.1 и выше, Safari версии 18.1.1 и выше).
+ Доступ к системе осуществляется через веб-интерфейс по адресу,
+ предоставленному администратором. Для работы вычислительных узлов
+ дополнительно требуется установленный Docker и Docker Compose v2
+ на каждой подключаемой вычислительной системе. Необходимо наличие
+ постоянного сетевого подключения к серверу для всех
+ взаимодействующих компонентов системы.
+
+
+
+ {/* ================= 4 ВЫПОЛНЕНИЕ ПРОГРАММЫ ================= */}
+
+ 4. Выполнение программы
+
+
+ 4.1 Инсталяция/деинсталяция
+
+
+ Клиент-браузер инсталляции и деинсталляции не требуется, для
+ работы необходимо только наличие на системе совместимого браузера.
+
+
+
+ Для инсталляции клиента-ВС:
+
+
+
+ На системе необходимо наличие docker и docker-compose v2
+
+
+ Необходимо скачать контейнер с помощью команды:{" "}
+ docker pull git.deowl.ru/vkrb/client:0.1.0
+
+
+ Затем скачать файл docker-compose с помощью команды:{" "}
+
+ curl -O
+ "https://git.deowl.ru/vkrb/local_quantum_simulator/raw/branch/main/docker-compose.yml"
+
+
+
+ Наконец, в той же папке необходимо создать файл переменных среды
+ с названием ".env" и содержимым:
+
+ {`PORT=5001
+STORAGE_PATH="/storage"
+RABBITMQ_HOST=rabbit.deowl.ru
+RABBITMQ_PORT=5672
+KEYCLOAK_URL=https://quantum-auth.deowl.ru
+KEYCLOAK_REALM_NAME=quant_sim-realm
+KEACLOAK_CLIENT_ID=local_quantum_sim
+QUANTUM_BACKEND_URL=https://quantum.deowl.ru`}
+
+
+
+
+
+ Для деинсталляции клиента-ВС:
+
+
+
+ Удаляем файлы «docker-compose.yml», «.env» и папку
+ «localStorage» (при ее наличие)
+
+
+ Удаляем установленное изображение с помощью команды:{" "}
+ docker image rm git.deowl.ru/vkrb/client:0.1.0
+
+
+
+
+ 4.2 Запуск / Остановка программы
+
+
+ Клиент-браузер может быть открыт по ссылке:{" "}
+
+ http://quantum.deowl.ru/
+
+
+
+ Для запуска клиента-ВС необходимо выполнить команду, находясь в
+ папке с файлом «docker-compose.yml»:{" "}
+ docker compose up --d
+
+
+ Для остановки клиента-ВС: docker compose down
+
+
+ Для первичного подключения и мониторинга статуса клиента-ВС
+ необходимо открыть ссылку:{" "}
+
+ http://localhost:5001/
+
+
diff --git a/src/Pages/ExperimentsPage/ExperimentPage.css b/src/Pages/ExperimentsPage/ExperimentPage.css
index cf10508..e17751b 100644
--- a/src/Pages/ExperimentsPage/ExperimentPage.css
+++ b/src/Pages/ExperimentsPage/ExperimentPage.css
@@ -2,15 +2,19 @@
flex-grow: 1;
display: flex;
flex-direction: column;
+ position: relative;
}
.experimentButtons {
display: flex;
- gap: 20px;
+
flex-direction: row;
- justify-content: right;
- width: fit-content;
- margin-left: auto;
+ justify-content: space-between;
+
+ width: 100%;
flex-wrap: nowrap;
text-wrap: nowrap;
+ * {
+ max-width: 200px;
+ }
}
diff --git a/src/Pages/ExperimentsPage/ExperimentPage.tsx b/src/Pages/ExperimentsPage/ExperimentPage.tsx
index 8c3a2ab..3b89fb1 100644
--- a/src/Pages/ExperimentsPage/ExperimentPage.tsx
+++ b/src/Pages/ExperimentsPage/ExperimentPage.tsx
@@ -1,22 +1,221 @@
-import { Alert, Center, Text } from "@mantine/core";
+import {
+ Alert,
+ Center,
+ LoadingOverlay,
+ Text,
+ UnstyledButton,
+ SimpleGrid,
+ Title,
+ TextInput,
+ Button,
+ Group,
+ Card,
+ Badge,
+ Collapse,
+ ActionIcon,
+} from "@mantine/core";
+import { notifications } from "@mantine/notifications";
import "./ExperimentPage.css";
import { PaginationContainer } from "Components/PaginationContainer/PaginationContainer";
-//import { NewMoleculeModal } from "Modals/NewMolecule/NewMolecule";
-import { useState } from "react";
+import { useEffect, useState } from "react";
import { Helmet } from "react-helmet";
-import { IconPlus, IconSettings } from "@tabler/icons-react";
+import {
+ IconPlus,
+ IconReload,
+ IconEdit,
+ IconX,
+ IconCheck,
+ IconChevronUp,
+ IconChevronDown,
+ IconCancel,
+} from "@tabler/icons-react";
import { useParams } from "react-router";
import CustomButton from "Components/CustomButton/CustomButton";
import { useExperimentStore } from "Stores/ExperimentStore";
+import type { ExperimentData, InstanceData } from "Types/Experiment/Experiment";
+import { useAuthenticationStore } from "Stores/AuthenticationStore";
+import {
+ getExperimentById,
+ getExperimentInstances,
+ getFrontendFile,
+ startExperiment,
+ updateExperiment,
+} from "Api/QuantumBackend/ExperimentsManagment";
+import InstancesListCard from "Components/ListCard/TaskListCard/TaskListCard";
+import { NewInstanceModal } from "Modals/NewTask/NewTask";
function ExperimentPage() {
- const [isOpen, setIsOpen] = useState(false);
+ const [isOpened, setIsOpen] = useState(false);
const { experiment_id } = useParams();
- const { experiments, addTask } = useExperimentStore();
+ const { experiments, addExperiment, instances, setInstances } =
+ useExperimentStore();
+ const [experiment, set_experiment] = useState
(
+ experiments.find((exp) => {
+ return exp.id == Number(experiment_id);
+ }),
+ );
- const experiment = experiments.find((exp) => {
- return exp.id == Number(experiment_id);
- });
+ const { profile, is_loading } = useAuthenticationStore();
+ const [is_loading_, set_is_loading] = useState(true);
+ const [isEditing, setIsEditing] = useState(false);
+ const [editedName, setEditedName] = useState("");
+ const [editedDesc, setEditedDesc] = useState("");
+ const [isExpanded, setIsExpanded] = useState(false);
+
+ const { loadedHtmlFiles, addLoadedHtml } = useExperimentStore();
+
+ const [total_experiment_inst, set_total_experiment_inst] =
+ useState(0);
+ const [page_size, set_page_size] = useState(5);
+ const [cur_page, set_cur_page] = useState(1);
+
+ const saveExperimentDetails = () => {
+ if (experiment && editedName.trim()) {
+ updateExperiment({
+ experiment_id: experiment.id,
+ name: editedName,
+ description: editedDesc,
+ })
+ .then((updated) => {
+ const updatedExperiment = {
+ ...experiment,
+ name: updated.name,
+ description: updated.description,
+ };
+ addExperiment(updatedExperiment);
+ set_experiment(updatedExperiment);
+ setIsEditing(false);
+ notifications.show({
+ title: "Успех",
+ message: "Информация об эксперименте обновлена",
+ color: "green",
+ });
+ })
+ .catch(() => {
+ notifications.show({
+ title: "Ошибка",
+ message: "Не удалось обновить информацию",
+ color: "red",
+ });
+ });
+ }
+ };
+
+ const cancelEditing = () => {
+ if (experiment) {
+ setEditedName(experiment.name);
+ setEditedDesc(experiment.description || "");
+ setIsEditing(false);
+ }
+ };
+
+ const startEditing = () => {
+ if (experiment) {
+ setEditedName(experiment.name);
+ setEditedDesc(experiment.description || "");
+ setIsEditing(true);
+ }
+ };
+
+ const handleExperimentStart = () => {
+ if (experiment) {
+ startExperiment({ experiment_id: experiment.id })
+ .then(() => {
+ getExperimentById(Number(experiment_id))
+ .then((exp) => {
+ addExperiment(exp);
+ set_experiment(exp);
+ getExperimentInstances(exp.id, cur_page, page_size)
+ .then((inst) => {
+ setInstances(inst.instances);
+ set_cur_page(inst.cur_page);
+ set_total_experiment_inst(inst.total_instances);
+ set_page_size(inst.page_size);
+ set_is_loading(false);
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ getFrontendFile(exp.experiment_type.id).then((file) => {
+ addLoadedHtml(exp.experiment_type.id, file);
+ });
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ })
+ .catch(() => {
+ notifications.show({
+ title: "Ошибка",
+ message:
+ "Не удалось начать эксперимент, проверьте наличие задач и их правильность",
+ color: "red",
+ icon: ,
+ });
+ });
+ }
+ };
+
+ useEffect(() => {
+ if (profile && !is_loading) {
+ if (!experiment) {
+ getExperimentById(Number(experiment_id))
+ .then((exp) => {
+ addExperiment(exp);
+ set_experiment(exp);
+ getExperimentInstances(exp.id, cur_page, page_size)
+ .then((inst) => {
+ setInstances(inst.instances);
+ set_cur_page(inst.cur_page);
+ set_total_experiment_inst(inst.total_instances);
+ set_page_size(inst.page_size);
+ set_is_loading(false);
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ getFrontendFile(exp.experiment_type.id).then((file) => {
+ addLoadedHtml(exp.experiment_type.id, file);
+ });
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ } else {
+ if (
+ (instances.length == 0 && cur_page != 0) ||
+ (total_experiment_inst > page_size &&
+ instances.length != page_size &&
+ cur_page != Math.ceil(total_experiment_inst / page_size))
+ ) {
+ getExperimentInstances(
+ experiment.id,
+ Math.min(cur_page, Math.ceil(total_experiment_inst / page_size)),
+ page_size,
+ )
+ .then((inst) => {
+ if (inst.instances.length == 0) {
+ set_cur_page(0);
+ setInstances([]);
+ } else {
+ setInstances(inst.instances);
+ set_cur_page(inst.cur_page);
+ set_total_experiment_inst(inst.total_instances);
+ set_page_size(inst.page_size);
+ }
+
+ set_is_loading(false);
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ getFrontendFile(experiment.experiment_type.id).then((file) => {
+ addLoadedHtml(experiment.experiment_type.id, file);
+ });
+ }
+ }
+ }
+ }, [profile, is_loading, instances]);
return (
<>
@@ -24,82 +223,350 @@ function ExperimentPage() {
{experiment
? "Experiment " + experiment.id + " | QMolSim"
- : "Error |QmolSim"}
+ : "Error | QMolSim"}
- {experiment && (
-
-
-
- {
- addTask(Number(experiment_id) || 0, {
- id: 1,
- name: "Задача 1",
- description: "",
- data: {},
- });
- setIsOpen(true);
- }}
- icon={}
- text="Добавить задачу"
- />
- {
- setIsOpen(true);
- }}
- icon={}
- text="Параметры эксперимента"
- />
-
-
- {experiment.tasks_ids.length > 0 && (
-
{}}
+
+ {experiment && (
+
+ )}
+
+ {experiment && (
+ <>
+
- {experiment.tasks_ids.map((task: number) => {
- return
{task}
;
- })}
-
- )}
- {experiment.tasks_ids.length == 0 && (
-
-
-
- Нет задач
-
-
-
- )}
-
- )}
- {!experiment && (
-
-
- {" "}
-
- Ошибка. Эксперимент не найден
- {" "}
-
-
- )}
+
+ {experiment.status == "DRAFT" && (
+ <>
+ {
+ handleExperimentStart();
+ }}
+ icon={}
+ text="Начать эксперимент"
+ />
+ {
+ setIsOpen(true);
+ }}
+ icon={}
+ text="Добавить задачу"
+ />
+
+ )}
+ {experiment.status != "DRAFT" && (
+ {
+ getExperimentById(Number(experiment_id))
+ .then((exp) => {
+ addExperiment(exp);
+ set_experiment(exp);
+ getExperimentInstances(exp.id)
+ .then((inst) => {
+ setInstances(inst.instances);
+ set_is_loading(false);
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ getFrontendFile(exp.experiment_type.id).then(
+ (file) => {
+ addLoadedHtml(exp.experiment_type.id, file);
+ },
+ );
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ }}
+ >
+
+
+ )}
+
+
+
+ ID
+
+
+ {experiment.id}
+
+
+
+
+ Тип
+
+
+ {experiment.experiment_type.name}
+
+
+
+
+ Название
+
+
+ {experiment.name}
+
+
+
+
+ Статус
+
+
+ {experiment.status}
+
+
+
+
+ Команда
+
+
+ {experiment.team.team_name}
+
+
+
+
+ Количество задач
+
+
+ {experiment.instances_count}
+
+
+
+
+ Описание
+
+
+ {experiment.description || "Нет описания"}
+
+
+
+
+ Создан
+
+
+ {new Date(experiment.created_at).toLocaleString()}
+
+
+
+ ) : (
+
+
+
+ Название
+
+ setEditedName(e.target.value)}
+ placeholder="Введите название"
+ />
+
+
+
+ Описание
+
+ setEditedDesc(e.target.value)}
+ placeholder="Введите описание"
+ />
+
+
+
+ ID
+
+
+ {experiment.id}
+
+
+
+
+ Тип
+
+
+ {experiment.experiment_type.name}
+
+
+
+
+ Команда
+
+
+ {experiment.team.team_name}
+
+
+
+
+ Статус
+
+
+ {experiment.status}
+
+
+
+ )}
+
+
+
+
+ {!is_loading_ && (
+ {
+ getExperimentInstances(experiment.id, page_num, page_size)
+ .then((inst) => {
+ setInstances(inst.instances);
+ set_cur_page(inst.cur_page);
+ set_total_experiment_inst(inst.total_instances);
+ set_page_size(inst.page_size);
+ set_is_loading(false);
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ }}
+ >
+ {instances &&
+ loadedHtmlFiles.get(experiment.experiment_type.id) &&
+ instances.map((inst: InstanceData) => {
+ return (
+
+ );
+ })}
+ {instances.length == 0 && !is_loading && (
+
+
+
+ Нет задач
+
+
+
+ )}
+
+ )}
+
+ )}
+ {!experiment && !is_loading_ && (
+
+
+ {" "}
+
+ Ошибка. Эксперимент не найден
+ {" "}
+
+
+ )}
+
-
- {teams && teams.length > 0 && (
-
- {
- setIsOpen(true);
- }}
- icon={}
- text="Создать эксперимент"
- />
-
- )}
+
+ {
+ setIsOpen(true);
+ }}
+ icon={}
+ text="Создать эксперимент"
+ />
+
+
+
{
+ getUserExperiments({ page_num: page_num, page_size: page_size })
+ .then((expData) => {
+ setExperiments(expData.experiments);
+ set_total_experiments(expData.total_experiments);
+ set_page_size(expData.page_size);
+ set_cur_page(expData.cur_page);
+ set_is_loading(false);
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ }}
+ >
+ {experiments.map((exp: ExperimentData) => {
+ return ;
+ })}
+ {teams && teams.length == 0 && (
+
+ Создайте или войдите в команду чтобы начать работу с
+ экспериментами
+
+ )}
+ {teams &&
+ teams.length != 0 &&
+ experiments.length == 0 &&
+ !is_loading_ && (
+
+ Вы еще не создали не один эксперимент
+
+ )}
+
-
{}}
- >
- {experiments.map((exp: Experiment) => {
- return (
- team.team_id == exp.team_id)}
- />
- );
- })}
- {teams && teams.length == 0 && (
-
- Создайте или войдите в команду чтобы начать работу с
- экспериментами
-
- )}
- {teams && teams.length != 0 && experiments.length == 0 && (
-
- Вы еще не создали не один эксперимент
-
- )}
-
);
diff --git a/src/Pages/TaskPage/TaskPage.css b/src/Pages/TaskPage/TaskPage.css
new file mode 100644
index 0000000..ca81b0c
--- /dev/null
+++ b/src/Pages/TaskPage/TaskPage.css
@@ -0,0 +1,13 @@
+.taskButtons {
+ display: flex;
+
+ flex-direction: row;
+ justify-content: right;
+ gap: 15px;
+ width: 100%;
+ flex-wrap: nowrap;
+ text-wrap: nowrap;
+ * {
+ max-width: 200px;
+ }
+}
diff --git a/src/Pages/TaskPage/TaskPage.tsx b/src/Pages/TaskPage/TaskPage.tsx
index d114112..cd134f1 100644
--- a/src/Pages/TaskPage/TaskPage.tsx
+++ b/src/Pages/TaskPage/TaskPage.tsx
@@ -1,13 +1,100 @@
import { Helmet } from "react-helmet";
-import { IconCancel, IconPlus, IconSettings } from "@tabler/icons-react";
+import { IconCancel, IconPlus } from "@tabler/icons-react";
import { useParams } from "react-router";
import CustomButton from "Components/CustomButton/CustomButton";
import { IframePlugin } from "Api/PluginLoader/PluginLoader";
-import { useState } from "react";
+import { useEffect, useState } from "react";
+import type { InstanceData } from "Types/Experiment/Experiment";
+import {
+ getFrontendFile,
+ getInstanceById,
+ updateInstance,
+} from "Api/QuantumBackend/ExperimentsManagment";
+import { useAuthenticationStore } from "Stores/AuthenticationStore";
+import { useExperimentStore } from "Stores/ExperimentStore";
+import { SimpleGrid, TextInput, Title } from "@mantine/core";
+import { notifications } from "@mantine/notifications";
+import "./TaskPage.css";
function TaskPage() {
const { task_id } = useParams();
- const [data, setData] = useState<{ text: string }>({ text: "" });
+
+ const [instance, set_instance] = useState
();
+ const { loadedHtmlFiles, addLoadedHtml, setInstances } = useExperimentStore();
+ const { profile, is_loading } = useAuthenticationStore();
+ const [, set_is_loading] = useState(true);
+ const [data, setData] = useState();
+ const [progress, setProgress] = useState();
+ const [qubits_needed, set_qubits_needed] = useState();
+
+ const [name, setName] = useState();
+ const [descr, setDescr] = useState("");
+ const [reload, setReload] = useState(0);
+
+ const saveData = () => {
+ if (instance && qubits_needed) {
+ updateInstance({
+ instance_id: instance.instance_id,
+ name: name,
+ description: descr,
+ instance_data: JSON.stringify(data),
+ qubits_needed: qubits_needed,
+ }).then((updated) => {
+ set_instance({
+ instance_id: instance.instance_id,
+ name: updated.name,
+ description: updated.description,
+ instance_data: updated.instance_data,
+ qubits_needed: updated.qubits_needed,
+ simulation_result: instance.simulation_result,
+ });
+ setName(updated.name);
+ setDescr(updated.description || "");
+ setData(updated.instance_data);
+ });
+ } else {
+ if (!qubits_needed) {
+ notifications.show({
+ message: "Количество кубит не было определено",
+ });
+ }
+ }
+ };
+
+ const ResetData = () => {
+ if (instance) {
+ setData(instance.instance_data);
+ setName(instance.name);
+ setDescr(instance.description || "");
+ setReload(reload + 1);
+ }
+ };
+
+ useEffect(() => {
+ if (profile && !is_loading && task_id) {
+ getInstanceById(Number(task_id))
+ .then((inst) => {
+ set_instance(inst);
+ setData(inst.instance_data);
+ setProgress(inst.simulation_result?.simulation_result);
+ setName(inst.name);
+ setDescr(inst.description || "");
+ set_qubits_needed(inst.qubits_needed);
+ getFrontendFile(1).then((file) => {
+ addLoadedHtml(1, file);
+ });
+ set_is_loading(false);
+ })
+ .catch(() => {
+ set_is_loading(false);
+ });
+ }
+
+ return () => {
+ setInstances([]);
+ };
+ }, [profile, is_loading]);
+
return (
<>
@@ -29,39 +116,77 @@ function TaskPage() {
marginBottom: "15px",
}}
>
-
-
{}}
- icon={}
- text="Сохранить"
- />
- {}}
- icon={}
- text="Отменить"
- />
+ {(!instance?.simulation_result ||
+ instance?.simulation_result?.status == "DRAFT") && (
+ <>
+
+ }
+ text="Сохранить"
+ />
+ }
+ text="Отменить"
+ disabled={
+ JSON.stringify(data) ==
+ JSON.stringify(instance?.instance_data) &&
+ instance?.name == name &&
+ (instance?.description || "") == (descr || "")
+ }
+ />
+
+
+ )}
+
+
+ Имя:
+ {
+ setName(e.target.value);
+ } //set_username(e.currentTarget.value)
+ }
+ />
+ Описание:
+ {
+ setDescr(e.target.value);
+ } //set_email(e.currentTarget.value)
+ }
+ />
+