cnhis-design-vue 3.1.17-beta.2 → 3.1.17-beta.5

package/es/packages/form-config/src/components/FormConfigCreator.js

@@ -29,7 +29,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return;
       await formRef.validate();
       const formData = formRef.getFormValues();
-      emit("submit", { layoutWidthEnum: "ALL_LINE", ...formData, type, key: formData.name });
+      emit("submit", { layoutWidthEnum: "ALL_LINE", ...formData, type, key: formData.name, __new: true });
     }
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(NButtonGroup), { size: "small" }, {
@@ -50,7 +50,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]),
             default: withCtx(() => [
               createVNode(unref(FormRender), {
-                column: "12",
+                column: 12,
                 ref_key: "lineBreakFormRef",
                 ref: lineBreakFormRef,
                 "initial-data": unref(pick)(initialData, ["layoutWidthEnum"]),
@@ -78,7 +78,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]),
             default: withCtx(() => [
               createVNode(unref(FormRender), {
-                column: "12",
+                column: 12,
                 ref_key: "linebarFormRef",
                 ref: linebarFormRef,
                 "initial-data": initialData,

package/es/packages/form-config/src/components/FormConfigDragDisplay.js

@@ -0,0 +1,42 @@
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, createElementVNode, normalizeStyle, resolveDynamicComponent } from 'vue';
+import Draggable from 'vuedraggable';
+import { usePresetRenderer, useSortableConfig } from '../../../../packages/form-config/src/hooks';
+import { layoutWidthEnum2Column } from '../../../../packages/form-config/src/utils';
+import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.js';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "FormConfigDragDisplay",
+  props: {
+    fieldItem: { type: Object },
+    textFormatter: { type: Function, required: true }
+  },
+  setup(__props) {
+    function getItemColumnStyle(fieldItem) {
+      return { "--item-column": fieldItem ? layoutWidthEnum2Column(fieldItem.layoutWidthEnum) : 24 };
+    }
+    const { getRenderer } = usePresetRenderer();
+    const { getCommonConfig } = useSortableConfig();
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Draggable), mergeProps(unref(getCommonConfig)(), {
+        style: getItemColumnStyle(__props.fieldItem),
+        group: "__display"
+      }), {
+        item: withCtx(({ element }) => [
+          createElementVNode("div", {
+            class: "form-config__displayContentItem",
+            style: normalizeStyle(getItemColumnStyle(element))
+          }, [
+            (openBlock(), createBlock(resolveDynamicComponent(unref(getRenderer)(element)), {
+              "field-item": element,
+              textFormatter: __props.textFormatter
+            }, null, 8, ["field-item", "textFormatter"]))
+          ], 4)
+        ]),
+        _: 1
+      }, 16, ["style"]);
+    };
+  }
+});
+var FormConfigDragDisplay = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "FormConfigDragDisplay.vue"]]);
+
+export { FormConfigDragDisplay as default };

package/es/packages/form-config/src/components/FormConfigDragDisplay.vue.d.ts

@@ -0,0 +1,106 @@
+import { PropType } from 'vue';
+import { FormConfigItem, FormConfigTextFormatter } from '../../../../../es/packages/form-config';
+declare const _default: import("vue").DefineComponent<{
+    fieldItem: {
+        type: PropType<FormConfigItem>;
+    };
+    textFormatter: {
+        type: PropType<FormConfigTextFormatter>;
+        required: true;
+    };
+}, {
+    getItemColumnStyle: (fieldItem?: FormConfigItem) => {
+        '--item-column': number;
+    };
+    getRenderer: (fieldItem: FormConfigItem) => import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | import("vue").FunctionalComponent<{}, {}>;
+    getCommonConfig: () => {
+        onMove: ({ to, from }: import("sortablejs").SortableEvent) => void;
+        onChoose: ({ target, item }: import("sortablejs").SortableEvent) => void;
+        onUnchoose: ({ from, to, target, item }: import("sortablejs").SortableEvent) => void;
+        tag: string;
+        animation: string;
+        'item-key': string;
+    };
+    Draggable: import("vue").DefineComponent<{
+        list: {
+            type: ArrayConstructor;
+            required: boolean;
+            default: any;
+        };
+        modelValue: {
+            type: ArrayConstructor;
+            required: boolean;
+            default: any;
+        };
+        itemKey: {
+            type: (StringConstructor | FunctionConstructor)[];
+            required: boolean;
+        };
+        clone: {
+            type: FunctionConstructor;
+            default: (original: any) => any;
+        };
+        tag: {
+            type: StringConstructor;
+            default: string;
+        };
+        move: {
+            type: FunctionConstructor;
+            default: any;
+        };
+        componentData: {
+            type: ObjectConstructor;
+            required: boolean;
+            default: any;
+        };
+    }, unknown, {
+        error: boolean;
+    }, {
+        realList(): any;
+        getKey(): any;
+    }, {
+        getUnderlyingVm(domElement: any): any;
+        getUnderlyingPotencialDraggableComponent(htmElement: any): any;
+        emitChanges(evt: any): void;
+        alterList(onList: any): void;
+        spliceList(): void;
+        updatePosition(oldIndex: any, newIndex: any): void;
+        getRelatedContextFromMoveEvent({ to, related }: {
+            to: any;
+            related: any;
+        }): any;
+        getVmIndexFromDomIndex(domIndex: any): any;
+        onDragStart(evt: any): void;
+        onDragAdd(evt: any): void;
+        onDragRemove(evt: any): void;
+        onDragUpdate(evt: any): void;
+        computeFutureIndex(relatedContext: any, evt: any): any;
+        onDragMove(evt: any, originalEvent: any): any;
+        onDragEnd(): void;
+    }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any[], any, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+        move: Function;
+        tag: string;
+        clone: Function;
+        list: unknown[];
+        modelValue: unknown[];
+        componentData: Record<string, any>;
+    } & {
+        itemKey?: string | Function | undefined;
+    }>, {
+        move: Function;
+        tag: string;
+        clone: Function;
+        list: unknown[];
+        modelValue: unknown[];
+        componentData: Record<string, any>;
+    }>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    fieldItem: {
+        type: PropType<FormConfigItem>;
+    };
+    textFormatter: {
+        type: PropType<FormConfigTextFormatter>;
+        required: true;
+    };
+}>>, {}>;
+export default _default;

package/es/packages/form-config/src/components/FormConfigEdit.js

@@ -54,7 +54,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock(Fragment, null, [
         (openBlock(), createBlock(unref(CFormRender), {
           key: key.value,
-          column: "12",
+          column: 12,
           ref_key: "formRenderRef",
           ref: formRenderRef,
           size: "small",

package/es/packages/form-config/src/components/FormConfigEdit.vue.d.ts

@@ -1687,7 +1687,9 @@ declare const _default: import("vue").DefineComponent<{}, {
             notes?: string | undefined;
             desc?: string | undefined;
             children?: any[] | undefined;
+            __new?: boolean | undefined;
         }[] | undefined;
+        __new?: boolean | undefined;
     }>;
     generateFieldListByFieldItem: (fieldItem: FormConfigItem) => FieldItem[];
     showModal: import("vue").Ref<boolean>;

package/es/packages/form-config/src/components/index.d.ts

@@ -0,0 +1,5 @@
+import FormConfigCreator from './FormConfigCreator.vue';
+import FormConfigEdit from './FormConfigEdit.vue';
+import FormConfigDragDisplay from './FormConfigDragDisplay.vue';
+export * from './renderer';
+export { FormConfigCreator, FormConfigEdit, FormConfigDragDisplay };

package/es/packages/form-config/src/components/index.js

@@ -0,0 +1,6 @@
+export { default as FormConfigCreator } from './FormConfigCreator.js';
+export { default as FormConfigEdit } from './FormConfigEdit.js';
+export { default as FormConfigDragDisplay } from './FormConfigDragDisplay.js';
+export { default as CloseButton } from './renderer/CloseButton.js';
+export { default as ComplexNode } from './renderer/ComplexNode.js';
+export { default as DefaultNode } from './renderer/DefaultNode.js';

package/es/packages/form-config/src/components/renderer/CloseButton.js

@@ -0,0 +1,45 @@
+import { defineComponent, inject, openBlock, createBlock, unref, withModifiers, withCtx, createVNode } from 'vue';
+import { CloseCircle } from '@vicons/ionicons5';
+import { isArray } from 'lodash-es';
+import { NButton, NIcon } from 'naive-ui';
+import { InjectionFieldList, InjectionMaterialList } from '../../../../../packages/form-config/src/constants';
+import _export_sfc from '../../../../../_virtual/plugin-vue_export-helper.js';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "CloseButton",
+  props: {
+    fieldItem: { type: Object, required: true }
+  },
+  setup(__props) {
+    const props = __props;
+    const fieldList = inject(InjectionFieldList);
+    const materialList = inject(InjectionMaterialList);
+    const remove = () => {
+      traverse(fieldList.value);
+      function traverse(_fieldItem) {
+        return isArray(_fieldItem) && _fieldItem.some((_fieldItem2, idx, arr) => {
+          if (_fieldItem2 !== props.fieldItem)
+            return traverse(_fieldItem2.children);
+          !_fieldItem2.__new && materialList.value.push(_fieldItem2);
+          return arr.splice(idx, 1);
+        });
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(NButton), {
+        text: "",
+        class: "form-config__renderer--closeButton",
+        "text-color": "#a5a5a5",
+        onClick: withModifiers(remove, ["stop"])
+      }, {
+        icon: withCtx(() => [
+          createVNode(unref(NIcon), { component: unref(CloseCircle) }, null, 8, ["component"])
+        ]),
+        _: 1
+      }, 8, ["onClick"]);
+    };
+  }
+});
+var CloseButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "CloseButton.vue"]]);
+
+export { CloseButton as default };