snowy-designer/dist/ui-kit/panel-ui/src/rightSidebars/dataModal/index.vue.js

基于Epic-Designer-Pro版本的设计器,可视化开发页面表单

import { defineComponent as T, inject as x, ref as i, getCurrentInstance as $, createBlock as j, openBlock as s, unref as m, withCtx as F, createElementBlock as v, createCommentVNode as V, createElementVNode as A, createVNode as c, Fragment as W, renderList as q, nextTick as z } from "vue";
/* empty css                                 */
import "radix-vue";
import "clsx";
import "tailwind-merge";
import "lucide-vue-next";
import "../../../../base-ui/src/shadch-ui/button/index.js";
import "@vueuse/core";
import "../../../../base-ui/src/shadch-ui/toast/index.js";
import k from "../../../../base-ui/src/components/node/node.vue.js";
import "../../../../../hooks/src/store/index.js";
import "lodash";
import { pluginManager as C } from "../../../../../utils/src/manager/pluginManager.js";
import "monaco-editor";
import "../../../../../utils/src/request/index.js";
import "vuedraggable";
import G from "../../activitybars/dataSource/index.vue.js";
const H = {
  key: 0,
  class: "flex h-full"
}, K = { class: "h-full flex-1 overflow-auto" }, Q = { key: 0 }, ve = /* @__PURE__ */ T({
  __name: "index",
  emits: ["register"],
  setup(X, { expose: y, emit: N }) {
    const I = N, O = C.getComponent("modal"), E = C.getComponent("form"), h = x("designer"), w = x("pageSchema"), S = i(), J = {
      componentProps: { labelLayout: "fixed", labelWidth: "90px" }
    }, P = [
      {
        field: "url",
        label: "地址",
        type: "input"
      },
      {
        componentProps: {
          options: [
            {
              label: "get",
              value: "get"
            },
            {
              label: "post",
              value: "post"
            },
            {
              label: "put",
              value: "put"
            },
            {
              label: "delete",
              value: "delete"
            }
          ]
        },
        field: "method",
        label: "请求方式",
        type: "select"
      },
      {
        componentProps: {
          defaultValue: "JSON",
          options: [
            {
              label: "JSON",
              value: "JSON"
            },
            {
              label: "FormData",
              value: "FormData"
            },
            {
              label: "Form",
              value: "Form"
            }
          ],
          optionType: "button"
        },
        field: "dataFormat",
        label: "数据格式",
        type: "radio"
      },
      {
        field: "data",
        label: "参数",
        type: "EOptionsEditor"
      }
    ], U = {
      label: "数据字段",
      type: "input"
    }, n = i(!1), p = i({ type: "" }), l = i({
      dataFormat: "JSON",
      id: "",
      method: "get",
      params: {},
      serviceId: "",
      url: ""
    }), d = i({});
    function B(t) {
      var r, b;
      p.value = t, n.value = !0;
      const a = ((r = w.globalApiConfig) == null ? void 0 : r.apis) || [], e = (b = h.state.selectedNode) == null ? void 0 : b.dataSource;
      if (!e || a.length === 0) return;
      const o = e.find(
        (u) => u.field === t.field
      );
      o && (d.value = o, a.forEach((u, M) => {
        u.id === o.apiId && z(() => {
          var _;
          (_ = S.value) == null || _.handleClickItem(u, M);
        });
      }));
    }
    function f() {
      n.value = !1, D();
    }
    function D() {
      d.value = {}, l.value = {
        dataFormat: "JSON",
        id: "",
        method: "get",
        params: {},
        serviceId: "",
        url: ""
      };
    }
    function R(t) {
      l.value = t;
    }
    function L() {
      const t = h.state.selectedNode;
      if (!t) return;
      const a = {
        apiId: l.value.id,
        dataField: d.value.dataField,
        field: p.value.field
        // adapter: adapter.value // 如果需要，取消注释
      };
      if (t.dataSource) {
        const e = t.dataSource.findIndex(
          (o) => o.field === p.value.field
        );
        e === -1 ? t.dataSource.push(a) : t.dataSource[e] = a;
      } else
        t.dataSource = [a];
      f();
    }
    y({
      handleClose: f,
      handleOpen: B
    });
    const g = $();
    return g && I("register", g), (t, a) => (s(), j(m(O), {
      modelValue: n.value,
      "onUpdate:modelValue": a[1] || (a[1] = (e) => n.value = e),
      title: "数据配置",
      class: "w-900px",
      width: "900px",
      "ok-text": "保存",
      onClose: f,
      onOk: L
    }, {
      default: F(() => [
        n.value ? (s(), v("div", H, [
          A("div", K, [
            l.value.serviceId ? (s(), v("div", Q, [
              c(m(E), { "component-schema": J }, {
                default: F(() => [
                  (s(), v(W, null, q(P, (e, o) => c(m(k), {
                    key: o,
                    modelValue: l.value[e.field],
                    "onUpdate:modelValue": (r) => l.value[e.field] = r,
                    "component-schema": { ...e }
                  }, null, 8, ["modelValue", "onUpdate:modelValue", "component-schema"])), 64)),
                  c(m(k), {
                    modelValue: d.value.dataField,
                    "onUpdate:modelValue": a[0] || (a[0] = (e) => d.value.dataField = e),
                    "component-schema": U
                  }, null, 8, ["modelValue"])
                ]),
                _: 1
              })
            ])) : V("", !0)
          ]),
          c(G, {
            ref_key: "dataSourceEditRef",
            ref: S,
            selectable: "",
            class: "w-240px",
            onClickItem: R
          }, null, 512)
        ])) : V("", !0)
      ]),
      _: 1
    }, 8, ["modelValue"]));
  }
});
export {
  ve as default
};