@tmagic/form 1.0.0-rc.4 → 1.0.0-rc.7

package/dist/tmagic-form.es.js

@@ -205,7 +205,18 @@ const _sfc_main$t = defineComponent({
     const expand = ref(false);
     const name = computed(() => props.config.name || "");
     const items = computed(() => props.config.items);
-    const itemProp = computed(() => name.value ? `${props.prop}${props.prop ? "." : ""}${name.value}` : props.prop);
+    const itemProp = computed(() => {
+      let n = "";
+      const { names } = props.config;
+      if (names?.[0]) {
+        [n] = names;
+      } else if (name.value) {
+        n = name.value;
+      } else {
+        return props.prop;
+      }
+      return `${props.prop}${props.prop ? "." : ""}${n}`;
+    });
     const tagName = computed(() => {
       const component = resolveComponent(`m-${items.value ? "form" : "fields"}-${type.value}`);
       if (typeof component !== "string")
@@ -344,10 +355,10 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
       "expand-more": _ctx.expand,
       "label-width": _ctx.itemLabelWidth,
       onChange: _ctx.onChangeHandler
-    }, null, 8, ["size", "model", "config", "name", "prop", "step-active", "expand-more", "label-width", "onChange"])) : _ctx.type && _ctx.display ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+    }, null, 40, ["size", "model", "config", "name", "prop", "step-active", "expand-more", "label-width", "onChange"])) : _ctx.type && _ctx.display ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
       createVNode(_component_el_form_item, {
         style: normalizeStyle(_ctx.config.tip ? "flex: 1" : ""),
-        class: normalizeClass({ hidden: _ctx.itemLabelWidth === 0 || !_ctx.config.text }),
+        class: normalizeClass({ hidden: `${_ctx.itemLabelWidth}` === "0" || !_ctx.config.text }),
         prop: _ctx.itemProp,
         "label-width": _ctx.itemLabelWidth,
         rules: _ctx.rule
@@ -372,7 +383,7 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
                 disabled: _ctx.disabled,
                 prop: _ctx.itemProp,
                 onChange: _ctx.onChangeHandler
-              }, null, 8, ["size", "model", "config", "name", "disabled", "prop", "onChange"]))
+              }, null, 40, ["size", "model", "config", "name", "disabled", "prop", "onChange"]))
             ]),
             _: 1
           })) : (openBlock(), createBlock(resolveDynamicComponent(_ctx.tagName), {
@@ -384,7 +395,7 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
             disabled: _ctx.disabled,
             prop: _ctx.itemProp,
             onChange: _ctx.onChangeHandler
-          }, null, 8, ["size", "model", "config", "name", "disabled", "prop", "onChange"])),
+          }, null, 40, ["size", "model", "config", "name", "disabled", "prop", "onChange"])),
           _ctx.extra ? (openBlock(), createElementBlock("div", {
             key: 2,
             innerHTML: _ctx.extra,
@@ -2390,6 +2401,14 @@ const _sfc_main$e = defineComponent({
         });
       } else if (props.model && props.name && v instanceof Date) {
         props.model[props.name] = datetimeFormatter(v.toString(), "");
+      } else if (names?.length) {
+        names.forEach((item) => {
+          if (props.model) {
+            props.model[item] = void 0;
+          }
+        });
+      } else if (props.name) {
+        props.model[props.name] = void 0;
       }
     };
     return {
@@ -3770,7 +3789,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
 }
 var FormDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 
-var index$1 = '';
+var index$1 = /* #__PURE__ */ (() => ".m-form-dialog .el-dialog__body {\n  padding: 0 !important;\n}\n.m-form-dialog .m-dialog-body {\n  padding: 0 20px;\n}\n.m-form-dialog .el-table .m-form-item .el-form-item {\n  margin-bottom: 0;\n}\n\n.fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.5s;\n}\n\n.fade-enter, .fade-leave-to {\n  opacity: 0;\n}\n\n.m-form .m-form-tip {\n  color: rgba(0, 0, 0, 0.45);\n  font-size: 12px;\n  transition: color 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);\n}\n.m-form .m-form-schematic {\n  max-width: 50%;\n  height: 100%;\n}\n.m-form .el-table .cell > div.m-form-container {\n  display: block;\n}\n.m-form .el-tabs {\n  margin-bottom: 10px;\n}\n.m-form .el-form-item.hidden .el-form-item__label {\n  display: none;\n}\n\n.magic-datetime-picker-popper .el-picker-panel__footer button:first-child {\n  display: none;\n}\n\ndiv.m-fields-link {\n  width: fit-content;\n}\n\nfieldset.m-fieldset {\n  position: relative;\n  border: 1px solid rgb(229, 229, 229);\n  margin-top: 10px;\n  margin-bottom: 10px;\n  min-inline-size: auto;\n}\nfieldset.m-fieldset legend {\n  font-size: 14px;\n  position: absolute;\n  border: 0;\n  top: -10px;\n  left: 20px;\n  background: rgb(255, 255, 255);\n  width: auto;\n  padding: 0px 3px;\n  font-weight: bold;\n  line-height: 20px;\n}\nfieldset.m-fieldset .m-form-tip {\n  margin-left: 5px;\n}\n\n.m-fields-group-list .el-button--text {\n  padding: 0;\n  margin-bottom: 7px;\n}\n.m-fields-group-list .el-tree-node__expand-icon {\n  padding: 0;\n  margin-bottom: 7px;\n}\n.m-fields-group-list .el-tree-node__expand-icon.expand {\n  transform: rotate(90deg);\n}\n.m-fields-group-list .m-fields-group-list-item {\n  border-bottom: 1px solid #ebeef5;\n  margin-bottom: 7px;\n}\n.m-fields-group-list .m-fields-group-list-item:last-of-type {\n  border-bottom: 0;\n}\n\n.m-form-panel .el-card__header:hover {\n  background: #f2f6fc;\n}\n.m-form-panel .el-card__header a {\n  color: #409eff;\n}\n.m-form-panel .el-card__body {\n  padding: 10px;\n}\n.m-form-panel .m-form-tip {\n  margin-left: 5px;\n}\n\n.m-fields-table {\n  width: 100%;\n}\n.m-fields-table.fixed {\n  position: fixed;\n  top: 0;\n  right: 0;\n  left: 0;\n  bottom: 0;\n  z-index: 100;\n}\n.m-fields-table.fixed::before {\n  content: \" \";\n  display: block;\n  background: rgba(0, 0, 0, 0.5);\n  position: fixed;\n  top: 0;\n  right: 0;\n  left: 0;\n  bottom: 0;\n  z-index: 100;\n}\n.m-fields-table.fixed > .el-form-item__content {\n  z-index: 101;\n  position: relative;\n  margin: 10vh auto;\n  max-width: fit-content;\n}\n.m-fields-table.fixed table {\n  width: 95vw !important;\n}\n.m-fields-table th {\n  background-color: #f2f2f2 !important;\n  color: #333 !important;\n}\n.m-fields-table .el-table th {\n  padding: 0 !important;\n}\n.m-fields-table .el-table__column--dropable {\n  cursor: move;\n}\n.m-fields-table .el-form-item__content .el-input-group {\n  vertical-align: middle;\n}\n.m-fields-table.m-fields-table-item-extra tr.expanded td {\n  border-bottom: 0;\n}\n.m-fields-table .el-table__expanded-cell .m-form-tip {\n  margin-left: 80px;\n}\n.m-fields-table .el-form-item {\n  margin-bottom: 0;\n}\n\n.m-select {\n  width: 100%;\n}")();
 
 const defaultInstallOpt = {};
 const install = (app, opt) => {