Browse Source

no message

zpj 10 months ago
parent
commit
b8549116d7

+ 24 - 1
src/assets/css/common.css

@@ -5,6 +5,12 @@
 .box-sizing-border-box{
 	box-sizing: border-box;
 }
+.row-wrap{
+	flex-flow: row wrap;
+}
+.flex-1{
+	flex: 1;
+}
 .dis-flex{
 	display: flex;
 }
@@ -84,6 +90,9 @@
 .fs-34{
 	font-size: 34px;
 }
+.fs-42{
+	font-size: 42px;
+}
 
 .p-15-20{
 	padding: 15px 15px;
@@ -97,12 +106,18 @@
 .plr-220{
 	padding: 0 220px;
 }
+.plr-314{
+	padding: 0 314px;
+}
 .plr-24{
 	padding: 0 24px;
 }
 .plr-50{
 	padding: 0 50px;
 }
+.ptb-8{
+	padding: 8px 0;
+}
 
 
 .mr-38{
@@ -120,12 +135,18 @@
 .mt-60{
 	margin-top: 60px;
 }
+.mt-40{
+	margin-top: 40px;
+}
 .mt-30{
 	margin-top: 30px;
 }
 .mt-20{
 	margin-top: 20px;
 }
+.mt-16{
+	margin-top: 16px;
+}
 .mb-32{
 	margin-bottom: 32px;
 }
@@ -163,7 +184,9 @@
 	margin-bottom: 60px;
 }
 
-
+.lh-26{
+	line-height: 26px;
+}
 .lh-20{
 	line-height: 20px;
 }

BIN
src/assets/img/home/3-1.png


BIN
src/assets/img/home/3-2.png


+ 18 - 2
src/components/Forestage/Navigation.vue

@@ -8,8 +8,12 @@
       </div>
 
       <div class="align-items-center">
-        <div @click="navClick(1)" class="fs-16 mr-38 fc-f hand-cursor" :class="{active:navActive === 1}">{{$t('Home')}}{{navActive}}</div>
+        <div @click="navClick(1)" class="fs-16 mr-38 fc-f hand-cursor" :class="{active:navActive === 1}">{{$t('Home')}}</div>
         <div @click="navClick(2)" class="fs-16 mr-38 fc-f hand-cursor" :class="{active:navActive === 2}">{{$t('Tourism')}}</div>
+        <div @click="navClick(3)" class="fs-16 mr-38 fc-f hand-cursor" :class="{active:navActive === 3}">团队</div>
+        <div @click="navClick(4)" class="fs-16 mr-38 fc-f hand-cursor" :class="{active:navActive === 4}">充值</div>
+        <div @click="navClick(5)" class="fs-16 mr-38 fc-f hand-cursor" :class="{active:navActive === 5}">提款</div>
+        <div @click="navClick(6)" class="fs-16 mr-38 fc-f hand-cursor" :class="{active:navActive === 6}">我的账户</div>
 
         <div class="align-items-center mr-38 lang-pop-f hand-cursor" v-click-outside="clickOutside">
           <div class="fs-16 fc-f " @click="open()">{{langText}}</div>
@@ -85,6 +89,18 @@ export default {
         case 2:
           this.$router.push({ path: '/Tourism' })
           break
+        case 3:
+          this.$router.push({ path: '/Team' })
+          break
+        case 4:
+          this.$router.push({ path: '/Recharge' })
+          break
+        case 5:
+          this.$router.push({ path: '/Draw' })
+          break
+        case 6:
+          this.$router.push({ path: '/Me' })
+          break
       }
     },
     open () {
@@ -110,7 +126,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped> 
+<style lang="scss" scoped>
 .nav-container {
   position: fixed;
   top: 0;

+ 20 - 0
src/router/front.js

@@ -15,6 +15,26 @@ export default [
         name: 'Tourism',
         component: () => import('@/views/Forestage/Tourism/index.vue')
       },
+      {
+        path: '/Team',
+        name: 'Team',
+        component: () => import('@/views/Forestage/Team/index.vue')
+      },
+      {
+        path: '/Recharge',
+        name: 'Recharge',
+        component: () => import('@/views/Forestage/Recharge/index.vue')
+      },
+      {
+        path: '/Draw',
+        name: 'Draw',
+        component: () => import('@/views/Forestage/Draw/index.vue')
+      },
+      {
+        path: '/Me',
+        name: 'Me',
+        component: () => import('@/views/Forestage/Me/index.vue')
+      },
     ]
   }
 ]

+ 2 - 3
src/utils/routerEach.js

@@ -2,7 +2,7 @@ import router from '../router/index.js'
 import store from '@/store'
 
 
-const routeList = ['/Home','/Tourism']
+const routeList = ['/Home','/Tourism','/Team','/Recharge','/Draw','/Me']
 router.beforeEach((to, from, next) => {
   let userToken = window.localStorage.getItem('userToken')
   if (userToken) {
@@ -10,10 +10,10 @@ router.beforeEach((to, from, next) => {
     if (active > -1) {
       active++
     }
-    console.log(active);
     store.commit('user/setNavActive', active)
     next()
   } else {
+    store.commit('user/setNavActive', 1)
     if (to.path == '/Home'||to.path == '/login'||to.path == '/register'||to.path == '/forget-password') {
       next()
     } else {
@@ -21,4 +21,3 @@ router.beforeEach((to, from, next) => {
     }
   }
 })
- 

+ 16 - 0
src/views/Forestage/Draw/index.vue

@@ -0,0 +1,16 @@
+<template>
+  <!-- 提款 -->
+  <div>
+
+  </div>
+</template>
+
+<script>
+  export default {
+    
+  }
+</script>
+
+<style scoped>
+
+</style>

+ 88 - 4
src/views/Forestage/Home/index.vue

@@ -6,7 +6,7 @@
             <div class="fs-34 fc-f fw-500 mb-12">全球商户中心互联网平台</div>
             <div class="fs-14 fc-f fw-400 mb-40">预订门票和浏览全球热门旅行景点</div>
             <div class="box-1 text-align-center fs-16 mb-12 hand-cursor" @click="toLogin()">登录</div>
-            <div class="box-2 text-align-center fs-16 hand-cursor" @click="toRegister()">注册</div>
+            <div class="box-2 text-align-center fs-16 hand-cursor" @click="register()">注册</div>
         </div>
     </div>
 
@@ -69,11 +69,63 @@
 
     <div class="index-bg-4 box-sizing-border-box pt-60">
       <div class="fs-30 mb-18 text-align-center mb-12">关于我们的工作模式</div>
-      <div class="fs-30 mb-18 text-align-center mb-12 mb-44">全球商户中心拥有非常重要的桥梁作用,为人们提供了一个有效而便捷的创业和推广业务平台,我们实现了让互联网经济快速增长。</div>
+      <div class="fs-14 mb-18 text-align-center mb-12 mb-60">全球商户中心拥有非常重要的桥梁作用,为人们提供了一个有效而便捷的创业和推广业务平台,我们实现了让互联网经济快速增长。</div>
+
+      <div class="justify-content-space-between box-sizing-border-box plr-220">
+        <div class="img-3">
+            <img class="img-3 mb-32" src="@/assets/img/home/3-1.png" alt="">
+            <div class="fs-16 lh-20">
+              我们的平台由全球许多商家共同监督经营,总投资资产超过100亿美元,其中包含企业保证金和用户可以得到的收益资金,资金由全球商家提供并用于景点广告推广。我们做到了互联网经济体系的双赢局面,促进旅游行业的发展和国家旅行经济体系的发展,互联网模式将越来越好,为人们带来便捷和有效的工作方式!
+            </div>
+        </div>
+        <div class="img-3">
+            <img class="img-3 mb-32" src="@/assets/img/home/3-2.png" alt="">
+            <div class="fs-16 lh-20">
+              我们将全球受欢迎的景点添加到GMC旅行计划中,选择你最喜欢的景点去支持他们。用户每天可以订票5次,根据订票不同景点门票会获得不同收益,这取决于不同商家投放广告资金的规则。用户订票成功后,商家会立即返还票价金额和百分比收益。
+            </div>
+        </div>
+      </div>
     </div>
 
-    <div class="index-bg-5">
+    <div class="index-bg-5 box-sizing-border-box pt-60">
+      <div class="fs-30 mb-18 text-align-center mb-12">互联网团队生意模式</div>
+      <div class="fs-14 mb-18 text-align-center mb-12 mb-60 plr-314 lh-20">通过你的邀请码加入GMC的用户将自动成为你的团队成员,你最多可以得到5个层级的团队成员,当你的团队成员得到收益时,你能从他们的收益中再次得到一部分额外的团队收益。</div>
+
 
+      <div class=" align-items-center box-sizing-border-box plr-220 mb-5">
+        <div class="">
+          <div class="num-box mb-10">1</div>
+          <div class="fs-14 fw-b">Lv.A</div>
+        </div>
+        <div class="num-xian"></div>
+        <div class="">
+          <div class="num-box mb-10">2</div>
+          <div class="fs-14 fw-b">Lv.B</div>
+        </div>
+        <div class="num-xian"></div>
+        <div class="">
+          <div class="num-box mb-10">3</div>
+          <div class="fs-14 fw-b">Lv.C</div>
+        </div>
+        <div class="num-xian"></div>
+        <div class="">
+          <div class="num-box mb-10">4</div>
+          <div class="fs-14 fw-b">Lv.D</div>
+        </div>
+        <div class="num-xian"></div>
+        <div class="">
+          <div class="num-box mb-10">5</div>
+          <div class="fs-14 fw-b">Lv.E</div>
+        </div>
+      </div>
+
+      <div class=" align-items-center box-sizing-border-box plr-220">
+        <div class="text-1">通过你的邀请码注册的用户将成为你的A级团队成员,当你的A级团队成员得到收益时,你将获得额外团队收益,它会是你的A级团队成员收益的50%。</div>
+        <div class="text-1">通过你的邀请码注册的用户将成为你的A级团队成员,当你的A级团队成员得到收益时,你将获得额外团队收益,它会是你的A级团队成员收益的50%。</div>
+        <div class="text-1">通过你的邀请码注册的用户将成为你的A级团队成员,当你的A级团队成员得到收益时,你将获得额外团队收益,它会是你的A级团队成员收益的50%。</div>
+        <div class="text-1">通过你的邀请码注册的用户将成为你的A级团队成员,当你的A级团队成员得到收益时,你将获得额外团队收益,它会是你的A级团队成员收益的50%。</div>
+        <div class="text-1">通过你的邀请码注册的用户将成为你的A级团队成员,当你的A级团队成员得到收益时,你将获得额外团队收益,它会是你的A级团队成员收益的50%。</div>
+      </div>
     </div>
   </div>
 </template>
@@ -93,7 +145,14 @@ export default {
   mounted() {
 
   },
-  methods: {},
+  methods: {
+    toLogin(){
+      this.$router.push("/login");
+    },
+    register(){
+      this.$router.push("/register");
+    },
+  },
 };
 </script>
 
@@ -155,12 +214,37 @@ export default {
       height: 700px;
       background: url(@/assets/img/home/index4.png) no-repeat;
       background-size: 100% 100%;
+      .img-3{
+        width: 490px;
+        height: 320px;
+      }
     }
     .index-bg-5{
       width: 100%;
       height: 557px;
       background: url(@/assets/img/home/index5.png) no-repeat;
       background-size: 100% 100%;
+      .num-box{
+        width: 48px;
+        height: 48px;
+        box-sizing: border-box;
+        border: 1px solid rgba(18, 18, 18, 1);
+        font-size: 20px;
+        font-weight: 900;
+        color: rgba(18, 18, 18, 10000);
+        text-align: center;
+        line-height: 48px;
+      }
+      .num-xian{
+        width: 100px;
+        border: 1px solid rgba(18, 18, 18, 1);
+        margin: 0 24px;
+      }
+      .text-1{
+        width: 145px;
+        line-height: 18px;
+        margin-right: 52px;
+      }
     }
   }
 </style>

+ 16 - 0
src/views/Forestage/Me/index.vue

@@ -0,0 +1,16 @@
+<template>
+  <!-- 我的账户 -->
+  <div>
+
+  </div>
+</template>
+
+<script>
+  export default {
+
+  }
+</script>
+
+<style scoped>
+
+</style>

+ 16 - 0
src/views/Forestage/Recharge/index.vue

@@ -0,0 +1,16 @@
+<template>
+  <!-- 充值 -->
+  <div>
+
+  </div>
+</template>
+
+<script>
+  export default {
+    
+  }
+</script>
+
+<style scoped>
+
+</style>

+ 16 - 0
src/views/Forestage/Team/index.vue

@@ -0,0 +1,16 @@
+<template>
+  <!-- 团队 -->
+  <div class="work-index">
+
+  </div>
+</template>
+
+<script>
+  export default {
+
+  }
+</script>
+
+<style scoped lang="scss">
+
+</style>

+ 79 - 5
src/views/Forestage/Tourism/index.vue

@@ -1,15 +1,89 @@
 <template>
-  <div>
-    旅游
+  <!-- 旅游 -->
+  <div class="tourism-box">
+    <div class="fs-42 fw-400 text-align-center mt-30 mb-18">旅行计划</div>
+    <div class="justify-content box-sizing-border-box plr-220  row-wrap">
+      <div class="class-item text-align-center fs-14 fw-500 box-sizing-border-box hand-cursor "
+      v-for="(item,i) in 17" :key="i" :class="classType==i?'s-class-item':''" @click="selectType(item,i)">中国</div>
+    </div>
+
+    <div class="box-sizing-border-box plr-220">
+      <div class="justify-content-space-between goods-box box-sizing-border-box mt-16" v-for="(item,i) in 11" :key="i">
+        <img class="item-img" src="@/assets/img/home/2-2.png" alt="">
+        <div class="flex-1 box-sizing-border-box ptb-8">
+          <div class="fs-24 fw-400 mb-10">郑王庙+泰服租聘</div>
+          <div class="fs-18 fw-400 lh-26 mb-12">郑王庙,始建于大城王朝,当时名皇冠寺,后改称昌寺。黎明寺位于泰国湄南河西岸的双子都市吞武里城,是泰国著名的寺庙,也是泰国王泰国湄南河西岸的双子都市吞武里城,是泰国著名的寺庙,也是泰国王家寺庙之一</div>
+          <div class="align-items-center">
+            <div class="b-buttom hand-cursor">$18</div>
+            <div class="b-buttom hand-cursor">Book ticket</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
   </div>
 </template>
 
 <script>
   export default {
-    
+    data(){
+      return{
+        backgroundImg:require('@/assets/img/home/2-2.png'),
+        classType:1,
+      }
+    },
+    methods:{
+      selectType(item,i){
+        if(this.classType!=i){
+          this.classType = i
+        }
+      },
+    },
   }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+  .tourism-box{
+    padding-top: 70px;
+    min-height: 100vh;
+    background: url('@/assets/img/login-bg.png');
 
-</style>
+    .class-item{
+      width: 68px;
+      height: 36px;
+      line-height: 38px;
+      opacity: 1;
+      border-radius: 2px;
+      border: 1px solid rgba(255, 255, 255, 1);
+      margin: 0 20px 18px 20px;
+      color: #fff;
+    }
+    .s-class-item{
+      background: rgba(199, 171, 123, 1) !important;
+      border: 1px solid rgba(199, 171, 123, 1) !important;
+      color: #121212;
+    }
+    .goods-box{
+      width: 100%;
+      min-height: 184px;
+      background: #E4F7F0FF;
+      padding: 12px 15px;
+    }
+    .item-img{
+      width: 220px;
+      height: 160px;
+      margin-right: 20px;
+    }
+    .b-buttom{
+      padding: 0 16px;
+      height: 34px;
+      opacity: 1;
+      border-radius: 2px;
+      background: #C7AB7BFF;
+      line-height: 36px;
+      color: #121212;
+      text-align: center;
+      margin-right: 10px;
+    }
+  }
+</style>

+ 1 - 1
src/views/Forestage/login/login.vue

@@ -49,7 +49,7 @@
 
         login(this.fromData).then((res) => {
           if (res.code === 1) {
-            localStorage.setItem('token',res.data.token)
+            localStorage.setItem('userToken',res.data.token)
             this.$router.push('/')
           } else {
             tools.error(res.msg)

+ 2 - 1
src/views/Forestage/login/register.vue

@@ -103,7 +103,8 @@
     align-items: center;
     .login-input{
       width: 500px;
-      height: 456px;
+      min-height: 456px;
+      padding-bottom: 30px;
       opacity: 1;
       background: rgba(255, 255, 255, 0.6);
       margin: auto;