'ui'

src/components/contact-btn/index.vue

@@ -0,0 +1,50 @@
+<template>
+  <view class="fixed-btn info-btn">
+    <button class="detail cu-btn block" @tap="navTo('/pages/contact/index')">
+      联系我们 <zd-arrow class="btn-arrow" :color="'#ffffff'"></zd-arrow>
+    </button>
+  </view>
+</template>
+
+<script>
+import ZdArrow from '@/components/zd-arrow/index';
+
+export default {
+  data() {
+   return {}
+  },
+  components: {
+    ZdArrow
+  },
+  methods: {
+    navTo(route) {
+      this.$mRouter.push({
+        route
+      })
+    }
+  }
+
+}
+</script>
+
+<style lang="scss" scoped>
+.fixed-btn {
+  position: fixed;
+  left: 50%;
+  bottom: 112upx;
+  transform: translateX(-50%);
+  .detail {
+    width: 532upx;
+    height: 80upx;
+    background: #1D2089;
+    border-radius: 40upx;
+    font-size: 32upx;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFFFFF;
+  }
+  .btn-arrow {
+    margin-left: 8upx;
+  }
+}
+</style>

src/components/zd-arrow/index.vue

@@ -1,14 +1,17 @@
 <template>
-  <view class="em-arrow">
-  </view>  
+  <view class="em-arrow" :style="{borderLeftColor: color}"></view>
 </template>
 
 <script>
 export default {
-  data() {
-    return {
-
+  props: {
+    color: {
+      type: String,
+      default: '#333333'
     }
+  },
+  data() {
+    return {}
   }
 }
 </script>

src/pages.json

@@ -40,6 +40,38 @@
 				"onReachBottomDistance": 50
 			}
 		},
+		{
+			"path": "pages/activity/index",
+			"style": {
+				"enablePullDownRefresh": false,
+				"navigationBarTitleText": "品牌活动",
+				"onReachBottomDistance": 50
+			}
+		},
+		{
+			"path": "pages/activity/detail",
+			"style": {
+				"enablePullDownRefresh": false,
+				"navigationBarTitleText": "品牌活动",
+				"onReachBottomDistance": 50
+			}
+		},
+		{
+			"path": "pages/join/index",
+			"style": {
+				"enablePullDownRefresh": false,
+				"navigationBarTitleText": "全国招商合作加盟",
+				"onReachBottomDistance": 50
+			}
+		},
+		{
+			"path": "pages/join/detail",
+			"style": {
+				"enablePullDownRefresh": false,
+				"navigationBarTitleText": "全国招商合作加盟",
+				"onReachBottomDistance": 50
+			}
+		},
 		{
 			"path": "pages/contact/index",
 			"style": {

src/pages/activity/component/communication.vue

@@ -0,0 +1,102 @@
+<template>
+  <view class="communication">
+    <view class="item" :style="{height: heightFarmat(item.height)}" v-for="(item, index) in imgList" :key="index">
+      <image :src="item.imgUrl" mode="aspectFill" />
+    </view>
+    <contact-btn></contact-btn>
+  </view>
+</template>
+
+<script>
+import ContactBtn from '@/components/contact-btn/index';
+
+export default {
+  data() {
+    return {
+      imgList: [
+        {
+          imgUrl: require('@/static/img/activity/communication_01.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/communication_02.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/communication_03.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/communication_04.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/communication_05.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/communication_06.png'),
+          height: 422
+        }
+      ]
+    }
+  },
+  computed: {
+    heightFarmat(val) {
+      return function(val) {
+        return uni.upx2px(val) + 'px';
+      }
+    }
+  },
+  components: {
+    ContactBtn
+  },
+  methods: {
+    navTo(route) {
+      this.$mRouter.push({
+        route
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.communication {
+  padding-bottom: 146upx;
+  background: #0D0D0D;
+  .item {
+    image {
+      width: 100%;
+      height: 100%;
+      vertical-align: middle;
+    }
+  }
+  .submit {
+    position: fixed;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 104upx;
+    width: 532upx;
+    height: 80upx;
+    background: #FFFFFF;
+    border-radius: 40upx;
+    border: 2upx solid #333333;
+    font-size: 32upx;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #333333;
+    line-height: 32upx;
+    em {
+      margin-left: 8px;
+      width: 0;
+      height: 0;
+      border-top: 8upx solid transparent;
+      border-right: 9upx solid transparent;
+      border-bottom: 8upx solid transparent;
+      border-left: 9upx solid transparent;
+      border-left-color: #333333 ;
+    }
+  }
+}
+</style>

src/pages/activity/component/grow.vue

@@ -0,0 +1,35 @@
+<template>
+  <view class='grow'>
+    <image class="image" src="/static/img/activity/grow_img.png" mode="aspectFill"/>
+    <contact-btn></contact-btn>
+  </view>
+</template>
+
+<script>
+import ContactBtn from '@/components/contact-btn/index';
+
+export default {
+  data() {
+    return {}
+  },
+  components: {
+    ContactBtn
+  },
+  onLoad() {},
+
+  onShow() {},
+
+  methods: {}
+
+}
+</script>
+
+<style lang="scss" scoped>
+.grow {
+  padding-bottom: 204upx;
+  .image {
+    width: 100%;
+    height: 1688upx;
+  }
+}
+</style>

src/pages/activity/component/thinking.vue

@@ -0,0 +1,107 @@
+<template>
+  <view class="thinking">
+    <view class="item" :style="{height: heightFarmat(item.height)}" v-for="(item, index) in imgList" :key="index">
+      <image :src="item.imgUrl" mode="aspectFill" />
+    </view>
+    <contact-btn></contact-btn>
+  </view>
+</template>
+
+<script>
+import ContactBtn from '@/components/contact-btn/index';
+
+export default {
+  data() {
+    return {
+      imgList: [
+        {
+          imgUrl: require('@/static/img/activity/thinking_01.png'),
+          height: 450
+        },
+        {
+          imgUrl: require('@/static/img/activity/thinking_02.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/thinking_03.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/thinking_04.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/thinking_05.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/thinking_06.png'),
+          height: 422
+        },
+        {
+          imgUrl: require('@/static/img/activity/thinking_07.png'),
+          height: 562
+        }
+      ]
+    }
+  },
+  computed: {
+    heightFarmat(val) {
+      return function(val) {
+        return uni.upx2px(val) + 'px';
+      }
+    }
+  },
+  components: {
+    ContactBtn
+  },
+  methods: {
+    navTo(route) {
+      this.$mRouter.push({
+        route
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.thinking {
+  padding-bottom: 200upx;
+  background: #EAF3FB;
+  .item {
+    image {
+      width: 100%;
+      height: 100%;
+      vertical-align: middle;
+    }
+  }
+  .submit {
+    position: fixed;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 104upx;
+    width: 532upx;
+    height: 80upx;
+    background: #FFFFFF;
+    border-radius: 40upx;
+    border: 2upx solid #333333;
+
+    font-size: 32upx;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #333333;
+    line-height: 32upx;
+    em {
+      margin-left: 8px;
+      width: 0;
+      height: 0;
+      border-top: 8upx solid transparent;
+      border-right: 9upx solid transparent;
+      border-bottom: 8upx solid transparent;
+      border-left: 9upx solid transparent;
+      border-left-color: #333333 ;
+    }
+  }
+}
+</style>

src/pages/activity/detail.vue

@@ -0,0 +1,65 @@
+<template>
+  <view class='detail'>
+    <component :is="componentType"></component>
+  </view>
+</template>
+
+<script>
+import ActivityThinking from './component/thinking';
+import ActivityCommunication from './component/communication';
+import ActivityGrow from './component/grow';
+export default {
+  data() {
+    return {
+      type: '1'
+    }
+  },
+  components: {
+    ActivityThinking,
+    ActivityCommunication,
+    ActivityGrow
+  },
+  computed: {
+    componentType() {
+      if (this.type == 1) {
+        return 'activity-thinking'
+      } else if (this.type == 2) {
+        return 'activity-communication'
+      } else if (this.type == 3) {
+        return 'activity-grow'
+      }
+      return ''
+    }
+  },
+
+  onLoad(options) {
+    this.type = options.type
+    let title = '思维能力挑战赛';
+    if (this.type == 1) {
+      title = '思维能力挑战赛'
+    } else if (this.type == 2) {
+      title = '培训交流'
+    } else if (this.type == 3) {
+      title = '逻辑狗伴我成长'
+    } else {
+      title = '思维能力挑战赛';
+    }
+    uni.setNavigationBarTitle({
+      title: title
+    });
+  },
+
+  onShow() {
+
+  },
+
+  methods: {
+
+  }
+
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
+

src/pages/activity/index.vue

@@ -0,0 +1,178 @@
+<template>
+  <view class="activity">
+    <view class="head">
+      <view class="head-top">
+        <image src="/static/img/common/bg_head.png" mode="" />
+      </view>
+      <view class="title">
+        <image class="img-title" src="/static/img/activity/head_title.png" mode="aspectFill" />
+      </view>
+    </view>
+    <view class="content">
+      <view class="item flex" 
+        v-for="(item, index) in omoList" :key="index"
+          :style="{backgroundImage: `url(${item.bgUrl})`,backgroundRepeat: 'no-repeat', backgroundSize: 'cover'}">
+        <view class="left">
+          <image :src="item.imgUrl" mode="aspectFill" />
+        </view>
+        <view class="right">
+          <view class="info-title">{{ item.title }}</view>
+          <view class="info-btn">
+            <button class="detail cu-btn block" @tap="navTo(item)">
+              查看详情 <zd-arrow class="btn-arrow"></zd-arrow>
+            </button>
+          </view>
+        </view>
+      </view>
+      <image class="book" src="/static/img/activity/drum.png" mode="aspectFill" />
+      <image class="teach" src="/static/img/common/teach.png" mode="aspectFill" />
+      <image class="path" src="/static/img/common/path1.png" mode="aspectFill" />
+    </view>
+  </view>
+</template>
+
+<script>
+import ZdArrow from '@/components/zd-arrow/index';
+
+export default {
+  data() {
+    return {
+      omoList: [
+        {
+          title: '思维能力挑战赛',
+          imgUrl: require('@/static/img/activity/activity_01.png'),
+          bgUrl: require('@/static/img/common/card_bg01.png'),
+          path: '/pages/activity/detail?type=1'
+        },
+        {
+          title: '培训交流',
+          imgUrl: require('@/static/img/activity/activity_02.png'),
+          bgUrl: require('@/static/img/common/card_bg02.png'),
+          path: '/pages/activity/detail?type=2'
+        },
+        {
+          title: '逻辑狗伴我成长',
+          imgUrl: require('@/static/img/activity/activity_03.png'),
+          bgUrl: require('@/static/img/common/card_bg03.png'),
+          path: '/pages/activity/detail?type=3'
+        }
+      ]
+    }
+  },
+  components: {
+    ZdArrow
+  },
+  onLoad() {
+    
+  },
+  created() {
+
+  },
+  mounted() {
+
+  },
+  methods: {
+    navTo(item) {
+      this.$mRouter.push({
+        route: item.path
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.activity {
+  background: url('@/static/img/common/bg.png') no-repeat #01A2E8;
+  background-size: cover;
+  height: 100vh;
+  overflow: hidden;
+  .head-top {
+    image {
+      width: 100%;
+      height: 100upx;
+    }
+  }
+  .title {
+    text-align: center;
+    .img-title {
+      width: 374upx;
+      height: 124upx;
+      vertical-align: middle;
+    }
+  }
+  .content {
+    position: relative;
+    margin: 118upx auto 0;
+    .item {
+      margin: 0 auto 28upx;
+      width: 714upx;
+      height: 262upx;
+      padding: 52upx 0 0 44upx;
+      .left {
+        margin-right: 56upx;
+        image {
+          width: 166upx;
+          height: 150upx;
+          vertical-align: middle;
+        }
+      }
+      .right {
+        padding-top: 8upx;
+        .info-title {
+          font-size: 40upx;
+          font-family: PingFangSC-Semibold, PingFang SC;
+          font-weight: 600;
+          color: #050505;
+          line-height: 56upx;
+          letter-spacing: 1upx;
+        }
+        .info-btn {
+          margin-top: 22upx;
+          .detail {
+            height: 56upx;
+            width: 228upx;
+            border-radius: 34upx;
+            border: 2upx solid #333333;
+            background: #FFFFFF;
+            font-size: 26upx;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
+            color: #04040A;
+            line-height: 36upx;
+          }
+          .btn-arrow {
+            margin-left: 8upx;
+          }
+        }
+      }
+    }
+    .book {
+      position: absolute;
+      width: 154upx;
+      height: 172upx;
+      vertical-align: middle;
+      left: 0px;
+      top: 4upx;
+      transform: translateY(-100%);
+    }
+    .path {
+      position: absolute;
+      bottom: -48upx;
+      right: 138upx;
+      width: 30upx;
+      height: 26upx;
+      vertical-align: middle;
+    }
+    .teach {
+      position: absolute;
+      width: 140upx;
+      height: 98upx;
+      vertical-align: middle;
+      right: 0upx;
+      top: 0upx;
+      transform: translateY(-100%);
+    }
+  }
+}
+</style>

src/pages/index/index.vue

@@ -2,6 +2,7 @@
   <view class="index">
     <view class="header">
       <image :src="headImg" mode="aspectFill" />
+      <image class="left" :src="decLeft" mode="aspectFill" />
     </view>
     <view class="flex flex-wrap content justify-between">
       <view v-for="(item, index) in list" :key="index">
@@ -27,6 +28,7 @@
     data() {
       return {
         headImg: require('@/static/img/index/index_heard.png'),
+        decLeft: require('@/static/img/index/index_dec_left.png'),
         list: [
           {
             title1: '全面了解', 
@@ -53,18 +55,21 @@
             title1: '品牌活动', 
             title2: '', 
             imgUrl: require('@/static/img/index/index_img4.png'),
-            bgUrl: require('@/static/img/index/index_card4.png')
+            bgUrl: require('@/static/img/index/index_card4.png'),
+            path: '/pages/activity/index'
           },
           {
             title1: '全国招商', 
             title2: '合作加盟', 
             imgUrl: require('@/static/img/index/index_img5.png'),
-            bgUrl: require('@/static/img/index/index_card5.png')
+            bgUrl: require('@/static/img/index/index_card5.png'),
+            path: '/pages/join/index'
           },
           {
             title1: '联系我们', 
             imgUrl: require('@/static/img/index/index_img6.png'),
-            bgUrl: require('@/static/img/index/index_card6.png')
+            bgUrl: require('@/static/img/index/index_card6.png'),
+            path: '/pages/contact/index'
           }
         ]
       }
@@ -82,11 +87,20 @@
 <style lang="scss">
 .index {
   .header {
+    position: relative;
     image {
       width: 100%;
       height: 566upx;
       vertical-align: middle;
     }
+    .left {
+      position: absolute;
+      left: 8upx;
+      bottom: -4px;
+      width: 48upx;
+      height: 52upx;
+      vertical-align: middle;
+    }
   }
   .content {
     padding: 4upx 36upx 0;

src/pages/join/component/game.vue

@@ -0,0 +1,35 @@
+<template>
+  <view class='mba'>
+    <image class="image" src="/static/img/join/game_01.png" mode="aspectFill"/>
+    <contact-btn></contact-btn>
+  </view>
+</template>
+
+<script>
+import ContactBtn from '@/components/contact-btn/index';
+
+export default {
+  data() {
+    return {}
+  },
+  components: {
+    ContactBtn
+  },
+  onLoad() {},
+
+  onShow() {},
+
+  methods: {}
+
+}
+</script>
+
+<style lang="scss" scoped>
+.mba {
+  padding-bottom: 102upx;
+  .image {
+    width: 100%;
+    height: 1716upx;
+  }
+}
+</style>

src/pages/join/component/hall.vue

@@ -0,0 +1,35 @@
+<template>
+  <view class='mba'>
+    <image class="image" src="/static/img/omo/mba_01.png" mode="aspectFill"/>
+    <contact-btn></contact-btn>
+  </view>
+</template>
+
+<script>
+import ContactBtn from '@/components/contact-btn/index';
+
+export default {
+  data() {
+    return {}
+  },
+  components: {
+    ContactBtn
+  },
+  onLoad() {},
+
+  onShow() {},
+
+  methods: {}
+
+}
+</script>
+
+<style lang="scss" scoped>
+.mba {
+  padding-bottom: 112upx;
+  .image {
+    width: 100%;
+    height: 1664upx;
+  }
+}
+</style>

src/pages/join/component/town.vue

@@ -0,0 +1,42 @@
+<template>
+  <view class='town'>
+    <image class="image image1" src="/static/img/join/town_01.png" mode="aspectFill"/>
+    <image class="image image2" src="/static/img/join/town_02.png" mode="aspectFill"/>
+    <contact-btn></contact-btn>
+  </view>
+</template>
+
+<script>
+import ContactBtn from '@/components/contact-btn/index';
+
+export default {
+  data() {
+    return {}
+  },
+  components: {
+    ContactBtn
+  },
+  onLoad() {},
+
+  onShow() {},
+
+  methods: {}
+
+}
+</script>
+
+<style lang="scss" scoped>
+.town {
+  padding-bottom: 200upx;
+  .image1 {
+    width: 100%;
+    height: 1052upx;
+    vertical-align: middle;
+  }
+  .image2 {
+    width: 100%;
+    height: 1052upx;
+    vertical-align: middle;
+  }
+}
+</style>

src/pages/join/detail.vue

@@ -0,0 +1,66 @@
+<template>
+  <view class='detail'>
+    <component :is="componentType"></component>
+  </view>
+</template>
+
+<script>
+import JoinHall from './component/hall';
+import JoinGame from './component/game';
+import JoinTown from './component/town';
+
+export default {
+  data() {
+    return {
+      type: '1'
+    }
+  },
+  components: {
+    JoinHall,
+    JoinGame,
+    JoinTown
+  },
+  computed: {
+    componentType() {
+      if (this.type == 1) {
+        return 'join-hall'
+      } else if (this.type == 2) {
+        return 'join-game'
+      } else if (this.type == 3) {
+        return 'join-town'
+      }
+      return ''
+    }
+  },
+
+  onLoad(options) {
+    this.type = options.type
+    let title = '思维能力挑战赛';
+    if (this.type == 1) {
+      title = '思维能力挑战赛'
+    } else if (this.type == 2) {
+      title = '培训交流'
+    } else if (this.type == 3) {
+      title = '逻辑狗伴我成长'
+    } else {
+      title = '思维能力挑战赛';
+    }
+    uni.setNavigationBarTitle({
+      title: title
+    });
+  },
+
+  onShow() {
+
+  },
+
+  methods: {
+
+  }
+
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
+

src/pages/join/index.vue

@@ -0,0 +1,185 @@
+<template>
+  <view class="join">
+    <view class="head">
+      <view class="head-top">
+        <image src="/static/img/common/bg_head.png" mode="" />
+      </view>
+      <view class="title">
+        <image class="img-title" src="/static/img/join/head_title.png" mode="aspectFill" />
+      </view>
+    </view>
+    <view class="content">
+      <view class="item flex" 
+        v-for="(item, index) in omoList" :key="index"
+          :style="{backgroundImage: `url(${item.bgUrl})`,backgroundRepeat: 'no-repeat', backgroundSize: 'cover'}">
+        <view class="left">
+          <image :src="item.imgUrl" mode="aspectFill" />
+        </view>
+        <view class="right">
+          <view class="info-title">{{ item.title }}</view>
+          <view class="info-title2" v-if="item.title2" >{{ item.title2 }}</view>
+          <view class="info-btn">
+            <button class="detail cu-btn block" @tap="navTo(item)">
+              查看详情 <zd-arrow class="btn-arrow"></zd-arrow>
+            </button>
+          </view>
+        </view>
+      </view>
+      <image class="book" src="/static/img/join/horn.png" mode="aspectFill" />
+      <image class="teach" src="/static/img/common/teach.png" mode="aspectFill" />
+      <image class="path" src="/static/img/common/path1.png" mode="aspectFill" />
+    </view>
+  </view>
+</template>
+
+<script>
+import ZdArrow from '@/components/zd-arrow/index';
+
+export default {
+  data() {
+    return {
+      omoList: [
+        {
+          title: '逻辑狗思维游戏',
+          title2: 'HOME&PLUS馆',
+          imgUrl: require('@/static/img/join/join_01.png'),
+          bgUrl: require('@/static/img/common/card_bg01.png'),
+          path: '/pages/join/detail?type=1'
+        },
+        {
+          title: '“思维芯”游戏室',
+          imgUrl: require('@/static/img/join/join_02.png'),
+          bgUrl: require('@/static/img/common/card_bg02.png'),
+          path: '/pages/join/detail?type=2'
+        },
+        {
+          title: '逻辑狗·探索小镇',
+          imgUrl: require('@/static/img/join/join_03.png'),
+          bgUrl: require('@/static/img/common/card_bg03.png'),
+          path: '/pages/join/detail?type=3'
+        }
+      ]
+    }
+  },
+  components: {
+    ZdArrow
+  },
+  onLoad() {
+    
+  },
+  created() {
+
+  },
+  mounted() {
+
+  },
+  methods: {
+    navTo(item) {
+      this.$mRouter.push({
+        route: item.path
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.join {
+  background: url('@/static/img/common/bg.png') no-repeat #01A2E8;
+  background-size: cover;
+  height: 100vh;
+  overflow: hidden;
+  .head-top {
+    image {
+      width: 100%;
+      height: 100upx;
+    }
+  }
+  .title {
+    text-align: center;
+    .img-title {
+      width: 374upx;
+      height: 124upx;
+      vertical-align: middle;
+    }
+  }
+  .content {
+    position: relative;
+    margin: 118upx auto 0;
+    .item {
+      margin: 0 auto 28upx;
+      width: 714upx;
+      height: 262upx;
+      padding: 52upx 0 0 44upx;
+      .left {
+        margin-right: 56upx;
+        image {
+          width: 166upx;
+          height: 150upx;
+          vertical-align: middle;
+        }
+      }
+      .right {
+        .info-title {
+          font-size: 40upx;
+          font-family: PingFangSC-Semibold, PingFang SC;
+          font-weight: 600;
+          color: #050505;
+          line-height: 56upx;
+          letter-spacing: 1upx;
+        }
+        .info-title2 {
+          font-size: 28upx;
+          line-height: 40upx;
+          color: #050505;
+          font-family: PingFangSC-Semibold, PingFang SC;
+        }
+        .info-btn {
+          margin-top: 22upx;
+          .detail {
+            height: 56upx;
+            width: 228upx;
+            border-radius: 34upx;
+            border: 2upx solid #333333;
+            background: #FFFFFF;
+            font-size: 26upx;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
+            color: #04040A;
+            line-height: 36upx;
+          }
+          .btn-arrow {
+            margin-left: 8upx;
+          }
+        }
+      }
+    }
+    .book {
+      position: absolute;
+      width: 154upx;
+      height: 172upx;
+      vertical-align: middle;
+      left: 0px;
+      top: 4upx;
+      transform: translateY(-100%);
+    }
+    .path {
+      position: absolute;
+      bottom: -48upx;
+      right: 138upx;
+      width: 30upx;
+      height: 26upx;
+      vertical-align: middle;
+    }
+    .teach {
+      position: absolute;
+      width: 140upx;
+      height: 98upx;
+      vertical-align: middle;
+      right: 0upx;
+      top: 0upx;
+      transform: translateY(-100%);
+    }
+  }
+}
+</style>

src/pages/omo/component/brand.vue

@@ -1,78 +1,26 @@
 <template>
-  <view class="course">
-    <view class="head">
-      <view class="head-top">
-        <image src="/static/img/course/bg_head.png" mode="" />
-      </view>
-      <view class="title">
-        <image class="img-title" src="/static/img/course/head_title.png" mode="aspectFill" />
-      </view>
-    </view>
+  <view class="brand">
+    <image class="image" src="/static/img/omo/brand_01.png" mode="aspectFill"/>
     <view class="content">
-      <view class="item" v-for="(item, index) in courseList" :key="index">
-        <view class="item-info flex">
-          <view class="left">
-            <image class="image" :src="item.imgUrl" mode="aspectFill" />
-          </view>
-          <view class="right">
-            <view class="info-title">{{ item.title }}</view>
-            <view class="info-desc">{{ item.desc }}</view>
-            <view class="info-btn">
-              <button class="detail cu-btn block" @tap="navTo(item)">
-                查看详情 <zd-arrow class="btn-arrow"></zd-arrow>
-              </button>
-            </view>
-          </view>
-        </view>
-        <view class="line" v-if="index + 1 != courseList.length"></view>
-      </view>
-      <image class="book" src="/static/img/course/book.png" mode="aspectFill" />
-      <image class="teach" src="/static/img/common/teach.png" mode="aspectFill" />
-      <image class="path" src="/static/img/common/path1.png" mode="aspectFill" />
+      <image class="right" src="/static/img/omo/right_dec.png" mode="aspectFill"/>
     </view>
+    <contact-btn></contact-btn>
   </view>
 </template>
 
 <script>
 import ZdArrow from '@/components/zd-arrow/index';
+import ContactBtn from '@/components/contact-btn/index';
 
 export default {
   data() {
     return {
-      courseList: [
-        {
-          title: '逻辑狗',
-          desc: '幼儿思维游戏课程',
-          imgUrl: require('@/static/img/course/course_01.png'),
-          path: 'https://mp.weixin.qq.com/s?__biz=MjM5MTAyMjE4NA==&mid=503219310&idx=1&sn=39453b5cad367c8dd048efdecb2d3868&chksm=3eb1c96909c6407f825dbef1e54f5ed6a5f10f4027cea58714348bd7eb180347664cccccb800#rd',
-          type: 'link',
-        },
-        {
-          title: '中华小熊猫',
-          desc: '中华文化思维游戏课程',
-          imgUrl: require('@/static/img/course/course_02.png'),
-          path: 'https://mp.weixin.qq.com/s?__biz=MjM5MTAyMjE4NA==&mid=503219310&idx=2&sn=a6511c18e667048b258bf79ac9909b4c&chksm=3eb1c96909c6407f1c5258ddb47a6df5ef0dce5f043da9774a6af913287ea3e652c0e7d84f0f#rd',
-          type: 'link',
-        },
-        {
-          title: '蚂蚁沙丘·与弗雷德一起探索',
-          desc: '幼儿园情境科学课程',
-          imgUrl: require('@/static/img/course/course_03.png'),
-          path: 'https://mp.weixin.qq.com/s?__biz=MjM5MTAyMjE4NA==&mid=503219310&idx=3&sn=7f5cedae8f4d795f97a5562c7c1863ac&chksm=3eb1c96909c6407f9282b81d84be745f81e311d2168246a6877cdf8c93b5d705fa11541b5ef4#rd',
-          type: 'link'
-        },
-        {
-          title: '学习起跑线思维语言&思维数学',
-          desc: '幼小衔接系列课程',
-          imgUrl: require('@/static/img/course/course_04.png'),
-          path: 'https://mp.weixin.qq.com/s?__biz=MjM5MTAyMjE4NA==&mid=503220137&idx=1&sn=32b69bfa877c2cd72ecc34016e2e0b7b&chksm=3eb1caae09c643b8faf5720c7e9e473285d438e428da2820b3c76643f34b4881cc317538d8ee#rd',
-          type: 'link'
-        }
-      ]
+      
     }
   },
   components: {
-    ZdArrow
+    ZdArrow,
+    ContactBtn
   },
   created() {
 
@@ -80,124 +28,46 @@ export default {
   mounted() {
 
   },
-  methods: {
-    navTo(item) {
-      if(item.type == 'link') {
-        window.location.href  = item.path;
-      }
-    }
-  }
+  methods: {}
 }
 </script>
 
 <style lang="scss">
-.course {
-  background: url('@/static/img/common/bg.png') no-repeat #01A2E8;
-  background-size: cover;
-  padding-bottom: 116upx;
-  .head-top {
-    image {
-      width: 100%;
-      height: 100upx;
-    }
-  }
-  .title {
-    text-align: center;
-    .img-title {
-      width: 554upx;
-      height: 124upx;
-      vertical-align: middle;
-    }
+.brand {
+  padding-top: 22upx;
+  .image {
+    width: 748upx;
+    height: 428upx;
+    vertical-align: middle;
   }
   .content {
-    position: relative;
-    background: url('@/static/img/course/course_bg.png') no-repeat #01A2E8;
-    background-size: cover;
-    height: 1218upx;
-    width: 714upx;
-    padding: 92upx 68upx 0 42upx;
-    margin: 108upx auto 0;
-    .item {
-      .left {
-        margin-right: 10upx;
-        .image {
-          width: 214upx;
-          height: 202upx;
-          vertical-align: middle;
-        }
-      }
-      .right {
-        padding-top: 20upx;
-        .info-title {
-          font-size: 36upx;
-          font-family: HelloFont-WenYiHei, HelloFont;
-          font-weight: normal;
-          color: #050505;
-          line-height: 46upx;
-          letter-spacing: 1upx;
-        }
-        .info-desc {
-          font-size: 26upx;
-          font-family: PingFangSC-Regular, PingFang SC;
-          font-weight: 400;
-          color: #999999;
-          line-height: 36upx;
-          margin: 6upx 0 28upx;
-        }
-        .info-btn {
-          .detail {
-            height: 56upx;
-            width: 228upx;
-            border-radius: 34upx;
-            border: 2upx solid #333333;
-            background: #FFFFFF;
-
-            font-size: 26upx;
-            font-family: PingFangSC-Medium, PingFang SC;
-            font-weight: 500;
-            color: #04040A;
-            line-height: 36upx;
-            // filter: blur(10upx);
-          }
-          .btn-arrow {
-            margin-left: 8upx;
-          }
-        }
-      }
-      .line {
-        height: 2upx;
-        background: rgba(153, 153, 153, 0.5);
-        margin: 20upx 0 18upx 24upx;
-      }
-    }
-    .book {
-      position: absolute;
-      width: 114upx;
-      height: 128upx;
+    margin-top: 8upx;
+    text-align: right;
+    .right {
+      height: 634upx;
+      width: 152upx;
       vertical-align: middle;
-      left: -18upx;
-      top: 8upx;
-      transform: translateY(-100%);
     }
-    .path {
-      position: absolute;
-      bottom: -48upx;
-      right: 138upx;
+  }
 
-      width: 30upx;
-      height: 26upx;
-      vertical-align: middle;
+  .fixed-btn {
+    position: fixed;
+    left: 50%;
+    bottom: 112upx;
+    transform: translateX(-50%);
+    .detail {
+      width: 532upx;
+      height: 80upx;
+      background: #1D2089;
+      border-radius: 40upx;
+      font-size: 32upx;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #FFFFFF;
     }
-    .teach {
-      position: absolute;
-      width: 140upx;
-      height: 98upx;
-      vertical-align: middle;
-      right: -18upx;
-      top: 10upx;
-      transform: translateY(-100%);
+    .btn-arrow {
+      margin-left: 8upx;
     }
-
   }
 }
 </style>

src/pages/omo/component/mba.vue

@@ -1,15 +1,20 @@
 <template>
-  <view class='container'>
-    mba
+  <view class='mba'>
+    <image class="image" src="/static/img/omo/mba_01.png" mode="aspectFill"/>
+    <contact-btn></contact-btn>
   </view>
 </template>
 
 <script>
+import ContactBtn from '@/components/contact-btn/index';
+
 export default {
   data() {
     return {}
   },
-
+  components: {
+    ContactBtn
+  },
   onLoad() {},
 
   onShow() {},
@@ -19,5 +24,12 @@ export default {
 }
 </script>
 
-<style>
+<style lang="scss" scoped>
+.mba {
+  padding-bottom: 112upx;
+  .image {
+    width: 100%;
+    height: 1664upx;
+  }
+}
 </style>

src/pages/omo/component/media.vue

@@ -1,25 +1,74 @@
 <template>
-  <view class='container'>
-    自媒体
+  <view class="media">
+    <image class="image" src="/static/img/omo/media_01.png" mode="aspectFill"/>
+    <view class="content">
+      <image class="right" src="/static/img/omo/right_dec.png" mode="aspectFill"/>
+    </view>
+    <contact-btn></contact-btn>
   </view>
 </template>
 
 <script>
+import ZdArrow from '@/components/zd-arrow/index';
+import ContactBtn from '@/components/contact-btn/index';
+
 export default {
   data() {
     return {
-
+      
     }
   },
+  components: {
+    ZdArrow,
+    ContactBtn
+  },
+  created() {
 
-  onLoad() {},
-
-  onShow() {},
+  },
+  mounted() {
 
+  },
   methods: {}
-
 }
 </script>
 
-<style>
+<style lang="scss">
+.media {
+  padding-top: 22upx;
+  .image {
+    width: 722upx;
+    height: 426upx;
+    vertical-align: middle;
+    margin-left: 24upx;
+  }
+  .content {
+    margin-top: 8upx;
+    text-align: right;
+    .right {
+      height: 634upx;
+      width: 152upx;
+      vertical-align: middle;
+    }
+  }
+
+  .fixed-btn {
+    position: fixed;
+    left: 50%;
+    bottom: 112upx;
+    transform: translateX(-50%);
+    .detail {
+      width: 532upx;
+      height: 80upx;
+      background: #1D2089;
+      border-radius: 40upx;
+      font-size: 32upx;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #FFFFFF;
+    }
+    .btn-arrow {
+      margin-left: 8upx;
+    }
+  }
+}
 </style>

src/pages/omo/detail.vue

@@ -38,6 +38,21 @@ export default {
 
   onLoad(options) {
     this.type = options.type
+    let title = 'OMO';
+    if (this.type == 1) {
+      title = '逻辑狗APP下载'
+    } else if (this.type == 2) {
+      title = '品牌教学运营全方案'
+    } else if (this.type == 3) {
+      title = '逻辑狗APP下载'
+    } else if (this.type == 4) {
+      title = '逻辑狗APP下载'
+    } else {
+      title = 'OMO';
+    }
+    uni.setNavigationBarTitle({
+      title: title
+    });
   },
 
   onShow() {

src/pages/omo/index.vue

@@ -67,6 +67,9 @@ export default {
   },
   components: {
     ZdArrow
+  },
+  onLoad() {
+    
   },
   created() {