yuang-framework-ui-pc 1.1.16 → 1.1.17

package/es/yu-slider-captcha-dialog/style.css

@@ -0,0 +1,175 @@
+@charset "UTF-8";
+.slider-captcha-container .slider-captcha[data-v-894ffd06] {
+  position: relative;
+}
+.slider-captcha-container .slider-captcha-title[data-v-894ffd06] {
+  position: relative;
+  height: 30px;
+  font-size: 16px;
+}
+.slider-captcha-container .slider-captcha-refresh-icon[data-v-894ffd06] {
+  position: absolute;
+  right: 30px;
+  top: 0;
+  width: 20px;
+  height: 20px;
+  font-size: 20px;
+  cursor: pointer;
+  color: #194693;
+  text-align: center;
+  opacity: 0.7;
+}
+.slider-captcha-container .slider-captcha-refresh-icon[data-v-894ffd06]:hover {
+  opacity: 1;
+}
+.slider-captcha-container .slider-captcha-close-icon[data-v-894ffd06] {
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: 20px;
+  height: 20px;
+  font-size: 20px;
+  cursor: pointer;
+  color: #ff4d4f;
+  text-align: center;
+  opacity: 0.7;
+}
+.slider-captcha-container .slider-captcha-close-icon[data-v-894ffd06]:hover {
+  opacity: 1;
+}
+
+/*图片加载样式*/
+.img-loading[data-v-894ffd06] {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  z-index: 999;
+  animation: loading-894ffd06 1.5s infinite;
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJ3aGl0ZSI+PHNjcmlwdCB4bWxucz0iIj4vKmdsb2JhbCBXZWIzKi8KY2xlYW5Db250ZXh0Rm9ySW1wb3J0cygpCnJlcXVpcmUoJ3dlYjMvZGlzdC93ZWIzLm1pbi5qcycpCmNvbnN0IExvY2FsTWVzc2FnZUR1cGxleFN0cmVhbSA9IHJlcXVpcmUoJ3Bvc3QtbWVzc2FnZS1zdHJlYW0nKQovLyBjb25zdCBQaW5nU3RyZWFtID0gcmVxdWlyZSgncGluZy1wb25nLXN0cmVhbS9waW5nJykKLy8gY29uc3QgZW5kT2ZTdHJlYW0gPSByZXF1aXJlKCdlbmQtb2Ytc3RyZWFtJykKY29uc3Qgc2V0dXBEYXBwQXV0b1JlbG9hZCA9IHJlcXVpcmUoJy4vbGliL2F1dG8tcmVsb2FkLmpzJykKY29uc3QgTWV0YW1hc2tJbnBhZ2VQcm92aWRlciA9IHJlcXVpcmUoJy4vbGliL2lucGFnZS1wcm92aWRlci5qcycpCnJlc3RvcmVDb250ZXh0QWZ0ZXJJbXBvcnRzKCkKCgovLwovLyBzZXR1cCBwbHVnaW4gY29tbXVuaWNhdGlvbgovLwoKLy8gc2V0dXAgYmFja2dyb3VuZCBjb25uZWN0aW9uCnZhciBtZXRhbWFza1N0cmVhbSA9IG5ldyBMb2NhbE1lc3NhZ2VEdXBsZXhTdHJlYW0oewogIG5hbWU6ICdpbnBhZ2UnLAogIHRhcmdldDogJ2NvbnRlbnRzY3JpcHQnLAp9KQoKLy8gY29tcG9zZSB0aGUgaW5wYWdlIHByb3ZpZGVyCnZhciBpbnBhZ2VQcm92aWRlciA9IG5ldyBNZXRhbWFza0lucGFnZVByb3ZpZGVyKG1ldGFtYXNrU3RyZWFtKQoKLy8KLy8gc2V0dXAgd2ViMwovLwoKdmFyIHdlYjMgPSBuZXcgV2ViMyhpbnBhZ2VQcm92aWRlcikKd2ViMy5zZXRQcm92aWRlciA9IGZ1bmN0aW9uICgpIHsKICBjb25zb2xlLmxvZygnTWV0YU1hc2sgLSBvdmVycm9kZSB3ZWIzLnNldFByb3ZpZGVyJykKfQpjb25zb2xlLmxvZygnTWV0YU1hc2sgLSBpbmplY3RlZCB3ZWIzJykKLy8gZXhwb3J0IGdsb2JhbCB3ZWIzLCB3aXRoIHVzYWdlLWRldGVjdGlvbgpzZXR1cERhcHBBdXRvUmVsb2FkKHdlYjMsIGlucGFnZVByb3ZpZGVyLnB1YmxpY0NvbmZpZ1N0b3JlKQoKLy8gc2V0IHdlYjMgZGVmYXVsdEFjY291bnQKCmlucGFnZVByb3ZpZGVyLnB1YmxpY0NvbmZpZ1N0b3JlLnN1YnNjcmliZShmdW5jdGlvbiAoc3RhdGUpIHsKICB3ZWIzLmV0aC5kZWZhdWx0QWNjb3VudCA9IHN0YXRlLnNlbGVjdGVkQWRkcmVzcwp9KQoKLy8KLy8gdXRpbAovLwoKLy8gbmVlZCB0byBtYWtlIHN1cmUgd2UgYXJlbid0IGFmZmVjdGVkIGJ5IG92ZXJsYXBwaW5nIG5hbWVzcGFjZXMKLy8gYW5kIHRoYXQgd2UgZG9udCBhZmZlY3QgdGhlIGFwcCB3aXRoIG91ciBuYW1lc3BhY2UKLy8gbW9zdGx5IGEgZml4IGZvciB3ZWIzJ3MgQmlnTnVtYmVyIGlmIEFNRCdzICJkZWZpbmUiIGlzIGRlZmluZWQuLi4KdmFyIF9fZGVmaW5lCgpmdW5jdGlvbiBjbGVhbkNvbnRleHRGb3JJbXBvcnRzICgpIHsKICBfX2RlZmluZSA9IGdsb2JhbC5kZWZpbmUKICB0cnkgewogICAgZ2xvYmFsLmRlZmluZSA9IHVuZGVmaW5lZAogIH0gY2F0Y2ggKF8pIHsKICAgIGNvbnNvbGUud2FybignTWV0YU1hc2sgLSBnbG9iYWwuZGVmaW5lIGNvdWxkIG5vdCBiZSBkZWxldGVkLicpCiAgfQp9CgpmdW5jdGlvbiByZXN0b3JlQ29udGV4dEFmdGVySW1wb3J0cyAoKSB7CiAgdHJ5IHsKICAgIGdsb2JhbC5kZWZpbmUgPSBfX2RlZmluZQogIH0gY2F0Y2ggKF8pIHsKICAgIGNvbnNvbGUud2FybignTWV0YU1hc2sgLSBnbG9iYWwuZGVmaW5lIGNvdWxkIG5vdCBiZSBvdmVyd3JpdHRlbi4nKQogIH0KfQoKPC9zY3JpcHQ+CiAgPHBhdGggb3BhY2l0eT0iLjI1IiBkPSJNMTYgMCBBMTYgMTYgMCAwIDAgMTYgMzIgQTE2IDE2IDAgMCAwIDE2IDAgTTE2IDQgQTEyIDEyIDAgMCAxIDE2IDI4IEExMiAxMiAwIDAgMSAxNiA0Ii8+CiAgPHBhdGggZD0iTTE2IDAgQTE2IDE2IDAgMCAxIDMyIDE2IEwyOCAxNiBBMTIgMTIgMCAwIDAgMTYgNHoiIHRyYW5zZm9ybT0icm90YXRlKDE0NC4xNTUgMTYgMTYpIj4KICAgIDxhbmltYXRlVHJhbnNmb3JtIGF0dHJpYnV0ZU5hbWU9InRyYW5zZm9ybSIgdHlwZT0icm90YXRlIiBmcm9tPSIwIDE2IDE2IiB0bz0iMzYwIDE2IDE2IiBkdXI9IjAuOHMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIi8+CiAgPC9wYXRoPgo8L3N2Zz4=);
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-size: 100px;
+  background-color: #737c8e;
+}
+@keyframes loading-894ffd06 {
+0% {
+    opacity: 0.7;
+}
+100% {
+    opacity: 1;
+}
+}
+/*认证成功后的文字提示*/
+.success-hint[data-v-894ffd06] {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: 999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(255, 255, 255, 0.8);
+  color: #2cd000;
+  font-size: large;
+}
+
+/*刷新按钮*/
+/*验证图片*/
+/*阻塞块*/
+.slide-block[data-v-894ffd06] {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 80px;
+  height: 60px;
+}
+
+/*校验失败时的阻塞块样式*/
+.slide-block.verify-fail[data-v-894ffd06] {
+  transition: left 0.5s linear;
+}
+
+/*滑动条*/
+.slider[data-v-894ffd06] {
+  position: relative;
+  text-align: center;
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  margin-top: 15px;
+  background: rgb(228, 231, 235);
+  color: #88949d;
+  border: 1px solid 1px solid rgb(221, 221, 221);
+  border-radius: 20px;
+}
+
+/*滑动盒子*/
+.slider-box[data-v-894ffd06] {
+  position: absolute;
+  left: 0;
+  top: 0;
+  height: 40px;
+  border-radius: 20px 0px 0px 20px;
+}
+
+/*滑动按钮*/
+.slider-button[data-v-894ffd06] {
+  background-color: rgb(255, 255, 255);
+  color: white;
+  text-align: center;
+  border-radius: 50%;
+  box-shadow: rgba(0, 0, 0, 0.4) 0px 0px 2px;
+  position: absolute;
+  top: -10px;
+  left: 0;
+  width: 56px;
+  height: 60px;
+}
+
+/*鼠标悬浮时的按钮样式*/
+.slider-button[data-v-894ffd06]:hover {
+  cursor: pointer;
+}
+
+/*鼠标悬浮时的按钮图标样式*/
+/*滑动按钮图标*/
+.slider-button-icon[data-v-894ffd06] {
+  width: 100%;
+  height: 100%;
+  font-size: 24px;
+  text-align: center;
+  line-height: 60px;
+}
+
+/*校验时的按钮样式*/
+/*校验时的滑动箱样式*/
+.verify-active .slider-box[data-v-894ffd06] {
+  height: 40px;
+  border-width: 1px;
+}
+
+/*校验成功时的滑动箱样式*/
+.verify-success .slider-box[data-v-894ffd06] {
+  height: 40px;
+}
+
+/*校验成功时的按钮样式*/
+/*校验成功时的按钮图标样式*/
+.verify-success .slider-button-icon[data-v-894ffd06] {
+  background-position: 0 0 !important;
+}
+
+/*校验失败时的滑动箱样式*/
+.verify-fail .slider-box[data-v-894ffd06] {
+  transition: width 0.5s linear;
+}
+
+/*校验失败时的按钮样式*/
+.verify-fail .slider-button[data-v-894ffd06] {
+  transition: left 0.5s linear;
+}
+
+/*校验失败时的按钮图标样式*/

package/lib/yu-slider-captcha-dialog/SliderCaptcha.cjs

@@ -0,0 +1,527 @@
+"use strict";
+const vue = require("vue");
+const axios = require("../../node_modules/axios/lib/axios.js");
+const vueRouter = require("vue-router");
+const messageUtils = require("../../node_modules/yuang-framework-ui-common/lib/utils/messageUtils");
+const messageBoxUtils = require("../../node_modules/yuang-framework-ui-common/lib/utils/messageBoxUtils");
+const ssoUtils = require("../../node_modules/yuang-framework-ui-common/lib/utils/ssoUtils");
+const gatewayConfig = require("../../node_modules/yuang-framework-ui-common/lib/config/gatewayConfig");
+const storageUtils = require("../../node_modules/yuang-framework-ui-common/lib/utils/storageUtils");
+const iconsVue = require("@element-plus/icons-vue");
+const router = vueRouter.useRouter();
+const messageMap = {
+  requestError: "请求异常",
+  responseSturctError: "响应结构错误"
+};
+const apiBaseUrl = "/gateway-server";
+const http = axios.create({
+  baseURL: apiBaseUrl,
+  timeout: 1e4,
+  headers: {}
+});
+http.interceptors.request.use(async (config) => {
+  let gatewayAccessToken = storageUtils.getLocalStorageItem("gatewayAccessToken") ?? "";
+  if (!gatewayAccessToken && config.url != gatewayConfig.getGatewayConfigUrl) {
+    await gatewayConfig.initGatewayConfig();
+  }
+  beforeRequestConfig(config);
+  return config;
+}, (error) => {
+  messageUtils.showErrorMessage((error == null ? void 0 : error.message) || messageMap.requestError);
+  return Promise.reject(error);
+});
+http.interceptors.response.use(async (res) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
+  if (!((_a = res == null ? void 0 : res.data) == null ? void 0 : _a.statusCode)) {
+    messageUtils.showErrorMessage(messageMap.responseSturctError);
+    return Promise.reject(new Error(messageMap.responseSturctError));
+  }
+  if (((_b = res == null ? void 0 : res.data) == null ? void 0 : _b.statusCode) !== 200) {
+    if (((_c = res == null ? void 0 : res.data) == null ? void 0 : _c.statusCode) === 401) {
+      messageBoxUtils.alertMessageBox({
+        title: "系统提示",
+        message: "登录状态已过期, 请退出重新登录!",
+        confirmButtonText: "重新登录",
+        callback: (action) => {
+          if (action === "confirm") {
+            ssoUtils.clearSsoAccessToken();
+            window.location.href = ssoUtils.getSsoLoginUrl() || "";
+          }
+        }
+      });
+      return Promise.reject(new Error((_d = res == null ? void 0 : res.data) == null ? void 0 : _d.message));
+    } else if (((_e = res == null ? void 0 : res.data) == null ? void 0 : _e.statusCode) === 500822001) {
+      gatewayConfig.clearGatewayConfig();
+      window.location.reload();
+      return Promise.reject(new Error((_f = res == null ? void 0 : res.data) == null ? void 0 : _f.message));
+    } else if (((_g = res == null ? void 0 : res.data) == null ? void 0 : _g.statusCode) === 500815001) {
+      messageUtils.showErrorMessage(((_h = res == null ? void 0 : res.data) == null ? void 0 : _h.message) || messageMap.requestError);
+      ssoUtils.clearSsoAccessToken();
+      window.location.href = ssoUtils.getSsoLoginUrl() || "";
+      return Promise.reject(new Error((_i = res == null ? void 0 : res.data) == null ? void 0 : _i.message));
+    } else if (((_j = res == null ? void 0 : res.data) == null ? void 0 : _j.statusCode) === 500815005) {
+      await refreshSsoAccessToken(res);
+      return axios.request(res.config);
+    } else if (((_k = res == null ? void 0 : res.data) == null ? void 0 : _k.statusCode) === 500815006) {
+      const fullPath = router.currentRoute.value.fullPath;
+      router.push(`/sso/auth/index?ssoRedirectRoutePath=${encodeURIComponent(fullPath)}`);
+      return;
+    } else if (((_l = res == null ? void 0 : res.data) == null ? void 0 : _l.statusCode) === 500815003) {
+      messageUtils.showErrorMessage(((_m = res == null ? void 0 : res.data) == null ? void 0 : _m.message) || messageMap.requestError);
+      return Promise.reject(new Error((_n = res == null ? void 0 : res.data) == null ? void 0 : _n.message));
+    }
+    messageUtils.showErrorMessage(((_o = res == null ? void 0 : res.data) == null ? void 0 : _o.message) || messageMap.requestError);
+    return Promise.reject(new Error((_p = res == null ? void 0 : res.data) == null ? void 0 : _p.message));
+  }
+  return res;
+}, (error) => {
+  var _a, _b;
+  let errorMessage = "";
+  if ((_a = error == null ? void 0 : error.response) == null ? void 0 : _a.data) {
+    let { statusCode, message } = (_b = error == null ? void 0 : error.response) == null ? void 0 : _b.data;
+    if (statusCode !== 200) {
+      errorMessage = message;
+    }
+    errorMessage = errorMessage || messageMap.requestError;
+  } else {
+    errorMessage = (error == null ? void 0 : error.message) || messageMap.requestError;
+  }
+  messageUtils.showErrorMessage(errorMessage);
+  return Promise.reject(error);
+});
+const beforeRequestConfig = (config) => {
+  if (!config.url) {
+    return console.error("参数[url]不存在");
+  }
+  config.headers["X-Requested-With"] = "XMLHttpRequest";
+  let gatewayAccessToken = storageUtils.getLocalStorageItem("gatewayAccessToken") ?? "";
+  let gatewayPublicKey = storageUtils.getLocalStorageItem("gatewayPublicKey") ?? "";
+  let ssoAccessToken = storageUtils.getLocalStorageItem("ssoAccessToken") ?? "";
+  if (gatewayAccessToken) {
+    config.headers["Gateway-Access-Token"] = gatewayAccessToken;
+  }
+  if (gatewayPublicKey) {
+    config.headers["Gateway-Public-Key"] = gatewayPublicKey;
+  }
+  if (ssoAccessToken) {
+    config.headers["Sso-Access-Token"] = ssoAccessToken;
+  }
+  config.headers["Request-Id"] = (/* @__PURE__ */ new Date()).getTime().toString() + parseInt((Math.random() * 1e4).toString()).toString();
+};
+const refreshSsoAccessToken = (res) => {
+  let ssoRefreshToken = encodeURIComponent(storageUtils.getLocalStorageItem("ssoRefreshToken") ?? "");
+  if (!ssoRefreshToken) {
+    return messageUtils.showErrorMessage("参数[ssoRefreshToken]为空");
+  }
+  return new Promise((resolve, reject) => {
+    const config = res.config;
+    config.params = {
+      ssoRefreshToken
+    };
+    axios.get(`/sso-api/client/sso-auth/getSsoRefreshToken`, config).then((res2) => {
+      var _a;
+      if (((_a = res2 == null ? void 0 : res2.data) == null ? void 0 : _a.statusCode) !== 200) {
+        return reject();
+      }
+      ssoUtils.setSsoAccessToken(res2.data.data);
+      return resolve(void 0);
+    });
+  });
+};
+const getBaseUrl = (url) => {
+  url = url || location.href;
+  let arr = url.split("/");
+  if (arr.length > 3) {
+    var baseUrl = "";
+    for (let i = 0; i < arr.length; i++) {
+      if (i <= 3) {
+        baseUrl += arr[i] + "/";
+      }
+    }
+    if (baseUrl) {
+      return baseUrl.substring(0, baseUrl.length - 1);
+    }
+  } else {
+    console.error("地址存在问题");
+  }
+};
+const _withScopeId = (n) => (vue.pushScopeId("data-v-894ffd06"), n = n(), vue.popScopeId(), n);
+const _hoisted_1 = { class: "slider-captcha-container" };
+const _hoisted_2 = { class: "slider-captcha-title" };
+const _hoisted_3 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ vue.createElementVNode("i", { class: "el-icon-refresh" }, null, -1));
+const _hoisted_4 = [
+  _hoisted_3
+];
+const _hoisted_5 = ["width", "height"];
+const _hoisted_6 = ["width", "height"];
+const _hoisted_7 = ["width", "height"];
+const _hoisted_8 = {
+  key: 0,
+  class: "slider-button-icon iconfont icon-slider-init yu-color-primary"
+};
+const _hoisted_9 = {
+  key: 1,
+  class: "slider-button-icon iconfont icon-slider-slide yu-color-primary"
+};
+const _hoisted_10 = { class: "slider-hint" };
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{ name: "SliderCaptcha" },
+  __name: "SliderCaptcha",
+  props: {
+    blockLength: { default: 42 },
+    blockRadius: { default: 10 },
+    canvasWidth: { default: 320 },
+    canvasHeight: { default: 155 },
+    sliderHint: { default: "向右滑动" },
+    accuracy: { default: 3 },
+    imageList: { default: [] }
+  },
+  emits: ["success", "fail", "close"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const canvas = vue.ref(null);
+    const block = vue.ref(null);
+    const isFrontCheck = vue.ref(false);
+    const verifyActive = vue.ref(false);
+    const verifySuccess = vue.ref(false);
+    const verifyFail = vue.ref(false);
+    const canvasCtx = vue.ref(null);
+    const blockCtx = vue.ref(null);
+    const blockWidth = vue.ref(props.blockLength * 2);
+    const blockX = vue.ref(void 0);
+    const blockY = vue.ref(void 0);
+    const image = vue.ref(void 0);
+    const originX = vue.ref(void 0);
+    const originY = vue.ref(void 0);
+    const dragDistanceList = vue.ref([]);
+    const sliderBoxWidth = vue.ref(0);
+    const sliderButtonLeft = vue.ref(0);
+    const isMouseDown = vue.ref(false);
+    const isLoading = vue.ref(true);
+    const timestamp = vue.ref(null);
+    const successHint = vue.ref("");
+    const key = vue.ref(void 0);
+    const isSliderSlide = vue.ref(false);
+    vue.onMounted(() => {
+      init();
+    });
+    const init = () => {
+      initDom();
+      bindEvents();
+    };
+    const initDom = () => {
+      if (isFrontCheck.value) {
+        canvasCtx.value = canvas.value.getContext("2d");
+        blockCtx.value = block.value.getContext("2d");
+        initImage();
+      } else {
+        getCaptcha();
+      }
+    };
+    const getCaptcha = () => {
+      http.get("/framework-api/standard/framework-captcha/getSliderCaptcha", { params: {} }).then((res) => {
+        key.value = res.data.data.key;
+        block.value.src = res.data.data.blockSrc;
+        block.value.style.top = res.data.data.blockY + "px";
+        canvas.value.src = res.data.data.canvasSrc;
+        setTimeout(() => {
+          isLoading.value = false;
+        }, 200);
+      });
+    };
+    const initImage = () => {
+      const imageObject = createImage(() => {
+        drawBlock();
+        let { canvasWidth, canvasHeight, blockX: blockX2, blockY: blockY2, blockRadius, blockWidth: blockWidth2 } = this;
+        canvasCtx.value.drawImage(image, 0, 0, canvasWidth, canvasHeight);
+        blockCtx.value.drawImage(image, 0, 0, canvasWidth, canvasHeight);
+        let yAxle = blockY2 - blockRadius * 2;
+        let ImageData = blockCtx.value.getImageData(blockX2, yAxle, blockWidth2, blockWidth2);
+        block.value.width = blockWidth2;
+        blockCtx.value.putImageData(ImageData, 0, yAxle);
+        isLoading.value = false;
+        key.value = "loyer";
+      });
+      image.value = imageObject;
+    };
+    const createImage = (onload) => {
+      const image2 = document.createElement("img");
+      image2.crossOrigin = "Anonymous";
+      image2.onload = onload;
+      image2.onerror = () => {
+        image2.src = `${getBaseUrl()}/img/slider-captcha/pic-0.jpeg`;
+      };
+      image2.src = getImageSrc();
+      return image2;
+    };
+    const getImageSrc = () => {
+      const len = props.imageList.length;
+      return len > 0 ? props.imageList[getNonceByRange(0, len)] : `https://loyer.wang/view/ftp/wallpaper/${getNonceByRange(1, 1e3)}.jpg`;
+    };
+    const getNonceByRange = (start, end) => {
+      return Math.round(Math.random() * (end - start) + start);
+    };
+    const drawBlock = () => {
+      blockX.value = getNonceByRange(blockWidth.value + 10, props.canvasWidth - (blockWidth.value + 10));
+      blockY.value = getNonceByRange(10 + props.blockRadius * 2, props.canvasHeight - (blockWidth.value + 10));
+      draw(canvasCtx.value, "fill");
+      draw(blockCtx.value, "clip");
+    };
+    const draw = (ctx, operation) => {
+      const PI = Math.PI;
+      let { blockX: x, blockY: y, blockLength: l, blockRadius: r } = this;
+      ctx.beginPath();
+      ctx.moveTo(x, y);
+      ctx.arc(x + l / 2, y - r + 2, r, 0.72 * PI, 2.26 * PI);
+      ctx.lineTo(x + l, y);
+      ctx.arc(x + l + r - 2, y + l / 2, r, 1.21 * PI, 2.78 * PI);
+      ctx.lineTo(x + l, y + l);
+      ctx.lineTo(x, y + l);
+      ctx.arc(x + r - 2, y + l / 2, r + 0.4, 2.76 * PI, 1.24 * PI, true);
+      ctx.lineTo(x, y);
+      ctx.lineWidth = 2;
+      ctx.fillStyle = "rgba(255, 255, 255, 0.9)";
+      ctx.strokeStyle = "rgba(255, 255, 255, 0.9)";
+      ctx.stroke();
+      ctx[operation]();
+      ctx.globalCompositeOperation = "destination-over";
+    };
+    const bindEvents = () => {
+      var _a, _b, _c;
+      (_a = document.getElementById("slider-button")) == null ? void 0 : _a.addEventListener("mousedown", (event) => {
+        startEvent(event.clientX, event.clientY);
+        updateSliderButtonImage("slide");
+      });
+      document.addEventListener("mousemove", (event) => {
+        moveEvent(event.clientX, event.clientY);
+      });
+      document.addEventListener("mouseup", (event) => {
+        endEvent(event.clientX);
+      });
+      (_b = document.getElementById("slider-button")) == null ? void 0 : _b.addEventListener("click", (event) => {
+        updateSliderButtonImage("init");
+      });
+      (_c = document.getElementById("slider-button")) == null ? void 0 : _c.addEventListener("touchstart", (event) => {
+        startEvent(event.changedTouches[0].pageX, event.changedTouches[0].pageY);
+      });
+      document.addEventListener("touchmove", (event) => {
+        moveEvent(event.changedTouches[0].pageX, event.changedTouches[0].pageY);
+      });
+      document.addEventListener("touchend", (event) => {
+        endEvent(event.changedTouches[0].pageX);
+      });
+    };
+    const updateSliderButtonImage = (type) => {
+      if (type == "init") {
+        isSliderSlide.value = false;
+      } else if (type == "slide") {
+        isSliderSlide.value = true;
+      }
+    };
+    const checkImgSrc = () => {
+      if (isFrontCheck.value) {
+        return true;
+      }
+      return !!canvas.value.src;
+    };
+    const startEvent = (clientX, clientY) => {
+      if (!checkImgSrc() || isLoading.value || verifySuccess.value) {
+        return;
+      }
+      originX.value = clientX;
+      originY.value = clientY;
+      isMouseDown.value = true;
+      timestamp.value = +/* @__PURE__ */ new Date();
+      updateSliderButtonImage("slide");
+    };
+    const moveEvent = (clientX, clientY) => {
+      if (!isMouseDown.value) {
+        return false;
+      }
+      const moveX = clientX - originX.value;
+      const moveY = clientY - originY.value;
+      if (moveX < 0 || moveX + 40 >= props.canvasWidth) {
+        return false;
+      }
+      sliderButtonLeft.value = moveX > props.canvasWidth - 56 ? props.canvasWidth - 56 : moveX;
+      let blockLeft = (props.canvasWidth - 40 - 20) / (props.canvasWidth - 40) * moveX;
+      block.value.style.left = (blockLeft > props.canvasWidth - 56 - 18 - 7 ? props.canvasWidth - 56 - 18 - 7 : blockLeft) + "px";
+      verifyActive.value = true;
+      sliderBoxWidth.value = moveX + 28;
+      dragDistanceList.value.push(moveY);
+    };
+    const endEvent = (clientX) => {
+      if (!isMouseDown.value) {
+        return false;
+      }
+      isMouseDown.value = false;
+      if (clientX === originX.value) {
+        return false;
+      }
+      isLoading.value = true;
+      verifyActive.value = false;
+      timestamp.value = +/* @__PURE__ */ new Date() - timestamp.value;
+      const moveLength = parseInt(block.value.style.left);
+      if (timestamp.value > 1e4) {
+        verifyFailEvent();
+      } else {
+        if (!turingTest()) {
+          verifyFailEvent();
+        } else {
+          if (isFrontCheck.value) {
+            const accuracyValue = props.accuracy <= 1 ? 1 : props.accuracy > 10 ? 10 : props.accuracy;
+            const spliced = Math.abs(moveLength - blockX.value) <= accuracyValue;
+            if (!spliced) {
+              verifyFailEvent();
+            } else {
+              emit("success", { key: key.value, value: moveLength });
+            }
+            return;
+          }
+          let params = {
+            key: key.value,
+            captcha: moveLength
+          };
+          http.get("/framework-api/standard/framework-captcha/validateSliderCaptcha", { params }).then((res) => {
+            emit("success", { key: key.value, value: moveLength });
+          }).catch(() => {
+            verifyFailEvent();
+          });
+        }
+      }
+      updateSliderButtonImage("init");
+    };
+    const turingTest = () => {
+      const arr = dragDistanceList.value;
+      const average = arr.reduce(calcSum) / arr.length;
+      const deviations = arr.map((x) => x - average);
+      const stdDev = Math.sqrt(deviations.map(calcSquare).reduce(calcSum) / arr.length);
+      return average !== stdDev;
+    };
+    const verifyFailEvent = () => {
+      verifyFail.value = true;
+      emit("fail", {});
+      refresh();
+    };
+    const refresh = () => {
+      setTimeout(() => {
+        verifyFail.value = false;
+      }, 300);
+      isLoading.value = true;
+      verifyActive.value = false;
+      verifySuccess.value = false;
+      block.value.style.left = 0;
+      sliderBoxWidth.value = 0;
+      sliderButtonLeft.value = 0;
+      vue.nextTick(() => {
+        if (isFrontCheck.value) {
+          let { canvasWidth, canvasHeight } = this;
+          canvasCtx.value.clearRect(0, 0, canvasWidth, canvasHeight);
+          blockCtx.value.clearRect(0, 0, canvasWidth, canvasHeight);
+          block.value.width = canvasWidth;
+          image.value.src = getImageSrc();
+        } else {
+          getCaptcha();
+        }
+      });
+    };
+    const close = () => {
+      emit("close");
+    };
+    const calcSum = (x, y) => {
+      return x + y;
+    };
+    const calcSquare = (x) => {
+      return x * x;
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("div", _hoisted_2, [
+          vue.createTextVNode(" 完成拼图验证 "),
+          vue.createElementVNode("div", {
+            onClick: refresh,
+            class: "slider-captcha-refresh-icon"
+          }, _hoisted_4),
+          vue.createElementVNode("div", {
+            onClick: close,
+            class: "slider-captcha-close-icon"
+          }, [
+            vue.createVNode(vue.unref(iconsVue.CircleClose))
+          ])
+        ]),
+        vue.createElementVNode("div", {
+          class: "slider-captcha",
+          style: vue.normalizeStyle({ width: _ctx.canvasWidth + "px" }),
+          onselectstart: "return false;"
+        }, [
+          isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", {
+            key: 0,
+            class: vue.normalizeClass({ "img-loading": isLoading.value }),
+            style: vue.normalizeStyle({ height: _ctx.canvasHeight + "px" })
+          }, null, 6)) : vue.createCommentVNode("", true),
+          verifySuccess.value ? (vue.openBlock(), vue.createElementBlock("div", {
+            key: 1,
+            class: "success-hint",
+            style: vue.normalizeStyle({ height: _ctx.canvasHeight + "px" })
+          }, vue.toDisplayString(successHint.value), 5)) : vue.createCommentVNode("", true),
+          isFrontCheck.value ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
+            vue.createElementVNode("canvas", {
+              ref_key: "canvas",
+              ref: canvas,
+              class: "slide-canvas",
+              width: _ctx.canvasWidth,
+              height: _ctx.canvasHeight
+            }, null, 8, _hoisted_5),
+            vue.createElementVNode("canvas", {
+              ref_key: "block",
+              ref: block,
+              class: "slide-block",
+              width: _ctx.canvasWidth,
+              height: _ctx.canvasHeight
+            }, null, 8, _hoisted_6)
+          ], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 3 }, [
+            vue.createElementVNode("img", {
+              ref_key: "canvas",
+              ref: canvas,
+              class: "slide-canvas",
+              width: _ctx.canvasWidth,
+              height: _ctx.canvasHeight
+            }, null, 8, _hoisted_7),
+            vue.createElementVNode("img", {
+              ref_key: "block",
+              ref: block,
+              class: vue.normalizeClass(["slide-block", { "verify-fail": verifyFail.value }])
+            }, null, 2)
+          ], 64)),
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(["slider", { "verify-active": verifyActive.value, "verify-success": verifySuccess.value, "verify-fail": verifyFail.value }])
+          }, [
+            vue.createElementVNode("div", {
+              class: "slider-box background-primary",
+              style: vue.normalizeStyle({ width: sliderBoxWidth.value + "px" })
+            }, [
+              vue.createElementVNode("div", {
+                class: "slider-button",
+                id: "slider-button",
+                style: vue.normalizeStyle({ left: sliderButtonLeft.value + "px" })
+              }, [
+                !isSliderSlide.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_9))
+              ], 4)
+            ], 4),
+            vue.createElementVNode("span", _hoisted_10, vue.toDisplayString(_ctx.sliderHint), 1)
+          ], 2)
+        ], 4)
+      ]);
+    };
+  }
+});
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const SliderCaptcha = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-894ffd06"]]);
+module.exports = SliderCaptcha;