12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152 |
- <template>
- <div class="verify-content">
- <slide-verify
- ref="block"
- :slider-text="sliderText"
- @again="onAgain"
- @success="onSuccess"
- @fail="onFail"
- @refresh="onRefresh"
- ></slide-verify>
- </div>
- </template>
- <script lang="ts" setup>
- import { ref, computed } from "vue";
- import SlideVerify from "vue3-slide-verify";
- import type { SlideVerifyInstance } from "vue3-slide-verify";
- import { getCurLanguage } from "@/composables/common.js";
- import "vue3-slide-verify/dist/style.css";
- const block = ref<SlideVerifyInstance>();
- const L = getCurLanguage();
- const sliderText = computed(() => L["向右滑动"])
- const onSuccess = () => {
- // TODO: 根据权限跳转
- };
- const onFail = () => {};
- const onRefresh = () => {
- block.value?.refresh();
- };
- const onAgain = () => {
- // 刷新
- block.value?.refresh();
- };
- </script>
- <style lang="scss" scoped>
- .verify-content {
- position: relative;
- overflow: hidden;
- height: 100%;
- .slide-verify {
- // width: 100% !important;
- }
- }
- </style>
|