heyang 3 years ago
parent
commit
c65cd28936

+ 2 - 2
microserviceUserH5/static/js/vender/vue/api.js

@@ -70,9 +70,9 @@ function getStrategy(id) {
   })
 }
 //新用户使用激活码
-function getActivationCode(data,tagId,deviceId) {
+function getActivationCode(data,tagId,deviceId,captchaVerification) {
   return service({
-    url: `/api/public/v4/actFissionAward/getActivationCode?username=${data}&tagId=${tagId}&deviceId=${deviceId}`,
+    url: `/api/public/v4/actFissionAward/getActivationCode?username=${data}&tagId=${tagId}&deviceId=${deviceId}&captchaVerification=${captchaVerification}`,
     method: 'get',
 
   

+ 48 - 4
microserviceUserH5/vcloud/actFissionShare.html

@@ -9,6 +9,20 @@
     <link rel="stylesheet" href="../static/css/index.css">
     <link rel="stylesheet" href="../static/css/vant.css" />
     <script src="../static/js/vender/jquery-3.4.1.min.js"></script>
+    <link rel="stylesheet" href="../static/css/verify.css">
+	<link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css">
+	<script>
+		(function () {
+			if (!window.Promise) {
+				document.writeln('<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.min.js"><' + '/' + 'script>');
+			}
+		})();
+	</script>
+	<script src="../static/js/vender/toastr/toastr.min.js"></script>
+	<script src="../static/js/vender/config.js"></script>
+	<script src="../static/js/vender/crypto-js.js"></script>
+	<script src="../static/js/vender/ase.js"></script>
+	<script src="../static/js/vender/verify.js"></script>
     <!-- <script src="../static/js/vender/vue/vue.min.js"></script>
     <script src="../static/js/vender/vue/vant.min.js"></script>
     <script src="../static/js/vender/config.js"></script>
@@ -263,7 +277,9 @@
                         <p>激活码:</p>
                         <p>AS4*********SD3</p>
                     </div>
-                    <div class="button-download " @click='createCopy()'>点击复制并下载</div>
+                    <!-- @click='createCopy()' -->
+                    <div class="button-download " id="form-btn">点击复制并下载</div>
+                    <div id="mpanel2"></div>
                 </div>
             </div>
             <div class="top-banner">
@@ -312,6 +328,10 @@
         var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g
         var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
         var clipboard = new ClipboardJS('.copybtn') //此处为点击的dom的类名
+        var html = document.documentElement;
+		var imgWidth = html.getBoundingClientRect().width / 750 * 400 + 'px';
+		var imgHeight = html.getBoundingClientRect().width / 750 * 200 + 'px';
+		var barHeight = html.getBoundingClientRect().width / 750 * 70 + 'px';
         new Vue({
             el: '#app',
             data: {
@@ -340,6 +360,7 @@
                 //  document.querySelector('#app').classList.remove('hide');
                 this.getActDetail();
                 this.getMarquee(); //跑马灯
+                this.validate(); // 生成验证码
                 if (localStorage.getItem("uuid")) {
                     this.uuid = localStorage.getItem("uuid");
                 } else {
@@ -373,7 +394,7 @@
                         console.log(res)
                     })
                 },
-                createCopy() {
+                createCopy(captchaVerification) {
                     // this.$toast.loading({
                     //     duration: 0,
                     //     message: '加载中...',
@@ -385,7 +406,7 @@
                         }).then(res => {
 
                         })
-                        getActivationCode(this.username, this.tagId, this.uuid).then(res => {
+                        getActivationCode(this.username, this.tagId, this.uuid, captchaVerification).then(res => {
                             this.$toast.clear();
                             if (res.status === 0) {
                                 //此处为点击的dom的类名
@@ -460,13 +481,36 @@
                             }
                         }else {
                             this.$toast(res.msg);
-                                                                     }
+                        }
                         console.log(res)
                     }).catch((error) => {
                         console.log(error)
                         this.$toast('网络异常');
                     });
                 },
+                validate() {
+                    $('#mpanel2').slideVerify({
+                        baseUrl: baseUrl + '/api/user',  //服务器请求地址, 默认地址为安吉服务器;
+                        mode: 'pop',     //展示模式
+                        containerId: 'form-btn', //pop模式 必填 被点击之后出现行为验证码的元素id
+                        imgSize: { //图片的大小对象,有默认值{ width: '310px',height: '155px'},可省略
+                            width: imgWidth,
+                            height: imgHeight
+                        },
+                        barSize: {//下方滑块的大小对象,有默认值{ width: '310px',height: '50px'},可省略
+                            width: imgWidth,
+                            height: barHeight
+                        },
+                        beforeCheck: function () {
+                            
+                        },
+                        ready: function () { },  //加载完毕的回调
+                        success: function (params) { //成功的回调
+                            createCopy(params.captchaVerification);
+                        },
+                        error: function () {}
+                    });
+                },
                 copyUrl(actStatus) {
                     var oInput = document.createElement('input'); //创建一个input
                     oInput.setAttribute("readonly", "readonly"); //设置只读,否则移动端使用复制功能时可能会造成软件盘弹出