@tmagic/form 1.2.0-beta.18 → 1.2.0-beta.19

package/dist/tmagic-form.umd.js

@@ -187,6 +187,7 @@
       model: null,
       config: null,
       prop: { default: "" },
+      disabled: { type: Boolean },
       labelWidth: null,
       expandMore: { type: Boolean, default: false },
       stepActive: null,
@@ -217,7 +218,9 @@
           return component;
         return "m-fields-text";
       });
-      const disabled = vue.computed(() => filterFunction(mForm, props.config.disabled, props));
+      const disabled = vue.computed(
+        () => typeof props.disabled === "undefined" ? filterFunction(mForm, props.config.disabled, props) : props.disabled
+      );
       const tooltip = vue.computed(() => filterFunction(mForm, props.config.tooltip, props));
       const extra = vue.computed(() => filterFunction(mForm, props.config.extra, props));
       const rule = vue.computed(() => getRules(mForm, props.config.rules, props));
@@ -314,13 +317,14 @@
             size: __props.size,
             model: __props.model,
             config: __props.config,
+            disabled: vue.unref(disabled),
             name: vue.unref(name),
             prop: vue.unref(itemProp),
             "step-active": __props.stepActive,
             "expand-more": expand.value,
             "label-width": vue.unref(itemLabelWidth),
             onChange: onChangeHandler
-          }, null, 40, ["size", "model", "config", "name", "prop", "step-active", "expand-more", "label-width"])) : vue.unref(type) && vue.unref(display$1) ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
+          }, null, 40, ["size", "model", "config", "disabled", "name", "prop", "step-active", "expand-more", "label-width"])) : vue.unref(type) && vue.unref(display$1) ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
             vue.createVNode(vue.unref(design.TMagicFormItem), {
               style: vue.normalizeStyle(__props.config.tip ? "flex: 1" : ""),
               class: vue.normalizeClass({ hidden: `${vue.unref(itemLabelWidth)}` === "0" || !__props.config.text }),
@@ -395,18 +399,20 @@
                 model: vue.unref(name) || vue.unref(name) === 0 ? __props.model[vue.unref(name)] : __props.model,
                 config: item,
                 size: __props.size,
+                disabled: vue.unref(disabled),
                 "step-active": __props.stepActive,
                 "expand-more": expand.value,
                 "label-width": vue.unref(itemLabelWidth),
                 prop: vue.unref(itemProp),
                 onChange: onChangeHandler
-              }, null, 8, ["model", "config", "size", "step-active", "expand-more", "label-width", "prop"]);
+              }, null, 8, ["model", "config", "size", "disabled", "step-active", "expand-more", "label-width", "prop"]);
             }), 128)) : vue.createCommentVNode("", true)
           ], 64)) : vue.createCommentVNode("", true),
           __props.config.expand && vue.unref(type) !== "fieldset" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$4, [
             vue.createVNode(vue.unref(design.TMagicButton), {
               type: "primary",
               size: "small",
+              disabled: false,
               text: "",
               onClick: expandHandler
             }, {
@@ -443,7 +449,8 @@
       size: null,
       model: null,
       config: null,
-      rules: { default: {} }
+      rules: { default: {} },
+      disabled: { type: Boolean }
     },
     emits: ["change"],
     setup(__props, { emit }) {
@@ -522,10 +529,11 @@
                   rules: vue.unref(name) ? __props.rules[vue.unref(name)] : [],
                   config: item,
                   prop: __props.prop,
+                  disabled: __props.disabled,
                   labelWidth: vue.unref(lWidth),
                   size: __props.size,
                   onChange: change
-                }, null, 8, ["model", "rules", "config", "prop", "labelWidth", "size"]);
+                }, null, 8, ["model", "rules", "config", "prop", "disabled", "labelWidth", "size"]);
               }), 128))
             ]),
             vue.createElementVNode("img", {
@@ -541,8 +549,9 @@
               prop: __props.prop,
               labelWidth: vue.unref(lWidth),
               size: __props.size,
+              disabled: __props.disabled,
               onChange: change
-            }, null, 8, ["model", "rules", "config", "prop", "labelWidth", "size"]);
+            }, null, 8, ["model", "rules", "config", "prop", "labelWidth", "size", "disabled"]);
           }), 128)) : vue.createCommentVNode("", true)
         ], 4)) : vue.createCommentVNode("", true);
       };
@@ -565,7 +574,8 @@
       labelWidth: null,
       prop: null,
       size: null,
-      index: null
+      index: null,
+      disabled: { type: Boolean }
     },
     emits: ["swap-item", "remove-item", "change"],
     setup(__props, { emit }) {
@@ -626,24 +636,27 @@
             }),
             vue.createVNode(vue.unref(design.TMagicButton), {
               text: "",
+              disabled: __props.disabled,
               onClick: expandHandler
             }, {
               default: vue.withCtx(() => [
                 vue.createTextVNode(vue.toDisplayString(vue.unref(title)), 1)
               ]),
               _: 1
-            }),
+            }, 8, ["disabled"]),
             vue.withDirectives(vue.createVNode(vue.unref(design.TMagicButton), {
+              style: { "color": "#f56c6c" },
               text: "",
               icon: vue.unref(iconsVue.Delete),
-              style: { "color": "#f56c6c" },
+              disabled: __props.disabled,
               onClick: removeHandler
-            }, null, 8, ["icon"]), [
+            }, null, 8, ["icon", "disabled"]), [
               [vue.vShow, showDelete(parseInt(String(__props.index)))]
             ]),
             movable() ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
               vue.withDirectives(vue.createVNode(vue.unref(design.TMagicButton), {
                 text: "",
+                disabled: __props.disabled,
                 size: "small",
                 onClick: _cache[0] || (_cache[0] = ($event) => changeOrder(-1))
               }, {
@@ -657,10 +670,11 @@
                   })
                 ]),
                 _: 1
-              }, 512), [
+              }, 8, ["disabled"]), [
                 [vue.vShow, __props.index !== 0]
               ]),
               vue.withDirectives(vue.createVNode(vue.unref(design.TMagicButton), {
+                disabled: __props.disabled,
                 text: "",
                 size: "small",
                 onClick: _cache[1] || (_cache[1] = ($event) => changeOrder(1))
@@ -675,7 +689,7 @@
                   })
                 ]),
                 _: 1
-              }, 512), [
+              }, 8, ["disabled"]), [
                 [vue.vShow, __props.index !== vue.unref(length) - 1]
               ])
             ], 64)) : vue.createCommentVNode("", true),
@@ -692,8 +706,9 @@
             labelWidth: __props.labelWidth,
             prop: `${__props.prop}${__props.prop ? "." : ""}${String(__props.index)}`,
             size: __props.size,
+            disabled: __props.disabled,
             onChange: changeHandler
-          }, null, 8, ["config", "model", "labelWidth", "prop", "size"])) : vue.createCommentVNode("", true)
+          }, null, 8, ["config", "model", "labelWidth", "prop", "size", "disabled"])) : vue.createCommentVNode("", true)
         ]);
       };
     }
@@ -722,7 +737,8 @@
       name: null,
       labelWidth: null,
       prop: null,
-      size: null
+      size: null,
+      disabled: { type: Boolean }
     },
     emits: ["change"],
     setup(__props, { emit }) {
@@ -804,22 +820,24 @@
               index,
               "label-width": __props.labelWidth,
               size: __props.size,
+              disabled: __props.disabled,
               "group-model": __props.model[__props.name],
               onRemoveItem: removeHandler,
               onSwapItem: swapHandler,
               onChange: changeHandler
-            }, null, 8, ["model", "config", "prop", "index", "label-width", "size", "group-model"]);
+            }, null, 8, ["model", "config", "prop", "index", "label-width", "size", "disabled", "group-model"]);
           }), 128)),
           vue.unref(addable) ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
             key: 3,
             onClick: addHandler,
-            size: "small"
+            size: "small",
+            disabled: __props.disabled
           }, {
             default: vue.withCtx(() => [
               _hoisted_6$1
             ]),
             _: 1
-          })) : vue.createCommentVNode("", true),
+          }, 8, ["disabled"])) : vue.createCommentVNode("", true),
           __props.config.enableToggleMode ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
             key: 4,
             icon: vue.unref(iconsVue.Grid),
@@ -855,7 +873,8 @@
       name: null,
       labelWidth: null,
       prop: null,
-      size: null
+      size: null,
+      disabled: { type: Boolean }
     },
     emits: ["change"],
     setup(__props, { emit }) {
@@ -905,9 +924,10 @@
                       model: __props.name ? __props.model[__props.name] : __props.model,
                       prop: __props.prop,
                       size: __props.size,
+                      disabled: __props.disabled,
                       "label-width": __props.config.labelWidth || __props.labelWidth,
                       onChange: changeHandler
-                    }, null, 8, ["config", "model", "prop", "size", "label-width"]);
+                    }, null, 8, ["config", "model", "prop", "size", "disabled", "label-width"]);
                   }), 128))
                 ]),
                 vue.createElementVNode("img", {
@@ -921,9 +941,10 @@
                   model: __props.name ? __props.model[__props.name] : __props.model,
                   prop: __props.prop,
                   size: __props.size,
+                  disabled: __props.disabled,
                   "label-width": __props.config.labelWidth || __props.labelWidth,
                   onChange: changeHandler
-                }, null, 8, ["config", "model", "prop", "size", "label-width"]);
+                }, null, 8, ["config", "model", "prop", "size", "disabled", "label-width"]);
               }), 128))
             ])
           ]),
@@ -945,7 +966,8 @@
       expandMore: { type: Boolean },
       span: null,
       size: null,
-      prop: null
+      prop: null,
+      disabled: { type: Boolean }
     },
     emits: ["change"],
     setup(__props, { emit }) {
@@ -963,8 +985,9 @@
               "label-width": __props.config.labelWidth || __props.labelWidth,
               "expand-more": __props.expandMore,
               size: __props.size,
+              disabled: __props.disabled,
               onChange: changeHandler
-            }, null, 8, ["model", "config", "prop", "label-width", "expand-more", "size"])
+            }, null, 8, ["model", "config", "prop", "label-width", "expand-more", "size", "disabled"])
           ]),
           _: 1
         }, 8, ["span"])), [
@@ -986,7 +1009,8 @@
       labelWidth: null,
       prop: null,
       size: null,
-      expandMore: { type: Boolean }
+      expandMore: { type: Boolean },
+      disabled: { type: Boolean }
     },
     emits: ["change"],
     setup(__props, { emit }) {
@@ -1006,8 +1030,9 @@
                 model: __props.name ? __props.model[__props.name] : __props.model,
                 prop: __props.prop,
                 size: __props.size,
+                disabled: __props.disabled,
                 onChange: changeHandler
-              }, null, 8, ["span", "config", "labelWidth", "expandMore", "model", "prop", "size"]);
+              }, null, 8, ["span", "config", "labelWidth", "expandMore", "model", "prop", "size", "disabled"]);
             }), 128))
           ]),
           _: 1
@@ -1026,7 +1051,8 @@
       config: null,
       stepActive: { default: 1 },
       labelWidth: null,
-      size: null
+      size: null,
+      disabled: { type: Boolean }
     },
     emits: ["change"],
     setup(__props, { emit }) {
@@ -1072,9 +1098,10 @@
                     model: step.name ? __props.model[step.name] : __props.model,
                     prop: `${step.name}`,
                     size: __props.size,
+                    disabled: __props.disabled,
                     "label-width": __props.config.labelWidth || __props.labelWidth,
                     onChange: changeHandler
-                  }, null, 8, ["config", "model", "prop", "size", "label-width"])), [
+                  }, null, 8, ["config", "model", "prop", "size", "disabled", "label-width"])), [
                     [vue.vShow, active.value - 1 === index]
                   ]) : vue.createCommentVNode("", true)
                 ], 64);
@@ -1112,6 +1139,7 @@
       prop: { default: "" },
       labelWidth: null,
       sort: { type: Boolean },
+      disabled: { type: Boolean },
       sortKey: { default: "" },
       text: null,
       size: null,
@@ -1299,6 +1327,8 @@
         return fuc;
       };
       const removeHandler = (index) => {
+        if (props.disabled)
+          return;
         props.model[modelName.value].splice(index, 1);
         emit("change", props.model[modelName.value]);
       };
@@ -1460,6 +1490,7 @@
                   ref_key: "tMagicTable",
                   ref: tMagicTable,
                   style: { "width": "100%" },
+                  "row-key": __props.config.rowKey || "id",
                   data: vue.unref(data),
                   border: __props.config.border,
                   "max-height": __props.config.maxHeight,
@@ -1521,10 +1552,11 @@
                               size: "small",
                               type: "primary",
                               icon: vue.unref(iconsVue.ArrowUp),
+                              disabled: __props.disabled,
                               text: "",
                               onClick: ($event) => upHandler(scope.$index + 1 + pagecontext.value * pagesize.value - 1),
                               onDblclick: ($event) => topHandler(scope.$index + 1 + pagecontext.value * pagesize.value - 1)
-                            }, null, 8, ["icon", "onClick", "onDblclick"])
+                            }, null, 8, ["icon", "disabled", "onClick", "onDblclick"])
                           ]),
                           _: 2
                         }, 1024)) : vue.createCommentVNode("", true),
@@ -1539,10 +1571,11 @@
                               size: "small",
                               type: "primary",
                               icon: vue.unref(iconsVue.ArrowDown),
+                              disabled: __props.disabled,
                               text: "",
                               onClick: ($event) => downHandler(scope.$index + 1 + pagecontext.value * pagesize.value - 1),
                               onDblclick: ($event) => bottomHandler(scope.$index + 1 + pagecontext.value * pagesize.value - 1)
-                            }, null, 8, ["icon", "onClick", "onDblclick"])
+                            }, null, 8, ["icon", "disabled", "onClick", "onDblclick"])
                           ]),
                           _: 2
                         }, 1024)) : vue.createCommentVNode("", true)
@@ -1581,13 +1614,14 @@
                             scope.$index > -1 ? (vue.openBlock(), vue.createBlock(_sfc_main$v, {
                               key: 0,
                               labelWidth: "0",
+                              disabled: __props.disabled,
                               prop: getProp(scope.$index),
                               rules: column.rules,
                               config: makeConfig(column, scope.row),
                               model: scope.row,
                               size: __props.size,
                               onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("change", __props.model[vue.unref(modelName)]))
-                            }, null, 8, ["prop", "rules", "config", "model", "size"])) : vue.createCommentVNode("", true)
+                            }, null, 8, ["disabled", "prop", "rules", "config", "model", "size"])) : vue.createCommentVNode("", true)
                           ]),
                           _: 2
                         }, 1032, ["prop", "width", "label", "sortable", "class-name"])) : vue.createCommentVNode("", true)
@@ -1595,7 +1629,7 @@
                     }), 256))
                   ]),
                   _: 1
-                }, 8, ["data", "border", "max-height"])) : vue.createCommentVNode("", true)
+                }, 8, ["row-key", "data", "border", "max-height"])) : vue.createCommentVNode("", true)
               ]),
               _: 1
             }, 8, ["disabled"]),
@@ -1604,6 +1638,7 @@
               key: 0,
               size: "small",
               type: "primary",
+              disabled: __props.disabled,
               plain: "",
               onClick: _cache[1] || (_cache[1] = ($event) => newHandler())
             }, {
@@ -1611,7 +1646,7 @@
                 _hoisted_4$1
               ]),
               _: 1
-            })) : vue.createCommentVNode("", true),
+            }, 8, ["disabled"])) : vue.createCommentVNode("", true),
             _hoisted_5,
             __props.enableToggleMode && !isFullscreen.value ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
               key: 1,
@@ -1639,32 +1674,35 @@
             }, 8, ["icon"])) : vue.createCommentVNode("", true),
             vue.unref(importable) ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicUpload), {
               key: 3,
+              style: { "display": "inline-block" },
               ref_key: "excelBtn",
               ref: excelBtn,
               action: "/noop",
+              disabled: __props.disabled,
               "on-change": excelHandler,
-              "auto-upload": false,
-              style: { "display": "inline-block" }
+              "auto-upload": false
             }, {
               default: vue.withCtx(() => [
                 vue.createVNode(vue.unref(design.TMagicButton), {
                   size: "small",
                   type: "success",
+                  disabled: __props.disabled,
                   plain: ""
                 }, {
                   default: vue.withCtx(() => [
                     _hoisted_7
                   ]),
                   _: 1
-                })
+                }, 8, ["disabled"])
               ]),
               _: 1
-            }, 512)) : vue.createCommentVNode("", true),
+            }, 8, ["disabled"])) : vue.createCommentVNode("", true),
             _hoisted_8,
             vue.unref(importable) ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
               key: 4,
               size: "small",
               type: "warning",
+              disabled: __props.disabled,
               plain: "",
               onClick: _cache[2] || (_cache[2] = ($event) => clearHandler())
             }, {
@@ -1672,7 +1710,7 @@
                 _hoisted_9
               ]),
               _: 1
-            })) : vue.createCommentVNode("", true)
+            }, 8, ["disabled"])) : vue.createCommentVNode("", true)
           ]),
           __props.config.pagination ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10, [
             vue.createVNode(vue.unref(design.TMagicPagination), {
@@ -1703,7 +1741,8 @@
       size: null,
       labelWidth: null,
       prop: null,
-      expandMore: { type: Boolean }
+      expandMore: { type: Boolean },
+      disabled: { type: Boolean }
     },
     emits: ["change"],
     setup(__props, { emit }) {
@@ -1821,13 +1860,14 @@
                       return vue.openBlock(), vue.createBlock(_sfc_main$v, {
                         key: item[vue.unref(mForm)?.keyProp || "__key"],
                         config: item,
+                        disabled: __props.disabled,
                         model: __props.config.dynamic ? (__props.name ? __props.model[__props.name] : __props.model)[tabIndex] : tab.name ? (__props.name ? __props.model[__props.name] : __props.model)[tab.name] : __props.name ? __props.model[__props.name] : __props.model,
                         prop: __props.config.dynamic ? `${__props.prop}${__props.prop ? "." : ""}${String(tabIndex)}` : __props.prop,
                         size: __props.size,
                         "label-width": tab.labelWidth || __props.labelWidth,
                         "expand-more": __props.expandMore,
                         onChange: changeHandler
-                      }, null, 8, ["config", "model", "prop", "size", "label-width", "expand-more"]);
+                      }, null, 8, ["config", "disabled", "model", "prop", "size", "label-width", "expand-more"]);
                     }), 128))
                   ]),
                   _: 2
@@ -2551,7 +2591,6 @@
           ref: tMagicForm,
           model: values.value,
           "label-width": __props.labelWidth,
-          disabled: __props.disabled,
           style: vue.normalizeStyle(`height: ${__props.height}`),
           inline: __props.inline,
           "label-position": __props.labelPosition
@@ -2559,6 +2598,7 @@
           default: vue.withCtx(() => [
             initialized.value && Array.isArray(__props.config) ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(__props.config, (item, index) => {
               return vue.openBlock(), vue.createBlock(_sfc_main$v, {
+                disabled: __props.disabled,
                 key: item[__props.keyProp] ?? index,
                 config: item,
                 model: values.value,
@@ -2566,11 +2606,11 @@
                 "step-active": __props.stepActive,
                 size: __props.size,
                 onChange: changeHandler
-              }, null, 8, ["config", "model", "label-width", "step-active", "size"]);
+              }, null, 8, ["disabled", "config", "model", "label-width", "step-active", "size"]);
             }), 128)) : vue.createCommentVNode("", true)
           ]),
           _: 1
-        }, 8, ["model", "label-width", "disabled", "style", "inline", "label-position"]);
+        }, 8, ["model", "label-width", "style", "inline", "label-position"]);
       };
     }
   });
@@ -2591,6 +2631,7 @@
       width: null,
       labelWidth: null,
       fullscreen: { type: Boolean },
+      disabled: { type: Boolean },
       title: null,
       zIndex: null,
       size: null,
@@ -2746,12 +2787,13 @@
                 ref_key: "form",
                 ref: form,
                 size: __props.size,
+                disabled: __props.disabled,
                 config: __props.config,
                 "init-values": __props.values,
                 "parent-values": __props.parentValues,
                 "label-width": __props.labelWidth,
                 onChange: changeHandler
-              }, null, 8, ["modelValue", "size", "config", "init-values", "parent-values", "label-width"]),
+              }, null, 8, ["modelValue", "size", "disabled", "config", "init-values", "parent-values", "label-width"]),
               vue.renderSlot(_ctx.$slots, "default")
             ], 4)) : vue.createCommentVNode("", true)
           ]),