@tmagic/form 1.0.0-beta.1 → 1.0.0-beta.4

package/dist/tmagic-form.umd.js

@@ -1362,6 +1362,8 @@
         ArrowDown: icons.ArrowDown,
         ArrowUp: icons.ArrowUp,
         Delete: icons.Delete,
+        FullScreen: icons.FullScreen,
+        Grid: icons.Grid,
         data: vue.computed(() => props.model[modelName.value].filter((item, index) => index >= pagecontext.value * pagesize.value && index + 1 <= (pagecontext.value + 1) * pagesize.value)),
         addable: vue.computed(() => {
           if (!props.model[modelName.value].length) {
@@ -1610,7 +1612,7 @@
                 })) : vue.createCommentVNode("", true),
                 vue.createVNode(_component_el_table_column, {
                   label: "\u64CD\u4F5C",
-                  width: "50",
+                  width: "60",
                   fixed: _ctx.config.fixed === false ? void 0 : "left"
                 }, {
                   default: vue.withCtx((scope) => [
@@ -1628,7 +1630,7 @@
                 _ctx.sort && _ctx.model[_ctx.modelName] && _ctx.model[_ctx.modelName].length > 1 ? (vue.openBlock(), vue.createBlock(_component_el_table_column, {
                   key: 1,
                   label: "\u6392\u5E8F",
-                  width: "70"
+                  width: "60"
                 }, {
                   default: vue.withCtx((scope) => [
                     scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1 !== 0 ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
@@ -1676,7 +1678,7 @@
                   width: "45"
                 })) : vue.createCommentVNode("", true),
                 vue.createVNode(_component_el_table_column, {
-                  width: "50",
+                  width: "60",
                   label: "\u5E8F\u53F7"
                 }, {
                   default: vue.withCtx((scope) => [
@@ -1733,7 +1735,7 @@
         _hoisted_5,
         _ctx.enableToggleMode && !_ctx.isFullscreen ? (vue.openBlock(), vue.createBlock(_component_el_button, {
           key: 1,
-          icon: "el-icon-s-grid",
+          icon: _ctx.Grid,
           size: "small",
           onClick: _ctx.toggleMode
         }, {
@@ -1741,10 +1743,10 @@
             _hoisted_6
           ]),
           _: 1
-        }, 8, ["onClick"])) : vue.createCommentVNode("", true),
+        }, 8, ["icon", "onClick"])) : vue.createCommentVNode("", true),
         _ctx.config.enableFullscreen !== false ? (vue.openBlock(), vue.createBlock(_component_el_button, {
           key: 2,
-          icon: "el-icon-s-grid",
+          icon: _ctx.FullScreen,
           size: "small",
           onClick: _ctx.toggleFullscreen
         }, {
@@ -1752,7 +1754,7 @@
             vue.createTextVNode(vue.toDisplayString(_ctx.isFullscreen ? "\u9000\u51FA\u5168\u5C4F" : "\u5168\u5C4F\u7F16\u8F91"), 1)
           ]),
           _: 1
-        }, 8, ["onClick"])) : vue.createCommentVNode("", true),
+        }, 8, ["icon", "onClick"])) : vue.createCommentVNode("", true),
         _ctx.importable ? (vue.openBlock(), vue.createBlock(_component_el_upload, {
           key: 3,
           ref: "excelBtn",
@@ -1818,6 +1820,7 @@
   };
   const tabClickHandler = (mForm, tab, props) => {
     const { config, model, prop } = props;
+    tab.name = tab.paneName;
     if (typeof config.onTabClick === "function") {
       config.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop });
     }
@@ -3358,7 +3361,6 @@
 
   const _sfc_main$1 = vue.defineComponent({
     name: "m-form",
-    components: { ElForm: elementPlus.ElForm, MContainer: Container },
     props: {
       initValues: {
         type: Object,
@@ -3391,8 +3393,7 @@
         default: () => 1
       },
       size: {
-        type: String,
-        default: "small"
+        type: String
       },
       inline: {
         type: Boolean,
@@ -3435,8 +3436,10 @@
         }
       });
       vue.provide("mForm", formState);
-      vue.watchEffect(() => {
-        initialized.value = false;
+      vue.watch([() => props.config, () => props.initValues], ([config], [preConfig]) => {
+        if (!lodashEs.isEqual(vue.toRaw(config), vue.toRaw(preConfig))) {
+          initialized.value = false;
+        }
         initValue(formState, {
           initValues: props.initValues,
           config: props.config
@@ -3444,7 +3447,7 @@
           values.value = value;
           initialized.value = true;
         });
-      });
+      }, { immediate: true });
       return {
         initialized,
         values,
@@ -3477,10 +3480,9 @@
     }
   });
   function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
-    const _component_MContainer = vue.resolveComponent("MContainer");
-    const _component_ElForm = vue.resolveComponent("ElForm");
-    return _ctx.initialized && Array.isArray(_ctx.config) ? (vue.openBlock(), vue.createBlock(_component_ElForm, {
-      key: 0,
+    const _component_m_form_container = vue.resolveComponent("m-form-container");
+    const _component_el_form = vue.resolveComponent("el-form");
+    return vue.openBlock(), vue.createBlock(_component_el_form, {
       class: "m-form",
       ref: "elForm",
       model: _ctx.values,
@@ -3491,8 +3493,8 @@
       "label-position": _ctx.labelPosition
     }, {
       default: vue.withCtx(() => [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config, (item, index) => {
-          return vue.openBlock(), vue.createBlock(_component_MContainer, {
+        _ctx.initialized && Array.isArray(_ctx.config) ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.config, (item, index) => {
+          return vue.openBlock(), vue.createBlock(_component_m_form_container, {
             key: item[_ctx.keyProp] ?? index,
             config: item,
             model: _ctx.values,
@@ -3501,10 +3503,10 @@
             size: _ctx.size,
             onChange: _ctx.changeHandler
           }, null, 8, ["config", "model", "label-width", "step-active", "size", "onChange"]);
-        }), 128))
+        }), 128)) : vue.createCommentVNode("", true)
       ]),
       _: 1
-    }, 8, ["model", "label-width", "disabled", "style", "inline", "label-position"])) : vue.createCommentVNode("", true);
+    }, 8, ["model", "label-width", "disabled", "style", "inline", "label-position"]);
   }
   var Form = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 
@@ -3524,6 +3526,7 @@
         default: () => []
       },
       labelWidth: [Number, String],
+      size: String,
       confirmText: {
         type: String,
         default: "\u786E\u5B9A"
@@ -3694,11 +3697,12 @@
               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,
               "label-width": _ctx.labelWidth,
               onChange: _ctx.changeHandler
-            }, null, 8, ["modelValue", "config", "init-values", "label-width", "onChange"]),
+            }, null, 8, ["modelValue", "size", "config", "init-values", "label-width", "onChange"]),
             vue.renderSlot(_ctx.$slots, "default")
           ], 4)
         ]),