@kp-ui/lowcode-pc 1.0.0

package/assets/useSelect.mjs

@@ -0,0 +1,226 @@
+import { ref, computed, unref } from "vue";
+import { debounce, isArray } from "lodash-es";
+import { useExecFunction } from "tmgc2-share";
+import { t as translateOptionItems } from "./install.mjs";
+function findInArray(arrayObject, element) {
+  if (!Array.isArray(arrayObject)) {
+    return -1;
+  }
+  let foundIdx = -1;
+  arrayObject.forEach((aItem, aIdx) => {
+    if (aItem === element) {
+      foundIdx = aIdx;
+    }
+  });
+  return foundIdx;
+}
+function useSelect({ field, designState, fieldModel }) {
+  const keyword = ref({
+    val: ""
+  });
+  const loading = ref(false);
+  const pager = ref({
+    page: 1,
+    pageSize: 20,
+    totalPage: 0,
+    total: 0
+  });
+  const { execHttpFunction } = useExecFunction();
+  const initOptionItems = async () => {
+    var _a;
+    if (loading.value) return;
+    loading.value = true;
+    if (!!field.options.dsEnabled && ((_a = field.options.http) == null ? void 0 : _a.url)) {
+      if (pager.value.page === 1) initPager();
+      try {
+        const { http, dataHandlerCode, dataReqHandlerCode } = field.options;
+        const data = field.options.loadingPage ? { page: pager.value.page, pageSize: pager.value.pageSize } : {};
+        const dsResult = await execHttpFunction(
+          {
+            http,
+            dataHandlerCode,
+            dataReqHandlerCode
+          },
+          { data }
+        );
+        if (!dsResult) {
+          loading.value = false;
+          return;
+        }
+        if (isArray(dsResult)) {
+          loadOptions(dsResult);
+          loading.value = false;
+          return;
+        }
+        if (isArray(dsResult.list)) {
+          if (field.options.loadingPage) {
+            pager.value.total = dsResult.total || 0;
+            pager.value.totalPage = dsResult.totalPage || 0;
+            loadOptions([...getOptionItems(), ...dsResult.list]);
+          } else {
+            loadOptions(dsResult.list);
+          }
+        }
+      } catch (err) {
+        console.error("err: ", err);
+      }
+    } else {
+      loadOptions([...getOptionItems()]);
+    }
+    loading.value = false;
+  };
+  const changePager = debounce(function() {
+    pager.value.page += 1;
+    initOptionItems();
+  }, 500);
+  const onPopupScroll = (e) => {
+    if (!field.options.loadingPage) return;
+    const { target } = e;
+    const { scrollTop, scrollHeight, clientHeight } = target;
+    if (scrollHeight - (scrollTop + clientHeight) <= 30) {
+      if (pager.value.totalPage > pager.value.page) {
+        if (pager.value.totalPage === pager.value.page) {
+          return;
+        }
+        changePager();
+      }
+    }
+  };
+  const labelKey = computed(() => {
+    return (field == null ? void 0 : field.options.labelKey) || "label";
+  });
+  const valueKey = computed(() => {
+    return (field == null ? void 0 : field.options.valueKey) || "value";
+  });
+  const childrenKey = computed(() => {
+    return (field == null ? void 0 : field.options.childrenKey) || "children";
+  });
+  const fieldNames = computed(() => {
+    return {
+      label: (field == null ? void 0 : field.options.labelKey) || "label",
+      value: (field == null ? void 0 : field.options.valueKey) || "value",
+      options: "options"
+    };
+  });
+  const filterOption = (inputValue, option) => {
+    return option[fieldNames.value.label].toLowerCase().indexOf(inputValue.toLowerCase()) >= 0;
+  };
+  const initPager = () => {
+    pager.value = { page: 1, pageSize: 20, total: 0, totalPage: 0 };
+    loadOptions([]);
+  };
+  const remoteQuery = (_keyword) => {
+    const useServer = field.options.showSearch;
+    if (!useServer) return;
+    if (designState) {
+      return;
+    }
+    initPager();
+    keyword.value.val = _keyword;
+    initOptionItems();
+  };
+  const selectOps = computed(() => {
+    var _a;
+    const showSearch = true;
+    const useServer = (_a = field == null ? void 0 : field.options) == null ? void 0 : _a.showSearch;
+    return {
+      loading: loading.value,
+      fieldNames: fieldNames.value,
+      showSearch,
+      onPopupScroll,
+      onSearch: remoteQuery,
+      filterOption: !useServer && filterOption,
+      listHeight: 240
+    };
+  });
+  const loadOptions = async (options) => {
+    field.options.optionItems = translateOptionItems(
+      options,
+      field.type,
+      field.options.labelKey || "label",
+      field.options.valueKey || "value"
+    );
+    if (designState) {
+      return;
+    }
+  };
+  const getOptionItems = () => {
+    return field.options.optionItems;
+  };
+  const getSelectedItem = () => {
+    const list = getOptionItems();
+    if (isArray(fieldModel.value)) {
+      return list.filter((item) => findInArray(fieldModel.value, item[valueKey.value]) !== -1);
+    }
+    return list.find((item) => item[valueKey.value] == fieldModel.value);
+  };
+  const optionLabel = computed(() => {
+    if (fieldModel.value === null) {
+      return "";
+    } else {
+      let resultContent = "";
+      const { valueKey: valueKey2, labelKey: labelKey2 } = field.options;
+      field.options.optionItems.forEach((oItem) => {
+        if (oItem[valueKey2] === fieldModel.value || findInArray(fieldModel.value, oItem[valueKey2]) !== -1) {
+          resultContent = resultContent === "" ? oItem[labelKey2] : resultContent + " " + oItem[labelKey2];
+        }
+      });
+      return resultContent;
+    }
+  });
+  const clearOptionItems = () => {
+    if (field.options.dsEnabled) {
+      field.options.optionItems.splice(0, field.options.optionItems.length);
+    }
+  };
+  const disableOption = (optionValue) => {
+    const optionList = field.options.optionItems;
+    if (optionList && optionList.length > 0) {
+      optionList.forEach((opt) => {
+        if (opt.value === optionValue) {
+          opt.disabled = true;
+        }
+      });
+    }
+  };
+  const enableOption = (optionValue) => {
+    const optionList = field.options.optionItems;
+    if (optionList && optionList.length > 0) {
+      optionList.forEach((opt) => {
+        if (opt.value === optionValue) {
+          opt.disabled = false;
+        }
+      });
+    }
+  };
+  return {
+    selectDefineExpose: {
+      loadOptions,
+      initOptionItems,
+      getSelectedItem,
+      disableOption,
+      clearOptionItems,
+      enableOption,
+      getOptionItems,
+      keyword: unref(keyword)
+    },
+    disableOption,
+    clearOptionItems,
+    childrenKey,
+    valueKey,
+    labelKey,
+    optionLabel,
+    loadOptions,
+    filterOption,
+    keyword,
+    pager,
+    loading,
+    fieldNames,
+    selectOps,
+    initOptionItems,
+    getOptionItems
+  };
+}
+export {
+  useSelect as u
+};

package/assets/vf-box-widget.mjs

@@ -0,0 +1,67 @@
+import { defineComponent, computed, createElementBlock, createCommentVNode, unref, openBlock, normalizeStyle, createVNode } from "vue";
+import { C as ComponentNameEnum, e as ContainerTypeEnum, h as useField, R as RenderWidgetList, _ as _export_sfc } from "./install.mjs";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: ContainerTypeEnum.VfBoxWidget,
+    componentName: ComponentNameEnum.VfBoxWidget
+  },
+  __name: "vf-box-widget",
+  props: {
+    widget: {},
+    field: {},
+    parentWidget: {},
+    indexOfParentList: {},
+    subFormRowIndex: {},
+    subFormRowId: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const { handleHidden, defineExposed } = useField(props);
+    const boxStyle = computed(() => {
+      const boxModel = props.widget.options.boxModel || {};
+      const style = {};
+      if (props.widget.options.width) {
+        style.width = "100%";
+        style.height = "100%";
+      }
+      if (boxModel.borderShow) {
+        style.borderRadius = `${boxModel.borderRadius}px`;
+        style.border = `${boxModel.borderStyle} ${boxModel.borderWidth}px ${boxModel.borderColor}`;
+      }
+      if (boxModel.paddingTop !== void 0 || boxModel.paddingRight !== void 0 || boxModel.paddingBottom !== void 0 || boxModel.paddingLeft !== void 0) {
+        style.padding = `${boxModel.paddingTop || 0}px ${boxModel.paddingRight || 0}px ${boxModel.paddingBottom || 0}px ${boxModel.paddingLeft || 0}px`;
+      }
+      if (boxModel.marginTop !== void 0 || boxModel.marginRight !== void 0 || boxModel.marginBottom !== void 0 || boxModel.marginLeft !== void 0) {
+        style.margin = `${boxModel.marginTop || 0}px ${boxModel.marginRight || 0}px ${boxModel.marginBottom || 0}px ${boxModel.marginLeft || 0}px`;
+      }
+      if (boxModel.backgroundColor) {
+        style.backgroundColor = boxModel.backgroundColor;
+      }
+      if (boxModel.shadowShow) {
+        style.boxShadow = `${boxModel.shadowOffsetX || 0}px ${boxModel.shadowOffsetY || 0}px ${boxModel.shadowBlur || 0}px ${boxModel.shadowSpread || 0}px ${boxModel.shadowColor || "rgba(0,0,0,0.2)"}`;
+      }
+      return style;
+    });
+    __expose({
+      ...defineExposed
+    });
+    return (_ctx, _cache) => {
+      return !unref(handleHidden) ? (openBlock(), createElementBlock("div", {
+        class: "box-container",
+        key: _ctx.widget.id,
+        style: normalizeStyle(boxStyle.value)
+      }, [
+        createVNode(unref(RenderWidgetList), {
+          list: _ctx.widget.widgetList,
+          "onUpdate:list": _cache[0] || (_cache[0] = ($event) => _ctx.widget.widgetList = $event),
+          parentWidget: _ctx.widget,
+          parentList: _ctx.widget.widgetList
+        }, null, 8, ["list", "parentWidget", "parentList"])
+      ], 4)) : createCommentVNode("", true);
+    };
+  }
+});
+const vfBoxWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e33faf2b"]]);
+export {
+  vfBoxWidget as default
+};

package/assets/vf-collapse-widget.mjs

@@ -0,0 +1,70 @@
+import { defineComponent, computed, createElementBlock, createCommentVNode, unref, openBlock, createVNode, withCtx, withDirectives, createElementVNode, normalizeStyle, vShow } from "vue";
+import { TpfCollapse } from "tmgc2-share";
+import { C as ComponentNameEnum, e as ContainerTypeEnum, h as useField, R as RenderWidgetList, _ as _export_sfc } from "./install.mjs";
+const _hoisted_1 = {
+  key: 0,
+  class: "collapse-container"
+};
+const _hoisted_2 = { class: "collapse-right" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: ContainerTypeEnum.VfCollapseWidget,
+    componentName: ComponentNameEnum.ContainerWidget
+  },
+  __name: "vf-collapse-widget",
+  props: {
+    widget: {},
+    field: {},
+    parentWidget: {},
+    indexOfParentList: {},
+    subFormRowIndex: {},
+    subFormRowId: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    computed(() => props.widget.defaultSlotsList || []);
+    computed(() => props.widget.headerRightSlotList || []);
+    const { handleHidden, defineExposed } = useField(props);
+    __expose({
+      ...defineExposed
+    });
+    return (_ctx, _cache) => {
+      return !unref(handleHidden) ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(unref(TpfCollapse), {
+          title: _ctx.widget.options.title
+        }, {
+          right: withCtx(() => [
+            createElementVNode("div", _hoisted_2, [
+              createVNode(unref(RenderWidgetList), {
+                list: _ctx.widget.headerRightSlotList,
+                "onUpdate:list": _cache[0] || (_cache[0] = ($event) => _ctx.widget.headerRightSlotList = $event),
+                parentWidget: _ctx.widget
+              }, null, 8, ["list", "parentWidget"])
+            ])
+          ]),
+          default: withCtx(() => [
+            withDirectives(createElementVNode("div", {
+              class: "tpf-collapse-content-wrapper",
+              style: normalizeStyle({
+                height: _ctx.widget.options.height || "unset"
+              })
+            }, [
+              createVNode(unref(RenderWidgetList), {
+                list: _ctx.widget.defaultSlotsList,
+                "onUpdate:list": _cache[1] || (_cache[1] = ($event) => _ctx.widget.defaultSlotsList = $event),
+                parentWidget: _ctx.widget
+              }, null, 8, ["list", "parentWidget"])
+            ], 4), [
+              [vShow, !_ctx.widget.options.isCollapse]
+            ])
+          ]),
+          _: 1
+        }, 8, ["title"])
+      ])) : createCommentVNode("", true);
+    };
+  }
+});
+const vfCollapseWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3032d8b6"]]);
+export {
+  vfCollapseWidget as default
+};

package/assets/vf-dialog-widget.mjs

@@ -0,0 +1,61 @@
+import { defineComponent, createElementBlock, openBlock, createElementVNode, toDisplayString, createVNode, unref } from "vue";
+import { C as ComponentNameEnum, e as ContainerTypeEnum, a as useAppRef, A as ActionButtonListRender, _ as _export_sfc } from "./install.mjs";
+import "ant-design-vue";
+import "@kp-ui/tool";
+import "lodash-es";
+import "tmgc2-share";
+import "vue-router";
+const _hoisted_1 = { class: "dialog-title" };
+const _hoisted_2 = { class: "right-btns" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: ContainerTypeEnum.VfDialogWidget,
+    componentName: ComponentNameEnum.VfDialogWidget
+  },
+  __name: "vf-dialog-widget",
+  props: {
+    widget: {},
+    field: {},
+    parentWidget: {},
+    indexOfParentList: {},
+    subFormRowIndex: {},
+    subFormRowId: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { initRefList } = useAppRef();
+    const handleClickTitle = () => {
+      const url = new URL(window.location.href);
+      const { title, formCode, formId } = props.widget.options;
+      if (formId) {
+        url.searchParams.set("formCode", formCode);
+        url.searchParams.set("remark", title);
+        url.searchParams.set("id", formId);
+        window.open(url.href);
+      }
+    };
+    initRefList();
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "dialog-container",
+        key: _ctx.widget.id
+      }, [
+        createElementVNode("div", _hoisted_1, [
+          createElementVNode("span", {
+            class: "tpf-link",
+            onClick: handleClickTitle
+          }, toDisplayString(_ctx.widget.options.title), 1)
+        ]),
+        createElementVNode("div", _hoisted_2, [
+          createVNode(unref(ActionButtonListRender), {
+            buttonList: _ctx.widget.options.buttonList || []
+          }, null, 8, ["buttonList"])
+        ])
+      ]);
+    };
+  }
+});
+const vfDialogWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-59c990aa"]]);
+export {
+  vfDialogWidget as default
+};

package/assets/vue-render-widget.mjs

@@ -0,0 +1,93 @@
+import { defineComponent, createBlock, createCommentVNode, unref, openBlock, mergeProps, withCtx, createElementVNode, resolveDynamicComponent, toRefs } from "vue";
+import FormItemWrapper from "./form-item-wrapper.mjs";
+import { u as useField } from "./useField.mjs";
+import { C as ComponentNameEnum, W as WidgetTypeEnum } from "./install.mjs";
+const _hoisted_1 = { class: "slot-wrapper-render" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: WidgetTypeEnum.vueRender,
+    componentName: ComponentNameEnum.FieldWidget
+  },
+  __name: "vue-render-widget",
+  props: {
+    widget: {},
+    field: {},
+    designer: {},
+    parentWidget: {},
+    parentList: {},
+    indexOfParentList: {},
+    subFormRowIndex: {},
+    subFormRowId: {},
+    subFormColIndex: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const { rules, fieldEditor, field, fieldModel, handleHidden, defineExposed, executeFunction } = useField(props);
+    const renderCompont = () => {
+      if (field.options.template) {
+        const sfcString = field.options.template;
+        const templateMatch = sfcString.match(/<template>([\s\S]*)<\/template>/);
+        const scriptMatch = sfcString.match(/<script.*?>([\s\S]*)<\/script>/);
+        const styleMatch = sfcString.match(/<style.*?>([\s\S]*)<\/style>/);
+        const template = templateMatch ? templateMatch[1] : "";
+        let scriptContent = scriptMatch ? scriptMatch[1] : "export default {}";
+        const style = styleMatch ? styleMatch[1] : "";
+        if (style) {
+          const styleId = `vue-render-style-${field.options.name}`;
+          if (!document.getElementById(styleId)) {
+            const styleTag = document.createElement("style");
+            styleTag.id = styleId;
+            styleTag.textContent = style;
+            document.head.appendChild(styleTag);
+          }
+        }
+        scriptContent = scriptContent.replace("export default", "return");
+        try {
+          const getOptions = new Function(scriptContent);
+          const componentOptions = getOptions() || {};
+          return {
+            template,
+            ...componentOptions,
+            props: ["data"],
+            // Ensure data prop is available if not defined
+            setup(props2, ctx) {
+              const originalSetup = componentOptions.setup ? componentOptions.setup(props2, ctx) : {};
+              return {
+                ...toRefs(props2),
+                ...originalSetup
+              };
+            }
+          };
+        } catch (e) {
+          console.error("Failed to parse component script", e);
+          return { template: "<div>Error parsing component</div>" };
+        }
+      }
+      const component = executeFunction({
+        functionBody: field.options.customRender,
+        params: { data: fieldModel.value },
+        keys: ["data"]
+      });
+      return component ?? null;
+    };
+    __expose({
+      ...defineExposed
+    });
+    return (_ctx, _cache) => {
+      return !unref(handleHidden) ? (openBlock(), createBlock(FormItemWrapper, mergeProps({ key: 0 }, props, { rules: unref(rules) }), {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            (openBlock(), createBlock(resolveDynamicComponent(renderCompont()), {
+              ref_key: "fieldEditor",
+              ref: fieldEditor
+            }, null, 512))
+          ])
+        ]),
+        _: 1
+      }, 16, ["rules"])) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};