前置 URL：环境切换自动拼接服务地址（借鉴 Apifox）

- 环境新增「前置 URL」字段；环境管理弹窗独立配置区 + 说明
- URL 输入改为一体胶囊：前缀块（环境徽标 + 域名，点击进环境管理）+ 分隔线 + 相对路径输入
  - 路径以 / 开头（或空）自动拼接当前环境前置 URL；完整 https:// 地址不受影响
  - 光标 / 全选只作用于路径，不再误编辑 {{baseUrl}} 文本
- 覆盖 HTTP / GraphQL / SSE 编辑器与发送链路（含自动化测试执行器、代码生成用完整地址）
- 存量数据一次性迁移：{{baseUrl}}/path → /path，baseUrl 变量 → 环境字段（启动 / 导入 / 备份恢复均生效）
- 顶栏切换环境即换前缀；docs 06-env 增前置 URL 章节
- 验证：48 前端用例全绿；本地 E2E（迁移/发送 200/环境切换前缀联动/胶囊几何对齐）+ 近景视觉评审通过

packages/ui/src/components/UrlPathInput.tsx

@@ -0,0 +1,89 @@
+/**
+ * URL 输入（前置 URL 模式）：
+ * 当前环境配置了前置 URL 且值为相对路径（/ 开头或空）时，
+ * 展示「前缀块 + 分隔线 + 路径输入」的一体胶囊 —— 借鉴 Apifox 前置 URL。
+ * 路径输入只编辑相对部分，光标 / 全选不会碰到服务地址。
+ */
+import type { KeyboardEvent } from "react";
+import { useWorkspace } from "../workspaceStore";
+import { cx } from "./common";
+import { EnvBadge } from "./EnvBadge";
+import { VarHintInput } from "./VarHintInput";
+
+export function useEnvBaseUrl(): { baseUrl: string; envId: string | null; envName: string } {
+  const envId = useWorkspace((s) => s.activeEnvironmentId);
+  const env = useWorkspace((s) => (envId ? s.environments.find((e) => e.id === envId) : undefined));
+  return {
+    baseUrl: env?.baseUrl?.trim() ?? "",
+    envId: envId ?? null,
+    envName: env?.name ?? "",
+  };
+}
+
+/** 前置 URL 与相对路径拼接（供编辑器展示「实际地址」与代码生成复用） */
+export function joinUrl(baseUrl: string, path: string): string {
+  const p = path.trim();
+  if (!baseUrl || (p !== "" && !p.startsWith("/"))) return path;
+  const b = baseUrl.replace(/\/+$/, "");
+  if (p === "") return `${b}/`;
+  return p.startsWith("/") ? `${b}${p}` : `${b}/${p}`;
+}
+
+export function UrlPathInput({
+  value,
+  onChange,
+  placeholder,
+  className,
+  onKeyDown,
+  ariaLabel,
+}: {
+  value: string;
+  onChange: (v: string) => void;
+  placeholder?: string;
+  className?: string;
+  onKeyDown?: (e: KeyboardEvent<HTMLInputElement>) => void;
+  ariaLabel?: string;
+}) {
+  const { baseUrl, envId, envName } = useEnvBaseUrl();
+  const setDialog = useWorkspace((s) => s.setDialog);
+  const usePrefix = !!baseUrl && (value === "" || value.trimStart().startsWith("/"));
+
+  if (!usePrefix) {
+    return (
+      <VarHintInput
+        className={className}
+        value={value}
+        onChange={onChange}
+        placeholder={placeholder}
+        onKeyDown={onKeyDown}
+        ariaLabel={ariaLabel}
+      />
+    );
+  }
+
+  // 展示 host（去协议），完整地址放 title
+  const display = baseUrl.replace(/^https?:\/\//, "").replace(/\/+$/, "");
+
+  return (
+    <div className={cx("url-pill", className)}>
+      <button
+        type="button"
+        className="url-pill-prefix"
+        title={`前置 URL（${envName || "当前环境"}）：${baseUrl}\n点击管理环境`}
+        onClick={() => setDialog({ type: "environments" })}
+      >
+        {envId && <EnvBadge envId={envId} name={envName} size={14} />}
+        <span className="truncate">{display}</span>
+      </button>
+      <span className="url-pill-divider" />
+      <VarHintInput
+        className="url-pill-input"
+        value={value}
+        onChange={onChange}
+        placeholder={placeholder ?? "/path"}
+        onKeyDown={onKeyDown}
+        ariaLabel={ariaLabel}
+      />
+    </div>
+  );
+}