移除验证码封装
This commit is contained in:
parent
f8978d2e44
commit
c01a762812
|
@ -1,123 +0,0 @@
|
||||||
<template>
|
|
||||||
<!-- 点击式按钮建议高度介于36px与46px -->
|
|
||||||
<div id="vaptchaContainer" style="width: 300px;height: 36px;">
|
|
||||||
<!--vaptcha-container是用来引入VAPTCHA的容器,下面代码为预加载动画,仅供参考-->
|
|
||||||
<div class="vaptcha-init-main">
|
|
||||||
<div class="vaptcha-init-loading">
|
|
||||||
<a href="/" target="_blank">
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48px" height="60px" viewBox="0 0 24 30" style="enable-background: new 0 0 50 50; width: 14px; height: 14px; vertical-align: middle" xml:space="preserve">
|
|
||||||
<rect x="0" y="9.22656" width="4" height="12.5469" fill="#CCCCCC">
|
|
||||||
<animate attributeName="height" attributeType="XML" values="5;21;5" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
|
|
||||||
<animate attributeName="y" attributeType="XML" values="13; 5; 13" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
|
|
||||||
</rect>
|
|
||||||
<rect x="10" y="5.22656" width="4" height="20.5469" fill="#CCCCCC">
|
|
||||||
<animate attributeName="height" attributeType="XML" values="5;21;5" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
|
|
||||||
<animate attributeName="y" attributeType="XML" values="13; 5; 13" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
|
|
||||||
</rect>
|
|
||||||
<rect x="20" y="8.77344" width="4" height="13.4531" fill="#CCCCCC">
|
|
||||||
<animate attributeName="height" attributeType="XML" values="5;21;5" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
|
|
||||||
<animate attributeName="y" attributeType="XML" values="13; 5; 13" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
|
|
||||||
</rect>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
<span class="vaptcha-text">Vaptcha Initializing...</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
const extend = function (to, _from) {
|
|
||||||
for (const key in _from) {
|
|
||||||
to[key] = _from[key];
|
|
||||||
}
|
|
||||||
return to;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
type: {
|
|
||||||
type: String,
|
|
||||||
default: 'click'
|
|
||||||
},
|
|
||||||
scene: {
|
|
||||||
type: String,
|
|
||||||
default: ''
|
|
||||||
},
|
|
||||||
vpStyle: {
|
|
||||||
type: String,
|
|
||||||
default: 'dark'
|
|
||||||
},
|
|
||||||
color: {
|
|
||||||
type: String,
|
|
||||||
default: '#3C8AFF'
|
|
||||||
},
|
|
||||||
lang: {
|
|
||||||
type: String,
|
|
||||||
default: 'zh-CN'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
var config = extend({
|
|
||||||
vid: '6121123db849dfa2f02958c6',
|
|
||||||
container: this.$refs.vaptcha,
|
|
||||||
style: this.vpStyle
|
|
||||||
}, this.$props)
|
|
||||||
this.loadV2Script().then(() => {
|
|
||||||
window.vaptcha(config).then(obj => {
|
|
||||||
this.$emit('input', obj)
|
|
||||||
obj.render()
|
|
||||||
})
|
|
||||||
})
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
loadV2Script() {
|
|
||||||
if (typeof window.vaptcha === 'function') { //如果已经加载就直接放回
|
|
||||||
return Promise.resolve()
|
|
||||||
} else {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
var script = document.createElement('script')
|
|
||||||
script.src = 'https://v-cn.vaptcha.com/v3.js'
|
|
||||||
script.async = true
|
|
||||||
script.onload = script.onreadystatechange = function () {
|
|
||||||
if (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete') {
|
|
||||||
resolve()
|
|
||||||
script.onload = script.onreadystatechange = null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
document.getElementsByTagName("head")[0].appendChild(script)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.vaptcha-init-main {
|
|
||||||
display: table;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background-color: #eeeeee;
|
|
||||||
}
|
|
||||||
.vaptcha-init-loading {
|
|
||||||
display: table-cell;
|
|
||||||
vertical-align: middle;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.vaptcha-init-loading > a {
|
|
||||||
display: inline-block;
|
|
||||||
width: 18px;
|
|
||||||
height: 18px;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.vaptcha-init-loading .vaptcha-text {
|
|
||||||
font-family: sans-serif;
|
|
||||||
font-size: 12px;
|
|
||||||
color: #cccccc;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
</style>
|
|
Loading…
Reference in New Issue