@tmagic/form 1.1.6 → 1.2.0-beta.2

package/dist/tmagic-form.mjs

@@ -1,4 +1,4 @@
-import { toRaw, defineComponent, inject, ref, computed, resolveComponent, watchEffect, openBlock, createElementBlock, normalizeStyle, normalizeClass, createBlock, resolveDynamicComponent, Fragment, createVNode, withCtx, createElementVNode, createCommentVNode, renderList, createTextVNode, toDisplayString, watch, unref, withDirectives, vShow, renderSlot, onMounted, toRefs, getCurrentInstance, reactive, onBeforeUnmount, vModelText, onBeforeMount, resolveDirective, createSlots, withModifiers, provide, Teleport } from 'vue';
+import { toRaw, defineComponent, inject, ref, computed, resolveComponent, watchEffect, openBlock, createElementBlock, normalizeStyle, normalizeClass, createBlock, resolveDynamicComponent, Fragment, createVNode, withCtx, createElementVNode, createCommentVNode, renderList, createTextVNode, toDisplayString, watch, unref, withDirectives, vShow, renderSlot, onMounted, toRefs, getCurrentInstance, reactive, onBeforeUnmount, vModelText, onBeforeMount, resolveDirective, createSlots, withModifiers, provide } from 'vue';
 import { WarningFilled, CaretBottom, CaretRight, CaretTop, Delete, Grid, ArrowDown, ArrowUp, FullScreen } from '@element-plus/icons-vue';
 import { cloneDeep, isEqual } from 'lodash-es';
 import { ElMessage } from 'element-plus';
@@ -320,7 +320,7 @@ const _hoisted_1$c = ["innerHTML"];
 const _hoisted_2$7 = ["innerHTML"];
 const _hoisted_3$7 = ["innerHTML"];
 const _hoisted_4$6 = ["innerHTML"];
-const _hoisted_5$5 = {
+const _hoisted_5$4 = {
   key: 4,
   style: { "text-align": "center" }
 };
@@ -438,7 +438,7 @@ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
         }, null, 8, ["model", "config", "size", "step-active", "expand-more", "label-width", "prop", "onChange"]);
       }), 128)) : createCommentVNode("", true)
     ], 64)) : createCommentVNode("", true),
-    _ctx.config.expand && _ctx.type !== "fieldset" ? (openBlock(), createElementBlock("div", _hoisted_5$5, [
+    _ctx.config.expand && _ctx.type !== "fieldset" ? (openBlock(), createElementBlock("div", _hoisted_5$4, [
       createVNode(_component_el_button, {
         text: "",
         onClick: _ctx.expandHandler
@@ -457,7 +457,7 @@ const _hoisted_1$b = ["innerHTML"];
 const _hoisted_2$6 = ["innerHTML"];
 const _hoisted_3$6 = { key: 1 };
 const _hoisted_4$5 = ["innerHTML"];
-const _hoisted_5$4 = ["innerHTML"];
+const _hoisted_5$3 = ["innerHTML"];
 const _hoisted_6$2 = {
   key: 2,
   style: { "display": "flex" }
@@ -542,7 +542,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
             key: 0,
             innerHTML: __props.config.extra,
             class: "m-form-tip"
-          }, null, 8, _hoisted_5$4)) : createCommentVNode("", true)
+          }, null, 8, _hoisted_5$3)) : createCommentVNode("", true)
         ])),
         __props.config.schematic && unref(show) ? (openBlock(), createElementBlock("div", _hoisted_6$2, [
           createElementVNode("div", _hoisted_7$2, [
@@ -866,7 +866,7 @@ const _hoisted_3$4 = {
   class: "el-table__empty-block"
 };
 const _hoisted_4$3 = /* @__PURE__ */ createElementVNode("span", { class: "el-table__empty-text" }, "\u6682\u65E0\u6570\u636E", -1);
-const _hoisted_5$3 = [
+const _hoisted_5$2 = [
   _hoisted_4$3
 ];
 const _hoisted_6$1 = /* @__PURE__ */ createTextVNode("\u6DFB\u52A0\u7EC4");
@@ -880,7 +880,7 @@ function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
       innerHTML: _ctx.config.extra,
       style: { "color": "rgba(0, 0, 0, 0.45)" }
     }, null, 8, _hoisted_2$4)) : createCommentVNode("", true),
-    !_ctx.model[_ctx.name] || !_ctx.model[_ctx.name].length ? (openBlock(), createElementBlock("div", _hoisted_3$4, _hoisted_5$3)) : (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(_ctx.model[_ctx.name], (item, index) => {
+    !_ctx.model[_ctx.name] || !_ctx.model[_ctx.name].length ? (openBlock(), createElementBlock("div", _hoisted_3$4, _hoisted_5$2)) : (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(_ctx.model[_ctx.name], (item, index) => {
       return openBlock(), createBlock(_component_m_fields_group_list_item, {
         key: index,
         model: item,
@@ -961,7 +961,7 @@ const _hoisted_3$3 = {
   style: { "display": "flex" }
 };
 const _hoisted_4$2 = { style: { "flex": "1" } };
-const _hoisted_5$2 = ["src"];
+const _hoisted_5$1 = ["src"];
 function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_caret_bottom = resolveComponent("caret-bottom");
   const _component_caret_right = resolveComponent("caret-right");
@@ -1015,7 +1015,7 @@ function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
           createElementVNode("img", {
             class: "m-form-schematic",
             src: _ctx.config.schematic
-          }, null, 8, _hoisted_5$2)
+          }, null, 8, _hoisted_5$1)
         ])) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(_ctx.items, (item, index) => {
           return openBlock(), createBlock(_component_m_form_container, {
             key: item[_ctx.mForm?.keyProp || "__key"] ?? index,
@@ -1601,7 +1601,7 @@ const _hoisted_1$7 = ["innerHTML"];
 const _hoisted_2$2 = { class: "el-form-item__content" };
 const _hoisted_3$2 = ["innerHTML"];
 const _hoisted_4$1 = /* @__PURE__ */ createTextVNode("\u6DFB\u52A0");
-const _hoisted_5$1 = /* @__PURE__ */ createTextVNode(" \xA0 ");
+const _hoisted_5 = /* @__PURE__ */ createTextVNode(" \xA0 ");
 const _hoisted_6 = /* @__PURE__ */ createTextVNode("\u5C55\u5F00\u914D\u7F6E");
 const _hoisted_7 = /* @__PURE__ */ createTextVNode("\u5BFC\u5165EXCEL");
 const _hoisted_8 = /* @__PURE__ */ createTextVNode("\xA0 ");
@@ -1791,7 +1791,7 @@ function _sfc_render$h(_ctx, _cache, $props, $setup, $data, $options) {
         ]),
         _: 1
       })) : createCommentVNode("", true),
-      _hoisted_5$1,
+      _hoisted_5,
       _ctx.enableToggleMode && !_ctx.isFullscreen ? (openBlock(), createBlock(_component_el_button, {
         key: 1,
         icon: _ctx.Grid,
@@ -3113,34 +3113,23 @@ const _sfc_main$6 = defineComponent({
       return options2;
     };
     if (typeof props.config.options === "function") {
-      watch(
-        () => mForm?.values,
-        () => {
-          typeof props.config.options === "function" && Promise.resolve(
-            props.config.options(mForm, {
-              model: props.model,
-              prop: props.prop,
-              formValues: mForm?.values,
-              formValue: mForm?.values,
-              config: props.config
-            })
-          ).then((data) => {
-            options.value = data;
-          });
-        },
-        {
-          deep: true,
-          immediate: true
-        }
-      );
+      watchEffect(() => {
+        typeof props.config.options === "function" && Promise.resolve(
+          props.config.options(mForm, {
+            model: props.model,
+            prop: props.prop,
+            formValues: mForm?.values,
+            formValue: mForm?.values,
+            config: props.config
+          })
+        ).then((data) => {
+          options.value = data;
+        });
+      });
     } else if (Array.isArray(props.config.options)) {
-      watch(
-        () => props.config.options,
-        () => {
-          options.value = props.config.options;
-        },
-        { immediate: true }
-      );
+      watchEffect(() => {
+        options.value = props.config.options;
+      });
     } else if (props.config.option) {
       onBeforeMount(() => {
         if (!props.model)
@@ -3778,121 +3767,117 @@ const _sfc_main = defineComponent({
   }
 });
 
-const _hoisted_1 = { class: "m-form-dialog" };
-const _hoisted_2 = { style: { "min-height": "1px" } };
-const _hoisted_3 = /* @__PURE__ */ createTextVNode("\u53D6 \u6D88");
-const _hoisted_4 = /* @__PURE__ */ createTextVNode("\u4E0A\u4E00\u6B65");
-const _hoisted_5 = /* @__PURE__ */ createTextVNode("\u4E0B\u4E00\u6B65");
+const _hoisted_1 = { style: { "min-height": "1px" } };
+const _hoisted_2 = /* @__PURE__ */ createTextVNode("\u53D6 \u6D88");
+const _hoisted_3 = /* @__PURE__ */ createTextVNode("\u4E0A\u4E00\u6B65");
+const _hoisted_4 = /* @__PURE__ */ createTextVNode("\u4E0B\u4E00\u6B65");
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_m_form = resolveComponent("m-form");
   const _component_el_col = resolveComponent("el-col");
   const _component_el_button = resolveComponent("el-button");
   const _component_el_row = resolveComponent("el-row");
   const _component_el_dialog = resolveComponent("el-dialog");
-  return openBlock(), createBlock(Teleport, { to: "body" }, [
-    withDirectives(createElementVNode("div", _hoisted_1, [
-      createVNode(_component_el_dialog, {
-        modelValue: _ctx.dialogVisible,
-        "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.dialogVisible = $event),
-        top: "20px",
-        title: _ctx.title,
-        width: _ctx.width,
-        fullscreen: _ctx.fullscreen,
-        "close-on-click-modal": false,
-        onClose: _ctx.closeHandler
-      }, {
-        footer: withCtx(() => [
-          createVNode(_component_el_row, { class: "dialog-footer" }, {
+  return openBlock(), createBlock(_component_el_dialog, {
+    modelValue: _ctx.dialogVisible,
+    "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.dialogVisible = $event),
+    class: "m-form-dialog",
+    top: "20px",
+    "append-to-body": "",
+    title: _ctx.title,
+    width: _ctx.width,
+    fullscreen: _ctx.fullscreen,
+    "close-on-click-modal": false,
+    onClose: _ctx.closeHandler
+  }, {
+    footer: withCtx(() => [
+      createVNode(_component_el_row, { class: "dialog-footer" }, {
+        default: withCtx(() => [
+          createVNode(_component_el_col, {
+            span: 12,
+            style: { "text-align": "left" }
+          }, {
             default: withCtx(() => [
-              createVNode(_component_el_col, {
-                span: 12,
-                style: { "text-align": "left" }
-              }, {
-                default: withCtx(() => [
-                  createElementVNode("div", _hoisted_2, [
-                    renderSlot(_ctx.$slots, "left")
-                  ])
-                ]),
-                _: 3
-              }),
-              createVNode(_component_el_col, { span: 12 }, {
-                default: withCtx(() => [
-                  renderSlot(_ctx.$slots, "footer", {}, () => [
-                    createVNode(_component_el_button, {
-                      onClick: _ctx.cancel,
-                      size: "small"
-                    }, {
-                      default: withCtx(() => [
-                        _hoisted_3
-                      ]),
-                      _: 1
-                    }, 8, ["onClick"]),
-                    _ctx.hasStep && _ctx.stepActive > 1 ? (openBlock(), createBlock(_component_el_button, {
-                      key: 0,
-                      type: "info",
-                      size: "small",
-                      onClick: _ctx.preStep
-                    }, {
-                      default: withCtx(() => [
-                        _hoisted_4
-                      ]),
-                      _: 1
-                    }, 8, ["onClick"])) : createCommentVNode("", true),
-                    _ctx.hasStep && _ctx.stepCount > _ctx.stepActive ? (openBlock(), createBlock(_component_el_button, {
-                      key: 1,
-                      type: "info",
-                      size: "small",
-                      onClick: _ctx.nextStep
-                    }, {
-                      default: withCtx(() => [
-                        _hoisted_5
-                      ]),
-                      _: 1
-                    }, 8, ["onClick"])) : (openBlock(), createBlock(_component_el_button, {
-                      key: 2,
-                      type: "primary",
-                      size: "small",
-                      loading: _ctx.saveFetch,
-                      onClick: _ctx.save
-                    }, {
-                      default: withCtx(() => [
-                        createTextVNode(toDisplayString(_ctx.confirmText), 1)
-                      ]),
-                      _: 1
-                    }, 8, ["loading", "onClick"]))
-                  ])
-                ]),
-                _: 3
-              })
+              createElementVNode("div", _hoisted_1, [
+                renderSlot(_ctx.$slots, "left")
+              ])
+            ]),
+            _: 3
+          }),
+          createVNode(_component_el_col, { span: 12 }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "footer", {}, () => [
+                createVNode(_component_el_button, {
+                  onClick: _ctx.cancel,
+                  size: "small"
+                }, {
+                  default: withCtx(() => [
+                    _hoisted_2
+                  ]),
+                  _: 1
+                }, 8, ["onClick"]),
+                _ctx.hasStep && _ctx.stepActive > 1 ? (openBlock(), createBlock(_component_el_button, {
+                  key: 0,
+                  type: "info",
+                  size: "small",
+                  onClick: _ctx.preStep
+                }, {
+                  default: withCtx(() => [
+                    _hoisted_3
+                  ]),
+                  _: 1
+                }, 8, ["onClick"])) : createCommentVNode("", true),
+                _ctx.hasStep && _ctx.stepCount > _ctx.stepActive ? (openBlock(), createBlock(_component_el_button, {
+                  key: 1,
+                  type: "info",
+                  size: "small",
+                  onClick: _ctx.nextStep
+                }, {
+                  default: withCtx(() => [
+                    _hoisted_4
+                  ]),
+                  _: 1
+                }, 8, ["onClick"])) : (openBlock(), createBlock(_component_el_button, {
+                  key: 2,
+                  type: "primary",
+                  size: "small",
+                  loading: _ctx.saveFetch,
+                  onClick: _ctx.save
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(_ctx.confirmText), 1)
+                  ]),
+                  _: 1
+                }, 8, ["loading", "onClick"]))
+              ])
             ]),
             _: 3
           })
         ]),
-        default: withCtx(() => [
-          createElementVNode("div", {
-            class: "m-dialog-body",
-            style: normalizeStyle(`max-height: ${_ctx.bodyHeight}; overflow-y: auto; overflow-x: hidden;`)
-          }, [
-            createVNode(_component_m_form, {
-              modelValue: _ctx.stepActive,
-              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.stepActive = $event),
-              ref: "form",
-              size: _ctx.size,
-              config: _ctx.config,
-              "init-values": _ctx.values,
-              "parent-values": _ctx.parentValues,
-              "label-width": _ctx.labelWidth,
-              onChange: _ctx.changeHandler
-            }, null, 8, ["modelValue", "size", "config", "init-values", "parent-values", "label-width", "onChange"]),
-            renderSlot(_ctx.$slots, "default")
-          ], 4)
-        ]),
         _: 3
-      }, 8, ["modelValue", "title", "width", "fullscreen", "onClose"])
-    ], 512), [
-      [vShow, _ctx.dialogVisible]
-    ])
-  ]);
+      })
+    ]),
+    default: withCtx(() => [
+      _ctx.dialogVisible ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        class: "m-dialog-body",
+        style: normalizeStyle(`max-height: ${_ctx.bodyHeight}; overflow-y: auto; overflow-x: hidden;`)
+      }, [
+        createVNode(_component_m_form, {
+          modelValue: _ctx.stepActive,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.stepActive = $event),
+          ref: "form",
+          size: _ctx.size,
+          config: _ctx.config,
+          "init-values": _ctx.values,
+          "parent-values": _ctx.parentValues,
+          "label-width": _ctx.labelWidth,
+          onChange: _ctx.changeHandler
+        }, null, 8, ["modelValue", "size", "config", "init-values", "parent-values", "label-width", "onChange"]),
+        renderSlot(_ctx.$slots, "default")
+      ], 4)) : createCommentVNode("", true)
+    ]),
+    _: 3
+  }, 8, ["modelValue", "title", "width", "fullscreen", "onClose"]);
 }
 const FormDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);