@nutui/nutui 4.0.11 → 4.0.12

package/dist/packages/_es/Drag.js

@@ -1,13 +1,14 @@
-import { ref as h, reactive as x, computed as b, onMounted as v, onActivated as g, onDeactivated as P, openBlock as T, createElementBlock as W, normalizeClass as H, renderSlot as L } from "vue";
-import { c as E } from "./component-234624bc.js";
-import { r as u } from "./raf-a74f1a06.js";
-import { _ as k } from "./_plugin-vue_export-helper-dad06003.js";
+import { ref, reactive, computed, onMounted, onActivated, onDeactivated, openBlock, createElementBlock, normalizeClass, renderSlot } from "vue";
+import { c as createComponent } from "./component-81a4c1d0.js";
+import { r as requestAniFrame } from "./raf-729dad54.js";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
 import "../locale/lang";
-const { componentName: A, create: $ } = E("drag"), X = $({
+const { componentName, create } = createComponent("drag");
+const _sfc_main = create({
   props: {
     attract: {
       type: Boolean,
-      default: !1
+      default: false
     },
     direction: {
       type: String,
@@ -15,17 +16,20 @@ const { componentName: A, create: $ } = E("drag"), X = $({
     },
     boundary: {
       type: Object,
-      default: () => ({
-        top: 0,
-        left: 0,
-        right: 0,
-        bottom: 0
-      })
+      default: () => {
+        return {
+          top: 0,
+          left: 0,
+          right: 0,
+          bottom: 0
+        };
+      }
     }
   },
-  setup(i) {
-    const o = h(), t = x({
-      keepAlive: !1,
+  setup(props) {
+    const myDrag = ref();
+    const state = reactive({
+      keepAlive: false,
       elWidth: 0,
       elHeight: 0,
       screenWidth: 0,
@@ -43,76 +47,155 @@ const { componentName: A, create: $ } = E("drag"), X = $({
         right: 0,
         bottom: 0
       }
-    }), a = b(() => ({
-      [A]: !0
-    }));
-    function p() {
-      const e = document.documentElement;
-      t.elWidth = o.value.offsetWidth, t.elHeight = o.value.offsetHeight, t.screenWidth = e.clientWidth || 375, t.screenHeight = e.clientHeight || 667;
+    });
+    const classes = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true
+      };
+    });
+    function getInfo() {
+      const domElem = document.documentElement;
+      state.elWidth = myDrag.value.offsetWidth;
+      state.elHeight = myDrag.value.offsetHeight;
+      state.screenWidth = domElem.clientWidth || 375;
+      state.screenHeight = domElem.clientHeight || 667;
     }
-    function c(e) {
-      t.boundary.left ? +e.style.left.split("px")[0] > t.boundary.left ? (e.style.left = +e.style.left.split("px")[0] - 10 + "px", u(() => {
-        c(e);
-      })) : e.style.left = `${t.boundary.left}px` : +e.style.left.split("px")[0] > 10 ? (e.style.left = +e.style.left.split("px")[0] - 10 + "px", u(() => {
-        c(e);
-      })) : e.style.left = "0px";
+    function goLeft(target) {
+      if (state.boundary.left) {
+        if (+target.style.left.split("px")[0] > state.boundary.left) {
+          target.style.left = +target.style.left.split("px")[0] - 10 + "px";
+          requestAniFrame(() => {
+            goLeft(target);
+          });
+        } else {
+          target.style.left = `${state.boundary.left}px`;
+        }
+      } else {
+        if (+target.style.left.split("px")[0] > 10) {
+          target.style.left = +target.style.left.split("px")[0] - 10 + "px";
+          requestAniFrame(() => {
+            goLeft(target);
+          });
+        } else {
+          target.style.left = "0px";
+        }
+      }
     }
-    function l(e, n) {
-      n - parseInt(e.style.left.split("px")[0]) > 10 ? (e.style.left = parseInt(e.style.left.split("px")[0]) + 10 + "px", u(() => {
-        l(e, n);
-      })) : e.style.left = n + "px";
+    function goRight(target, rightLocation) {
+      if (rightLocation - parseInt(target.style.left.split("px")[0]) > 10) {
+        target.style.left = parseInt(target.style.left.split("px")[0]) + 10 + "px";
+        requestAniFrame(() => {
+          goRight(target, rightLocation);
+        });
+      } else {
+        target.style.left = rightLocation + "px";
+      }
     }
-    function d(e) {
+    function touchMove(e) {
       e.preventDefault();
-      const n = e.currentTarget;
+      const target = e.currentTarget;
       if (e.targetTouches.length === 1) {
-        const r = e.targetTouches[0];
-        t.nx = r.clientX - t.position.x, t.ny = r.clientY - t.position.y, t.xPum = t.startLeft + t.nx, t.yPum = t.startTop + t.ny;
-        const s = t.screenWidth - t.elWidth - t.boundary.right;
-        Math.abs(t.xPum) > s ? t.xPum = s : t.xPum <= t.boundary.left && (t.xPum = t.boundary.left), t.yPum < t.boundary.top ? t.yPum = t.boundary.top : t.yPum > t.screenHeight - t.elHeight - t.boundary.bottom && (t.yPum = t.screenHeight - t.elHeight - t.boundary.bottom), i.direction != "y" && (n.style.left = t.xPum + "px"), i.direction != "x" && (n.style.top = t.yPum + "px");
+        const touch = e.targetTouches[0];
+        state.nx = touch.clientX - state.position.x;
+        state.ny = touch.clientY - state.position.y;
+        state.xPum = state.startLeft + state.nx;
+        state.yPum = state.startTop + state.ny;
+        const rightLocation = state.screenWidth - state.elWidth - state.boundary.right;
+        if (Math.abs(state.xPum) > rightLocation) {
+          state.xPum = rightLocation;
+        } else if (state.xPum <= state.boundary.left) {
+          state.xPum = state.boundary.left;
+        }
+        if (state.yPum < state.boundary.top) {
+          state.yPum = state.boundary.top;
+        } else if (state.yPum > state.screenHeight - state.elHeight - state.boundary.bottom) {
+          state.yPum = state.screenHeight - state.elHeight - state.boundary.bottom;
+        }
+        if (props.direction != "y") {
+          target.style.left = state.xPum + "px";
+        }
+        if (props.direction != "x") {
+          target.style.top = state.yPum + "px";
+        }
       }
     }
-    function y(e) {
-      const n = e.currentTarget;
-      let s = e.changedTouches[0].clientX;
-      const f = t.screenWidth - t.elWidth - t.boundary.right;
-      s > f ? s = f : s < t.boundary.left ? s = t.boundary.left : s = s < t.screenWidth / 2 ? t.boundary.left : f, i.direction != "y" && i.attract && (s < t.screenWidth / 2 ? u(() => {
-        c(n);
-      }) : u(() => {
-        l(n, f);
-      })), i.direction != "x" && (n.style.top = t.yPum + "px");
+    function touchEnd(e) {
+      const target = e.currentTarget;
+      const touch = e.changedTouches[0];
+      let currX = touch.clientX;
+      const rightLocation = state.screenWidth - state.elWidth - state.boundary.right;
+      if (currX > rightLocation) {
+        currX = rightLocation;
+      } else if (currX < state.boundary.left) {
+        currX = state.boundary.left;
+      } else {
+        currX = currX < state.screenWidth / 2 ? state.boundary.left : rightLocation;
+      }
+      if (props.direction != "y" && props.attract) {
+        if (currX < state.screenWidth / 2) {
+          requestAniFrame(() => {
+            goLeft(target);
+          });
+        } else {
+          requestAniFrame(() => {
+            goRight(target, rightLocation);
+          });
+        }
+      }
+      if (props.direction != "x") {
+        target.style.top = state.yPum + "px";
+      }
     }
-    function m(e) {
-      const n = e.currentTarget, r = e.touches[0], s = e.targetTouches[0];
-      t.startTop = n.offsetTop, t.startLeft = n.offsetLeft, t.position.x = r.clientX, t.position.y = r.clientY, t.nx = s.clientX - t.position.x, t.ny = s.clientY - t.position.y, t.xPum = t.startLeft + t.nx, t.yPum = t.startTop + t.ny;
+    function touchStart(e) {
+      const target = e.currentTarget;
+      const touches = e.touches[0];
+      const touch = e.targetTouches[0];
+      state.startTop = target.offsetTop;
+      state.startLeft = target.offsetLeft;
+      state.position.x = touches.clientX;
+      state.position.y = touches.clientY;
+      state.nx = touch.clientX - state.position.x;
+      state.ny = touch.clientY - state.position.y;
+      state.xPum = state.startLeft + state.nx;
+      state.yPum = state.startTop + state.ny;
     }
-    return v(() => {
-      p(), t.boundary = i.boundary;
-    }), g(() => {
-      t.keepAlive && (t.keepAlive = !1);
-    }), P(() => {
-      t.keepAlive = !0, o.value.removeEventListener("touchstart", m), o.value.removeEventListener("touchmove", d), o.value.removeEventListener("touchend", y);
-    }), {
-      classes: a,
-      myDrag: o,
-      touchStart: m,
-      touchMove: d,
-      touchEnd: y
+    onMounted(() => {
+      getInfo();
+      state.boundary = props.boundary;
+    });
+    onActivated(() => {
+      if (state.keepAlive) {
+        state.keepAlive = false;
+      }
+    });
+    onDeactivated(() => {
+      state.keepAlive = true;
+      myDrag.value.removeEventListener("touchstart", touchStart);
+      myDrag.value.removeEventListener("touchmove", touchMove);
+      myDrag.value.removeEventListener("touchend", touchEnd);
+    });
+    return {
+      classes,
+      myDrag,
+      touchStart,
+      touchMove,
+      touchEnd
     };
   }
 });
-function C(i, o, t, a, p, c) {
-  return T(), W("view", {
-    class: H(i.classes),
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes),
     ref: "myDrag",
-    onTouchstart: o[0] || (o[0] = (l) => i.touchStart(l)),
-    onTouchmove: o[1] || (o[1] = (l) => i.touchMove(l)),
-    onTouchend: o[2] || (o[2] = (l) => i.touchEnd(l))
+    onTouchstart: _cache[0] || (_cache[0] = ($event) => _ctx.touchStart($event)),
+    onTouchmove: _cache[1] || (_cache[1] = ($event) => _ctx.touchMove($event)),
+    onTouchend: _cache[2] || (_cache[2] = ($event) => _ctx.touchEnd($event))
   }, [
-    L(i.$slots, "default")
+    renderSlot(_ctx.$slots, "default")
   ], 34);
 }
-const Y = /* @__PURE__ */ k(X, [["render", C]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  Y as default
+  index as default
 };

package/dist/packages/_es/Ecard.js

@@ -1,13 +1,14 @@
-import { ref as s, watch as C, resolveComponent as M, openBlock as v, createElementBlock as f, createElementVNode as l, toDisplayString as i, Fragment as k, renderList as N, normalizeClass as g, withDirectives as b, vModelText as A, createTextVNode as w, createVNode as S } from "vue";
-import { c as T } from "./component-234624bc.js";
-import y from "./InputNumber.js";
-import { _ as B } from "./_plugin-vue_export-helper-dad06003.js";
+import { ref, watch, resolveComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, Fragment, renderList, normalizeClass, withDirectives, vModelText, createTextVNode, createVNode } from "vue";
+import { c as createComponent } from "./component-81a4c1d0.js";
+import InputNumber from "./InputNumber.js";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
 import "../locale/lang";
-import "./pxCheck-38173291.js";
+import "./pxCheck-c6b9f6b7.js";
 import "@nutui/icons-vue";
-const { create: I, translate: $ } = T("ecard"), L = I({
+const { create, translate } = createComponent("ecard");
+const _sfc_main = create({
   components: {
-    [y.name]: y
+    [InputNumber.name]: InputNumber
   },
   props: {
     chooseText: {
@@ -52,77 +53,116 @@ const { create: I, translate: $ } = T("ecard"), L = I({
     }
   },
   emits: ["inputChange", "changeStep", "inputClick", "change", "update:modelValue"],
-  setup(e, { emit: t }) {
-    const c = s(null), o = s(null), a = s(""), r = s(e.cardAmountMin), p = s(e.modelValue), n = (u, V) => {
-      c.value = V, r.value = e.cardAmountMin, o.value = u.price, t("change", u), t("update:modelValue", u.price);
-    }, d = (u) => {
-      let m = u.target.value.replace(/[^\d]/g, "");
-      a.value = m, o.value = m, Number(m) > e.cardAmountMax && (a.value = e.cardAmountMax, o.value = e.cardAmountMax), Number(m) < e.cardAmountMin && (a.value = e.cardAmountMin, o.value = e.cardAmountMin), t("inputChange", Number(a.value)), t("update:modelValue", Number(a.value));
-    }, h = () => {
-      c.value = "input", r.value = e.cardAmountMin, o.value = a.value, t("update:modelValue", a.value), t("inputClick");
-    }, _ = (u) => {
-      r.value = u, t("changeStep", r.value, o.value);
+  setup(props, { emit }) {
+    const currentIndex = ref(null);
+    const currentValue = ref(null);
+    const inputValue = ref("");
+    const stepValue = ref(props.cardAmountMin);
+    const money = ref(props.modelValue);
+    const handleClick = (item, index2) => {
+      currentIndex.value = index2;
+      stepValue.value = props.cardAmountMin;
+      currentValue.value = item.price;
+      emit("change", item);
+      emit("update:modelValue", item.price);
     };
-    return C(
-      () => e.modelValue,
-      (u) => {
-        p.value = u;
+    const change = (event) => {
+      let input = event.target;
+      let val = input.value.replace(/[^\d]/g, "");
+      inputValue.value = val;
+      currentValue.value = val;
+      if (Number(val) > props.cardAmountMax) {
+        inputValue.value = props.cardAmountMax;
+        currentValue.value = props.cardAmountMax;
       }
-    ), {
-      handleClick: n,
-      changeStep: _,
-      change: d,
-      inputClick: h,
-      stepValue: r,
-      currentIndex: c,
-      inputValue: a,
-      money: p,
-      translate: $
+      if (Number(val) < props.cardAmountMin) {
+        inputValue.value = props.cardAmountMin;
+        currentValue.value = props.cardAmountMin;
+      }
+      emit("inputChange", Number(inputValue.value));
+      emit("update:modelValue", Number(inputValue.value));
+    };
+    const inputClick = () => {
+      currentIndex.value = "input";
+      stepValue.value = props.cardAmountMin;
+      currentValue.value = inputValue.value;
+      emit("update:modelValue", inputValue.value);
+      emit("inputClick");
+    };
+    const changeStep = (value) => {
+      stepValue.value = value;
+      emit("changeStep", stepValue.value, currentValue.value);
+    };
+    watch(
+      () => props.modelValue,
+      (value) => {
+        money.value = value;
+      }
+    );
+    return {
+      handleClick,
+      changeStep,
+      change,
+      inputClick,
+      stepValue,
+      currentIndex,
+      inputValue,
+      money,
+      translate
     };
   }
-}), D = { class: "nut-ecard" }, E = { class: "nut-ecard__title" }, U = { class: "nut-ecard__list" }, x = ["onClick"], z = { class: "nut-ecard__list__input--con" }, F = ["placeholder"], j = { class: "nut-ecard__list__step" };
-function q(e, t, c, o, a, r) {
-  const p = M("nut-input-number");
-  return v(), f("view", D, [
-    l("view", E, i(e.chooseText || e.translate("chooseText")), 1),
-    l("view", U, [
-      (v(!0), f(k, null, N(e.dataList, (n, d) => (v(), f("view", {
-        key: d,
-        class: g(["nut-ecard__list__item", e.currentIndex == d ? "active" : ""]),
-        onClick: (h) => e.handleClick(n, d)
-      }, i(n.price), 11, x))), 128)),
-      l("view", {
-        class: g(["nut-ecard__list__input", e.currentIndex == "input" ? "active" : ""]),
-        onClick: t[2] || (t[2] = (...n) => e.inputClick && e.inputClick(...n))
+});
+const _hoisted_1 = { class: "nut-ecard" };
+const _hoisted_2 = { class: "nut-ecard__title" };
+const _hoisted_3 = { class: "nut-ecard__list" };
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = { class: "nut-ecard__list__input--con" };
+const _hoisted_6 = ["placeholder"];
+const _hoisted_7 = { class: "nut-ecard__list__step" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_nut_input_number = resolveComponent("nut-input-number");
+  return openBlock(), createElementBlock("view", _hoisted_1, [
+    createElementVNode("view", _hoisted_2, toDisplayString(_ctx.chooseText || _ctx.translate("chooseText")), 1),
+    createElementVNode("view", _hoisted_3, [
+      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.dataList, (item, index2) => {
+        return openBlock(), createElementBlock("view", {
+          key: index2,
+          class: normalizeClass(["nut-ecard__list__item", _ctx.currentIndex == index2 ? "active" : ""]),
+          onClick: ($event) => _ctx.handleClick(item, index2)
+        }, toDisplayString(item.price), 11, _hoisted_4);
+      }), 128)),
+      createElementVNode("view", {
+        class: normalizeClass(["nut-ecard__list__input", _ctx.currentIndex == "input" ? "active" : ""]),
+        onClick: _cache[2] || (_cache[2] = (...args) => _ctx.inputClick && _ctx.inputClick(...args))
       }, [
-        l("view", null, i(e.otherValueText || e.translate("otherValueText")), 1),
-        l("view", z, [
-          b(l("input", {
+        createElementVNode("view", null, toDisplayString(_ctx.otherValueText || _ctx.translate("otherValueText")), 1),
+        createElementVNode("view", _hoisted_5, [
+          withDirectives(createElementVNode("input", {
             class: "nut-ecard__list__input--input",
             type: "text",
-            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.inputValue = n),
-            onInput: t[1] || (t[1] = (...n) => e.change && e.change(...n)),
-            placeholder: e.placeholder || e.translate("placeholder")
-          }, null, 40, F), [
-            [A, e.inputValue]
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.inputValue = $event),
+            onInput: _cache[1] || (_cache[1] = (...args) => _ctx.change && _ctx.change(...args)),
+            placeholder: _ctx.placeholder || _ctx.translate("placeholder")
+          }, null, 40, _hoisted_6), [
+            [vModelText, _ctx.inputValue]
           ]),
-          w(" " + i(e.suffix), 1)
+          createTextVNode(" " + toDisplayString(_ctx.suffix), 1)
         ])
       ], 2),
-      l("view", j, [
-        l("view", null, i(e.suffix) + i(e.money), 1),
-        S(p, {
-          modelValue: e.stepValue,
-          "onUpdate:modelValue": t[3] || (t[3] = (n) => e.stepValue = n),
-          min: e.cardBuyMin,
-          max: e.cardBuyMax,
-          onChange: e.changeStep
+      createElementVNode("view", _hoisted_7, [
+        createElementVNode("view", null, toDisplayString(_ctx.suffix) + toDisplayString(_ctx.money), 1),
+        createVNode(_component_nut_input_number, {
+          modelValue: _ctx.stepValue,
+          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => _ctx.stepValue = $event),
+          min: _ctx.cardBuyMin,
+          max: _ctx.cardBuyMax,
+          onChange: _ctx.changeStep
         }, null, 8, ["modelValue", "min", "max", "onChange"])
       ])
     ])
   ]);
 }
-const R = /* @__PURE__ */ B(L, [["render", q]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  R as default
+  index as default
 };