Browse Source

完善邀请

15954078560 3 years ago
parent
commit
357fe8e910

+ 4 - 4
application/api/controller/Index.php

@@ -201,8 +201,8 @@ class Index extends Api
      */
     public function getInviteImg() {
         // 获取用户的邀请码
-        $invitecode = \app\common\model\User::where(["id"=>$this->auth->id])->value("invite_no");
-
+//        $invitecode = \app\common\model\User::where(["id"=>$this->auth->id])->value("invite_no");
+        $invitecode = 'y0AnrH';
         // 文字图片合成
         $bigImgPath = httpurllocal('/assets/img/inviteimg.png');
         $img = imagecreatefrompng($bigImgPath);
@@ -218,9 +218,9 @@ class Index extends Api
         //旋转角度
         $circleSize = 0;
         //左边距
-        $left = 188;//383;
+        $left = 203;//383;
         //上边距
-        $top = 1088;//680;
+        $top = 1110;//680;
         imagefttext($img, $fontSize, $circleSize, $left, $top, $black, $font, $invitecode);
         $filename = date("YmdHis"). $this->auth->id . rand(10000, 99999) . ".jpeg";
         $path = "/uploads/qrcode/".$filename;

+ 116 - 74
application/index/view/index/invite.html

@@ -13,106 +13,148 @@
     <script>
         !(function(win, doc) {
             function setFontSize() {
-                var docEl = doc.documentElement;
-                var winWidth = docEl.clientWidth;
-                doc.documentElement.style.fontSize = (winWidth / 375) * 100 + "px";
+            var docEl = doc.documentElement;
+            var winWidth = docEl.clientWidth;
+            doc.documentElement.style.fontSize = (winWidth / 375) * 100 + "px";
             }
             var userAgent = navigator.userAgent;
             win.addEventListener("resize", function() {
-                if (navigator.userAgent !== userAgent) {
-                    location.reload();
-                }
+            if (navigator.userAgent !== userAgent) {
+                location.reload();
+            }
             });
             setFontSize();
         })(window, document);
     </script>
     <style>
         .page{
-            width: 100%;
-            height: 100vh;
-            background: url(__CDN__/assets/invite/bg.png) no-repeat center/cover;
-            background-size: 100% 100%;
+            width: 3.48rem;
+            height: 6.17rem;
             position: relative;
-
+            margin: 0 auto;
+            padding: 0.14rem;
+            background-color: #1D1A1B;
         }
-        .page  .invite-wrap{
+        .people-panel{
+           width: 3.20rem;
+           height: 5.35rem;
+           position: relative;
+           z-index: 2;
+           margin: 0 auto;
+        }
+        .people-panel .people-img{
+           width: 100%;
+           height: 100%;
+           position: relative;
+           object-fit: cover;
+        }
+        .people-panel::after{
+            content: '';
             position: absolute;
-            z-index: 2;
-            left:50%;
-            transform: translateX(-50%);
-            top:34%;
-            background-color: #FFEDAD;
-            border-radius: 0.10rem;
-            padding: 0.15rem;
-            width: 2rem;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100%;
+            background: rgba(0,0,0,.4);
         }
-        .page  .invite-wrap .title{
-            color:#333;
-            font-size: 0.15rem;
-            line-height: 0.20rem;
-            text-align: center;
-            font-weight: 700;
+        .girl-panel{
+            position: absolute;
+            z-index: 3;
+            width: 100%;
+            height: 100%;
+            left: 0;
+            top: 0;
+            padding-top: 0.42rem;
         }
-        .page  .invite-wrap .val{
-            margin-top: 0.10rem;
-            color:#333;
-            font-size: 0.15rem;
-            text-align: center;
-            line-height: 0.20rem;
+        .girl-panel .logo-img{
+            width: 1.41rem;
+            height: 0.44rem;
+            object-fit: cover;
         }
-        .btn-c{
-            margin: 0.20rem auto 0;
-            border-radius: 0.20rem;
-            width: 0.60rem;
-            height: 0.20rem;
-            line-height: 0.20rem;
-            text-align: center;
-            color:#fff;
-            font-size: 0.12rem;
-            background: #ED617F;
+        .girl-panel .girl-img{
+            width: 3.02rem;
+            height: 4.34rem;
+            object-fit: cover;
         }
-        .p-btn{
-            width: 2.5rem;
-            height: 0.30rem;
-            line-height: 0.30rem;
-            text-align: center;
-            color:#ED617F;
-            font-size: 0.14rem;
-            font-weight: 700;
-            border-radius: 0.10rem;
-            margin: 0.30rem auto;
+        .code-panel{
             position: absolute;
-            z-index: 2;
-            left: 50%;
-            transform: translateX(-50%);
-            top: 60%;
-            background-color: #FFEDAD;
-        }
-
+            z-index: 4;
+            width: 100%;
+            height: 1.60rem;
+            left: 0;
+            bottom: 0;
+            padding-top: 0.66rem;
+            background: url(__CDN__/assets/invite/imgs/bottom.png) no-repeat center/cover;
 
+        }
+        .code-panel .code-wrap{
+            width: 100%;
 
+        }
+        .code-panel .code-wrap .k{
+            font-size: 0.20rem;
+            font-family: PingFang SC;
+            font-weight: 500;
+            color: #FFEDAD;
+            margin-right: 0.10rem;
+        }
+        .code-panel .code-wrap .v{
+            font-size: 0.17rem;
+            font-family: PingFang SC;
+            font-weight: bold;
+            color: #E84B67;
+        }
+        .code-panel .btn-wrap{
+            margin:  0.20rem auto 0;
+            background: #FFEDAD;
+            border-radius: 0.13rem;
+            width: 1.30rem;
+            height: 0.25rem;
+            line-height: 0.25rem;
+            text-align: center;
+            font-size: 0.14rem;
+            font-family: PingFang SC;
+            font-weight: bold;
+            color: #E84B67;
+        }
+        body{
+            width: 100%;
+            height: 100vh;
+            background-color: #1D1A1B;
+        }
     </style>
 </head>
 
 <body>
-<div class="page">
-    <div class="invite-wrap">
-        <h1 class="title">邀请码</h1>
-        <p class="val">{$code}</p>
-        <div class="btn-c copy" data-clipboard-text="{$code}">复制</div>
+    <div class="page">
+        <div class="people-panel">
+            <img src="__CDN__/assets/invite/imgs/people.png" class="people-img"/>
+        </div>
+        <div class="girl-panel flex-col align-center">
+            <img src="__CDN__/assets/invite/imgs/logo.png" class="logo-img"/>
+            <img src="__CDN__/assets/invite/imgs/girl.png" class="girl-img">
+        </div>
+        <div class="code-panel">
+            <div class="code-wrap align-center justify-center">
+                <span class="k">邀请码</span>
+                <span class="v">{$code}</span>
+            </div>
+            <div class="btn-wrap copy" data-clipboard-text="{$code}">
+                复制并下载
+            </div>
+        </div>
     </div>
-    <a class="p-btn" href="{$site.apkUrl}">去下载</a>
-</div>
 </body>
 </html>
 <script>
-    var clipboard = new ClipboardJS('.copy');
-    clipboard.on('success', function(e) {
-        // console.log(e.text);
-        swal({icon: "success",text:'复制成功',closeOnClickOutside: true,buttons: false,timer: 3000});
-    });
+var clipboard = new ClipboardJS('.copy');
+clipboard.on('success', function(e) {
+    // console.log(e.text);
+    swal({icon: "success",text:'复制成功',closeOnClickOutside: true,buttons: false,timer: 3000});
+    window.location.href="{$site.apkUrl}"
+});
 
-    clipboard.on('error', function(e) {
-        swal({icon: "error",text:'复制失败',closeOnClickOutside: true,buttons: false,timer: 3000})
-    });
+clipboard.on('error', function(e) {
+    swal({icon: "error",text:'复制失败',closeOnClickOutside: true,buttons: false,timer: 3000})
+});
 </script>

+ 118 - 0
application/index/view/index/inviteyuan.html

@@ -0,0 +1,118 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="__CDN__/assets/invite/reset.css">
+    <!-- <link rel="stylesheet" href="__CDN__/assets/invite/sweetalert/sweetalert.css"> -->
+    <script src="__CDN__/assets/invite/sweetalert/sweetalert.js"></script>
+    <script src="__CDN__/assets/invite/clipboard/clipboard.min.js"></script>
+
+    <title>下载app</title>
+    <script>
+        !(function(win, doc) {
+            function setFontSize() {
+                var docEl = doc.documentElement;
+                var winWidth = docEl.clientWidth;
+                doc.documentElement.style.fontSize = (winWidth / 375) * 100 + "px";
+            }
+            var userAgent = navigator.userAgent;
+            win.addEventListener("resize", function() {
+                if (navigator.userAgent !== userAgent) {
+                    location.reload();
+                }
+            });
+            setFontSize();
+        })(window, document);
+    </script>
+    <style>
+        .page{
+            width: 100%;
+            height: 100vh;
+            background: url(__CDN__/assets/invite/bg.png) no-repeat center/cover;
+            background-size: 100% 100%;
+            position: relative;
+
+        }
+        .page  .invite-wrap{
+            position: absolute;
+            z-index: 2;
+            left:50%;
+            transform: translateX(-50%);
+            top:34%;
+            background-color: #FFEDAD;
+            border-radius: 0.10rem;
+            padding: 0.15rem;
+            width: 2rem;
+        }
+        .page  .invite-wrap .title{
+            color:#333;
+            font-size: 0.15rem;
+            line-height: 0.20rem;
+            text-align: center;
+            font-weight: 700;
+        }
+        .page  .invite-wrap .val{
+            margin-top: 0.10rem;
+            color:#333;
+            font-size: 0.15rem;
+            text-align: center;
+            line-height: 0.20rem;
+        }
+        .btn-c{
+            margin: 0.20rem auto 0;
+            border-radius: 0.20rem;
+            width: 0.60rem;
+            height: 0.20rem;
+            line-height: 0.20rem;
+            text-align: center;
+            color:#fff;
+            font-size: 0.12rem;
+            background: #ED617F;
+        }
+        .p-btn{
+            width: 2.5rem;
+            height: 0.30rem;
+            line-height: 0.30rem;
+            text-align: center;
+            color:#ED617F;
+            font-size: 0.14rem;
+            font-weight: 700;
+            border-radius: 0.10rem;
+            margin: 0.30rem auto;
+            position: absolute;
+            z-index: 2;
+            left: 50%;
+            transform: translateX(-50%);
+            top: 60%;
+            background-color: #FFEDAD;
+        }
+
+
+
+    </style>
+</head>
+
+<body>
+<div class="page">
+    <div class="invite-wrap">
+        <h1 class="title">邀请码</h1>
+        <p class="val">{$code}</p>
+        <div class="btn-c copy" data-clipboard-text="{$code}">复制</div>
+    </div>
+    <a class="p-btn" href="{$site.apkUrl}">去下载</a>
+</div>
+</body>
+</html>
+<script>
+    var clipboard = new ClipboardJS('.copy');
+    clipboard.on('success', function(e) {
+        // console.log(e.text);
+        swal({icon: "success",text:'复制成功',closeOnClickOutside: true,buttons: false,timer: 3000});
+    });
+
+    clipboard.on('error', function(e) {
+        swal({icon: "error",text:'复制失败',closeOnClickOutside: true,buttons: false,timer: 3000})
+    });
+</script>

BIN
public/assets/img/inviteimg.png


BIN
public/assets/invite/imgs/bottom.png


BIN
public/assets/invite/imgs/girl.png


BIN
public/assets/invite/imgs/logo.png


BIN
public/assets/invite/imgs/people.png