vue-api-request-builder 0.1.0 → 0.2.1

package/dist/index.es.js

@@ -1,8 +1,8 @@
-import { defineComponent as F, ref as w, watch as q, resolveComponent as y, createElementBlock as R, openBlock as g, createElementVNode as h, createCommentVNode as T, createBlock as z, createVNode as l, withCtx as d, createTextVNode as _, toDisplayString as J, Fragment as A, renderList as le, computed as I } from "vue";
-const oe = { class: "key-value-input flex flex-col gap-1" }, se = { class: "flex gap-2" }, ne = {
+import { defineComponent as H, ref as w, watch as C, resolveComponent as c, createElementBlock as $, openBlock as _, createElementVNode as p, createCommentVNode as R, createBlock as O, createVNode as s, withCtx as r, createTextVNode as b, toDisplayString as z, Fragment as F, renderList as K, computed as J } from "vue";
+const le = { class: "key-value-input flex flex-col gap-1" }, se = { class: "flex gap-2" }, ne = {
   key: 0,
   class: "flex flex-col gap-1"
-}, ue = { class: "flex w-full gap-1 items-center" }, re = /* @__PURE__ */ F({
+}, ue = { class: "flex w-full gap-1 items-center" }, re = /* @__PURE__ */ H({
   __name: "KeyValueInput",
   props: {
     modelValue: {},
@@ -11,59 +11,59 @@ const oe = { class: "key-value-input flex flex-col gap-1" }, se = { class: "flex
     previewText: { default: "" }
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: x }) {
-    const r = t, s = x, n = w(r.modelValue);
-    q(
-      () => r.modelValue,
-      (i) => {
-        n.value = i;
+  setup(a, { emit: g }) {
+    const d = a, o = g, n = w(d.modelValue);
+    C(
+      () => d.modelValue,
+      (u) => {
+        n.value = u;
       }
-    ), q(
+    ), C(
       n,
-      (i) => {
-        s("update:modelValue", i);
+      (u) => {
+        o("update:modelValue", u);
       },
       { deep: !0 }
     );
-    const f = () => {
+    const y = () => {
       n.value.push({ key: "", value: "" });
-    }, a = (i) => {
-      n.value.splice(i, 1);
-    }, v = () => {
+    }, l = (u) => {
+      n.value.splice(u, 1);
+    }, f = () => {
       n.value = [];
     };
-    return (i, u) => {
-      const m = y("a-button"), c = y("a-popconfirm"), B = y("a-input"), $ = y("a-typography-paragraph"), U = y("a-typography");
-      return g(), R("div", oe, [
-        h("div", se, [
-          l(m, {
+    return (u, t) => {
+      const v = c("a-button"), x = c("a-popconfirm"), j = c("a-input"), B = c("a-typography-paragraph"), U = c("a-typography");
+      return _(), $("div", le, [
+        p("div", se, [
+          s(v, {
             type: "primary",
-            onClick: f,
+            onClick: y,
             class: "w-40 max-w-full",
             size: "small"
           }, {
-            default: d(() => [
-              _(J(i.addButtonText), 1)
+            default: r(() => [
+              b(z(u.addButtonText), 1)
             ]),
             _: 1
           }),
-          l(c, {
+          s(x, {
             title: "确认清空",
             description: "确定要清空所有参数吗？",
             "ok-text": "确认",
             "cancel-text": "取消",
-            onConfirm: v
+            onConfirm: f
           }, {
-            default: d(() => [
-              l(m, {
+            default: r(() => [
+              s(v, {
                 type: "primary",
                 danger: "",
                 class: "w-40 max-w-full",
                 size: "small",
                 disabled: n.value.length === 0
               }, {
-                default: d(() => u[0] || (u[0] = [
-                  _(" 清空 ")
+                default: r(() => t[0] || (t[0] = [
+                  b(" 清空 ")
                 ])),
                 _: 1
               }, 8, ["disabled"])
@@ -71,64 +71,64 @@ const oe = { class: "key-value-input flex flex-col gap-1" }, se = { class: "flex
             _: 1
           })
         ]),
-        n.value.length > 0 ? (g(), R("div", ne, [
-          (g(!0), R(A, null, le(n.value, (k, S) => (g(), R("div", {
+        n.value.length > 0 ? (_(), $("div", ne, [
+          (_(!0), $(F, null, K(n.value, (k, S) => (_(), $("div", {
             key: S,
             class: "flex"
           }, [
-            h("div", ue, [
-              l(m, {
+            p("div", ue, [
+              s(v, {
                 type: "primary",
                 danger: "",
-                onClick: (j) => a(S),
+                onClick: (h) => l(S),
                 class: "w-16",
                 size: "small"
               }, {
-                default: d(() => u[1] || (u[1] = [
-                  _(" 删除 ")
+                default: r(() => t[1] || (t[1] = [
+                  b(" 删除 ")
                 ])),
                 _: 2
               }, 1032, ["onClick"]),
-              l(B, {
+              s(j, {
                 value: k.key,
-                "onUpdate:value": (j) => k.key = j,
+                "onUpdate:value": (h) => k.key = h,
                 placeholder: "键",
                 style: { width: "60%" },
                 size: "small"
               }, null, 8, ["value", "onUpdate:value"]),
-              l(B, {
+              s(j, {
                 value: k.value,
-                "onUpdate:value": (j) => k.value = j,
+                "onUpdate:value": (h) => k.value = h,
                 placeholder: "值",
                 style: { width: "100%" },
                 size: "small"
               }, null, 8, ["value", "onUpdate:value"])
             ])
           ]))), 128))
-        ])) : T("", !0),
-        i.showPreview ? (g(), z(U, {
+        ])) : R("", !0),
+        u.showPreview ? (_(), O(U, {
           key: 1,
           class: "m-0"
         }, {
-          default: d(() => [
-            l($, { class: "!m-0" }, {
-              default: d(() => [
-                h("pre", null, J(i.previewText), 1)
+          default: r(() => [
+            s(B, { class: "!m-0" }, {
+              default: r(() => [
+                p("pre", null, z(u.previewText), 1)
               ]),
               _: 1
             })
           ]),
           _: 1
-        })) : T("", !0)
+        })) : R("", !0)
       ]);
     };
   }
-}), G = (t, x) => {
-  const r = t.__vccOpts || t;
-  for (const [s, n] of x)
-    r[s] = n;
-  return r;
-}, D = /* @__PURE__ */ G(re, [["__scopeId", "data-v-1e5ef051"]]), de = {
+}), M = (a, g) => {
+  const d = a.__vccOpts || a;
+  for (const [o, n] of g)
+    d[o] = n;
+  return d;
+}, L = /* @__PURE__ */ M(re, [["__scopeId", "data-v-1e5ef051"]]), de = {
   method: "GET",
   url: "https://yesno.wtf",
   path: "/api",
@@ -140,61 +140,61 @@ const oe = { class: "key-value-input flex flex-col gap-1" }, se = { class: "flex
   body: {
     type: "application/json"
   }
-}, pe = { class: "request-form" }, ie = { class: "flex flex-col gap-1" }, ve = { class: "flex flex-row gap-1" }, me = { class: "flex flex-row gap-1" }, fe = { class: "mt-1" }, ce = {
+}, ie = { class: "request-form" }, pe = { class: "flex flex-col gap-1" }, ve = { class: "flex flex-row gap-1" }, me = { class: "flex flex-row gap-1" }, fe = { class: "mt-1" }, ce = {
   key: 0,
   class: "flex flex-col gap-1 mt-2"
-}, ye = { class: "flex flex-row gap-1 h-6" }, we = { class: "flex flex-row gap-1" }, _e = {
+}, ye = { class: "flex flex-row gap-1 h-6" }, _e = { class: "flex flex-row gap-1" }, be = {
   key: 1,
   class: "flex flex-col gap-1 mt-1"
-}, xe = { class: "flex flex-row gap-1 items-center" }, ke = /* @__PURE__ */ F({
+}, xe = { class: "flex flex-row gap-1 items-center" }, we = /* @__PURE__ */ H({
   __name: "RequestForm",
   props: {
     modelValue: { default: () => de }
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: x }) {
-    const r = t, s = x, n = w(r.modelValue.method), f = w(r.modelValue.url), a = w(r.modelValue.auth.type), v = w(r.modelValue.path), i = w(r.modelValue.auth.username || ""), u = w(r.modelValue.auth.password || ""), m = w(r.modelValue.auth.token || ""), c = w(r.modelValue.params), B = w(r.modelValue.headers), $ = w(r.modelValue.body.formData || []), U = w(r.modelValue.body.type), k = w(r.modelValue.body.json || ""), S = w(r.modelValue.body.raw || ""), j = w("");
-    function K(o, e) {
-      let b;
-      return function(...V) {
-        clearTimeout(b), b = setTimeout(() => o.apply(this, V), e);
+  setup(a, { emit: g }) {
+    const d = a, o = g, n = w(d.modelValue.method), y = w(d.modelValue.url), l = w(d.modelValue.auth.type), f = w(d.modelValue.path), u = w(d.modelValue.auth.username || ""), t = w(d.modelValue.auth.password || ""), v = w(d.modelValue.auth.token || ""), x = w(d.modelValue.params), j = w(d.modelValue.headers), B = w(d.modelValue.body.formData || []), U = w(d.modelValue.body.type), k = w(d.modelValue.body.json || ""), S = w(d.modelValue.body.raw || ""), h = w("");
+    function N(i, e) {
+      let T;
+      return function(...E) {
+        clearTimeout(T), T = setTimeout(() => i.apply(this, E), e);
       };
     }
-    const L = () => ({
+    const A = () => ({
       method: n.value,
-      url: f.value,
-      path: v.value,
+      url: y.value,
+      path: f.value,
       auth: {
-        type: a.value,
-        ...a.value === "Basic" ? {
-          username: i.value,
-          password: u.value
-        } : a.value === "Bearer" ? {
-          token: m.value
+        type: l.value,
+        ...l.value === "Basic" ? {
+          username: u.value,
+          password: t.value
+        } : l.value === "Bearer" ? {
+          token: v.value
         } : {}
       },
-      params: c.value,
-      headers: B.value,
+      params: x.value,
+      headers: j.value,
       body: {
         type: U.value,
-        ...U.value === "application/json" ? { json: k.value } : U.value === "multipart/form-data" ? { formData: $.value } : { raw: S.value }
+        ...U.value === "application/json" ? { json: k.value } : U.value === "multipart/form-data" ? { formData: B.value } : { raw: S.value }
       }
-    }), W = K(() => {
-      s("update:modelValue", L());
+    }), W = N(() => {
+      o("update:modelValue", A());
     }, 100);
-    q(
+    C(
       [
         n,
+        y,
         f,
-        v,
-        a,
-        i,
+        l,
         u,
-        m,
-        c,
-        B,
+        t,
+        v,
+        x,
+        j,
         U,
-        $,
+        B,
         k,
         S
       ],
@@ -202,18 +202,18 @@ const oe = { class: "key-value-input flex flex-col gap-1" }, se = { class: "flex
         W();
       },
       { deep: !0 }
-    ), q(
-      () => r.modelValue,
-      (o) => {
-        const e = L();
-        JSON.stringify(o) !== JSON.stringify(e) && (n.value = o.method, f.value = o.url, v.value = o.path, a.value = o.auth.type, i.value = o.auth.username || "", u.value = o.auth.password || "", m.value = o.auth.token || "", c.value = o.params, B.value = o.headers, U.value = o.body.type, $.value = o.body.formData || [], k.value = o.body.json || "", S.value = o.body.raw || "");
+    ), C(
+      () => d.modelValue,
+      (i) => {
+        const e = A();
+        JSON.stringify(i) !== JSON.stringify(e) && (n.value = i.method, y.value = i.url, f.value = i.path, l.value = i.auth.type, u.value = i.auth.username || "", t.value = i.auth.password || "", v.value = i.auth.token || "", x.value = i.params, j.value = i.headers, U.value = i.body.type, B.value = i.body.formData || [], k.value = i.body.json || "", S.value = i.body.raw || "");
       },
       { deep: !0 }
     );
-    const M = I(() => {
-      const o = c.value.filter((e) => !!e.key).map((e) => e.key + "=" + encodeURIComponent(e.value)).join("&");
-      return o === "" ? "" : "?" + o;
-    }), X = I(() => {
+    const X = J(() => {
+      const i = x.value.filter((e) => !!e.key).map((e) => e.key + "=" + encodeURIComponent(e.value)).join("&");
+      return i === "" ? "" : "?" + i;
+    }), Q = J(() => {
       switch (U.value) {
         case "application/json":
           try {
@@ -222,412 +222,537 @@ const oe = { class: "key-value-input flex flex-col gap-1" }, se = { class: "flex
             return "Invalid JSON";
           }
         case "multipart/form-data":
-          const o = "----WebKitFormBoundaryPreview";
-          return $.value.filter((b) => !!b.key).map(
-            (b) => `--${o}\r
-Content-Disposition: form-data; name="${b.key}"\r
+          const i = "----WebKitFormBoundaryPreview";
+          return B.value.filter((T) => !!T.key).map(
+            (T) => `--${i}\r
+Content-Disposition: form-data; name="${T.key}"\r
 \r
-${b.value}\r
+${T.value}\r
 `
-          ).join("") + `--${o}--\r
+          ).join("") + `--${i}--\r
 `;
         case "text/plain":
           return S.value || "-空-";
         default:
           return "-空-";
       }
-    }), Q = () => {
+    }), Y = () => {
       try {
-        k.value && (JSON.parse(k.value), j.value = "");
+        k.value && (JSON.parse(k.value), h.value = "");
       } catch {
-        j.value = "Invalid JSON format";
+        h.value = "Invalid JSON format";
       }
-    }, Y = () => {
+    }, Z = () => {
       try {
-        const o = f.value, e = new URL(o);
-        f.value = `${e.protocol}//${e.host}`, v.value = e.pathname;
-        const b = new URLSearchParams(e.search), V = [];
-        b.forEach((O, C) => {
-          V.push({ key: C, value: O });
-        }), c.value = V;
-      } catch (o) {
-        console.error("URL解析失败:", o);
+        const i = y.value, e = new URL(i);
+        y.value = `${e.protocol}//${e.host}`, f.value = e.pathname;
+        const T = new URLSearchParams(e.search), E = [];
+        T.forEach((V, D) => {
+          E.push({ key: D, value: V });
+        }), x.value = E;
+      } catch (i) {
+        console.error("URL解析失败:", i);
       }
-    }, Z = I(() => {
-      if (!f.value) return !1;
+    }, ee = J(() => {
+      if (!y.value) return !1;
       try {
-        const o = f.value, e = new URL(o);
+        const i = y.value, e = new URL(i);
         return e.search !== "" || e.pathname !== "/";
       } catch {
         return !1;
       }
     });
-    return (o, e) => {
-      const b = y("a-input"), V = y("a-button"), O = y("a-select-option"), C = y("a-select"), E = y("a-card"), P = y("a-radio-button"), H = y("a-radio-group"), ee = y("a-input-password"), N = y("a-textarea"), te = y("a-alert"), ae = y("a-form");
-      return g(), R("div", pe, [
-        l(ae, { layout: "vertical" }, {
-          default: d(() => [
-            l(E, {
+    return (i, e) => {
+      const T = c("a-input"), E = c("a-button"), V = c("a-select-option"), D = c("a-select"), P = c("a-card"), q = c("a-radio-button"), G = c("a-radio-group"), te = c("a-input-password"), I = c("a-textarea"), ae = c("a-alert"), oe = c("a-form");
+      return _(), $("div", ie, [
+        s(oe, { layout: "vertical" }, {
+          default: r(() => [
+            s(P, {
               title: "URL配置",
               class: "form-section",
               size: "small"
             }, {
-              default: d(() => [
-                h("div", ie, [
-                  h("div", ve, [
-                    l(b, {
-                      value: f.value,
-                      "onUpdate:value": e[0] || (e[0] = (p) => f.value = p),
+              default: r(() => [
+                p("div", pe, [
+                  p("div", ve, [
+                    s(T, {
+                      value: y.value,
+                      "onUpdate:value": e[0] || (e[0] = (m) => y.value = m),
                       placeholder: "基础URL",
                       size: "small"
                     }, null, 8, ["value"]),
-                    Z.value ? (g(), z(V, {
+                    ee.value ? (_(), O(E, {
                       key: 0,
                       type: "primary",
                       size: "small",
-                      onClick: Y
+                      onClick: Z
                     }, {
-                      default: d(() => e[13] || (e[13] = [
-                        _("拆解")
+                      default: r(() => e[13] || (e[13] = [
+                        b("拆解")
                       ])),
                       _: 1
-                    })) : T("", !0)
+                    })) : R("", !0)
                   ]),
-                  h("div", me, [
-                    l(C, {
+                  p("div", me, [
+                    s(D, {
                       value: n.value,
-                      "onUpdate:value": e[1] || (e[1] = (p) => n.value = p),
+                      "onUpdate:value": e[1] || (e[1] = (m) => n.value = m),
                       class: "w-40",
                       size: "small"
                     }, {
-                      default: d(() => [
-                        l(O, { value: "GET" }, {
-                          default: d(() => e[14] || (e[14] = [
-                            _("GET")
+                      default: r(() => [
+                        s(V, { value: "GET" }, {
+                          default: r(() => e[14] || (e[14] = [
+                            b("GET")
                           ])),
                           _: 1
                         }),
-                        l(O, { value: "POST" }, {
-                          default: d(() => e[15] || (e[15] = [
-                            _("POST")
+                        s(V, { value: "POST" }, {
+                          default: r(() => e[15] || (e[15] = [
+                            b("POST")
                           ])),
                           _: 1
                         }),
-                        l(O, { value: "PUT" }, {
-                          default: d(() => e[16] || (e[16] = [
-                            _("PUT")
+                        s(V, { value: "PUT" }, {
+                          default: r(() => e[16] || (e[16] = [
+                            b("PUT")
                           ])),
                           _: 1
                         }),
-                        l(O, { value: "DELETE" }, {
-                          default: d(() => e[17] || (e[17] = [
-                            _("DELETE")
+                        s(V, { value: "DELETE" }, {
+                          default: r(() => e[17] || (e[17] = [
+                            b("DELETE")
                           ])),
                           _: 1
                         }),
-                        l(O, { value: "OPTIONS" }, {
-                          default: d(() => e[18] || (e[18] = [
-                            _("OPTIONS")
+                        s(V, { value: "OPTIONS" }, {
+                          default: r(() => e[18] || (e[18] = [
+                            b("OPTIONS")
                           ])),
                           _: 1
                         })
                       ]),
                       _: 1
                     }, 8, ["value"]),
-                    l(b, {
-                      value: v.value,
-                      "onUpdate:value": e[2] || (e[2] = (p) => v.value = p),
+                    s(T, {
+                      value: f.value,
+                      "onUpdate:value": e[2] || (e[2] = (m) => f.value = m),
                       placeholder: "路径",
                       size: "small"
                     }, null, 8, ["value"])
                   ])
                 ]),
-                h("div", fe, [
-                  l(D, {
-                    modelValue: c.value,
-                    "onUpdate:modelValue": e[3] || (e[3] = (p) => c.value = p),
+                p("div", fe, [
+                  s(L, {
+                    modelValue: x.value,
+                    "onUpdate:modelValue": e[3] || (e[3] = (m) => x.value = m),
                     "add-button-text": "添加参数",
                     "show-preview": !0,
-                    "preview-text": f.value + v.value + M.value
+                    "preview-text": y.value + f.value + X.value
                   }, null, 8, ["modelValue", "preview-text"])
                 ])
               ]),
               _: 1
             }),
-            l(E, {
+            s(P, {
               title: "认证方案",
               class: "form-section",
               size: "small"
             }, {
-              default: d(() => [
-                l(H, {
-                  value: a.value,
-                  "onUpdate:value": e[4] || (e[4] = (p) => a.value = p),
+              default: r(() => [
+                s(G, {
+                  value: l.value,
+                  "onUpdate:value": e[4] || (e[4] = (m) => l.value = m),
                   "button-style": "solid",
                   size: "small"
                 }, {
-                  default: d(() => [
-                    l(P, { value: "none" }, {
-                      default: d(() => e[19] || (e[19] = [
-                        _("无认证")
+                  default: r(() => [
+                    s(q, { value: "none" }, {
+                      default: r(() => e[19] || (e[19] = [
+                        b("无认证")
                       ])),
                       _: 1
                     }),
-                    l(P, { value: "Basic" }, {
-                      default: d(() => e[20] || (e[20] = [
-                        _("Basic认证")
+                    s(q, { value: "Basic" }, {
+                      default: r(() => e[20] || (e[20] = [
+                        b("Basic认证")
                       ])),
                       _: 1
                     }),
-                    l(P, { value: "Bearer" }, {
-                      default: d(() => e[21] || (e[21] = [
-                        _("Bearer认证")
+                    s(q, { value: "Bearer" }, {
+                      default: r(() => e[21] || (e[21] = [
+                        b("Bearer认证")
                       ])),
                       _: 1
                     })
                   ]),
                   _: 1
                 }, 8, ["value"]),
-                a.value === "Basic" ? (g(), R("div", ce, [
-                  h("div", ye, [
-                    e[22] || (e[22] = h("p", { class: "m-0 w-16" }, "用户名", -1)),
-                    l(b, {
-                      value: i.value,
-                      "onUpdate:value": e[5] || (e[5] = (p) => i.value = p),
+                l.value === "Basic" ? (_(), $("div", ce, [
+                  p("div", ye, [
+                    e[22] || (e[22] = p("p", { class: "m-0 w-16" }, "用户名", -1)),
+                    s(T, {
+                      value: u.value,
+                      "onUpdate:value": e[5] || (e[5] = (m) => u.value = m),
                       size: "small"
                     }, null, 8, ["value"])
                   ]),
-                  h("div", we, [
-                    e[23] || (e[23] = h("p", { class: "m-0 w-16" }, "密码", -1)),
-                    l(ee, {
-                      value: u.value,
-                      "onUpdate:value": e[6] || (e[6] = (p) => u.value = p),
+                  p("div", _e, [
+                    e[23] || (e[23] = p("p", { class: "m-0 w-16" }, "密码", -1)),
+                    s(te, {
+                      value: t.value,
+                      "onUpdate:value": e[6] || (e[6] = (m) => t.value = m),
                       size: "small"
                     }, null, 8, ["value"])
                   ])
-                ])) : T("", !0),
-                a.value === "Bearer" ? (g(), R("div", _e, [
-                  h("div", xe, [
-                    e[24] || (e[24] = h("p", { class: "m-0 w-16 h-full" }, "Token", -1)),
-                    l(N, {
-                      value: m.value,
-                      "onUpdate:value": e[7] || (e[7] = (p) => m.value = p),
+                ])) : R("", !0),
+                l.value === "Bearer" ? (_(), $("div", be, [
+                  p("div", xe, [
+                    e[24] || (e[24] = p("p", { class: "m-0 w-16 h-full" }, "Token", -1)),
+                    s(I, {
+                      value: v.value,
+                      "onUpdate:value": e[7] || (e[7] = (m) => v.value = m),
                       size: "small",
                       class: "mt-1",
                       rows: "4",
                       placeholder: "请输入Token"
                     }, null, 8, ["value"])
                   ])
-                ])) : T("", !0)
+                ])) : R("", !0)
               ]),
               _: 1
             }),
-            l(E, {
+            s(P, {
               title: "请求头",
               class: "form-section",
               size: "small"
             }, {
-              default: d(() => [
-                l(D, {
-                  modelValue: B.value,
-                  "onUpdate:modelValue": e[8] || (e[8] = (p) => B.value = p),
+              default: r(() => [
+                s(L, {
+                  modelValue: j.value,
+                  "onUpdate:modelValue": e[8] || (e[8] = (m) => j.value = m),
                   "add-button-text": "添加请求头",
                   "show-preview": !1
                 }, null, 8, ["modelValue"])
               ]),
               _: 1
             }),
-            n.value === "POST" || n.value === "PUT" ? (g(), z(E, {
+            n.value === "POST" || n.value === "PUT" ? (_(), O(P, {
               key: 0,
               title: "请求体",
               class: "form-section",
               size: "small"
             }, {
-              default: d(() => [
-                l(H, {
+              default: r(() => [
+                s(G, {
                   value: U.value,
-                  "onUpdate:value": e[9] || (e[9] = (p) => U.value = p),
+                  "onUpdate:value": e[9] || (e[9] = (m) => U.value = m),
                   "button-style": "solid",
                   size: "small",
                   class: "mb-1"
                 }, {
-                  default: d(() => [
-                    l(P, { value: "application/json" }, {
-                      default: d(() => e[25] || (e[25] = [
-                        _("JSON")
+                  default: r(() => [
+                    s(q, { value: "application/json" }, {
+                      default: r(() => e[25] || (e[25] = [
+                        b("JSON")
                       ])),
                       _: 1
                     }),
-                    l(P, { value: "multipart/form-data" }, {
-                      default: d(() => e[26] || (e[26] = [
-                        _("Form Data")
+                    s(q, { value: "multipart/form-data" }, {
+                      default: r(() => e[26] || (e[26] = [
+                        b("Form Data")
                       ])),
                       _: 1
                     }),
-                    l(P, { value: "text/plain" }, {
-                      default: d(() => e[27] || (e[27] = [
-                        _("Raw")
+                    s(q, { value: "text/plain" }, {
+                      default: r(() => e[27] || (e[27] = [
+                        b("Raw")
                       ])),
                       _: 1
                     })
                   ]),
                   _: 1
                 }, 8, ["value"]),
-                U.value === "application/json" ? (g(), R(A, { key: 0 }, [
-                  l(N, {
+                U.value === "application/json" ? (_(), $(F, { key: 0 }, [
+                  s(I, {
                     value: k.value,
-                    "onUpdate:value": e[10] || (e[10] = (p) => k.value = p),
+                    "onUpdate:value": e[10] || (e[10] = (m) => k.value = m),
                     rows: 6,
                     placeholder: "请输入 JSON 数据",
-                    onInput: Q
+                    onInput: Y
                   }, null, 8, ["value"]),
-                  j.value ? (g(), z(te, {
+                  h.value ? (_(), O(ae, {
                     key: 0,
                     type: "error",
-                    message: j.value,
+                    message: h.value,
                     banner: "",
                     style: { "margin-bottom": "8px" }
-                  }, null, 8, ["message"])) : T("", !0)
-                ], 64)) : T("", !0),
-                U.value === "multipart/form-data" ? (g(), z(D, {
+                  }, null, 8, ["message"])) : R("", !0)
+                ], 64)) : R("", !0),
+                U.value === "multipart/form-data" ? (_(), O(L, {
                   key: 1,
-                  modelValue: $.value,
-                  "onUpdate:modelValue": e[11] || (e[11] = (p) => $.value = p),
+                  modelValue: B.value,
+                  "onUpdate:modelValue": e[11] || (e[11] = (m) => B.value = m),
                   "add-button-text": "添加表单字段",
                   "show-preview": !1
-                }, null, 8, ["modelValue"])) : T("", !0),
-                U.value === "text/plain" ? (g(), z(N, {
+                }, null, 8, ["modelValue"])) : R("", !0),
+                U.value === "text/plain" ? (_(), O(I, {
                   key: 2,
                   value: S.value,
-                  "onUpdate:value": e[12] || (e[12] = (p) => S.value = p),
+                  "onUpdate:value": e[12] || (e[12] = (m) => S.value = m),
                   rows: 6,
                   placeholder: "请输入原始数据"
-                }, null, 8, ["value"])) : T("", !0),
-                h("pre", null, J(X.value), 1)
+                }, null, 8, ["value"])) : R("", !0),
+                p("pre", null, z(Q.value), 1)
               ]),
               _: 1
-            })) : T("", !0)
+            })) : R("", !0)
           ]),
           _: 1
         })
       ]);
     };
   }
-}), Te = /* @__PURE__ */ G(ke, [["__scopeId", "data-v-c9f65487"]]);
-async function Se(t, x = "xhr") {
-  return x === "fetch" ? be(t) : he(t);
+}), Ee = /* @__PURE__ */ M(we, [["__scopeId", "data-v-c9f65487"]]);
+async function ge(a, g = "xhr") {
+  return g === "fetch" ? ke(a) : he(a);
 }
-async function be(t) {
-  var f;
-  const x = t.params.filter((a) => !!a.key).map((a) => `${a.key}=${encodeURIComponent(a.value)}`).join("&"), r = `${t.url}${t.path}${x ? "?" + x : ""}`, s = new Headers();
-  t.headers.forEach((a) => {
-    a.key && s.append(a.key, a.value);
+async function ke(a) {
+  var y;
+  const g = a.params.filter((l) => !!l.key).map((l) => `${l.key}=${encodeURIComponent(l.value)}`).join("&"), d = `${a.url}${a.path}${g ? "?" + g : ""}`, o = new Headers();
+  a.headers.forEach((l) => {
+    l.key && o.append(l.key, l.value);
   });
   const n = {
-    method: t.method,
-    headers: s,
+    method: a.method,
+    headers: o,
     credentials: "omit"
   };
-  if (t.auth.type === "Basic" && t.auth.username && t.auth.password) {
-    const a = btoa(`${t.auth.username}:${t.auth.password}`);
-    s.append("Authorization", `Basic ${a}`);
-  } else t.auth.type === "Bearer" && t.auth.token && s.append("Authorization", `Bearer ${t.auth.token}`);
-  if (t.method === "POST" || t.method === "PUT")
-    switch (t.body.type) {
+  if (a.auth.type === "Basic" && a.auth.username && a.auth.password) {
+    const l = btoa(`${a.auth.username}:${a.auth.password}`);
+    o.append("Authorization", `Basic ${l}`);
+  } else a.auth.type === "Bearer" && a.auth.token && o.append("Authorization", `Bearer ${a.auth.token}`);
+  if (a.method === "POST" || a.method === "PUT")
+    switch (a.body.type) {
       case "application/json":
-        n.body = t.body.json || "", s.set("Content-Type", "application/json; charset=utf-8");
+        n.body = a.body.json || "", o.set("Content-Type", "application/json; charset=utf-8");
         break;
       case "multipart/form-data":
-        const a = new FormData();
-        (f = t.body.formData) == null || f.forEach((v) => {
-          v.key && a.append(v.key, v.value);
-        }), n.body = a;
+        const l = new FormData();
+        (y = a.body.formData) == null || y.forEach((f) => {
+          f.key && l.append(f.key, f.value);
+        }), n.body = l;
         break;
       case "text/plain":
-        n.body = t.body.raw || "", s.set("Content-Type", "text/plain; charset=utf-8");
+        n.body = a.body.raw || "", o.set("Content-Type", "text/plain; charset=utf-8");
         break;
     }
   try {
-    const a = await fetch(r, n), v = {};
-    a.headers.forEach((m, c) => {
-      v[c.toLowerCase()] = m;
+    const l = await fetch(d, n), f = {};
+    l.headers.forEach((v, x) => {
+      f[x.toLowerCase()] = v;
     });
-    let i = "";
-    if ((v["content-type"] || "").startsWith("application/json"))
+    let u = "";
+    if ((f["content-type"] || "").startsWith("application/json"))
       try {
-        const m = await a.json();
-        i = JSON.stringify(m, null, 2);
+        const v = await l.json();
+        u = JSON.stringify(v, null, 2);
       } catch {
-        i = await a.text();
+        u = await l.text();
       }
     else
-      i = await a.text();
+      u = await l.text();
     return {
-      status: a.status.toString(),
-      headers: v,
-      body: i
+      status: l.status.toString(),
+      headers: f,
+      body: u
     };
   } catch {
     throw new Error("Request failed");
   }
 }
-async function he(t) {
-  return new Promise((x, r) => {
-    var i;
-    const s = new XMLHttpRequest(), n = t.auth.type === "Basic" ? t.auth.username : null, f = t.auth.type === "Basic" ? t.auth.password : null, a = t.params.filter((u) => !!u.key).map((u) => `${u.key}=${encodeURIComponent(u.value)}`).join("&"), v = `${t.url}${t.path}${a ? "?" + a : ""}`;
-    if (s.open(t.method, v, !0, n, f), t.headers.forEach((u) => {
-      u.key && s.setRequestHeader(u.key, u.value);
-    }), t.auth.type === "Bearer" && t.auth.token && s.setRequestHeader("Authorization", `Bearer ${t.auth.token}`), t.method === "POST" || t.method === "PUT") {
-      let u = "";
-      switch (t.body.type) {
+async function he(a) {
+  return new Promise((g, d) => {
+    var u;
+    const o = new XMLHttpRequest(), n = a.auth.type === "Basic" ? a.auth.username : null, y = a.auth.type === "Basic" ? a.auth.password : null, l = a.params.filter((t) => !!t.key).map((t) => `${t.key}=${encodeURIComponent(t.value)}`).join("&"), f = `${a.url}${a.path}${l ? "?" + l : ""}`;
+    if (o.open(a.method, f, !0, n, y), a.headers.forEach((t) => {
+      t.key && o.setRequestHeader(t.key, t.value);
+    }), a.auth.type === "Bearer" && a.auth.token && o.setRequestHeader("Authorization", `Bearer ${a.auth.token}`), a.method === "POST" || a.method === "PUT") {
+      let t = "";
+      switch (a.body.type) {
         case "application/json":
-          u = t.body.json || "", s.setRequestHeader("Content-Type", "application/json; charset=utf-8");
+          t = a.body.json || "", o.setRequestHeader("Content-Type", "application/json; charset=utf-8");
           break;
         case "multipart/form-data":
-          const m = new FormData();
-          (i = t.body.formData) == null || i.forEach((c) => {
-            c.key && m.append(c.key, c.value);
-          }), u = m;
+          const v = new FormData();
+          (u = a.body.formData) == null || u.forEach((x) => {
+            x.key && v.append(x.key, x.value);
+          }), t = v;
           break;
         case "text/plain":
-          u = t.body.raw || "", s.setRequestHeader("Content-Type", "text/plain; charset=utf-8");
+          t = a.body.raw || "", o.setRequestHeader("Content-Type", "text/plain; charset=utf-8");
           break;
       }
-      s.send(u);
+      o.send(t);
     } else
-      s.send();
-    s.onload = () => {
-      const u = ge(s), m = {
-        status: s.status.toString(),
-        headers: u,
+      o.send();
+    o.onload = () => {
+      const t = Ue(o), v = {
+        status: o.status.toString(),
+        headers: t,
         body: ""
       };
-      if ((u["content-type"] || "").startsWith("application/json"))
+      if ((t["content-type"] || "").startsWith("application/json"))
         try {
-          m.body = JSON.stringify(JSON.parse(s.responseText), null, 2);
+          v.body = JSON.stringify(JSON.parse(o.responseText), null, 2);
         } catch {
-          m.body = s.responseText;
+          v.body = o.responseText;
         }
       else
-        m.body = s.responseText;
-      x(m);
-    }, s.onerror = () => {
-      r(new Error("Request failed"));
+        v.body = o.responseText;
+      g(v);
+    }, o.onerror = () => {
+      d(new Error("Request failed"));
     };
   });
 }
-function ge(t) {
-  const x = t.getAllResponseHeaders().trim().split(/[\r\n]+/), r = {};
-  return x.forEach(function(s) {
-    var v;
-    const n = s.split(": "), f = ((v = n.shift()) == null ? void 0 : v.toLowerCase()) || "", a = n.join(": ");
-    r[f] = a;
-  }), r;
+function Ue(a) {
+  const g = a.getAllResponseHeaders().trim().split(/[\r\n]+/), d = {};
+  return g.forEach(function(o) {
+    var f;
+    const n = o.split(": "), y = ((f = n.shift()) == null ? void 0 : f.toLowerCase()) || "", l = n.join(": ");
+    d[y] = l;
+  }), d;
 }
+const Te = { style: { display: "flex", "align-items": "center", gap: "8px", "margin-bottom": "8px" } }, $e = { class: "flex flex-col gap-2" }, Se = { class: "flex flex-col gap-1" }, Re = {
+  key: 0,
+  class: "border border-solid border-gray-300 w-full"
+}, je = { class: "border border-gray-300" }, Be = { class: "border border-gray-300" }, Oe = { key: 1 }, Ve = /* @__PURE__ */ H({
+  __name: "ResponseSection",
+  props: {
+    modelValue: {}
+  },
+  setup(a) {
+    const g = a, d = w("xhr"), o = w({
+      status: "",
+      headers: {},
+      body: "",
+      timing: 0
+    }), n = w(""), y = (u) => {
+      const t = Number(u);
+      return t >= 200 && t < 300 ? "success" : t >= 300 && t < 400 ? "warning" : t >= 400 && t < 500 || t >= 500 ? "error" : "default";
+    }, l = (u) => u instanceof Error ? u.message : "请求失败", f = async () => {
+      n.value = "";
+      const u = Date.now();
+      try {
+        o.value = await ge(g.modelValue, d.value), o.value.timing = Date.now() - u;
+      } catch (t) {
+        n.value = l(t), o.value = {
+          status: "Error",
+          headers: {},
+          body: t instanceof Error ? t.message : "Request failed",
+          timing: Date.now() - u
+        };
+      }
+    };
+    return (u, t) => {
+      const v = c("a-radio-button"), x = c("a-radio-group"), j = c("a-button"), B = c("a-alert"), U = c("a-tag"), k = c("a-textarea"), S = c("a-card");
+      return _(), O(S, {
+        title: "响应",
+        class: "form-section",
+        size: "small"
+      }, {
+        default: r(() => [
+          p("div", Te, [
+            s(x, {
+              value: d.value,
+              "onUpdate:value": t[0] || (t[0] = (h) => d.value = h),
+              "button-style": "solid",
+              size: "small"
+            }, {
+              default: r(() => [
+                s(v, { value: "xhr" }, {
+                  default: r(() => t[2] || (t[2] = [
+                    b("XMLHttpRequest")
+                  ])),
+                  _: 1
+                }),
+                s(v, { value: "fetch" }, {
+                  default: r(() => t[3] || (t[3] = [
+                    b("Fetch")
+                  ])),
+                  _: 1
+                })
+              ]),
+              _: 1
+            }, 8, ["value"]),
+            s(j, {
+              type: "primary",
+              onClick: f,
+              size: "small"
+            }, {
+              default: r(() => t[4] || (t[4] = [
+                b("发送")
+              ])),
+              _: 1
+            })
+          ]),
+          n.value ? (_(), O(B, {
+            key: 0,
+            message: n.value,
+            type: "error",
+            "show-icon": "",
+            style: { "margin-bottom": "8px" }
+          }, null, 8, ["message"])) : R("", !0),
+          p("div", $e, [
+            t[7] || (t[7] = p("div", { class: "text-sm font-bold" }, "基本信息", -1)),
+            p("div", Se, [
+              p("div", null, [
+                t[5] || (t[5] = p("span", null, "状态码:", -1)),
+                s(U, {
+                  color: y(o.value.status)
+                }, {
+                  default: r(() => [
+                    b(z(o.value.status), 1)
+                  ]),
+                  _: 1
+                }, 8, ["color"])
+              ]),
+              p("div", null, [
+                t[6] || (t[6] = p("span", null, "耗时:", -1)),
+                p("span", null, z(o.value.timing ? `${o.value.timing}ms` : "-"), 1)
+              ])
+            ]),
+            t[8] || (t[8] = p("div", { class: "text-sm font-bold" }, "响应头", -1)),
+            Object.keys(o.value.headers).length > 0 ? (_(), $("table", Re, [
+              p("tbody", null, [
+                (_(!0), $(F, null, K(Object.entries(o.value.headers), ([h, N]) => (_(), $("tr", { key: h }, [
+                  p("td", je, z(h), 1),
+                  p("td", Be, z(N), 1)
+                ]))), 128))
+              ])
+            ])) : (_(), $("p", Oe, "无响应头")),
+            t[9] || (t[9] = p("div", { class: "text-sm font-bold" }, "响应体", -1)),
+            s(k, {
+              value: o.value.body,
+              "onUpdate:value": t[1] || (t[1] = (h) => o.value.body = h),
+              rows: 5,
+              readonly: "",
+              style: { width: "100%" },
+              size: "small"
+            }, null, 8, ["value"])
+          ])
+        ]),
+        _: 1
+      });
+    };
+  }
+}), qe = /* @__PURE__ */ M(Ve, [["__scopeId", "data-v-1dd2b288"]]);
 export {
-  D as KeyValueInput,
-  Te as RequestForm,
-  Te as default,
+  L as KeyValueInput,
+  Ee as RequestForm,
+  qe as ResponseSection,
+  Ee as default,
   de as defaultRequestSchema,
-  Se as executeRequest
+  ge as executeRequest
 };