@vunk/form 0.0.0-alpha.3 → 0.0.0-alpha.7

package/components/form/index.js

@@ -8,6 +8,7 @@ import { createFormBindProps, createFormOnEmits } from '@vunk/form/shared/elemen
 import { getValue } from '@vunk/form/shared/helper';
 import { VkfSwitch } from '@vunk/form/components/switch';
 import { VkfSelect } from '@vunk/form/components/select';
+import { VkfDatePicker } from '@vunk/form/components/date-picker';
 
 const props = {
   ...formProps,
@@ -45,7 +46,8 @@ var script = defineComponent({
     VkfFormItemRendererTemplate,
     VkfInput,
     VkfSwitch,
-    VkfSelect
+    VkfSelect,
+    VkfDatePicker
   },
   setup(props2, { emit }) {
     const formProps = createFormBindProps(props2, ["model"]);
@@ -63,6 +65,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_VkfFormItemRendererTemplate = resolveComponent("VkfFormItemRendererTemplate");
   const _component_VkfSwitch = resolveComponent("VkfSwitch");
   const _component_VkfSelect = resolveComponent("VkfSelect");
+  const _component_VkfDatePicker = resolveComponent("VkfDatePicker");
   const _component_VkfFormItemRenderer = resolveComponent("VkfFormItemRenderer");
   const _component_ElForm = resolveComponent("ElForm");
   return openBlock(), createBlock(_component_ElForm, mergeProps(_ctx.formProps, toHandlers(_ctx.formEmits), {
@@ -107,6 +110,18 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             ]),
             _: 1
           }),
+          createVNode(_component_VkfFormItemRendererTemplate, { type: "VkfDatePicker" }, {
+            default: withCtx(({ data: sourceData }) => [
+              createVNode(_component_VkfDatePicker, mergeProps({
+                modelValue: _ctx.getValue(_ctx.data, sourceData.prop),
+                "onUpdate:modelValue": ($event) => _ctx.$emit("setData", {
+                  k: sourceData.prop,
+                  v: $event
+                })
+              }, sourceData), null, 16, ["modelValue", "onUpdate:modelValue"])
+            ]),
+            _: 1
+          }),
           renderSlot(_ctx.$slots, "rendererTemplate")
         ]),
         _: 3

package/components/ground/index.css

@@ -11,15 +11,18 @@
 .vkf-ground-main-x {
   flex: 3;
 }
-.vkf-ground-main-x .vkf-ground-main-card{
+
+.vkf-ground-main-x .vkf-ground-main-card {
   height: 100%;
 }
-.vkf-ground-main-card > .vk-card-title{
+
+.vkf-ground-main-card>.vk-card-title {
   display: flex;
   justify-content: end;
   margin-bottom: var(--gap-xxs);
 }
-.vkf-ground-main-card > .vk-card-body{
+
+.vkf-ground-main-card>.vk-card-body {
   height: 100%;
   border: 2px var(--el-border-color) dashed;
   overflow: auto;

package/components/ground/index.js

@@ -26,6 +26,15 @@ var script$5 = defineComponent({
           label: "inputLabel"
         }
       },
+      {
+        label: "select",
+        value: "VkfSelect",
+        defaultOptions: {
+          templateType: "VkfSelect",
+          prop: "",
+          label: "label"
+        }
+      },
       {
         label: "switch",
         value: "VkfSwitch",
@@ -628,6 +637,7 @@ var script$2 = defineComponent({
       type: String,
       default: ""
     },
+    data: Object,
     k: {
       type: Array,
       default: () => []
@@ -635,11 +645,11 @@ var script$2 = defineComponent({
   },
   emits: {
     "update:prop": (e) => e,
+    "setData": (e) => e,
     "setData:formItems": null,
     "unsetData:formItems": null
   },
   setup(props, { emit }) {
-    const formData = ref({});
     const groundEndClassName = ref(DragoverClasses.normal);
     const formItemsWithWrapper = computed(() => {
       const data = [];
@@ -757,7 +767,6 @@ var script$2 = defineComponent({
       drop,
       setData,
       editDrop,
-      formData,
       formItemsWithWrapper
     };
   }
@@ -788,8 +797,8 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
         default: withCtx(() => [
           createVNode(_component_VkfForm, {
             formItems: _ctx.formItemsWithWrapper,
-            data: _ctx.formData,
-            onSetData: _cache[1] || (_cache[1] = ($event) => _ctx.setData(_ctx.formData, $event))
+            data: _ctx.data,
+            onSetData: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("setData", $event))
           }, {
             rendererTemplate: withCtx(() => [
               createVNode(_component_VkfFormItemRendererTemplate, { type: "VkfEditingSelect" }, {
@@ -822,19 +831,20 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
                   }, 1032, ["name"])
                 ]),
                 _: 1
-              })
+              }),
+              renderSlot(_ctx.$slots, "rendererTemplate")
             ]),
-            _: 1
+            _: 3
           }, 8, ["formItems", "data"])
         ]),
-        _: 1
+        _: 3
       }, 8, ["modelValue"]),
       createElementVNode("div", {
         class: normalizeClass(["vkf-ground-end", _ctx.groundEndClassName]),
         ref: "endLineNode"
       }, null, 2)
     ]),
-    _: 1
+    _: 3
   }, 8, ["onDrop", "onDragover", "onDragleave"]);
 }
 
@@ -1051,22 +1061,33 @@ var script = defineComponent({
     componentLibCollapseExpanded: {
       type: Array,
       default: void 0
+    },
+    source: {
+      type: Array,
+      default: () => []
+    },
+    data: {
+      type: Object,
+      default: () => ({})
     }
   },
   emits: {
+    "update:source": null,
+    "setData:source": (e) => e,
+    "unsetData:source": null,
+    "setData": (e) => e,
     "update:componentLibCollapseExpanded": null
   },
   setup(props, { emit }) {
-    const formItems = ref([]);
-    const editProp = ref("");
     const propToFormItem = computed(() => {
-      return formItems.value.reduce((a, c) => {
+      return props.source.reduce((a, c) => {
         if (c.prop) {
           a[c.prop] = c;
         }
         return a;
       }, {});
     });
+    const editProp = ref("");
     const configPropDisabled = ref(true);
     const setFormItem = (props2, e) => {
       if (e.k === "prop") {
@@ -1093,7 +1114,7 @@ var script = defineComponent({
         setData(props2, e);
       }
     };
-    const formItemStr = computed(() => JSON.stringify(formItems.value));
+    const formItemStr = computed(() => JSON.stringify(props.source));
     const formItemClip = useClipboard({
       source: formItemStr
     });
@@ -1114,12 +1135,11 @@ var script = defineComponent({
         }
         return obj;
       }).then((obj) => {
-        formItems.value = obj;
+        emit("update:source", obj);
       });
     };
     return {
       propToFormItem,
-      formItems,
       editProp,
       setData,
       unsetData,
@@ -1177,24 +1197,32 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         ]),
         default: withCtx(() => [
           createVNode(_component_VkfGroundMain, {
+            data: _ctx.data,
+            onSetData: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("setData", $event)),
             prop: _ctx.editProp,
-            "onUpdate:prop": _cache[2] || (_cache[2] = ($event) => _ctx.editProp = $event),
-            formItems: _ctx.formItems,
-            "onSetData:formItems": _cache[3] || (_cache[3] = ($event) => _ctx.setData(_ctx.formItems, $event)),
-            "onUnsetData:formItems": _cache[4] || (_cache[4] = ($event) => _ctx.unsetData(_ctx.formItems, $event))
-          }, null, 8, ["prop", "formItems"])
+            "onUpdate:prop": _cache[3] || (_cache[3] = ($event) => _ctx.editProp = $event),
+            formItems: _ctx.source,
+            "onSetData:formItems": _cache[4] || (_cache[4] = ($event) => _ctx.$emit("setData:source", $event)),
+            "onUnsetData:formItems": _cache[5] || (_cache[5] = ($event) => _ctx.$emit("unsetData:source", $event))
+          }, {
+            rendererTemplate: withCtx(() => [
+              renderSlot(_ctx.$slots, "rendererTemplate")
+            ]),
+            _: 3
+          }, 8, ["data", "prop", "formItems"])
         ]),
-        _: 1
+        _: 3
       })
     ]),
     createElementVNode("div", _hoisted_6, [
+      createCommentVNode(" \u901A\u8FC7config \u4FEE\u6539\u6570\u636E\u6E90 \u5355\u9879\u7684\u5185\u5BB9 "),
       _ctx.editProp && _ctx.propToFormItem[_ctx.editProp] ? (openBlock(), createBlock(_component_VkfGroundConfig, {
         key: 0,
         propDisabled: _ctx.configPropDisabled,
-        "onUpdate:propDisabled": _cache[5] || (_cache[5] = ($event) => _ctx.configPropDisabled = $event),
+        "onUpdate:propDisabled": _cache[6] || (_cache[6] = ($event) => _ctx.configPropDisabled = $event),
         templateType: _ctx.propToFormItem[_ctx.editProp].templateType,
         data: _ctx.propToFormItem[_ctx.editProp],
-        onSetData: _cache[6] || (_cache[6] = ($event) => _ctx.setFormItem(_ctx.propToFormItem[_ctx.editProp], $event))
+        onSetData: _cache[7] || (_cache[7] = ($event) => _ctx.setFormItem(_ctx.propToFormItem[_ctx.editProp], $event))
       }, {
         rendererTemplate: withCtx(() => [
           renderSlot(_ctx.$slots, "configRendererTemplate")

package/components/ground/src/ground-main/src/index.vue.d.ts

@@ -2,6 +2,7 @@ import { PropType, Ref } from 'vue';
 import { DragoverClasses } from '@vunk/form/components/drop-wrapper';
 import type { FormItemRendererSourcePlus } from './types';
 import type { DataTransferJson } from '@vunk/form/shared/types/drag';
+import { SetDataEvent } from '@vunk/form/shared/types';
 interface SourceTransfer extends DataTransferJson {
     source: FormItemRendererSourcePlus;
 }
@@ -14,6 +15,7 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    data: ObjectConstructor;
     k: {
         type: ArrayConstructor;
         default: () => never[];
@@ -30,10 +32,10 @@ declare const _default: import("vue").DefineComponent<{
         insert?: boolean | undefined;
     }) => void;
     editDrop: (e: DragEvent, overClass: DragoverClasses, toData: SourceTransfer) => void;
-    formData: Ref<{}>;
     formItemsWithWrapper: import("vue").ComputedRef<FormItemRendererSourcePlus[]>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     'update:prop': (e: string) => string;
+    setData: (e: SetDataEvent) => SetDataEvent<any>;
     'setData:formItems': null;
     'unsetData:formItems': null;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
@@ -45,11 +47,13 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    data: ObjectConstructor;
     k: {
         type: ArrayConstructor;
         default: () => never[];
     };
 }>> & {
+    onSetData?: ((e: SetDataEvent<any>) => any) | undefined;
     "onSetData:formItems"?: ((...args: any[]) => any) | undefined;
     "onUnsetData:formItems"?: ((...args: any[]) => any) | undefined;
     "onUpdate:prop"?: ((e: string) => any) | undefined;