@web-utils/component 2.7.20 → 2.7.22

package/dist/components/fy-draggable/index.js

@@ -1,78 +1,78 @@
-import { s as l, g as a } from "../../chunks/util.23fe58fb.js";
-import { n as v } from "../../chunks/vueComponentNormalizer.71e2aa87.js";
-var g = function() {
-  var e = this, t = e.$createElement, s = e._self._c || t;
-  return s("div", {
+import { s as setPx, w as getFixed } from "../../chunks/util.89913643.js";
+import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.77ec6792.js";
+var render = function() {
+  var _vm = this, _h = _vm.$createElement, _c = _vm._self._c || _h;
+  return _c("div", {
     class: {
-      "avue-draggable__active": (e.active || e.overActive) && !e.readonly,
-      "avue-draggable__move": e.moveActive,
-      "avue-draggable__click": e.disabled
+      "avue-draggable__active": (_vm.active || _vm.overActive) && !_vm.readonly,
+      "avue-draggable__move": _vm.moveActive,
+      "avue-draggable__click": _vm.disabled
     },
-    style: e.styleName,
+    style: _vm.styleName,
     on: {
-      mousedown: function(i) {
-        return i.stopPropagation(), e.handleMove.apply(null, arguments);
+      mousedown: function($event) {
+        return $event.stopPropagation(), _vm.handleMove.apply(null, arguments);
       },
-      mouseover: function(i) {
-        return i.stopPropagation(), e.handleOver.apply(null, arguments);
+      mouseover: function($event) {
+        return $event.stopPropagation(), _vm.handleOver.apply(null, arguments);
       },
-      mouseout: function(i) {
-        return i.stopPropagation(), e.handleOut.apply(null, arguments);
+      mouseout: function($event) {
+        return $event.stopPropagation(), _vm.handleOut.apply(null, arguments);
       }
     }
-  }, [s("ElInput", {
+  }, [_c("ElInput", {
     ref: "input",
     staticClass: "avue-draggable__focus",
     model: {
-      value: e.value,
-      callback: function(i) {
-        e.value = i;
+      value: _vm.value,
+      callback: function($$v) {
+        _vm.value = $$v;
       },
       expression: "value"
     }
-  }), s("div", {
+  }), _c("div", {
     ref: "wrapper",
     staticClass: "avue-draggable__wrapper"
-  }, [(e.active || e.overActive || e.moveActive) && !e.readonly ? [s("div", {
+  }, [(_vm.active || _vm.overActive || _vm.moveActive) && !_vm.readonly ? [_c("div", {
     staticClass: "avue-draggable__line['left'])",
-    style: e.styleLineName
-  }), s("div", {
+    style: _vm.styleLineName
+  }), _c("div", {
     staticClass: "avue-draggable__line['top'])",
-    style: e.styleLineName
-  }), s("div", {
+    style: _vm.styleLineName
+  }), _c("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,
+    style: _vm.styleLabelName
+  }, [_vm._v(" " + _vm._s(_vm.baseLeft) + "," + _vm._s(_vm.baseTop) + " ")])] : _vm._e(), _vm.readonly ? _vm._e() : [_vm._l(_vm.rangeList, function(item, s) {
+    return [_vm.active ? _c("div", {
+      key: s,
       staticClass: "avue-draggable__range[item.classname])",
-      style: [e.styleRangeName, e.getRangeStyle(i.classname)],
+      style: [_vm.styleRangeName, _vm.getRangeStyle(item.classname)],
       on: {
-        mousedown: function(n) {
-          return n.stopPropagation(), e.rangeMove(n, i.classname);
+        mousedown: function($event) {
+          return $event.stopPropagation(), _vm.rangeMove($event, item.classname);
         }
       }
-    }) : e._e()];
-  })], s("div", {
+    }) : _vm._e()];
+  })], _c("div", {
     directives: [{
       name: "show",
       rawName: "v-show",
-      value: e.active || e.overActive,
+      value: _vm.active || _vm.overActive,
       expression: "active || overActive"
     }],
     staticClass: "avue-draggable__menu",
-    style: e.styleMenuName
-  }, [e._t("menu", null, {
-    zIndex: e.zIndex,
-    index: e.index
-  })], 2), s("div", {
+    style: _vm.styleMenuName
+  }, [_vm._t("menu", null, {
+    zIndex: _vm.zIndex,
+    index: _vm.index
+  })], 2), _c("div", {
     ref: "item",
     staticClass: "avue-draggable__item"
-  }, [e._t("default")], 2), !e.disabled && e.mask ? s("div", {
+  }, [_vm._t("default")], 2), !_vm.disabled && _vm.mask ? _c("div", {
     staticClass: "avue-draggable__mask"
-  }) : e._e()], 2)], 1);
-}, y = [];
-const _ = {
+  }) : _vm._e()], 2)], 1);
+}, staticRenderFns = [];
+const __vue2_script = {
   name: "FyDraggable",
   props: {
     index: {
@@ -179,19 +179,19 @@ const _ = {
     },
     styleLineName() {
       return {
-        borderWidth: l(this.scaleVal)
+        borderWidth: setPx(this.scaleVal)
       };
     },
     styleRangeName() {
-      const e = 10 * this.scaleVal;
+      const calc = 10 * this.scaleVal;
       return {
-        width: l(e),
-        height: l(e)
+        width: setPx(calc),
+        height: setPx(calc)
       };
     },
     styleLabelName() {
       return {
-        fontSize: l(18 * this.scaleVal)
+        fontSize: setPx(18 * this.scaleVal)
       };
     },
     styleName() {
@@ -203,41 +203,41 @@ const _ = {
           this.styleLineName
         ) : { zIndex: this.zIndex })(),
         {
-          top: l(this.baseTop),
-          left: l(this.baseLeft),
-          width: l(this.baseWidth),
-          height: l(this.baseHeight)
+          top: setPx(this.baseTop),
+          left: setPx(this.baseLeft),
+          width: setPx(this.baseWidth),
+          height: setPx(this.baseHeight)
         }
       );
     }
   },
   watch: {
-    active(e) {
-      e ? this.handleKeydown() : document.onkeydown = this.keyDown;
+    active(val) {
+      val ? this.handleKeydown() : document.onkeydown = this.keyDown;
     },
-    width(e) {
-      this.baseWidth = a(e) || this.children.offsetWidth;
+    width(val) {
+      this.baseWidth = getFixed(val) || this.children.offsetWidth;
     },
-    height(e) {
-      this.baseHeight = a(e) || this.children.offsetHeight;
+    height(val) {
+      this.baseHeight = getFixed(val) || this.children.offsetHeight;
     },
-    left(e) {
-      this.baseLeft = a(e);
+    left(val) {
+      this.baseLeft = getFixed(val);
     },
-    top(e) {
-      this.baseTop = a(e);
+    top(val) {
+      this.baseTop = getFixed(val);
     },
-    baseWidth(e) {
-      this.$refs.wrapper.style.width = l(e), this.resize && this.children.style && (this.children.style.width = l(e));
+    baseWidth(val) {
+      this.$refs.wrapper.style.width = setPx(val), this.resize && this.children.style && (this.children.style.width = setPx(val));
     },
-    baseHeight(e) {
-      this.$refs.wrapper.style.height = l(e), this.resize && this.children.style && (this.children.style.height = l(e));
+    baseHeight(val) {
+      this.$refs.wrapper.style.height = setPx(val), this.resize && this.children.style && (this.children.style.height = setPx(val));
     },
-    baseLeft(e, t) {
-      this.first || this.setMove(e - t, 0);
+    baseLeft(n, o) {
+      this.first || this.setMove(n - o, 0);
     },
-    baseTop(e, t) {
-      this.first || this.setMove(0, e - t);
+    baseTop(n, o) {
+      this.first || this.setMove(0, n - o);
     }
   },
   mounted() {
@@ -245,51 +245,51 @@ const _ = {
   },
   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.children = this.$refs.item.firstChild, this.baseWidth = getFixed(this.width) || this.children.offsetWidth, this.baseHeight = getFixed(this.height) || this.children.offsetHeight, this.baseLeft = getFixed(this.left), this.baseTop = getFixed(this.top), this.keyDown = document.onkeydown, this.$nextTick(() => {
         this.first = !1;
       });
     },
-    setMove(e, t) {
+    setMove(left, top) {
       this.$emit("move", {
         index: this.index,
-        left: e,
-        top: t
+        left,
+        top
       });
     },
-    setLeft(e) {
-      this.baseLeft = e;
+    setLeft(left) {
+      this.baseLeft = left;
     },
-    setTop(e) {
-      this.baseTop = e;
+    setTop(top) {
+      this.baseTop = top;
     },
-    getRangeStyle(e) {
-      const t = 10 * this.scaleVal / 2, s = {};
-      return e.split("-").forEach((h) => {
-        s[h] = l(-t);
-      }), s;
+    getRangeStyle(postion) {
+      const calc = 10 * this.scaleVal / 2, result = {};
+      return postion.split("-").forEach((ele) => {
+        result[ele] = setPx(-calc);
+      }), result;
     },
-    setOverActive(e) {
-      this.overActive = e;
+    setOverActive(val) {
+      this.overActive = val;
     },
-    setActive(e) {
-      this.active = e;
+    setActive(val) {
+      this.active = val;
     },
-    rangeMove(e, t) {
+    rangeMove(e, position) {
       if (this.disabled || this.lock)
         return;
-      let s, i, h, n, o, u;
+      let x, y, xp, yp, xc, yc;
       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);
+      let disX = e.clientX, disY = e.clientY;
+      document.onmousemove = (e2) => {
+        this.moveActive = !0, position === "right" ? (x = !0, y = !1) : position === "left" ? (x = !0, xp = !0, xc = !0, y = !1) : position === "top" ? (x = !1, y = !0, yp = !0, yc = !0) : position === "bottom" ? (x = !1, y = !0) : position === "bottom-right" ? (x = !0, y = !0) : position === "bottom-left" ? (x = !0, y = !0, xp = !0, xc = !0) : position === "top-right" ? (x = !0, y = !0, yp = !0, yc = !0) : position === "top-left" && (x = !0, y = !0, xp = !0, xc = !0, yp = !0, yc = !0);
+        const left = e2.clientX - disX, top = e2.clientY - disY;
+        if (disX = e2.clientX, disY = e2.clientY, x) {
+          let calc = left * this.step;
+          xc && (calc = -calc), xp && (this.baseLeft = getFixed(this.baseLeft - calc)), this.baseWidth = getFixed(this.baseWidth + calc);
         }
-        if (i) {
-          let r = p * this.step;
-          u && (r = -r), n && (this.baseTop = a(this.baseTop - r)), this.baseHeight = a(this.baseHeight + r);
+        if (y) {
+          let calc = top * this.step;
+          yc && (calc = -calc), yp && (this.baseTop = getFixed(this.baseTop - calc)), this.baseHeight = getFixed(this.baseHeight + calc);
         }
       }, this.handleClear();
     },
@@ -317,10 +317,10 @@ const _ = {
       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);
+      let disX = e.clientX, disY = e.clientY;
+      document.onmousemove = (e2) => {
+        const left = e2.clientX - disX, top = e2.clientY - disY;
+        disX = e2.clientX, disY = e2.clientY, this.baseLeft = getFixed(this.baseLeft + left * this.step), this.baseTop = getFixed(this.baseTop + top * this.step);
       }, this.handleClear();
     },
     handleClear() {
@@ -329,15 +329,15 @@ const _ = {
       };
     },
     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", {
+      document.onkeydown = (event) => {
+        const e = event || window.event || arguments.callee.caller.arguments[0], step = 1 * this.step;
+        this.$refs.input.focused && (e && e.keyCode == 38 ? this.baseTop = getFixed(this.baseTop - step) : e && e.keyCode == 37 ? this.baseLeft = getFixed(this.baseLeft - step) : e && e.keyCode == 40 ? this.baseTop = getFixed(this.baseTop + step) : e && e.keyCode == 39 && (this.baseLeft = getFixed(this.baseLeft + step)), event.stopPropagation(), event.preventDefault(), this.$emit("blur", {
           index: this.index,
           width: this.baseWidth,
           height: this.baseHeight,
           left: this.baseLeft,
           top: this.baseTop
-        }), this.keyDown && this.keyDown(e));
+        }), this.keyDown && this.keyDown(event));
       };
     },
     handleMouseDown() {
@@ -359,24 +359,24 @@ const _ = {
       });
     }
   }
-}, b = {};
-var w = /* @__PURE__ */ v(
-  _,
-  g,
-  y,
+}, __cssModules = {};
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  __vue2_script,
+  render,
+  staticRenderFns,
   !1,
-  x,
+  __vue2_injectStyles,
   null,
   null,
   null
 );
-function x(e) {
-  for (let t in b)
-    this[t] = b[t];
+function __vue2_injectStyles(context) {
+  for (let o in __cssModules)
+    this[o] = __cssModules[o];
 }
-const k = /* @__PURE__ */ function() {
-  return w.exports;
+const FyDraggable = /* @__PURE__ */ function() {
+  return __component__.exports;
 }();
 export {
-  k as default
+  FyDraggable as default
 };

package/dist/components/fy-draggable/style.css

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