@web-utils/component 2.7.36 → 2.8.0

package/fy-draggable/index.mjs

@@ -0,0 +1,382 @@
+import { s as l, w as a } from "../chunks/util.17330567.mjs";
+import { n as v } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var g = function() {
+  var e = this, t = e.$createElement, s = e._self._c || t;
+  return s("div", {
+    class: {
+      "avue-draggable__active": (e.active || e.overActive) && !e.readonly,
+      "avue-draggable__move": e.moveActive,
+      "avue-draggable__click": e.disabled
+    },
+    style: e.styleName,
+    on: {
+      mousedown: function(i) {
+        return i.stopPropagation(), e.handleMove.apply(null, arguments);
+      },
+      mouseover: function(i) {
+        return i.stopPropagation(), e.handleOver.apply(null, arguments);
+      },
+      mouseout: function(i) {
+        return i.stopPropagation(), e.handleOut.apply(null, arguments);
+      }
+    }
+  }, [s("ElInput", {
+    ref: "input",
+    staticClass: "avue-draggable__focus",
+    model: {
+      value: e.value,
+      callback: function(i) {
+        e.value = i;
+      },
+      expression: "value"
+    }
+  }), s("div", {
+    ref: "wrapper",
+    staticClass: "avue-draggable__wrapper"
+  }, [(e.active || e.overActive || e.moveActive) && !e.readonly ? [s("div", {
+    staticClass: "avue-draggable__line['left'])",
+    style: e.styleLineName
+  }), s("div", {
+    staticClass: "avue-draggable__line['top'])",
+    style: e.styleLineName
+  }), s("div", {
+    staticClass: "avue-draggable__line['label'])",
+    style: e.styleLabelName
+  }, [e._v(" " + e._s(e.baseLeft) + "," + e._s(e.baseTop) + " ")])] : e._e(), e.readonly ? e._e() : [e._l(e.rangeList, function(i, h) {
+    return [e.active ? s("div", {
+      key: h,
+      staticClass: "avue-draggable__range[item.classname])",
+      style: [e.styleRangeName, e.getRangeStyle(i.classname)],
+      on: {
+        mousedown: function(n) {
+          return n.stopPropagation(), e.rangeMove(n, i.classname);
+        }
+      }
+    }) : e._e()];
+  })], s("div", {
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: e.active || e.overActive,
+      expression: "active || overActive"
+    }],
+    staticClass: "avue-draggable__menu",
+    style: e.styleMenuName
+  }, [e._t("menu", null, {
+    zIndex: e.zIndex,
+    index: e.index
+  })], 2), s("div", {
+    ref: "item",
+    staticClass: "avue-draggable__item"
+  }, [e._t("default")], 2), !e.disabled && e.mask ? s("div", {
+    staticClass: "avue-draggable__mask"
+  }) : e._e()], 2)], 1);
+}, y = [];
+const _ = {
+  name: "FyDraggable",
+  props: {
+    index: {
+      type: [String, Number]
+    },
+    mask: {
+      type: Boolean,
+      default: !0
+    },
+    scale: {
+      type: Number,
+      default: 1
+    },
+    readonly: {
+      type: Boolean,
+      default: !1
+    },
+    resize: {
+      type: Boolean,
+      default: !0
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    lock: {
+      type: Boolean,
+      default: !1
+    },
+    step: {
+      type: Number,
+      default: 1
+    },
+    zIndex: {
+      type: [Number, String],
+      default: 1
+    },
+    left: {
+      type: Number,
+      default: 0
+    },
+    top: {
+      type: Number,
+      default: 0
+    },
+    width: {
+      type: Number
+    },
+    height: {
+      type: Number
+    }
+  },
+  data() {
+    return {
+      first: !0,
+      value: "",
+      baseWidth: 0,
+      baseHeight: 0,
+      baseLeft: 0,
+      baseTop: 0,
+      children: {},
+      moveActive: !1,
+      overActive: !1,
+      rangeActive: !1,
+      active: !1,
+      keyDown: null,
+      rangeList: [
+        {
+          classname: "left"
+        },
+        {
+          classname: "right"
+        },
+        {
+          classname: "top"
+        },
+        {
+          classname: "bottom"
+        },
+        {
+          classname: "top-left"
+        },
+        {
+          classname: "top-right"
+        },
+        {
+          classname: "bottom-left"
+        },
+        {
+          classname: "bottom-right"
+        }
+      ]
+    };
+  },
+  computed: {
+    scaleVal() {
+      return this.scale;
+    },
+    styleMenuName() {
+      return {
+        transformOrigin: "0 0",
+        transform: `scale(${this.scaleVal})`
+      };
+    },
+    styleLineName() {
+      return {
+        borderWidth: l(this.scaleVal)
+      };
+    },
+    styleRangeName() {
+      const e = 10 * this.scaleVal;
+      return {
+        width: l(e),
+        height: l(e)
+      };
+    },
+    styleLabelName() {
+      return {
+        fontSize: l(18 * this.scaleVal)
+      };
+    },
+    styleName() {
+      return Object.assign(
+        (() => this.active ? Object.assign(
+          {
+            zIndex: 9999
+          },
+          this.styleLineName
+        ) : { zIndex: this.zIndex })(),
+        {
+          top: l(this.baseTop),
+          left: l(this.baseLeft),
+          width: l(this.baseWidth),
+          height: l(this.baseHeight)
+        }
+      );
+    }
+  },
+  watch: {
+    active(e) {
+      e ? this.handleKeydown() : document.onkeydown = this.keyDown;
+    },
+    width(e) {
+      this.baseWidth = a(e) || this.children.offsetWidth;
+    },
+    height(e) {
+      this.baseHeight = a(e) || this.children.offsetHeight;
+    },
+    left(e) {
+      this.baseLeft = a(e);
+    },
+    top(e) {
+      this.baseTop = a(e);
+    },
+    baseWidth(e) {
+      this.$refs.wrapper.style.width = l(e), this.resize && this.children.style && (this.children.style.width = l(e));
+    },
+    baseHeight(e) {
+      this.$refs.wrapper.style.height = l(e), this.resize && this.children.style && (this.children.style.height = l(e));
+    },
+    baseLeft(e, t) {
+      this.first || this.setMove(e - t, 0);
+    },
+    baseTop(e, t) {
+      this.first || this.setMove(0, e - t);
+    }
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.children = this.$refs.item.firstChild, this.baseWidth = a(this.width) || this.children.offsetWidth, this.baseHeight = a(this.height) || this.children.offsetHeight, this.baseLeft = a(this.left), this.baseTop = a(this.top), this.keyDown = document.onkeydown, this.$nextTick(() => {
+        this.first = !1;
+      });
+    },
+    setMove(e, t) {
+      this.$emit("move", {
+        index: this.index,
+        left: e,
+        top: t
+      });
+    },
+    setLeft(e) {
+      this.baseLeft = e;
+    },
+    setTop(e) {
+      this.baseTop = e;
+    },
+    getRangeStyle(e) {
+      const t = 10 * this.scaleVal / 2, s = {};
+      return e.split("-").forEach((h) => {
+        s[h] = l(-t);
+      }), s;
+    },
+    setOverActive(e) {
+      this.overActive = e;
+    },
+    setActive(e) {
+      this.active = e;
+    },
+    rangeMove(e, t) {
+      if (this.disabled || this.lock)
+        return;
+      let s, i, h, n, o, u;
+      this.rangeActive = !0, this.handleMouseDown();
+      let c = e.clientX, f = e.clientY;
+      document.onmousemove = (d) => {
+        this.moveActive = !0, t === "right" ? (s = !0, i = !1) : t === "left" ? (s = !0, h = !0, o = !0, i = !1) : t === "top" ? (s = !1, i = !0, n = !0, u = !0) : t === "bottom" ? (s = !1, i = !0) : t === "bottom-right" ? (s = !0, i = !0) : t === "bottom-left" ? (s = !0, i = !0, h = !0, o = !0) : t === "top-right" ? (s = !0, i = !0, n = !0, u = !0) : t === "top-left" && (s = !0, i = !0, h = !0, o = !0, n = !0, u = !0);
+        const m = d.clientX - c, p = d.clientY - f;
+        if (c = d.clientX, f = d.clientY, s) {
+          let r = m * this.step;
+          o && (r = -r), h && (this.baseLeft = a(this.baseLeft - r)), this.baseWidth = a(this.baseWidth + r);
+        }
+        if (i) {
+          let r = p * this.step;
+          u && (r = -r), n && (this.baseTop = a(this.baseTop - r)), this.baseHeight = a(this.baseHeight + r);
+        }
+      }, this.handleClear();
+    },
+    handleOut() {
+      this.overActive = !1, this.$emit("out", {
+        index: this.index,
+        width: this.baseWidth,
+        height: this.baseHeight,
+        left: this.baseLeft,
+        top: this.baseTop
+      });
+    },
+    handleOver() {
+      this.disabled || (this.overActive = !0, this.$emit("over", {
+        index: this.index,
+        width: this.baseWidth,
+        height: this.baseHeight,
+        left: this.baseLeft,
+        top: this.baseTop
+      }));
+    },
+    handleMove(e) {
+      if (this.disabled || this.lock)
+        return;
+      setTimeout(() => {
+        this.$refs.input.focus();
+      }), this.active = !0, this.handleMouseDown();
+      let t = e.clientX, s = e.clientY;
+      document.onmousemove = (i) => {
+        const h = i.clientX - t, n = i.clientY - s;
+        t = i.clientX, s = i.clientY, this.baseLeft = a(this.baseLeft + h * this.step), this.baseTop = a(this.baseTop + n * this.step);
+      }, this.handleClear();
+    },
+    handleClear() {
+      document.onmouseup = () => {
+        document.onmousemove = null, document.onmouseup = null, this.handleMouseUp();
+      };
+    },
+    handleKeydown() {
+      document.onkeydown = (e) => {
+        const t = e || window.event || arguments.callee.caller.arguments[0], s = 1 * this.step;
+        this.$refs.input.focused && (t && t.keyCode == 38 ? this.baseTop = a(this.baseTop - s) : t && t.keyCode == 37 ? this.baseLeft = a(this.baseLeft - s) : t && t.keyCode == 40 ? this.baseTop = a(this.baseTop + s) : t && t.keyCode == 39 && (this.baseLeft = a(this.baseLeft + s)), e.stopPropagation(), e.preventDefault(), this.$emit("blur", {
+          index: this.index,
+          width: this.baseWidth,
+          height: this.baseHeight,
+          left: this.baseLeft,
+          top: this.baseTop
+        }), this.keyDown && this.keyDown(e));
+      };
+    },
+    handleMouseDown() {
+      this.moveActive = !0, this.$emit("focus", {
+        index: this.index,
+        width: this.baseWidth,
+        height: this.baseHeight,
+        left: this.baseLeft,
+        top: this.baseTop
+      });
+    },
+    handleMouseUp() {
+      this.moveActive = !1, this.rangeActive = !1, this.$emit("blur", {
+        index: this.index,
+        width: this.baseWidth,
+        height: this.baseHeight,
+        left: this.baseLeft,
+        top: this.baseTop
+      });
+    }
+  }
+}, b = {};
+var w = /* @__PURE__ */ v(
+  _,
+  g,
+  y,
+  !1,
+  x,
+  null,
+  null,
+  null
+);
+function x(e) {
+  for (let t in b)
+    this[t] = b[t];
+}
+const k = /* @__PURE__ */ function() {
+  return w.exports;
+}();
+export {
+  k as default
+};

package/fy-draggable/style.css

@@ -0,0 +1 @@
+.avue-draggable{position:absolute;padding:10px;cursor:move;user-select:none;-webkit-tap-highlight-color:transparent}.avue-draggable__focus{position:absolute!important;top:0;left:0;z-index:-1024;opacity:0}.avue-draggable__mask{position:absolute;inset:0;z-index:1;width:100%;height:100%;border:0}.avue-draggable--active{background-color:#73aae580;border:1px dashed #09f;cursor:move}.avue-draggable--move{background-color:#73aae580;opacity:.6}.avue-draggable--click{cursor:pointer}.avue-draggable__line--left{position:absolute;top:0;width:10000px;height:0;border-top:1px dashed #09f;transform:translate(-100%)}.avue-draggable__line--top{position:absolute;left:0;width:0;height:10000px;border-left:1px dashed #09f;transform:translateY(-100%)}.avue-draggable__line--label{position:absolute;top:-5px;left:-8px;padding:5px;color:#09f;font-size:18px;white-space:nowrap;transform:translate(-100%,-100%);cursor:move}.avue-draggable__menu{position:absolute;top:0;left:0;z-index:9999;color:#fff;font-size:25px;background-color:#409eff;cursor:pointer}.avue-draggable__range{position:absolute;z-index:9999;width:10px;height:10px;background-color:#09f;border-radius:100%}.avue-draggable__range--left,.avue-draggable__range--right{top:50%;transform:translateY(-50%)}.avue-draggable__range--left:hover,.avue-draggable__range--right:hover{cursor:ew-resize}.avue-draggable__range--left{left:-6px}.avue-draggable__range--right{right:-6px}.avue-draggable__range--top,.avue-draggable__range--bottom{left:50%;transform:translate(-50%)}.avue-draggable__range--top:hover,.avue-draggable__range--bottom:hover{cursor:ns-resize}.avue-draggable__range--top{top:-6px}.avue-draggable__range--bottom{bottom:-6px}.avue-draggable__range--bottom-right:hover,.avue-draggable__range--top-left:hover{cursor:nwse-resize}.avue-draggable__range--bottom-left:hover,.avue-draggable__range--top-right:hover{cursor:nesw-resize}.avue-draggable__range--top-right{top:-6px;right:-6px}.avue-draggable__range--top-left{top:-6px;left:-6px}.avue-draggable__range--bottom-right{right:-6px;bottom:-6px}.avue-draggable__range--bottom-left{bottom:-6px;left:-6px}

package/fy-dynamic/index.mjs

@@ -0,0 +1,337 @@
+import { p as u, e as c } from "../chunks/event.a018cb06.mjs";
+import { o as l, d as o } from "../chunks/util.17330567.mjs";
+import { n as h } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+function f(e) {
+  if (e == null)
+    throw new TypeError("Cannot destructure undefined");
+}
+var m = function() {
+  var e = this, t = e.$createElement, n = e._self._c || t;
+  return n("div", {
+    key: e.reload,
+    staticClass: "avue-dynamic"
+  }, [e.isForm ? [n("div", {
+    staticClass: "avue-dynamic__header"
+  }, [!e.readonly && !e.disabled && !e.addBtn ? n("ElButton", {
+    attrs: {
+      size: "mini",
+      circle: "",
+      disabled: e.disabled,
+      type: "primary",
+      icon: "el-icon-plus"
+    },
+    on: {
+      click: e.addRow
+    }
+  }) : e._e()], 1), n("div", e._l(e.text, function(i, r) {
+    return n("div", {
+      key: r,
+      staticClass: "avue-dynamic__row",
+      on: {
+        mouseenter: function(s) {
+          return e.cellMouseenter({
+            $index: r
+          });
+        },
+        mouseleave: function(s) {
+          return e.cellMouseLeave({
+            $index: r
+          });
+        }
+      }
+    }, [!e.readonly && !e.disabled && !e.delBtn && e.hoverList[r] ? n("ElButton", {
+      staticClass: "avue-dynamic__menu",
+      attrs: {
+        type: "danger",
+        size: "mini",
+        disabled: e.disabled,
+        icon: "el-icon-delete",
+        circle: ""
+      },
+      on: {
+        click: function(s) {
+          return e.delRow(i.$index);
+        }
+      }
+    }) : e._e(), n("FyForm", {
+      key: r,
+      ref: "main",
+      refInFor: !0,
+      attrs: {
+        option: e.deepClone(e.option)
+      },
+      scopedSlots: e._u([{
+        key: "_index",
+        fn: function(s) {
+          return f(s), n("div", {}, [n("span", [e._v(e._s(i.$index + 1))])]);
+        }
+      }, e._l(e.columnSlot, function(s) {
+        return {
+          key: s,
+          fn: function(d) {
+            return [e._t(s, null, null, Object.assign(d, {
+              row: e.text[r]
+            }))];
+          }
+        };
+      })], null, !0),
+      model: {
+        value: e.text[r],
+        callback: function(s) {
+          e.$set(e.text, r, s);
+        },
+        expression: "text[index]"
+      }
+    })], 1);
+  }), 0)] : e.isCrud ? n("FyCurd", {
+    ref: "main",
+    attrs: {
+      option: e.option,
+      disabled: e.disabled,
+      data: e.text
+    },
+    on: {
+      "cell-mouse-enter": e.cellMouseenter,
+      "cell-mouse-leave": e.cellMouseLeave,
+      "selection-change": e.handleSelectionChange,
+      "sortable-change": e.handleSortableChange
+    },
+    scopedSlots: e._u([{
+      key: "_indexHeader",
+      fn: function() {
+        return [!(e.addBtn || e.readonly) && e.maxFlag ? n("ElButton", {
+          attrs: {
+            type: "primary",
+            size: "mini",
+            disabled: e.disabled,
+            icon: "el-icon-plus",
+            circle: ""
+          },
+          on: {
+            click: function(i) {
+              return e.addRow();
+            }
+          }
+        }) : e._e()];
+      },
+      proxy: !0
+    }, {
+      key: "_index",
+      fn: function(i) {
+        return [!e.readonly && !e.disabled && !e.delBtn && e.hoverList[i.row.$index] ? n("ElButton", {
+          attrs: {
+            type: "danger",
+            size: "mini",
+            disabled: e.disabled,
+            icon: "el-icon-delete",
+            circle: ""
+          },
+          on: {
+            click: function(r) {
+              return e.delRow(i.row.$index);
+            }
+          }
+        }) : n("div", [e._v(" " + e._s(i.row.$index + 1) + " ")])];
+      }
+    }, e._l(e.columnSlot, function(i) {
+      return {
+        key: e.getSlotName({
+          prop: i
+        }, "F"),
+        fn: function(r) {
+          return [e._t(i, null, null, r)];
+        }
+      };
+    })], null, !0)
+  }) : e._e()], 2);
+}, p = [];
+const v = {
+  name: "FyDynamic",
+  mixins: [u, c],
+  props: {
+    max: Number,
+    columnSlot: {
+      type: Array,
+      default: () => []
+    },
+    children: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      reload: Math.random(),
+      hoverList: []
+    };
+  },
+  computed: {
+    textLen() {
+      return this.text.length;
+    },
+    maxFlag() {
+      return this.max ? this.text.length !== this.max : !0;
+    },
+    showIndex() {
+      return l(this.children.index, !0);
+    },
+    showType() {
+      return this.children.type || "crud";
+    },
+    isForm() {
+      return this.showType === "form";
+    },
+    isCrud() {
+      return this.showType === "crud";
+    },
+    selectionChange() {
+      return this.children.selectionChange;
+    },
+    sortableChange() {
+      return this.children.sortableChange;
+    },
+    rowAdd() {
+      return this.children.rowAdd;
+    },
+    rowDel() {
+      return this.children.rowDel;
+    },
+    viewBtn() {
+      return this.children.viewBtn === !1;
+    },
+    addBtn() {
+      return this.children.addBtn === !1;
+    },
+    delBtn() {
+      return this.children.delBtn === !1;
+    },
+    valueOption() {
+      const e = {};
+      return this.columnOption.forEach((t) => {
+        t.value && (e[t.prop] = t.value);
+      }), e;
+    },
+    rulesOption() {
+      const e = {};
+      return this.columnOption.forEach((t) => {
+        t.rules && (e[t.prop] = t.rules);
+      }), e;
+    },
+    columnOption() {
+      return this.children.column || [];
+    },
+    option() {
+      return Object.assign({
+        border: !0,
+        header: !1,
+        menu: !1,
+        size: this.size,
+        disabled: this.disabled,
+        readonly: this.readonly,
+        emptyBtn: !1,
+        submitBtn: !1
+      }, (() => {
+        const e = o(this.children);
+        return delete e.column, e;
+      })(), (() => {
+        const e = [{
+          label: this.children.indexLabel || "#",
+          prop: "_index",
+          display: this.showIndex,
+          hide: !this.showIndex,
+          fixed: !0,
+          align: "center",
+          headerAlign: "center",
+          span: 24,
+          width: 50
+        }];
+        return this.columnOption.forEach((t) => {
+          e.push(Object.assign(t, {
+            cell: l(t.cell, this.isCrud)
+          }));
+        }), {
+          column: e
+        };
+      })());
+    }
+  },
+  watch: {
+    text() {
+      this.initData();
+    }
+  },
+  mounted() {
+    this.initData();
+  },
+  methods: {
+    deepClone: o,
+    handleSelectionChange(e) {
+      this.selectionChange && this.selectionChange(e);
+    },
+    handleSortableChange(e, t, n, i) {
+      this.sortableChange && this.sortableChange(e, t, n, i);
+    },
+    cellMouseenter(e) {
+      const t = e.$index;
+      this.mouseoverRow(t);
+    },
+    cellMouseLeave(e) {
+      const t = e.$index;
+      this.mouseoutRow(t);
+    },
+    initData() {
+      this.text.forEach((e, t) => {
+        e = Object.assign(e, {
+          $cellEdit: !0,
+          $index: t
+        });
+      });
+    },
+    mouseoverRow(e) {
+      this.delBtn || (this.flagList(), this.$set(this.hoverList, e, !0));
+    },
+    mouseoutRow(e) {
+      this.delBtn || (this.flagList(), this.$set(this.hoverList, e, !1));
+    },
+    flagList() {
+      this.hoverList.forEach((e, t) => {
+        this.hoverList[t] = !1;
+      });
+    },
+    delRow(e) {
+      const t = () => {
+        const n = o(this.text);
+        n.splice(e, 1), this.text = n, this.reload = Math.random();
+      };
+      typeof this.rowDel == "function" ? this.rowDel(this.text[e], t) : t();
+    },
+    addRow() {
+      const e = (t = {}) => {
+        t = Object.assign(this.valueOption, t, {
+          $index: this.textLen
+        }), this.isCrud ? this.$refs.main.rowCellAdd(t) : this.isForm && this.text.push(t);
+      };
+      typeof this.rowAdd == "function" ? this.rowAdd(e) : e();
+    }
+  }
+}, a = {};
+var _ = /* @__PURE__ */ h(
+  v,
+  m,
+  p,
+  !1,
+  y,
+  null,
+  null,
+  null
+);
+function y(e) {
+  for (let t in a)
+    this[t] = a[t];
+}
+const g = /* @__PURE__ */ function() {
+  return _.exports;
+}();
+export {
+  g as default
+};