vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
235 lines (234 loc) • 8.77 kB
JavaScript
import { defineComponent as os, useTemplateRef as t, computed as ls, createElementBlock as O, openBlock as n, createCommentVNode as C, createElementVNode as l, unref as s, withModifiers as r, normalizeClass as i, toDisplayString as T, createBlock as m } from "vue";
import { useVerifySlider as ts } from "./hook/useVerifySlider.mjs";
import { useVerifyRotate as ns } from "./hook/useVerifyRotate.mjs";
import { useVerifyPuzzle as rs } from "./hook/useVerifyPuzzle.mjs";
import { Icon as z } from "@vuux/icons";
const is = { class: "app-verify" }, us = {
key: 0,
class: "slider-box"
}, as = {
key: 1,
class: "rotate-box"
}, ds = ["src"], ps = {
key: 2,
class: "puzzle-box"
}, ms = ["src"], Ms = /* @__PURE__ */ os({
name: "Verify",
__name: "index",
props: {
type: { default: "slider" },
modelValue: { type: Boolean, default: !1 },
difference: { default: 2 },
img: { default: "" },
text: { default: "" },
successText: { default: "" }
},
emits: ["update:modelValue", "result"],
setup(K, { expose: Q, emit: U }) {
const u = K, b = U, V = t("sliderBarEl"), w = t("sliderBlockEl"), L = t("rotateCheckImgEl"), P = t("rotateBlockEl"), R = t("rotateBarEl"), D = t("puzzleCheckImgEl"), N = t("puzzleBlockEl"), S = t("puzzleBarEl"), j = t("puzzleMaincanvasEl"), q = t("puzzleMovecanvasEl"), v = ls(() => u.type || "slider"), { sliderIsOk: f, sliderIsLoosen: A, sliderIsMoving: W, sliderMessage: X, sliderOnMousedown: k, sliderOnMousemove: g, sliderOnMouseup: a, sliderReset: Y } = ts(u, V, w, b), { rotateIsOk: c, rotateIsLoosen: F, rotateIsMoving: Z, rotateMessage: $, rotateOnLoad: G, rotateOnMousedown: M, rotateOnMousemove: y, rotateOnMouseup: d, rotateReset: _ } = ns(u, L, P, R, b), { puzzleIsOk: E, puzzleIsLoosen: x, puzzleIsMoving: h, puzzleMessage: ss, puzzleCheckimgLoaded: H, puzzleOnMousedown: B, puzzleOnMousemove: I, puzzleOnMouseup: p, puzzleReset: es } = rs(u, D, N, S, j, q, b);
return Q({
reset: (J) => {
const e = J || v.value;
e === "slider" ? Y() : e === "rotate" ? _() : e === "puzzle" && es();
}
}), (J, e) => (n(), O("div", is, [
v.value === "slider" ? (n(), O("div", us, [
l("div", {
class: "box-data",
onMousemove: e[2] || (e[2] = //@ts-ignore
(...o) => s(g) && s(g)(...o)),
onMouseup: e[3] || (e[3] = //@ts-ignore
(...o) => s(a) && s(a)(...o)),
onMouseleave: e[4] || (e[4] = //@ts-ignore
(...o) => s(a) && s(a)(...o)),
onTouchmovePassive: e[5] || (e[5] = r(
//@ts-ignore
(...o) => s(g) && s(g)(...o),
["stop"]
)),
onTouchend: e[6] || (e[6] = //@ts-ignore
(...o) => s(a) && s(a)(...o))
}, [
l("div", {
ref_key: "sliderBarEl",
ref: V,
class: i(["is-bar", [{ "is-loosen": s(A) }, { "is-drag": s(W) }, { "is-success": s(f) }]])
}, null, 2),
l("div", {
class: i(["is-messages", { "is-success": s(f) }])
}, T(s(X)), 3),
l("div", {
ref_key: "sliderBlockEl",
ref: w,
class: i(["is-block", [{ "is-loosen": s(A) }, { "is-success": s(f) }]]),
onMousedown: e[0] || (e[0] = //@ts-ignore
(...o) => s(k) && s(k)(...o)),
onTouchstartPassive: e[1] || (e[1] = r(
//@ts-ignore
(...o) => s(k) && s(k)(...o),
["stop"]
))
}, [
s(f) ? (n(), m(s(z), {
key: 0,
name: "Icon1722501",
size: 15,
color: "var(--app-success)"
})) : (n(), m(s(z), {
key: 1,
name: "Icon1756783",
size: 15,
opacity: 0.8
}))
], 34)
], 32)
])) : C("", !0),
v.value === "rotate" ? (n(), O("div", as, [
l("img", {
ref_key: "rotateCheckImgEl",
ref: L,
crossOrigin: "anonymous",
src: u.img,
class: "rotate-img",
draggable: "false",
onLoad: e[7] || (e[7] = //@ts-ignore
(...o) => s(G) && s(G)(...o)),
onDragstart: e[8] || (e[8] = r(() => {
}, ["prevent"])),
onContextmenu: e[9] || (e[9] = r(() => {
}, ["prevent"]))
}, null, 40, ds),
l("div", {
class: "box-data",
onMousemove: e[12] || (e[12] = //@ts-ignore
(...o) => s(y) && s(y)(...o)),
onMouseup: e[13] || (e[13] = //@ts-ignore
(...o) => s(d) && s(d)(...o)),
onMouseleave: e[14] || (e[14] = //@ts-ignore
(...o) => s(d) && s(d)(...o)),
onTouchmovePassive: e[15] || (e[15] = r(
//@ts-ignore
(...o) => s(y) && s(y)(...o),
["stop"]
)),
onTouchend: e[16] || (e[16] = //@ts-ignore
(...o) => s(d) && s(d)(...o))
}, [
l("div", {
ref_key: "rotateBarEl",
ref: R,
class: i(["is-bar", [{ "is-loosen": s(F) }, { "is-drag": s(Z) }, { "is-success": s(c) }]])
}, null, 2),
l("div", {
class: i(["is-messages", { "is-success": s(c) }])
}, T(s($)), 3),
l("div", {
ref_key: "rotateBlockEl",
ref: P,
class: i(["is-block", [{ "is-loosen": s(F) }, { "is-success": s(c) }]]),
onMousedown: e[10] || (e[10] = //@ts-ignore
(...o) => s(M) && s(M)(...o)),
onTouchstartPassive: e[11] || (e[11] = r(
//@ts-ignore
(...o) => s(M) && s(M)(...o),
["stop"]
))
}, [
s(c) ? (n(), m(s(z), {
key: 0,
name: "Icon1722501",
size: 15,
color: "var(--app-success)"
})) : (n(), m(s(z), {
key: 1,
name: "Icon1756783",
size: 15,
opacity: 0.8
}))
], 34)
], 32)
])) : C("", !0),
v.value === "puzzle" ? (n(), O("div", ps, [
l("div", {
class: "puzzle-img",
onDragstart: e[18] || (e[18] = r(() => {
}, ["prevent"])),
onContextmenu: e[19] || (e[19] = r(() => {
}, ["prevent"]))
}, [
l("img", {
ref_key: "puzzleCheckImgEl",
ref: D,
crossOrigin: "anonymous",
src: u.img,
draggable: "false",
onLoad: e[17] || (e[17] = //@ts-ignore
(...o) => s(H) && s(H)(...o))
}, null, 40, ms),
l("canvas", {
ref_key: "puzzleMaincanvasEl",
ref: j,
class: "main-canvas"
}, null, 512),
l("canvas", {
ref_key: "puzzleMovecanvasEl",
ref: q,
class: i(["move-canvas", { "is-loosen": s(x) }])
}, null, 2)
], 32),
l("div", {
class: "box-data",
onMousemove: e[22] || (e[22] = //@ts-ignore
(...o) => s(I) && s(I)(...o)),
onMouseup: e[23] || (e[23] = //@ts-ignore
(...o) => s(p) && s(p)(...o)),
onMouseleave: e[24] || (e[24] = //@ts-ignore
(...o) => s(p) && s(p)(...o)),
onTouchmovePassive: e[25] || (e[25] = r(
//@ts-ignore
(...o) => s(I) && s(I)(...o),
["stop"]
)),
onTouchend: e[26] || (e[26] = //@ts-ignore
(...o) => s(p) && s(p)(...o))
}, [
l("div", {
ref_key: "puzzleBarEl",
ref: S,
class: i(["is-bar", [{ "is-loosen": s(x) }, { "is-drag": s(h) }, { "is-success": s(E) }]])
}, null, 2),
l("div", {
class: i([{ "is-success": s(E) }, "is-messages"])
}, T(s(ss)), 3),
l("div", {
ref_key: "puzzleBlockEl",
ref: N,
class: i(["is-block", [{ "is-loosen": s(x) }, { "is-success": s(E) }]]),
onMousedown: e[20] || (e[20] = //@ts-ignore
(...o) => s(B) && s(B)(...o)),
onTouchstartPassive: e[21] || (e[21] = r(
//@ts-ignore
(...o) => s(B) && s(B)(...o),
["stop"]
))
}, [
s(E) ? (n(), m(s(z), {
key: 0,
name: "Icon1722501",
size: 15,
color: "var(--app-success)"
})) : (n(), m(s(z), {
key: 1,
name: "Icon1756783",
size: 15,
opacity: 0.8
}))
], 34)
], 32)
])) : C("", !0)
]));
}
});
export {
Ms as default
};