@evergis/react 3.1.67 → 3.1.68

package/dist/components/Dashboard/containers/TaskContainer/components/LogTerminal/index.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+interface TaskLogTerminalProps {
+    log?: string | Record<string, any>;
+}
+export declare const LogTerminal: FC<TaskLogTerminalProps>;
+export {};

package/dist/components/Dashboard/containers/TaskContainer/components/LogTerminal/styled.d.ts

@@ -0,0 +1 @@
+export declare const TerminalWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/hooks/task/usePythonTask.d.ts

@@ -10,7 +10,7 @@ export declare const usePythonTask: () => {
     }) => Promise<void>;
     stopTask: () => Promise<void>;
     openLog: () => void;
-    result: string;
+    log: string;
     error: Error;
     status: RemoteTaskStatus;
     loading: boolean;

package/dist/index.js

@@ -24,6 +24,9 @@ require('mapbox-gl/dist/mapbox-gl.css');
 var react = require('swiper/react');
 var ReactMarkdown = require('react-markdown');
 var remarkGfm = require('remark-gfm');
+var xterm = require('@xterm/xterm');
+var addonFit = require('@xterm/addon-fit');
+require('@xterm/xterm/css/xterm.css');
 
 const AddFeatureButton = ({ title, icon = "feature_add" /* , layerName, geometryType*/ }) => {
     // const [, handleAddFeature] = useFeatureCreator(layerName, geometryType);
@@ -4828,14 +4831,14 @@ const usePythonTask = () => {
     const { api: api$1, t } = useGlobalContext();
     const { addSubscription, connection, unsubscribeById } = useServerNotificationsContext();
     const [status, setStatus] = React.useState(api.RemoteTaskStatus.Unknown);
-    const [result, setResult] = React.useState(null);
+    const [log, setLog] = React.useState(null);
     const [error, setError] = React.useState(null);
     const [loading, setLoading] = React.useState(false);
     const [executionTime, setExecutionTime] = React.useState(null);
     const [taskId, setTaskId] = React.useState(null);
     const [subscriptionId, setSubscriptionId] = React.useState(null);
     const [isLogDialogOpen, setIsLogDialogOpen] = React.useState(false);
-    const resultRef = React.useRef(null);
+    const logRef = React.useRef(null);
     const reset = React.useCallback(() => {
         setStatus(api.RemoteTaskStatus.Unknown);
         setError(null);
@@ -4847,7 +4850,7 @@ const usePythonTask = () => {
     const runTask = React.useCallback(async ({ resourceId, parameters, script, fileName, methodName, }) => {
         reset();
         setStatus(api.RemoteTaskStatus.Process);
-        setResult(null);
+        setLog(null);
         setLoading(true);
         const start = Date.now();
         let prototypeId = await api$1.remoteTaskManager.createTaskPrototype({
@@ -4872,7 +4875,7 @@ const usePythonTask = () => {
         const { id: newTaskId, success } = await api$1.remoteTaskManager.startTask1(prototypeId);
         if (!success) {
             setStatus(api.RemoteTaskStatus.Error);
-            setResult(t("taskRunFail", { ns: "devMode", defaultValue: "Не удалось запустить задачу" }));
+            setLog(t("taskRunFail", { ns: "devMode", defaultValue: "Не удалось запустить задачу" }));
             setExecutionTime(Date.now() - start);
             setLoading(false);
         }
@@ -4885,10 +4888,8 @@ const usePythonTask = () => {
         const onNotification = ({ data }) => {
             if (data?.taskId === newTaskId) {
                 setStatus(data.status);
-                setResult([data.log, resultRef.current].filter(Boolean).join("\n\n"));
-                setError(null);
+                setLog([logRef.current, data.log].filter(Boolean).join("\n\n"));
                 setExecutionTime(Date.now() - start);
-                setLoading(false);
                 setTaskId([api.RemoteTaskStatus.Completed, api.RemoteTaskStatus.Error].includes(data.status)
                     ? undefined
                     : newTaskId);
@@ -4915,14 +4916,14 @@ const usePythonTask = () => {
         setIsLogDialogOpen(false);
     }, []);
     React.useEffect(() => {
-        resultRef.current = result;
-    }, [result]);
+        logRef.current = log;
+    }, [log]);
     return {
         taskId,
         runTask,
         stopTask,
         openLog,
-        result,
+        log,
         error,
         status,
         loading,
@@ -6768,7 +6769,7 @@ const StatusBadge = styled(uilibGl.Flex) `
   color: ${({ theme }) => theme.palette.iconContrast};
   border-radius: 0.25rem;
 `;
-const LogContainer = styled.div `
+styled.div `
   flex: 1;
   padding: 1rem;
   background-color: ${({ theme }) => theme.palette.element};
@@ -6782,14 +6783,127 @@ const LogContainer = styled.div `
   max-height: 31.25rem;
 `;
 
+const TerminalWrapper = styled.div `
+  flex: 1;
+  overflow: hidden;
+  padding: 0;
+  margin: 1rem;
+  box-sizing: border-box;
+  min-height: 0;
+
+  & && .xterm-viewport {
+    overflow-y: auto;
+  }
+`;
+
+const LogTerminal = ({ log }) => {
+    const terminalRef = React.useRef(null);
+    const xtermRef = React.useRef(null);
+    const fitAddonRef = React.useRef(null);
+    const previousLogRef = React.useRef("");
+    const theme = styled.useTheme();
+    // Initialize terminal
+    React.useEffect(() => {
+        if (!terminalRef.current)
+            return;
+        // Create terminal instance
+        const terminal = new xterm.Terminal({
+            cursorBlink: false,
+            fontSize: 12,
+            fontFamily: '"Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro", monospace',
+            theme: {
+                background: theme.palette.devBackgroundDark,
+                foreground: theme.palette.textPrimary,
+                cursor: theme.palette.primary,
+            },
+            scrollback: 10000,
+            convertEol: true,
+            lineHeight: 1.5,
+        });
+        // Create fit addon
+        const fitAddon = new addonFit.FitAddon();
+        terminal.loadAddon(fitAddon);
+        // Open terminal
+        terminal.open(terminalRef.current);
+        fitAddon.fit();
+        // Store refs
+        xtermRef.current = terminal;
+        fitAddonRef.current = fitAddon;
+        // Handle window resize
+        const handleResize = () => {
+            fitAddon.fit();
+        };
+        window.addEventListener("resize", handleResize);
+        // Cleanup
+        return () => {
+            window.removeEventListener("resize", handleResize);
+            terminal.dispose();
+            xtermRef.current = null;
+            fitAddonRef.current = null;
+        };
+    }, [theme]);
+    // Update log content
+    React.useEffect(() => {
+        if (!xtermRef.current)
+            return;
+        // Handle different log types
+        if (typeof log === "string") {
+            // For string logs, only write the new content (append mode)
+            const previousLog = previousLogRef.current;
+            if (log !== previousLog) {
+                if (log.startsWith(previousLog)) {
+                    // Log is accumulated - write only the new part
+                    const newContent = log.substring(previousLog.length);
+                    xtermRef.current.write(`${newContent.replace(/\n/g, "\r\n")}\r\n`);
+                }
+                else {
+                    // Log was replaced completely - clear and write all
+                    xtermRef.current.clear();
+                    xtermRef.current.write(`${log.replace(/\n/g, "\r\n")}\r\n`);
+                }
+                previousLogRef.current = log;
+            }
+        }
+        else if (typeof log === "object") {
+            // JSON object (results) - always replace
+            xtermRef.current.clear();
+            const formatted = JSON.stringify(log, null, 2);
+            xtermRef.current.write(formatted.replace(/\n/g, "\r\n"));
+            previousLogRef.current = "";
+        }
+        else if (!log) {
+            // No log - clear terminal
+            xtermRef.current.clear();
+            previousLogRef.current = "";
+        }
+        // Scroll to bottom
+        xtermRef.current.scrollToBottom();
+    }, [log]);
+    // Fit terminal on container resize
+    React.useEffect(() => {
+        if (!fitAddonRef.current)
+            return;
+        const resizeObserver = new ResizeObserver(() => {
+            fitAddonRef.current?.fit();
+        });
+        if (terminalRef.current) {
+            resizeObserver.observe(terminalRef.current);
+        }
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, []);
+    return jsxRuntime.jsx(TerminalWrapper, { ref: terminalRef });
+};
+
 const STATUS_TRANSLATION_KEYS = {
-    [api.RemoteTaskStatus.Process]: "task.status.process",
-    [api.RemoteTaskStatus.Completed]: "task.status.completed",
-    [api.RemoteTaskStatus.Error]: "task.status.error",
-    [api.RemoteTaskStatus.Unknown]: "task.status.unknown",
+    [api.RemoteTaskStatus.Process]: "taskProcess",
+    [api.RemoteTaskStatus.Completed]: "taskCompleted",
+    [api.RemoteTaskStatus.Error]: "taskError",
+    [api.RemoteTaskStatus.Unknown]: "taskUnknown",
 };
 const STATUS_DEFAULT_VALUES = {
-    [api.RemoteTaskStatus.Process]: "Выполняется...",
+    [api.RemoteTaskStatus.Process]: "Остановить",
     [api.RemoteTaskStatus.Completed]: "Завершено",
     [api.RemoteTaskStatus.Error]: "Ошибка",
     [api.RemoteTaskStatus.Unknown]: "Неизвестно",
@@ -6803,12 +6917,6 @@ const STATUS_COLORS = {
 
 const LogDialog = ({ isOpen, onClose, logs, status, statusColors }) => {
     const { t } = useGlobalContext();
-    const contentRef = React.useRef(null);
-    React.useEffect(() => {
-        if (contentRef.current) {
-            contentRef.current.scrollTop = 0;
-        }
-    }, [logs]);
     const getStatusText = React.useCallback((status) => {
         const translationKey = STATUS_TRANSLATION_KEYS[status] || STATUS_TRANSLATION_KEYS[api.RemoteTaskStatus.Unknown];
         const defaultValue = STATUS_DEFAULT_VALUES[status] || STATUS_DEFAULT_VALUES[api.RemoteTaskStatus.Unknown];
@@ -6817,7 +6925,7 @@ const LogDialog = ({ isOpen, onClose, logs, status, statusColors }) => {
     const getStatusColor = React.useCallback((status) => {
         return statusColors?.[status] || STATUS_COLORS[status] || STATUS_COLORS[api.RemoteTaskStatus.Unknown];
     }, [statusColors]);
-    return (jsxRuntime.jsxs(uilibGl.Dialog, { isOpen: isOpen, onCloseRequest: onClose, modal: true, maxWidth: "800px", minWidth: "600px", minHeight: "400px", children: [jsxRuntime.jsx(uilibGl.DialogTitle, { children: jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: "space-between", alignItems: "center", children: [jsxRuntime.jsx("span", { children: t("task.logs.title", { ns: "dashboard", defaultValue: "Логи выполнения задачи" }) }), jsxRuntime.jsx(uilibGl.IconButton, { kind: "close", onClick: onClose })] }) }), jsxRuntime.jsx(uilibGl.DialogContent, { children: jsxRuntime.jsxs(uilibGl.Flex, { flexDirection: "column", height: "100%", marginBottom: "2rem", children: [jsxRuntime.jsxs(StatusBadge, { "$statusColor": getStatusColor(status), children: [t("task.status.label", { ns: "dashboard", defaultValue: "Статус" }), ": ", getStatusText(status)] }), jsxRuntime.jsx(LogContainer, { ref: contentRef, children: logs || t("task.logs.empty", { ns: "dashboard", defaultValue: "Логи отсутствуют" }) })] }) })] }));
+    return (jsxRuntime.jsxs(uilibGl.Dialog, { isOpen: isOpen, onCloseRequest: onClose, modal: true, maxWidth: "800px", minWidth: "600px", minHeight: "400px", children: [jsxRuntime.jsx(uilibGl.DialogTitle, { children: jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: "space-between", alignItems: "center", children: [jsxRuntime.jsx("span", { children: t("taskLogs", { ns: "dashboard", defaultValue: "Логи выполнения задачи" }) }), jsxRuntime.jsx(uilibGl.IconButton, { kind: "close", onClick: onClose })] }) }), jsxRuntime.jsx(uilibGl.DialogContent, { children: jsxRuntime.jsxs(uilibGl.Flex, { flexDirection: "column", height: "100%", marginBottom: "2rem", children: [jsxRuntime.jsxs(StatusBadge, { "$statusColor": getStatusColor(status), children: [t("taskStatus", { ns: "dashboard", defaultValue: "Статус" }), ": ", getStatusText(status)] }), jsxRuntime.jsx(LogTerminal, { log: logs || t("taskLogsEmpty", { ns: "dashboard", defaultValue: "Логи отсутствуют" }) })] }) })] }));
 };
 
 const StatusWaitingButton = styled(uilibGl.WaitingButton) `
@@ -6831,14 +6939,18 @@ const StatusWaitingButton = styled(uilibGl.WaitingButton) `
   `}
 `;
 
-const TaskContainer = React.memo(({ type, elementConfig }) => {
+const TaskContainer = React.memo(({ type, elementConfig, renderElement }) => {
     const { t, ewktGeometry } = useGlobalContext();
     const { dataSources, filters: selectedFilters } = useWidgetContext(type);
     const { currentPage } = useWidgetPage(type);
-    const { taskId, runTask, stopTask, status, openLog, loading, isLogDialogOpen, closeLog, result } = usePythonTask();
+    const { taskId, runTask, stopTask, status, openLog, loading, isLogDialogOpen, closeLog, log } = usePythonTask();
     const { options } = elementConfig || {};
     const { title, relatedResources, center, icon, statusColors } = options || {};
     const onClick = React.useCallback(async () => {
+        if (taskId) {
+            await stopTask();
+            return;
+        }
         await Promise.all(relatedResources.map(({ resourceId, parameters, script, fileName, methodName }) => {
             const newParams = applyQueryFilters({
                 parameters,
@@ -6849,8 +6961,8 @@ const TaskContainer = React.memo(({ type, elementConfig }) => {
             });
             return runTask({ resourceId, parameters: newParams, script, fileName, methodName });
         }));
-    }, [currentPage.filters, dataSources, ewktGeometry, relatedResources, runTask, selectedFilters]);
-    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: center ? "center" : "flex-start", children: [jsxRuntime.jsxs(StatusWaitingButton, { primary: true, status: status, statusColors: statusColors, isWaiting: loading, disabled: !relatedResources?.length, onClick: onClick, children: [icon && jsxRuntime.jsx(uilibGl.FlexSpan, { marginRight: "0.5rem", children: jsxRuntime.jsx(uilibGl.Icon, { kind: icon }) }), title || t("run", { ns: "dashboard", defaultValue: "Запуск" })] }), !!taskId && (jsxRuntime.jsx(uilibGl.IconButton, { kind: "stop", onClick: stopTask })), !!result && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(uilibGl.IconButton, { kind: "info", onClick: openLog }), jsxRuntime.jsx(LogDialog, { isOpen: isLogDialogOpen, onClose: closeLog, logs: result, status: status, statusColors: statusColors })] }))] }) }));
+    }, [currentPage.filters, dataSources, ewktGeometry, relatedResources, runTask, selectedFilters, stopTask, taskId]);
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ExpandableTitle, { elementConfig: elementConfig, type: type, renderElement: renderElement }), jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: center ? "center" : "flex-start", children: [jsxRuntime.jsxs(StatusWaitingButton, { primary: true, status: status, statusColors: statusColors, isWaiting: loading || !!taskId, disabled: !relatedResources?.length, onClick: onClick, children: [icon && jsxRuntime.jsx(uilibGl.FlexSpan, { marginRight: "0.5rem", children: jsxRuntime.jsx(uilibGl.Icon, { kind: icon }) }), title || t("run", { ns: "dashboard", defaultValue: "Запуск" })] }), !!taskId && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(uilibGl.IconButton, { kind: "info", onClick: openLog }), jsxRuntime.jsx(LogDialog, { logs: log, status: status, statusColors: statusColors, isOpen: isLogDialogOpen, onClose: closeLog })] }))] })] }));
 });
 
 const containerComponents = {
@@ -7680,27 +7792,30 @@ const StyledIcon = styled(uilibGl.Icon) `
 
 const ElementIcon = React.memo(({ type, elementConfig }) => {
     const { attributes } = useWidgetContext(type);
-    const { value, attributeName, options } = elementConfig || {};
+    const { value, attributeName, options, style } = elementConfig || {};
     const { fontSize, fontColor } = options || {};
     const iconValue = React.useMemo(() => (attributeName ? attributes?.find(item => item.name === attributeName)?.value : value), [attributeName, attributes, value]);
-    return jsxRuntime.jsx(StyledIcon, { kind: iconValue, fontSize: fontSize, fontColor: fontColor });
+    return jsxRuntime.jsx(StyledIcon, { kind: iconValue, fontSize: fontSize, fontColor: fontColor, style: style });
 });
 
 const ElementImage = React.memo(({ type, elementConfig }) => {
     const { attributes } = useWidgetContext(type);
-    const { value, attributeName, options } = elementConfig || {};
+    const { value, attributeName, options, style } = elementConfig || {};
     const { width } = options || {};
     const firstImage = React.useMemo(() => {
         if (value) {
-            return value.toString();
+            return getResourceUrl(value.toString());
         }
         if (!attributeName || Array.isArray(attributeName)) {
             return null;
         }
         const attribute = attributes?.find(item => item.name === attributeName);
-        return attribute?.value?.split(";")?.[0];
+        const imageUrl = attribute?.value?.split(";")?.[0];
+        if (!imageUrl)
+            return null;
+        return getResourceUrl(imageUrl);
     }, [attributeName, attributes, value]);
-    return firstImage ? jsxRuntime.jsx("img", { src: firstImage, alt: firstImage, width: width }) : null;
+    return firstImage ? jsxRuntime.jsx("img", { src: firstImage, alt: firstImage, width: width, style: style }) : null;
 });
 
 const ElementLegend = React.memo(({ type, element, elementConfig }) => {