@tmagic/form 1.5.0-beta.6 → 1.5.0-beta.7

package/dist/tmagic-form.umd.cjs

@@ -182,11 +182,11 @@
     return defaultValue;
   };
 
-  const _hoisted_1$d = ["data-tmagic-id"];
-  const _hoisted_2$8 = ["innerHTML", "title"];
-  const _hoisted_3$5 = ["innerHTML"];
-  const _hoisted_4$4 = ["innerHTML"];
-  const _hoisted_5$4 = ["innerHTML"];
+  const _hoisted_1$d = ["data-tmagic-id", "data-tmagic-form-item-prop"];
+  const _hoisted_2$7 = ["innerHTML", "title"];
+  const _hoisted_3$4 = ["innerHTML"];
+  const _hoisted_4$3 = ["innerHTML"];
+  const _hoisted_5$3 = ["innerHTML"];
   const _hoisted_6$2 = ["innerHTML", "title"];
   const _hoisted_7$1 = ["innerHTML"];
   const _hoisted_8$1 = ["innerHTML"];
@@ -337,6 +337,7 @@
         return _ctx.config ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
           "data-tmagic-id": _ctx.config.id,
+          "data-tmagic-form-item-prop": itemProp.value,
           style: vue.normalizeStyle(_ctx.config.tip ? "display: flex;align-items: baseline;" : ""),
           class: vue.normalizeClass(`m-form-container m-container-${type.value || ""} ${_ctx.config.className || ""}`)
         }, [
@@ -374,16 +375,15 @@
                 vue.createElementVNode("span", {
                   innerHTML: type.value === "checkbox" ? "" : text.value,
                   title: _ctx.config.labelTitle
-                }, null, 8, _hoisted_2$8)
+                }, null, 8, _hoisted_2$7)
               ]),
               default: vue.withCtx(() => [
                 tooltip.value ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicTooltip), { key: 0 }, {
                   content: vue.withCtx(() => [
-                    vue.createElementVNode("div", { innerHTML: tooltip.value }, null, 8, _hoisted_3$5)
+                    vue.createElementVNode("div", { innerHTML: tooltip.value }, null, 8, _hoisted_3$4)
                   ]),
                   default: vue.withCtx(() => [
                     (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tagName.value), {
-                      "data-tmagic-form-item-prop": itemProp.value,
                       key: key(_ctx.config),
                       size: _ctx.size,
                       model: _ctx.model,
@@ -394,11 +394,10 @@
                       prop: itemProp.value,
                       onChange: onChangeHandler,
                       onAddDiffCount
-                    }, null, 40, ["data-tmagic-form-item-prop", "size", "model", "last-values", "config", "name", "disabled", "prop"]))
+                    }, null, 40, ["size", "model", "last-values", "config", "name", "disabled", "prop"]))
                   ]),
                   _: 1
                 })) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tagName.value), {
-                  "data-tmagic-form-item-prop": itemProp.value,
                   key: key(_ctx.config),
                   size: _ctx.size,
                   model: _ctx.model,
@@ -409,12 +408,12 @@
                   prop: itemProp.value,
                   onChange: onChangeHandler,
                   onAddDiffCount
-                }, null, 40, ["data-tmagic-form-item-prop", "size", "model", "last-values", "config", "name", "disabled", "prop"])),
+                }, null, 40, ["size", "model", "last-values", "config", "name", "disabled", "prop"])),
                 extra.value && type.value !== "table" ? (vue.openBlock(), vue.createElementBlock("div", {
                   key: 2,
                   innerHTML: extra.value,
                   class: "m-form-tip"
-                }, null, 8, _hoisted_4$4)) : vue.createCommentVNode("", true)
+                }, null, 8, _hoisted_4$3)) : vue.createCommentVNode("", true)
               ]),
               _: 1
             }, 8, ["style", "class", "prop", "label-width", "rules"]),
@@ -425,7 +424,7 @@
               content: vue.withCtx(() => [
                 vue.createElementVNode("div", {
                   innerHTML: _ctx.config.tip
-                }, null, 8, _hoisted_5$4)
+                }, null, 8, _hoisted_5$3)
               ]),
               default: vue.withCtx(() => [
                 vue.createVNode(vue.unref(design.TMagicIcon), { style: { "line-height": "40px", "margin-left": "5px" } }, {
@@ -613,10 +612,10 @@
   });
 
   const _hoisted_1$c = ["innerHTML"];
-  const _hoisted_2$7 = ["innerHTML"];
-  const _hoisted_3$4 = { key: 1 };
-  const _hoisted_4$3 = ["innerHTML"];
-  const _hoisted_5$3 = ["innerHTML"];
+  const _hoisted_2$6 = ["innerHTML"];
+  const _hoisted_3$3 = { key: 1 };
+  const _hoisted_4$2 = ["innerHTML"];
+  const _hoisted_5$2 = ["innerHTML"];
   const _hoisted_6$1 = {
     key: 2,
     style: { "display": "flex" }
@@ -688,21 +687,21 @@
                     key: 0,
                     innerHTML: _ctx.config.extra,
                     class: "m-form-tip"
-                  }, null, 8, _hoisted_2$7)) : vue.createCommentVNode("", true)
+                  }, null, 8, _hoisted_2$6)) : vue.createCommentVNode("", true)
                 ]),
                 _: 1
               }, 8, ["modelValue", "prop"])
             ]),
             _: 1
-          })) : (vue.openBlock(), vue.createElementBlock("legend", _hoisted_3$4, [
+          })) : (vue.openBlock(), vue.createElementBlock("legend", _hoisted_3$3, [
             vue.createElementVNode("span", {
               innerHTML: _ctx.config.legend
-            }, null, 8, _hoisted_4$3),
+            }, null, 8, _hoisted_4$2),
             _ctx.config.extra ? (vue.openBlock(), vue.createElementBlock("span", {
               key: 0,
               innerHTML: _ctx.config.extra,
               class: "m-form-tip"
-            }, null, 8, _hoisted_5$3)) : vue.createCommentVNode("", true)
+            }, null, 8, _hoisted_5$2)) : vue.createCommentVNode("", true)
           ])),
           _ctx.config.schematic && show.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$1, [
             vue.createElementVNode("div", _hoisted_7, [
@@ -749,7 +748,7 @@
   });
 
   const _hoisted_1$b = { class: "m-fields-group-list-item" };
-  const _hoisted_2$6 = ["innerHTML"];
+  const _hoisted_2$5 = ["innerHTML"];
   const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MFormGroupListItem"
@@ -850,7 +849,7 @@
                 onClick: _cache[0] || (_cache[0] = ($event) => changeOrder(-1))
               }, {
                 default: vue.withCtx(() => [
-                  vue.createTextVNode("上移"),
+                  _cache[3] || (_cache[3] = vue.createTextVNode("上移")),
                   vue.createVNode(vue.unref(design.TMagicIcon), null, {
                     default: vue.withCtx(() => [
                       vue.createVNode(vue.unref(iconsVue.CaretTop))
@@ -869,7 +868,7 @@
                 onClick: _cache[1] || (_cache[1] = ($event) => changeOrder(1))
               }, {
                 default: vue.withCtx(() => [
-                  vue.createTextVNode("下移"),
+                  _cache[4] || (_cache[4] = vue.createTextVNode("下移")),
                   vue.createVNode(vue.unref(design.TMagicIcon), null, {
                     default: vue.withCtx(() => [
                       vue.createVNode(vue.unref(iconsVue.CaretBottom))
@@ -886,7 +885,7 @@
               key: 1,
               innerHTML: itemExtra.value,
               class: "m-form-tip"
-            }, null, 8, _hoisted_2$6)) : vue.createCommentVNode("", true)
+            }, null, 8, _hoisted_2$5)) : vue.createCommentVNode("", true)
           ]),
           expand.value ? (vue.openBlock(), vue.createBlock(_sfc_main$x, {
             key: 0,
@@ -907,15 +906,11 @@
   });
 
   const _hoisted_1$a = { class: "m-fields-group-list" };
-  const _hoisted_2$5 = ["innerHTML"];
-  const _hoisted_3$3 = {
+  const _hoisted_2$4 = ["innerHTML"];
+  const _hoisted_3$2 = {
     key: 1,
     class: "el-table__empty-block"
   };
-  const _hoisted_4$2 = /* @__PURE__ */ vue.createElementVNode("span", { class: "el-table__empty-text" }, "暂无数据", -1);
-  const _hoisted_5$2 = [
-    _hoisted_4$2
-  ];
   const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MFormGroupList"
@@ -1001,8 +996,10 @@
             key: 0,
             innerHTML: _ctx.config.extra,
             style: { "color": "rgba(0, 0, 0, 0.45)" }
-          }, null, 8, _hoisted_2$5)) : vue.createCommentVNode("", true),
-          !_ctx.model[_ctx.name] || !_ctx.model[_ctx.name].length ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$3, _hoisted_5$2)) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 2 }, vue.renderList(_ctx.model[_ctx.name], (item, index) => {
+          }, null, 8, _hoisted_2$4)) : vue.createCommentVNode("", true),
+          !_ctx.model[_ctx.name] || !_ctx.model[_ctx.name].length ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$2, _cache[1] || (_cache[1] = [
+            vue.createElementVNode("span", { class: "el-table__empty-text" }, "暂无数据", -1)
+          ]))) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 2 }, vue.renderList(_ctx.model[_ctx.name], (item, index) => {
             return vue.openBlock(), vue.createBlock(_sfc_main$v, {
               key: index,
               model: item,
@@ -1027,9 +1024,9 @@
             size: "small",
             disabled: _ctx.disabled
           }, {
-            default: vue.withCtx(() => [
+            default: vue.withCtx(() => _cache[2] || (_cache[2] = [
               vue.createTextVNode("新增")
-            ]),
+            ])),
             _: 1
           }, 8, ["disabled"])) : vue.createCommentVNode("", true),
           _ctx.config.enableToggleMode ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
@@ -1038,9 +1035,9 @@
             size: "small",
             onClick: toggleMode
           }, {
-            default: vue.withCtx(() => [
+            default: vue.withCtx(() => _cache[3] || (_cache[3] = [
               vue.createTextVNode("切换为表格")
-            ]),
+            ])),
             _: 1
           }, 8, ["icon"])) : vue.createCommentVNode("", true)
         ]);
@@ -1049,8 +1046,8 @@
   });
 
   const _hoisted_1$9 = { style: { "width": "100%", "display": "flex", "align-items": "center" } };
-  const _hoisted_2$4 = ["innerHTML"];
-  const _hoisted_3$2 = {
+  const _hoisted_2$3 = ["innerHTML"];
+  const _hoisted_3$1 = {
     key: 0,
     style: { "display": "flex" }
   };
@@ -1100,7 +1097,7 @@
                 key: 0,
                 innerHTML: _ctx.config.extra,
                 class: "m-form-tip"
-              }, null, 8, _hoisted_2$4)) : vue.createCommentVNode("", true),
+              }, null, 8, _hoisted_2$3)) : vue.createCommentVNode("", true),
               vue.renderSlot(_ctx.$slots, "header", {}, () => [
                 vue.createTextVNode(vue.toDisplayString(filter(_ctx.config.title)), 1)
               ])
@@ -1109,7 +1106,7 @@
           default: vue.withCtx(() => [
             vue.createElementVNode("div", null, [
               vue.renderSlot(_ctx.$slots, "default"),
-              _ctx.config.schematic ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$2, [
+              _ctx.config.schematic ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$1, [
                 vue.createElementVNode("div", _hoisted_4$1, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(items.value, (item, index) => {
                     return vue.openBlock(), vue.createBlock(_sfc_main$x, {
@@ -1335,8 +1332,8 @@
   });
 
   const _hoisted_1$8 = { class: "m-fields-table-wrap" };
-  const _hoisted_2$3 = ["innerHTML"];
-  const _hoisted_3$1 = ["innerHTML"];
+  const _hoisted_2$2 = ["innerHTML"];
+  const _hoisted_3 = ["innerHTML"];
   const _hoisted_4 = { style: { "display": "flex", "justify-content": "space-between", "margin": "10px 0" } };
   const _hoisted_5 = { style: { "display": "flex" } };
   const _hoisted_6 = {
@@ -1714,7 +1711,7 @@
                 key: 0,
                 style: { "color": "rgba(0, 0, 0, 0.45)" },
                 innerHTML: _ctx.config.extra
-              }, null, 8, _hoisted_2$3)) : vue.createCommentVNode("", true),
+              }, null, 8, _hoisted_2$2)) : vue.createCommentVNode("", true),
               vue.createVNode(vue.unref(design.TMagicTooltip), {
                 content: "拖拽可排序",
                 placement: "left-start",
@@ -1746,7 +1743,7 @@
                           vue.createElementVNode("span", {
                             innerHTML: itemExtra(_ctx.config.itemExtra, scope.$index),
                             class: "m-form-tip"
-                          }, null, 8, _hoisted_3$1)
+                          }, null, 8, _hoisted_3)
                         ]),
                         _: 1
                       })) : vue.createCommentVNode("", true),
@@ -1883,9 +1880,9 @@
                   plain: "",
                   onClick: _cache[2] || (_cache[2] = ($event) => newHandler())
                 }, {
-                  default: vue.withCtx(() => [
+                  default: vue.withCtx(() => _cache[4] || (_cache[4] = [
                     vue.createTextVNode("新增一行")
-                  ]),
+                  ])),
                   _: 1
                 }, 8, ["disabled"])) : vue.createCommentVNode("", true),
                 vue.createElementVNode("div", _hoisted_5, [
@@ -1896,9 +1893,9 @@
                     type: "primary",
                     onClick: toggleMode
                   }, {
-                    default: vue.withCtx(() => [
+                    default: vue.withCtx(() => _cache[5] || (_cache[5] = [
                       vue.createTextVNode("展开配置")
-                    ]),
+                    ])),
                     _: 1
                   }, 8, ["icon"])) : vue.createCommentVNode("", true),
                   _ctx.config.enableFullscreen !== false ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
@@ -1930,9 +1927,9 @@
                         disabled: _ctx.disabled,
                         plain: ""
                       }, {
-                        default: vue.withCtx(() => [
+                        default: vue.withCtx(() => _cache[6] || (_cache[6] = [
                           vue.createTextVNode("导入EXCEL")
-                        ]),
+                        ])),
                         _: 1
                       }, 8, ["disabled"])
                     ]),
@@ -1946,9 +1943,9 @@
                     plain: "",
                     onClick: _cache[3] || (_cache[3] = ($event) => clearHandler())
                   }, {
-                    default: vue.withCtx(() => [
+                    default: vue.withCtx(() => _cache[7] || (_cache[7] = [
                       vue.createTextVNode("清空")
-                    ]),
+                    ])),
                     _: 1
                   }, 8, ["disabled"])) : vue.createCommentVNode("", true)
                 ])
@@ -2475,7 +2472,7 @@
       const props = __props;
       const emit = __emit;
       useAddField(props.prop);
-      props.model[props.name] = datetimeFormatter(props.model[props.name], "", "YYYY/MM/DD");
+      props.model[props.name] = datetimeFormatter(props.model[props.name], "", props.config.valueFormat || "YYYY/MM/DD");
       const changeHandler = (v) => {
         emit("change", v);
       };
@@ -2527,8 +2524,8 @@
                 value.value = [];
               }
               if (!start || !end) value.value = [];
-              if (start !== preStart) value.value[0] = new Date(start);
-              if (end !== preEnd) value.value[1] = new Date(end);
+              if (start !== preStart) value.value[0] = start;
+              if (end !== preEnd) value.value[1] = end;
             },
             {
               immediate: true
@@ -2537,8 +2534,8 @@
         } else if (props.name && props.model[props.name]) {
           vue.watch(
             () => props.model[props.name],
-            (start, preStart) => {
-              if (start !== preStart) value.value = start.map((item) => item ? new Date(item) : void 0);
+            (start) => {
+              value.value = start;
             },
             {
               immediate: true
@@ -2552,11 +2549,7 @@
             return;
           }
           if (Array.isArray(v)) {
-            props.model[item] = datetimeFormatter(
-              v[index]?.toString(),
-              "",
-              props.config.valueFormat || "YYYY/MM/DD HH:mm:ss"
-            );
+            props.model[item] = v[index];
           } else {
             props.model[item] = void 0;
           }
@@ -2565,18 +2558,12 @@
       const changeHandler = (v) => {
         const value2 = v || [];
         if (props.name) {
-          emit(
-            "change",
-            value2.map((item) => {
-              if (item) return datetimeFormatter(item, "", props.config.valueFormat || "YYYY/MM/DD HH:mm:ss");
-              return void 0;
-            })
-          );
+          emit("change", value2);
         } else {
           if (names?.length) {
             setValue(value2);
           }
-          emit("change", value2);
+          emit("change", props.model);
         }
       };
       return (_ctx, _cache) => {
@@ -3086,9 +3073,9 @@
                         onClick: cancel,
                         size: "small"
                       }, {
-                        default: vue.withCtx(() => [
+                        default: vue.withCtx(() => _cache[2] || (_cache[2] = [
                           vue.createTextVNode("取 消")
-                        ]),
+                        ])),
                         _: 1
                       }),
                       hasStep.value && stepActive.value > 1 ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
@@ -3097,9 +3084,9 @@
                         size: "small",
                         onClick: preStep
                       }, {
-                        default: vue.withCtx(() => [
+                        default: vue.withCtx(() => _cache[3] || (_cache[3] = [
                           vue.createTextVNode("上一步")
-                        ]),
+                        ])),
                         _: 1
                       })) : vue.createCommentVNode("", true),
                       hasStep.value && stepCount.value > stepActive.value ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
@@ -3108,9 +3095,9 @@
                         size: "small",
                         onClick: nextStep
                       }, {
-                        default: vue.withCtx(() => [
+                        default: vue.withCtx(() => _cache[4] || (_cache[4] = [
                           vue.createTextVNode("下一步")
-                        ]),
+                        ])),
                         _: 1
                       })) : (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
                         key: 2,
@@ -3164,7 +3151,7 @@
   });
 
   const _hoisted_1$4 = ["href"];
-  const _hoisted_2$2 = {
+  const _hoisted_2$1 = {
     key: 2,
     class: "m-fields-link"
   };
@@ -3240,15 +3227,15 @@
         }, vue.toDisplayString(displayText.value), 13, _hoisted_1$4)) : _ctx.config.href && _ctx.disabled ? (vue.openBlock(), vue.createElementBlock("span", {
           key: 1,
           style: vue.normalizeStyle(_ctx.config.disabledCss || {})
-        }, vue.toDisplayString(displayText.value), 5)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$2, [
+        }, vue.toDisplayString(displayText.value), 5)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
           vue.createVNode(vue.unref(design.TMagicButton), {
             link: "",
             type: "primary",
             onClick: editHandler
           }, {
-            default: vue.withCtx(() => [
+            default: vue.withCtx(() => _cache[0] || (_cache[0] = [
               vue.createTextVNode("点击编辑")
-            ]),
+            ])),
             _: 1
           }),
           vue.createVNode(_sfc_main$c, {
@@ -3317,7 +3304,6 @@
   });
 
   const _hoisted_1$3 = { class: "m-fields-number-range" };
-  const _hoisted_2$1 = /* @__PURE__ */ vue.createElementVNode("span", { class: "split-tag" }, "-", -1);
   const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MFormNumberRange"
@@ -3358,7 +3344,7 @@
             disabled: _ctx.disabled,
             onChange: minChangeHandler
           }, null, 8, ["modelValue", "size", "disabled"]),
-          _hoisted_2$1,
+          _cache[2] || (_cache[2] = vue.createElementVNode("span", { class: "split-tag" }, "-", -1)),
           vue.createVNode(vue.unref(design.TMagicInput), {
             modelValue: _ctx.model[_ctx.name][1],
             "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.model[_ctx.name][1] = $event),
@@ -3881,8 +3867,7 @@
   });
 
   const _hoisted_1$1 = { class: "m-form-item__content" };
-  const _hoisted_2 = /* @__PURE__ */ vue.createElementVNode("div", { class: "m-form-validate__warning" }, "输入内容前后有空格，是否移除空格？", -1);
-  const _hoisted_3 = { style: { "display": "flex", "justify-content": "flex-end" } };
+  const _hoisted_2 = { style: { "display": "flex", "justify-content": "flex-end" } };
   const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MFormText"
@@ -4008,7 +3993,6 @@
               modelValue: _ctx.model[_ctx.name],
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
               clearable: "",
-              "data-tmagic-form-item-prop": _ctx.prop,
               size: _ctx.size,
               placeholder: _ctx.config.placeholder,
               disabled: _ctx.disabled,
@@ -4033,20 +4017,20 @@
                 ]),
                 key: "0"
               } : void 0
-            ]), 1032, ["modelValue", "data-tmagic-form-item-prop", "size", "placeholder", "disabled"])
+            ]), 1032, ["modelValue", "size", "placeholder", "disabled"])
           ]),
           default: vue.withCtx(() => [
             vue.createElementVNode("div", _hoisted_1$1, [
-              _hoisted_2,
-              vue.createElementVNode("div", _hoisted_3, [
+              _cache[5] || (_cache[5] = vue.createElementVNode("div", { class: "m-form-validate__warning" }, "输入内容前后有空格，是否移除空格？", -1)),
+              vue.createElementVNode("div", _hoisted_2, [
                 vue.createVNode(vue.unref(design.TMagicButton), {
                   link: "",
                   size: "small",
                   onClick: _cache[2] || (_cache[2] = ($event) => popoverVisible.value = false)
                 }, {
-                  default: vue.withCtx(() => [
+                  default: vue.withCtx(() => _cache[3] || (_cache[3] = [
                     vue.createTextVNode("保持原样")
-                  ]),
+                  ])),
                   _: 1
                 }),
                 vue.createVNode(vue.unref(design.TMagicButton), {
@@ -4054,9 +4038,9 @@
                   size: "small",
                   onClick: confirmTrimHandler
                 }, {
-                  default: vue.withCtx(() => [
+                  default: vue.withCtx(() => _cache[4] || (_cache[4] = [
                     vue.createTextVNode("移除空格")
-                  ]),
+                  ])),
                   _: 1
                 })
               ])
@@ -4342,9 +4326,9 @@
                   default: vue.withCtx(() => [
                     vue.renderSlot(_ctx.$slots, "footer", {}, () => [
                       vue.createVNode(vue.unref(design.TMagicButton), { onClick: handleClose }, {
-                        default: vue.withCtx(() => [
+                        default: vue.withCtx(() => _cache[1] || (_cache[1] = [
                           vue.createTextVNode("关闭")
-                        ]),
+                        ])),
                         _: 1
                       }),
                       vue.createVNode(vue.unref(design.TMagicButton), {
@@ -4519,8 +4503,8 @@
   const createForm = (config) => config;
   const defaultInstallOpt = {};
   const index = {
-    install(app, opt = {}) {
-      const option = Object.assign(defaultInstallOpt, opt);
+    install(app, opt) {
+      const option = Object.assign(defaultInstallOpt, opt || {});
       app.config.globalProperties.$MAGIC_FORM = option;
       setConfig(option);
       app.component("m-form", _sfc_main$d);

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.5.0-beta.6",
+  "version": "1.5.0-beta.7",
   "name": "@tmagic/form",
   "type": "module",
   "sideEffects": [
@@ -44,18 +44,18 @@
     "@types/lodash-es": "^4.17.4",
     "@types/node": "^18.19.0",
     "@types/sortablejs": "^1.15.8",
-    "@vitejs/plugin-vue": "^5.1.1",
-    "@vue/compiler-sfc": "^3.4.27",
+    "@vitejs/plugin-vue": "^5.1.3",
+    "@vue/compiler-sfc": "^3.5.0",
     "@vue/test-utils": "^2.4.6",
     "rimraf": "^3.0.2",
-    "sass": "^1.77.0",
-    "vite": "^5.3.5"
+    "sass": "^1.78.0",
+    "vite": "^5.4.3"
   },
   "peerDependencies": {
-    "vue": "^3.4.35",
+    "vue": "^3.5.0",
     "typescript": "*",
-    "@tmagic/design": "1.5.0-beta.6",
-    "@tmagic/utils": "1.5.0-beta.6"
+    "@tmagic/design": "1.5.0-beta.7",
+    "@tmagic/utils": "1.5.0-beta.7"
   },
   "peerDependenciesMeta": {
     "typescript": {

package/src/containers/Container.vue

@@ -2,6 +2,7 @@
   <div
     v-if="config"
     :data-tmagic-id="config.id"
+    :data-tmagic-form-item-prop="itemProp"
     :style="config.tip ? 'display: flex;align-items: baseline;' : ''"
     :class="`m-form-container m-container-${type || ''} ${config.className || ''}`"
   >
@@ -44,7 +45,6 @@
         <template #label><span v-html="type === 'checkbox' ? '' : text" :title="config.labelTitle"></span></template>
         <TMagicTooltip v-if="tooltip">
           <component
-            :data-tmagic-form-item-prop="itemProp"
             :key="key(config)"
             :size="size"
             :is="tagName"
@@ -64,7 +64,6 @@
 
         <component
           v-else
-          :data-tmagic-form-item-prop="itemProp"
           :key="key(config)"
           :size="size"
           :is="tagName"

package/src/fields/Date.vue

@@ -30,7 +30,7 @@ const emit = defineEmits<{
 
 useAddField(props.prop);
 
-props.model[props.name] = datetimeFormatter(props.model[props.name], '', 'YYYY/MM/DD');
+props.model[props.name] = datetimeFormatter(props.model[props.name], '', props.config.valueFormat || 'YYYY/MM/DD');
 
 const changeHandler = (v: string) => {
   emit('change', v);

package/src/fields/Daterange.vue

@@ -22,7 +22,6 @@ import { ref, watch } from 'vue';
 import { TMagicDatePicker } from '@tmagic/design';
 
 import type { DaterangeConfig, FieldProps } from '../schema';
-import { datetimeFormatter } from '../utils/form';
 import { useAddField } from '../utils/useAddField';
 
 defineOptions({
@@ -35,7 +34,6 @@ const emit = defineEmits(['change']);
 
 useAddField(props.prop);
 
-// eslint-disable-next-line vue/no-setup-props-destructure
 const { names } = props.config;
 const value = ref<(Date | undefined)[] | null>([]);
 
@@ -48,8 +46,8 @@ if (props.model !== undefined) {
           value.value = [];
         }
         if (!start || !end) value.value = [];
-        if (start !== preStart) value.value[0] = new Date(start);
-        if (end !== preEnd) value.value[1] = new Date(end);
+        if (start !== preStart) value.value[0] = start;
+        if (end !== preEnd) value.value[1] = end;
       },
       {
         immediate: true,
@@ -58,8 +56,8 @@ if (props.model !== undefined) {
   } else if (props.name && props.model[props.name]) {
     watch(
       () => props.model[props.name],
-      (start, preStart) => {
-        if (start !== preStart) value.value = start.map((item: string) => (item ? new Date(item) : undefined));
+      (start) => {
+        value.value = start;
       },
       {
         immediate: true,
@@ -74,11 +72,7 @@ const setValue = (v: Date[] | Date) => {
       return;
     }
     if (Array.isArray(v)) {
-      props.model[item] = datetimeFormatter(
-        v[index]?.toString(),
-        '',
-        props.config.valueFormat || 'YYYY/MM/DD HH:mm:ss',
-      );
+      props.model[item] = v[index];
     } else {
       props.model[item] = undefined;
     }
@@ -89,18 +83,12 @@ const changeHandler = (v: Date[]) => {
   const value = v || [];
 
   if (props.name) {
-    emit(
-      'change',
-      value.map((item?: Date) => {
-        if (item) return datetimeFormatter(item, '', props.config.valueFormat || 'YYYY/MM/DD HH:mm:ss');
-        return undefined;
-      }),
-    );
+    emit('change', value);
   } else {
     if (names?.length) {
       setValue(value);
     }
-    emit('change', value);
+    emit('change', props.model);
   }
 };
 </script>