mine-h5-ui/es/MeCaptcha/hooks.js

一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍

import { ref as f, computed as R, useTemplateRef as S, watch as x } from "vue";
import { useMoveHandle as T } from "../MeComposable/useMoveHandle/index.js";
/*!
          * mine-h5-ui v2.16.0
          * Copyright (c) 2025 biaov
          * @license MIT
          */
const X = (a, r, { visible: d, statusCode: i }) => {
  let u = 0;
  const l = f(!1);
  let o;
  const c = R(() => {
    if (!a.item) return null;
    const { bgElem: e, elem: t } = a.item, [s] = e.size, [k, p] = t.size, [y, M] = t.initPos;
    o = 310 / s;
    const h = y * o;
    return n.value = h, {
      w: k * o,
      h: p * o,
      x: h,
      y: M * o
    };
  }), n = f(0), w = S("captchaSlideMoveNode"), b = {
    start({ x: e }) {
      u = e;
    },
    move({ x: e }) {
      if (!c.value) return;
      let t = c.value.x + e - u;
      t < 0 && (t = 0), t > 250 && (t = 250), n.value = t;
    },
    end(e) {
      const t = a.item?.elem?.initPos?.[1];
      if (!(o && t)) return;
      this.move(e);
      const s = Math.round(n.value / o);
      r("check", [s, t]);
    }
  };
  x(
    w,
    (e) => {
      e && T(e, b);
    },
    { immediate: !0 }
  ), x(i, async (e) => {
    switch (e) {
      case 1:
        setTimeout(() => {
          m(), i.value = 0;
        }, 800);
        break;
      case 2:
        l.value = !0, setTimeout(() => {
          l.value = !1, n.value = c.value.x, i.value = 0;
        }, 800);
        break;
      case 3:
        v(), i.value = 0;
        break;
    }
  });
  const m = () => {
    d.value = !1;
  }, v = () => {
    r("refresh"), i.value = 0;
  };
  return { moveX: n, imgRect: c, rectAni: l, onClose: m, onRefresh: v };
};
export {
  X as useSlide
};