增加图形验证码

src/api/member.js

@@ -145,6 +145,14 @@ class Member {
     static agent(data){
         return server.post('/agent/register',data)
     }
+
+    /**
+     * 注册gc验证码
+     * @param data {email,token}
+     */
+    static sendGCode() {
+        return server.get(`/register/Graph_che`);
+    }
 }
 
 export default Member;

src/index.html

@@ -13,14 +13,14 @@
         }
     </style>
     <script>
-        //H5移动版自适应跳转js
+        //H5 Mobile version adaptive jump js
     var mobileAgent = new Array("iphone", "ipod", "ipad", "android", "mini", "mobile", "mobi", "mqqbrowser", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "symbian", "wp7", "wp8", "lg", "ucweb", "skyfire");
     var browser = navigator.userAgent.toLowerCase();
     var _tag = "{$_GET['tag']}";
     if(_tag != 'web'){
         for (var i = 0; i < mobileAgent.length; i++) {
             if (browser.indexOf(mobileAgent[i]) != -1) {
-                //todo 手机版跳转
+                //todo Mobile version jump
                 window.location.href = 'https://app.cxisux.net';
                 break;
             }
@@ -33,21 +33,21 @@
         }
     </script>
     <!-- <link rel="stylesheet" href="assets/css/style.css"> -->
-    <!-- index嵌入资源不是打包插入的，可以在全局直接使用
+    <!-- index Embedded resources are not packaged and can be directly used globally
-        htmlWebpackPlugin模板支持ejs语法 -->
+        htmlWebpackPlugin Template support ejs syntax -->
 
-    <!-- 加载bootstrap样式文件 -->
+    <!-- loading bootstrap Style files -->
     <link rel="stylesheet" href="/static/css/bootstrap.min.css">
 
-    <!-- 加载ionicons样式文件 -->
+    <!-- loading ionicons Style files -->
     <link rel="stylesheet" href="/static/css/ionicons.min.css">
 
-    <!-- 加载jquery样式文件 -->
+    <!-- loading jquery Style files -->
     <link rel="stylesheet" href="/static/css/jquery.mCustomScrollbar.min.css">
 
     <script src="/static/Kline/charting_library/charting_library.min.js"></script>
 
-    <!-- 加载swiper -->
+    <!-- loading swiper -->
     <link rel="stylesheet" href="/static/libs/swiper-5.3.8/package/css/swiper.min.css">
     <script src="/static/libs/swiper-5.3.8/package/js/swiper.min.js"></script>
 </head>
@@ -70,7 +70,7 @@
     <script src="/static/libs/skroll.min.js"></script>
     <script src="https://www.cxisux.net/newlink/pako.min.js"></script>
     <script>
-        window.custom = "light"; // 默认主题
+        window.custom = "light"; // Default theme
         window.api_path = "<%= htmlWebpackPlugin.options.isProduct ? 'https://mgg.cxisux.net/api/sliderVerify' : 'https://mgg.cxisux.net/api/sliderVerify' %>";
         // window.api_path =  "<%= htmlWebpackPlugin.options.isProduct ? 'http://qkladmin2.ruanmeng.top/api/sliderVerify' : 'http://qkladmin2.ruanmeng.top/api/sliderVerify' %>";
         // window.ws_path = "<%= htmlWebpackPlugin.options.isProduct ? 'wss://guanli.coin.amatak.net/ws1' : 'wss://guanli.coin.amatak.net/ws1' %>";
@@ -78,7 +78,7 @@
 
         // window.ws_path = "<%= htmlWebpackPlugin.options.isProduct ? 'ws://qkladmin2.ruanmeng.top:2346' : 'ws://qkladmin2.ruanmeng.top:2346' %>";
 
-        // 修改页面主题
+        // Modify Page Theme
         function changeSightSense() {
             const body = document.body,
                 header = document.getElementById("common-header")
@@ -94,11 +94,11 @@
                 custom = "dark";
             }
 
-            // 重新加载tradingView
+            // RELOAD tradingView
             renderTV();
         }
 
-        // 窗口内容加载完毕 初始化tv
+        // The window content has been loaded and initialized tv
         window.onload = function () {
             // renderTV();
         };

src/views/signUp/index.vue

@@ -53,6 +53,12 @@
                             <label @click="showType('repwdType')"></label>
                         </div>
 
+                        <div class="form-group row password">
+                            <!-- 增加图形验证码 -->
+                            <input :type="txtType" id="gccode" v-model="user.gc_code" required placeholder="GraphicalVerification" class="form-control col-6" />
+                            <img class="col-6" :src="Graph_che" @click="gett_gc_code">
+                        </div>
+
                         <div class="form-group row">
                             <input type="text" class="form-control" :disabled="$route.query.invite_code?true:false" v-model="user.parentCode" :placeholder="`${$t('login.referrer')}`" />
                             <!-- （${$t('login.optional')}） -->
@@ -164,6 +170,7 @@ export default {
             current: 0,
             pwdType: "password",
             repwdType: "password",
+            txtType:"text",
 
             step: 1,
             registerType:1,
@@ -200,7 +207,8 @@ export default {
                 smsCode: null,
                 emailCode: null
             },
-
+            Graph_che:'', // gc code image
+            gc_key:'', // tuxiangyanzheng key
             codes: new Array(6)
         };
     },
@@ -255,6 +263,13 @@ export default {
                     );
                     return
                 }
+                // check gc code has fill
+                if(this.Graph_che==''){
+                    this.$message({
+                        type:"warning",
+                        message:"input gc code pls.",
+                    })
+                }
                 // 其他补充的验证
                 if (!this.isAgree) {
                     // 没有同意条款
@@ -306,7 +321,8 @@ export default {
                 case 1:
                     Member.sendEmailCode({
                         email: this.user.email,
-
+                        gc_code: this.user.gc_code,
+                        gc_key: this.gc_key,
                         token
                     })
                         .then(data => {
@@ -357,6 +373,18 @@ export default {
             window.frames["my-modal-body"].$captcha.sliderCaptcha("reset");
         },
 
+        // get gc code from api
+        gett_gc_code(){
+            console.log("dddddd")
+            Member.sendGCode().then( (res) =>{
+                this.gc_key = res.key
+                this.Graph_che = res.img
+                console.log("gc",res)
+            }).catch( err =>{
+                console.log(err)
+            });
+        },
+
         autofill($event) {
             let data = $event.clipboardData.getData("text/plain"),
                 val;
@@ -541,6 +569,9 @@ export default {
         window.md5 = md5;
         // 安全性验证成功时的回调函数
         window.step2Register = this.step2;
+
+        // bind get gc code
+        this.gett_gc_code();
     }
 };
 </script>