空头池 可提现

H5/package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint"
+    "lint": "eslint --fix --ext .js,.vue src"
   },
   "dependencies": {
     "amfe-flexible": "^2.2.1",

H5/src/components/BaseNavBar.vue

@@ -28,3 +28,17 @@ export default {
   }
 };
 </script>
+<style>
+.van-nav-bar__content .van-nav-bar__title{
+  font-family: PingFang-SC-Bold;
+	font-size: 20px;
+	font-weight: normal;
+	font-stretch: normal;
+	line-height: 20px;
+	color: #333333;
+}
+.van-nav-bar__content  .van-nav-bar__left .van-icon{
+  color: #333333;
+  font-size: 20px;
+}
+</style>

H5/src/router/index.js

@@ -99,7 +99,19 @@ const routes = [
     name: "LeagueNums",
     component: () => import("@/views/leagueNums"),
     meta: { title: "团员总人数", noNav: true }
-  }
+  },
+  {
+    path: "/canCashOut",
+    name: "CanCashOut",
+    component: () => import("@/views/canCashOut"),
+    meta: { title: "可提现", noNav: true }
+  },
+  {
+    path: "/airDrop",
+    name: "AirDrop",
+    component: () => import("@/views/airDropPool"),
+    meta: { title: "空投池", noNav: true }
+  },
 ];
 
 const router = new VueRouter({

H5/src/views/airDropPool.vue

+<template>
+  <div class="air-drop-pool">
+    <div class="nav">
+      <van-icon
+        name="arrow-left"
+        size="20"
+        class="nav-left"
+        @click="$router.go(-1)"
+      />
+      <span class="nav-title">空投池</span>
+    </div>
+    <div class="air-panel-box">
+        <div class="air-panel">
+            <div class="notice-bar">
+                <img src="@/assets/images/icon-notice.png" alt="">
+                <div class="notice-bar-show">
+                    <p class="dark">88888888888</p>
+                    <p>88888888888</p>
+                    <p class="dark">88888888888</p>
+                    <p>88888888888</p> 
+                    <p>88888888888</p>
+                    <p>88888888888</p>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="air-panel-num">
+        <div class="air-panel-num-content">
+            <img src="@/assets/images/parachute.png" alt="">
+            <p>本月<span>{{personNum}}</span> 人在池</p>
+        </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "leagueNums",
+  data() {
+    return {
+        personNum:108
+    }
+  },
+  mounted:{
+
+  },
+  methods: {
+
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+$white: #ffffff;
+.air-drop-pool{
+  width: 100%;
+  height: 100vh;
+  background-image: url("../assets/images/空投池背景.png");
+  background-size: cover;
+  .nav {
+    position: relative;
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 46px;
+    color: #333333;
+    .nav-left {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      width: 52px;
+      height: 100%;
+      line-height: 46px;
+      text-align: center;
+    }
+    .nav-title {
+      max-width: 60%;
+      margin: 0 auto;
+      font-weight: bold;
+      font-size: 16px;
+    }
+  }
+  .air-panel-box{
+      padding: 25px 15px 0px 15px;
+      box-sizing: border-box;
+      .air-panel{
+	    height:110px;
+	    background-color: #ffffff;
+	    box-shadow: 0px 2px 12px 0px 
+		rgba(6, 0, 1, 0.04);
+	    border-radius: 4px;
+      }
+  }
+  .air-panel-num{
+      padding: 10px 15px 15px 15px;
+      box-sizing: border-box;
+      height: calc(100vh - 220px );
+  }
+   .air-panel-num-content{
+        padding: 20px 15px;
+        height: 100%;
+        box-shadow: 0px 2px 12px 0px	rgba(6, 0, 1, 0.04);
+        border-radius: 4px;
+        background-size: cover;
+        background-color: #ffffff; 
+        img{
+           object-fit: contain;
+            width: 100%;
+            height: 100%;
+        }
+        p{
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            color: #333333;
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            transform: translate(-50%,-50%);
+            display: flex;
+            align-items: center;
+        }
+        span{
+            font-size: 32px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: -1px;
+            color: #333333;
+            margin: 0 20px;
+        }
+    }
+    .notice-bar{
+        height: 100%;
+        overflow: hidden;
+        display: flex;
+        align-items: center;
+        padding: 0 20px 0 50px;
+        img{
+            width: 16px;
+            margin-right: 15px;
+        }
+        .notice-bar-show{
+            height: 100%;
+            p{
+                font-size: 16px;
+                color: #333333;
+                height: 33.33%;
+                margin: 0;
+                padding: 0;
+                display: flex;
+                align-items: center;
+                color: #333;
+            }
+            .dark{
+                opacity: 0.4;
+            }
+        }
+    }
+}
+
+</style>

H5/src/views/canCashOut.vue

+<template>
+  <div class="can-cash-out">
+    <div class="nav">
+      <van-icon
+        name="arrow-left"
+        size="20"
+        class="nav-left"
+        @click="$router.go(-1)"
+      />
+      <span class="nav-title">可提现</span>
+    </div>
+    <div class="cash-panel-nums">
+        <div class="cash-panel">
+            <div class="cash-nums">
+                <span class="cash-num">{{preNum}}</span>
+                <span class="cash-label">上月未提</span>
+            </div>
+            <div class="cash-nums">
+              <span class="cash-num">{{currentNum}}</span>
+              <span class="cash-label">本月可提</span>
+             </div>
+        </div>
+    </div>
+    <div class="cash-rules">
+        <div class="cash-rule-content">
+            <p>{{rules}}</p>
+        </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "leagueNums",
+  data() {
+    return {
+     preNum:'125',
+     currentNum:'325',
+     rules:'提现规则：这是一条规则，这是一条规则，这是一条规则，这是一条规则这是一条规则这是一条规则这是一条规则。'
+    }
+  },
+  methods: {}
+};
+</script>
+
+<style lang="scss" scoped>
+$white: #ffffff;
+.can-cash-out{
+  width: 100%;
+  height: 298px;
+  background-image: url("../assets/images/森林状态.png");
+  background-size: cover;
+  .nav {
+    position: relative;
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 46px;
+    color: #fff;
+    .nav-left {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      width: 52px;
+      height: 100%;
+      line-height: 46px;
+      text-align: center;
+    }
+    .nav-title {
+      max-width: 60%;
+      margin: 0 auto;
+      font-weight: bold;
+      font-size: 16px;
+    }
+  }
+  .cash-panel-nums{
+      padding: 25px 15px 0px 15px;
+      box-sizing: border-box;
+      .cash-panel{
+	    height:98px;
+	    background-color: #ffffff;
+	    box-shadow: 0px 2px 12px 0px 
+		rgba(6, 0, 1, 0.04);
+	    border-radius: 4px;
+      }
+      .cash-nums{
+          width: 50%;
+          text-align: center;
+          display: inline-block;
+          padding: 22px 0;
+          position: relative;
+          &:first-child{
+              &::before{
+                  width: 1px;
+                  height: 50px;
+                  content: "";
+                  background-color: #eeeeee;
+                  position: absolute;
+                  right: 0;
+                  top: 50%;
+                  margin-top: -25px;  
+              }
+          }
+          span{
+              display: block;
+              &.cash-num{
+                font-size: 26px;
+                font-weight: normal;
+                font-stretch: normal;
+                line-height: 27px;
+                letter-spacing: 0px;
+                color: #333333;
+              }
+              &.cash-label{
+                   font-size: 14px;
+                    color: #666;
+                    line-height: 27px;
+              }
+              
+          }
+
+      }
+  }
+  .cash-rules{
+      padding: 10px 15px 15px 15px;
+      box-sizing: border-box;
+      height: calc(100vh - 220px );
+  }
+   .cash-rule-content{
+          background-color: #ffffff;
+          padding: 20px 15px;
+          height: 100%;
+          background-color: #ffffff;
+	     box-shadow: 0px 2px 12px 0px 
+		rgba(6, 0, 1, 0.04);
+	        border-radius: 4px;
+          p{
+            font-family: PingFang-SC-Regular;
+            font-size: 14px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 21px;
+            letter-spacing: 0px;
+            color: #666666;
+            text-indent: 2em;
+          }
+      }
+}
+
+</style>

H5/src/views/instructions.vue

@@ -2,18 +2,18 @@
   <div class="instructions">
     <div class="content">
       <p class="title">西田森APP用户协议</p>
-      <p style="text-align: left; text-indent: 24px">
-        <span style="font-size: 12px"
+    <p class="paragraph">
+        <span
           >请您仔细阅读以下条款，并确认您已完全理解本协议之规定，尤其是免除及限制责任的条款、知识产权条款、法律适用及争议解决条款。请您仔细阅读以下条款，并确认您已完全理解本协议之规定，尤其是免除及限制责任的条款、知识产权条款、法律适用及争议解决条款。
         </span>
       </p>
-      <p style="text-align: left; text-indent: 24px">
-        <span style="font-size: 12px">
+      <p class="paragraph">
+        <span>
           请您仔细阅读以下条款，并确认您已完全理解本协议之规定，尤其是免除及限制责任的条款、知识产权条款、法律适用及争议解决条款。请您仔细阅读以下条款，并确认您已完全理解本协议之规定，尤其是免除及限制责任的条款、知识产权条款、</span
         >
       </p>
-      <p style="text-align: left; text-indent: 24px">
-        <span style="font-size: 12px">
+       <p class="paragraph">
+        <span>
           法律适用及争议解决条款。请您仔细阅读以下条款，并确认您已完全理解本协议之规定，尤其是免除及限制责任的条款、知识产权条款、法律适用及争议解决条款。</span
         >
       </p>
@@ -35,10 +35,21 @@ export default {
     margin: 0;
   }
   .title {
-    margin: 10px auto;
-    text-align: center;
+    font-family: PingFang-SC-Bold;
     font-size: 16px;
-    font-weight: bold;
+    font-weight: normal;
+    font-stretch: normal;
+    line-height: 20px;
+    color: #333333;
+    text-align: center;
+    margin-bottom: 10px;
+  }
+  .paragraph{
+    font-family: PingFang-SC-Regular;
+    font-size: 13px;
+    color: #333;
+    line-height: 21px;
+    text-indent: 2em;
   }
   .content {
     box-sizing: border-box;

H5/src/views/settings.vue

@@ -18,7 +18,11 @@
         @click="fillInviterCode"
       />
       <van-cell is-link title="软件更新" value="版本v1.2" />
-      <van-cell is-link title="用户协议" />
+      <van-cell 
+      is-link 
+      title="用户协议" 
+
+      />
     </van-cell-group>
     <van-button size="large" class="logout-btn">退出登录</van-button>