新增微信小程序引导页

src/router.js

@@ -19,6 +19,7 @@ import AmountDetail from './views/AmountDetail.vue'
 import PartakeChallenge from './views/PartakeChallenge.vue'
 import ChallengeDetail from './views/ChallengeDetail.vue'
 import HaveJoinedGame from './views/HaveJoinedGame.vue'
+import GoXCX from './views/GoXCX.vue'
 
 Vue.use(Router)
 
@@ -99,6 +100,11 @@ export default new Router({
       component: HaveJoinedGame
     },
     {
+      path: '/GoXCX',
+      name: 'GoXCX',
+      component: GoXCX
+    },
+    {
       path: '/MainPage',
       name: 'MainPage',
       component: MainPage,

src/views/GoXCX.vue

+<template>
+  <div class="go-xcx-page">
+    <Title @goback="goback" show_back="true" arrowColor="black"></Title>
+    <div class="page-banner">
+      <img class="bg" src="../images/GoXCX/bg_code.jpg">
+      <img class="qrcode" :src="qrcode">
+    </div>
+    <div class="tip-title">如何完成打卡？</div>
+    <div class="tip-content">1、识别上方二维码，打开「运动打卡」小程序</div>
+    <div class="tip-content">2、在小程序中授权获取每日微信运动步数</div>
+    <div class="tip-content">3、退出小程序中，返回打卡页面</div>
+    <div class="tip-content">4、成功获取每日微信运动步数，打卡成功</div>
+  </div>
+</template>
+
+<script>
+  import Title from "@/components/Title.vue";
+  export default {
+    name: "GoXCX",
+    components: {
+      Title,
+    },
+    data() {
+      return {
+        qrcode: '1231231231231'
+      };
+    },
+    methods: {
+      goback() {
+        history.go(-1);
+      },
+    }
+  }
+</script>
+<style lang="less" scoped>
+  .go-xcx-page {
+    width: 100%;
+    min-height: 100vh;
+    background: #F2F2F2;
+    .page-banner {
+      width: 100%;
+      height: 6.4rem;
+      position: relative;
+      .bg {
+        width: 100%;
+        height: 6.4rem;
+        display: block;
+      }
+      .qrcode {
+        width: 3.36rem;
+        height: 3.36rem;
+        background: #fff;
+        border-radius: 50%;
+        overflow: hidden;
+        position: absolute;
+        top: 1.82rem;
+        left: 50%;
+        transform: translateX(-50%);
+      }
+    }
+    .tip-title {
+      padding: 0 .4rem;
+      margin: .7rem 0 .32rem;
+      font-size: .3rem;
+      line-height: 1;
+      color: #333;
+    }
+    .tip-content {
+      padding: 0 .4rem;
+      font-size: .26rem;
+      line-height: .44rem;
+      color: #888;
+    }
+  }
+</style>
\ No newline at end of file

src/views/HaveJoinedGame.vue

@@ -67,7 +67,7 @@
         </div>
       </div>
     </div>
-    <div class="func-btn">提交今日步数</div>
+    <div class="func-btn" @click="goOtherPage('GoXCX')">提交今日步数</div>
   </div>
 </template>
 

src/views/SignUp.vue

@@ -237,7 +237,7 @@
     background-color: rgb(70, 88, 149);
     background-image: url(../images/SignUp/sy_beijing.png);
     background-repeat: no-repeat;
-    background-size: contain;
+    background-size: 100%;
     background-attachment: scroll;
     position: relative;
     display: flex;