From 7bb72f56e62cce4cb9d24f67f6f5521157865eda Mon Sep 17 00:00:00 2001
From: Shu Yao <springrainyszxr@gmail.com>
Date: Sat, 10 Jan 2026 22:35:32 +0800
Subject: [PATCH 1/6] add: batch execution API added

---
 pyproject.toml                       |   1 +
 server/routes/__init__.py            |   3 +-
 server/routes/batch.py               |  61 +++++++
 server/services/batch_parser.py      | 192 ++++++++++++++++++++
 server/services/batch_run_service.py | 255 +++++++++++++++++++++++++++
 uv.lock                              |  23 +++
 workflow/graph_context.py            |   3 +-
 7 files changed, 536 insertions(+), 2 deletions(-)
 create mode 100644 server/routes/batch.py
 create mode 100644 server/services/batch_parser.py
 create mode 100644 server/services/batch_run_service.py

diff --git a/pyproject.toml b/pyproject.toml
index 4d66c797..e1dad706 100755
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -30,6 +30,7 @@ dependencies = [
     "networkx",
     "cartopy",
     "pandas>=2.3.3",
+    "openpyxl>=3.1.2",
     "numpy>=2.3.5",
     "seaborn>=0.13.2",
     "google-genai>=1.52.0",
diff --git a/server/routes/__init__.py b/server/routes/__init__.py
index 464fcab5..32706ea7 100755
--- a/server/routes/__init__.py
+++ b/server/routes/__init__.py
@@ -1,6 +1,6 @@
 """Aggregates API routers."""
 
-from . import artifacts, execute, health, sessions, uploads, vuegraphs, workflows, websocket
+from . import artifacts, batch, execute, health, sessions, uploads, vuegraphs, workflows, websocket
 
 ALL_ROUTERS = [
     health.router,
@@ -9,6 +9,7 @@ ALL_ROUTERS = [
     uploads.router,
     artifacts.router,
     sessions.router,
+    batch.router,
     execute.router,
     websocket.router,
 ]
diff --git a/server/routes/batch.py b/server/routes/batch.py
new file mode 100644
index 00000000..819aa165
--- /dev/null
+++ b/server/routes/batch.py
@@ -0,0 +1,61 @@
+import asyncio
+
+from fastapi import APIRouter, File, Form, HTTPException, UploadFile
+
+from entity.enums import LogLevel
+from server.services.batch_parser import parse_batch_file
+from server.services.batch_run_service import BatchRunService
+from server.state import ensure_known_session
+from utils.exceptions import ValidationError
+
+router = APIRouter()
+
+
+@router.post("/api/workflows/batch")
+async def execute_batch(
+    file: UploadFile = File(...),
+    session_id: str = Form(...),
+    yaml_file: str = Form(...),
+    max_parallel: int = Form(5),
+    log_level: str | None = Form(None),
+):
+    try:
+        manager = ensure_known_session(session_id, require_connection=True)
+    except ValidationError as exc:
+        raise HTTPException(status_code=400, detail=str(exc))
+
+    if max_parallel < 1:
+        raise HTTPException(status_code=400, detail="max_parallel must be >= 1")
+
+    try:
+        content = await file.read()
+        tasks, file_base = parse_batch_file(content, file.filename or "batch.csv")
+    except ValidationError as exc:
+        raise HTTPException(status_code=400, detail=str(exc))
+
+    resolved_level = None
+    if log_level:
+        try:
+            resolved_level = LogLevel(log_level)
+        except ValueError:
+            raise HTTPException(status_code=400, detail="log_level must be either DEBUG or INFO")
+
+    service = BatchRunService()
+    asyncio.create_task(
+        service.run_batch(
+            session_id,
+            yaml_file,
+            tasks,
+            manager,
+            max_parallel=max_parallel,
+            file_base=file_base,
+            log_level=resolved_level,
+        )
+    )
+
+    return {
+        "status": "accepted",
+        "session_id": session_id,
+        "batch_id": session_id,
+        "task_count": len(tasks),
+    }
diff --git a/server/services/batch_parser.py b/server/services/batch_parser.py
new file mode 100644
index 00000000..75218ac7
--- /dev/null
+++ b/server/services/batch_parser.py
@@ -0,0 +1,192 @@
+"""Parse batch task files (CSV/Excel) into runnable tasks."""
+
+import json
+from dataclasses import dataclass
+from io import BytesIO
+from pathlib import Path
+from typing import Any, Dict, List, Optional, Tuple
+
+import pandas as pd
+
+from utils.exceptions import ValidationError
+
+
+@dataclass(frozen=True)
+class BatchTask:
+    row_index: int
+    task_id: Optional[str]
+    task_prompt: str
+    attachment_paths: List[str]
+    vars_override: Dict[str, Any]
+
+
+def parse_batch_file(content: bytes, filename: str) -> Tuple[List[BatchTask], str]:
+    """Parse a CSV/Excel batch file and return tasks plus file base name."""
+    suffix = Path(filename or "").suffix.lower()
+    if suffix not in {".csv", ".xlsx", ".xls"}:
+        raise ValidationError("Unsupported file type; must be .csv or .xlsx/.xls", field="file")
+
+    if suffix == ".csv":
+        df = _read_csv(content)
+    else:
+        df = _read_excel(content)
+
+    file_base = Path(filename).stem or "batch"
+    tasks = _parse_dataframe(df)
+    if not tasks:
+        raise ValidationError("Batch file contains no tasks", field="file")
+    return tasks, file_base
+
+
+def _read_csv(content: bytes) -> pd.DataFrame:
+    try:
+        import chardet
+    except Exception:
+        chardet = None
+    encoding = "utf-8"
+    if chardet:
+        detected = chardet.detect(content)
+        encoding = detected.get("encoding") or encoding
+    try:
+        return pd.read_csv(BytesIO(content), encoding=encoding)
+    except Exception as exc:
+        raise ValidationError(f"Failed to read CSV: {exc}", field="file")
+
+
+def _read_excel(content: bytes) -> pd.DataFrame:
+    try:
+        return pd.read_excel(BytesIO(content))
+    except Exception as exc:
+        raise ValidationError(f"Failed to read Excel file: {exc}", field="file")
+
+
+def _parse_dataframe(df: pd.DataFrame) -> List[BatchTask]:
+    column_map = {str(col).strip().lower(): col for col in df.columns}
+    id_col = column_map.get("id")
+    task_col = column_map.get("task")
+    attachments_col = column_map.get("attachments")
+    vars_col = column_map.get("vars")
+
+    tasks: List[BatchTask] = []
+    seen_ids: set[str] = set()
+
+    for row_index, row in enumerate(df.to_dict(orient="records"), start=1):
+        task_prompt = _get_cell_text(row, task_col)
+        attachment_paths = _parse_json_list(row, attachments_col, row_index)
+        vars_override = _parse_json_dict(row, vars_col, row_index)
+
+        if not task_prompt and not attachment_paths:
+            raise ValidationError(
+                "Task and attachments cannot both be empty",
+                details={"row_index": row_index},
+            )
+
+        task_id = _get_cell_text(row, id_col)
+        if task_id:
+            if task_id in seen_ids:
+                raise ValidationError(
+                    "Duplicate ID in batch file",
+                    details={"row_index": row_index, "task_id": task_id},
+                )
+            seen_ids.add(task_id)
+
+        tasks.append(
+            BatchTask(
+                row_index=row_index,
+                task_id=task_id or None,
+                task_prompt=task_prompt,
+                attachment_paths=attachment_paths,
+                vars_override=vars_override,
+            )
+        )
+    return tasks
+
+
+def _get_cell_text(row: Dict[str, Any], column: Optional[str]) -> str:
+    if not column:
+        return ""
+    value = row.get(column)
+    if value is None:
+        return ""
+    if isinstance(value, float) and pd.isna(value):
+        return ""
+    if pd.isna(value):
+        return ""
+    return str(value).strip()
+
+
+def _parse_json_list(
+    row: Dict[str, Any],
+    column: Optional[str],
+    row_index: int,
+) -> List[str]:
+    if not column:
+        return []
+    raw_value = row.get(column)
+    if raw_value is None or (isinstance(raw_value, float) and pd.isna(raw_value)):
+        return []
+    if isinstance(raw_value, list):
+        return _ensure_string_list(raw_value, row_index, "Attachments")
+    if isinstance(raw_value, str):
+        if not raw_value.strip():
+            return []
+        try:
+            parsed = json.loads(raw_value)
+        except json.JSONDecodeError as exc:
+            raise ValidationError(
+                f"Invalid JSON in Attachments: {exc}",
+                details={"row_index": row_index},
+            )
+        return _ensure_string_list(parsed, row_index, "Attachments")
+    raise ValidationError(
+        "Attachments must be a JSON list",
+        details={"row_index": row_index},
+    )
+
+
+def _parse_json_dict(
+    row: Dict[str, Any],
+    column: Optional[str],
+    row_index: int,
+) -> Dict[str, Any]:
+    if not column:
+        return {}
+    raw_value = row.get(column)
+    if raw_value is None or (isinstance(raw_value, float) and pd.isna(raw_value)):
+        return {}
+    if isinstance(raw_value, dict):
+        return raw_value
+    if isinstance(raw_value, str):
+        if not raw_value.strip():
+            return {}
+        try:
+            parsed = json.loads(raw_value)
+        except json.JSONDecodeError as exc:
+            raise ValidationError(
+                f"Invalid JSON in Vars: {exc}",
+                details={"row_index": row_index},
+            )
+        if not isinstance(parsed, dict):
+            raise ValidationError(
+                "Vars must be a JSON object",
+                details={"row_index": row_index},
+            )
+        return parsed
+    raise ValidationError(
+        "Vars must be a JSON object",
+        details={"row_index": row_index},
+    )
+
+
+def _ensure_string_list(value: Any, row_index: int, field: str) -> List[str]:
+    if not isinstance(value, list):
+        raise ValidationError(
+            f"{field} must be a JSON list",
+            details={"row_index": row_index},
+        )
+    result: List[str] = []
+    for item in value:
+        if item is None or (isinstance(item, float) and pd.isna(item)):
+            continue
+        result.append(str(item))
+    return result
diff --git a/server/services/batch_run_service.py b/server/services/batch_run_service.py
new file mode 100644
index 00000000..649fda77
--- /dev/null
+++ b/server/services/batch_run_service.py
@@ -0,0 +1,255 @@
+"""Batch workflow execution helpers."""
+
+import asyncio
+import csv
+import json
+import logging
+import re
+import time
+import uuid
+from pathlib import Path
+from typing import Any, Dict, List, Optional
+
+from check.check import load_config
+from entity.enums import LogLevel
+from entity.graph_config import GraphConfig
+from utils.exceptions import ValidationError
+from utils.task_input import TaskInputBuilder
+from workflow.graph import GraphExecutor
+from workflow.graph_context import GraphContext
+
+from server.services.batch_parser import BatchTask
+from server.services.workflow_storage import validate_workflow_filename
+from server.settings import WARE_HOUSE_DIR, YAML_DIR
+
+
+class BatchRunService:
+    """Runs batch workflows and reports progress over WebSocket."""
+
+    def __init__(self) -> None:
+        self.logger = logging.getLogger(__name__)
+
+    async def run_batch(
+        self,
+        session_id: str,
+        yaml_file: str,
+        tasks: List[BatchTask],
+        websocket_manager,
+        *,
+        max_parallel: int = 5,
+        file_base: str = "batch",
+        log_level: Optional[LogLevel] = None,
+    ) -> None:
+        batch_id = session_id
+        total = len(tasks)
+
+        await websocket_manager.send_message(
+            session_id,
+            {"type": "batch_started", "data": {"batch_id": batch_id, "total": total}},
+        )
+
+        semaphore = asyncio.Semaphore(max_parallel)
+        success_count = 0
+        failure_count = 0
+        result_rows: List[Dict[str, Any]] = []
+        result_lock = asyncio.Lock()
+
+        async def run_task(task: BatchTask) -> None:
+            nonlocal success_count, failure_count
+            task_id = task.task_id or str(uuid.uuid4())
+            task_dir = self._sanitize_label(f"{file_base}-{task_id}")
+
+            await websocket_manager.send_message(
+                session_id,
+                {
+                    "type": "batch_task_started",
+                    "data": {
+                        "row_index": task.row_index,
+                        "task_id": task_id,
+                        "task_dir": task_dir,
+                    },
+                },
+            )
+
+            try:
+                result = await asyncio.to_thread(
+                    self._run_single_task,
+                    session_id,
+                    yaml_file,
+                    task,
+                    task_dir,
+                    log_level,
+                )
+                success_count += 1
+                async with result_lock:
+                    result_rows.append(
+                        {
+                            "row_index": task.row_index,
+                            "task_id": task_id,
+                            "task_dir": task_dir,
+                            "status": "success",
+                            "duration_ms": result["duration_ms"],
+                            "token_usage": result["token_usage"],
+                            "graph_output": result["graph_output"],
+                            "results": result["results"],
+                            "error": "",
+                        }
+                    )
+                await websocket_manager.send_message(
+                    session_id,
+                    {
+                        "type": "batch_task_completed",
+                        "data": {
+                            "row_index": task.row_index,
+                            "task_id": task_id,
+                            "task_dir": task_dir,
+                            "results": result["results"],
+                            "token_usage": result["token_usage"],
+                            "duration_ms": result["duration_ms"],
+                        },
+                    },
+                )
+            except Exception as exc:
+                failure_count += 1
+                async with result_lock:
+                    result_rows.append(
+                        {
+                            "row_index": task.row_index,
+                            "task_id": task_id,
+                            "task_dir": task_dir,
+                            "status": "failed",
+                            "duration_ms": None,
+                            "token_usage": None,
+                            "graph_output": "",
+                            "results": None,
+                            "error": str(exc),
+                        }
+                    )
+                await websocket_manager.send_message(
+                    session_id,
+                    {
+                        "type": "batch_task_failed",
+                        "data": {
+                            "row_index": task.row_index,
+                            "task_id": task_id,
+                            "task_dir": task_dir,
+                            "error": str(exc),
+                        },
+                    },
+                )
+
+        async def run_with_limit(task: BatchTask) -> None:
+            async with semaphore:
+                await run_task(task)
+
+        await asyncio.gather(*(run_with_limit(task) for task in tasks))
+
+        self._write_batch_outputs(session_id, result_rows)
+
+        await websocket_manager.send_message(
+            session_id,
+            {
+                "type": "batch_completed",
+                "data": {
+                    "batch_id": batch_id,
+                    "total": total,
+                    "succeeded": success_count,
+                    "failed": failure_count,
+                },
+            },
+        )
+
+    def _write_batch_outputs(self, session_id: str, result_rows: List[Dict[str, Any]]) -> None:
+        output_root = WARE_HOUSE_DIR / f"session_{session_id}"
+        output_root.mkdir(parents=True, exist_ok=True)
+
+        csv_path = output_root / "batch_results.csv"
+        json_path = output_root / "batch_manifest.json"
+
+        fieldnames = [
+            "row_index",
+            "task_id",
+            "task_dir",
+            "status",
+            "duration_ms",
+            "token_usage",
+            "results",
+            "error",
+        ]
+
+        with csv_path.open("w", newline="", encoding="utf-8") as handle:
+            writer = csv.DictWriter(handle, fieldnames=fieldnames, extrasaction="ignore")
+            writer.writeheader()
+            for row in result_rows:
+                row_copy = dict(row)
+                row_copy["token_usage"] = json.dumps(row_copy.get("token_usage"))
+                row_copy["results"] = row_copy.get("graph_output", "")
+                writer.writerow(row_copy)
+
+        with json_path.open("w", encoding="utf-8") as handle:
+            json.dump(result_rows, handle, ensure_ascii=True, indent=2)
+
+    def _run_single_task(
+        self,
+        session_id: str,
+        yaml_file: str,
+        task: BatchTask,
+        task_dir: str,
+        log_level: Optional[LogLevel],
+    ) -> Dict[str, Any]:
+        yaml_path = self._resolve_yaml_path(yaml_file)
+        design = load_config(yaml_path, vars_override=task.vars_override or None)
+        if any(node.type == "human" for node in design.graph.nodes):
+            raise ValidationError(
+                "Batch execution does not support human nodes",
+                details={"yaml_file": yaml_file},
+            )
+
+        output_root = WARE_HOUSE_DIR / f"session_{session_id}"
+        graph_config = GraphConfig.from_definition(
+            design.graph,
+            name=task_dir,
+            output_root=output_root,
+            source_path=str(yaml_path),
+            vars=design.vars,
+        )
+        graph_config.metadata["fixed_output_dir"] = True
+
+        if log_level:
+            graph_config.log_level = log_level
+            graph_config.definition.log_level = log_level
+
+        graph_context = GraphContext(config=graph_config)
+
+        start_time = time.perf_counter()
+        executor = GraphExecutor(graph_context, session_id=session_id)
+        task_input = self._build_task_input(executor.attachment_store, task)
+        executor._execute(task_input)
+        duration_ms = int((time.perf_counter() - start_time) * 1000)
+
+        return {
+            "results": executor.outputs,
+            "token_usage": executor.token_tracker.get_token_usage(),
+            "duration_ms": duration_ms,
+            "graph_output": executor.get_final_output(),
+        }
+
+    @staticmethod
+    def _build_task_input(attachment_store, task: BatchTask):
+        if task.attachment_paths:
+            builder = TaskInputBuilder(attachment_store)
+            return builder.build_from_file_paths(task.task_prompt, task.attachment_paths)
+        return task.task_prompt
+
+    @staticmethod
+    def _sanitize_label(value: str) -> str:
+        cleaned = re.sub(r"[^a-zA-Z0-9._-]+", "_", value)
+        return cleaned.strip("_") or "task"
+
+    @staticmethod
+    def _resolve_yaml_path(yaml_filename: str) -> Path:
+        safe_name = validate_workflow_filename(yaml_filename, require_yaml_extension=True)
+        yaml_path = YAML_DIR / safe_name
+        if not yaml_path.exists():
+            raise ValidationError("YAML file not found", details={"yaml_file": safe_name})
+        return yaml_path
diff --git a/uv.lock b/uv.lock
index e2de06ed..d79bc2d9 100755
--- a/uv.lock
+++ b/uv.lock
@@ -390,6 +390,7 @@ dependencies = [
     { name = "networkx" },
     { name = "numpy" },
     { name = "openai" },
+    { name = "openpyxl" },
     { name = "pandas" },
     { name = "pydantic" },
     { name = "pygame" },
@@ -422,6 +423,7 @@ requires-dist = [
     { name = "networkx" },
     { name = "numpy", specifier = ">=2.3.5" },
     { name = "openai" },
+    { name = "openpyxl", specifier = ">=3.1.2" },
     { name = "pandas", specifier = ">=2.3.3" },
     { name = "pydantic", specifier = "==2.12.5" },
     { name = "pygame", specifier = ">=2.6.1" },
@@ -494,6 +496,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/de/15/545e2b6cf2e3be84bc1ed85613edd75b8aea69807a71c26f4ca6a9258e82/email_validator-2.3.0-py3-none-any.whl", hash = "sha256:80f13f623413e6b197ae73bb10bf4eb0908faf509ad8362c5edeb0be7fd450b4", size = 35604, upload-time = "2025-08-26T13:09:05.858Z" },
 ]
 
+[[package]]
+name = "et-xmlfile"
+version = "2.0.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/d3/38/af70d7ab1ae9d4da450eeec1fa3918940a5fafb9055e934af8d6eb0c2313/et_xmlfile-2.0.0.tar.gz", hash = "sha256:dab3f4764309081ce75662649be815c4c9081e88f0837825f90fd28317d4da54", size = 17234, upload-time = "2024-10-25T17:25:40.039Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/c1/8b/5fe2cc11fee489817272089c4203e679c63b570a5aaeb18d852ae3cbba6a/et_xmlfile-2.0.0-py3-none-any.whl", hash = "sha256:7a91720bc756843502c3b7504c77b8fe44217c85c537d85037f0f536151b2caa", size = 18059, upload-time = "2024-10-25T17:25:39.051Z" },
+]
+
 [[package]]
 name = "exceptiongroup"
 version = "1.3.1"
@@ -1147,6 +1158,18 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/12/cf/03675d8bd8ecbf4445504d8071adab19f5f993676795708e36402ab38263/openapi_pydantic-0.5.1-py3-none-any.whl", hash = "sha256:a3a09ef4586f5bd760a8df7f43028b60cafb6d9f61de2acba9574766255ab146", size = 96381, upload-time = "2025-01-08T19:29:25.275Z" },
 ]
 
+[[package]]
+name = "openpyxl"
+version = "3.1.5"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "et-xmlfile" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/3d/f9/88d94a75de065ea32619465d2f77b29a0469500e99012523b91cc4141cd1/openpyxl-3.1.5.tar.gz", hash = "sha256:cf0e3cf56142039133628b5acffe8ef0c12bc902d2aadd3e0fe5878dc08d1050", size = 186464, upload-time = "2024-06-28T14:03:44.161Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/c0/da/977ded879c29cbd04de313843e76868e6e13408a94ed6b987245dc7c8506/openpyxl-3.1.5-py2.py3-none-any.whl", hash = "sha256:5282c12b107bffeef825f4617dc029afaf41d0ea60823bbb665ef3079dc79de2", size = 250910, upload-time = "2024-06-28T14:03:41.161Z" },
+]
+
 [[package]]
 name = "opentelemetry-api"
 version = "1.39.1"
diff --git a/workflow/graph_context.py b/workflow/graph_context.py
index f43c1019..56fcc3be 100755
--- a/workflow/graph_context.py
+++ b/workflow/graph_context.py
@@ -61,7 +61,8 @@ class GraphContext:
         
         # Output directory
         timestamp = datetime.now().strftime("%Y%m%d%H%M%S")
-        if "session_" in config.name:
+        fixed_output_dir = bool(config.metadata.get("fixed_output_dir"))
+        if fixed_output_dir or "session_" in config.name:
             self.directory = config.output_root / config.name
         else:
             self.directory = config.output_root / f"{config.name}_{timestamp}"

From 4648ea662c82c0a93be3833f5207529eae124125 Mon Sep 17 00:00:00 2001
From: Shu Yao <springrainyszxr@gmail.com>
Date: Mon, 12 Jan 2026 18:16:57 +0800
Subject: [PATCH 2/6] fix: OpenAI Provider json, jsonl file load error

---
 runtime/node/agent/providers/openai_provider.py | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/runtime/node/agent/providers/openai_provider.py b/runtime/node/agent/providers/openai_provider.py
index d42dd171..cb40a6ef 100755
--- a/runtime/node/agent/providers/openai_provider.py
+++ b/runtime/node/agent/providers/openai_provider.py
@@ -544,7 +544,13 @@ class OpenAIProvider(ModelProvider):
 
         mime = (attachment.mime_type or "").lower()
         name = (attachment.name or "").lower()
-        if not mime.startswith("text/"):
+        is_json = mime in {
+            "application/json",
+            "application/jsonl",
+            "application/x-ndjson",
+            "application/ndjson",
+        } or name.endswith((".json", ".jsonl", ".ndjson"))
+        if not (mime.startswith("text/") or is_json):
             return None
         if attachment.remote_file_id:
             return None  # nothing to inline if already remote-only

From c4d6dd4aec01b3a6907d1d3201f46b253fff78fe Mon Sep 17 00:00:00 2001
From: swugi <hoofangy3@gmail.com>
Date: Tue, 13 Jan 2026 16:55:46 +0800
Subject: [PATCH 3/6] fix: erronous graph rename mechanism

---
 server/services/workflow_storage.py | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/server/services/workflow_storage.py b/server/services/workflow_storage.py
index 51c35402..a613aa60 100755
--- a/server/services/workflow_storage.py
+++ b/server/services/workflow_storage.py
@@ -18,16 +18,31 @@ from utils.structured_logger import get_server_logger, LogType
 
 
 def _update_workflow_id(content: str, workflow_id: str) -> str:
-    pattern = re.compile(r"^(id:\\s*).*$", re.MULTILINE)
+    # Pattern to match graph:\n  id: <value>
+    pattern = re.compile(r"(graph:\s*\n\s*id:\s*).*$", re.MULTILINE)
     match = pattern.search(content)
     if match:
-        return pattern.sub(rf"\\1{workflow_id}", content, count=1)
+        # Replace the value after "graph:\n  id: "
+        return pattern.sub(rf"\1{workflow_id}", content, count=1)
 
+    # If no graph.id found, look for standalone id: at root level (legacy support)
+    root_id_pattern = re.compile(r"^(id:\s*).*$", re.MULTILINE)
+    root_match = root_id_pattern.search(content)
+    if root_match:
+        return root_id_pattern.sub(rf"\1{workflow_id}", content, count=1)
+
+    # If neither found, add graph.id after graph: section if it exists
+    graph_pattern = re.compile(r"(graph:\s*\n)")
+    graph_match = graph_pattern.search(content)
+    if graph_match:
+        return graph_pattern.sub(rf"\1  id: {workflow_id}\n", content, count=1)
+
+    # Fallback (is invalid)
     lines = content.splitlines()
     insert_index = 0
     if lines and lines[0].strip() == "---":
         insert_index = 1
-    lines.insert(insert_index, f"id: {workflow_id}")
+    lines.insert(insert_index, f"graph:\n  id: {workflow_id}")
     updated = "\n".join(lines)
     if content.endswith("\n"):
         updated += "\n"

From 6eef2e651cc1b8fdfa807d8d65deb1367503c561 Mon Sep 17 00:00:00 2001
From: swugi <hoofangy3@gmail.com>
Date: Tue, 13 Jan 2026 23:47:54 +0800
Subject: [PATCH 4/6] add: batch running function

---
 frontend/package-lock.json          |  800 +++++----
 frontend/src/App.vue                |    4 +-
 frontend/src/components/Sidebar.vue |    1 +
 frontend/src/pages/BatchRunView.vue | 2564 +++++++++++++++++++++++++++
 frontend/src/router/index.js        |    4 +
 frontend/src/utils/apiFunctions.js  |   52 +
 6 files changed, 3107 insertions(+), 318 deletions(-)
 create mode 100644 frontend/src/pages/BatchRunView.vue

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 06f1c9cd..a69edb86 100755
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -16,8 +16,10 @@
         "js-yaml": "^4.1.0",
         "markdown-it": "^14.1.0",
         "markdown-it-anchor": "^9.2.0",
+        "papaparse": "^5.4.1",
         "vue": "^3.5.22",
-        "vue-router": "^4.6.0"
+        "vue-router": "^4.6.0",
+        "xlsx": "^0.18.5"
       },
       "devDependencies": {
         "@eslint/js": "^9.39.1",
@@ -38,21 +40,21 @@
       }
     },
     "node_modules/@babel/helper-validator-identifier": {
-      "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz",
-      "integrity": "sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==",
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.28.5.tgz",
+      "integrity": "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q==",
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.28.4",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.28.4.tgz",
-      "integrity": "sha512-yZbBqeM6TkpP9du/I2pUZnJsRMGGvOuIrhjzC1AwHwW+6he4mni6Bp/m8ijn0iOuZuPI2BfkCoSRunpyjnrQKg==",
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.28.5.tgz",
+      "integrity": "sha512-KKBU1VGYR7ORr3At5HAtUQ+TV3SzRCXmA/8OdDZiLDBIZxVyzXuztPjfLd3BV1PRAQGCMWWSHYhL0F8d5uHBDQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.28.4"
+        "@babel/types": "^7.28.5"
       },
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -62,22 +64,22 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.28.4",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.28.4.tgz",
-      "integrity": "sha512-bkFqkLhh3pMBUQQkpVgWDWq/lqzc2678eUyDlTBhRqhCHFguYYGM0Efga7tYk4TogG/3x0EEl66/OQ+WGbWB/Q==",
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.28.5.tgz",
+      "integrity": "sha512-qQ5m48eI/MFLQ5PxQj4PFaprjyCTLI37ElWMmNs0K8Lk3dVeOdNpB3ks8jc7yM5CDmVC73eMVk/trk3fgmrUpA==",
       "license": "MIT",
       "dependencies": {
         "@babel/helper-string-parser": "^7.27.1",
-        "@babel/helper-validator-identifier": "^7.27.1"
+        "@babel/helper-validator-identifier": "^7.28.5"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@esbuild/aix-ppc64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.11.tgz",
-      "integrity": "sha512-Xt1dOL13m8u0WE8iplx9Ibbm+hFAO0GsU2P34UNoDGvZYkY8ifSiy6Zuc1lYxfG7svWE2fzqCUmFp5HCn51gJg==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.2.tgz",
+      "integrity": "sha512-GZMB+a0mOMZs4MpDbj8RJp4cw+w1WV5NYD6xzgvzUJ5Ek2jerwfO2eADyI6ExDSUED+1X8aMbegahsJi+8mgpw==",
       "cpu": [
         "ppc64"
       ],
@@ -92,9 +94,9 @@
       }
     },
     "node_modules/@esbuild/android-arm": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.25.11.tgz",
-      "integrity": "sha512-uoa7dU+Dt3HYsethkJ1k6Z9YdcHjTrSb5NUy66ZfZaSV8hEYGD5ZHbEMXnqLFlbBflLsl89Zke7CAdDJ4JI+Gg==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.2.tgz",
+      "integrity": "sha512-DVNI8jlPa7Ujbr1yjU2PfUSRtAUZPG9I1RwW4F4xFB1Imiu2on0ADiI/c3td+KmDtVKNbi+nffGDQMfcIMkwIA==",
       "cpu": [
         "arm"
       ],
@@ -109,9 +111,9 @@
       }
     },
     "node_modules/@esbuild/android-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.25.11.tgz",
-      "integrity": "sha512-9slpyFBc4FPPz48+f6jyiXOx/Y4v34TUeDDXJpZqAWQn/08lKGeD8aDp9TMn9jDz2CiEuHwfhRmGBvpnd/PWIQ==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.2.tgz",
+      "integrity": "sha512-pvz8ZZ7ot/RBphf8fv60ljmaoydPU12VuXHImtAs0XhLLw+EXBi2BLe3OYSBslR4rryHvweW5gmkKFwTiFy6KA==",
       "cpu": [
         "arm64"
       ],
@@ -126,9 +128,9 @@
       }
     },
     "node_modules/@esbuild/android-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.25.11.tgz",
-      "integrity": "sha512-Sgiab4xBjPU1QoPEIqS3Xx+R2lezu0LKIEcYe6pftr56PqPygbB7+szVnzoShbx64MUupqoE0KyRlN7gezbl8g==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.2.tgz",
+      "integrity": "sha512-z8Ank4Byh4TJJOh4wpz8g2vDy75zFL0TlZlkUkEwYXuPSgX8yzep596n6mT7905kA9uHZsf/o2OJZubl2l3M7A==",
       "cpu": [
         "x64"
       ],
@@ -143,9 +145,9 @@
       }
     },
     "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.11.tgz",
-      "integrity": "sha512-VekY0PBCukppoQrycFxUqkCojnTQhdec0vevUL/EDOCnXd9LKWqD/bHwMPzigIJXPhC59Vd1WFIL57SKs2mg4w==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.2.tgz",
+      "integrity": "sha512-davCD2Zc80nzDVRwXTcQP/28fiJbcOwvdolL0sOiOsbwBa72kegmVU0Wrh1MYrbuCL98Omp5dVhQFWRKR2ZAlg==",
       "cpu": [
         "arm64"
       ],
@@ -160,9 +162,9 @@
       }
     },
     "node_modules/@esbuild/darwin-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.25.11.tgz",
-      "integrity": "sha512-+hfp3yfBalNEpTGp9loYgbknjR695HkqtY3d3/JjSRUyPg/xd6q+mQqIb5qdywnDxRZykIHs3axEqU6l1+oWEQ==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.2.tgz",
+      "integrity": "sha512-ZxtijOmlQCBWGwbVmwOF/UCzuGIbUkqB1faQRf5akQmxRJ1ujusWsb3CVfk/9iZKr2L5SMU5wPBi1UWbvL+VQA==",
       "cpu": [
         "x64"
       ],
@@ -177,9 +179,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.11.tgz",
-      "integrity": "sha512-CmKjrnayyTJF2eVuO//uSjl/K3KsMIeYeyN7FyDBjsR3lnSJHaXlVoAK8DZa7lXWChbuOk7NjAc7ygAwrnPBhA==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.2.tgz",
+      "integrity": "sha512-lS/9CN+rgqQ9czogxlMcBMGd+l8Q3Nj1MFQwBZJyoEKI50XGxwuzznYdwcav6lpOGv5BqaZXqvBSiB/kJ5op+g==",
       "cpu": [
         "arm64"
       ],
@@ -194,9 +196,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.25.11.tgz",
-      "integrity": "sha512-Dyq+5oscTJvMaYPvW3x3FLpi2+gSZTCE/1ffdwuM6G1ARang/mb3jvjxs0mw6n3Lsw84ocfo9CrNMqc5lTfGOw==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.2.tgz",
+      "integrity": "sha512-tAfqtNYb4YgPnJlEFu4c212HYjQWSO/w/h/lQaBK7RbwGIkBOuNKQI9tqWzx7Wtp7bTPaGC6MJvWI608P3wXYA==",
       "cpu": [
         "x64"
       ],
@@ -211,9 +213,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.25.11.tgz",
-      "integrity": "sha512-TBMv6B4kCfrGJ8cUPo7vd6NECZH/8hPpBHHlYI3qzoYFvWu2AdTvZNuU/7hsbKWqu/COU7NIK12dHAAqBLLXgw==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.2.tgz",
+      "integrity": "sha512-vWfq4GaIMP9AIe4yj1ZUW18RDhx6EPQKjwe7n8BbIecFtCQG4CfHGaHuh7fdfq+y3LIA2vGS/o9ZBGVxIDi9hw==",
       "cpu": [
         "arm"
       ],
@@ -228,9 +230,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.25.11.tgz",
-      "integrity": "sha512-Qr8AzcplUhGvdyUF08A1kHU3Vr2O88xxP0Tm8GcdVOUm25XYcMPp2YqSVHbLuXzYQMf9Bh/iKx7YPqECs6ffLA==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.2.tgz",
+      "integrity": "sha512-hYxN8pr66NsCCiRFkHUAsxylNOcAQaxSSkHMMjcpx0si13t1LHFphxJZUiGwojB1a/Hd5OiPIqDdXONia6bhTw==",
       "cpu": [
         "arm64"
       ],
@@ -245,9 +247,9 @@
       }
     },
     "node_modules/@esbuild/linux-ia32": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.25.11.tgz",
-      "integrity": "sha512-TmnJg8BMGPehs5JKrCLqyWTVAvielc615jbkOirATQvWWB1NMXY77oLMzsUjRLa0+ngecEmDGqt5jiDC6bfvOw==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.2.tgz",
+      "integrity": "sha512-MJt5BRRSScPDwG2hLelYhAAKh9imjHK5+NE/tvnRLbIqUWa+0E9N4WNMjmp/kXXPHZGqPLxggwVhz7QP8CTR8w==",
       "cpu": [
         "ia32"
       ],
@@ -262,9 +264,9 @@
       }
     },
     "node_modules/@esbuild/linux-loong64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.25.11.tgz",
-      "integrity": "sha512-DIGXL2+gvDaXlaq8xruNXUJdT5tF+SBbJQKbWy/0J7OhU8gOHOzKmGIlfTTl6nHaCOoipxQbuJi7O++ldrxgMw==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.2.tgz",
+      "integrity": "sha512-lugyF1atnAT463aO6KPshVCJK5NgRnU4yb3FUumyVz+cGvZbontBgzeGFO1nF+dPueHD367a2ZXe1NtUkAjOtg==",
       "cpu": [
         "loong64"
       ],
@@ -279,9 +281,9 @@
       }
     },
     "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.25.11.tgz",
-      "integrity": "sha512-Osx1nALUJu4pU43o9OyjSCXokFkFbyzjXb6VhGIJZQ5JZi8ylCQ9/LFagolPsHtgw6himDSyb5ETSfmp4rpiKQ==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.2.tgz",
+      "integrity": "sha512-nlP2I6ArEBewvJ2gjrrkESEZkB5mIoaTswuqNFRv/WYd+ATtUpe9Y09RnJvgvdag7he0OWgEZWhviS1OTOKixw==",
       "cpu": [
         "mips64el"
       ],
@@ -296,9 +298,9 @@
       }
     },
     "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.25.11.tgz",
-      "integrity": "sha512-nbLFgsQQEsBa8XSgSTSlrnBSrpoWh7ioFDUmwo158gIm5NNP+17IYmNWzaIzWmgCxq56vfr34xGkOcZ7jX6CPw==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.2.tgz",
+      "integrity": "sha512-C92gnpey7tUQONqg1n6dKVbx3vphKtTHJaNG2Ok9lGwbZil6DrfyecMsp9CrmXGQJmZ7iiVXvvZH6Ml5hL6XdQ==",
       "cpu": [
         "ppc64"
       ],
@@ -313,9 +315,9 @@
       }
     },
     "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.25.11.tgz",
-      "integrity": "sha512-HfyAmqZi9uBAbgKYP1yGuI7tSREXwIb438q0nqvlpxAOs3XnZ8RsisRfmVsgV486NdjD7Mw2UrFSw51lzUk1ww==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.2.tgz",
+      "integrity": "sha512-B5BOmojNtUyN8AXlK0QJyvjEZkWwy/FKvakkTDCziX95AowLZKR6aCDhG7LeF7uMCXEJqwa8Bejz5LTPYm8AvA==",
       "cpu": [
         "riscv64"
       ],
@@ -330,9 +332,9 @@
       }
     },
     "node_modules/@esbuild/linux-s390x": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.25.11.tgz",
-      "integrity": "sha512-HjLqVgSSYnVXRisyfmzsH6mXqyvj0SA7pG5g+9W7ESgwA70AXYNpfKBqh1KbTxmQVaYxpzA/SvlB9oclGPbApw==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.2.tgz",
+      "integrity": "sha512-p4bm9+wsPwup5Z8f4EpfN63qNagQ47Ua2znaqGH6bqLlmJ4bx97Y9JdqxgGZ6Y8xVTixUnEkoKSHcpRlDnNr5w==",
       "cpu": [
         "s390x"
       ],
@@ -347,9 +349,9 @@
       }
     },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.25.11.tgz",
-      "integrity": "sha512-HSFAT4+WYjIhrHxKBwGmOOSpphjYkcswF449j6EjsjbinTZbp8PJtjsVK1XFJStdzXdy/jaddAep2FGY+wyFAQ==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.2.tgz",
+      "integrity": "sha512-uwp2Tip5aPmH+NRUwTcfLb+W32WXjpFejTIOWZFw/v7/KnpCDKG66u4DLcurQpiYTiYwQ9B7KOeMJvLCu/OvbA==",
       "cpu": [
         "x64"
       ],
@@ -364,9 +366,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.11.tgz",
-      "integrity": "sha512-hr9Oxj1Fa4r04dNpWr3P8QKVVsjQhqrMSUzZzf+LZcYjZNqhA3IAfPQdEh1FLVUJSiu6sgAwp3OmwBfbFgG2Xg==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.2.tgz",
+      "integrity": "sha512-Kj6DiBlwXrPsCRDeRvGAUb/LNrBASrfqAIok+xB0LxK8CHqxZ037viF13ugfsIpePH93mX7xfJp97cyDuTZ3cw==",
       "cpu": [
         "arm64"
       ],
@@ -381,9 +383,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.25.11.tgz",
-      "integrity": "sha512-u7tKA+qbzBydyj0vgpu+5h5AeudxOAGncb8N6C9Kh1N4n7wU1Xw1JDApsRjpShRpXRQlJLb9wY28ELpwdPcZ7A==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.2.tgz",
+      "integrity": "sha512-HwGDZ0VLVBY3Y+Nw0JexZy9o/nUAWq9MlV7cahpaXKW6TOzfVno3y3/M8Ga8u8Yr7GldLOov27xiCnqRZf0tCA==",
       "cpu": [
         "x64"
       ],
@@ -398,9 +400,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.11.tgz",
-      "integrity": "sha512-Qq6YHhayieor3DxFOoYM1q0q1uMFYb7cSpLD2qzDSvK1NAvqFi8Xgivv0cFC6J+hWVw2teCYltyy9/m/14ryHg==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.2.tgz",
+      "integrity": "sha512-DNIHH2BPQ5551A7oSHD0CKbwIA/Ox7+78/AWkbS5QoRzaqlev2uFayfSxq68EkonB+IKjiuxBFoV8ESJy8bOHA==",
       "cpu": [
         "arm64"
       ],
@@ -415,9 +417,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.25.11.tgz",
-      "integrity": "sha512-CN+7c++kkbrckTOz5hrehxWN7uIhFFlmS/hqziSFVWpAzpWrQoAG4chH+nN3Be+Kzv/uuo7zhX716x3Sn2Jduw==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.2.tgz",
+      "integrity": "sha512-/it7w9Nb7+0KFIzjalNJVR5bOzA9Vay+yIPLVHfIQYG/j+j9VTH84aNB8ExGKPU4AzfaEvN9/V4HV+F+vo8OEg==",
       "cpu": [
         "x64"
       ],
@@ -432,9 +434,9 @@
       }
     },
     "node_modules/@esbuild/openharmony-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.25.11.tgz",
-      "integrity": "sha512-rOREuNIQgaiR+9QuNkbkxubbp8MSO9rONmwP5nKncnWJ9v5jQ4JxFnLu4zDSRPf3x4u+2VN4pM4RdyIzDty/wQ==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.2.tgz",
+      "integrity": "sha512-LRBbCmiU51IXfeXk59csuX/aSaToeG7w48nMwA6049Y4J4+VbWALAuXcs+qcD04rHDuSCSRKdmY63sruDS5qag==",
       "cpu": [
         "arm64"
       ],
@@ -449,9 +451,9 @@
       }
     },
     "node_modules/@esbuild/sunos-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.25.11.tgz",
-      "integrity": "sha512-nq2xdYaWxyg9DcIyXkZhcYulC6pQ2FuCgem3LI92IwMgIZ69KHeY8T4Y88pcwoLIjbed8n36CyKoYRDygNSGhA==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.2.tgz",
+      "integrity": "sha512-kMtx1yqJHTmqaqHPAzKCAkDaKsffmXkPHThSfRwZGyuqyIeBvf08KSsYXl+abf5HDAPMJIPnbBfXvP2ZC2TfHg==",
       "cpu": [
         "x64"
       ],
@@ -466,9 +468,9 @@
       }
     },
     "node_modules/@esbuild/win32-arm64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.25.11.tgz",
-      "integrity": "sha512-3XxECOWJq1qMZ3MN8srCJ/QfoLpL+VaxD/WfNRm1O3B4+AZ/BnLVgFbUV3eiRYDMXetciH16dwPbbHqwe1uU0Q==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.2.tgz",
+      "integrity": "sha512-Yaf78O/B3Kkh+nKABUF++bvJv5Ijoy9AN1ww904rOXZFLWVc5OLOfL56W+C8F9xn5JQZa3UX6m+IktJnIb1Jjg==",
       "cpu": [
         "arm64"
       ],
@@ -483,9 +485,9 @@
       }
     },
     "node_modules/@esbuild/win32-ia32": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.25.11.tgz",
-      "integrity": "sha512-3ukss6gb9XZ8TlRyJlgLn17ecsK4NSQTmdIXRASVsiS2sQ6zPPZklNJT5GR5tE/MUarymmy8kCEf5xPCNCqVOA==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.2.tgz",
+      "integrity": "sha512-Iuws0kxo4yusk7sw70Xa2E2imZU5HoixzxfGCdxwBdhiDgt9vX9VUCBhqcwY7/uh//78A1hMkkROMJq9l27oLQ==",
       "cpu": [
         "ia32"
       ],
@@ -500,9 +502,9 @@
       }
     },
     "node_modules/@esbuild/win32-x64": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.11.tgz",
-      "integrity": "sha512-D7Hpz6A2L4hzsRpPaCYkQnGOotdUpDzSGRIv9I+1ITdHROSFUWW95ZPZWQmGka1Fg7W3zFJowyn9WGwMJ0+KPA==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.2.tgz",
+      "integrity": "sha512-sRdU18mcKf7F+YgheI/zGf5alZatMUTKj/jNS6l744f9u3WFu4v7twcUI9vu4mknF4Y9aDlblIie0IM+5xxaqQ==",
       "cpu": [
         "x64"
       ],
@@ -517,9 +519,9 @@
       }
     },
     "node_modules/@eslint-community/eslint-utils": {
-      "version": "4.9.0",
-      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.0.tgz",
-      "integrity": "sha512-ayVFHdtZ+hsq1t2Dy24wCmGXGe4q9Gu3smhLYALJrr473ZH27MsnSL+LKUlimp4BWJqMDMLmPpx/Q9R3OAlL4g==",
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz",
+      "integrity": "sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -600,9 +602,9 @@
       }
     },
     "node_modules/@eslint/eslintrc": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.1.tgz",
-      "integrity": "sha512-gtF186CXhIl1p4pJNGZw8Yc6RlshoePRvE0X91oPGb3vZ8pM3qOS9W9NGPat9LziaBV7XrJWGylNQXkGcnM3IQ==",
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.3.tgz",
+      "integrity": "sha512-Kr+LPIUVKz2qkx1HAMH8q1q6azbqBAsXJUxBl/ODDuVPX45Z9DfwB8tPjTi6nNZ8BuM3nbJxC5zCAg5elnBUTQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -612,7 +614,7 @@
         "globals": "^14.0.0",
         "ignore": "^5.2.0",
         "import-fresh": "^3.2.1",
-        "js-yaml": "^4.1.0",
+        "js-yaml": "^4.1.1",
         "minimatch": "^3.1.2",
         "strip-json-comments": "^3.1.1"
       },
@@ -637,9 +639,9 @@
       }
     },
     "node_modules/@eslint/js": {
-      "version": "9.39.1",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.1.tgz",
-      "integrity": "sha512-S26Stp4zCy88tH94QbBv3XCuzRQiZ9yXofEILmglYTh/Ug/a9/umqvgFtYBAo3Lp0nsI/5/qH1CCrbdK3AP1Tw==",
+      "version": "9.39.2",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.2.tgz",
+      "integrity": "sha512-q1mjIoW1VX4IvSocvM/vbTiveKC4k9eLrajNEuSsmjymSDEbpGddtpfOoN7YGAqBK3NG+uqo8ia4PDTt8buCYA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -732,16 +734,16 @@
       "license": "MIT"
     },
     "node_modules/@rolldown/pluginutils": {
-      "version": "1.0.0-beta.29",
-      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.29.tgz",
-      "integrity": "sha512-NIJgOsMjbxAXvoGq/X0gD7VPMQ8j9g0BiDaNjVNVjvl+iKXxL3Jre0v31RmBYeLEmkbj2s02v8vFTbUXi5XS2Q==",
+      "version": "1.0.0-beta.53",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.53.tgz",
+      "integrity": "sha512-vENRlFU4YbrwVqNDZ7fLvy+JR1CRkyr01jhSiDpE1u6py3OMzQfztQU2jxykW3ALNxO4kSlqIDeYyD0Y9RcQeQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.52.4.tgz",
-      "integrity": "sha512-BTm2qKNnWIQ5auf4deoetINJm2JzvihvGb9R6K/ETwKLql/Bb3Eg2H1FBp1gUb4YGbydMA3jcmQTR73q7J+GAA==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.55.1.tgz",
+      "integrity": "sha512-9R0DM/ykwfGIlNu6+2U09ga0WXeZ9MRC2Ter8jnz8415VbuIykVuc6bhdrbORFZANDmTDvq26mJrEVTl8TdnDg==",
       "cpu": [
         "arm"
       ],
@@ -753,9 +755,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.52.4.tgz",
-      "integrity": "sha512-P9LDQiC5vpgGFgz7GSM6dKPCiqR3XYN1WwJKA4/BUVDjHpYsf3iBEmVz62uyq20NGYbiGPR5cNHI7T1HqxNs2w==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.55.1.tgz",
+      "integrity": "sha512-eFZCb1YUqhTysgW3sj/55du5cG57S7UTNtdMjCW7LwVcj3dTTcowCsC8p7uBdzKsZYa8J7IDE8lhMI+HX1vQvg==",
       "cpu": [
         "arm64"
       ],
@@ -767,9 +769,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.52.4.tgz",
-      "integrity": "sha512-QRWSW+bVccAvZF6cbNZBJwAehmvG9NwfWHwMy4GbWi/BQIA/laTIktebT2ipVjNncqE6GLPxOok5hsECgAxGZg==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.55.1.tgz",
+      "integrity": "sha512-p3grE2PHcQm2e8PSGZdzIhCKbMCw/xi9XvMPErPhwO17vxtvCN5FEA2mSLgmKlCjHGMQTP6phuQTYWUnKewwGg==",
       "cpu": [
         "arm64"
       ],
@@ -781,9 +783,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.52.4.tgz",
-      "integrity": "sha512-hZgP05pResAkRJxL1b+7yxCnXPGsXU0fG9Yfd6dUaoGk+FhdPKCJ5L1Sumyxn8kvw8Qi5PvQ8ulenUbRjzeCTw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.55.1.tgz",
+      "integrity": "sha512-rDUjG25C9qoTm+e02Esi+aqTKSBYwVTaoS1wxcN47/Luqef57Vgp96xNANwt5npq9GDxsH7kXxNkJVEsWEOEaQ==",
       "cpu": [
         "x64"
       ],
@@ -795,9 +797,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-arm64": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.52.4.tgz",
-      "integrity": "sha512-xmc30VshuBNUd58Xk4TKAEcRZHaXlV+tCxIXELiE9sQuK3kG8ZFgSPi57UBJt8/ogfhAF5Oz4ZSUBN77weM+mQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.55.1.tgz",
+      "integrity": "sha512-+JiU7Jbp5cdxekIgdte0jfcu5oqw4GCKr6i3PJTlXTCU5H5Fvtkpbs4XJHRmWNXF+hKmn4v7ogI5OQPaupJgOg==",
       "cpu": [
         "arm64"
       ],
@@ -809,9 +811,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-x64": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.52.4.tgz",
-      "integrity": "sha512-WdSLpZFjOEqNZGmHflxyifolwAiZmDQzuOzIq9L27ButpCVpD7KzTRtEG1I0wMPFyiyUdOO+4t8GvrnBLQSwpw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.55.1.tgz",
+      "integrity": "sha512-V5xC1tOVWtLLmr3YUk2f6EJK4qksksOYiz/TCsFHu/R+woubcLWdC9nZQmwjOAbmExBIVKsm1/wKmEy4z4u4Bw==",
       "cpu": [
         "x64"
       ],
@@ -823,9 +825,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.52.4.tgz",
-      "integrity": "sha512-xRiOu9Of1FZ4SxVbB0iEDXc4ddIcjCv2aj03dmW8UrZIW7aIQ9jVJdLBIhxBI+MaTnGAKyvMwPwQnoOEvP7FgQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.55.1.tgz",
+      "integrity": "sha512-Rn3n+FUk2J5VWx+ywrG/HGPTD9jXNbicRtTM11e/uorplArnXZYsVifnPPqNNP5BsO3roI4n8332ukpY/zN7rQ==",
       "cpu": [
         "arm"
       ],
@@ -837,9 +839,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-musleabihf": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.52.4.tgz",
-      "integrity": "sha512-FbhM2p9TJAmEIEhIgzR4soUcsW49e9veAQCziwbR+XWB2zqJ12b4i/+hel9yLiD8pLncDH4fKIPIbt5238341Q==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.55.1.tgz",
+      "integrity": "sha512-grPNWydeKtc1aEdrJDWk4opD7nFtQbMmV7769hiAaYyUKCT1faPRm2av8CX1YJsZ4TLAZcg9gTR1KvEzoLjXkg==",
       "cpu": [
         "arm"
       ],
@@ -851,9 +853,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.52.4.tgz",
-      "integrity": "sha512-4n4gVwhPHR9q/g8lKCyz0yuaD0MvDf7dV4f9tHt0C73Mp8h38UCtSCSE6R9iBlTbXlmA8CjpsZoujhszefqueg==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.55.1.tgz",
+      "integrity": "sha512-a59mwd1k6x8tXKcUxSyISiquLwB5pX+fJW9TkWU46lCqD/GRDe9uDN31jrMmVP3feI3mhAdvcCClhV8V5MhJFQ==",
       "cpu": [
         "arm64"
       ],
@@ -865,9 +867,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.52.4.tgz",
-      "integrity": "sha512-u0n17nGA0nvi/11gcZKsjkLj1QIpAuPFQbR48Subo7SmZJnGxDpspyw2kbpuoQnyK+9pwf3pAoEXerJs/8Mi9g==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.55.1.tgz",
+      "integrity": "sha512-puS1MEgWX5GsHSoiAsF0TYrpomdvkaXm0CofIMG5uVkP6IBV+ZO9xhC5YEN49nsgYo1DuuMquF9+7EDBVYu4uA==",
       "cpu": [
         "arm64"
       ],
@@ -879,9 +881,23 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-loong64-gnu": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.52.4.tgz",
-      "integrity": "sha512-0G2c2lpYtbTuXo8KEJkDkClE/+/2AFPdPAbmaHoE870foRFs4pBrDehilMcrSScrN/fB/1HTaWO4bqw+ewBzMQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.55.1.tgz",
+      "integrity": "sha512-r3Wv40in+lTsULSb6nnoudVbARdOwb2u5fpeoOAZjFLznp6tDU8kd+GTHmJoqZ9lt6/Sys33KdIHUaQihFcu7g==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-musl": {
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.55.1.tgz",
+      "integrity": "sha512-MR8c0+UxAlB22Fq4R+aQSPBayvYa3+9DrwG/i1TKQXFYEaoW3B5b/rkSRIypcZDdWjWnpcvxbNaAJDcSbJU3Lw==",
       "cpu": [
         "loong64"
       ],
@@ -893,9 +909,23 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-ppc64-gnu": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.52.4.tgz",
-      "integrity": "sha512-teSACug1GyZHmPDv14VNbvZFX779UqWTsd7KtTM9JIZRDI5NUwYSIS30kzI8m06gOPB//jtpqlhmraQ68b5X2g==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.55.1.tgz",
+      "integrity": "sha512-3KhoECe1BRlSYpMTeVrD4sh2Pw2xgt4jzNSZIIPLFEsnQn9gAnZagW9+VqDqAHgm1Xc77LzJOo2LdigS5qZ+gw==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-musl": {
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.55.1.tgz",
+      "integrity": "sha512-ziR1OuZx0vdYZZ30vueNZTg73alF59DicYrPViG0NEgDVN8/Jl87zkAPu4u6VjZST2llgEUjaiNl9JM6HH1Vdw==",
       "cpu": [
         "ppc64"
       ],
@@ -907,9 +937,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.52.4.tgz",
-      "integrity": "sha512-/MOEW3aHjjs1p4Pw1Xk4+3egRevx8Ji9N6HUIA1Ifh8Q+cg9dremvFCUbOX2Zebz80BwJIgCBUemjqhU5XI5Eg==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.55.1.tgz",
+      "integrity": "sha512-uW0Y12ih2XJRERZ4jAfKamTyIHVMPQnTZcQjme2HMVDAHY4amf5u414OqNYC+x+LzRdRcnIG1YodLrrtA8xsxw==",
       "cpu": [
         "riscv64"
       ],
@@ -921,9 +951,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-musl": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.52.4.tgz",
-      "integrity": "sha512-1HHmsRyh845QDpEWzOFtMCph5Ts+9+yllCrREuBR/vg2RogAQGGBRC8lDPrPOMnrdOJ+mt1WLMOC2Kao/UwcvA==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.55.1.tgz",
+      "integrity": "sha512-u9yZ0jUkOED1BFrqu3BwMQoixvGHGZ+JhJNkNKY/hyoEgOwlqKb62qu+7UjbPSHYjiVy8kKJHvXKv5coH4wDeg==",
       "cpu": [
         "riscv64"
       ],
@@ -935,9 +965,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-s390x-gnu": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.52.4.tgz",
-      "integrity": "sha512-seoeZp4L/6D1MUyjWkOMRU6/iLmCU2EjbMTyAG4oIOs1/I82Y5lTeaxW0KBfkUdHAWN7j25bpkt0rjnOgAcQcA==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.55.1.tgz",
+      "integrity": "sha512-/0PenBCmqM4ZUd0190j7J0UsQ/1nsi735iPRakO8iPciE7BQ495Y6msPzaOmvx0/pn+eJVVlZrNrSh4WSYLxNg==",
       "cpu": [
         "s390x"
       ],
@@ -949,9 +979,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.52.4.tgz",
-      "integrity": "sha512-Wi6AXf0k0L7E2gteNsNHUs7UMwCIhsCTs6+tqQ5GPwVRWMaflqGec4Sd8n6+FNFDw9vGcReqk2KzBDhCa1DLYg==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.55.1.tgz",
+      "integrity": "sha512-a8G4wiQxQG2BAvo+gU6XrReRRqj+pLS2NGXKm8io19goR+K8lw269eTrPkSdDTALwMmJp4th2Uh0D8J9bEV1vg==",
       "cpu": [
         "x64"
       ],
@@ -963,9 +993,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.52.4.tgz",
-      "integrity": "sha512-dtBZYjDmCQ9hW+WgEkaffvRRCKm767wWhxsFW3Lw86VXz/uJRuD438/XvbZT//B96Vs8oTA8Q4A0AfHbrxP9zw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.55.1.tgz",
+      "integrity": "sha512-bD+zjpFrMpP/hqkfEcnjXWHMw5BIghGisOKPj+2NaNDuVT+8Ds4mPf3XcPHuat1tz89WRL+1wbcxKY3WSbiT7w==",
       "cpu": [
         "x64"
       ],
@@ -976,10 +1006,24 @@
         "linux"
       ]
     },
+    "node_modules/@rollup/rollup-openbsd-x64": {
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.55.1.tgz",
+      "integrity": "sha512-eLXw0dOiqE4QmvikfQ6yjgkg/xDM+MdU9YJuP4ySTibXU0oAvnEWXt7UDJmD4UkYialMfOGFPJnIHSe/kdzPxg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ]
+    },
     "node_modules/@rollup/rollup-openharmony-arm64": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.52.4.tgz",
-      "integrity": "sha512-1ox+GqgRWqaB1RnyZXL8PD6E5f7YyRUJYnCqKpNzxzP0TkaUh112NDrR9Tt+C8rJ4x5G9Mk8PQR3o7Ku2RKqKA==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.55.1.tgz",
+      "integrity": "sha512-xzm44KgEP11te3S2HCSyYf5zIzWmx3n8HDCc7EE59+lTcswEWNpvMLfd9uJvVX8LCg9QWG67Xt75AuHn4vgsXw==",
       "cpu": [
         "arm64"
       ],
@@ -991,9 +1035,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.52.4.tgz",
-      "integrity": "sha512-8GKr640PdFNXwzIE0IrkMWUNUomILLkfeHjXBi/nUvFlpZP+FA8BKGKpacjW6OUUHaNI6sUURxR2U2g78FOHWQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.55.1.tgz",
+      "integrity": "sha512-yR6Bl3tMC/gBok5cz/Qi0xYnVbIxGx5Fcf/ca0eB6/6JwOY+SRUcJfI0OpeTpPls7f194as62thCt/2BjxYN8g==",
       "cpu": [
         "arm64"
       ],
@@ -1005,9 +1049,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.52.4.tgz",
-      "integrity": "sha512-AIy/jdJ7WtJ/F6EcfOb2GjR9UweO0n43jNObQMb6oGxkYTfLcnN7vYYpG+CN3lLxrQkzWnMOoNSHTW54pgbVxw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.55.1.tgz",
+      "integrity": "sha512-3fZBidchE0eY0oFZBnekYCfg+5wAB0mbpCBuofh5mZuzIU/4jIVkbESmd2dOsFNS78b53CYv3OAtwqkZZmU5nA==",
       "cpu": [
         "ia32"
       ],
@@ -1019,9 +1063,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-gnu": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.52.4.tgz",
-      "integrity": "sha512-UF9KfsH9yEam0UjTwAgdK0anlQ7c8/pWPU2yVjyWcF1I1thABt6WXE47cI71pGiZ8wGvxohBoLnxM04L/wj8mQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.55.1.tgz",
+      "integrity": "sha512-xGGY5pXj69IxKb4yv/POoocPy/qmEGhimy/FoTpTSVju3FYXUQQMFCaZZXJVidsmGxRioZAwpThl/4zX41gRKg==",
       "cpu": [
         "x64"
       ],
@@ -1033,9 +1077,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.52.4.tgz",
-      "integrity": "sha512-bf9PtUa0u8IXDVxzRToFQKsNCRz9qLYfR/MpECxl4mRoWYjAeFjgxj1XdZr2M/GNVpT05p+LgQOHopYDlUu6/w==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.55.1.tgz",
+      "integrity": "sha512-SPEpaL6DX4rmcXtnhdrQYgzQ5W2uW3SCJch88lB2zImhJRhIIK44fkUrgIV/Q8yUNfw5oyZ5vkeQsZLhCb06lw==",
       "cpu": [
         "x64"
       ],
@@ -1090,19 +1134,19 @@
       "license": "MIT"
     },
     "node_modules/@vitejs/plugin-vue": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-6.0.1.tgz",
-      "integrity": "sha512-+MaE752hU0wfPFJEUAIxqw18+20euHHdxVtMvbFcOEpjEyfqXH/5DCoTHiVJ0J29EhTJdoTkjEv5YBKU9dnoTw==",
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-6.0.3.tgz",
+      "integrity": "sha512-TlGPkLFLVOY3T7fZrwdvKpjprR3s4fxRln0ORDo1VQ7HHyxJwTlrjKU3kpVWTlaAjIEuCTokmjkZnr8Tpc925w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@rolldown/pluginutils": "1.0.0-beta.29"
+        "@rolldown/pluginutils": "1.0.0-beta.53"
       },
       "engines": {
         "node": "^20.19.0 || >=22.12.0"
       },
       "peerDependencies": {
-        "vite": "^5.0.0 || ^6.0.0 || ^7.0.0",
+        "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0",
         "vue": "^3.2.25"
       }
     },
@@ -1127,9 +1171,9 @@
       }
     },
     "node_modules/@vue-flow/core": {
-      "version": "1.47.0",
-      "resolved": "https://registry.npmjs.org/@vue-flow/core/-/core-1.47.0.tgz",
-      "integrity": "sha512-w+qrm/xjQP5NUeKUOMIbQvpOeivTbGZtY2lGffK5kHiN3ZLyEazhESc8OeIV9NZkK2T5DIeyX/nhHxCC45HLiw==",
+      "version": "1.48.1",
+      "resolved": "https://registry.npmjs.org/@vue-flow/core/-/core-1.48.1.tgz",
+      "integrity": "sha512-3IxaMBLvWRbznZ4CuK0kVhp4Y4lCDQx9nhi48Swp6PwPw29KNhmiKd2kaBogYeWjGLb/tLjlE9V0s3jEmKCYWw==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -1158,53 +1202,65 @@
       }
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.22.tgz",
-      "integrity": "sha512-jQ0pFPmZwTEiRNSb+i9Ow/I/cHv2tXYqsnHKKyCQ08irI2kdF5qmYedmF8si8mA7zepUFmJ2hqzS8CQmNOWOkQ==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.26.tgz",
+      "integrity": "sha512-vXyI5GMfuoBCnv5ucIT7jhHKl55Y477yxP6fc4eUswjP8FG3FFVFd41eNDArR+Uk3QKn2Z85NavjaxLxOC19/w==",
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.28.4",
-        "@vue/shared": "3.5.22",
-        "entities": "^4.5.0",
+        "@babel/parser": "^7.28.5",
+        "@vue/shared": "3.5.26",
+        "entities": "^7.0.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.2.1"
       }
     },
+    "node_modules/@vue/compiler-core/node_modules/entities": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-7.0.0.tgz",
+      "integrity": "sha512-FDWG5cmEYf2Z00IkYRhbFrwIwvdFKH07uV8dvNy0omp/Qb1xcyCWp2UDtcwJF4QZZvk0sLudP6/hAu42TaqVhQ==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.22.tgz",
-      "integrity": "sha512-W8RknzUM1BLkypvdz10OVsGxnMAuSIZs9Wdx1vzA3mL5fNMN15rhrSCLiTm6blWeACwUwizzPVqGJgOGBEN/hA==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.26.tgz",
+      "integrity": "sha512-y1Tcd3eXs834QjswshSilCBnKGeQjQXB6PqFn/1nxcQw4pmG42G8lwz+FZPAZAby6gZeHSt/8LMPfZ4Rb+Bd/A==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-core": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-core": "3.5.26",
+        "@vue/shared": "3.5.26"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.22.tgz",
-      "integrity": "sha512-tbTR1zKGce4Lj+JLzFXDq36K4vcSZbJ1RBu8FxcDv1IGRz//Dh2EBqksyGVypz3kXpshIfWKGOCcqpSbyGWRJQ==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.26.tgz",
+      "integrity": "sha512-egp69qDTSEZcf4bGOSsprUr4xI73wfrY5oRs6GSgXFTiHrWj4Y3X5Ydtip9QMqiCMCPVwLglB9GBxXtTadJ3mA==",
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.28.4",
-        "@vue/compiler-core": "3.5.22",
-        "@vue/compiler-dom": "3.5.22",
-        "@vue/compiler-ssr": "3.5.22",
-        "@vue/shared": "3.5.22",
+        "@babel/parser": "^7.28.5",
+        "@vue/compiler-core": "3.5.26",
+        "@vue/compiler-dom": "3.5.26",
+        "@vue/compiler-ssr": "3.5.26",
+        "@vue/shared": "3.5.26",
         "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.19",
+        "magic-string": "^0.30.21",
         "postcss": "^8.5.6",
         "source-map-js": "^1.2.1"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.22.tgz",
-      "integrity": "sha512-GdgyLvg4R+7T8Nk2Mlighx7XGxq/fJf9jaVofc3IL0EPesTE86cP/8DD1lT3h1JeZr2ySBvyqKQJgbS54IX1Ww==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.26.tgz",
+      "integrity": "sha512-lZT9/Y0nSIRUPVvapFJEVDbEXruZh2IYHMk2zTtEgJSlP5gVOqeWXH54xDKAaFS4rTnDeDBQUYDtxKyoW9FwDw==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-dom": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-dom": "3.5.26",
+        "@vue/shared": "3.5.26"
       }
     },
     "node_modules/@vue/devtools-api": {
@@ -1214,53 +1270,53 @@
       "license": "MIT"
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.22.tgz",
-      "integrity": "sha512-f2Wux4v/Z2pqc9+4SmgZC1p73Z53fyD90NFWXiX9AKVnVBEvLFOWCEgJD3GdGnlxPZt01PSlfmLqbLYzY/Fw4A==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.26.tgz",
+      "integrity": "sha512-9EnYB1/DIiUYYnzlnUBgwU32NNvLp/nhxLXeWRhHUEeWNTn1ECxX8aGO7RTXeX6PPcxe3LLuNBFoJbV4QZ+CFQ==",
       "license": "MIT",
       "dependencies": {
-        "@vue/shared": "3.5.22"
+        "@vue/shared": "3.5.26"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.22.tgz",
-      "integrity": "sha512-EHo4W/eiYeAzRTN5PCextDUZ0dMs9I8mQ2Fy+OkzvRPUYQEyK9yAjbasrMCXbLNhF7P0OUyivLjIy0yc6VrLJQ==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.26.tgz",
+      "integrity": "sha512-xJWM9KH1kd201w5DvMDOwDHYhrdPTrAatn56oB/LRG4plEQeZRQLw0Bpwih9KYoqmzaxF0OKSn6swzYi84e1/Q==",
       "license": "MIT",
       "dependencies": {
-        "@vue/reactivity": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/reactivity": "3.5.26",
+        "@vue/shared": "3.5.26"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.22.tgz",
-      "integrity": "sha512-Av60jsryAkI023PlN7LsqrfPvwfxOd2yAwtReCjeuugTJTkgrksYJJstg1e12qle0NarkfhfFu1ox2D+cQotww==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.26.tgz",
+      "integrity": "sha512-XLLd/+4sPC2ZkN/6+V4O4gjJu6kSDbHAChvsyWgm1oGbdSO3efvGYnm25yCjtFm/K7rrSDvSfPDgN1pHgS4VNQ==",
       "license": "MIT",
       "dependencies": {
-        "@vue/reactivity": "3.5.22",
-        "@vue/runtime-core": "3.5.22",
-        "@vue/shared": "3.5.22",
-        "csstype": "^3.1.3"
+        "@vue/reactivity": "3.5.26",
+        "@vue/runtime-core": "3.5.26",
+        "@vue/shared": "3.5.26",
+        "csstype": "^3.2.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.22.tgz",
-      "integrity": "sha512-gXjo+ao0oHYTSswF+a3KRHZ1WszxIqO7u6XwNHqcqb9JfyIL/pbWrrh/xLv7jeDqla9u+LK7yfZKHih1e1RKAQ==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.26.tgz",
+      "integrity": "sha512-TYKLXmrwWKSodyVuO1WAubucd+1XlLg4set0YoV+Hu8Lo79mp/YMwWV5mC5FgtsDxX3qo1ONrxFaTP1OQgy1uA==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-ssr": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-ssr": "3.5.26",
+        "@vue/shared": "3.5.26"
       },
       "peerDependencies": {
-        "vue": "3.5.22"
+        "vue": "3.5.26"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.22.tgz",
-      "integrity": "sha512-F4yc6palwq3TT0u+FYf0Ns4Tfl9GRFURDN2gWG7L1ecIaS/4fCIuFOjMTnCyjsu/OK6vaDKLCrGAa+KvvH+h4w==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.26.tgz",
+      "integrity": "sha512-7Z6/y3uFI5PRoKeorTOSXKcDj0MSasfNNltcslbFrPpcw6aXRUALq4IfJlaTRspiWIUOEZbrpM+iQGmCOiWe4A==",
       "license": "MIT"
     },
     "node_modules/@vueuse/core": {
@@ -1375,6 +1431,15 @@
         "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
       }
     },
+    "node_modules/adler-32": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.3.1.tgz",
+      "integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/ajv": {
       "version": "6.12.6",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@@ -1449,6 +1514,19 @@
         "node": ">=6"
       }
     },
+    "node_modules/cfb": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
+      "integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "adler-32": "~1.3.0",
+        "crc-32": "~1.2.0"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/chalk": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
@@ -1466,6 +1544,15 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/codepage": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz",
+      "integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -1493,6 +1580,18 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/crc-32": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
+      "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==",
+      "license": "Apache-2.0",
+      "bin": {
+        "crc32": "bin/crc32.njs"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/cross-spawn": {
       "version": "7.0.6",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -1522,9 +1621,9 @@
       }
     },
     "node_modules/csstype": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
-      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
+      "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
       "license": "MIT"
     },
     "node_modules/d3-color": {
@@ -1671,9 +1770,9 @@
       }
     },
     "node_modules/esbuild": {
-      "version": "0.25.11",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.11.tgz",
-      "integrity": "sha512-KohQwyzrKTQmhXDW1PjCv3Tyspn9n5GcY2RTDqeORIdIJY8yKIF7sTSopFmn/wpMPW4rdPXI0UE5LJLuq3bx0Q==",
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.2.tgz",
+      "integrity": "sha512-HyNQImnsOC7X9PMNaCIeAm4ISCQXs5a5YasTXVliKv4uuBo1dKrG0A+uQS8M5eXjVMnLg3WgXaKvprHlFJQffw==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -1684,32 +1783,32 @@
         "node": ">=18"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.25.11",
-        "@esbuild/android-arm": "0.25.11",
-        "@esbuild/android-arm64": "0.25.11",
-        "@esbuild/android-x64": "0.25.11",
-        "@esbuild/darwin-arm64": "0.25.11",
-        "@esbuild/darwin-x64": "0.25.11",
-        "@esbuild/freebsd-arm64": "0.25.11",
-        "@esbuild/freebsd-x64": "0.25.11",
-        "@esbuild/linux-arm": "0.25.11",
-        "@esbuild/linux-arm64": "0.25.11",
-        "@esbuild/linux-ia32": "0.25.11",
-        "@esbuild/linux-loong64": "0.25.11",
-        "@esbuild/linux-mips64el": "0.25.11",
-        "@esbuild/linux-ppc64": "0.25.11",
-        "@esbuild/linux-riscv64": "0.25.11",
-        "@esbuild/linux-s390x": "0.25.11",
-        "@esbuild/linux-x64": "0.25.11",
-        "@esbuild/netbsd-arm64": "0.25.11",
-        "@esbuild/netbsd-x64": "0.25.11",
-        "@esbuild/openbsd-arm64": "0.25.11",
-        "@esbuild/openbsd-x64": "0.25.11",
-        "@esbuild/openharmony-arm64": "0.25.11",
-        "@esbuild/sunos-x64": "0.25.11",
-        "@esbuild/win32-arm64": "0.25.11",
-        "@esbuild/win32-ia32": "0.25.11",
-        "@esbuild/win32-x64": "0.25.11"
+        "@esbuild/aix-ppc64": "0.27.2",
+        "@esbuild/android-arm": "0.27.2",
+        "@esbuild/android-arm64": "0.27.2",
+        "@esbuild/android-x64": "0.27.2",
+        "@esbuild/darwin-arm64": "0.27.2",
+        "@esbuild/darwin-x64": "0.27.2",
+        "@esbuild/freebsd-arm64": "0.27.2",
+        "@esbuild/freebsd-x64": "0.27.2",
+        "@esbuild/linux-arm": "0.27.2",
+        "@esbuild/linux-arm64": "0.27.2",
+        "@esbuild/linux-ia32": "0.27.2",
+        "@esbuild/linux-loong64": "0.27.2",
+        "@esbuild/linux-mips64el": "0.27.2",
+        "@esbuild/linux-ppc64": "0.27.2",
+        "@esbuild/linux-riscv64": "0.27.2",
+        "@esbuild/linux-s390x": "0.27.2",
+        "@esbuild/linux-x64": "0.27.2",
+        "@esbuild/netbsd-arm64": "0.27.2",
+        "@esbuild/netbsd-x64": "0.27.2",
+        "@esbuild/openbsd-arm64": "0.27.2",
+        "@esbuild/openbsd-x64": "0.27.2",
+        "@esbuild/openharmony-arm64": "0.27.2",
+        "@esbuild/sunos-x64": "0.27.2",
+        "@esbuild/win32-arm64": "0.27.2",
+        "@esbuild/win32-ia32": "0.27.2",
+        "@esbuild/win32-x64": "0.27.2"
       }
     },
     "node_modules/escape-string-regexp": {
@@ -1726,9 +1825,9 @@
       }
     },
     "node_modules/eslint": {
-      "version": "9.39.1",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.1.tgz",
-      "integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==",
+      "version": "9.39.2",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.2.tgz",
+      "integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==",
       "dev": true,
       "license": "MIT",
       "peer": true,
@@ -1739,7 +1838,7 @@
         "@eslint/config-helpers": "^0.4.2",
         "@eslint/core": "^0.17.0",
         "@eslint/eslintrc": "^3.3.1",
-        "@eslint/js": "9.39.1",
+        "@eslint/js": "9.39.2",
         "@eslint/plugin-kit": "^0.4.1",
         "@humanfs/node": "^0.16.6",
         "@humanwhocodes/module-importer": "^1.0.1",
@@ -1787,16 +1886,16 @@
       }
     },
     "node_modules/eslint-plugin-vue": {
-      "version": "10.5.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-10.5.1.tgz",
-      "integrity": "sha512-SbR9ZBUFKgvWAbq3RrdCtWaW0IKm6wwUiApxf3BVTNfqUIo4IQQmreMg2iHFJJ6C/0wss3LXURBJ1OwS/MhFcQ==",
+      "version": "10.6.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-10.6.2.tgz",
+      "integrity": "sha512-nA5yUs/B1KmKzvC42fyD0+l9Yd+LtEpVhWRbXuDj0e+ZURcTtyRbMDWUeJmTAh2wC6jC83raS63anNM2YT3NPw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.4.0",
         "natural-compare": "^1.4.0",
         "nth-check": "^2.1.1",
-        "postcss-selector-parser": "^6.0.15",
+        "postcss-selector-parser": "^7.1.0",
         "semver": "^7.6.3",
         "xml-name-validator": "^4.0.0"
       },
@@ -1867,9 +1966,9 @@
       }
     },
     "node_modules/esquery": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.6.0.tgz",
-      "integrity": "sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==",
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.7.0.tgz",
+      "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -2008,6 +2107,15 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/frac": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
+      "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@@ -2216,9 +2324,9 @@
       "license": "MIT"
     },
     "node_modules/magic-string": {
-      "version": "0.30.19",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.19.tgz",
-      "integrity": "sha512-2N21sPY9Ws53PZvsEpVtNuSW+ScYbQdp4b9qUaL+9QkHUrGFKo56Lg9Emg5s9V/qrtNBmiR01sYhUOwu3H+VOw==",
+      "version": "0.30.21",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
+      "integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
       "license": "MIT",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.5.5"
@@ -2366,6 +2474,12 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/papaparse": {
+      "version": "5.5.3",
+      "resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.5.3.tgz",
+      "integrity": "sha512-5QvjGxYVjxO59MGU2lHVYpRWBBtKHnlIAcSe1uNFCkkptUh63NFRj0FJQm7nR67puEruUci/ZkjmEFrjCAyP4A==",
+      "license": "MIT"
+    },
     "node_modules/parent-module": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -2448,9 +2562,9 @@
       }
     },
     "node_modules/postcss-selector-parser": {
-      "version": "6.1.2",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
-      "integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.1.tgz",
+      "integrity": "sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2501,9 +2615,9 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.52.4",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.52.4.tgz",
-      "integrity": "sha512-CLEVl+MnPAiKh5pl4dEWSyMTpuflgNQiLGhMv8ezD5W/qP8AKvmYpCOKRRNOh7oRKnauBZ4SyeYkMS+1VSyKwQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.55.1.tgz",
+      "integrity": "sha512-wDv/Ht1BNHB4upNbK74s9usvl7hObDnvVzknxqY/E/O3X6rW1U1rV1aENEfJ54eFZDTNo7zv1f5N4edCluH7+A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2517,28 +2631,31 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.52.4",
-        "@rollup/rollup-android-arm64": "4.52.4",
-        "@rollup/rollup-darwin-arm64": "4.52.4",
-        "@rollup/rollup-darwin-x64": "4.52.4",
-        "@rollup/rollup-freebsd-arm64": "4.52.4",
-        "@rollup/rollup-freebsd-x64": "4.52.4",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.52.4",
-        "@rollup/rollup-linux-arm-musleabihf": "4.52.4",
-        "@rollup/rollup-linux-arm64-gnu": "4.52.4",
-        "@rollup/rollup-linux-arm64-musl": "4.52.4",
-        "@rollup/rollup-linux-loong64-gnu": "4.52.4",
-        "@rollup/rollup-linux-ppc64-gnu": "4.52.4",
-        "@rollup/rollup-linux-riscv64-gnu": "4.52.4",
-        "@rollup/rollup-linux-riscv64-musl": "4.52.4",
-        "@rollup/rollup-linux-s390x-gnu": "4.52.4",
-        "@rollup/rollup-linux-x64-gnu": "4.52.4",
-        "@rollup/rollup-linux-x64-musl": "4.52.4",
-        "@rollup/rollup-openharmony-arm64": "4.52.4",
-        "@rollup/rollup-win32-arm64-msvc": "4.52.4",
-        "@rollup/rollup-win32-ia32-msvc": "4.52.4",
-        "@rollup/rollup-win32-x64-gnu": "4.52.4",
-        "@rollup/rollup-win32-x64-msvc": "4.52.4",
+        "@rollup/rollup-android-arm-eabi": "4.55.1",
+        "@rollup/rollup-android-arm64": "4.55.1",
+        "@rollup/rollup-darwin-arm64": "4.55.1",
+        "@rollup/rollup-darwin-x64": "4.55.1",
+        "@rollup/rollup-freebsd-arm64": "4.55.1",
+        "@rollup/rollup-freebsd-x64": "4.55.1",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.55.1",
+        "@rollup/rollup-linux-arm-musleabihf": "4.55.1",
+        "@rollup/rollup-linux-arm64-gnu": "4.55.1",
+        "@rollup/rollup-linux-arm64-musl": "4.55.1",
+        "@rollup/rollup-linux-loong64-gnu": "4.55.1",
+        "@rollup/rollup-linux-loong64-musl": "4.55.1",
+        "@rollup/rollup-linux-ppc64-gnu": "4.55.1",
+        "@rollup/rollup-linux-ppc64-musl": "4.55.1",
+        "@rollup/rollup-linux-riscv64-gnu": "4.55.1",
+        "@rollup/rollup-linux-riscv64-musl": "4.55.1",
+        "@rollup/rollup-linux-s390x-gnu": "4.55.1",
+        "@rollup/rollup-linux-x64-gnu": "4.55.1",
+        "@rollup/rollup-linux-x64-musl": "4.55.1",
+        "@rollup/rollup-openbsd-x64": "4.55.1",
+        "@rollup/rollup-openharmony-arm64": "4.55.1",
+        "@rollup/rollup-win32-arm64-msvc": "4.55.1",
+        "@rollup/rollup-win32-ia32-msvc": "4.55.1",
+        "@rollup/rollup-win32-x64-gnu": "4.55.1",
+        "@rollup/rollup-win32-x64-msvc": "4.55.1",
         "fsevents": "~2.3.2"
       }
     },
@@ -2587,6 +2704,18 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/ssf": {
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz",
+      "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "frac": "~1.1.2"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/strip-json-comments": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
@@ -2667,14 +2796,14 @@
       "license": "MIT"
     },
     "node_modules/vite": {
-      "version": "7.2.7",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-7.2.7.tgz",
-      "integrity": "sha512-ITcnkFeR3+fI8P1wMgItjGrR10170d8auB4EpMLPqmx6uxElH3a/hHGQabSHKdqd4FXWO1nFIp9rRn7JQ34ACQ==",
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-7.3.0.tgz",
+      "integrity": "sha512-dZwN5L1VlUBewiP6H9s2+B3e3Jg96D0vzN+Ry73sOefebhYr9f94wwkMNN/9ouoU8pV1BqA1d1zGk8928cx0rg==",
       "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "esbuild": "^0.25.0",
+        "esbuild": "^0.27.0",
         "fdir": "^6.5.0",
         "picomatch": "^4.0.3",
         "postcss": "^8.5.6",
@@ -2743,17 +2872,17 @@
       }
     },
     "node_modules/vue": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.22.tgz",
-      "integrity": "sha512-toaZjQ3a/G/mYaLSbV+QsQhIdMo9x5rrqIpYRObsJ6T/J+RyCSFwN2LHNVH9v8uIcljDNa3QzPVdv3Y6b9hAJQ==",
+      "version": "3.5.26",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.26.tgz",
+      "integrity": "sha512-SJ/NTccVyAoNUJmkM9KUqPcYlY+u8OVL1X5EW9RIs3ch5H2uERxyyIUI4MRxVCSOiEcupX9xNGde1tL9ZKpimA==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "@vue/compiler-dom": "3.5.22",
-        "@vue/compiler-sfc": "3.5.22",
-        "@vue/runtime-dom": "3.5.22",
-        "@vue/server-renderer": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-dom": "3.5.26",
+        "@vue/compiler-sfc": "3.5.26",
+        "@vue/runtime-dom": "3.5.26",
+        "@vue/server-renderer": "3.5.26",
+        "@vue/shared": "3.5.26"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -2790,9 +2919,9 @@
       }
     },
     "node_modules/vue-router": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.6.0.tgz",
-      "integrity": "sha512-YRrWLi4ayHe1d6zyH6sMPwF/WwcDY8XgUOfQGa0Kx4kmugSorLavD1ExrM/Y83B4X2NQMXYpJFSq2pbZh9ildQ==",
+      "version": "4.6.4",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.6.4.tgz",
+      "integrity": "sha512-Hz9q5sa33Yhduglwz6g9skT8OBPii+4bFn88w6J+J4MfEo4KRRpmiNG/hHHkdbRFlLBOqxN8y8gf2Fb0MTUgVg==",
       "license": "MIT",
       "dependencies": {
         "@vue/devtools-api": "^6.6.4"
@@ -2820,6 +2949,24 @@
         "node": ">= 8"
       }
     },
+    "node_modules/wmf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
+      "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
+    "node_modules/word": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz",
+      "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/word-wrap": {
       "version": "1.2.5",
       "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
@@ -2830,6 +2977,27 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/xlsx": {
+      "version": "0.18.5",
+      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.18.5.tgz",
+      "integrity": "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "adler-32": "~1.3.0",
+        "cfb": "~1.2.1",
+        "codepage": "~1.15.0",
+        "crc-32": "~1.2.1",
+        "ssf": "~0.11.2",
+        "wmf": "~1.0.1",
+        "word": "~0.3.0"
+      },
+      "bin": {
+        "xlsx": "bin/xlsx.njs"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/xml-name-validator": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz",
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index a66d807d..89583c08 100755
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -5,8 +5,8 @@ import Sidebar from './components/Sidebar.vue'
 
 const route = useRoute()
 
-// Hide the sidebar on LaunchView
-const showSidebar = computed(() => route.path !== '/launch')
+// Hide the sidebar on LaunchView, BatchRunView and WorkflowWorkbench
+const showSidebar = computed(() => route.path !== '/launch' && route.path !== '/batch-run')
 </script>
 
 <template>
diff --git a/frontend/src/components/Sidebar.vue b/frontend/src/components/Sidebar.vue
index e5deeebc..fc38d221 100755
--- a/frontend/src/components/Sidebar.vue
+++ b/frontend/src/components/Sidebar.vue
@@ -9,6 +9,7 @@
                 :class="{ active: isWorkflowsActive }"
             >Workflows</router-link>
             <router-link to="/launch" target="_blank" rel="noopener">Launch</router-link>
+            <router-link to="/batch-run" target="_blank" rel="noopener">Labaratory</router-link>
         </nav>
         <div class="sidebar-actions">
             <button class="settings-nav-btn" @click="showSettingsModal = true" title="Settings">
diff --git a/frontend/src/pages/BatchRunView.vue b/frontend/src/pages/BatchRunView.vue
new file mode 100644
index 00000000..033ef622
--- /dev/null
+++ b/frontend/src/pages/BatchRunView.vue
@@ -0,0 +1,2564 @@
+<template>
+  <div class="launch-view">
+    <div class="launch-bg"></div>
+    <div class="header">
+      <h1>Labaratory</h1>
+      <button class="settings-button" @click="showSettingsModal = true" title="Settings">
+        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <circle cx="12" cy="12" r="3"></circle>
+          <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path>
+        </svg>
+      </button>
+    </div>
+    <div class="content">
+      <!-- Left panel -->
+      <div class="left-panel">
+        <!-- Log area -->
+        <div class="log-box">
+          <div class="log-messages" ref="logMessagesRef">
+            <div v-for="(logMessage, index) in logMessages" :key="index" class="log-message">
+              {{ logMessage }}
+            </div>
+            <div v-if="logMessages.length === 0" class="log-placeholder">
+              Batch processing logs will appear here...
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Right panel -->
+      <div class="right-panel">
+        <div class="control-section">
+          <label class="section-label">Workflow Selection</label>
+      <div
+        class="select-wrapper custom-file-selector"
+        ref="fileSelectorWrapperRef"
+      >
+        <input
+          ref="fileSelectorInputRef"
+          v-model="fileSearchQuery"
+          type="text"
+          class="file-selector-input"
+          :placeholder="loading ? 'Loading...' : 'Select YAML file...'"
+          :disabled="loading || isWorkflowRunning"
+          @focus="handleFileInputFocus"
+          @input="handleFileInputChange"
+          @keydown.enter.prevent="handleFileInputEnter"
+          @blur="handleFileInputBlur"
+        />
+        <div class="select-arrow">▼</div>
+        <Transition name="file-dropdown">
+          <ul
+            v-if="isFileDropdownOpen"
+            class="file-dropdown"
+          >
+            <li
+              v-for="workflow in filteredWorkflowFiles"
+              :key="workflow.name"
+              class="file-option"
+              @mousedown.prevent="selectWorkflow(workflow.name)"
+            >
+              <span class="file-name">{{ workflow.name }}</span>
+              <span
+                v-if="workflow.description"
+                class="file-desc"
+              >
+                {{ workflow.description }}
+              </span>
+            </li>
+            <li
+              v-if="!filteredWorkflowFiles.length"
+              class="file-empty"
+            >
+              No results
+            </li>
+          </ul>
+        </Transition>
+      </div>
+
+          <label class="section-label">Input File Selection</label>
+          <div class="input-file-section">
+            <div class="file-upload-wrapper">
+              <input
+                ref="inputFileInputRef"
+                type="file"
+                accept=".xlsx,.csv"
+                class="hidden-file-input"
+                @change="onInputFileSelected"
+              />
+              <button
+                type="button"
+                class="file-upload-button"
+                :disabled="loading || isWorkflowRunning"
+                @click="handleInputFileButtonClick"
+              >
+                {{ selectedInputFile ? selectedInputFile.name : 'Select input file...' }}
+              </button>
+            </div>
+          </div>
+
+          <div class="input-manual">
+            <div class="manual-title" @click="showColumnGuideModal = true">
+              Input File Format
+              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="info-icon">
+                <circle cx="12" cy="12" r="10"></circle>
+                <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                <path d="M12 17h.01"></path>
+              </svg>
+            </div>
+          </div>
+
+          <label class="section-label">Status</label>
+          <div class="status-display" :class="{ 'status-active': status === 'Running...' }">
+            {{ computedStatus }}
+          </div>
+
+
+          <!-- Button area -->
+          <div class="button-section">
+            <button
+              class="launch-button"
+              :class="{ glow: shouldGlow, 'is-sending': isWorkflowRunning }"
+              @click="handleButtonClick"
+              :disabled="isLaunchButtonDisabled">
+              {{ buttonLabel }}
+            </button>
+
+            <button
+              class="cancel-button"
+              :disabled="status !== 'Running...'"
+              @click="cancelBatchWorkflow"
+            >
+              Cancel
+            </button>
+
+            <button
+              class="download-button"
+              :disabled="status !== 'Batch completed' && status !== 'Batch cancelled'"
+              @click="downloadLogs"
+            >
+              Download Logs
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <Transition name="image-modal">
+    <div
+      v-if="selectedArtifactImage"
+      class="image-modal"
+      @click.self="closeImageModal"
+    >
+      <div class="image-modal-content">
+        <img
+          :src="selectedArtifactImage.src"
+          :alt="selectedArtifactImage.name"
+          :click="closeImageModal"
+        />
+      </div>
+    </div>
+  </Transition>
+
+  <SettingsModal
+    :is-visible="showSettingsModal"
+    @update:is-visible="showSettingsModal = $event"
+  />
+
+  <!-- Column Guide Modal -->
+  <Transition name="modal">
+    <div
+      v-if="showColumnGuideModal"
+      class="column-guide-modal-overlay"
+      @click.self="showColumnGuideModal = false"
+    >
+      <div class="column-guide-modal">
+        <div class="modal-content">
+          <div class="manual-content">
+            <div class="manual-item">
+              <code>id</code> - Must be unique, auto-generated if column not found
+            </div>
+            <div class="manual-item">
+              <code>task</code> - Holds user input
+            </div>
+            <div class="manual-item">
+              <code>vars</code> - JSON object containing key-value pairs of global variables
+              <div class="manual-example">
+                <pre>{{
+JSON.stringify({"BASE_URL": "openai.com","API_KEY": "123"}, null, 2)
+}}</pre>
+              </div>
+            </div>
+            <div class="manual-item">
+              <code>attachments</code> - JSON array containing absolute file paths of attachments for workflow
+              <div class="manual-example">
+                <pre>{{
+JSON.stringify(["C:\\a_sheep.png"], null, 2)
+}}</pre>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </Transition>
+</template>
+
+<script setup>
+import { ref, computed, onMounted, onUnmounted, watch, nextTick } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+import { fetchWorkflowsWithDesc, fetchLogsZip, fetchWorkflowYAML, postFile, getAttachment, fetchVueGraph, postBatchWorkflow } from '../utils/apiFunctions.js'
+import { configStore } from '../utils/configStore.js'
+import { spriteFetcher } from '../utils/spriteFetcher.js'
+import yaml from 'js-yaml'
+import MarkdownIt from 'markdown-it'
+import SettingsModal from '../components/SettingsModal.vue'
+const md = new MarkdownIt({
+  html: false,
+  linkify: true,
+  typographer: true
+})
+
+const renderMarkdown = (text) => {
+  return md.render(text || '')
+}
+
+const formatTime = (timestamp) => {
+  if (!timestamp) return ''
+  const date = new Date(timestamp)
+  return date.toLocaleTimeString('en-GB', { hour12: false }) // HH:mm:ss
+}
+
+const formatLogTimestamp = (timestamp) => {
+  if (!timestamp) return ''
+  const date = new Date(timestamp)
+  const month = String(date.getMonth() + 1).padStart(2, '0')
+  const day = String(date.getDate()).padStart(2, '0')
+  const hours = String(date.getHours()).padStart(2, '0')
+  const minutes = String(date.getMinutes()).padStart(2, '0')
+  const seconds = String(date.getSeconds()).padStart(2, '0')
+  const milliseconds = String(date.getMilliseconds()).padStart(3, '0')
+  return `${month}/${day} - ${hours}:${minutes}:${seconds}.${milliseconds}`
+}
+import { VueFlow, useVueFlow, MarkerType } from '@vue-flow/core'
+import { Background } from '@vue-flow/background'
+import { Controls } from '@vue-flow/controls'
+import '@vue-flow/core/dist/style.css'
+import '@vue-flow/controls/dist/style.css'
+import '../utils/vueflow.css'
+import WorkflowNode from '../components/WorkflowNode.vue'
+import WorkflowEdge from '../components/WorkflowEdge.vue'
+import StartNode from '../components/StartNode.vue'
+import CollapsibleMessage from '../components/CollapsibleMessage.vue'
+
+const router = useRouter()
+const route = useRoute()
+
+// Log box state
+const logMessages = ref([])
+const logMessagesRef = ref(null)
+
+// Task input state
+const taskPrompt = ref('')
+
+// File selector state
+const workflowFiles = ref([])
+const selectedYamlFile = ref('')
+const fileSearchQuery = ref('')
+const isFileSearchDirty = ref(false)
+const isFileDropdownOpen = ref(false)
+const fileSelectorWrapperRef = ref(null)
+const fileSelectorInputRef = ref(null)
+
+// Status state
+const status = ref('Waiting for workflow selection...')
+const loading = ref(false)
+
+// Computed status from workflow and input file selection
+const computedStatus = computed(() => {
+  if (loading.value) return 'Loading...'
+  if (status.value === 'Waiting for workflow selection...') return status.value
+  if (!selectedYamlFile.value) return 'Waiting for workflow selection...'
+  if (!selectedInputFile.value) return 'Waiting for file selection...'
+  return status.value
+})
+
+// Session ID for downloads
+let sessionIdToDownload = null
+
+// Input glow state
+const shouldGlow = ref(false)
+const taskInputRef = ref(null)
+const attachmentInputRef = ref(null)
+const uploadedAttachments = ref([])
+const isDragActive = ref(false)
+const showAttachmentPopover = ref(false)
+const isUploadingAttachment = ref(false)
+let attachmentHoverTimeout = null
+const selectedArtifactImage = ref(null)
+let dragDepth = 0
+
+// Input file selection state
+const selectedInputFile = ref(null)
+const inputFileInputRef = ref(null)
+
+// Recording state
+const isRecording = ref(false)
+let mediaRecorder = null
+let audioChunks = []
+let audioStream = null
+
+// WebSocket readiness state
+const isConnectionReady = ref(false)
+const showSettingsModal = ref(false)
+const showColumnGuideModal = ref(false)
+
+// View mode
+const viewMode = ref('chat')
+
+// WebSocket reference
+let ws = null
+let sessionId = null
+
+const filteredWorkflowFiles = computed(() => {
+  // If the file search box is untouched, return all workflows
+  if (!isFileSearchDirty.value) {
+    return workflowFiles.value
+  }
+  const query = fileSearchQuery.value.trim().toLowerCase()
+  if (!query) {
+    return workflowFiles.value
+  }
+  return workflowFiles.value.filter((workflow) =>
+    workflow.name?.toLowerCase().includes(query)
+  )
+})
+
+// Button label computed property
+const buttonLabel = computed(() => {
+  if (status.value === 'Batch completed' || status.value === 'Batch cancelled') {
+    return 'Relaunch'
+  }
+  return 'Launch'
+})
+
+// Computed button state
+const isLaunchButtonDisabled = computed(() => {
+  if (loading.value) return true
+  if (status.value === 'Batch completed' || status.value === 'Batch cancelled') return false
+  if (!isConnectionReady.value) return true
+  if (!selectedYamlFile.value || !selectedInputFile.value) return true
+  return false
+})
+
+const clearUploadedAttachments = () => {
+  uploadedAttachments.value = []
+  showAttachmentPopover.value = false
+  if (attachmentInputRef.value) {
+    attachmentInputRef.value.value = ''
+  }
+}
+
+// Reset the WebSocket connection and related state
+const resetConnectionState = ({ closeSocket = true, clearInputFile = true } = {}) => {
+  if (closeSocket && ws) {
+    try {
+      ws.close()
+    } catch (closeError) {
+      console.warn('Failed to close WebSocket:', closeError)
+    }
+  }
+
+  ws = null
+  sessionId = null
+  isConnectionReady.value = false
+  shouldGlow.value = false
+  isWorkflowRunning.value = false
+  activeNodes.value = []
+  if (attachmentHoverTimeout) {
+    clearTimeout(attachmentHoverTimeout)
+    attachmentHoverTimeout = null
+  }
+
+  if (clearInputFile) {
+    removeInputFile()
+  }
+}
+
+// Button state management
+const isWorkflowRunning = ref(false)
+
+// Active node list
+const activeNodes = ref([])
+// Hovered node id for highlighting related edges
+const hoveredNodeId = ref(null)
+
+const onNodeHover = (nodeId) => {
+  hoveredNodeId.value = nodeId || null
+}
+const onNodeLeave = (_nodeId) => {
+  hoveredNodeId.value = null
+}
+
+// Current workflow YAML content
+const workflowYaml = ref({})
+
+// const goBack = () => {
+//   router.push('/workflows')
+// }
+
+const applyWorkflowFromRoute = () => {
+  let workflowParam = route.query?.workflow || route.query?.file || route.query?.name
+  if (Array.isArray(workflowParam)) {
+    workflowParam = workflowParam[0]
+  }
+  if (!workflowParam || typeof workflowParam !== 'string') {
+    return
+  }
+
+  let fileName = workflowParam.trim()
+  if (!fileName) {
+    return
+  }
+  if (!fileName.toLowerCase().endsWith('.yaml')) {
+    fileName = `${fileName}.yaml`
+  }
+
+  selectedYamlFile.value = fileName
+  fileSearchQuery.value = fileName
+  isFileSearchDirty.value = false
+}
+
+// Load workflow list
+const loadWorkflows = async () => {
+  loading.value = true
+  const result = await fetchWorkflowsWithDesc()
+  loading.value = false
+
+  if (result.success) {
+    workflowFiles.value = result.workflows
+    applyWorkflowFromRoute()
+  } else {
+    console.error('Failed to load workflows:', result.error)
+  }
+}
+
+const openFileDropdown = () => {
+  if (loading.value || isWorkflowRunning.value) {
+    return
+  }
+  isFileDropdownOpen.value = true
+}
+
+const handleFileInputFocus = () => {
+  isFileSearchDirty.value = false
+  openFileDropdown()
+  if (fileSearchQuery.value?.trim()) {
+    nextTick(() => fileSelectorInputRef.value?.select())
+  }
+}
+
+const handleFileInputChange = () => {
+  if (loading.value || isWorkflowRunning.value) {
+    return
+  }
+  isFileSearchDirty.value = true
+  openFileDropdown()
+}
+
+const closeFileDropdown = () => {
+  isFileDropdownOpen.value = false
+}
+
+const selectWorkflow = (fileName) => {
+  if (!fileName) {
+    return
+  }
+  selectedYamlFile.value = fileName
+  fileSearchQuery.value = fileName
+  isFileSearchDirty.value = false
+  closeFileDropdown()
+
+  router.push({
+    query: {
+      ...route.query,
+      workflow: fileName
+    }
+  })
+}
+
+const handleFileInputEnter = () => {
+  const [firstMatch] = filteredWorkflowFiles.value
+  if (firstMatch) {
+    selectWorkflow(firstMatch.name)
+  }
+}
+
+const resetFileSearchQuery = () => {
+  fileSearchQuery.value = selectedYamlFile.value || ''
+  isFileSearchDirty.value = false
+}
+
+const handleFileInputBlur = () => {
+  setTimeout(() => {
+    if (!isFileDropdownOpen.value) {
+      resetFileSearchQuery()
+    }
+  }, 120)
+}
+
+const handleClickOutside = (event) => {
+  if (
+    isFileDropdownOpen.value &&
+    fileSelectorWrapperRef.value &&
+    !fileSelectorWrapperRef.value.contains(event.target)
+  ) {
+    closeFileDropdown()
+    resetFileSearchQuery()
+  }
+}
+
+// Add a log entry
+const addLogMessage = (message) => {
+  const timestamp = formatLogTimestamp(Date.now())
+  logMessages.value.push(`${timestamp} : ${message}`)
+}
+
+const isAttachmentUploadAllowed = () => {
+  if (!isConnectionReady.value || !sessionId || isUploadingAttachment.value) {
+    return false
+  }
+  if (isWorkflowRunning.value && status.value !== 'Waiting for input...') {
+    return false
+  }
+  return true
+}
+
+const uploadFiles = async (files) => {
+  if (!files || files.length === 0) {
+    return
+  }
+
+  if (!sessionId) {
+    alert('Session is not ready yet. Please wait for connection.')
+    return
+  }
+
+  isUploadingAttachment.value = true
+  try {
+    for (const file of files) {
+      try {
+        const result = await postFile(sessionId, file)
+
+        if (result?.success && result?.attachmentId) {
+          console.log('File uploaded successfully:', result)
+          uploadedAttachments.value.push(result)
+        } else {
+          console.error('File upload failed:', result)
+          alert(result?.message || 'Failed to upload file')
+        }
+      } catch (error) {
+        console.error('Failed to upload attachment:', error)
+        alert('File upload failed, please try again.')
+      }
+    }
+  } finally {
+    isUploadingAttachment.value = false
+  }
+}
+
+const onAttachmentSelected = async (event) => {
+  const file = event.target?.files?.[0]
+  if (event.target) {
+    event.target.value = ''
+  }
+
+  if (!file) {
+    return
+  }
+
+  await uploadFiles([file])
+}
+
+const removeAttachment = (attachmentId) => {
+  uploadedAttachments.value = uploadedAttachments.value.filter(
+    (attachment) => attachment.attachmentId !== attachmentId
+  )
+}
+
+// Input file selection methods
+const handleInputFileButtonClick = () => {
+  if (loading.value || isWorkflowRunning.value) {
+    return
+  }
+  inputFileInputRef.value?.click()
+}
+
+const onInputFileSelected = (event) => {
+  const file = event.target?.files?.[0]
+  if (event.target) {
+    event.target.value = ''
+  }
+
+  if (!file) {
+    return
+  }
+
+  // Validate file type
+  const allowedExtensions = ['.xlsx', '.csv']
+  const fileName = file.name.toLowerCase()
+  const isValidType = allowedExtensions.some(ext => fileName.endsWith(ext))
+
+  if (!isValidType) {
+    alert('Please select a valid file (.xlsx or .csv)')
+    return
+  }
+
+  selectedInputFile.value = file
+}
+
+const removeInputFile = () => {
+  selectedInputFile.value = null
+  if (inputFileInputRef.value) {
+    inputFileInputRef.value.value = ''
+  }
+}
+
+const startRecording = async () => {
+  if (!isConnectionReady.value || !sessionId || isUploadingAttachment.value || isRecording.value) {
+    return
+  }
+
+  // Add global listeners to ensure recording stops even if mouse leaves button
+  window.addEventListener('mouseup', stopRecordingGlobal)
+  window.addEventListener('touchend', stopRecordingGlobal)
+
+  try {
+    // Request microphone access
+    audioStream = await navigator.mediaDevices.getUserMedia({ audio: true })
+
+    // Check for MP3 support, fallback to webm
+    const mimeTypes = ['audio/mpeg', 'audio/wav', 'audio/webm', 'audio/ogg']
+    let selectedMimeType = 'audio/webm'
+
+    for (const mimeType of mimeTypes) {
+      if (MediaRecorder.isTypeSupported(mimeType)) {
+        selectedMimeType = mimeType
+        break
+      }
+    }
+
+    mediaRecorder = new MediaRecorder(audioStream, {
+      mimeType: selectedMimeType
+    })
+
+    audioChunks = []
+
+    mediaRecorder.ondataavailable = (event) => {
+      if (event.data.size > 0) {
+        audioChunks.push(event.data)
+      }
+    }
+
+    mediaRecorder.onstop = async () => {
+      if (audioChunks.length === 0) {
+        cleanupRecording()
+        return
+      }
+
+      // Create blob from audio chunks
+      const audioBlob = new Blob(audioChunks, { type: selectedMimeType })
+
+      // Generate filename with current time
+      const now = new Date()
+      const timestamp = now.toISOString().replace(/[:.]/g, '-').slice(0, -5)
+      const filename = `recording_${timestamp}.${selectedMimeType.split('/')[1]}`
+
+      // Create File object from blob
+      const audioFile = new File([audioBlob], filename, { type: selectedMimeType })
+
+      // Upload the file
+      try {
+        isUploadingAttachment.value = true
+        const result = await postFile(sessionId, audioFile)
+
+        if (result?.success && result?.attachmentId) {
+          console.log('Recording uploaded successfully:', result)
+          uploadedAttachments.value.push(result)
+        } else {
+          console.error('Recording upload failed:', result)
+          alert(result?.message || 'Failed to upload recording')
+        }
+      } catch (error) {
+        console.error('Failed to upload recording:', error)
+        alert('Recording upload failed, please try again.')
+      } finally {
+        isUploadingAttachment.value = false
+        cleanupRecording()
+      }
+    }
+
+    mediaRecorder.onerror = (event) => {
+      console.error('MediaRecorder error:', event.error)
+      alert('Recording error occurred')
+      cleanupRecording()
+    }
+
+    mediaRecorder.start()
+    isRecording.value = true
+  } catch (error) {
+    console.error('Failed to start recording:', error)
+    alert('Failed to access microphone. Please check permissions.')
+    cleanupRecording()
+  }
+}
+
+const stopRecording = () => {
+  if (mediaRecorder && isRecording.value && mediaRecorder.state !== 'inactive') {
+    mediaRecorder.stop()
+    isRecording.value = false
+  }
+  removeGlobalListeners()
+}
+
+const stopRecordingGlobal = () => {
+  stopRecording()
+}
+
+const removeGlobalListeners = () => {
+  window.removeEventListener('mouseup', stopRecordingGlobal)
+  window.removeEventListener('touchend', stopRecordingGlobal)
+}
+
+const handleMicrophoneMouseLeave = (event) => {
+  // If mouse leaves while recording, don't stop (let global listener handle it)
+  // This allows recording to continue if user drags outside button
+}
+
+const cleanupRecording = () => {
+  removeGlobalListeners()
+  if (audioStream) {
+    audioStream.getTracks().forEach(track => track.stop())
+    audioStream = null
+  }
+  mediaRecorder = null
+  audioChunks = []
+  isRecording.value = false
+}
+
+const handleAttachmentHover = (isHovering) => {
+  if (isHovering) {
+    if (attachmentHoverTimeout) {
+      clearTimeout(attachmentHoverTimeout)
+      attachmentHoverTimeout = null
+    }
+
+    if (uploadedAttachments.value.length > 0) {
+      showAttachmentPopover.value = true
+    }
+    return
+  }
+
+  if (attachmentHoverTimeout) {
+    clearTimeout(attachmentHoverTimeout)
+  }
+
+  attachmentHoverTimeout = setTimeout(() => {
+    showAttachmentPopover.value = false
+    attachmentHoverTimeout = null
+  }, 140)
+}
+
+const lockBodyScroll = () => {
+  if (typeof document !== 'undefined') {
+    document.body.style.overflow = 'hidden'
+  }
+}
+
+const unlockBodyScroll = () => {
+  if (typeof document !== 'undefined') {
+    document.body.style.overflow = ''
+  }
+}
+
+const openImageModal = (message) => {
+  if (!message || message.loading || !message.dataUri) {
+    return
+  }
+  selectedArtifactImage.value = {
+    src: message.dataUri,
+    name: message.fileName || 'Artifact image'
+  }
+  lockBodyScroll()
+}
+
+const closeImageModal = () => {
+  if (!selectedArtifactImage.value) {
+    return
+  }
+  selectedArtifactImage.value = null
+  unlockBodyScroll()
+}
+
+const handleKeydown = (event) => {
+  if (event.key === 'Escape') {
+    if (selectedArtifactImage.value) {
+      closeImageModal()
+    } else if (showColumnGuideModal.value) {
+      showColumnGuideModal.value = false
+    }
+  }
+}
+
+// Handle paste events, including file uploads
+const handlePaste = async (event) => {
+  // Check if upload is allowed
+  if (!isAttachmentUploadAllowed()) {
+    return
+  }
+
+  // Get clipboard data
+  const clipboardData = event.clipboardData
+  if (!clipboardData) {
+    return
+  }
+
+  // Check whether the clipboard contains files
+  const files = clipboardData.files
+  if (!files || files.length === 0) {
+    return
+  }
+
+  // Prevent default paste to avoid inserting text
+  event.preventDefault()
+
+  // Upload all pasted files
+  await uploadFiles(files)
+}
+
+const isFileDragEvent = (event) => {
+  const types = event?.dataTransfer?.types
+  if (!types) {
+    return false
+  }
+  return Array.from(types).includes('Files')
+}
+
+const handleDragEnter = (event) => {
+  if (!isFileDragEvent(event) || !isAttachmentUploadAllowed()) {
+    return
+  }
+  dragDepth += 1
+  isDragActive.value = true
+  event.preventDefault()
+}
+
+const handleDragOver = (event) => {
+  if (!isFileDragEvent(event) || !isAttachmentUploadAllowed()) {
+    return
+  }
+  event.preventDefault()
+  if (event.dataTransfer) {
+    event.dataTransfer.dropEffect = 'copy'
+  }
+}
+
+const handleDragLeave = (event) => {
+  if (!isFileDragEvent(event)) {
+    return
+  }
+  dragDepth = Math.max(0, dragDepth - 1)
+  if (dragDepth === 0) {
+    isDragActive.value = false
+  }
+}
+
+const handleDrop = async (event) => {
+  if (!isFileDragEvent(event)) {
+    return
+  }
+  event.preventDefault()
+  dragDepth = 0
+  isDragActive.value = false
+
+  if (!isAttachmentUploadAllowed()) {
+    return
+  }
+
+  const files = Array.from(event.dataTransfer?.files || [])
+  if (files.length === 0) {
+    return
+  }
+  await uploadFiles(files)
+}
+
+// Handle YAML file selection
+const handleYAMLSelection = async (fileName) => {
+  if (!fileName) {
+    workflowYaml.value = {}
+    logMessages.value = []
+    setNodes([])
+    setEdges([])
+    nodeSpriteMap.value.clear()
+    return
+  }
+
+  // Clear the log messages
+  logMessages.value = []
+}
+
+// Handle button clicks
+const handleButtonClick = () => {
+  if (status.value === 'Batch completed' || status.value === 'Batch cancelled') {
+    // If Relaunch, restart the same workflow and re-enter Launch state
+    if (!selectedYamlFile.value) {
+      alert('Please choose a workflow file！')
+      return
+    }
+
+    if (!selectedInputFile.value) {
+      alert('Please select an input file (.xlsx or .csv)')
+      return
+    }
+
+    resetConnectionState()
+    status.value = 'Connecting...'
+    handleYAMLSelection(selectedYamlFile.value)
+    establishWebSocketConnection()
+  } else {
+    // If Launch, start the workflow
+    launchBatchWorkflow()
+  }
+}
+
+// Send human input
+const sendHumanInput = () => {
+  if (!ws) {
+    return
+  }
+
+  const trimmedInput = taskPrompt.value.trim()
+  const attachmentIds = uploadedAttachments.value.map((attachment) => attachment.attachmentId)
+  const attachmentNames = uploadedAttachments.value.map(
+    (attachment) => attachment.name || attachment.attachmentId
+  )
+
+  if (!trimmedInput && attachmentIds.length === 0) {
+    return
+  }
+
+  const message = {
+    type: 'human_input',
+    data: {
+      input: trimmedInput,
+      attachments: attachmentIds
+    }
+  }
+
+  clearUploadedAttachments()
+  ws.send(JSON.stringify(message))
+
+  const fullMessage = []
+  if (trimmedInput) {
+    fullMessage.push(trimmedInput)
+  }
+  if (attachmentNames.length) {
+    fullMessage.push(`[[Attachments]]:\n ${attachmentNames.join(', ')}`)
+  }
+
+  if (fullMessage.length) {
+    addDialogue('User', fullMessage.join('\n\n'))
+  }
+
+  taskPrompt.value = ''
+}
+
+// Establish a WebSocket connection
+const establishWebSocketConnection = () => {
+  // Reset any previous state before creating a new socket
+  resetConnectionState()
+
+  if (!selectedYamlFile.value) {
+    return
+  }
+
+  const baseUrl = import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000'
+  const wsProtocol = baseUrl.startsWith('https') ? 'wss:' : 'ws:'
+  const urlObj = new URL(baseUrl)
+  const wsUrl = `${wsProtocol}//${urlObj.host}/ws`
+  const socket = new WebSocket(wsUrl)
+  ws = socket
+
+  socket.onopen = () => {
+    // Ignore events from stale sockets
+    if (ws !== socket) return
+    console.log('WebSocket connected')
+  }
+
+  socket.onmessage = (event) => {
+    // Ignore messages from sockets that are no longer current
+    if (ws !== socket) return
+
+    const msg = JSON.parse(event.data)
+
+    if (msg.type === 'connection') {
+      sessionId = msg.data?.session_id || null
+      console.log('Connected with session: ', sessionId)
+
+      if (!sessionId) {
+        status.value = 'Connection error'
+        alert('Missing session information from server.')
+        resetConnectionState()
+        return
+      }
+
+      isConnectionReady.value = true
+      shouldGlow.value = true
+      status.value = 'Waiting for launch...'
+
+      nextTick(() => {
+        taskInputRef.value?.focus()
+      })
+    } else {
+      processBatchMessage(msg)
+    }
+  }
+
+  socket.onerror = (error) => {
+    // Ignore errors from sockets that are no longer current
+    if (ws !== socket) return
+
+    console.error('WebSocket error:', error)
+    status.value = 'Connection error'
+    alert('WebSocket connection error!')
+    resetConnectionState({ closeSocket: false })
+  }
+
+  socket.onclose = () => {
+    // Ignore close events from sockets that are no longer current
+    if (ws !== socket) return
+
+    console.log('WebSocket closed')
+    if (status.value === 'Running...') {
+      status.value = 'Disconnected'
+    } else if (status.value === 'Connecting...' || status.value === 'Waiting for launch...') {
+      status.value = 'Disconnected'
+    }
+    resetConnectionState({ closeSocket: false, clearInputFile: false })
+  }
+}
+
+// Watch for file selection changes
+watch(selectedYamlFile, (newFile) => {
+  taskPrompt.value = ''
+  fileSearchQuery.value = newFile || ''
+  isFileSearchDirty.value = false
+
+  if (!newFile) {
+    resetConnectionState()
+    status.value = 'Waiting for file selection...'
+    handleYAMLSelection(newFile)
+    return
+  }
+
+  resetConnectionState()
+  status.value = 'Connecting...'
+  handleYAMLSelection(newFile)
+  establishWebSocketConnection()
+})
+
+watch(
+  () => uploadedAttachments.value.length,
+  (length) => {
+    if (!length) {
+      showAttachmentPopover.value = false
+    }
+  }
+)
+
+watch(
+  () => route.query?.workflow,
+  () => {
+    applyWorkflowFromRoute()
+  }
+)
+
+onMounted(() => {
+  document.addEventListener('click', handleClickOutside)
+  document.addEventListener('keydown', handleKeydown)
+  loadWorkflows()
+})
+
+onUnmounted(() => {
+  document.removeEventListener('click', handleClickOutside)
+  document.removeEventListener('keydown', handleKeydown)
+  unlockBodyScroll()
+  resetConnectionState()
+  cleanupRecording()
+})
+
+const { fromObject, fitView, onPaneReady, onNodesInitialized, setNodes, setEdges, edges } = useVueFlow()
+
+// Fit the view after the pane is ready or nodes are initialized
+onPaneReady(() => {
+  requestAnimationFrame(() => fitView?.({ padding: 0.1 }))
+})
+onNodesInitialized(() => {
+  requestAnimationFrame(() => fitView?.({ padding: 0.1 }))
+})
+
+const syncNodeAndEdgeData = () => {
+  try {
+    const yamlNodes = workflowYaml.value?.graph?.nodes || []
+    const yamlEdges = workflowYaml.value?.graph?.edges || []
+
+    const yamlNodeById = new Map(
+      Array.isArray(yamlNodes) ? yamlNodes.map(node => [node.id, node]) : []
+    )
+    const yamlEdgeByKey = new Map(
+      Array.isArray(yamlEdges)
+        ? yamlEdges.map(edge => [`${edge.from}-${edge.to}`, edge])
+        : []
+    )
+
+    setNodes(existingNodes => {
+      if (!Array.isArray(existingNodes)) {
+        return existingNodes
+      }
+      return existingNodes.map(node => {
+        const yamlNode = yamlNodeById.get(node.id)
+        if (yamlNode) {
+          return {
+            ...node,
+            data: yamlNode
+          }
+        }
+        return node
+      })
+    })
+
+    setEdges(existingEdges => {
+      if (!Array.isArray(existingEdges)) {
+        return existingEdges
+      }
+      return existingEdges.map(edge => {
+        const key = `${edge.source}-${edge.target}`
+        const yamlEdge = yamlEdgeByKey.get(key)
+        if (yamlEdge) {
+          return {
+            ...edge,
+            data: yamlEdge,
+            markerEnd: {
+              type: MarkerType.Arrow,
+              width: 18,
+              height: 18,
+              color: '#f2f2f2',
+              strokeWidth: 2,
+            }
+          }
+        }
+        return edge
+      })
+    })
+  } catch (error) {
+    console.error('Failed to sync graph data with YAML:', error)
+  }
+}
+
+const generateNodesAndEdges = async ({ fit = false } = {}) => {
+  try {
+    const yamlNodes = Array.isArray(workflowYaml.value?.graph?.nodes)
+      ? workflowYaml.value.graph.nodes
+      : []
+    const yamlEdges = Array.isArray(workflowYaml.value?.graph?.edges)
+      ? workflowYaml.value.graph.edges
+      : []
+
+    const generatedNodes = yamlNodes.map((node, index) => ({
+      id: node.id,
+      type: 'workflow-node',
+      label: node.id,
+      position: {
+        x: 20 + (index % 5) * 200,
+        y: 10 + Math.floor(index / 5) * 150
+      },
+      data: node
+    }))
+
+    const generatedEdges = yamlEdges.map(edge => ({
+      id: `${edge.from}-${edge.to}`,
+      source: edge.from,
+      target: edge.to,
+      type: 'workflow-edge',
+      markerEnd: {
+        type: MarkerType.Arrow,
+        width: 18,
+        height: 18,
+        color: '#f2f2f2',
+        strokeWidth: 2,
+      },
+      data: edge
+    }))
+
+    setNodes(generatedNodes)
+    setEdges(generatedEdges)
+  } catch (error) {
+    console.error('Error generating nodes and edges from YAML:', error)
+  }
+
+  if (fit && viewMode.value === 'graph') {
+    await nextTick()
+    fitView?.({ padding: 0.1 })
+  }
+}
+
+const loadVueFlowGraph = async ({ fit = false } = {}) => {
+  const selectionSnapshot = selectedYamlFile.value
+  const shouldFit = fit && viewMode.value === 'graph'
+
+  const runFallback = async () => {
+    if (selectedYamlFile.value === selectionSnapshot) {
+      await generateNodesAndEdges({ fit: shouldFit })
+    }
+    return false
+  }
+
+  if (!selectionSnapshot) {
+    return await runFallback()
+  }
+
+  const key = selectionSnapshot.replace(/\.yaml$/i, '')
+  if (!key) {
+    return await runFallback()
+  }
+
+  try {
+    const result = await fetchVueGraph(key)
+
+    if (selectedYamlFile.value !== selectionSnapshot) {
+      return false
+    }
+
+    if (result?.status === 404) {
+      return await runFallback()
+    }
+
+    if (!result?.success) {
+      console.error('Failed to load VueFlow graph:', result?.message || result?.detail)
+      return await runFallback()
+    }
+
+    if (selectedYamlFile.value !== selectionSnapshot) {
+      return false
+    }
+
+    const content = result?.content
+
+    if (!content) {
+      return await runFallback()
+    }
+
+    let flow
+    try {
+      flow = JSON.parse(content)
+    } catch (parseError) {
+      console.error('Failed to parse saved VueFlow graph:', parseError)
+      return await runFallback()
+    }
+
+    fromObject?.(flow)
+    await nextTick()
+
+    if (selectedYamlFile.value !== selectionSnapshot) {
+      return false
+    }
+
+    syncNodeAndEdgeData()
+
+    if (shouldFit) {
+      await nextTick()
+
+      if (selectedYamlFile.value !== selectionSnapshot) {
+        return false
+      }
+
+      fitView?.({ padding: 0.1 })
+    }
+
+    return true
+  } catch (error) {
+    console.error('Failed to load VueFlow graph:', error)
+  }
+
+  return await runFallback()
+}
+
+const switchToGraph = async () => {
+  viewMode.value = 'graph'
+  await nextTick()
+  await loadVueFlowGraph({ fit: true })
+}
+
+const launchBatchWorkflow = async () => {
+  if (!selectedYamlFile.value) {
+    alert('Please choose a workflow file！')
+    return
+  }
+
+  if (!selectedInputFile.value) {
+    alert('Please select an input file (.xlsx or .csv)')
+    return
+  }
+
+  if (
+    !ws ||
+    !isConnectionReady.value ||
+    !sessionId
+  ) {
+    alert('WebSocket connection is not ready yet.')
+    return
+  }
+
+  shouldGlow.value = false
+  status.value = 'Launching...'
+
+  try {
+    const result = await postBatchWorkflow({
+      file: selectedInputFile.value,
+      sessionId: sessionId,
+      yamlFile: selectedYamlFile.value,
+      maxParallel: '',
+      logLevel: ''
+    })
+
+    if (result.success) {
+      console.log('Batch workflow launched: ', result)
+      status.value = 'Running...'
+      isWorkflowRunning.value = true
+    } else {
+      console.error('Failed to launch batch workflow:', result)
+      status.value = 'Failed'
+      alert(`Failed to launch batch workflow: ${result.detail || result.message || 'Unknown error'}`)
+      shouldGlow.value = true
+      if (isConnectionReady.value) {
+        status.value = 'Waiting for launch...'
+      }
+    }
+  } catch (error) {
+    console.error('Error calling batch workflow API:', error)
+    status.value = 'Error'
+    alert(`Failed to call batch workflow API: ${error.message}`)
+    shouldGlow.value = true
+    if (isConnectionReady.value) {
+      status.value = 'Waiting for launch...'
+    }
+  }
+}
+
+// When workflow is finished or cancelled, re-enable glow
+watch(status, (newStatus) => {
+  if (newStatus === 'Batch completed' || newStatus === 'Batch cancelled') {
+    shouldGlow.value = true
+  }
+})
+
+const processBatchMessage = async (msg) => {
+  console.log('Batch Message: ', msg)
+
+  // Batch completed
+  if (msg.type === 'batch_completed') {
+    const message = `Batch processing finished, ${msg.data.succeeded} tasks succeeded, ${msg.data.failed} tasks failed`
+    addLogMessage(message)
+
+    status.value = 'Batch completed'
+    isWorkflowRunning.value = false
+    sessionIdToDownload = sessionId
+  }
+
+  // Handle batch processing messages
+  if (msg.type === 'batch_started') {
+    const message = `Batch processing started with total of ${msg.data.total} rows...`
+    addLogMessage(message)
+  }
+
+  if (msg.type === 'batch_task_started') {
+    const message = `[ID ${msg.data.task_id}, Row ${msg.data.row_index}] launched`
+    addLogMessage(message)
+  }
+
+  if (msg.type === 'batch_task_completed') {
+    const message = `[ID ${msg.data.task_id}, Row ${msg.data.row_index}] completed, ${msg.data.duration_ms}ms spent, total ${msg.data.token_usage.total_usage.total_tokens} tokens used`
+    addLogMessage(message)
+  }
+
+  if (msg.type === 'batch_task_failed') {
+    const message = `[ID ${msg.data.task_id}, Row ${msg.data.row_index}] failed, Error: ${msg.data.error}`
+    addLogMessage(message)
+  }
+}
+
+// Cancel the currently running workflow
+const cancelBatchWorkflow = () => {
+  if (!isWorkflowRunning.value || !ws) {
+    return
+  }
+  addLogMessage('Batch cancelled')
+  status.value = 'Batch cancelled'
+  isWorkflowRunning.value = false
+  sessionIdToDownload = sessionId
+
+  try {
+    ws.close()
+  } catch (closeError) {
+    console.warn('Failed to close WebSocket:', closeError)
+  }
+}
+
+// Download logs
+const downloadLogs = async () => {
+  if (!sessionIdToDownload) {
+    return
+  }
+  try {
+    await fetchLogsZip(sessionIdToDownload)
+  } catch (error) {
+    console.error('Download failed:', error)
+    alert('Download failed, please try again later')
+  }
+}
+
+// Auto-scroll to bottom
+watch(
+  () => logMessages.value.length,
+  async () => {
+    await nextTick()
+    if (logMessagesRef.value) {
+      logMessagesRef.value.scrollTop = logMessagesRef.value.scrollHeight
+    }
+  }
+)
+
+watch(
+  () => logMessages.value.length,
+  async () => {
+    await nextTick()
+    if (logMessagesRef.value) {
+      logMessagesRef.value.scrollTop = logMessagesRef.value.scrollHeight
+    }
+  }
+)
+</script>
+
+<style scoped>
+.launch-view {
+  width: 100%;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background-color: #1a1a1a;
+  color: #f2f2f2;
+  font-family: 'Inter', sans-serif;
+  position: relative;
+  overflow: hidden;
+}
+
+.launch-bg {
+  position: fixed;
+  top: -150px;
+  left: 0;
+  right: 0;
+  height: 500px;
+  background: linear-gradient(
+    90deg,
+    #aaffcd,
+    #99eaf9,
+    #a0c4ff
+  );
+  filter: blur(120px);
+  opacity: 0.15;
+  z-index: 0;
+  pointer-events: none;
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  padding: 0 20px;
+  height: 40px;
+  background-color: rgba(255, 255, 255, 0.05);
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+  backdrop-filter: blur(5px);
+  flex-shrink: 0;
+  position: relative;
+  z-index: 2;
+}
+
+.header h1 {
+  margin: 0;
+  color: #f2f2f2;
+  font-size: 18px;
+  font-weight: 600;
+}
+
+.back-button {
+  padding: 8px;
+  margin-right: 16px;
+  background: transparent;
+  color: rgba(255, 255, 255, 0.6);
+  cursor: pointer;
+  transition: color 0.2s ease;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid transparent;
+  outline: none;
+}
+
+.back-button:hover {
+  color: #f2f2f2;
+}
+
+.content {
+  flex: 1;
+  display: flex;
+  overflow: hidden;
+  padding: 20px;
+  gap: 20px;
+  position: relative;
+  z-index: 1;
+}
+
+/* Left Panel */
+.left-panel {
+  flex: 3;
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  min-width: 0; /* Prevents overflow */
+}
+
+/* Log Box */
+.log-box {
+  flex: 1;
+  background-color: rgba(0, 0, 0, 0.8);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  border-radius: 12px;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  backdrop-filter: blur(5px);
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+}
+
+.log-messages::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+.log-messages::-webkit-scrollbar-track {
+  background: transparent;
+}
+.log-messages::-webkit-scrollbar-thumb {
+  background-color: rgba(160, 160, 160, 0.28);
+  border-radius: 8px;
+  border: 2px solid transparent;
+  background-clip: padding-box;
+}
+.log-messages::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(160, 160, 160, 0.48);
+}
+
+.log-messages {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+  color: #e0e0e0;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  font-size: 13px;
+  line-height: 1.4;
+}
+
+.log-message {
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.log-placeholder {
+  color: rgba(255, 255, 255, 0.4);
+  font-style: italic;
+  text-align: center;
+  margin-top: 20px;
+}
+
+@keyframes slideIn {
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+/* Dialogue Messages */
+.dialogue {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  margin-bottom: 8px;
+}
+
+.dialogue-right {
+  flex-direction: row-reverse;
+}
+
+.message-content {
+  flex: 1;
+  max-width: 85%;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  /* Shrink to fit content */
+  align-items: flex-start;
+}
+
+.dialogue-right .message-content {
+  /* Right-side fit logic */
+  align-items: flex-end;
+}
+
+.user-name {
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.5);
+  font-weight: 500;
+  margin: 0 4px;
+}
+
+.dialogue-right .user-name {
+  text-align: right;
+}
+
+.profile-picture {
+  flex-shrink: 0;
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  overflow: hidden;
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  background: rgba(255, 255, 255, 0.05);
+}
+
+.profile-picture img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: 50% 20%;
+}
+
+.message-bubble {
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 12px;
+  border-top-left-radius: 2px;
+  padding: 0 16px;
+  position: relative;
+  transition: all 0.2s ease;
+}
+
+.dialogue-right .message-bubble {
+  background: linear-gradient(135deg, rgba(160, 196, 255, 0.15), rgba(189, 178, 255, 0.15));
+  border-color: rgba(160, 196, 255, 0.3);
+  border-top-left-radius: 12px;
+  border-top-right-radius: 2px;
+}
+
+.loading-bubble {
+  border-color: #aaffcd;
+  background-color: rgba(255, 255, 255, 0.08);
+  box-shadow: 0 0 12px rgba(153, 234, 249, 0.35);
+  animation: borderPulse 3s ease-in-out infinite alternate;
+  animation: bubbleGlow 3s ease-in-out infinite alternate;
+}
+
+@keyframes bubbleGlow {
+  0% {
+    box-shadow: 0 0 6px rgba(153, 234, 249, 0.35);
+  }
+  50% {
+    box-shadow: 0 0 12px rgba(153, 234, 249, 0.35);
+  }
+}
+
+.loading-timer {
+  margin-left: 8px;
+  margin-bottom: 10px;
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.7);
+}
+
+.loading-entries {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  margin: 10px 0 4px;
+  padding: 2px 0;
+  border-radius: 10px;
+}
+
+.loading-entry {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 10px;
+  border-radius: 10px;
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  position: relative;
+  backdrop-filter: blur(4px);
+}
+
+.loading-entry-label {
+  font-size: 14px;
+  color: rgba(255, 255, 255, 0.9);
+}
+
+.loading-entry-duration {
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.6);
+}
+
+.entry-running {
+  border-color: #aaffcd;
+  box-shadow: 0 0 8px rgba(153, 234, 249, 0.25);
+  animation: loadingEntryPulse 2.6s ease-in-out infinite;
+}
+
+.entry-done {
+  border-color: rgba(255, 255, 255, 0.15);
+  opacity: 0.8;
+}
+
+/* Fade-slide-in animation for entries */
+.loading-entry-enter-active,
+.loading-entry-leave-active {
+  transition: all 0.22s ease-out;
+}
+
+.loading-entry-enter-from,
+.loading-entry-leave-to {
+  opacity: 0;
+  transform: translateY(4px);
+}
+
+.loading-entry-enter-to,
+.loading-entry-leave-from {
+  opacity: 1;
+  transform: translateY(0);
+}
+
+@keyframes loadingEntryPulse {
+  0% {
+    box-shadow: 0 0 4px rgba(153, 234, 249, 0.18);
+    border-color: rgba(153, 234, 249, 0.6);
+    background: rgba(255, 255, 255, 0.06);
+  }
+  50% {
+    box-shadow: 0 0 10px rgba(153, 234, 249, 0.38);
+    border-color: rgba(170, 255, 205, 0.9);
+    background: rgba(255, 255, 255, 0.09);
+  }
+  100% {
+    box-shadow: 0 0 4px rgba(153, 234, 249, 0.18);
+    border-color: rgba(153, 234, 249, 0.6);
+    background: rgba(255, 255, 255, 0.06);
+  }
+}
+
+.message-text {
+  color: #f2f2f2;
+  font-size: 14px;
+  line-height: 1.5;
+  word-wrap: break-word;
+  white-space: pre-wrap;
+}
+
+/* Artifact wrappers */
+.artifact-image-wrapper {
+  padding: 10px 0;
+}
+
+.artifact-file-wrapper {
+  padding: 10px 0;
+}
+
+.artifact-image {
+  max-width: 260px;
+  max-height: 200px;
+  display: block;
+  cursor: zoom-in;
+  border-radius: 6px;
+  padding: 0 0 10px 0;
+}
+
+.artifact-filename {
+  margin-top: 4px;
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.7);
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.artifact-filename-icon {
+  width: 18px;
+  height: 18px;
+  border-radius: 3px;
+  object-fit: cover;
+  flex-shrink: 0;
+}
+
+.artifact-filename-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.artifact-download-button {
+  margin-top: 15px;
+  padding: 4px 10px;
+  border-radius: 10px;
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  background: rgba(255, 255, 255, 0.06);
+  color: #f2f2f2;
+  font-size: 12px;
+  cursor: pointer;
+  transition: all 0.15s ease;
+}
+
+.artifact-download-button:hover:not(:disabled) {
+  background: rgba(255, 255, 255, 0.12);
+}
+
+.artifact-download-button:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.artifact-status {
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.6);
+}
+
+.artifact-status.artifact-error {
+  color: #ff8080;
+}
+
+
+.microphone-button {
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  background: rgba(255, 255, 255, 0.05);
+  color: rgba(255, 255, 255, 0.8);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.2s ease;
+  padding: 0;
+  outline: none;
+  position: relative;
+}
+
+.microphone-button:hover:not(:disabled) {
+  background: rgba(255, 255, 255, 0.1);
+  border-color: rgba(255, 255, 255, 0.4);
+  color: #f2f2f2;
+}
+
+.microphone-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.microphone-button.recording {
+  background: rgba(255, 255, 255, 0.1);
+  border-color: #aaffcd;
+  color: #f2f2f2;
+}
+
+.microphone-button.pulsating {
+  animation: microphonePulse 2s ease-in-out infinite;
+}
+
+@keyframes microphonePulse {
+  0% {
+    box-shadow:
+      0 0 0 0 rgba(170, 255, 205, 0.7),
+      0 0 0 0 rgba(153, 234, 249, 0.5);
+    border-color: #aaffcd;
+  }
+  50% {
+    box-shadow:
+      0 0 0 12px rgba(170, 255, 205, 0),
+      0 0 0 6px rgba(153, 234, 249, 0.3);
+    border-color: #99eaf9;
+  }
+  100% {
+    box-shadow:
+      0 0 0 24px rgba(170, 255, 205, 0),
+      0 0 0 18px rgba(153, 234, 249, 0);
+    border-color: #aaffcd;
+  }
+}
+
+.attachment-upload {
+  position: relative;
+}
+
+.attachment-button-wrapper {
+  position: relative;
+  display: inline-block;
+}
+
+.attachment-button {
+  padding: 6px 16px;
+  border-radius: 20px;
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  background: rgba(255, 255, 255, 0.05);
+  color: rgba(255, 255, 255, 0.8);
+  cursor: pointer;
+  font-size: 12px;
+  font-weight: 500;
+  transition: all 0.2s ease;
+}
+
+.attachment-button:hover:not(:disabled) {
+  background: rgba(255, 255, 255, 0.1);
+  border-color: rgba(255, 255, 255, 0.4);
+  color: #f2f2f2;
+}
+
+.attachment-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.hidden-file-input {
+  display: none;
+}
+
+.attachment-count {
+  position: absolute;
+  top: -8px;
+  right: -6px;
+  background: #99eaf9;
+  color: #1a1a1a;
+  font-size: 10px;
+  font-weight: 700;
+  padding: 2px 6px;
+  border-radius: 10px;
+}
+
+/* Input File Selection */
+.input-file-section {
+  margin-bottom: 16px;
+}
+
+.file-upload-wrapper {
+  position: relative;
+}
+
+.file-upload-button {
+  width: 100%;
+  padding: 10px 12px;
+  background-color: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 8px;
+  color: rgba(255, 255, 255, 0.6);
+  font-size: 13px;
+  font-weight: 400;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  text-align: left;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-upload-button:hover:not(:disabled) {
+  background-color: rgba(255, 255, 255, 0.08);
+  border-color: rgba(255, 255, 255, 0.2);
+}
+
+.file-upload-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* Input Manual */
+.input-manual {
+  margin-bottom: 16px;
+}
+
+.manual-title {
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: rgba(255, 255, 255, 0.4);
+  font-weight: 600;
+  margin-bottom: 8px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  transition: color 0.2s ease;
+}
+
+.manual-title:hover {
+  color: rgba(255, 255, 255, 0.6);
+}
+
+.info-icon {
+  opacity: 0.6;
+  transition: opacity 0.2s ease;
+}
+
+.manual-title:hover .info-icon {
+  opacity: 0.8;
+}
+
+.manual-content {
+  background-color: rgba(255, 255, 255, 0.02);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-radius: 8px;
+  padding: 12px;
+  font-size: 13px;
+  line-height: 1.4;
+}
+
+.manual-item {
+  margin-bottom: 8px;
+  color: rgba(255, 255, 255, 0.7);
+}
+
+.manual-item:last-child {
+  margin-bottom: 0;
+}
+
+.manual-item code {
+  background-color: rgba(255, 255, 255, 0.1);
+  padding: 2px 6px;
+  border-radius: 4px;
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+  font-size: 12px;
+  color: #a0c4ff;
+  font-weight: 500;
+}
+
+.manual-example {
+  margin-top: 6px;
+  margin-left: 16px;
+}
+
+.manual-example pre {
+  background-color: rgba(0, 0, 0, 0.3);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 6px;
+  padding: 8px;
+  font-size: 11px;
+  color: rgba(255, 255, 255, 0.8);
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+  overflow-x: auto;
+  margin: 4px 0 0 0;
+}
+
+.file-info-text {
+  font-size: 13px;
+  color: rgba(255, 255, 255, 0.8);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  flex: 1;
+}
+
+.remove-file-button {
+  background: transparent;
+  border: none;
+  color: #99eaf9;
+  cursor: pointer;
+  padding: 0 6px;
+  font-size: 16px;
+  line-height: 1;
+  margin-left: 8px;
+  border-radius: 3px;
+  transition: background-color 0.2s;
+}
+
+.remove-file-button:hover {
+  background: rgba(153, 234, 249, 0.1);
+}
+
+/* Attachment Modal */
+.attachment-modal {
+  position: absolute;
+  right: 0;
+  bottom: calc(100% + 10px);
+  width: 240px;
+  background: #252525;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 8px;
+  padding: 8px;
+  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  z-index: 10;
+}
+
+.attachment-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 10px;
+  background: rgba(255, 255, 255, 0.05);
+  border-radius: 4px;
+}
+
+.attachment-name {
+  font-size: 12px;
+  color: #e0e0e0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.remove-attachment {
+  border: none;
+  background: transparent;
+  color: #99eaf9;
+  cursor: pointer;
+  padding: 0 4px;
+}
+
+/* Right Panel */
+.right-panel {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  min-width: 250px;
+}
+
+.control-section {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  background-color: rgba(255, 255, 255, 0.03);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 12px;
+  padding: 20px;
+  backdrop-filter: blur(5px);
+}
+
+.section-label {
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: rgba(255, 255, 255, 0.4);
+  font-weight: 600;
+  margin-top: 4px;
+}
+
+/* Custom Select */
+.select-wrapper {
+  position: relative;
+}
+
+.custom-file-selector {
+  position: relative;
+}
+
+.file-selector,
+.file-selector-input {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 10px 12px;
+  padding-right: 30px;
+  background-color: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 8px;
+  color: #f2f2f2;
+  font-size: 14px;
+  appearance: none;
+  color: #f2f2f2;
+}
+
+.file-selector-input {
+  cursor: text;
+}
+
+.file-selector:hover:not(:disabled),
+.file-selector-input:hover:not(:disabled),
+.file-selector-input:focus {
+  background-color: rgba(255, 255, 255, 0.08);
+  border-color: rgba(255, 255, 255, 0.2);
+}
+
+.file-selector:disabled,
+.file-selector-input:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.select-arrow {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: rgba(255, 255, 255, 0.3);
+  pointer-events: none;
+  font-size: 10px;
+}
+
+.file-dropdown {
+  position: absolute;
+  top: calc(100%);
+  left: 0;
+  right: 0;
+  margin-top: 1px;
+  background-color: #252525;
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  border-radius: 8px;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.45);
+  max-height: 260px;
+  overflow-y: auto;
+  z-index: 5;
+  padding: 6px 0;
+}
+
+.file-dropdown::-webkit-scrollbar {
+  display: none;
+}
+
+.file-option {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 8px 14px;
+  cursor: pointer;
+  transition: background 0.15s ease;
+}
+
+.file-option:hover {
+  background: rgba(255, 255, 255, 0.06);
+}
+
+.file-name {
+  color: #f2f2f2;
+  font-size: 12px;
+  font-weight: 500;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-desc {
+  color: rgba(255, 255, 255, 0.5);
+  font-size: 11px;
+}
+
+.file-empty {
+  padding: 12px 14px;
+  color: rgba(255, 255, 255, 0.4);
+  font-size: 13px;
+  text-align: center;
+}
+
+.file-dropdown-enter-active,
+.file-dropdown-leave-active {
+  transition: opacity 0.15s ease, transform 0.15s ease;
+}
+
+.file-dropdown-enter-from,
+.file-dropdown-leave-to {
+  opacity: 0;
+  transform: translateY(-4px);
+}
+
+/* Status Display */
+.status-display {
+  padding: 10px;
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 8px;
+  color: rgba(255, 255, 255, 0.6);
+  font-size: 13px;
+  text-align: center;
+  transition: all 0.3s ease;
+  font-weight: 500;
+}
+
+.status-active {
+  color: #a0c4ff;
+  background: rgba(160, 196, 255, 0.1);
+}
+
+
+/* Active Nodes */
+.active-nodes-display {
+  flex: 1;
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 8px;
+  padding: 10px;
+  overflow-y: auto;
+  min-height: 100px;
+}
+
+.no-active-nodes {
+  color: rgba(255, 255, 255, 0.3);
+  font-size: 13px;
+  text-align: center;
+  margin-top: 10px;
+}
+
+.active-node-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 8px;
+  margin-bottom: 4px;
+  background: rgba(255, 255, 255, 0.05);
+  border-radius: 4px;
+  font-size: 13px;
+}
+
+.node-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background-color: #99eaf9;
+  box-shadow: 0 0 6px #99eaf9;
+}
+
+/* Button Section */
+.button-section {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.cancel-button {
+  padding: 12px 14px;
+  border-radius: 12px;
+  border: none;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 600;
+  color: #1a1a1a;
+  background: linear-gradient(
+    135deg,
+    #e07152,
+    #dc5d4c,
+    #bd4a4a
+  );
+  background-size: 200% 100%;
+  animation: gradientShift 6s ease-in-out infinite;
+  transition: all 0.3s ease;
+  position: relative;
+  overflow: hidden;
+}
+
+.cancel-button:hover:not(:disabled) {
+  transform: translateY(-2px);
+  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
+}
+
+.cancel-button:disabled {
+  background: #3a3a3a;
+  color: rgba(255, 255, 255, 0.3);
+  cursor: not-allowed;
+}
+
+.launch-button {
+  padding: 14px;
+  border: none;
+  border-radius: 12px;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 600;
+  color: #1a1a1a;
+  background: linear-gradient(
+        135deg,
+    #aaffcd,
+    #99eaf9,
+    #a0c4ff
+  );
+  background-size: 200% 100%;
+  animation: gradientShift 6s ease-in-out infinite;
+  transition: all 0.3s ease;
+  position: relative;
+  overflow: hidden;
+}
+
+.launch-button:hover:not(:disabled) {
+  transform: translateY(-2px);
+  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
+}
+
+.launch-button:disabled {
+  background: #3a3a3a;
+  color: rgba(255, 255, 255, 0.3);
+  cursor: not-allowed;
+}
+
+.launch-button.glow {
+  animation: glowPulse 3s ease-in-out infinite, gradientShift 6s ease-in-out infinite;
+}
+
+/* Markdown Styles moved to CollapsibleMessage.vue */
+
+@keyframes gradientShift {
+  0%, 100% { background-position: 0% 0%; }
+  50% { background-position: 100% 0%; }
+}
+
+@keyframes glowPulse {
+  0% { box-shadow: 0 0 0 0 rgba(160, 196, 255, 0.4); }
+  50% { box-shadow: 0 0 0 5px rgba(153, 234, 249, 0); }
+  100% { box-shadow: 0 0 0 0 rgba(160, 196, 255, 0); }
+}
+
+.download-button {
+  padding: 12px;
+  background: rgba(255, 255, 255, 0.03);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 12px;
+  color: #f2f2f2;
+  cursor: pointer;
+  font-size: 14px;
+  transition: all 0.2s ease;
+}
+
+.download-button:hover:not(:disabled) {
+  background: rgba(255, 255, 255, 0.08);
+  border-color: rgba(255, 255, 255, 0.2);
+  transform: translateY(-1px);
+}
+
+.download-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+
+.image-modal {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.8);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  backdrop-filter: blur(2px);
+}
+
+.image-modal-content {
+  position: relative;
+  max-width: 95vw;
+  max-height: 95vh;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  align-items: center;
+  background: rgba(26, 26, 26, 0.9);
+  padding: 20px;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+.image-modal-content img {
+  max-width: 70vw;
+  max-height: 65vh;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
+}
+
+.image-modal-enter-active,
+.image-modal-leave-active {
+  transition: opacity 0.2s ease;
+}
+
+.image-modal-enter-from,
+.image-modal-leave-to {
+  opacity: 0;
+}
+
+.header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0 20px;
+}
+
+.settings-button {
+  background: transparent;
+  border: none;
+  color: #a0c4ff;
+  cursor: pointer;
+  padding: 8px;
+  border-radius: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: background-color 0.2s;
+}
+
+.settings-button:hover {
+  background-color: rgba(160, 196, 255, 0.1);
+}
+
+/* Column Guide Modal */
+.column-guide-modal-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  backdrop-filter: blur(2px);
+}
+
+.column-guide-modal {
+  background: #252525;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 12px;
+  max-width: 500px;
+  width: 90vw;
+  max-height: 80vh;
+  overflow: hidden;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
+}
+
+.modal-content {
+  padding: 24px;
+  max-height: calc(80vh - 48px);
+  overflow-y: auto;
+}
+
+/* Modal animations */
+.modal-enter-active,
+.modal-leave-active {
+  transition: opacity 0.2s ease, transform 0.2s ease;
+}
+
+.modal-enter-from,
+.modal-leave-to {
+  opacity: 0;
+  transform: scale(0.95);
+}
+</style>
diff --git a/frontend/src/router/index.js b/frontend/src/router/index.js
index cd33c8b5..c3fc84bc 100755
--- a/frontend/src/router/index.js
+++ b/frontend/src/router/index.js
@@ -13,6 +13,10 @@ const routes = [
         path: '/launch',
         component: () => import('../pages/LaunchView.vue')
     },
+    {
+        path: '/batch-run',
+        component: () => import('../pages/BatchRunView.vue')
+    },
     {
         path: '/workflows/:name?',
         component: () => import('../pages/WorkflowWorkbench.vue')
diff --git a/frontend/src/utils/apiFunctions.js b/frontend/src/utils/apiFunctions.js
index ea2154b7..c1ba9a1f 100755
--- a/frontend/src/utils/apiFunctions.js
+++ b/frontend/src/utils/apiFunctions.js
@@ -424,6 +424,58 @@ export async function getAttachment(sessionId, attachmentId) {
   }
 }
 
+// Batch workflow execution
+export async function postBatchWorkflow({ file, sessionId, yamlFile, maxParallel, logLevel }) {
+  try {
+    const formData = new FormData()
+
+    // Append required parameters
+    if (file) {
+      formData.append('file', file)
+    }
+    if (sessionId) {
+      formData.append('session_id', sessionId)
+    }
+    if (yamlFile) {
+      formData.append('yaml_file', yamlFile)
+    }
+    if (maxParallel !== undefined) {
+      formData.append('max_parallel', maxParallel.toString())
+    }
+    if (logLevel) {
+      formData.append('log_level', logLevel)
+    }
+
+    const response = await fetch(apiUrl('/api/workflows/batch'), {
+      method: 'POST',
+      body: formData
+    })
+
+    const data = await response.json().catch(() => ({}))
+
+    if (response.ok) {
+      return {
+        success: true,
+        message: data?.message || 'Batch workflow executed successfully',
+        ...data
+      }
+    }
+
+    return {
+      success: false,
+      detail: data?.detail,
+      message: data?.message || 'Failed to execute batch workflow',
+      status: response.status
+    }
+  } catch (error) {
+    console.error('Error executing batch workflow:', error)
+    return {
+      success: false,
+      message: 'API error'
+    }
+  }
+}
+
 // Upload a binary file
 export async function postFile(sessionId, file) {
   try {

From 5267d7cdc46a6e4e913a15db0a530c3ca051333f Mon Sep 17 00:00:00 2001
From: swugi <hoofangy3@gmail.com>
Date: Thu, 15 Jan 2026 00:35:23 +0800
Subject: [PATCH 5/6] add:dashboard/terminal toggle

---
 frontend/src/pages/BatchRunView.vue | 865 +++++++++++++---------------
 frontend/src/pages/LaunchView.vue   |   3 +
 2 files changed, 408 insertions(+), 460 deletions(-)

diff --git a/frontend/src/pages/BatchRunView.vue b/frontend/src/pages/BatchRunView.vue
index 033ef622..251e0eba 100644
--- a/frontend/src/pages/BatchRunView.vue
+++ b/frontend/src/pages/BatchRunView.vue
@@ -14,16 +14,50 @@
       <!-- Left panel -->
       <div class="left-panel">
         <!-- Log area -->
-        <div class="log-box">
+        <div v-if="viewMode === 'terminal'" class="log-box">
           <div class="log-messages" ref="logMessagesRef">
             <div v-for="(logMessage, index) in logMessages" :key="index" class="log-message">
-              {{ logMessage }}
+              <span :class="`log-timestamp log-timestamp-${logMessage.type}`">{{ logMessage.timestamp }}</span> : {{ logMessage.message }}
             </div>
             <div v-if="logMessages.length === 0" class="log-placeholder">
               Batch processing logs will appear here...
             </div>
           </div>
         </div>
+
+        <!-- Dashboard area -->
+        <div v-if="viewMode === 'dashboard'" class="dashboard-box">
+          <div class="dashboard-content">
+            <!-- Metrics Grid -->
+            <div class="metrics-grid">
+              <div class="metric-card" :class="{ 'status-active': status === 'In Progress' }">
+                <div class="metric-title">Rows Completed</div>
+                <div class="metric-value">{{ completedRows }}</div>
+              </div>
+              <div class="metric-card" :class="{ 'status-active': status === 'In Progress' }">
+                <div class="metric-title">Total Time</div>
+                <div class="metric-value">{{ totalTime }}</div>
+              </div>
+              <div class="metric-card" :class="{ 'status-active': status === 'In Progress' }">
+                <div class="metric-title">Success Rate</div>
+                <div class="metric-value">{{ successRate }}</div>
+              </div>
+              <div class="metric-card" :class="{ 'status-active': status === 'In Progress' }">
+                <div class="metric-title">Current Status</div>
+                <div class="metric-value" :class="{ 'status-active': status === 'In Progress' }">{{ computedStatus }}</div>
+              </div>
+            </div>
+
+            <!-- Progress Bar -->
+            <div class="progress-section">
+              <div class="progress-label">Overall Progress</div>
+              <div class="progress-bar" :style="{ '--process-width': progressPercentage + '%'}">
+                <div class="progress-fill" :class="{ 'processing': status === 'In Progress' }" :style="{ width: progressPercentage + '%' }"></div>
+              </div>
+              <div class="progress-text">{{ progressPercentage }}%</div>
+            </div>
+          </div>
+        </div>
       </div>
 
       <!-- Right panel -->
@@ -108,12 +142,26 @@
             </div>
           </div>
 
-          <label class="section-label">Status</label>
-          <div class="status-display" :class="{ 'status-active': status === 'Running...' }">
-            {{ computedStatus }}
+          <label class="section-label">View</label>
+          <div class="view-toggle">
+            <button
+              class="toggle-button"
+              :class="{ active: viewMode === 'dashboard' }"
+              @click="switchToDashboard"
+            >
+              Dashboard
+            </button>
+            <button
+              class="toggle-button"
+              :class="{ active: viewMode === 'terminal' }"
+              @click="viewMode = 'terminal'"
+            >
+              Terminal
+            </button>
           </div>
 
 
+
           <!-- Button area -->
           <div class="button-section">
             <button
@@ -126,7 +174,7 @@
 
             <button
               class="cancel-button"
-              :disabled="status !== 'Running...'"
+              :disabled="status !== 'In Progress'"
               @click="cancelBatchWorkflow"
             >
               Cancel
@@ -176,6 +224,9 @@
       <div class="column-guide-modal">
         <div class="modal-content">
           <div class="manual-content">
+            <div class="manual-item">
+              Input file should contain at least <code>task</code> and/or <code>attachments</code> columns
+            </div>
             <div class="manual-item">
               <code>id</code> - Must be unique, auto-generated if column not found
             </div>
@@ -259,6 +310,13 @@ const route = useRoute()
 const logMessages = ref([])
 const logMessagesRef = ref(null)
 
+// Log message types
+const LOG_TYPES = {
+  COMPLETED: 'completed',
+  FAILED: 'failed',
+  DEFAULT: 'default'
+}
+
 // Task input state
 const taskPrompt = ref('')
 
@@ -272,15 +330,15 @@ const fileSelectorWrapperRef = ref(null)
 const fileSelectorInputRef = ref(null)
 
 // Status state
-const status = ref('Waiting for workflow selection...')
+const status = ref('Idle')
 const loading = ref(false)
 
 // Computed status from workflow and input file selection
 const computedStatus = computed(() => {
   if (loading.value) return 'Loading...'
-  if (status.value === 'Waiting for workflow selection...') return status.value
-  if (!selectedYamlFile.value) return 'Waiting for workflow selection...'
-  if (!selectedInputFile.value) return 'Waiting for file selection...'
+  if (status.value === 'Pending workflow selection') return status.value
+  if (!selectedYamlFile.value) return 'Pending workflow selection'
+  if (!selectedInputFile.value) return 'Pending file selection'
   return status.value
 })
 
@@ -315,7 +373,64 @@ const showSettingsModal = ref(false)
 const showColumnGuideModal = ref(false)
 
 // View mode
-const viewMode = ref('chat')
+const viewMode = ref('dashboard')
+
+// Dashboard metrics
+const totalRowsCount = ref(0)
+const completedRowsCount = ref(0)
+const successfulTasks = ref(0)
+const failedTasks = ref(0)
+const batchStartTime = ref(null)
+const batchEndTime = ref(null)
+
+// Timer update interval
+let timerInterval = null
+const currentTime = ref(Date.now())
+
+// Timer functions
+const startTimer = () => {
+  if (timerInterval) return
+  timerInterval = setInterval(() => {
+    currentTime.value = Date.now()
+  }, 10) // Update every 10ms
+}
+
+const stopTimer = () => {
+  if (timerInterval) {
+    clearInterval(timerInterval)
+    timerInterval = null
+  }
+}
+
+const completedRows = computed(() => {
+  if (totalRowsCount.value === 0) return '-'
+  return `${completedRowsCount.value}/${totalRowsCount.value}`
+})
+
+const totalTime = computed(() => {
+  if (!batchStartTime.value) return '00:00:00:00'
+
+  const endTime = batchEndTime.value || currentTime.value
+  const duration = endTime - batchStartTime.value
+  const hours = Math.floor(duration / (1000 * 60 * 60))
+  const minutes = Math.floor((duration % (1000 * 60 * 60)) / (1000 * 60))
+  const seconds = Math.floor((duration % (1000 * 60)) / 1000)
+  const centiseconds = Math.floor((duration % 1000) / 10)
+
+  return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}:${centiseconds.toString().padStart(2, '0')}`
+})
+
+const successRate = computed(() => {
+  const totalProcessed = successfulTasks.value + failedTasks.value
+  if (totalProcessed === 0) return '0%'
+  const rate = (successfulTasks.value / totalProcessed) * 100
+  return `${Math.round(rate)}%`
+})
+
+const progressPercentage = computed(() => {
+  if (totalRowsCount.value === 0) return 0
+  return Math.round((completedRowsCount.value / totalRowsCount.value) * 100)
+})
 
 // WebSocket reference
 let ws = null
@@ -375,7 +490,18 @@ const resetConnectionState = ({ closeSocket = true, clearInputFile = true } = {}
   isConnectionReady.value = false
   shouldGlow.value = false
   isWorkflowRunning.value = false
-  activeNodes.value = []
+
+  // Stop the timer
+  stopTimer()
+
+  // Reset metrics
+  totalRowsCount.value = 0
+  completedRowsCount.value = 0
+  successfulTasks.value = 0
+  failedTasks.value = 0
+  batchStartTime.value = null
+  batchEndTime.value = null
+
   if (attachmentHoverTimeout) {
     clearTimeout(attachmentHoverTimeout)
     attachmentHoverTimeout = null
@@ -389,18 +515,6 @@ const resetConnectionState = ({ closeSocket = true, clearInputFile = true } = {}
 // Button state management
 const isWorkflowRunning = ref(false)
 
-// Active node list
-const activeNodes = ref([])
-// Hovered node id for highlighting related edges
-const hoveredNodeId = ref(null)
-
-const onNodeHover = (nodeId) => {
-  hoveredNodeId.value = nodeId || null
-}
-const onNodeLeave = (_nodeId) => {
-  hoveredNodeId.value = null
-}
-
 // Current workflow YAML content
 const workflowYaml = ref({})
 
@@ -480,6 +594,9 @@ const selectWorkflow = (fileName) => {
   isFileSearchDirty.value = false
   closeFileDropdown()
 
+  // Avoid focusing on element after selection
+  fileSelectorInputRef.value?.blur()
+
   router.push({
     query: {
       ...route.query,
@@ -520,65 +637,13 @@ const handleClickOutside = (event) => {
 }
 
 // Add a log entry
-const addLogMessage = (message) => {
+const addLogMessage = (message, type = LOG_TYPES.DEFAULT) => {
   const timestamp = formatLogTimestamp(Date.now())
-  logMessages.value.push(`${timestamp} : ${message}`)
-}
-
-const isAttachmentUploadAllowed = () => {
-  if (!isConnectionReady.value || !sessionId || isUploadingAttachment.value) {
-    return false
-  }
-  if (isWorkflowRunning.value && status.value !== 'Waiting for input...') {
-    return false
-  }
-  return true
-}
-
-const uploadFiles = async (files) => {
-  if (!files || files.length === 0) {
-    return
-  }
-
-  if (!sessionId) {
-    alert('Session is not ready yet. Please wait for connection.')
-    return
-  }
-
-  isUploadingAttachment.value = true
-  try {
-    for (const file of files) {
-      try {
-        const result = await postFile(sessionId, file)
-
-        if (result?.success && result?.attachmentId) {
-          console.log('File uploaded successfully:', result)
-          uploadedAttachments.value.push(result)
-        } else {
-          console.error('File upload failed:', result)
-          alert(result?.message || 'Failed to upload file')
-        }
-      } catch (error) {
-        console.error('Failed to upload attachment:', error)
-        alert('File upload failed, please try again.')
-      }
-    }
-  } finally {
-    isUploadingAttachment.value = false
-  }
-}
-
-const onAttachmentSelected = async (event) => {
-  const file = event.target?.files?.[0]
-  if (event.target) {
-    event.target.value = ''
-  }
-
-  if (!file) {
-    return
-  }
-
-  await uploadFiles([file])
+  logMessages.value.push({
+    timestamp,
+    message,
+    type
+  })
 }
 
 const removeAttachment = (attachmentId) => {
@@ -736,6 +801,7 @@ const handleMicrophoneMouseLeave = (event) => {
   // This allows recording to continue if user drags outside button
 }
 
+// Cleans up stored recorded audios
 const cleanupRecording = () => {
   removeGlobalListeners()
   if (audioStream) {
@@ -747,29 +813,6 @@ const cleanupRecording = () => {
   isRecording.value = false
 }
 
-const handleAttachmentHover = (isHovering) => {
-  if (isHovering) {
-    if (attachmentHoverTimeout) {
-      clearTimeout(attachmentHoverTimeout)
-      attachmentHoverTimeout = null
-    }
-
-    if (uploadedAttachments.value.length > 0) {
-      showAttachmentPopover.value = true
-    }
-    return
-  }
-
-  if (attachmentHoverTimeout) {
-    clearTimeout(attachmentHoverTimeout)
-  }
-
-  attachmentHoverTimeout = setTimeout(() => {
-    showAttachmentPopover.value = false
-    attachmentHoverTimeout = null
-  }, 140)
-}
-
 const lockBodyScroll = () => {
   if (typeof document !== 'undefined') {
     document.body.style.overflow = 'hidden'
@@ -811,88 +854,6 @@ const handleKeydown = (event) => {
   }
 }
 
-// Handle paste events, including file uploads
-const handlePaste = async (event) => {
-  // Check if upload is allowed
-  if (!isAttachmentUploadAllowed()) {
-    return
-  }
-
-  // Get clipboard data
-  const clipboardData = event.clipboardData
-  if (!clipboardData) {
-    return
-  }
-
-  // Check whether the clipboard contains files
-  const files = clipboardData.files
-  if (!files || files.length === 0) {
-    return
-  }
-
-  // Prevent default paste to avoid inserting text
-  event.preventDefault()
-
-  // Upload all pasted files
-  await uploadFiles(files)
-}
-
-const isFileDragEvent = (event) => {
-  const types = event?.dataTransfer?.types
-  if (!types) {
-    return false
-  }
-  return Array.from(types).includes('Files')
-}
-
-const handleDragEnter = (event) => {
-  if (!isFileDragEvent(event) || !isAttachmentUploadAllowed()) {
-    return
-  }
-  dragDepth += 1
-  isDragActive.value = true
-  event.preventDefault()
-}
-
-const handleDragOver = (event) => {
-  if (!isFileDragEvent(event) || !isAttachmentUploadAllowed()) {
-    return
-  }
-  event.preventDefault()
-  if (event.dataTransfer) {
-    event.dataTransfer.dropEffect = 'copy'
-  }
-}
-
-const handleDragLeave = (event) => {
-  if (!isFileDragEvent(event)) {
-    return
-  }
-  dragDepth = Math.max(0, dragDepth - 1)
-  if (dragDepth === 0) {
-    isDragActive.value = false
-  }
-}
-
-const handleDrop = async (event) => {
-  if (!isFileDragEvent(event)) {
-    return
-  }
-  event.preventDefault()
-  dragDepth = 0
-  isDragActive.value = false
-
-  if (!isAttachmentUploadAllowed()) {
-    return
-  }
-
-  const files = Array.from(event.dataTransfer?.files || [])
-  if (files.length === 0) {
-    return
-  }
-  await uploadFiles(files)
-}
-
 // Handle YAML file selection
 const handleYAMLSelection = async (fileName) => {
   if (!fileName) {
@@ -901,6 +862,15 @@ const handleYAMLSelection = async (fileName) => {
     setNodes([])
     setEdges([])
     nodeSpriteMap.value.clear()
+
+    // Reset metrics
+    totalRowsCount.value = 0
+    completedRowsCount.value = 0
+    successfulTasks.value = 0
+    failedTasks.value = 0
+    batchStartTime.value = null
+    batchEndTime.value = null
+
     return
   }
 
@@ -932,48 +902,6 @@ const handleButtonClick = () => {
   }
 }
 
-// Send human input
-const sendHumanInput = () => {
-  if (!ws) {
-    return
-  }
-
-  const trimmedInput = taskPrompt.value.trim()
-  const attachmentIds = uploadedAttachments.value.map((attachment) => attachment.attachmentId)
-  const attachmentNames = uploadedAttachments.value.map(
-    (attachment) => attachment.name || attachment.attachmentId
-  )
-
-  if (!trimmedInput && attachmentIds.length === 0) {
-    return
-  }
-
-  const message = {
-    type: 'human_input',
-    data: {
-      input: trimmedInput,
-      attachments: attachmentIds
-    }
-  }
-
-  clearUploadedAttachments()
-  ws.send(JSON.stringify(message))
-
-  const fullMessage = []
-  if (trimmedInput) {
-    fullMessage.push(trimmedInput)
-  }
-  if (attachmentNames.length) {
-    fullMessage.push(`[[Attachments]]:\n ${attachmentNames.join(', ')}`)
-  }
-
-  if (fullMessage.length) {
-    addDialogue('User', fullMessage.join('\n\n'))
-  }
-
-  taskPrompt.value = ''
-}
-
 // Establish a WebSocket connection
 const establishWebSocketConnection = () => {
   // Reset any previous state before creating a new socket
@@ -990,8 +918,8 @@ const establishWebSocketConnection = () => {
   const socket = new WebSocket(wsUrl)
   ws = socket
 
+  // Ignore events from stale sockets
   socket.onopen = () => {
-    // Ignore events from stale sockets
     if (ws !== socket) return
     console.log('WebSocket connected')
   }
@@ -1015,7 +943,7 @@ const establishWebSocketConnection = () => {
 
       isConnectionReady.value = true
       shouldGlow.value = true
-      status.value = 'Waiting for launch...'
+      status.value = 'Pending launch'
 
       nextTick(() => {
         taskInputRef.value?.focus()
@@ -1025,8 +953,8 @@ const establishWebSocketConnection = () => {
     }
   }
 
+  // Ignore errors from sockets that are no longer current
   socket.onerror = (error) => {
-    // Ignore errors from sockets that are no longer current
     if (ws !== socket) return
 
     console.error('WebSocket error:', error)
@@ -1040,9 +968,9 @@ const establishWebSocketConnection = () => {
     if (ws !== socket) return
 
     console.log('WebSocket closed')
-    if (status.value === 'Running...') {
+    if (status.value === 'In Progress') {
       status.value = 'Disconnected'
-    } else if (status.value === 'Connecting...' || status.value === 'Waiting for launch...') {
+    } else if (status.value === 'Connecting...' || status.value === 'Pending launch') {
       status.value = 'Disconnected'
     }
     resetConnectionState({ closeSocket: false, clearInputFile: false })
@@ -1057,7 +985,7 @@ watch(selectedYamlFile, (newFile) => {
 
   if (!newFile) {
     resetConnectionState()
-    status.value = 'Waiting for file selection...'
+    status.value = 'Pending file selection'
     handleYAMLSelection(newFile)
     return
   }
@@ -1077,6 +1005,7 @@ watch(
   }
 )
 
+// When called from Launch in WorkflowView, auto pass in corresponding workflow
 watch(
   () => route.query?.workflow,
   () => {
@@ -1096,208 +1025,13 @@ onUnmounted(() => {
   unlockBodyScroll()
   resetConnectionState()
   cleanupRecording()
+  stopTimer()
 })
 
-const { fromObject, fitView, onPaneReady, onNodesInitialized, setNodes, setEdges, edges } = useVueFlow()
-
-// Fit the view after the pane is ready or nodes are initialized
-onPaneReady(() => {
-  requestAnimationFrame(() => fitView?.({ padding: 0.1 }))
-})
-onNodesInitialized(() => {
-  requestAnimationFrame(() => fitView?.({ padding: 0.1 }))
-})
-
-const syncNodeAndEdgeData = () => {
-  try {
-    const yamlNodes = workflowYaml.value?.graph?.nodes || []
-    const yamlEdges = workflowYaml.value?.graph?.edges || []
-
-    const yamlNodeById = new Map(
-      Array.isArray(yamlNodes) ? yamlNodes.map(node => [node.id, node]) : []
-    )
-    const yamlEdgeByKey = new Map(
-      Array.isArray(yamlEdges)
-        ? yamlEdges.map(edge => [`${edge.from}-${edge.to}`, edge])
-        : []
-    )
-
-    setNodes(existingNodes => {
-      if (!Array.isArray(existingNodes)) {
-        return existingNodes
-      }
-      return existingNodes.map(node => {
-        const yamlNode = yamlNodeById.get(node.id)
-        if (yamlNode) {
-          return {
-            ...node,
-            data: yamlNode
-          }
-        }
-        return node
-      })
-    })
-
-    setEdges(existingEdges => {
-      if (!Array.isArray(existingEdges)) {
-        return existingEdges
-      }
-      return existingEdges.map(edge => {
-        const key = `${edge.source}-${edge.target}`
-        const yamlEdge = yamlEdgeByKey.get(key)
-        if (yamlEdge) {
-          return {
-            ...edge,
-            data: yamlEdge,
-            markerEnd: {
-              type: MarkerType.Arrow,
-              width: 18,
-              height: 18,
-              color: '#f2f2f2',
-              strokeWidth: 2,
-            }
-          }
-        }
-        return edge
-      })
-    })
-  } catch (error) {
-    console.error('Failed to sync graph data with YAML:', error)
-  }
-}
-
-const generateNodesAndEdges = async ({ fit = false } = {}) => {
-  try {
-    const yamlNodes = Array.isArray(workflowYaml.value?.graph?.nodes)
-      ? workflowYaml.value.graph.nodes
-      : []
-    const yamlEdges = Array.isArray(workflowYaml.value?.graph?.edges)
-      ? workflowYaml.value.graph.edges
-      : []
-
-    const generatedNodes = yamlNodes.map((node, index) => ({
-      id: node.id,
-      type: 'workflow-node',
-      label: node.id,
-      position: {
-        x: 20 + (index % 5) * 200,
-        y: 10 + Math.floor(index / 5) * 150
-      },
-      data: node
-    }))
-
-    const generatedEdges = yamlEdges.map(edge => ({
-      id: `${edge.from}-${edge.to}`,
-      source: edge.from,
-      target: edge.to,
-      type: 'workflow-edge',
-      markerEnd: {
-        type: MarkerType.Arrow,
-        width: 18,
-        height: 18,
-        color: '#f2f2f2',
-        strokeWidth: 2,
-      },
-      data: edge
-    }))
-
-    setNodes(generatedNodes)
-    setEdges(generatedEdges)
-  } catch (error) {
-    console.error('Error generating nodes and edges from YAML:', error)
-  }
-
-  if (fit && viewMode.value === 'graph') {
-    await nextTick()
-    fitView?.({ padding: 0.1 })
-  }
-}
-
-const loadVueFlowGraph = async ({ fit = false } = {}) => {
-  const selectionSnapshot = selectedYamlFile.value
-  const shouldFit = fit && viewMode.value === 'graph'
-
-  const runFallback = async () => {
-    if (selectedYamlFile.value === selectionSnapshot) {
-      await generateNodesAndEdges({ fit: shouldFit })
-    }
-    return false
-  }
-
-  if (!selectionSnapshot) {
-    return await runFallback()
-  }
-
-  const key = selectionSnapshot.replace(/\.yaml$/i, '')
-  if (!key) {
-    return await runFallback()
-  }
-
-  try {
-    const result = await fetchVueGraph(key)
-
-    if (selectedYamlFile.value !== selectionSnapshot) {
-      return false
-    }
-
-    if (result?.status === 404) {
-      return await runFallback()
-    }
-
-    if (!result?.success) {
-      console.error('Failed to load VueFlow graph:', result?.message || result?.detail)
-      return await runFallback()
-    }
-
-    if (selectedYamlFile.value !== selectionSnapshot) {
-      return false
-    }
-
-    const content = result?.content
-
-    if (!content) {
-      return await runFallback()
-    }
-
-    let flow
-    try {
-      flow = JSON.parse(content)
-    } catch (parseError) {
-      console.error('Failed to parse saved VueFlow graph:', parseError)
-      return await runFallback()
-    }
-
-    fromObject?.(flow)
-    await nextTick()
-
-    if (selectedYamlFile.value !== selectionSnapshot) {
-      return false
-    }
-
-    syncNodeAndEdgeData()
-
-    if (shouldFit) {
-      await nextTick()
-
-      if (selectedYamlFile.value !== selectionSnapshot) {
-        return false
-      }
-
-      fitView?.({ padding: 0.1 })
-    }
-
-    return true
-  } catch (error) {
-    console.error('Failed to load VueFlow graph:', error)
-  }
-
-  return await runFallback()
-}
-
-const switchToGraph = async () => {
-  viewMode.value = 'graph'
+// Toggle to dashboard
+const switchToDashboard = async () => {
+  viewMode.value = 'dashboard'
   await nextTick()
-  await loadVueFlowGraph({ fit: true })
 }
 
 const launchBatchWorkflow = async () => {
@@ -1334,7 +1068,7 @@ const launchBatchWorkflow = async () => {
 
     if (result.success) {
       console.log('Batch workflow launched: ', result)
-      status.value = 'Running...'
+      status.value = 'In Progress'
       isWorkflowRunning.value = true
     } else {
       console.error('Failed to launch batch workflow:', result)
@@ -1342,7 +1076,7 @@ const launchBatchWorkflow = async () => {
       alert(`Failed to launch batch workflow: ${result.detail || result.message || 'Unknown error'}`)
       shouldGlow.value = true
       if (isConnectionReady.value) {
-        status.value = 'Waiting for launch...'
+        status.value = 'Pending launch'
       }
     }
   } catch (error) {
@@ -1351,7 +1085,7 @@ const launchBatchWorkflow = async () => {
     alert(`Failed to call batch workflow API: ${error.message}`)
     shouldGlow.value = true
     if (isConnectionReady.value) {
-      status.value = 'Waiting for launch...'
+      status.value = 'Pending launch'
     }
   }
 }
@@ -1363,13 +1097,23 @@ watch(status, (newStatus) => {
   }
 })
 
+// Processes different types of messages
 const processBatchMessage = async (msg) => {
   console.log('Batch Message: ', msg)
 
   // Batch completed
   if (msg.type === 'batch_completed') {
     const message = `Batch processing finished, ${msg.data.succeeded} tasks succeeded, ${msg.data.failed} tasks failed`
-    addLogMessage(message)
+    addLogMessage(message, LOG_TYPES.DEFAULT)
+
+    // Update metrics
+    successfulTasks.value = msg.data.succeeded
+    failedTasks.value = msg.data.failed
+    completedRowsCount.value = msg.data.succeeded + msg.data.failed
+    batchEndTime.value = Date.now()
+
+    // Stop the timer
+    stopTimer()
 
     status.value = 'Batch completed'
     isWorkflowRunning.value = false
@@ -1379,22 +1123,41 @@ const processBatchMessage = async (msg) => {
   // Handle batch processing messages
   if (msg.type === 'batch_started') {
     const message = `Batch processing started with total of ${msg.data.total} rows...`
-    addLogMessage(message)
+    addLogMessage(message, LOG_TYPES.DEFAULT)
+
+    // Initialize metrics
+    totalRowsCount.value = msg.data.total
+    completedRowsCount.value = 0
+    successfulTasks.value = 0
+    failedTasks.value = 0
+    batchStartTime.value = Date.now()
+    batchEndTime.value = null
+
+    // Start the timer
+    startTimer()
   }
 
   if (msg.type === 'batch_task_started') {
     const message = `[ID ${msg.data.task_id}, Row ${msg.data.row_index}] launched`
-    addLogMessage(message)
+    addLogMessage(message, LOG_TYPES.DEFAULT)
   }
 
   if (msg.type === 'batch_task_completed') {
     const message = `[ID ${msg.data.task_id}, Row ${msg.data.row_index}] completed, ${msg.data.duration_ms}ms spent, total ${msg.data.token_usage.total_usage.total_tokens} tokens used`
-    addLogMessage(message)
+    addLogMessage(message, LOG_TYPES.COMPLETED)
+
+    // Update metrics
+    completedRowsCount.value++
+    successfulTasks.value++
   }
 
   if (msg.type === 'batch_task_failed') {
     const message = `[ID ${msg.data.task_id}, Row ${msg.data.row_index}] failed, Error: ${msg.data.error}`
-    addLogMessage(message)
+    addLogMessage(message, LOG_TYPES.FAILED)
+
+    // Update metrics
+    completedRowsCount.value++
+    failedTasks.value++
   }
 }
 
@@ -1403,7 +1166,14 @@ const cancelBatchWorkflow = () => {
   if (!isWorkflowRunning.value || !ws) {
     return
   }
-  addLogMessage('Batch cancelled')
+  addLogMessage('Batch cancelled', LOG_TYPES.DEFAULT)
+
+  // Finalize metrics
+  batchEndTime.value = Date.now()
+
+  // Stop the timer
+  stopTimer()
+
   status.value = 'Batch cancelled'
   isWorkflowRunning.value = false
   sessionIdToDownload = sessionId
@@ -1429,16 +1199,6 @@ const downloadLogs = async () => {
 }
 
 // Auto-scroll to bottom
-watch(
-  () => logMessages.value.length,
-  async () => {
-    await nextTick()
-    if (logMessagesRef.value) {
-      logMessagesRef.value.scrollTop = logMessagesRef.value.scrollHeight
-    }
-  }
-)
-
 watch(
   () => logMessages.value.length,
   async () => {
@@ -1541,7 +1301,7 @@ watch(
 /* Log Box */
 .log-box {
   flex: 1;
-  background-color: rgba(0, 0, 0, 0.8);
+  background-color: rgba(25, 25, 25, 0.95);
   border: 1px solid rgba(255, 255, 255, 0.2);
   border-radius: 12px;
   overflow: hidden;
@@ -1551,6 +1311,131 @@ watch(
   font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
 }
 
+/* Dashboard Box */
+.dashboard-box {
+  flex: 1;
+  background-color: rgba(255, 255, 255, 0.03);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 12px;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  backdrop-filter: blur(5px);
+}
+
+.dashboard-content {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+  color: #e7e7e7;
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  font-size: 14px;
+  line-height: 1.4;
+  justify-content: space-between;
+}
+
+/* Metrics Grid */
+.metrics-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 16px;
+  margin-bottom: 8px;
+}
+
+.metric-card {
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 8px;
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  backdrop-filter: blur(2px);
+  transition: all 0.3s ease;
+}
+
+.metric-card.status-active {
+  border-color: #aaffcd;
+  box-shadow: 0 0 15px rgba(153, 234, 249, 0.3);
+  animation: borderPulse 4s ease-in-out infinite alternate;
+}
+
+.metric-title {
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.6);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  font-weight: 600;
+}
+
+.metric-value {
+  font-size: 16px;
+  font-weight: 700;
+  color: #f2f2f2;
+}
+
+/* Progress Section */
+.progress-section {
+  margin-top: 8px;
+}
+
+.progress-label {
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.6);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  font-weight: 600;
+  margin-bottom: 8px;
+}
+
+.progress-bar {
+  width: 100%;
+  height: 8px;
+  background: rgba(255, 255, 255, 0.1);
+  border-radius: 4px;
+  overflow: hidden;
+  margin-bottom: 8px;
+  position: relative;
+}
+
+.progress-fill.processing::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(
+    90deg,
+    transparent 0%,
+    rgba(255, 255, 255, 0.3) 50%,
+    rgba(255, 255, 255, 0.8) 60%,
+    rgba(255, 255, 255, 0.3) 70%,
+    transparent 100%
+  );
+  animation: wavePulse 1.8s ease-in-out infinite;
+  border-radius: 4px;
+}
+
+.progress-fill {
+  position: relative;
+  height: 100%;
+  background: linear-gradient(90deg, #aaffcd, #99eaf9, #a0c4ff);
+  background-size: 200% 100%;
+  animation: gradientShift 3s ease-in-out infinite;
+  transition: width 0.3s ease;
+  overflow: hidden;
+}
+
+.progress-text {
+  font-size: 13px;
+  color: rgba(255, 255, 255, 0.8);
+  text-align: center;
+  font-weight: 500;
+}
+
 .log-messages::-webkit-scrollbar {
   width: 8px;
   height: 8px;
@@ -1572,11 +1457,11 @@ watch(
   flex: 1;
   padding: 20px;
   overflow-y: auto;
-  color: #e0e0e0;
+  color: #e7e7e7;
   display: flex;
   flex-direction: column;
   gap: 8px;
-  font-size: 13px;
+  font-size: 14px;
   line-height: 1.4;
 }
 
@@ -1586,6 +1471,22 @@ watch(
   word-break: break-word;
 }
 
+.log-timestamp {
+  font-weight: 500;
+}
+
+.log-timestamp-completed {
+  color: #6bff75;
+}
+
+.log-timestamp-failed {
+  color: #ff8080;
+}
+
+.log-timestamp-default {
+  color: #88e4f8;
+}
+
 .log-placeholder {
   color: rgba(255, 255, 255, 0.4);
   font-style: italic;
@@ -2040,6 +1941,9 @@ watch(
   padding: 12px;
   font-size: 13px;
   line-height: 1.4;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
 }
 
 .manual-item {
@@ -2304,9 +2208,30 @@ watch(
   font-weight: 500;
 }
 
-.status-active {
-  color: #a0c4ff;
-  background: rgba(160, 196, 255, 0.1);
+/* View Toggle */
+.view-toggle {
+  display: flex;
+  background: rgba(0, 0, 0, 0.2);
+  padding: 4px;
+  border-radius: 8px;
+}
+
+.toggle-button {
+  flex: 1;
+  padding: 6px;
+  border: none;
+  background: transparent;
+  color: rgba(255, 255, 255, 0.5);
+  cursor: pointer;
+  border-radius: 6px;
+  font-size: 13px;
+  transition: all 0.2s ease;
+}
+
+.toggle-button.active {
+  background: rgba(255, 255, 255, 0.1);
+  color: #f2f2f2;
+  font-weight: 500;
 }
 
 
@@ -2434,6 +2359,26 @@ watch(
   100% { box-shadow: 0 0 0 0 rgba(160, 196, 255, 0); }
 }
 
+@keyframes borderPulse {
+  0% { border-color: #aaffcd; box-shadow: 0 0 0px rgba(170, 255, 205, 0.15); }
+  50% { border-color: #99eaf9; box-shadow: 0 0 8px rgba(153, 234, 249, 0.35); }
+  100% { border-color: #a0c4ff; box-shadow: 0 0 0px rgba(160, 196, 255, 0.2); }
+}
+
+@keyframes wavePulse {
+  0% {
+    left: -100%;
+    opacity: 0;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    left: 100%;
+    opacity: 0;
+  }
+}
+
 .download-button {
   padding: 12px;
   background: rgba(255, 255, 255, 0.03);
@@ -2537,7 +2482,7 @@ watch(
   background: #252525;
   border: 1px solid rgba(255, 255, 255, 0.1);
   border-radius: 12px;
-  max-width: 500px;
+  max-width: 550px;
   width: 90vw;
   max-height: 80vh;
   overflow: hidden;
diff --git a/frontend/src/pages/LaunchView.vue b/frontend/src/pages/LaunchView.vue
index f68217d7..31399f04 100755
--- a/frontend/src/pages/LaunchView.vue
+++ b/frontend/src/pages/LaunchView.vue
@@ -800,6 +800,9 @@ const selectWorkflow = (fileName) => {
   isFileSearchDirty.value = false
   closeFileDropdown()
 
+  // Avoid focusing on element after selection
+  fileSelectorInputRef.value?.blur()
+
   router.push({
     query: {
       ...route.query,

From d01c244097130976181103886f0373b3e543f1a5 Mon Sep 17 00:00:00 2001
From: swugi <hoofangy3@gmail.com>
Date: Thu, 15 Jan 2026 00:50:52 +0800
Subject: [PATCH 6/6] add: settings modal for batch processing

---
 frontend/src/pages/BatchRunView.vue | 235 +++++++++++++++++++++++++++-
 1 file changed, 232 insertions(+), 3 deletions(-)

diff --git a/frontend/src/pages/BatchRunView.vue b/frontend/src/pages/BatchRunView.vue
index 251e0eba..128ccbdf 100644
--- a/frontend/src/pages/BatchRunView.vue
+++ b/frontend/src/pages/BatchRunView.vue
@@ -3,7 +3,7 @@
     <div class="launch-bg"></div>
     <div class="header">
       <h1>Labaratory</h1>
-      <button class="settings-button" @click="showSettingsModal = true" title="Settings">
+      <button class="settings-button" @click="showBatchSettingsModal()" title="Batch Settings">
         <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
           <circle cx="12" cy="12" r="3"></circle>
           <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path>
@@ -254,6 +254,51 @@ JSON.stringify(["C:\\a_sheep.png"], null, 2)
       </div>
     </div>
   </Transition>
+
+  <!-- Batch Settings Modal -->
+  <Transition name="modal">
+    <div
+      v-if="isBatchSettingsModalVisible"
+      class="batch-settings-modal-overlay"
+      @click.self="isBatchSettingsModalVisible = false"
+    >
+      <div class="batch-settings-modal">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h3>Batch Settings</h3>
+            <button class="close-button" @click="isBatchSettingsModalVisible = false">×</button>
+          </div>
+          <div class="modal-body">
+            <div class="settings-item">
+              <label class="setting-label">Max. Parallel Launches</label>
+              <input
+                type="number"
+                v-model.number="maxParallel"
+                class="setting-input"
+                min="1"
+                max="50"
+                step="1"
+              />
+              <p class="setting-desc">Maximum number of parallel workflow launches</p>
+            </div>
+            <div class="settings-item">
+              <label class="setting-label">Log Level</label>
+              <select v-model="logLevel" class="setting-select">
+                <option v-for="level in logLevelOptions" :key="level" :value="level">
+                  {{ level }}
+                </option>
+              </select>
+              <p class="setting-desc">Logging verbosity level</p>
+            </div>
+          </div>
+          <div class="modal-footer">
+            <button class="cancel-button" @click="isBatchSettingsModalVisible = false">Cancel</button>
+            <button class="confirm-button" @click="isBatchSettingsModalVisible = false">Save</button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </Transition>
 </template>
 
 <script setup>
@@ -370,8 +415,14 @@ let audioStream = null
 // WebSocket readiness state
 const isConnectionReady = ref(false)
 const showSettingsModal = ref(false)
+const isBatchSettingsModalVisible = ref(false)
 const showColumnGuideModal = ref(false)
 
+// Batch settings
+const maxParallel = ref(5)
+const logLevel = ref('INFO')
+const logLevelOptions = ['INFO', 'DEBUG', 'WARNING', 'ERROR', 'CRITICAL']
+
 // View mode
 const viewMode = ref('dashboard')
 
@@ -850,10 +901,17 @@ const handleKeydown = (event) => {
       closeImageModal()
     } else if (showColumnGuideModal.value) {
       showColumnGuideModal.value = false
+    } else if (isBatchSettingsModalVisible.value) {
+      isBatchSettingsModalVisible.value = false
     }
   }
 }
 
+// Show batch settings modal
+const showBatchSettingsModal = () => {
+  isBatchSettingsModalVisible.value = true
+}
+
 // Handle YAML file selection
 const handleYAMLSelection = async (fileName) => {
   if (!fileName) {
@@ -1062,8 +1120,8 @@ const launchBatchWorkflow = async () => {
       file: selectedInputFile.value,
       sessionId: sessionId,
       yamlFile: selectedYamlFile.value,
-      maxParallel: '',
-      logLevel: ''
+        maxParallel: maxParallel.value,
+      logLevel: logLevel.value
     })
 
     if (result.success) {
@@ -2506,4 +2564,175 @@ watch(
   opacity: 0;
   transform: scale(0.95);
 }
+
+/* Batch Settings Modal */
+.batch-settings-modal-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  backdrop-filter: blur(2px);
+}
+
+.batch-settings-modal {
+  background: #252525;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 12px;
+  max-width: 500px;
+  width: 90vw;
+  max-height: 80vh;
+  overflow: hidden;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
+}
+
+.batch-settings-modal .modal-content {
+  padding: 0;
+  max-height: calc(80vh - 48px);
+  overflow-y: auto;
+}
+
+.batch-settings-modal .modal-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px 24px;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+.batch-settings-modal .modal-header h3 {
+  margin: 0;
+  font-size: 18px;
+  font-weight: 600;
+  color: #f2f2f2;
+}
+
+.batch-settings-modal .close-button {
+  background: none;
+  border: none;
+  color: #888;
+  font-size: 24px;
+  cursor: pointer;
+  padding: 0;
+  line-height: 1;
+  transition: color 0.2s ease;
+}
+
+.batch-settings-modal .close-button:hover {
+  color: #fff;
+}
+
+.batch-settings-modal .modal-body {
+  padding: 24px;
+  flex: 1;
+  overflow-y: auto;
+}
+
+.batch-settings-modal .settings-item {
+  margin-bottom: 24px;
+}
+
+.batch-settings-modal .settings-item:last-child {
+  margin-bottom: 0;
+}
+
+.batch-settings-modal .setting-label {
+  display: block;
+  font-size: 14px;
+  font-weight: 600;
+  color: #f2f2f2;
+  margin-bottom: 8px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.batch-settings-modal .setting-input {
+  width: 86px;
+  padding: 10px 12px;
+  background-color: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 8px;
+  color: #f2f2f2;
+  font-size: 14px;
+  transition: all 0.2s ease;
+}
+
+.batch-settings-modal .setting-input:focus {
+  outline: none;
+  background-color: rgba(255, 255, 255, 0.08);
+  border-color: rgba(255, 255, 255, 0.2);
+}
+
+.batch-settings-modal .setting-select {
+  padding: 10px 12px;
+  background-color: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 8px;
+  color: #f2f2f2;
+  font-size: 14px;
+  transition: all 0.2s ease;
+  cursor: pointer;
+}
+
+.batch-settings-modal .setting-select:focus {
+  outline: none;
+  background-color: rgba(255, 255, 255, 0.08);
+  border-color: rgba(255, 255, 255, 0.2);
+}
+
+.batch-settings-modal .setting-select option {
+  background-color: #1a1a1a;
+  color: #f2f2f2;
+}
+
+.batch-settings-modal .setting-desc {
+  margin-top: 6px;
+  color: rgba(255, 255, 255, 0.6);
+  font-size: 12px;
+  line-height: 1.4;
+}
+
+.batch-settings-modal .modal-footer {
+  padding: 16px 24px;
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+}
+
+.batch-settings-modal .confirm-button {
+  background: #4facfe;
+  color: #fff;
+  border: none;
+  padding: 10px 20px;
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 500;
+  transition: background-color 0.2s ease;
+}
+
+.batch-settings-modal .confirm-button:hover {
+  background: #3a9cfa;
+}
+
+.batch-settings-modal .cancel-button {
+  background: transparent;
+  color: #ccc;
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  padding: 10px 20px;
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 500;
+  transition: all 0.2s ease;
+}
+
+.batch-settings-modal .cancel-button:hover {
+  background: rgba(255, 255, 255, 0.05);
+  color: #fff;
+  border-color: rgba(255, 255, 255, 0.3);
+}
 </style>