@kp-ui/lowcode 1.0.30 → 1.0.31

package/src/components/form-designer/form-widget/container-widget/vf-drawer-widget.vue.js

@@ -2,6 +2,7 @@ import i18n from "../../../../utils/i18n.js";
 import refMixinDesign from "../../refMixinDesign.js";
 import comps from "../field-widget/index.js";
 import ContainerWrapper from "./container-wrapper.vue.js";
+import draggableComponent from "../../../../lib/vuedraggable/src/vuedraggable.js";
 import { resolveComponent, createBlock, openBlock, withCtx, createElementBlock, withModifiers, normalizeClass, createVNode, mergeProps, createElementVNode, resolveDynamicComponent } from "vue";
 /* empty css                      */
 import _export_sfc from "../../../../../_virtual/_plugin-vue_export-helper.js";
@@ -11,6 +12,7 @@ const _sfc_main = {
   mixins: [i18n, refMixinDesign],
   inject: ["refList"],
   components: {
+    Draggable: draggableComponent,
     ContainerWrapper,
     ...comps
   },
@@ -146,7 +148,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 8, ["designer", "widget", "parent-widget", "parent-list", "index-of-parent-list"]);
 }
-const vfDrawerWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-20e0629d"]]);
+const vfDrawerWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-3c06805c"]]);
 export {
   vfDrawerWidget as default
 };

package/src/components/form-designer/form-widget/field-widget/attachment-render-widget.vue.js

@@ -2,11 +2,9 @@ import FormItemWrapper from "./form-item-wrapper.vue.js";
 import emitter from "../../../../utils/emitter.js";
 import i18n from "../../../../utils/i18n.js";
 import fieldMixin from "./fieldMixin.js";
-import { useCustomRender } from "../../../CustomRender/index.js";
 import { resolveComponent, createBlock, createCommentVNode, openBlock, withCtx, createElementVNode, createElementBlock, resolveDynamicComponent } from "vue";
 /* empty css                              */
 import _export_sfc from "../../../../../_virtual/_plugin-vue_export-helper.js";
-useCustomRender();
 const _sfc_main = {
   name: "attachment-render-widget",
   componentName: "FieldWidget",
@@ -109,7 +107,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 8, ["designer", "field", "rules", "design-state", "parent-widget", "parent-list", "index-of-parent-list", "sub-form-row-index", "sub-form-col-index", "sub-form-row-id"])) : createCommentVNode("", true);
 }
-const attachmentRenderWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-1cefed8b"]]);
+const attachmentRenderWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-cab28d0a"]]);
 export {
   attachmentRenderWidget as default
 };

package/src/components/form-designer/form-widget/field-widget/diy-compontent-widget.vue.js

@@ -0,0 +1,101 @@
+import StaticContentWrapper from "./static-content-wrapper.vue.js";
+import emitter from "../../../../utils/emitter.js";
+import i18n from "../../../../utils/i18n.js";
+import fieldMixin from "./fieldMixin.js";
+import { useCustomRender } from "../../../CustomRender/useCustomRender.js";
+import { resolveComponent, createBlock, openBlock, withCtx, createElementVNode, normalizeClass, createElementBlock, toDisplayString, resolveDynamicComponent, normalizeProps, guardReactiveProps } from "vue";
+/* empty css                           */
+import _export_sfc from "../../../../../_virtual/_plugin-vue_export-helper.js";
+const { renderComponent } = useCustomRender();
+const _sfc_main = {
+  name: "diy-compontent-widget",
+  componentName: "FieldWidget",
+  //必须固定为FieldWidget，用于接收父级组件的broadcast事件
+  mixins: [emitter, fieldMixin, i18n],
+  props: {
+    field: Object,
+    parentWidget: Object,
+    parentList: Array,
+    indexOfParentList: Number,
+    designer: Object,
+    designState: {
+      type: Boolean,
+      default: false
+    },
+    subFormRowIndex: {
+      /* 子表单组件行索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormColIndex: {
+      /* 子表单组件列索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormRowId: {
+      /* 子表单组件行Id，唯一id且不可变 */
+      type: String,
+      default: ""
+    }
+  },
+  data() {
+    return {};
+  },
+  components: {
+    StaticContentWrapper
+  },
+  computed: {},
+  beforeCreate() {
+  },
+  created() {
+    this.registerToRefList();
+    this.initEventHandler();
+    this.handleOnCreated();
+  },
+  mounted() {
+    this.handleOnMounted();
+  },
+  beforeUnmount() {
+    this.unregisterFromRefList();
+  },
+  methods: {
+    renderComponent
+  }
+};
+const _hoisted_1 = {
+  key: 0,
+  class: "slot-title"
+};
+const _hoisted_2 = { key: 1 };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_static_content_wrapper = resolveComponent("static-content-wrapper");
+  return openBlock(), createBlock(_component_static_content_wrapper, {
+    designer: $props.designer,
+    field: $props.field,
+    "design-state": $props.designState,
+    "parent-widget": $props.parentWidget,
+    "parent-list": $props.parentList,
+    "index-of-parent-list": $props.indexOfParentList,
+    "sub-form-row-index": $props.subFormRowIndex,
+    "sub-form-col-index": $props.subFormColIndex,
+    "sub-form-row-id": $props.subFormRowId
+  }, {
+    default: withCtx(() => [
+      createElementVNode("div", {
+        class: normalizeClass([!!$props.designState ? "slot-wrapper-design" : "slot-wrapper-render"])
+      }, [
+        !!$props.designState ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(_ctx.i18nt("designer.widgetLabel.diy-compontent")) + " " + toDisplayString($props.field.options.diyCompontent), 1)) : (openBlock(), createElementBlock("div", _hoisted_2, [
+          (openBlock(), createBlock(resolveDynamicComponent($options.renderComponent($props.field.options.diyCompontent)), normalizeProps(guardReactiveProps({
+            data: _ctx.fieldModel,
+            ...$props.field.options.props
+          })), null, 16))
+        ]))
+      ], 2)
+    ]),
+    _: 1
+  }, 8, ["designer", "field", "design-state", "parent-widget", "parent-list", "index-of-parent-list", "sub-form-row-index", "sub-form-col-index", "sub-form-row-id"]);
+}
+const diyCompontentWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-09f07dbc"]]);
+export {
+  diyCompontentWidget as default
+};

package/src/components/form-designer/form-widget/field-widget/fieldMixin.js

@@ -1,19 +1,19 @@
-import { translateOptionItems, deepClone } from "../../../../utils/util.js";
-import FormValidators from "../../../../utils/validators.js";
-import { fmtHttpParams } from "../../../../utils/request/fmtHttpParams.js";
-import { eq, isArray } from "lodash-es";
+import { translateOptionItems, deepClone } from '../../../../utils/util.js';
+import FormValidators from '../../../../utils/validators.js';
+import { fmtHttpParams } from '../../../../utils/request/fmtHttpParams.js';
+import { eq, isArray } from 'lodash-es';
 const fieldMixin = {
   inject: [
-    "refList",
-    "getFormConfig",
-    "globalOptionData",
-    "globalModel",
-    "getOptionData",
-    "getGlobalDsv",
-    "getReadMode",
-    "getSubFormFieldFlag",
-    "getSubFormName",
-    "getDSResultCache"
+    'refList',
+    'getFormConfig',
+    'globalOptionData',
+    'globalModel',
+    'getOptionData',
+    'getGlobalDsv',
+    'getReadMode',
+    'getSubFormFieldFlag',
+    'getSubFormName',
+    'getDSResultCache'
   ],
   data() {
     return {
@@ -22,11 +22,14 @@ const fieldMixin = {
     };
   },
   computed: {
+    isFileMode() {
+      return this.field.type === 'file-upload' || this.field.type === 'picture-upload';
+    },
     formConfig() {
       return this.getFormConfig();
     },
     subFormName() {
-      return !!this.getSubFormName ? this.getSubFormName() : "";
+      return !!this.getSubFormName ? this.getSubFormName() : '';
     },
     subFormItemFlag() {
       return !!this.getSubFormFieldFlag ? this.getSubFormFieldFlag() : false;
@@ -42,13 +45,17 @@ const fieldMixin = {
     },
     optionLabel() {
       if (this.fieldModel === null) {
-        return "";
+        return '';
       } else {
-        let resultContent = "";
+        let resultContent = '';
         const { valueKey, labelKey } = this.field.options;
-        this.field.options.optionItems.forEach((oItem) => {
-          if (oItem[valueKey] === this.fieldModel || this.findInArray(this.fieldModel, oItem[valueKey]) !== -1) {
-            resultContent = resultContent === "" ? oItem[labelKey] : resultContent + " " + oItem[labelKey];
+        this.field.options.optionItems.forEach(oItem => {
+          if (
+            oItem[valueKey] === this.fieldModel ||
+            this.findInArray(this.fieldModel, oItem[valueKey]) !== -1
+          ) {
+            resultContent =
+              resultContent === '' ? oItem[labelKey] : resultContent + ' ' + oItem[labelKey];
           }
         });
         return resultContent;
@@ -95,7 +102,7 @@ const fieldMixin = {
     //--------------------- 组件内部方法 begin ------------------//
     getPropName() {
       if (this.subFormItemFlag && !this.designState) {
-        return this.subFormName + "." + this.subFormRowIndex + "." + this.field.options.name;
+        return this.subFormName + '.' + this.subFormRowIndex + '.' + this.field.options.name;
       } else {
         return this.field.options.name;
       }
@@ -106,9 +113,15 @@ const fieldMixin = {
       }
       if (!!this.subFormItemFlag && !this.designState) {
         const subFormData = this.formModel[this.subFormName];
-        if ((subFormData === void 0 || subFormData[this.subFormRowIndex] === void 0 || subFormData[this.subFormRowIndex][this.field.options.name] === void 0) && this.field.options.defaultValue !== void 0) {
+        if (
+          (subFormData === void 0 ||
+            subFormData[this.subFormRowIndex] === void 0 ||
+            subFormData[this.subFormRowIndex][this.field.options.name] === void 0) &&
+          this.field.options.defaultValue !== void 0
+        ) {
           this.fieldModel = this.field.options.defaultValue;
-          subFormData[this.subFormRowIndex][this.field.options.name] = this.field.options.defaultValue;
+          subFormData[this.subFormRowIndex][this.field.options.name] =
+            this.field.options.defaultValue;
         } else if (subFormData[this.subFormRowIndex][this.field.options.name] === void 0) {
           this.fieldModel = null;
           subFormData[this.subFormRowIndex][this.field.options.name] = null;
@@ -128,7 +141,10 @@ const fieldMixin = {
         this.initFileList();
         return;
       }
-      if (this.formModel[this.field.options.name] === void 0 && this.field.options.defaultValue !== void 0) {
+      if (
+        this.formModel[this.field.options.name] === void 0 &&
+        this.field.options.defaultValue !== void 0
+      ) {
         this.fieldModel = this.field.options.defaultValue;
       } else if (this.formModel[this.field.options.name] === void 0) {
         this.formModel[this.field.options.name] = null;
@@ -139,7 +155,7 @@ const fieldMixin = {
       this.initFileList();
     },
     initFileList() {
-      if (this.field.type !== "picture-upload" && this.field.type !== "file-upload" || this.designState === true) {
+      if (!this.isFileMode || this.designState === true) {
         return;
       }
       if (!!this.fieldModel) {
@@ -151,12 +167,16 @@ const fieldMixin = {
       }
     },
     initEventHandler() {
-      this.on$("setFormData", (newFormData) => {
+      this.on$('setFormData', newFormData => {
         if (!this.subFormItemFlag) {
-          this.setValue(newFormData[this.field.options.name]);
+          let data = newFormData?.[this.field.options.name] || '';
+          if (this.isFileMode) {
+            if (typeof data === 'string' && data !== '') data = JSON.parse(data);
+          }
+          this.setValue(data);
         }
       });
-      this.on$("field-value-changed", (values) => {
+      this.on$('field-value-changed', values => {
         if (!!this.subFormItemFlag) {
           const subFormData = this.formModel[this.subFormName];
           this.handleOnChangeForSubForm(values[0], values[1], subFormData, this.subFormRowId);
@@ -164,10 +184,10 @@ const fieldMixin = {
           this.handleOnChange(values[0], values[1]);
         }
       });
-      this.on$("loadOptionItemsFromDataSet", (dsName) => {
+      this.on$('loadOptionItemsFromDataSet', dsName => {
         this.loadOptionItemsFromDataSet(dsName);
       });
-      this.on$("reloadOptionItems", (widgetNames) => {
+      this.on$('reloadOptionItems', widgetNames => {
         if (widgetNames.length === 0 || widgetNames.indexOf(this.field.options.name) > -1) {
           this.initOptionItems(true);
         }
@@ -195,9 +215,9 @@ const fieldMixin = {
       if (this.refList !== null && !!this.field.options.name) {
         if (this.subFormItemFlag && !this.designState) {
           if (!!oldRefName) {
-            delete this.refList[oldRefName + "@row" + this.subFormRowId];
+            delete this.refList[oldRefName + '@row' + this.subFormRowId];
           }
-          this.refList[this.field.options.name + "@row" + this.subFormRowId] = this;
+          this.refList[this.field.options.name + '@row' + this.subFormRowId] = this;
         } else {
           if (!!oldRefName) {
             delete this.refList[oldRefName];
@@ -210,7 +230,7 @@ const fieldMixin = {
       if (this.refList !== null && !!this.field.options.name) {
         const oldRefName = this.field.options.name;
         if (this.subFormItemFlag && !this.designState) {
-          delete this.refList[oldRefName + "@row" + this.subFormRowId];
+          delete this.refList[oldRefName + '@row' + this.subFormRowId];
         } else {
           delete this.refList[oldRefName];
         }
@@ -228,8 +248,11 @@ const fieldMixin = {
       }
       if (this.loading) return;
       this.loading = true;
-      if (["radio", "checkbox", "select", "cascader", "treeSelect"].includes(this.field.type)) {
-        if (!!this.field.options.dsEnabled && ((_a = this.field.options.http) == null ? void 0 : _a.url)) {
+      if (['radio', 'checkbox', 'select', 'cascader', 'treeSelect'].includes(this.field.type)) {
+        if (
+          !!this.field.options.dsEnabled &&
+          ((_a = this.field.options.http) == null ? void 0 : _a.url)
+        ) {
           try {
             const dsResult = await fmtHttpParams.call(this, this.field.options, {
               fieldCode: this.field.options.name
@@ -247,7 +270,7 @@ const fieldMixin = {
               }
             }
           } catch (err) {
-            console.error("err: ", err);
+            console.error('err: ', err);
           }
         }
         const newOptionItems = this.getOptionData();
@@ -265,10 +288,20 @@ const fieldMixin = {
       if (this.designState) {
         return;
       }
-      if (this.field.type !== "radio" && this.field.type !== "checkbox" && this.field.type !== "select" && this.field.type !== "cascader") {
+      if (
+        this.field.type !== 'radio' &&
+        this.field.type !== 'checkbox' &&
+        this.field.type !== 'select' &&
+        this.field.type !== 'cascader'
+      ) {
         return;
       }
-      if (!this.field.options.dsEnabled || !this.field.options.dsName || !this.field.options.dataSetName || this.field.options.dsName !== dsName) {
+      if (
+        !this.field.options.dsEnabled ||
+        !this.field.options.dsName ||
+        !this.field.options.dataSetName ||
+        this.field.options.dsName !== dsName
+      ) {
         return;
       }
       const dataCache = this.getDSResultCache();
@@ -298,10 +331,8 @@ const fieldMixin = {
         this.rules.push({
           required: true,
           //trigger: ['blur', 'change'],
-          trigger: [
-            "blur"
-          ],
-          message: this.field.options.requiredHint || this.i18nt("render.hint.fieldRequired")
+          trigger: ['blur'],
+          message: this.field.options.requiredHint || this.i18nt('render.hint.fieldRequired')
         });
       }
       if (!!this.field.options.validation) {
@@ -309,14 +340,14 @@ const fieldMixin = {
         if (!!FormValidators[vldName]) {
           this.rules.push({
             validator: FormValidators[vldName],
-            trigger: ["blur", "change"],
+            trigger: ['blur', 'change'],
             label: this.field.options.label,
             errorMsg: this.field.options.validationHint
           });
         } else {
           this.rules.push({
-            validator: FormValidators["regExp"],
-            trigger: ["blur", "change"],
+            validator: FormValidators['regExp'],
+            trigger: ['blur', 'change'],
             regExp: vldName,
             label: this.field.options.label,
             errorMsg: this.field.options.validationHint
@@ -325,12 +356,12 @@ const fieldMixin = {
       }
       if (!!this.field.options.onValidate) {
         const customFn = (rule, value) => {
-          const tmpFunc = new Function("rule", "value", this.field.options.onValidate);
+          const tmpFunc = new Function('rule', 'value', this.field.options.onValidate);
           return tmpFunc.call(this, rule, value);
         };
         this.rules.push({
           validator: customFn,
-          trigger: ["blur"],
+          trigger: ['blur'],
           label: this.field.options.label
         });
       }
@@ -342,7 +373,7 @@ const fieldMixin = {
       if (!this.rules) {
         return;
       }
-      this.rules.forEach((rule) => {
+      this.rules.forEach(rule => {
         if (!!rule.trigger) {
           rule.trigger.splice(0, rule.trigger.length);
         }
@@ -355,16 +386,16 @@ const fieldMixin = {
       if (!this.rules) {
         return;
       }
-      this.rules.forEach((rule) => {
+      this.rules.forEach(rule => {
         if (!!rule.trigger) {
-          rule.trigger.push("blur");
-          rule.trigger.push("change");
+          rule.trigger.push('blur');
+          rule.trigger.push('change');
         }
       });
     },
     disableOptionOfList(optionList, optionValue) {
       if (!!optionList && optionList.length > 0) {
-        optionList.forEach((opt) => {
+        optionList.forEach(opt => {
           if (opt.value === optionValue) {
             opt.disabled = true;
           }
@@ -373,7 +404,7 @@ const fieldMixin = {
     },
     enableOptionOfList(optionList, optionValue) {
       if (!!optionList && optionList.length > 0) {
-        optionList.forEach((opt) => {
+        optionList.forEach(opt => {
           if (opt.value === optionValue) {
             opt.disabled = false;
           }
@@ -386,8 +417,8 @@ const fieldMixin = {
       if (newValue) {
         newValue = newValue.target ? newValue.target.value : newValue;
       }
-      this.emit$("field-value-changed", [newValue, oldValue]);
-      this.dispatch("VFormRender", "fieldChange", [
+      this.emit$('field-value-changed', [newValue, oldValue]);
+      this.dispatch('VFormRender', 'fieldChange', [
         this.field.options.name,
         newValue,
         oldValue,
@@ -419,7 +450,7 @@ const fieldMixin = {
       this.syncUpdateFormModel(value);
       this.emitFieldDataChange(value, this.oldFieldValue);
       this.oldFieldValue = deepClone(value);
-      this.dispatch("VFormRender", "fieldValidation", [this.getPropName()]);
+      this.dispatch('VFormRender', 'fieldValidation', [this.getPropName()]);
     },
     handleFocusCustomEvent(event) {
       if (!!this.designState) {
@@ -427,7 +458,7 @@ const fieldMixin = {
       }
       this.oldFieldValue = deepClone(this.fieldModel);
       if (!!this.field.options.onFocus) {
-        const customFn = new Function("event", this.field.options.onFocus);
+        const customFn = new Function('event', this.field.options.onFocus);
         customFn.call(this, event);
       }
       if (this.field.options.loadingPage) {
@@ -440,7 +471,7 @@ const fieldMixin = {
         return;
       }
       if (!!this.field.options.onBlur) {
-        const customFn = new Function("event", this.field.options.onBlur);
+        const customFn = new Function('event', this.field.options.onBlur);
         customFn.call(this, event);
       }
     },
@@ -452,9 +483,9 @@ const fieldMixin = {
         return;
       }
       this.syncUpdateFormModel(value);
-      this.dispatch("VFormRender", "fieldValidation", [this.getPropName()]);
+      this.dispatch('VFormRender', 'fieldValidation', [this.getPropName()]);
       if (!!this.field.options.onInput) {
-        const customFn = new Function("value", this.field.options.onInput);
+        const customFn = new Function('value', this.field.options.onInput);
         customFn.call(this, value);
       }
     },
@@ -466,7 +497,7 @@ const fieldMixin = {
         const customFn = new Function(this.field.options.onAppendButtonClick);
         customFn.call(this);
       } else {
-        this.dispatch("VFormRender", "appendButtonClick", [this]);
+        this.dispatch('VFormRender', 'appendButtonClick', [this]);
       }
     },
     handleOnChange(val, oldVal, ops = []) {
@@ -474,7 +505,7 @@ const fieldMixin = {
         return;
       }
       if (!!this.field.options.onChange) {
-        const changeFn = new Function("value", "oldValue", "ops", this.field.options.onChange);
+        const changeFn = new Function('value', 'oldValue', 'ops', this.field.options.onChange);
         changeFn.call(this, val, oldVal, ops[0]);
       }
     },
@@ -484,11 +515,11 @@ const fieldMixin = {
       }
       if (!!this.field.options.onChange) {
         const changeFn = new Function(
-          "value",
-          "oldValue",
-          "ops",
-          "subFormData",
-          "rowId",
+          'value',
+          'oldValue',
+          'ops',
+          'subFormData',
+          'rowId',
           this.field.options.onChange
         );
         changeFn.call(this, val, oldVal, ops[0], subFormData, rowId);
@@ -502,7 +533,7 @@ const fieldMixin = {
         const customFn = new Function(this.field.options.onClick);
         return customFn.call(this);
       } else {
-        this.dispatch("VFormRender", "buttonClick", [this]);
+        this.dispatch('VFormRender', 'buttonClick', [this]);
       }
     },
     handleButtonWidgetClick() {
@@ -513,7 +544,7 @@ const fieldMixin = {
         const customFn = new Function(this.field.options.onClick);
         return customFn.call(this);
       } else {
-        this.dispatch("VFormRender", "buttonClick", [this]);
+        this.dispatch('VFormRender', 'buttonClick', [this]);
       }
     },
     /**
@@ -545,17 +576,17 @@ const fieldMixin = {
     //--------------------- 以下为组件支持外部调用的API方法 begin ------------------//
     /* 提示：用户可自行扩充这些方法！！！ */
     getFormRef() {
-      return this.refList["v_form_ref"];
+      return this.refList['v_form_ref'];
     },
     getWidgetRef(widgetName, showError) {
       const foundRef = this.refList[widgetName];
       if (!foundRef && !!showError) {
-        this.$message.error(this.i18nt("render.hint.refNotFound") + widgetName);
+        this.$message.error(this.i18nt('render.hint.refNotFound') + widgetName);
       }
       return foundRef;
     },
     getFieldEditor() {
-      return this.$refs["fieldEditor"];
+      return this.$refs['fieldEditor'];
     },
     showFileList(list) {
       if (!isArray(list)) return [];
@@ -577,9 +608,9 @@ const fieldMixin = {
       if (eq(this.fieldModel, newValue)) return;
       if (!!this.field.formItemFlag) {
         const oldValue = deepClone(this.fieldModel);
-        if (this.field.type === "file-upload") {
+        if (this.field.type === 'file-upload') {
           newValue = this.showFileList(newValue || []);
-        } else if (this.field.type === "code-editor") {
+        } else if (this.field.type === 'code-editor') {
           this.$refs.fieldEditor.setValue(newValue);
         }
         this.fieldModel = newValue;
@@ -598,9 +629,8 @@ const fieldMixin = {
     resetField() {
       const defaultValue = this.field.options.defaultValue;
       this.setValue(defaultValue);
-      this.$nextTick(() => {
-      });
-      if (this.field.type === "picture-upload" || this.field.type === "file-upload") {
+      this.$nextTick(() => {});
+      if (this.field.type === 'picture-upload' || this.field.type === 'file-upload') {
         this.fileList.splice(0, this.fileList.length);
         this.handleChangeEvent(this.fileList);
       }
@@ -658,13 +688,20 @@ const fieldMixin = {
       }
     },
     clearSelectedOptions() {
-      if (this.field.type !== "checkbox" && this.field.type !== "radio" && this.field.type !== "select") {
+      if (
+        this.field.type !== 'checkbox' &&
+        this.field.type !== 'radio' &&
+        this.field.type !== 'select'
+      ) {
         return;
       }
-      if (this.field.type === "checkbox" || this.field.type === "select" && this.field.options.multiple) {
+      if (
+        this.field.type === 'checkbox' ||
+        (this.field.type === 'select' && this.field.options.multiple)
+      ) {
         this.fieldModel = [];
       } else {
-        this.fieldModel = "";
+        this.fieldModel = '';
       }
     },
     /**
@@ -675,8 +712,8 @@ const fieldMixin = {
       this.field.options.optionItems = translateOptionItems(
         options,
         this.field.type,
-        this.field.options.labelKey || "label",
-        this.field.options.valueKey || "value"
+        this.field.options.labelKey || 'label',
+        this.field.options.valueKey || 'value'
       );
     },
     /**
@@ -687,8 +724,8 @@ const fieldMixin = {
       this.field.options.optionItems = translateOptionItems(
         options,
         this.field.type,
-        this.field.options.labelKey || "label",
-        this.field.options.valueKey || "value"
+        this.field.options.labelKey || 'label',
+        this.field.options.valueKey || 'value'
       );
     },
     disableOption(optionValue) {
@@ -766,6 +803,4 @@ const fieldMixin = {
     //--------------------- 以上为组件支持外部调用的API方法 end ------------------//
   }
 };
-export {
-  fieldMixin as default
-};
+export { fieldMixin as default };

package/src/components/form-designer/form-widget/field-widget/index.js

@@ -8,6 +8,7 @@ import * as colorWidget from "./color-widget.vue.js";
 import * as dateRangeWidget from "./date-range-widget.vue.js";
 import * as dateWidget from "./date-widget.vue.js";
 import * as dividerWidget from "./divider-widget.vue.js";
+import * as diyCompontentWidget from "./diy-compontent-widget.vue.js";
 import * as dropdownWidget from "./dropdown-widget.vue.js";
 import * as fileUploadWidget from "./file-upload-widget.vue.js";
 import * as formItemWrapper from "./form-item-wrapper.vue.js";
@@ -29,7 +30,8 @@ import * as timeRangeWidget from "./time-range-widget.vue.js";
 import * as timeWidget from "./time-widget.vue.js";
 import * as treeSelectWidget from "./treeSelect-widget.vue.js";
 const comps = {};
-const modules = /* @__PURE__ */ Object.assign({ "./attachment-render-widget.vue": attachmentRenderWidget, "./bpmn-editor-widget.vue": bpmnEditorWidget, "./button-widget.vue": buttonWidget, "./cascader-widget.vue": cascaderWidget, "./checkbox-widget.vue": checkboxWidget, "./code-editor-widget.vue": codeEditorWidget, "./color-widget.vue": colorWidget, "./date-range-widget.vue": dateRangeWidget, "./date-widget.vue": dateWidget, "./divider-widget.vue": dividerWidget, "./dropdown-widget.vue": dropdownWidget, "./file-upload-widget.vue": fileUploadWidget, "./form-item-wrapper.vue": formItemWrapper, "./html-text-widget.vue": htmlTextWidget, "./input-widget.vue": inputWidget, "./number-widget.vue": numberWidget, "./picture-upload-widget.vue": pictureUploadWidget, "./radio-widget.vue": radioWidget, "./rate-widget.vue": rateWidget, "./rich-editor-widget.vue": richEditorWidget, "./select-widget.vue": selectWidget, "./slider-widget.vue": sliderWidget, "./slot-widget.vue": slotWidget, "./static-content-wrapper.vue": staticContentWrapper, "./static-text-widget.vue": staticTextWidget, "./switch-widget.vue": switchWidget, "./textarea-widget.vue": textareaWidget, "./time-range-widget.vue": timeRangeWidget, "./time-widget.vue": timeWidget, "./treeSelect-widget.vue": treeSelectWidget });
+const modules = /* @__PURE__ */ Object.assign({ "./attachment-render-widget.vue": attachmentRenderWidget, "./bpmn-editor-widget.vue": bpmnEditorWidget, "./button-widget.vue": buttonWidget, "./cascader-widget.vue": cascaderWidget, "./checkbox-widget.vue": checkboxWidget, "./code-editor-widget.vue": codeEditorWidget, "./color-widget.vue": colorWidget, "./date-range-widget.vue": dateRangeWidget, "./date-widget.vue": dateWidget, "./divider-widget.vue": dividerWidget, "./diy-compontent-widget.vue": diyCompontentWidget, "./dropdown-widget.vue": dropdownWidget, "./file-upload-widget.vue": fileUploadWidget, "./form-item-wrapper.vue": formItemWrapper, "./html-text-widget.vue": htmlTextWidget, "./input-widget.vue": inputWidget, "./number-widget.vue": numberWidget, "./picture-upload-widget.vue": pictureUploadWidget, "./radio-widget.vue": radioWidget, "./rate-widget.vue": rateWidget, "./rich-editor-widget.vue": richEditorWidget, "./select-widget.vue": selectWidget, "./slider-widget.vue": sliderWidget, "./slot-widget.vue": slotWidget, "./static-content-wrapper.vue": staticContentWrapper, "./static-text-widget.vue": staticTextWidget, "./switch-widget.vue": switchWidget, "./textarea-widget.vue": textareaWidget, "./time-range-widget.vue": timeRangeWidget, "./time-widget.vue": timeWidget, "./treeSelect-widget.vue": treeSelectWidget });
+console.log(modules);
 for (const path in modules) {
   const cname = modules[path].default.name;
   comps[cname] = modules[path].default;