@web-utils/component 3.8.3 → 4.0.1

package/form-input-time/index.mjs

@@ -1,30 +1,17 @@
-var s = Object.defineProperty;
-var i = Object.getOwnPropertySymbols;
-var m = Object.prototype.hasOwnProperty, p = Object.prototype.propertyIsEnumerable;
-var l = (r, e, t) => e in r ? s(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, a = (r, e) => {
-  for (var t in e || (e = {}))
-    m.call(e, t) && l(r, t, e[t]);
-  if (i)
-    for (var t of i(e))
-      p.call(e, t) && l(r, t, e[t]);
-  return r;
-};
-import { f as u } from "../chunks/form-input-mixin.BkKiqJhi.mjs";
-import o from "element-ui/lib/time-picker";
-import { d as f, n as d } from "../chunks/index.MAFc4eFi.mjs";
-import { n as c } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-const _ = Object.keys(o.props || o.default.props).filter((r) => !["value", "placeholder", "disabled"].includes(r)), g = {
+import { f as a } from "../chunks/form-input.B8z37eqj.mjs";
+import i from "element-ui/lib/time-picker";
+import { c as l, n as o } from "../chunks/index.d3MV3Wq2.mjs";
+import { n as s } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
+const m = Object.keys(i.props).filter((r) => !["value", "placeholder", "disabled"].includes(r)), p = {
   name: "FormInputTime",
-  mixins: [u],
+  mixins: [a],
   props: {
     range: Boolean,
     format: {
       type: String,
       default: "HH:mm:ss"
     },
-    valueFormat: {
-      type: String
-    },
+    valueFormat: String,
     start: {
       type: String,
       default: "09:00"
@@ -45,44 +32,42 @@ const _ = Object.keys(o.props || o.default.props).filter((r) => !["value", "plac
       type: String,
       default: ""
     },
-    selectableRange: {
-      type: String
-    }
+    selectableRange: String
   },
   computed: {
     prefix() {
       return "请选择";
     },
     inputProps() {
-      return f(a(a({}, d(this.$attrs)), this.$props), _);
+      return l({ ...o(this.$attrs), ...this.$props }, m);
     }
   }
 };
-var y = function() {
-  var e = this, t = e._self._c;
-  return t("FormItem", e._b({ attrs: { rules: e.computeRules, disabled: e.inputDisabled }, scopedSlots: e._u([{ key: "default", fn: function() {
-    return [t("ElTimePicker", e._g(e._b({ attrs: { "is-range": e.range, value: e.value, disabled: e.inputDisabled, format: e.format, "value-format": e.valueFormat || e.format, clearable: "", "picker-options": {
+var u = function() {
+  var e = this, n = e._self._c;
+  return n("FormItem", e._b({ attrs: { rules: e.computeRules, disabled: e.inputDisabled }, scopedSlots: e._u([{ key: "default", fn: function() {
+    return [n("ElTimePicker", e._g(e._b({ staticStyle: { width: "100%" }, attrs: { "is-range": e.range, value: e.value, disabled: e.inputDisabled, format: e.format, "value-format": e.valueFormat || e.format, clearable: "", "picker-options": {
       start: e.start,
       end: e.end,
       step: e.step,
       minTime: e.minTime,
       maxTime: e.maxTime,
       selectableRange: e.selectableRange
-    }, "start-placeholder": "开始时间", "end-placeholder": "结束时间", placeholder: e.computePlaceholder }, on: { input: (n) => e.$emit("input", n) } }, "ElTimePicker", e.inputProps, !1), e.listeners))];
-  }, proxy: !0 }, { key: "error", fn: function({ error: n }) {
-    return [e._t("error", null, { error: n })];
+    }, "start-placeholder": "开始时间", "end-placeholder": "结束时间", placeholder: e.computePlaceholder }, on: { input: (t) => e.$emit("input", t) } }, "ElTimePicker", e.inputProps, !1), e.listeners))];
+  }, proxy: !0 }, { key: "error", fn: function({ error: t }) {
+    return [e._t("error", null, { error: t })];
   } }, { key: "label", fn: function() {
     return [e._t("label")];
   }, proxy: !0 }], null, !0) }, "FormItem", e.formItemProps, !1));
-}, b = [], v = /* @__PURE__ */ c(
-  g,
-  y,
-  b,
+}, f = [], c = /* @__PURE__ */ s(
+  p,
+  u,
+  f,
   !1,
   null,
   null
 );
-const k = v.exports;
+const y = c.exports;
 export {
-  k as default
+  y as default
 };

package/form-item/index.mjs

@@ -1,39 +1,13 @@
-var T = Object.defineProperty;
-var k = Object.getOwnPropertySymbols;
-var V = Object.prototype.hasOwnProperty, j = Object.prototype.propertyIsEnumerable;
-var x = (e, r, t) => r in e ? T(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, h = (e, r) => {
-  for (var t in r || (r = {}))
-    V.call(r, t) && x(e, t, r[t]);
-  if (k)
-    for (var t of k(r))
-      j.call(r, t) && x(e, t, r[t]);
-  return e;
-};
-var w = (e, r, t) => new Promise((d, a) => {
-  var o = (i) => {
-    try {
-      l(t.next(i));
-    } catch (m) {
-      a(m);
-    }
-  }, s = (i) => {
-    try {
-      l(t.throw(i));
-    } catch (m) {
-      a(m);
-    }
-  }, l = (i) => i.done ? d(i.value) : Promise.resolve(i.value).then(o, s);
-  l((t = t.apply(e, r)).next());
-});
-import { h as p } from "vue";
-import { f as B } from "../chunks/form-item-mixin.CG4ZwzMC.mjs";
-import { hasOwn as I } from "@web-utils/core";
-const A = {
+import { h as m } from "vue";
+import { f as B } from "../chunks/form-item.D-H-wCPE.mjs";
+import { hasOwn as I, isDef as D } from "@web-utils/core";
+import { n as L } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
+const N = {
   name: "FormItem",
   mixins: [B],
   inject: {
     formHolder: {
-      default: ""
+      default: {}
     },
     formItemConfig: {
       default: null
@@ -41,94 +15,128 @@ const A = {
   },
   computed: {
     gutter() {
-      var r;
       let e = this.$parent;
       for (; e && e.$options.componentName !== "ElRow"; )
         e = e.$parent;
-      return (r = e == null ? void 0 : e.gutter) != null ? r : 0;
+      return (e == null ? void 0 : e.gutter) ?? 0;
     }
   },
   methods: {
     renderFormItem() {
-      var q, g, F;
+      var x, k, R, y, E, T, H;
       const {
-        label: e,
-        labelWidth: r,
+        hideLabel: e,
+        label: l,
+        labelWidth: u,
         prop: t,
-        rules: d,
-        $scopedSlots: a,
-        elFormItemProps: o,
-        elForm: s,
-        formHolder: l,
-        formItemClass: i,
-        required: m,
-        block: $,
-        half: v,
-        wrapCol: y,
-        wrapFormItem: R,
-        disabled: E,
-        formItemConfig: n,
-        getRequireRule: W
+        rules: p,
+        $scopedSlots: r,
+        elFormItemProps: i,
+        elForm: n,
+        formHolder: a,
+        formItemClass: c,
+        required: f,
+        block: h,
+        half: w,
+        wrapCol: W,
+        wrapFormItem: P,
+        disabled: V,
+        formItemConfig: s,
+        getRequireRule: j
       } = this;
-      let f = d, u = m, c = m, C = $, b = y;
-      n && (I(n, "block") && (C = n.block), I(n, "wrapCol") && (b = n.wrapCol));
-      const H = C && v && b ? `calc( 50% - ${this.gutter / 2}px)` : "";
-      return E || s != null && s.disabled ? (f = [], l && !l.required && !((q = l.requiredFields) != null && q.includes(t)) && (c = !1)) : (l && !l.required && !((g = l.requiredFields) != null && g.includes(t)) && (u = !1), u && !(f != null && f.length) && t ? f = [W()] : u || (c = !1, f && (f = f.filter((P) => !P.required)))), R ? (
-        // eslint-disable-next-line no-undef
-        p("ElFormItem", {
-          style: {
-            width: H
-          },
-          key: `${t}-${u}`,
-          class: c ? `form-item required ${i || ""}` : `${i || ""}`,
-          scopedSlots: a,
-          props: h({}, o),
-          attrs: {
-            label: e,
-            "label-width": r,
-            prop: t,
-            rules: f
-          },
-          ref: "formItem"
-        })
-      ) : p("div", [(F = a.default) == null ? void 0 : F.call(a)]);
+      let o = p, d = f, b = f, v = h, g = W;
+      s && (I(s, "block") && (v = s.block), I(s, "wrapCol") && (g = s.wrapCol));
+      const z = a.tableForm ? "" : v && w && g ? `calc( 50% - ${this.gutter / 2}px)` : "";
+      (x = a.requiredFields) != null && x.includes(t) && (d = !0), (V || n != null && n.disabled) && !((k = a.requiredFields) != null && k.includes(t)) ? (o = [], !a.required && !((R = a.requiredFields) != null && R.includes(t)) && (b = !1)) : (!a.required && !((y = a.requiredFields) != null && y.includes(t)) && (d = !1), d && !(o != null && o.length) && t ? o = [j()] : d || (b = !1, o && (o = o.filter((C) => !C.required))));
+      const F = (E = r.tips) == null ? void 0 : E.call(r), q = F || this.tips, _ = q ? m("ElTooltip", {
+        attrs: {
+          effect: "light",
+          content: this.tips
+        }
+      }, [F ? m("div", {
+        slot: "content"
+      }, [F]) : null, m("i", {
+        class: "el-icon-info form-item-input-info"
+      })]) : null;
+      return P ? m("ElFormItem", {
+        style: {
+          width: z
+        },
+        key: `${t}-${d}`,
+        class: ["form-item", c, {
+          required: b,
+          "form-item-hide-label": e
+        }],
+        scopedSlots: {
+          ...r,
+          default: q ? () => {
+            var C;
+            return m("div", {
+              class: "form-item-input-wrapper"
+            }, [(C = r.default) == null ? void 0 : C.call(r), _]);
+          } : r.default
+        },
+        props: {
+          ...i
+        },
+        attrs: {
+          label: l,
+          "label-width": e ? "0" : u,
+          prop: t,
+          rules: o
+        },
+        ref: "formItem"
+      }) : q ? m("div", {
+        class: "form-item-input-wrapper"
+      }, [(T = r.default) == null ? void 0 : T.call(r), _]) : m("div", [(H = r.default) == null ? void 0 : H.call(r)]);
     },
-    clearValidate() {
-      return w(this, null, function* () {
-        var e, r;
-        yield this.$nextTick(), (r = (e = this.$refs.formItem).clearValidate) == null || r.call(e);
-      });
+    async clearValidate() {
+      var e, l;
+      await this.$nextTick(), (l = (e = this.$refs.formItem).clearValidate) == null || l.call(e);
     },
-    validate() {
-      return w(this, null, function* () {
-        var e, r;
-        yield this.$nextTick(), (r = (e = this.$refs.formItem).validate) == null || r.call(e);
-      });
+    async validate() {
+      var e, l;
+      await this.$nextTick(), (l = (e = this.$refs.formItem).validate) == null || l.call(e);
     }
   },
   render() {
-    var i, m;
+    var h, w;
     const {
       computeSpan: e,
-      wrapCol: r,
+      wrapCol: l,
+      fixedSpan: u,
       formItemConfig: t,
-      renderFormItem: d,
-      elColProps: a,
-      $scopedSlots: o,
-      unwrap: s
+      renderFormItem: p,
+      elColProps: r,
+      $scopedSlots: i,
+      unwrap: n,
+      formHolder: a
     } = this;
-    let l = r;
-    return t && I(t, "wrapCol") && (l = t.wrapCol), s ? p("div", [(i = o.default) == null ? void 0 : i.call(o)]) : l ? (
-      // eslint-disable-next-line no-undef
-      p("ElCol", {
-        props: h({}, a),
-        attrs: {
-          span: e
-        }
-      }, [d(), (m = o == null ? void 0 : o.below) == null ? void 0 : m.call(o)])
-    ) : d();
+    let c = !a.tableForm && l, f = !1;
+    return t && (I(t, "wrapCol") && (c = t.wrapCol), I(t, "reactive") && (f = t.reactive)), n ? m("div", [(h = i.default) == null ? void 0 : h.call(i)]) : c ? m("ElCol", {
+      props: {
+        ...r,
+        span: u || e,
+        ...!D(u) && f ? {
+          xs: 24,
+          sm: 12,
+          md: 12,
+          lg: 8,
+          xl: 6
+        } : {}
+      }
+    }, [p(), (w = i == null ? void 0 : i.below) == null ? void 0 : w.call(i)]) : p();
   }
-};
+}, O = null, A = null;
+var G = /* @__PURE__ */ L(
+  N,
+  O,
+  A,
+  !1,
+  null,
+  null
+);
+const U = G.exports;
 export {
-  A as default
+  U as default
 };

package/form-item/style.css

@@ -1 +1 @@
-.form-item.el-form-item.required:not(.is-no-asterisk) .el-form-item__label:before{color:#f56c6c;content:"*";margin-right:4px}
+.form-item.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label:before{color:#f56c6c;content:"*";margin-right:4px;display:inline}.form-item.el-form-item .el-form-item__content{min-height:29px}.form-item.el-form-item.el-form-item--mini .el-form-item__content{line-height:27px}.form-item.el-form-item.form-item-hide-label .el-form-item__label{display:none}.form-item-input-wrapper{flex-direction:row;align-items:center;display:flex}.form-item-input-wrapper>div,.form-item-input-wrapper>form{width:100%}.form-item-input-wrapper .el-input{flex:auto}.form-item-input-wrapper .form-item-input-info{color:gray;cursor:help;margin-left:4px;font-size:16px}

package/form-item-config-provider/index.mjs

@@ -1,4 +1,4 @@
-import { n as e } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
+import { n as o } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
 const r = {
   name: "FormItemConfigProvider",
   provide() {
@@ -7,6 +7,7 @@ const r = {
     };
   },
   props: {
+    reactive: Boolean,
     block: Boolean,
     wrapCol: {
       type: Boolean,
@@ -17,6 +18,7 @@ const r = {
     return {
       config: {
         block: !1,
+        reactive: !1,
         wrapCol: !0
       }
     };
@@ -24,30 +26,36 @@ const r = {
   watch: {
     block: {
       immediate: !0,
-      handler(o) {
-        this.config.block = o;
+      handler(e) {
+        this.config.block = e;
       }
     },
     wrapCol: {
       immediate: !0,
-      handler(o) {
-        this.config.wrapCol = o;
+      handler(e) {
+        this.config.wrapCol = e;
+      }
+    },
+    reactive: {
+      immediate: !0,
+      handler(e) {
+        this.config.reactive = e;
       }
     }
   },
   render() {
     return this.$scopedSlots.default();
   }
-}, n = null, t = null;
-var l = /* @__PURE__ */ e(
+}, t = null, n = null;
+var a = /* @__PURE__ */ o(
   r,
-  n,
   t,
+  n,
   !1,
   null,
   null
 );
-const i = l.exports;
+const l = a.exports;
 export {
-  i as default
+  l as default
 };

package/form-item-group/index.mjs

@@ -1,22 +1,25 @@
-import { h as o } from "vue";
-import { isFunction as n } from "@web-utils/core";
-const a = ["disabled", "size", "statusIcon", "inlineMessage", "autoLabelWidth", "hideRequiredAsterisk", "$emit", "validate", "clearValidate"], m = ["$emit", "validate", "clearValidate"], p = {
+import { h as s } from "vue";
+import { n as a } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
+const r = ["disabled", "size", "statusIcon", "inlineMessage", "autoLabelWidth", "hideRequiredAsterisk", "$emit", "validate", "clearValidate"], d = ["$emit", "validate", "clearValidate"], n = {
   name: "FormItemGroup",
   inject: {
     elForm: {
       default: {}
+    },
+    formHolder: {
+      default: {}
     }
   },
   provide() {
     return {
-      elForm: this.formConfig,
+      elForm: this.proxyForm,
       formItemGroup: this
     };
   },
   props: {
-    blockTitle: {
-      type: String
-    },
+    blockTitle: String,
+    size: String,
+    tips: String,
     active: Boolean,
     enabled: Boolean,
     disabled: Boolean,
@@ -28,15 +31,20 @@ const a = ["disabled", "size", "statusIcon", "inlineMessage", "autoLabelWidth",
       type: Number,
       default: 20
     },
-    collapse: Boolean
+    collapse: Boolean,
+    showTitle: {
+      type: Boolean,
+      default: !0
+    },
+    notDispatch: Boolean
   },
   data() {
     const e = {};
-    return a.forEach((i) => {
-      e[i] = null;
+    return r.forEach((t) => {
+      e[t] = null;
     }), {
       expand: !0,
-      formConfig: e
+      proxyForm: e
     };
   },
   computed: {
@@ -45,9 +53,12 @@ const a = ["disabled", "size", "statusIcon", "inlineMessage", "autoLabelWidth",
         enabled: this.enabled,
         forbidden: this.disabled
       };
-      return a.forEach((i) => {
-        e[i] = this.elForm[i];
+      return r.forEach((t) => {
+        e[t] = this.elForm[t];
       }), e;
+    },
+    isDisabled() {
+      return this.disabled ? this.disabled : this.enabled ? !this.enabled : this.elForm.disabled;
     }
   },
   watch: {
@@ -60,49 +71,36 @@ const a = ["disabled", "size", "statusIcon", "inlineMessage", "autoLabelWidth",
     formCfg: {
       immediate: !0,
       handler() {
-        this.formConfig.disabled = this.isDisabled(), a.forEach((e) => {
-          var i;
-          e !== "disabled" && (m.includes(e) ? this.formConfig[e] = (i = this.elForm[e]) == null ? void 0 : i.bind(this.elForm) : this.formConfig[e] = this.elForm[e]);
-        });
+        this.proxyForm.disabled = this.isDisabled, r.forEach((e) => {
+          var t;
+          e !== "disabled" && (d.includes(e) ? this.proxyForm[e] = (t = this.elForm[e]) == null ? void 0 : t.bind(this.elForm) : this.proxyForm[e] = this.elForm[e]);
+        }), this.size && (this.proxyForm.size = this.size);
       }
     }
   },
   mounted() {
-    this.dispatch("FormView", "FormView.addGroup", [this]);
+    this.notDispatch || this.dispatch("FormView", "FormView.addGroup", [this]);
   },
   beforeDestroy() {
-    this.dispatch("FormView", "FormView.removeGroup", [this]);
+    this.notDispatch || this.dispatch("FormView", "FormView.removeGroup", [this]);
   },
   methods: {
-    isDisabled() {
-      return this.disabled ? this.disabled : this.enabled ? !this.enabled : this.elForm.disabled;
-    },
-    dispatch(e, i, r) {
-      let t = this.$parent || this.$root, s = t.$options.name;
-      for (; t && (!s || s !== e); )
-        t = t.$parent, t && (s = t.$options.name);
-      t && t.$emit.apply(t, [i].concat(r));
+    dispatch(e, t, l) {
+      let i = this.$parent || this.$root, o = i.$options.name;
+      for (; i && (!o || o !== e); )
+        i = i.$parent, i && (o = i.$options.name);
+      i && i.$emit.apply(i, [t].concat(l));
     },
     renderDefault() {
-      const {
-        wrapRow: e,
-        gutter: i,
-        formConfig: r,
-        $scopedSlots: t
-      } = this;
-      return n(t.default) ? e ? (
-        // eslint-disable-next-line no-undef
-        o("ElRow", {
-          attrs: {
-            gutter: i
-          },
-          class: "form-item-group-row"
-        }, [t.default({
-          disabled: r.disabled
-        })])
-      ) : t.default({
-        disabled: r.disabled
-      }) : o("EmptyView", {
+      return this.$scopedSlots.default ? !this.formHolder.tableForm && this.wrapRow ? s("ElRow", {
+        attrs: {
+          gutter: this.gutter
+        }
+      }, [this.$scopedSlots.default({
+        disabled: this.proxyForm.disabled
+      })]) : this.$scopedSlots.default({
+        disabled: this.proxyForm.disabled
+      }) : s("EmptyView", {
         attrs: {
           "font-size": "14px",
           "empty-tips": "暂无信息"
@@ -117,37 +115,43 @@ const a = ["disabled", "size", "statusIcon", "inlineMessage", "autoLabelWidth",
     }
   },
   render() {
-    const {
-      renderDefault: e,
-      blockTitle: i,
-      active: r,
-      expand: t,
-      toggle: s,
-      $scopedSlots: l,
-      isDisabled: d
-    } = this;
-    return o("div", {
+    return s("div", {
       class: ["form-item-group", {
-        "default-active": r,
-        "is-disabled": d()
+        "default-active": this.active,
+        "is-disabled": this.isDisabled
       }]
-    }, [o("div", {
+    }, [s("div", {
       class: "form-item-group-title",
       on: {
-        click: s
-      }
-    }, [o("span", {
+        click: this.toggle
+      },
+      directives: [{
+        name: "show",
+        value: this.showTitle
+      }]
+    }, [s("span", {
       class: "flex-item"
-    }, [i, l["title-right"] ? l["title-right"]() : null]), " ", o("i", {
-      class: t ? "el-icon-arrow-down" : "el-icon-arrow-right"
-    })]), o("ElCollapseTransition", [o("div", {
+    }, [this.$scopedSlots.title ? this.$scopedSlots.title() : this.blockTitle, this.tips ? s("span", {
+      style: "color:#ff0000;font-size:14px;"
+    }, [" (", this.tips, ")"]) : null, this.$scopedSlots["title-right"] ? this.$scopedSlots["title-right"]() : null]), " ", s("i", {
+      class: this.expand ? "el-icon-arrow-down" : "el-icon-arrow-right"
+    })]), s("ElCollapseTransition", [s("div", {
       directives: [{
         name: "show",
-        value: t
+        value: this.expand
       }]
-    }, [e()])])]);
+    }, [this.renderDefault()])])]);
   }
-};
+}, h = null, p = null;
+var m = /* @__PURE__ */ a(
+  n,
+  h,
+  p,
+  !1,
+  null,
+  null
+);
+const f = m.exports;
 export {
-  p as default
+  f as default
 };

package/form-item-group/style.css

@@ -1 +1 @@
-.form-item-group{background-color:#fff;margin-bottom:10px}.form-item-group.is-disabled .is-required .el-form-item__label:before,.form-item-group.is-disabled .required .el-form-item__label:before{display:none}.form-item-group .form-item-group-row{margin:0!important}.form-item-group .form-item-group-title{color:#333;cursor:pointer;background-color:#f3f5fb;flex-direction:row;align-items:center;height:30px;margin:0 0 10px;padding:0 10px;font-size:14px;font-weight:700;line-height:30px;display:flex}
+.form-item-group{background-color:#fff;margin-bottom:10px}.form-item-group.is-disabled .is-required .el-form-item__label:before,.form-item-group.is-disabled .required .el-form-item__label:before{display:none}.form-item-group .form-item-group-title{color:#333;height:30px;font-weight:700;font-size:var(--gloal-font-size);cursor:pointer;background-color:#f3f5fb;flex-direction:row;align-items:center;margin:0 0 10px;padding:0 10px;line-height:30px;display:flex}