@tmagic/form 1.4.6 → 1.4.8

package/dist/tmagic-form.js

@@ -1,4 +1,4 @@
-import { toRaw, defineComponent, inject, ref, computed, resolveComponent, watchEffect, watch, openBlock, createElementBlock, normalizeStyle, normalizeClass, createBlock, resolveDynamicComponent, Fragment, createVNode, unref, withCtx, createElementVNode, createCommentVNode, renderList, createTextVNode, toDisplayString, withDirectives, vShow, renderSlot, onMounted, Teleport, toRefs, mergeProps, getCurrentInstance, reactive, onBeforeUnmount, vModelText, provide, onBeforeMount, nextTick, resolveDirective, createSlots, withModifiers } from 'vue';
+import { toRaw, defineComponent, inject, ref, computed, watchEffect, watch, resolveComponent, openBlock, createElementBlock, normalizeStyle, normalizeClass, createBlock, resolveDynamicComponent, Fragment, createVNode, unref, withCtx, createElementVNode, createCommentVNode, renderList, createTextVNode, toDisplayString, withDirectives, vShow, renderSlot, onMounted, Teleport, toRefs, mergeProps, getCurrentInstance, reactive, onBeforeUnmount, vModelText, provide, onBeforeMount, nextTick, resolveDirective, createSlots, withModifiers } from 'vue';
 import { WarningFilled, CaretBottom, CaretRight, Delete, CaretTop, Grid, ArrowUp, ArrowDown, FullScreen } from '@element-plus/icons-vue';
 import { cloneDeep, isEqual, isEmpty } from 'lodash-es';
 import { TMagicFormItem, TMagicTooltip, TMagicIcon, TMagicButton, TMagicCheckbox, TMagicCard, TMagicCol, TMagicRow, TMagicSteps, TMagicStep, useZIndex, TMagicTable, TMagicTableColumn, TMagicUpload, TMagicPagination, tMagicMessage, getConfig as getConfig$1, TMagicBadge, TMagicCascader, TMagicCheckboxGroup, TMagicColorPicker, TMagicDatePicker, TMagicForm, TMagicInput, TMagicDialog, TMagicInputNumber, TMagicRadioGroup, TMagicRadio, TMagicSelect, TMagicSwitch, TMagicPopover, TMagicTimePicker, TMagicDrawer, TMagicScrollbar } from '@tmagic/design';
@@ -153,8 +153,7 @@ const getRules = function(mForm, rules = [], props) {
   });
 };
 const initValue = async (mForm, { initValues, config }) => {
-  if (!Array.isArray(config))
-    throw new Error("config应该为数组");
+  if (!Array.isArray(config)) throw new Error("config应该为数组");
   let valuesTmp = createValues(mForm, config, toRaw(initValues), {});
   const [firstForm] = config;
   if (firstForm && typeof firstForm.onInitValue === "function") {
@@ -208,8 +207,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     const expand = ref(false);
     const name = computed(() => props.config.name || "");
     const showDiff = computed(() => {
-      if (!props.isCompare)
-        return false;
+      if (!props.isCompare) return false;
       const curValue = name.value ? props.model[name.value] : props.model;
       const lastValue = name.value ? props.lastValues[name.value] : props.lastValues;
       return !isEqual(curValue, lastValue);
@@ -227,12 +225,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
       }
       return `${props.prop}${props.prop ? "." : ""}${n}`;
     });
-    const tagName = computed(() => {
-      const component = resolveComponent(`m-${items.value ? "form" : "fields"}-${type.value}`);
-      if (typeof component !== "string")
-        return component;
-      return "m-fields-text";
-    });
+    const tagName = computed(() => `m-${items.value ? "form" : "fields"}-${type.value}`);
     const disabled = computed(() => props.disabled || filterFunction(mForm, props.config.disabled, props));
     const text = computed(() => filterFunction(mForm, props.config.text, props));
     const tooltip = computed(() => filterFunction(mForm, props.config.tooltip, props));
@@ -240,15 +233,9 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     const rule = computed(() => getRules(mForm, props.config.rules, props));
     const type = computed(() => {
       let { type: type2 } = props.config;
-      if (typeof type2 === "function") {
-        type2 = type2(mForm, {
-          model: props.model
-        });
-      }
-      if (type2 === "form")
-        return "";
-      if (type2 === "container")
-        return "";
+      type2 = type2 && filterFunction(mForm, type2, props);
+      if (type2 === "form") return "";
+      if (type2 === "container") return "";
       return type2?.replace(/([A-Z])/g, "-$1").toLowerCase() || (items.value ? "" : "text");
     });
     const display$1 = computed(() => {
@@ -265,10 +252,8 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     watch(
       showDiff,
       (showDiff2) => {
-        if (type.value === "hidden")
-          return;
-        if (items.value && !text.value && type.value && display$1.value)
-          return;
+        if (type.value === "hidden") return;
+        if (items.value && !text.value && type.value && display$1.value) return;
         if (display$1.value && showDiff2 && type.value) {
           emit("addDiffCount");
         }
@@ -804,8 +789,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     const changeOrder = (offset = 0) => emit("swap-item", props.index, props.index + offset);
     const movable = () => {
       const { movable: movable2 } = props.config;
-      if (movable2 === void 0)
-        return true;
+      if (movable2 === void 0) return true;
       if (typeof movable2 === "function") {
         return movable2(mForm, props.index || 0, props.model, props.groupModel);
       }
@@ -936,8 +920,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     const emit = __emit;
     const mForm = inject("mForm");
     const addable = computed(() => {
-      if (!props.name)
-        return false;
+      if (!props.name) return false;
       if (typeof props.config.addable === "function") {
         return props.config.addable(mForm, {
           model: props.model[props.name],
@@ -949,13 +932,11 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       return typeof props.config.addable === "undefined" ? true : props.config.addable;
     });
     const changeHandler = () => {
-      if (!props.name)
-        return false;
+      if (!props.name) return false;
       emit("change", props.model[props.name]);
     };
     const addHandler = async () => {
-      if (!props.name)
-        return false;
+      if (!props.name) return false;
       let initValues = {};
       if (typeof props.config.defaultAdd === "function") {
         initValues = await props.config.defaultAdd(mForm, {
@@ -974,14 +955,12 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       props.model[props.name].push(groupValue);
     };
     const removeHandler = (index) => {
-      if (!props.name)
-        return false;
+      if (!props.name) return false;
       props.model[props.name].splice(index, 1);
       changeHandler();
     };
     const swapHandler = (idx1, idx2) => {
-      if (!props.name)
-        return false;
+      if (!props.name) return false;
       const [currRow] = props.model[props.name].splice(idx1, 1);
       props.model[props.name].splice(idx2, 0, currRow);
       changeHandler();
@@ -1418,10 +1397,8 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
       if (tBodyEl) {
         const sortable = Sortable.create(tBodyEl, {
           onEnd: ({ newIndex, oldIndex }) => {
-            if (typeof newIndex === "undefined")
-              return;
-            if (typeof oldIndex === "undefined")
-              return;
+            if (typeof newIndex === "undefined") return;
+            if (typeof oldIndex === "undefined") return;
             swapArray(newIndex, oldIndex);
             emit("change", props.model[modelName.value]);
             foreUpdate();
@@ -1451,8 +1428,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
           formValue: mForm?.values,
           prop: props.prop
         });
-        if (!beforeCheckRes)
-          return;
+        if (!beforeCheckRes) return;
       }
       const columns = props.config.items;
       const enumValues = props.config.enum || [];
@@ -1557,8 +1533,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
       return fuc;
     };
     const removeHandler = (index) => {
-      if (props.disabled)
-        return;
+      if (props.disabled) return;
       props.model[modelName.value].splice(index, 1);
       emit("change", props.model[modelName.value]);
     };
@@ -1665,8 +1640,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
     };
     const toggleMode = () => {
       const calcLabelWidth = (label) => {
-        if (!label)
-          return "0px";
+        if (!label) return "0px";
         const zhLength = label.match(/[^\x00-\xff]/g)?.length || 0;
         const chLength = label.length - zhLength;
         return `${Math.max(chLength * 8 + zhLength * 20, 80)}px`;
@@ -1686,8 +1660,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
       });
     };
     const toggleFullscreen = () => {
-      if (!mTable.value)
-        return;
+      if (!mTable.value) return;
       if (isFullscreen.value) {
         mTable.value.classList.remove("fixed");
         isFullscreen.value = false;
@@ -2002,12 +1975,9 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     const getActive = (mForm2, props2, activeTabName2) => {
       const { config, model, prop } = props2;
       const { active } = config;
-      if (typeof active === "function")
-        return active(mForm2, { model, formValue: mForm2?.values, prop });
-      if (+activeTabName2 >= props2.config.items.length)
-        return "0";
-      if (typeof active !== "undefined")
-        return active;
+      if (typeof active === "function") return active(mForm2, { model, formValue: mForm2?.values, prop });
+      if (+activeTabName2 >= props2.config.items.length) return "0";
+      if (typeof active !== "undefined") return active;
       return "0";
     };
     const tabClick = (mForm2, tab, props2) => {
@@ -2028,8 +1998,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     const diffCount = ref({});
     const tabs = computed(() => {
       if (props.config.dynamic) {
-        if (!props.config.name)
-          throw new Error("dynamic tab 必须配置name");
+        if (!props.config.name) throw new Error("dynamic tab 必须配置name");
         return props.model[props.config.name] || [];
       }
       return props.config.items.filter((item) => display(mForm, item.display, props));
@@ -2046,8 +2015,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     const tabItems = (tab) => props.config.dynamic ? props.config.items : tab.items;
     const tabClickHandler = (tab) => tabClick(mForm, tab, props);
     const onTabAdd = () => {
-      if (!props.config.name)
-        throw new Error("dynamic tab 必须配置name");
+      if (!props.config.name) throw new Error("dynamic tab 必须配置name");
       if (typeof props.config.onTabAdd === "function") {
         props.config.onTabAdd(mForm, {
           model: props.model,
@@ -2063,8 +2031,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
       mForm?.$emit("field-change", props.prop, props.model[props.config.name]);
     };
     const onTabRemove = (tabName) => {
-      if (!props.config.name)
-        throw new Error("dynamic tab 必须配置name");
+      if (!props.config.name) throw new Error("dynamic tab 必须配置name");
       if (typeof props.config.onTabRemove === "function") {
         props.config.onTabRemove(mForm, tabName, {
           model: props.model,
@@ -2167,8 +2134,7 @@ const setConfig = (option) => {
 const getConfig = (key) => $MAGIC_FORM[key];
 
 const useAddField = (prop) => {
-  if (!prop)
-    return;
+  if (!prop) return;
   const mForm = inject("mForm");
   const instance = getCurrentInstance();
   watch(
@@ -2212,17 +2178,19 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     const tMagicCascader = ref();
     const options = ref([]);
     const remoteData = ref(null);
+    const checkStrictly = computed(() => filterFunction(mForm, props.config.checkStrictly, props));
+    const valueSeparator = computed(() => filterFunction(mForm, props.config.valueSeparator, props));
     const value = computed({
       get() {
-        if (typeof props.model[props.name] === "string" && props.config.valueSeparator) {
-          return props.model[props.name].split(props.config.valueSeparator);
+        if (typeof props.model[props.name] === "string" && valueSeparator.value) {
+          return props.model[props.name].split(valueSeparator.value);
         }
         return props.model[props.name];
       },
       set(value2) {
         let result = value2;
-        if (props.config.valueSeparator) {
-          result = value2.join(props.config.valueSeparator);
+        if (valueSeparator.value) {
+          result = value2.join(valueSeparator.value);
         }
         props.model[props.name] = result;
       }
@@ -2230,8 +2198,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     const setRemoteOptions = async function() {
       const { config } = props;
       const { option } = config;
-      if (!option)
-        return;
+      if (!option) return;
       let { body } = option;
       const postOptions = {
         url: option.url,
@@ -2276,8 +2243,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
       });
     }
     const changeHandler = () => {
-      if (!tMagicCascader.value)
-        return;
+      if (!tMagicCascader.value) return;
       tMagicCascader.value.setQuery("");
       tMagicCascader.value.setPreviousQuery(null);
       emit("change", props.model[props.name]);
@@ -2299,7 +2265,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
         props: {
           multiple: _ctx.config.multiple ?? false,
           emitPath: _ctx.config.emitPath ?? true,
-          checkStrictly: _ctx.config.checkStrictly ?? false
+          checkStrictly: checkStrictly.value ?? false
         },
         onChange: changeHandler
       }, null, 8, ["modelValue", "size", "placeholder", "disabled", "options", "popper-class", "props"]);
@@ -2399,10 +2365,8 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     };
     const mForm = inject("mForm");
     const options = computed(() => {
-      if (Array.isArray(props.config.options))
-        return props.config.options;
-      if (typeof props.config.options === "function")
-        return filterFunction(mForm, props.config.options, props);
+      if (Array.isArray(props.config.options)) return props.config.options;
+      if (typeof props.config.options === "function") return filterFunction(mForm, props.config.options, props);
       return [];
     });
     return (_ctx, _cache) => {
@@ -2540,12 +2504,9 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
             if (!value.value) {
               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 || !end) value.value = [];
+            if (start !== preStart) value.value[0] = new Date(start);
+            if (end !== preEnd) value.value[1] = new Date(end);
           },
           {
             immediate: true
@@ -2555,8 +2516,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         watch(
           () => props.model[props.name],
           (start, preStart) => {
-            if (start !== preStart)
-              value.value = start.map((item) => item ? new Date(item) : void 0);
+            if (start !== preStart) value.value = start.map((item) => item ? new Date(item) : void 0);
           },
           {
             immediate: true
@@ -2582,8 +2542,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         emit(
           "change",
           value2.map((item) => {
-            if (item)
-              return datetimeFormatter(item, "");
+            if (item) return datetimeFormatter(item, "");
             return void 0;
           })
         );
@@ -2721,14 +2680,12 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
       value: {}
     });
     const changeFieldMap = async () => {
-      if (typeof props.config.returnFields !== "function" || !props.model)
-        return;
+      if (typeof props.config.returnFields !== "function" || !props.model) return;
       const fields = await props.config.returnFields(props.config, props.model, request);
       fieldMap.value = {};
       fieldLabelMap.value = {};
       fields.forEach((v) => {
-        if (typeof v !== "object" || v.name === void 0)
-          return;
+        if (typeof v !== "object" || v.name === void 0) return;
         let oldVal = props.model?.[v.name] || "";
         if (!oldVal && v.defaultValue !== void 0) {
           oldVal = v.defaultValue;
@@ -2932,12 +2889,9 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
           const error = [];
           Object.entries(invalidFields).forEach(([, ValidateError]) => {
             ValidateError.forEach(({ field, message }) => {
-              if (field && message)
-                error.push(`${field} -> ${message}`);
-              if (field && !message)
-                error.push(`${field} -> 出现错误`);
-              if (!field && message)
-                error.push(`${message}`);
+              if (field && message) error.push(`${field} -> ${message}`);
+              if (field && !message) error.push(`${field} -> 出现错误`);
+              if (!field && message) error.push(`${message}`);
             });
           });
           throw new Error(error.join("<br>"));
@@ -3460,8 +3414,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     const emit = __emit;
     const optionComponent = getConfig$1("components")?.option;
     const optionGroupComponent = getConfig$1("components")?.optionGroup;
-    if (!props.model)
-      throw new Error("不能没有model");
+    if (!props.model) throw new Error("不能没有model");
     useAddField(props.prop);
     const tMagicSelect = ref();
     const mForm = inject("mForm");
@@ -3496,16 +3449,14 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       }));
     };
     const getOptions = async () => {
-      if (!props.model)
-        return [];
+      if (!props.model) return [];
       if (localOptions.value.length) {
         return localOptions.value;
       }
       loading.value = true;
       let items = [];
       const { option } = props.config;
-      if (!option)
-        return [];
+      if (!option) return [];
       const { root = "", totalKey = "total" } = option;
       let { body = {}, url } = option;
       if (typeof url === "function") {
@@ -3578,8 +3529,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       return pgIndex.value === 0 ? selectedOptions.concat(items) : options.value.concat(items);
     };
     const getInitLocalOption = async () => {
-      if (!props.model)
-        return [];
+      if (!props.model) return [];
       const value = props.model[props.name];
       const { config } = props;
       localOptions.value = await getOptions();
@@ -3600,11 +3550,9 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       return localOptions.value.filter((item) => equalValue(item.value, value));
     };
     const getInitOption = async () => {
-      if (!props.model)
-        return [];
+      if (!props.model) return [];
       const { option } = props.config;
-      if (!option)
-        return [];
+      if (!option) return [];
       const { root = "", initRoot = "" } = option;
       let { initBody = {} } = option;
       let options2 = [];
@@ -3687,8 +3635,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       });
     } else if (props.config.option) {
       onBeforeMount(() => {
-        if (!props.model)
-          return;
+        if (!props.model) return;
         const v = props.model[props.name];
         if (Array.isArray(v) ? v.length : typeof v !== "undefined") {
           getInitOption().then((data) => {
@@ -3732,10 +3679,8 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       emit("change", value);
     };
     const visibleHandler = async (visible) => {
-      if (!visible)
-        return;
-      if (!props.config.remote)
-        return;
+      if (!visible) return;
+      if (!props.config.remote) return;
       if (query.value && tMagicSelect.value) {
         tMagicSelect.value.setQuery(query.value);
         tMagicSelect.value.setPreviousQuery(query.value);
@@ -3962,8 +3907,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
       mForm?.$emit("field-input", props.prop, v);
     };
     const buttonClickHandler = () => {
-      if (!appendConfig.value)
-        return;
+      if (!appendConfig.value) return;
       if (typeof appendConfig.value.handler === "function") {
         appendConfig.value.handler(mForm, {
           model: props.model,
@@ -3972,10 +3916,8 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
       }
     };
     const keyUpHandler = ($event) => {
-      if (!props.model)
-        return;
-      if (!props.name)
-        return;
+      if (!props.model) return;
+      if (!props.name) return;
       const arrowUp = $event.key === "ArrowUp";
       const arrowDown = $event.key === "ArrowDown";
       if (!arrowUp && !arrowDown) {
@@ -4205,12 +4147,9 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           if (!value.value) {
             value.value = [];
           }
-          if (!start || !end)
-            value.value = [];
-          if (start !== preStart)
-            value.value[0] = start;
-          if (end !== preEnd)
-            value.value[1] = end;
+          if (!start || !end) value.value = [];
+          if (start !== preStart) value.value[0] = start;
+          if (end !== preEnd) value.value[1] = end;
         },
         {
           immediate: true