6 年前 · 96314d67c9
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
 
				 <head>
			
 
				   <meta charset="utf-8">
			
 
				   <meta name="viewport" content="width=device-width,initial-scale=1.0">
			
 
				-  <title>n</title>
			
 
				+  <title>website</title>
			
 
				 </head>
			
 
				 
			
 
				 <body>
			
@@ -92,7 +92,7 @@
 
				     background: transparent;
			
 
				     outline-style: none;
			
 
				   }
			
 
				-
			
 
				+  * { touch-action: pan-y; } 
			
 
				   a {
			
 
				     margin: 0;
			
 
				     padding: 0;
			
--- a/package-lock.json
+++ b/package-lock.json
--- a/src/App.vue
+++ b/src/App.vue
@@ -23,6 +23,10 @@ html,body,#app{
 
				 }
			
 
				 html,body,#app{
			
 
				  height: 100%;
			
 
				+
			
 
				+}
			
 
				+html{
			
 
				+   touch-action:none;
			
 
				 }
			
 
				 .el-submenu__title i{
			
 
				   display: none;
			
@@ -30,5 +34,40 @@ html,body,#app{
 
				 .el-submenu__icon-arrow el-icon-arrow-down{
			
 
				   display: none;
			
 
				 }
			
 
				+.el-carousel__mask{
			
 
				+  background: rgba(0,0,0,0);
			
 
				+  /* opacity: ;
			
 
				+   */
			
 
				+   /* background: linear-gradient() */
			
 
				+   
			
 
				+}
			
 
				+.el-tabs__nav{
			
 
				+  float: none;
			
 
				+}
			
 
				+.tab-bar el-tabs el-tabs--top{
			
 
				+  width: 735px;
			
 
				+  height: 110px;
			
 
				+}
			
 
				+
			
 
				+.solution .solution-main .tab-bar {
			
 
				+    height: 110px;
			
 
				+    margin: 0 auto;
			
 
				+    background-color: rgba(0,0,0,0) !important;
			
 
				+    border-radius: 10px;
			
 
				+    -webkit-box-shadow: 0px 0  !important;
			
 
				+    box-shadow: 0px 0  !important;
			
 
				+    margin-top: -55px;
			
 
				+}
			
 
				+.solution .solution-main .tab-bar .el-tabs__header{
			
 
				+   z-index: 1000 ;
			
 
				+    background-color: #fff !important;
			
 
				+    width: 734px !important;
			
 
				+    margin: auto !important;
			
 
				+    border-radius: 10px !important;
			
 
				+    box-shadow:0px 1px 14px 0px rgba(65,101,242,0.2);
			
 
				+  }
			
 
				+  .solution .solution-main .tab-bar .el-tabs__header .el-tabs__active-bar{
			
 
				+    width: 95px !important;
			
 
				+  }
			
 
				 
			
 
				 </style>
			
--- a/src/assets/image/aboutUs/logo1.png
+++ b/src/assets/image/aboutUs/logo1.png
--- a/src/assets/image/aboutUs/logo2.png
+++ b/src/assets/image/aboutUs/logo2.png
--- a/src/assets/image/aboutUs/logo3.png
+++ b/src/assets/image/aboutUs/logo3.png
--- a/src/assets/image/aboutUs/logo4.png
+++ b/src/assets/image/aboutUs/logo4.png
--- a/src/assets/image/bg.png
+++ b/src/assets/image/bg.png
--- a/src/assets/image/home/background/Group27.jpg
+++ b/src/assets/image/home/background/Group27.jpg
--- a/src/assets/image/home/littleImg/second.png
+++ b/src/assets/image/home/littleImg/second.png
--- a/src/assets/image/home/produce/Group45.png
+++ b/src/assets/image/home/produce/Group45.png
--- a/src/assets/image/home/produce/Group46.png
+++ b/src/assets/image/home/produce/Group46.png
--- a/src/assets/image/home/produce/Group47.png
+++ b/src/assets/image/home/produce/Group47.png
--- a/src/assets/image/home/produce/Group48.png
+++ b/src/assets/image/home/produce/Group48.png
--- a/src/assets/image/logoicon/Bitmap.png
+++ b/src/assets/image/logoicon/Bitmap.png
--- a/src/assets/image/logoicon/Shape.png
+++ b/src/assets/image/logoicon/Shape.png
--- a/src/assets/image/logoicon/aicustomer.png
+++ b/src/assets/image/logoicon/aicustomer.png
--- a/src/assets/image/logoicon/cityLOGO.png
+++ b/src/assets/image/logoicon/cityLOGO.png
--- a/src/assets/image/logoicon/huijulogo.png
+++ b/src/assets/image/logoicon/huijulogo.png
--- a/src/assets/image/logoicon/icon1.png
+++ b/src/assets/image/logoicon/icon1.png
--- a/src/assets/image/logoicon/yinchenglogo.png
+++ b/src/assets/image/logoicon/yinchenglogo.png
--- a/src/assets/image/logoicon/yuejian.png
+++ b/src/assets/image/logoicon/yuejian.png
--- a/src/assets/image/news/Bbanner.jpg
+++ b/src/assets/image/news/Bbanner.jpg
--- a/src/assets/image/news/Bitmap1.jpg
+++ b/src/assets/image/news/Bitmap1.jpg
--- a/src/assets/image/news/Bitmap2.jpg
+++ b/src/assets/image/news/Bitmap2.jpg
--- a/src/assets/image/news/Bitmap3.jpg
+++ b/src/assets/image/news/Bitmap3.jpg
--- a/src/assets/image/news/Bitmap4.jpg
+++ b/src/assets/image/news/Bitmap4.jpg
--- a/src/assets/image/program/community/G2.png
+++ b/src/assets/image/program/community/G2.png
--- a/src/assets/image/program/community/出行-01.png
+++ b/src/assets/image/program/community/出行-01.png
--- a/src/assets/image/program/community/大堂.png
+++ b/src/assets/image/program/community/大堂.png
--- a/src/assets/image/program/community/安防.png
+++ b/src/assets/image/program/community/安防.png
--- a/src/assets/image/program/community/家居.png
+++ b/src/assets/image/program/community/家居.png
--- a/src/assets/image/program/community/建设步伐.png
+++ b/src/assets/image/program/community/建设步伐.png
--- a/src/assets/image/program/community/操作系统.png
+++ b/src/assets/image/program/community/操作系统.png
--- a/src/assets/image/program/community/用户使用.png
+++ b/src/assets/image/program/community/用户使用.png
--- a/src/assets/image/program/community/空间.png
+++ b/src/assets/image/program/community/空间.png
--- a/src/assets/image/program/community/管家.png
+++ b/src/assets/image/program/community/管家.png
--- a/src/assets/image/program/community/管理.png
+++ b/src/assets/image/program/community/管理.png
--- a/src/assets/image/program/community/资源
+++ b/src/assets/image/program/community/资源
--- a/src/assets/image/program/community/资源
+++ b/src/assets/image/program/community/资源
--- a/src/assets/image/program/community/资源
+++ b/src/assets/image/program/community/资源
--- a/src/assets/image/program/community/资源
+++ b/src/assets/image/program/community/资源
--- a/src/assets/image/program/community/资源
+++ b/src/assets/image/program/community/资源
--- a/src/assets/image/program/community/资源
+++ b/src/assets/image/program/community/资源
--- a/src/assets/image/program/community/资源
+++ b/src/assets/image/program/community/资源
--- a/src/assets/image/program/community/资源-0.jpg
+++ b/src/assets/image/program/community/资源-0.jpg
--- a/src/assets/image/program/community/门禁.png
+++ b/src/assets/image/program/community/门禁.png
--- a/src/assets/image/program/order/Bitmap2.jpg
+++ b/src/assets/image/program/order/Bitmap2.jpg
--- a/src/assets/image/program/order/Bitmap3.jpg
+++ b/src/assets/image/program/order/Bitmap3.jpg
--- a/src/assets/image/program/order/售后.png
+++ b/src/assets/image/program/order/售后.png
--- a/src/assets/image/program/order/售后1.png
+++ b/src/assets/image/program/order/售后1.png
--- a/src/assets/image/program/order/团队.png
+++ b/src/assets/image/program/order/团队.png
--- a/src/assets/image/program/order/团队1.png
+++ b/src/assets/image/program/order/团队1.png
--- a/src/assets/image/program/order/小程序.png
+++ b/src/assets/image/program/order/小程序.png
--- a/src/assets/image/program/order/悦见山.png
+++ b/src/assets/image/program/order/悦见山.png
--- a/src/assets/image/program/order/时间.png
+++ b/src/assets/image/program/order/时间.png
--- a/src/assets/image/program/order/时间1.png
+++ b/src/assets/image/program/order/时间1.png
--- a/src/assets/image/program/order/费用.png
+++ b/src/assets/image/program/order/费用.png
--- a/src/assets/image/program/order/费用1.png
+++ b/src/assets/image/program/order/费用1.png
--- a/src/assets/image/program/order/软件.png
+++ b/src/assets/image/program/order/软件.png
--- a/src/assets/image/program/order/运营
+++ b/src/assets/image/program/order/运营
--- a/src/assets/image/program/order/运营1.png
+++ b/src/assets/image/program/order/运营1.png
--- a/src/assets/image/wisdom/group01.png
+++ b/src/assets/image/wisdom/group01.png
--- a/src/assets/image/wisdom/group02.png
+++ b/src/assets/image/wisdom/group02.png
--- a/src/assets/image/wisdom/group03.png
+++ b/src/assets/image/wisdom/group03.png
--- a/src/assets/image/wisdom/group04.png
+++ b/src/assets/image/wisdom/group04.png
--- a/src/assets/image/wisdom/hudong.png
+++ b/src/assets/image/wisdom/hudong.png
--- a/src/assets/image/wisdom/line/1.png
+++ b/src/assets/image/wisdom/line/1.png
--- a/src/assets/image/wisdom/line/2.png
+++ b/src/assets/image/wisdom/line/2.png
--- a/src/assets/image/wisdom/line/3.png
+++ b/src/assets/image/wisdom/line/3.png
--- a/src/assets/image/wisdom/pipei.png
+++ b/src/assets/image/wisdom/pipei.png
--- a/src/assets/image/wisdom/wisdom01.jpg
+++ b/src/assets/image/wisdom/wisdom01.jpg
--- a/src/assets/image/wisdom/wisdom02.jpg
+++ b/src/assets/image/wisdom/wisdom02.jpg
--- a/src/assets/image/wisdom/wisdom03.jpg
+++ b/src/assets/image/wisdom/wisdom03.jpg
--- a/src/assets/image/wisdom/wisdom04.jpg
+++ b/src/assets/image/wisdom/wisdom04.jpg
--- a/src/assets/image/wisdom/yinxiao.png
+++ b/src/assets/image/wisdom/yinxiao.png
--- a/src/assets/image/wisdom/zhuapai.png
+++ b/src/assets/image/wisdom/zhuapai.png
--- a/src/components/commonComponents/footerNav.vue
+++ b/src/components/commonComponents/footerNav.vue
@@ -3,7 +3,7 @@
 
				     <div class="footer-con">
			
 
				       <p>友情链接：中华人民共和国公安部 ｜ 公安交警网 ｜ 中国人民保险 ｜ 中国平安 ｜ 阿里云 </p>
			
 
				       <p>电话咨询: 025-57018336 周一到周日 9:00-18:00 ｜ 公司地址：南京市建邺区云锦路万达东坊630 ｜ 小鹿检测公众号 ｜ 小鹿检测小程序 </p>
			
 
				-      <p> 2018 南京米鹿信息科技有限公司 苏ICP备17027893号-1</p>
			
 
				+      <p> ©2018 南京米鹿信息科技有限公司 苏ICP备17027893号-1</p>
			
 
				 
			
 
				     </div>
			
 
				 
			
@@ -28,7 +28,7 @@ export default {
 
				   position: static;
			
 
				   width: 100%;
			
 
				   background: #0F1C38;
			
 
				-  padding: 120px 0;
			
 
				+  padding: 106px 0;
			
 
				 
			
 
				 }
			
 
				 .footer .footer-con p{
			
--- a/src/components/commonComponents/headerTab.vue
+++ b/src/components/commonComponents/headerTab.vue
@@ -21,11 +21,44 @@
 
				 export default {
			
 
				   data () {
			
 
				     return {
			
 
				-      activeIndex: "1"
			
 
				+      activeIndex: "1",
			
 
				+      searchBarFixed: false
			
 
				     };
			
 
				   },
			
 
				+  mounted() {
			
 
				+    window.addEventListener("scroll", this.handleScroll);
			
 
				+  },
			
 
				+  created() {
			
 
				+    this.changeTabBarActive();
			
 
				+  },
			
 
				   methods: {
			
 
				-    handleSelect (key, keyPath) {
			
 
				+    handleScroll() {
			
 
				+      var scrollTop =
			
 
				+        window.pageYOffset ||
			
 
				+        document.documentElement.scrollTop ||
			
 
				+        document.body.scrollTop;
			
 
				+
			
 
				+      if (scrollTop > 200) {
			
 
				+        this.searchBarFixed = true;
			
 
				+      } else {
			
 
				+        this.searchBarFixed = false;
			
 
				+      }
			
 
				+    },
			
 
				+    changeTabBarActive() {
			
 
				+      this.nowPath = this.$route.path;
			
 
				+      if (this.nowPath == "/") {
			
 
				+        this.activeIndex = "1";
			
 
				+      } else if (this.nowPath == "/solution") {
			
 
				+        this.activeIndex = "2";
			
 
				+      } else if (this.nowPath == "/online") {
			
 
				+        this.activeIndex = "3";
			
 
				+      } else if (this.nowPath == "/newsInformation") {
			
 
				+        this.activeIndex = "4";
			
 
				+      } else {
			
 
				+        this.activeIndex = "5";
			
 
				+      }
			
 
				+    },
			
 
				+    handleSelect(key, keyPath) {
			
 
				       if (key === "2") {
			
 
				         this.activeIndex = "2";
			
 
				         this.$router.push("/solution");
			
@@ -43,18 +76,6 @@ export default {
 
				         this.$router.push("/");
			
 
				       }
			
 
				       console.log(key, keyPath);
			
 
				-      this.nowPath = this.$route.path;
			
 
				-      if (this.nowPath == "/") {
			
 
				-        this.activeIndex = "1";
			
 
				-      } else if (this.nowPath == "/solution") {
			
 
				-        this.activeIndex = "2";
			
 
				-      } else if (this.nowPath == "/productCenter") {
			
 
				-        this.activeIndex = "3";
			
 
				-      } else if (this.nowPath == "/newsInformation") {
			
 
				-        this.activeIndex = "4";
			
 
				-      } else {
			
 
				-        this.activeIndex = "5";
			
 
				-      }
			
 
				     }
			
 
				   }
			
 
				 };
			
@@ -64,9 +85,15 @@ export default {
 
				 <style scoped>
			
 
				 .header-tab {
			
 
				   width: 100%;
			
 
				-  margin: 20px 0;
			
 
				+  position: absolute;
			
 
				+  top: 0;
			
 
				+  padding: 20px 0;
			
 
				   background-color: transparent;
			
 
				-  z-index: 2;
			
 
				+  z-index: 99;
			
 
				+}
			
 
				+.up {
			
 
				+  background-color: #0f1c38;
			
 
				+  transition: all 2s;
			
 
				 }
			
 
				 .topNav{
			
 
				   display: flex;
			
--- a/src/components/navicard/index.vue
+++ b/src/components/navicard/index.vue
@@ -0,0 +1,123 @@
 
				+<template>

			
 
				+<div>

			
 
				+  <div :class="{'nav-card': true, 'active': active}" @click.stop="clickCard()">

			
 
				+    <div class="header">

			
 
				+      <div v-if="active" class="hat">&nbsp;</div>

			
 
				+      <div>{{title}}</div>

			
 
				+    </div>

			
 
				+    <div class="body">

			
 
				+      <div v-for="(item, index) in items" :key="index" @click="clickItem(item, index)" :class="{ 'item-active': itemActive == index }">

			
 
				+        <img v-if="active" :src="item.icon" alt="">

			
 
				+        

			
 
				+        <div>{{ item.text }}</div>

			
 
				+      </div>

			
 
				+    </div>

			
 
				+  </div>

			
 
				+</div>

			
 
				+</template>

			
 
				+

			
 
				+

			
 
				+<script>

			
 
				+export default {

			
 
				+  name: 'NaviCard',

			
 
				+  props: [

			
 
				+    'id',

			
 
				+    'title',

			
 
				+    'items',

			
 
				+    'active'

			
 
				+  ],

			
 
				+  data () {

			
 
				+    return {

			
 
				+      itemActive: -1,

			
 
				+    }

			
 
				+  },

			
 
				+  mounted() {

			
 
				+  },

			
 
				+  methods: {

			
 
				+    clickCard() {

			
 
				+      this.$emit('update:active', true)

			
 
				+    },

			
 
				+    clickItem(item, index) {

			
 
				+      this.itemActive = index

			
 
				+      this.$emit('update:active', true)

			
 
				+      this.$emit('click', item)

			
 
				+    }

			
 
				+  }

			
 
				+}

			
 
				+</script>

			
 
				+

			
 
				+<style lang="less" scoped>

			
 
				+.nav-card {

			
 
				+  background:rgba(255,255,255,1);

			
 
				+  box-shadow:0px 1px 14px 0px rgba(65,101,242,0.2);

			
 
				+  border-radius:10px;

			
 
				+  padding: 12px 14px;

			
 
				+  cursor: pointer;

			
 
				+

			
 
				+  &.active {

			
 
				+    padding-top: 0;

			
 
				+

			
 
				+    .header {

			
 
				+      font-size:15px;

			
 
				+      font-weight:400;

			
 
				+      color:rgba(0,0,0,1);

			
 
				+      line-height:21px;

			
 
				+

			
 
				+      .hat {

			
 
				+        margin: 0 auto;

			
 
				+        width:73px;

			
 
				+        height:13px;

			
 
				+        background:rgba(78,132,255,1);

			
 
				+        border-radius:0px 0px 70px 70px;

			
 
				+      }

			
 
				+    }

			
 
				+

			
 
				+    .body {

			
 
				+      div {

			
 
				+        text-align: center;

			
 
				+        font-size:15px;

			
 
				+        font-weight:400;

			
 
				+        color:rgba(0,0,0,1);

			
 
				+

			
 
				+        &.item-active {

			
 
				+          div {

			
 
				+            color:rgba(78,132,255,1);

			
 
				+          }

			
 
				+        }

			
 
				+        line-height:21px;

			
 
				+      }

			
 
				+    }

			
 
				+  }

			
 
				+

			
 
				+

			
 
				+  .header {

			
 
				+    text-align: center;

			
 
				+    font-size:12px;

			
 
				+    color:rgba(153,153,153,1);

			
 
				+    line-height:17px;

			
 
				+    margin-bottom: 18px;

			
 
				+  }

			
 
				+

			
 
				+  .body {

			
 
				+    width: 100%;

			
 
				+    display: flex;

			
 
				+    // justify-content: space-between;

			
 
				+    div {

			
 
				+      flex: auto;

			
 
				+      text-align: center;

			
 
				+      font-size:12px;

			
 
				+      color:rgba(153,153,153,1);

			
 
				+      line-height:17px;

			
 
				+      padding: 0 5px;

			
 
				+      img {

			
 
				+        height:20px;

			
 
				+      }

			
 
				+      & + div {

			
 
				+        border-left: 1px dotted #000;

			
 
				+        

			
 
				+      }

			
 
				+    }

			
 
				+  }

			
 
				+}

			
 
				+</style>

			
 
				+

			
--- a/src/components/pages/aboutUs/aboutUs.vue
+++ b/src/components/pages/aboutUs/aboutUs.vue
@@ -1,13 +1,42 @@
 
				 <template>
			
 
				   <div class="about-us">
			
 
				       <headerTab></headerTab>
			
 
				-  
			
 
				- <div>
			
 
				-
			
 
				-   关于我们
			
 
				-
			
 
				+       <div class="title">
			
 
				+        <p class="tit">定制专属专业平台运营服务</p>
			
 
				+        <p class="desc">Customized exclusive professional platform operation servic</p>
			
 
				+        <span></span>
			
 
				+      </div>  
			
 
				+      <div class="about-main">
			
 
				+        <div class="main-left">
			
 
				+          <div class="logo">
			
 
				+          <img class="logo1" src="../../../assets/image/aboutUs/logo1.png" alt="">
			
 
				+          </div>
			
 
				+          <div class="logo">
			
 
				+          <img class="logo2" src="../../../assets/image/aboutUs/logo2.png" alt="">
			
 
				+          </div>
			
 
				+          <div class="logo">
			
 
				+          <img class="logo3" src="../../../assets/image/aboutUs/logo3.png" alt="">
			
 
				+          </div>
			
 
				+          <div class="logo">
			
 
				+          <img class="logo4" src="../../../assets/image/aboutUs/logo4.png" alt="">
			
 
				+          </div>
			
 
				+        </div>
			
 
				+        <div class="main-right">
			
 
				+          <p class="main-tit">关于我们</p>
			
 
				+          <div class="con">
			
 
				+            <p>南京荟房网络科技有限公司是领先的智慧社区系统集成和解决方案提供商。</p>
			
 
				+            <p>我们作为银城地产集团股份有限公司旗下的唯一互联网科技公司，自成立以来一直致力于智慧社区系统的集成及开发平台的搭建。基于客户需求持续创新，凭借自身强大的互联网和物联网技术，整合智能硬件接口，积极探索万物智联时代下的智慧生活服务运营生态系统。借助大数据分析处理和自动化调度管理，为社区数据信息化、小区治安智能化、环境治理精细化、生活底单高效化等社区管理需求提供实时、定制化的解决方案。</p>
			
 
				+            <p>为了更好地顺应市场发展，以及提供高质量的互联网+服务，荟房网络科技重视自主创新不断加大研发投入，从软件定制逐步迈向产品化、平台化及开放运营的发展方向。现已自主研发出一系列创新型互联网+应用，并取得十多项专利及著作权。</p>
			
 
				+            <p>融合创新，助力成长。荟房网络科技将矢志利用创新的互联网技术推动智慧社区的发展与变革，提升企业的核心竞争力，维护人类的长远发展和安全。</p>
			
 
				+          </div>
			
 
				+              <p class="main-tit">联系我们</p>
			
 
				+              <p class="info">hurongkai@ycdc.com</p>
			
 
				+              <p class="info">+86-13776686399</p>
			
 
				+              <p class="info">江苏南京宁双路28号汇智大厦A区6楼</p>
			
 
				+        </div>
			
 
				 
			
 
				-    </div>
			
 
				+      </div>
			
 
				+  
			
 
				     <footerNav></footerNav>
			
 
				 
			
 
				   </div>
			
@@ -27,5 +56,95 @@ export default {
 
				 </script>
			
 
				 
			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->
			
 
				-<style scoped>
			
 
				+<style lang="less" scoped>
			
 
				+.about-us {
			
 
				+  .title {
			
 
				+    background: url("../../../assets/image/news/Bbanner.jpg") no-repeat center;
			
 
				+    width: 100%;
			
 
				+    height: 700px;
			
 
				+    background-size: 100% 100%;
			
 
				+    opacity: 1 !important;
			
 
				+    color: #fff;
			
 
				+    .tit {
			
 
				+      font-size: 64px;
			
 
				+      padding-top: 240px;
			
 
				+      font-weight: 100;
			
 
				+    }
			
 
				+    .desc {
			
 
				+      font-size: 12px;
			
 
				+      letter-spacing: 4px;
			
 
				+      line-height: 60px;
			
 
				+    }
			
 
				+    span {
			
 
				+      display: inline-block;
			
 
				+      width: 78px;
			
 
				+      height: 11px;
			
 
				+      background-color: #4e84ff;
			
 
				+      margin-top: 20px;
			
 
				+    }
			
 
				+  }
			
 
				+  .about-main {
			
 
				+    padding: 40px 300px 100px 300px;
			
 
				+    min-height: 600px;
			
 
				+    position: relative;
			
 
				+    .main-left {
			
 
				+      position: absolute;
			
 
				+      left: 400px;
			
 
				+      .logo {
			
 
				+        width: 303px;
			
 
				+        height: 110px;
			
 
				+        box-shadow: 0px 0px 5px 0 #4171f2;
			
 
				+        margin-bottom: 20px;
			
 
				+        border-radius: 4px;
			
 
				+        .logo1 {
			
 
				+          width: 240px;
			
 
				+          height: 110px;
			
 
				+        }
			
 
				+        .logo2 {
			
 
				+          width: 225px;
			
 
				+          height: 38px;
			
 
				+          margin: 36px 0;
			
 
				+        }
			
 
				+        .logo3 {
			
 
				+          width: 200px;
			
 
				+          height: 46px;
			
 
				+          margin: 32px 0;
			
 
				+        }
			
 
				+        .logo4 {
			
 
				+          width: 240px;
			
 
				+          height: 110px;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+    .main-right {
			
 
				+      width: 630px;
			
 
				+      text-align: left;
			
 
				+      position: absolute;
			
 
				+      left: 840px;
			
 
				+      .main-tit {
			
 
				+        background: repeating-linear-gradient(transparent, #4e84ff 100%);
			
 
				+        height: 30px;
			
 
				+        line-height: 30px;
			
 
				+        font-size: 28px;
			
 
				+        width: 116px;
			
 
				+        color: #000;
			
 
				+        margin-bottom: 20px;
			
 
				+      }
			
 
				+      .con {
			
 
				+        font-size: 14px;
			
 
				+        color: #808080;
			
 
				+        padding-bottom: 10px;
			
 
				+        p {
			
 
				+          margin: 14px 0;
			
 
				+          line-height: 21px;
			
 
				+        }
			
 
				+      }
			
 
				+      .info{
			
 
				+        margin-bottom:14px; 
			
 
				+        font-size: 16px;
			
 
				+        color: #666;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				 </style>
			
--- a/src/components/pages/index.vue
+++ b/src/components/pages/index.vue
@@ -1,79 +1,415 @@
 
				-<template>
			
 
				-  <div class="hello">
			
 
				-    <headerTab></headerTab>
			
 
				-  <div class="fullpage-container">
			
 
				-  <div class="fullpage-wp" v-fullpage="opts">
			
 
				-    <div class="page-1 page">
			
 
				-      <div class="part-1" v-animate="{value: 'bounceInLeft'}">
			
 
				-        <!-- <p class="">荟房智慧管家</p> -->
			
 
				-
			
 
				-      </div>
			
 
				-    </div>
			
 
				-    <div class="page-2 page">
			
 
				-      <p class="part-2" v-animate="{value: 'bounceInRight'}">vue-fullpage</p>
			
 
				-    </div>
			
 
				-    <div class="page-3 page">
			
 
				-      <p class="part-3" v-animate="{value: 'bounceInLeft', delay: 0}">vue-fullpage</p>
			
 
				-      <p class="part-3" v-animate="{value: 'bounceInRight', delay: 600}">vue-fullpage</p>
			
 
				-      <p class="part-3" v-animate="{value: 'zoomInDown', delay: 1200}">vue-fullpage</p>
			
 
				-    </div>
			
 
				-  </div>
			
 
				-</div>
			
 
				-    <footerNav></footerNav>
			
 
				-
			
 
				-  </div>
			
 
				-</template>
			
 
				-
			
 
				-<script>
			
 
				-import headerTab from "@/components/commonComponents/headerTab";
			
 
				-import footerNav from "@/components/commonComponents/footerNav";
			
 
				-
			
 
				-export default {
			
 
				-  components: { headerTab, footerNav },
			
 
				-  data() {
			
 
				-    return {
			
 
				-      opts: {
			
 
				-        start: 0,
			
 
				-        dir: "v",
			
 
				-        loop: false,
			
 
				-        duration: 500,
			
 
				-        beforeChange: function(prev, next) {
			
 
				-          console.log("before", prev, next);
			
 
				-        },
			
 
				-        afterChange: function(prev, next) {
			
 
				-          console.log("after", prev, next);
			
 
				-        }
			
 
				-      }
			
 
				-    };
			
 
				-  },
			
 
				-  methods: {}
			
 
				-};
			
 
				-</script>
			
 
				-
			
 
				-<!-- Add "scoped" attribute to limit CSS to this component only -->
			
 
				-<style scoped>
			
 
				-.hello {
			
 
				-  width: 100%;
			
 
				-  height: 100%;
			
 
				-}
			
 
				-.hello .page-1 {
			
 
				-  background: url("../../assets/image/home/background/Group2.jpg") no-repeat
			
 
				-    center;
			
 
				-  width: 100%;
			
 
				-  height: 100%;
			
 
				-  background-size: 100% 100%;
			
 
				-}
			
 
				-.page-container {
			
 
				-  position: absolute;
			
 
				-  left: 0;
			
 
				-  top: 0;
			
 
				-  width: 100%;
			
 
				-  height: 100%;
			
 
				-}
			
 
				-.page-container .page {
			
 
				-  height: 100%;
			
 
				-  width: 100%;
			
 
				-}
			
 
				-
			
 
				-</style>
			
 
				-
			
 
				+<template>

			
 
				+  <div>

			
 
				+    <div class="section" :style="{'height':offsetheight+'px'}">

			
 
				+      <headerTab></headerTab>

			
 
				+      <div class="container" :style="{'transform': 'translate3d(0px,-'+ fullPage*offsetheight +'px, 0px)'}">

			
 
				+        <div class="page-1 page">

			
 
				+          <div class="part-1" :class="page1 == true ? 'animated bounceInLeft' :''">

			
 
				+            <p class="part1-tit">荟房智慧管家</p>

			
 
				+            <span>智慧案场</span>

			
 
				+            <span>迎宾系统</span>

			
 
				+            <span>智慧社区</span>

			
 
				+            <p class="part1-desc">您最贴心的地产智慧管家</p>

			
 
				+            <p class="part1-tip">银城旗下品牌</p>

			
 
				+          </div>

			
 
				+        </div>

			
 
				+        <div class="page-2">

			
 
				+          <p class="title">一站式解决方案</p>

			
 
				+          <img :class="page2 == true ? 'animated flipInX' :''" src="../../assets/image/home/littleImg/second.png" alt>

			
 
				+        </div>

			
 
				+        <div class="page-3">

			
 
				+          <p class="title">产品简介</p>

			
 
				+          <div class="produce">

			
 
				+            <div class="list first" :class="page3 == true ? 'animated bounceInLeft' :''">

			
 
				+              <p class="list-name">AI迎宾判客系统</p>

			
 
				+              <img src="../../assets/image/home/produce/Group45.png" alt>

			
 
				+              <p class="list-desc">智慧人脸风控应用于案场、地铁、银行等</p>

			
 
				+            </div>

			
 
				+            <div class="list" :class="page3 == true ? 'animated rotateInDownRight' :''">

			
 
				+              <p class="list-name">智慧大屏机</p>

			
 
				+              <img src="../../assets/image/home/produce/Group46.png" alt>

			
 
				+              <p class="list-desc">无人售楼终端机结合VR技术, 沉浸式看房体验</p>

			
 
				+            </div>

			
 
				+            <div class="list" :class="page3 == true ? 'animated bounceInDown' :''">

			
 
				+              <p class="list-name">银城慧家APP</p>

			
 
				+              <img src="../../assets/image/home/produce/Group47.png" alt>

			
 
				+              <p class="list-desc">智慧社区管理软件,一键开启智慧社区美好生活</p>

			
 
				+            </div>

			
 
				+            <div class="list" :class="page3 == true ? 'animated bounceInRight' :''">

			
 
				+              <p class="list-name">全楼盘</p>

			
 
				+              <img src="../../assets/image/home/produce/Group48.png" alt>

			
 
				+              <p class="list-desc">线上售楼处平台, 满足开发商和购房者共同需求</p>

			
 
				+            </div>

			
 
				+          </div>

			
 
				+        </div>

			
 
				+        <div class="page-4">

			
 
				+          <div class="page-4-con">

			
 
				+            <el-carousel :interval="4000" type="card" height="500px" indicator-position="none" arrow="never">

			
 
				+              <el-carousel-item>

			
 
				+                <p class="swiper-tittle">服务优势</p>

			
 
				+                <div class="service">

			
 
				+                  <p class="service-p1">定制化服务</p>

			
 
				+                  <p class="service-p2">增值运维服务</p>

			
 
				+                  <p class="service-p3">专业售后</p>

			
 
				+                </div>

			
 
				+              </el-carousel-item>

			
 
				+              <el-carousel-item>

			
 
				+                <p class="swiper-tittle">技术优势</p>

			
 
				+                <div class="skill">

			
 
				+                  <p class="skill-p1">超过十年的行业应用软件开发经验</p>

			
 
				+                  <p class="skill-p2">丰富的智慧社区及智慧案场建设经验</p>

			
 
				+                  <p class="skill-p3">长期的Java、Net、PHP、软件测试人才储备</p>

			
 
				+                </div>

			
 
				+              </el-carousel-item>

			
 
				+              <el-carousel-item>

			
 
				+                <p class="swiper-tittle">运营推广</p>

			
 
				+                <div class="operation">

			
 
				+                  <p class="Operation-p1">精准数字营销、专业策划设计</p>

			
 
				+                  <p class="Operation-p2">DSP信息流广告</p>

			
 
				+                  <p class="Operation-p3">线下社群活动</p>

			
 
				+                </div>

			
 
				+              </el-carousel-item>

			
 
				+            </el-carousel>

			
 
				+          </div>

			
 
				+        </div>

			
 
				+        <div class="page-5">

			
 
				+          <p class="title">我们的客户</p>

			
 
				+          <div class="logo-box">

			
 
				+            <img src="../../assets/image/home/logo/Group29.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group32.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group35.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group40.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group41.png" alt>

			
 
				+

			
 
				+            <img src="../../assets/image/home/logo/Group30.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group33.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group36.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group39.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group42.png" alt>

			
 
				+

			
 
				+            <img src="../../assets/image/home/logo/Group31.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group34.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group37.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group38.png" alt>

			
 
				+            <img src="../../assets/image/home/logo/Group43.png" alt>

			
 
				+          </div>

			
 
				+

			
 
				+          <footerNav></footerNav>

			
 
				+        </div>

			
 
				+      </div>

			
 
				+      <div class="fixed-list">

			
 
				+        <div v-for="(i,index) in bannerList" :class="fullPage==index?'color':''" @click="pageInfo(index)" :key="index+'fiexd'"></div>

			
 
				+      </div>

			
 
				+    </div>

			
 
				+  </div>

			
 
				+</template>

			
 
				+<script>

			
 
				+import headerTab from "@/components/commonComponents/headerTab";

			
 
				+import footerNav from "@/components/commonComponents/footerNav";

			
 
				+

			
 
				+export default {

			
 
				+  components: { headerTab, footerNav },

			
 
				+  data () {

			
 
				+    return {

			
 
				+      bannerList: [

			
 
				+        //盒子背景颜色

			
 
				+        {

			
 
				+          width: "100%"

			
 
				+        },

			
 
				+        {

			
 
				+          width: "100%"

			
 
				+        },

			
 
				+        {

			
 
				+          width: "100%"

			
 
				+        },

			
 
				+        {

			
 
				+          width: "100%"

			
 
				+        },

			
 
				+        {

			
 
				+          width: "100%"

			
 
				+        }

			
 
				+      ],

			
 
				+      offsetheight: document.documentElement.clientHeight, //获取当前页面的高度

			
 
				+      fullPage: 0, //当前在第几页

			
 
				+      fullPageNum: false, //是否在滑动

			
 
				+      page2: false, //是否在第二页

			
 
				+      page3: false, //是否在第三页

			
 
				+    };

			
 
				+  },

			
 
				+  mounted () {

			
 
				+    //

			
 
				+

			
 
				+    //在元素加载完毕的时候添加鼠标滑动事件

			
 
				+    //

			
 
				+    if (document.addEventListener) {

			
 
				+      document.addEventListener("DOMMouseScroll", this.scroll, false);

			
 
				+    }

			
 
				+    window.onmousewheel = document.onmousewheel = this.scroll;

			
 
				+  },

			
 
				+  methods: {

			
 
				+    //

			
 
				+    //点击左侧小点时跳转到相应的page

			
 
				+    //

			
 
				+    pageInfo (index) {

			
 
				+      this.fullPage = index;

			
 
				+    },

			
 
				+    //

			
 
				+    //鼠标事件

			
 
				+    //

			
 
				+    scroll (e) {

			
 
				+      e = e || window.event;

			
 
				+      //

			
 
				+      //是否正在滑动

			
 
				+      //

			
 
				+      if (this.fullPageNum) {

			
 
				+        return false;

			
 
				+      }

			
 
				+      //

			
 
				+      //   e.wheelDelta为负数时向下滑动

			
 
				+      //

			
 
				+      if (e.wheelDelta < 0) {

			
 
				+        if (this.fullPage >= 4) {

			
 
				+          return false;

			
 
				+        }

			
 
				+        this.fullPageNum = true;

			
 
				+        this.pageInfo(this.fullPage + 1);

			
 
				+        //

			
 
				+        //  css设置动画事件为1000，所以等到1000ms后滚动状态为false

			
 
				+        //

			
 
				+        setTimeout(() => {

			
 
				+          this.fullPageNum = false;

			
 
				+        }, 500);

			
 
				+        //

			
 
				+        //   否则就是向上划

			
 
				+        //

			
 
				+      } else {

			
 
				+        if (this.fullPage <= 0) {

			
 
				+          return false;

			
 
				+        }

			
 
				+        this.fullPageNum = true;

			
 
				+        this.pageInfo(this.fullPage - 1);

			
 
				+        setTimeout(() => {

			
 
				+          this.fullPageNum = false;

			
 
				+        }, 1000);

			
 
				+      }

			
 
				+      console.log(this.fullPage, "fullPage");

			
 
				+      if (this.fullPage == "2") {

			
 
				+        this.page3 = true;

			
 
				+      } else {

			
 
				+        this.page3 = false;

			
 
				+      }

			
 
				+      if (this.fullPage == "1") {

			
 
				+        this.page2 = true;

			
 
				+      } else {

			
 
				+        this.page2 = false;

			
 
				+      }

			
 
				+      if (this.fullPage == "0") {

			
 
				+        this.page1 = true;

			
 
				+      } else {

			
 
				+        this.page1 = false;

			
 
				+      }

			
 
				+    }

			
 
				+  }

			
 
				+};

			
 
				+</script>

			
 
				+<style lang="less">

			
 
				+.el-carousel__item h3 {

			
 
				+  color: #475669;

			
 
				+  font-size: 14px;

			
 
				+  // opacity: 0.75;

			
 
				+  // line-height: 200px;

			
 
				+  margin: 0;

			
 
				+}

			
 
				+

			
 
				+.el-carousel__item:nth-child(2n) {

			
 
				+  // background-color: #99a9bf;

			
 
				+}

			
 
				+

			
 
				+.el-carousel__item:nth-child(2n + 1) {

			
 
				+  // background-color: #d3dce6;

			
 
				+}

			
 
				+.swiper-tittle {

			
 
				+  font-size: 60px;

			
 
				+  margin: 0 auto 58px auto;

			
 
				+  color: rgba(255, 255, 255, 1);

			
 
				+}

			
 
				+.service,.skill,.operation {

			
 
				+  display: flex;

			
 
				+  justify-content: center;

			
 
				+  flex-wrap: wrap;

			
 
				+  p {

			
 
				+    width: 573px;

			
 
				+    height: 98px;

			
 
				+    color: rgba(255, 255, 255, 1);

			
 
				+    text-align: center;

			
 
				+    line-height: 98px;

			
 
				+    margin: 10px;

			
 
				+    background: #2f2f80;

			
 
				+    border-radius: 4px;

			
 
				+    border: 1px solid rgba(151, 151, 151, 1);

			
 
				+  }

			
 
				+}

			
 
				+.section {

			
 
				+  overflow: hidden;

			
 
				+  .page-1 {

			
 
				+    background: url("../../assets/image/home/background/Group2.jpg") no-repeat

			
 
				+      center;

			
 
				+    width: 100%;

			
 
				+    height: 100%;

			
 
				+    background-size: 100% 100%;

			
 
				+    .part-1 {

			
 
				+      color: #fff;

			
 
				+      position: relative;

			
 
				+      top: 50%;

			
 
				+      margin-top: -140px;

			
 
				+      // transform: translateX(605px);

			
 
				+      .part1-tit {

			
 
				+        width: 480px;

			
 
				+        font-size: 80px;

			
 
				+        border-bottom: 4px solid #3b99fc;

			
 
				+        margin: 0 auto;

			
 
				+      }

			
 
				+      span {

			
 
				+        display: inline-block;

			
 
				+        font-size: 34px;

			
 
				+        margin: 15px 30px 10px 30px;

			
 
				+        letter-spacing: 9px;

			
 
				+      }

			
 
				+      .part1-desc {

			
 
				+        font-size: 34px;

			
 
				+        letter-spacing: 9px;

			
 
				+      }

			
 
				+      .part1-tip {

			
 
				+        background-color: #4e84ff;

			
 
				+        font-size: 24px;

			
 
				+        margin: 20px auto;

			
 
				+        width: 350px;

			
 
				+        letter-spacing: 26px;

			
 
				+        height: 40px;

			
 
				+        line-height: 40px;

			
 
				+        border-radius: 4px;

			
 
				+        padding-left: 16px;

			
 
				+      }

			
 
				+    }

			
 
				+  }

			
 
				+  .page-2 {

			
 
				+    background: url("../../assets/image/home/background/Group26.jpg") no-repeat

			
 
				+      center;

			
 
				+    width: 100%;

			
 
				+    height: 100%;

			
 
				+    background-size: 100% 100%;

			
 
				+    color: #fff;

			
 
				+    .title {

			
 
				+      font-size: 56px;

			
 
				+      padding-top: 200px;

			
 
				+    }

			
 
				+    img {

			
 
				+      width: 100%;

			
 
				+    }

			
 
				+  }

			
 
				+  .page-3 {

			
 
				+    background: url("../../assets/image/home/background/Group27.jpg") no-repeat

			
 
				+      center;

			
 
				+    width: 100%;

			
 
				+    height: 100%;

			
 
				+    background-size: 100% 100%;

			
 
				+    .title {

			
 
				+      font-size: 56px;

			
 
				+      padding-top: 140px;

			
 
				+      color: #fff;

			
 
				+    }

			
 
				+    .produce {

			
 
				+      width: 1000px;

			
 
				+      height: 680px;

			
 
				+      margin: 20px auto;

			
 
				+      .list {

			
 
				+        width: 400px;

			
 
				+        height: 300px;

			
 
				+        background-color: #fff;

			
 
				+        border-radius: 4px;

			
 
				+        padding: 0 40px;

			
 
				+        margin: 10px;

			
 
				+        float: left;

			
 
				+        .list-name {

			
 
				+          color: #03033f;

			
 
				+          border-bottom: 2px dashed #040445;

			
 
				+          padding: 30px 0 18px 0;

			
 
				+          font-size: 30px;

			
 
				+        }

			
 
				+        img {

			
 
				+          width: 330px;

			
 
				+          height: 150px;

			
 
				+          margin-top: 16px;

			
 
				+        }

			
 
				+        .list-desc {

			
 
				+          font-size: 18px;

			
 
				+          line-height: 36px;

			
 
				+          color: #000;

			
 
				+        }

			
 
				+      }

			
 
				+    }

			
 
				+  }

			
 
				+  .page-4 {

			
 
				+    background: url("../../assets/image/home/background/Group28.jpg") no-repeat

			
 
				+      center;

			
 
				+    width: 100%;

			
 
				+    height: 100%;

			
 
				+    background-size: 100% 100%;

			
 
				+    display: flex;

			
 
				+    align-items: center;

			
 
				+    .page-4-con {

			
 
				+      width: 100%;

			
 
				+    }

			
 
				+    .title {

			
 
				+      font-size: 60px;

			
 
				+      padding-top: 140px;

			
 
				+      color: #fff;

			
 
				+    }

			
 
				+  }

			
 
				+  .page-5 {

			
 
				+    background: url("../../assets/image/home/background/Group29.jpg") no-repeat

			
 
				+      center;

			
 
				+    width: 100%;

			
 
				+    height: 100%;

			
 
				+    background-size: 100% 100%;

			
 
				+    .title {

			
 
				+      font-size: 56px;

			
 
				+      padding-top: 180px;

			
 
				+      color: #fff;

			
 
				+    }

			
 
				+    .logo-box {

			
 
				+      width: 1200px;

			
 
				+      height: 320px;

			
 
				+      margin: 50px auto 60px auto;

			
 
				+      img {

			
 
				+        width: 230px;

			
 
				+        height: 100px;

			
 
				+        float: left;

			
 
				+        margin: 5px;

			
 
				+      }

			
 
				+    }

			
 
				+  }

			
 
				+}

			
 
				+.container {

			
 
				+  width: 100%;

			
 
				+  height: 100%;

			
 
				+  position: relative;

			
 
				+  transform: translate3d(0px, 0px, 0px);

			
 
				+  transition: all 1000ms ease;

			
 
				+}

			
 
				+.fixed-list {

			
 
				+  position: fixed;

			
 
				+  top: 46%;

			
 
				+  right: 20px;

			
 
				+  z-index: 2;

			
 
				+  div {

			
 
				+    width: 10px;

			
 
				+    height: 10px;

			
 
				+    background: #ccc;

			
 
				+    margin-bottom: 14px;

			
 
				+  }

			
 
				+  div.color {

			
 
				+    background: #4e84ff;

			
 
				+  }

			
 
				+}

			
 
				+</style>

			
--- a/src/components/pages/newsInformation/newsInformation.vue
+++ b/src/components/pages/newsInformation/newsInformation.vue
@@ -1,12 +1,42 @@
 
				 <template>
			
 
				   <div class="news-information">
			
 
				       <headerTab></headerTab>
			
 
				-  <div>
			
 
				-
			
 
				-    新闻资讯
			
 
				-
			
 
				-
			
 
				-    </div>
			
 
				+      <div class="title">
			
 
				+        <p class="tit">新闻资讯</p>
			
 
				+        <p class="desc">News and information</p>
			
 
				+        <span></span>
			
 
				+      </div>  
			
 
				+      <ul class="news-list">
			
 
				+        <li class="list">
			
 
				+          <img src="../../../assets/image/news/Bitmap1.jpg" alt="">
			
 
				+          <div class="list-right">
			
 
				+          <p class="list-tit">荟房网络将在浦口高新区建立分部全面支持悦见山智慧案场</p>
			
 
				+          <p class="list-desc">悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持,</p>
			
 
				+          </div>
			
 
				+        </li>
			
 
				+        <li class="list">
			
 
				+          <img src="../../../assets/image/news/Bitmap2.jpg" alt="">
			
 
				+          <div class="list-right">
			
 
				+          <p class="list-tit">荟房网络将在浦口高新区建立分部全面支持悦见山智慧案场</p>
			
 
				+          <p class="list-desc">悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持,</p>
			
 
				+          </div>
			
 
				+        </li>
			
 
				+        <li class="list">
			
 
				+          <img src="../../../assets/image/news/Bitmap3.jpg" alt="">
			
 
				+          <div class="list-right">
			
 
				+          <p class="list-tit">荟房网络将在浦口高新区建立分部全面支持悦见山智慧案场</p>
			
 
				+          <p class="list-desc">悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持,</p>
			
 
				+          </div>
			
 
				+        </li>
			
 
				+        <li class="list">
			
 
				+          <img src="../../../assets/image/news/Bitmap4.jpg" alt="">
			
 
				+          <div class="list-right">
			
 
				+          <p class="list-tit">荟房网络将在浦口高新区建立分部全面支持悦见山智慧案场</p>
			
 
				+          <p class="list-desc">悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持, 悦见山智慧案场作为荟房的一个项目, 在交付前将对此进行全面支持,</p>
			
 
				+          </div>
			
 
				+        </li>
			
 
				+      </ul>
			
 
				+ 
			
 
				     <footerNav></footerNav>
			
 
				 
			
 
				   </div>
			
@@ -18,16 +48,86 @@ import footerNav from "@/components/commonComponents/footerNav";
 
				 
			
 
				 export default {
			
 
				   components: { headerTab, footerNav },
			
 
				- 
			
 
				-  data () {
			
 
				-    return {
			
 
				-  
			
 
				-    }
			
 
				+
			
 
				+  data() {
			
 
				+    return {};
			
 
				   }
			
 
				-}
			
 
				+};
			
 
				 </script>
			
 
				 
			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->
			
 
				-<style scoped>
			
 
				-
			
 
				+<style lang="less">
			
 
				+.news-information {
			
 
				+  .title {
			
 
				+    background: url("../../../assets/image/news/Bbanner.jpg") no-repeat center;
			
 
				+    width: 100%;
			
 
				+    height: 700px;
			
 
				+    background-size: 100% 100%;
			
 
				+    opacity: 1 !important;
			
 
				+    color: #fff;
			
 
				+    .tit {
			
 
				+      font-size: 64px;
			
 
				+      padding-top: 240px;
			
 
				+      font-weight: 100;
			
 
				+    }
			
 
				+    .desc {
			
 
				+      font-size: 12px;
			
 
				+      letter-spacing: 4px;
			
 
				+      line-height: 60px;
			
 
				+    }
			
 
				+    span {
			
 
				+      display: inline-block;
			
 
				+      width: 78px;
			
 
				+      height: 11px;
			
 
				+      background-color: #4e84ff;
			
 
				+      margin-top: 20px;
			
 
				+    }
			
 
				+  }
			
 
				+  .news-list {
			
 
				+    padding: 40px 300px 100px 300px;
			
 
				+    list-style: none;
			
 
				+    .list {
			
 
				+      position: relative;
			
 
				+      padding: 0;
			
 
				+      height: 180px;
			
 
				+      text-align: left;
			
 
				+      margin: 5px 0;
			
 
				+      img {
			
 
				+        position: absolute;
			
 
				+        width: 300px;
			
 
				+        height: 168px;
			
 
				+        left: 0;
			
 
				+      }
			
 
				+      .list-right {
			
 
				+        position: absolute;
			
 
				+        left: 320px;
			
 
				+        border-bottom: 1px solid #e5e5e5;
			
 
				+        height: 177px;
			
 
				+        .list-tit {
			
 
				+          font-size: 20px;
			
 
				+          color: #000;
			
 
				+          margin-top: 40px;
			
 
				+          line-height: 40px;
			
 
				+          font-weight: 600;
			
 
				+              overflow: hidden;
			
 
				+          text-overflow: ellipsis;
			
 
				+          display: -webkit-box;
			
 
				+          -webkit-line-clamp: 1;
			
 
				+          -webkit-box-orient: vertical;
			
 
				+        }
			
 
				+        .list-desc {
			
 
				+          font-size: 14px;
			
 
				+          color: #808080;
			
 
				+          padding-right: 30px;
			
 
				+          line-height: 22px;
			
 
				+          overflow: hidden;
			
 
				+          text-overflow: ellipsis;
			
 
				+          display: -webkit-box;
			
 
				+          -webkit-line-clamp: 4;
			
 
				+          -webkit-box-orient: vertical;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				 </style>
			
--- a/src/components/pages/productCenter/AIwelcome.vue
+++ b/src/components/pages/productCenter/AIwelcome.vue
@@ -15,6 +15,7 @@
 
				           </div>

			
 
				         </div>

			
 
				       </div>

			
 
				+      <prod-navi class="nav" default="case"></prod-navi>

			
 
				       <!-- <div class="product_bar">

			
 
				         <el-menu :default-active="activeIndex2" class="el-menu-demo"  @select="handleSelect" background-color="rgba(0,0,0,0)" text-color="#999999" active-text-color="#000000">

			
 
				           <el-menu-item index="1" class="item1"  background-color="#fff">

			
@@ -187,7 +188,11 @@ import headerTab from "@/components/commonComponents/headerTab";
 
				 import footerNav from "@/components/commonComponents/footerNav";

			
 
				 

			
 
				 export default {

			
 
				-  components: { headerTab, footerNav },

			
 
				+  components: {

			
 
				+    headerTab,

			
 
				+    footerNav,

			
 
				+    ProdNavi: () => import('./prodNavi'),

			
 
				+  },

			
 
				 

			
 
				   data () {

			
 
				     return {

			
@@ -195,21 +200,41 @@ export default {
 
				       P1: '全方位布控，人脸自动抓取，智能判客',

			
 
				       P2: '',

			
 
				       P3: 'Intelligent face risk control syste',

			
 
				-      activeIndex2: '1'

			
 
				+      activeIndex2: '1',

			
 
				     }

			
 
				   },

			
 
				   methods: {

			
 
				-    handleSelect (key, keyPath) {

			
 
				-      console.log(key, keyPath);

			
 
				-    }

			
 
				+    active1(){

			
 
				+      this.order1 = false;

			
 
				+      this.order_big = true;

			
 
				+      this.wisdom_nav = true;

			
 
				+      this.wisdom_big = false;

			
 
				+    },

			
 
				+    handleOpen(key, keyPath) {

			
 
				+      // this.collapse == 'false'

			
 
				+        console.log(key, keyPath);

			
 
				+      },

			
 
				+      handleClose(key, keyPath) {

			
 
				+        console.log(key, keyPath);

			
 
				+      }

			
 
				   }

			
 
				 }

			
 
				 </script>

			
 
				 

			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->

			
 
				 <style scoped lang="less">

			
 
				+.nav{

			
 
				+  width: 1280px;

			
 
				+  position: relative;

			
 
				+  top: -64px;

			
 
				+  // margin-top: -207px;

			
 
				+  margin: auto;

			
 
				+  display: flex;

			
 
				+  justify-content: space-between;

			
 
				+  align-items: center;

			
 
				+}

			
 
				 .product-center {

			
 
				-  background: url(../../../assets/image/program/bg1.jpg) no-repeat center;

			
 
				+  background: url(../../../assets/image/program/bg3.jpg) no-repeat center;

			
 
				   width: 100%;

			
 
				   min-width: 1260px;

			
 
				   height: 780px;

			
--- a/src/components/pages/productCenter/bigscreen.vue
+++ b/src/components/pages/productCenter/bigscreen.vue
@@ -16,34 +16,7 @@
 
				           </div>

			
 
				         </div>

			
 
				       </div>

			
 
				-      <!-- <div class="product_bar">

			
 
				-        <el-menu :default-active="activeIndex2" class="el-menu-demo"  @select="handleSelect" background-color="rgba(0,0,0,0)" text-color="#999999" active-text-color="#000000">

			
 
				-          <el-menu-item index="1" class="item1"  background-color="#fff">

			
 
				-            <div class="order">

			
 
				-              <div class="blue_bar"></div>

			
 
				-              <div class="product-order">产品订制</div>

			
 
				-              <div class="order_bot">

			
 
				-                <div class="order_bot_online">

			
 
				-                  <img src="../../../assets/image/logoicon/shape.png" alt="">

			
 
				-                 

			
 
				-                  <span>全渠道在线平台</span>

			
 
				-                </div>

			
 
				-                <div class="order_bot_secondHandHouse">

			
 
				-                  <img src="../../../assets/image/logoicon/huijulogo.png" alt="">

			
 
				-                  

			
 
				-                  <span>二手房管理平台</span>

			
 
				-                </div>

			
 
				-              </div>

			
 
				-            </div>

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="2" class="item2">

			
 
				-            智慧案场

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="3" class="item3">

			
 
				-            智慧社区

			
 
				-          </el-menu-item>

			
 
				-        </el-menu>

			
 
				-      </div>-->

			
 
				+      <prod-navi class="nav" default="case"></prod-navi>

			
 
				     </div>

			
 
				 

			
 
				     <div class="secondHouse-middle">

			
@@ -216,9 +189,13 @@
 
				 <script>

			
 
				 import headerTab from "@/components/commonComponents/headerTab";

			
 
				 import footerNav from "@/components/commonComponents/footerNav";

			
 
				-

			
 
				+import naviCard from "../../navicard";

			
 
				 export default {

			
 
				-  components: { headerTab, footerNav },

			
 
				+  components: {

			
 
				+    headerTab,

			
 
				+    footerNav,

			
 
				+    ProdNavi: () => import('./prodNavi'),

			
 
				+  },

			
 
				 

			
 
				   data () {

			
 
				     return {

			
@@ -226,21 +203,41 @@ export default {
 
				       P1: '无人售楼终端机结合VR技术,沉浸式看房体验',

			
 
				       P2: '',

			
 
				       P3: 'INTELLIGENT SALES OFFICE',

			
 
				-      activeIndex2: '1'

			
 
				+      activeIndex2: '1',

			
 
				     }

			
 
				   },

			
 
				   methods: {

			
 
				-    handleSelect (key, keyPath) {

			
 
				-      console.log(key, keyPath);

			
 
				-    }

			
 
				+    active1(){

			
 
				+      this.order1 = false;

			
 
				+      this.order_big = true;

			
 
				+      this.wisdom_nav = true;

			
 
				+      this.wisdom_big = false;

			
 
				+    },

			
 
				+    handleOpen(key, keyPath) {

			
 
				+      // this.collapse == 'false'

			
 
				+        console.log(key, keyPath);

			
 
				+      },

			
 
				+      handleClose(key, keyPath) {

			
 
				+        console.log(key, keyPath);

			
 
				+      }

			
 
				   }

			
 
				 }

			
 
				 </script>

			
 
				 

			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->

			
 
				 <style scoped lang="less">

			
 
				+.nav{

			
 
				+  width: 1280px;

			
 
				+  position: relative;

			
 
				+  top: -64px;

			
 
				+  // margin-top: -207px;

			
 
				+  margin: auto;

			
 
				+  display: flex;

			
 
				+  justify-content: space-between;

			
 
				+  align-items: center;

			
 
				+}

			
 
				 .product-center {

			
 
				-  background: url(../../../assets/image/program/bg1.jpg) no-repeat center;

			
 
				+  background: url(../../../assets/image/program/bg3.jpg) no-repeat center;

			
 
				   width: 100%;

			
 
				   min-width: 1260px;

			
 
				   height: 780px;

			
--- a/src/components/pages/productCenter/city.vue
+++ b/src/components/pages/productCenter/city.vue
@@ -17,34 +17,8 @@
 
				           </div>

			
 
				         </div>

			
 
				       </div>

			
 
				-      <!-- <div class="product_bar">

			
 
				-        <el-menu :default-active="activeIndex2" class="el-menu-demo"  @select="handleSelect" background-color="rgba(0,0,0,0)" text-color="#999999" active-text-color="#000000">

			
 
				-          <el-menu-item index="1" class="item1"  background-color="#fff">

			
 
				-            <div class="order">

			
 
				-              <div class="blue_bar"></div>

			
 
				-              <div class="product-order">产品订制</div>

			
 
				-              <div class="order_bot">

			
 
				-                <div class="order_bot_online">

			
 
				-                  <img src="../../../assets/image/logoicon/shape.png" alt="">

			
 
				-                 

			
 
				-                  <span>全渠道在线平台</span>

			
 
				-                </div>

			
 
				-                <div class="order_bot_secondHandHouse">

			
 
				-                  <img src="../../../assets/image/logoicon/huijulogo.png" alt="">

			
 
				-                  

			
 
				-                  <span>二手房管理平台</span>

			
 
				-                </div>

			
 
				-              </div>

			
 
				-            </div>

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="2" class="item2">

			
 
				-            智慧案场

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="3" class="item3">

			
 
				-            智慧社区

			
 
				-          </el-menu-item>

			
 
				-        </el-menu>

			
 
				-      </div>-->

			
 
				+

			
 
				+      <prod-navi class="nav" default="community"></prod-navi>

			
 
				     </div>

			
 
				 

			
 
				     <div class="city_content">

			
@@ -136,7 +110,11 @@ import headerTab from "@/components/commonComponents/headerTab";
 
				 import footerNav from "@/components/commonComponents/footerNav";

			
 
				 

			
 
				 export default {

			
 
				-  components: { headerTab, footerNav },

			
 
				+  components: {

			
 
				+    headerTab,

			
 
				+    footerNav,

			
 
				+    ProdNavi: () => import('./prodNavi'),

			
 
				+  },

			
 
				 

			
 
				   data () {

			
 
				     return {

			
@@ -144,19 +122,39 @@ export default {
 
				       P1: '一站式社区服务共享空间',

			
 
				       P2: '足不出户拓展生活空间 , 体验最便捷的品质生活',

			
 
				       P3: 'INTELLIGENT FACE RISK CONTROL SYSTEM',

			
 
				-      activeIndex2: '1'

			
 
				+      activeIndex2: '1',

			
 
				     }

			
 
				   },

			
 
				   methods: {

			
 
				-    handleSelect (key, keyPath) {

			
 
				-      console.log(key, keyPath);

			
 
				-    }

			
 
				+    active1(){

			
 
				+      this.order1 = false;

			
 
				+      this.order_big = true;

			
 
				+      this.wisdom_nav = true;

			
 
				+      this.wisdom_big = false;

			
 
				+    },

			
 
				+    handleOpen(key, keyPath) {

			
 
				+      // this.collapse == 'false'

			
 
				+        console.log(key, keyPath);

			
 
				+      },

			
 
				+      handleClose(key, keyPath) {

			
 
				+        console.log(key, keyPath);

			
 
				+      }

			
 
				   }

			
 
				 }

			
 
				 </script>

			
 
				 

			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->

			
 
				 <style scoped lang="less">

			
 
				+.nav{

			
 
				+  width: 1280px;

			
 
				+  position: relative;

			
 
				+  top: -64px;

			
 
				+  // margin-top: -207px;

			
 
				+  margin: auto;

			
 
				+  display: flex;

			
 
				+  justify-content: space-between;

			
 
				+  align-items: center;

			
 
				+}

			
 
				 .product-center {

			
 
				   background: url(../../../assets/image/program/bg1.jpg) no-repeat center;

			
 
				   width: 100%;

			
--- a/src/components/pages/productCenter/community.vue
+++ b/src/components/pages/productCenter/community.vue
@@ -19,34 +19,7 @@
 
				           </div>

			
 
				         </div>

			
 
				       </div>

			
 
				-      <!-- <div class="product_bar">

			
 
				-        <el-menu :default-active="activeIndex2" class="el-menu-demo"  @select="handleSelect" background-color="rgba(0,0,0,0)" text-color="#999999" active-text-color="#000000">

			
 
				-          <el-menu-item index="1" class="item1"  background-color="#fff">

			
 
				-            <div class="order">

			
 
				-              <div class="blue_bar"></div>

			
 
				-              <div class="product-order">产品订制</div>

			
 
				-              <div class="order_bot">

			
 
				-                <div class="order_bot_online">

			
 
				-                  <img src="../../../assets/image/logoicon/shape.png" alt="">

			
 
				-                 

			
 
				-                  <span>全渠道在线平台</span>

			
 
				-                </div>

			
 
				-                <div class="order_bot_secondHandHouse">

			
 
				-                  <img src="../../../assets/image/logoicon/huijulogo.png" alt="">

			
 
				-                  

			
 
				-                  <span>二手房管理平台</span>

			
 
				-                </div>

			
 
				-              </div>

			
 
				-            </div>

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="2" class="item2">

			
 
				-            智慧案场

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="3" class="item3">

			
 
				-            智慧社区

			
 
				-          </el-menu-item>

			
 
				-        </el-menu>

			
 
				-      </div>-->

			
 
				+      <prod-navi class="nav" default="community"></prod-navi>

			
 
				     </div>

			
 
				 

			
 
				     <div class="community">

			
@@ -153,7 +126,11 @@ import headerTab from "@/components/commonComponents/headerTab";
 
				 import footerNav from "@/components/commonComponents/footerNav";

			
 
				 

			
 
				 export default {

			
 
				-  components: { headerTab, footerNav },

			
 
				+  components: {

			
 
				+    headerTab,

			
 
				+    footerNav,

			
 
				+    ProdNavi: () => import('./prodNavi'),

			
 
				+  },

			
 
				 

			
 
				   data () {

			
 
				     return {

			
@@ -161,18 +138,38 @@ export default {
 
				       P1: '让业主享受智慧社区美好生活',

			
 
				       P2: '整体掌控，一触即发；智能生活，全面掌控',

			
 
				       P3: 'INTELLIGENT FACE RISK CONTROL SYSTEM',

			
 
				-      activeIndex2: '1'

			
 
				+      activeIndex2: '1',

			
 
				     }

			
 
				   },

			
 
				   methods: {

			
 
				-    handleSelect (key, keyPath) {

			
 
				-      console.log(key, keyPath);

			
 
				-    }

			
 
				+    active1(){

			
 
				+      this.order1 = false;

			
 
				+      this.order_big = true;

			
 
				+      this.wisdom_nav = true;

			
 
				+      this.wisdom_big = false;

			
 
				+    },

			
 
				+    handleOpen(key, keyPath) {

			
 
				+      // this.collapse == 'false'

			
 
				+        console.log(key, keyPath);

			
 
				+      },

			
 
				+      handleClose(key, keyPath) {

			
 
				+        console.log(key, keyPath);

			
 
				+      }

			
 
				   }

			
 
				 }

			
 
				 </script>

			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->

			
 
				 <style scoped lang="less">

			
 
				+.nav{

			
 
				+  width: 1280px;

			
 
				+  position: relative;

			
 
				+  top: -64px;

			
 
				+  // margin-top: -207px;

			
 
				+  margin: auto;

			
 
				+  display: flex;

			
 
				+  justify-content: space-between;

			
 
				+  align-items: center;

			
 
				+}

			
 
				 .product-center {

			
 
				   background: url(../../../assets/image/program/bg1.jpg) no-repeat center;

			
 
				   width: 100%;

			
--- a/src/components/pages/productCenter/micro.vue
+++ b/src/components/pages/productCenter/micro.vue
@@ -13,34 +13,8 @@
 
				           <div class="product_top_con_right"></div>

			
 
				         </div>

			
 
				       </div>

			
 
				-      <!-- <div class="product_bar">

			
 
				-        <el-menu :default-active="activeIndex2" class="el-menu-demo"  @select="handleSelect" background-color="rgba(0,0,0,0)" text-color="#999999" active-text-color="#000000">

			
 
				-          <el-menu-item index="1" class="item1"  background-color="#fff">

			
 
				-            <div class="order">

			
 
				-              <div class="blue_bar"></div>

			
 
				-              <div class="product-order">产品订制</div>

			
 
				-              <div class="order_bot">

			
 
				-                <div class="order_bot_online">

			
 
				-                  <img src="../../../assets/image/logoicon/shape.png" alt="">

			
 
				-                 

			
 
				-                  <span>全渠道在线平台</span>

			
 
				-                </div>

			
 
				-                <div class="order_bot_secondHandHouse">

			
 
				-                  <img src="../../../assets/image/logoicon/huijulogo.png" alt="">

			
 
				-                  

			
 
				-                  <span>二手房管理平台</span>

			
 
				-                </div>

			
 
				-              </div>

			
 
				-            </div>

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="2" class="item2">

			
 
				-            智慧案场

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="3" class="item3">

			
 
				-            智慧社区

			
 
				-          </el-menu-item>

			
 
				-        </el-menu>

			
 
				-      </div>-->

			
 
				+      

			
 
				+      <prod-navi class="nav" default="case"></prod-navi>

			
 
				     </div>

			
 
				 

			
 
				     <div class="secondHouse-middle">

			
@@ -202,9 +176,12 @@
 
				 <script>

			
 
				 import headerTab from "@/components/commonComponents/headerTab";

			
 
				 import footerNav from "@/components/commonComponents/footerNav";

			
 
				-

			
 
				 export default {

			
 
				-  components: { headerTab, footerNav },

			
 
				+  components: {

			
 
				+    headerTab,

			
 
				+    footerNav,

			
 
				+    ProdNavi: () => import('./prodNavi'),

			
 
				+  },

			
 
				 

			
 
				   data () {

			
 
				     return {

			
@@ -212,18 +189,38 @@ export default {
 
				       P1: '传统楼书的v2.0版本',

			
 
				       P2: '利用移动设备进行房地产推广',

			
 
				       P3: 'INTELLIGENT FACE RISK CONTROL SYSTEM',

			
 
				-      activeIndex2: '1'

			
 
				+      activeIndex2: '1',    

			
 
				     }

			
 
				   },

			
 
				   methods: {

			
 
				-    handleSelect (key, keyPath) {

			
 
				-      console.log(key, keyPath);

			
 
				-    }

			
 
				+    active1(){

			
 
				+      this.order1 = false;

			
 
				+      this.order_big = true;

			
 
				+      this.wisdom_nav = true;

			
 
				+      this.wisdom_big = false;

			
 
				+    },

			
 
				+    handleOpen(key, keyPath) {

			
 
				+      // this.collapse == 'false'

			
 
				+        console.log(key, keyPath);

			
 
				+      },

			
 
				+      handleClose(key, keyPath) {

			
 
				+        console.log(key, keyPath);

			
 
				+      }

			
 
				   }

			
 
				 }

			
 
				 </script>

			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->

			
 
				 <style scoped lang="less">

			
 
				+.nav{

			
 
				+  width: 1280px;

			
 
				+  position: relative;

			
 
				+  top: -64px;

			
 
				+  // margin-top: -207px;

			
 
				+  margin: auto;

			
 
				+  display: flex;

			
 
				+  justify-content: space-between;

			
 
				+  align-items: center;

			
 
				+}

			
 
				 .product-center {

			
 
				   background: url(../../../assets/image/program/bg3.jpg) no-repeat center;

			
 
				   width: 100%;

			
--- a/src/components/pages/productCenter/online.vue
+++ b/src/components/pages/productCenter/online.vue
@@ -13,6 +13,8 @@
 
				             </div>

			
 
				           </div>

			
 
				         </div>

			
 
				+

			
 
				+        <prod-navi class="nav" default="product"></prod-navi>

			
 
				         <!-- <div class="product_bar">

			
 
				         <el-menu :default-active="activeIndex2" class="el-menu-demo"  @select="handleSelect" background-color="rgba(0,0,0,0)" text-color="#999999" active-text-color="#000000">

			
 
				           <el-menu-item index="1" class="item1"  background-color="#fff">

			
@@ -302,13 +304,17 @@
 
				     <footerNav></footerNav>

			
 
				   </div>

			
 
				 </template>

			
 
				-

			
 
				 <script>

			
 
				 import headerTab from "@/components/commonComponents/headerTab";

			
 
				 import footerNav from "@/components/commonComponents/footerNav";

			
 
				+import naviCard from "../../navicard";

			
 
				 

			
 
				 export default {

			
 
				-  components: { headerTab, footerNav },

			
 
				+  components: {

			
 
				+    headerTab,

			
 
				+    footerNav,

			
 
				+    ProdNavi: () => import('./prodNavi'),

			
 
				+  },

			
 
				 

			
 
				   data () {

			
 
				     return {

			
@@ -316,19 +322,113 @@ export default {
 
				       P1: '线上售楼处平台，连接开发商与购房者的沟通桥梁',

			
 
				       P2: '房产商借助微信小程序，基于微信生态圈，完成商业模式闭环',

			
 
				       P3: 'Professional product customization',

			
 
				-      activeIndex2: '1'

			
 
				+      activeIndex2: '1',

			
 
				+       activeCard: undefined,

			
 
				+      productOrder:

			
 
				+        {

			
 
				+          id: '1',

			
 
				+          title:  '产品订制',

			
 
				+          items: [

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/shape.png'),

			
 
				+              text: '全渠道在线平台',

			
 
				+              Url:'/productCenter/online'

			
 
				+            },

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/huijulogo.png'),

			
 
				+              text: '二手房管理平台',

			
 
				+              Url:'/productCenter'

			
 
				+            }

			
 
				+          ]

			
 
				+        },

			
 
				+        smartScenes:

			
 
				+        {

			
 
				+          id: '2',

			
 
				+          title:  '智慧案场',

			
 
				+          items: [

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/aicustomer.png'),

			
 
				+              text: 'AI迎宾判客系统',

			
 
				+              Url:'/productCenter/AIwelcome'

			
 
				+            },

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/Bitmap.png'),

			
 
				+              text: '智慧大屏机',

			
 
				+              Url:'/productCenter/bigscreen'

			
 
				+            },

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/yinchenglogo.png'),

			
 
				+              text: '全案发布平台',

			
 
				+               Url:'/productCenter/release'

			
 
				+            },

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/yuejian.png'),

			
 
				+              text: '微楼书',

			
 
				+               Url:'/productCenter/micro'

			
 
				+            },

			
 
				+          ]

			
 
				+        },

			
 
				+        smartCommunity:

			
 
				+        {

			
 
				+          id: '3',

			
 
				+          title:  '智慧社区',

			
 
				+          items: [

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/icon1.png'),

			
 
				+              text: '银城慧家APP',

			
 
				+               Url:'/productCenter/community'

			
 
				+            },

			
 
				+            {

			
 
				+              icon: require('../../../assets/image/logoicon/cityLOGO.png'),

			
 
				+              text: '城的空间',

			
 
				+               Url:'/productCenter/city'

			
 
				+            }

			
 
				+          ]

			
 
				+        }

			
 
				+    

			
 
				     }

			
 
				   },

			
 
				   methods: {

			
 
				-    handleSelect (key, keyPath) {

			
 
				-      console.log(key, keyPath);

			
 
				-    }

			
 
				+    handleCardClick({ type, item }) {

			
 
				+      console.log('--------->', type, item)

			
 
				+      this.$router.push({path:item.Url})

			
 
				+      if (type == 'card') {

			
 
				+        this.activeCard = item;

			
 
				+        console.log('......',item)

			
 
				+        

			
 
				+      } else {

			
 
				+

			
 
				+      }

			
 
				+    },

			
 
				+    active1(){

			
 
				+      this.order1 = false;

			
 
				+      this.order_big = true;

			
 
				+      this.wisdom_nav = true;

			
 
				+      this.wisdom_big = false;

			
 
				+    },

			
 
				+    handleOpen(key, keyPath) {

			
 
				+      // this.collapse == 'false'

			
 
				+        console.log(key, keyPath);

			
 
				+      },

			
 
				+      handleClose(key, keyPath) {

			
 
				+        console.log(key, keyPath);

			
 
				+      }

			
 
				   }

			
 
				 }

			
 
				 </script>

			
 
				 

			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->

			
 
				 <style scoped lang="less">

			
 
				+.nav{

			
 
				+  width: 1280px;

			
 
				+  position: relative;

			
 
				+  top: -64px;

			
 
				+  // margin-top: -207px;

			
 
				+  margin: auto;

			
 
				+  display: flex;

			
 
				+  justify-content: space-between;

			
 
				+  align-items: center;

			
 
				+}

			
 
				 .product-center {

			
 
				   // background: url(../../../assets/image/program/bg1.jpg) no-repeat center;

			
 
				   width: 100%;

			
@@ -337,7 +437,7 @@ export default {
 
				   // background-size: cover;

			
 
				 }

			
 
				 .product_center_top {

			
 
				-  background: url(../../../assets/image/program/bg1.jpg) no-repeat center;

			
 
				+  background: url(../../../assets/image/program/bg2.jpg) no-repeat center;

			
 
				   width: 100%;

			
 
				   min-width: 1260px;

			
 
				   height: 780px;

			
--- a/src/components/pages/productCenter/prodNavi.vue
+++ b/src/components/pages/productCenter/prodNavi.vue
@@ -0,0 +1,120 @@
 
				+<template>
			
 
				+  <div>
			
 
				+    <naviCard v-bind="productOrder" @click="handleCardClick" :active.sync="activeCard.product" style="width: 400px;"></naviCard>
			
 
				+    <naviCard v-bind="smartScenes" @click="handleCardClick" :active.sync="activeCard.case" style="width: 400px;"></naviCard>
			
 
				+    <naviCard v-bind="smartCommunity" @click="handleCardClick" :active.sync="activeCard.community" style="width: 400px;"></naviCard>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import naviCard from "../../navicard";
			
 
				+
			
 
				+export default {
			
 
				+  name: 'ProdNavi',
			
 
				+  components: {
			
 
				+    naviCard,
			
 
				+  },
			
 
				+  props: [
			
 
				+    'default',
			
 
				+  ],
			
 
				+  data () {
			
 
				+    return {
			
 
				+      activeCard: {
			
 
				+        product: false,
			
 
				+        case: false,
			
 
				+        community: false,
			
 
				+        [`${this.default}`]: true,
			
 
				+      },
			
 
				+      productOrder: {
			
 
				+        id: 'product',
			
 
				+        title:  '产品订制',
			
 
				+        items: [
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/shape.png'),
			
 
				+            text: '全渠道在线平台',
			
 
				+            Url:'/productCenter/online'
			
 
				+          },
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/huijulogo.png'),
			
 
				+            text: '二手房管理平台',
			
 
				+            Url:'/productCenter'
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      smartScenes: {
			
 
				+        id: 'case',
			
 
				+        title:  '智慧案场',
			
 
				+        items: [
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/aicustomer.png'),
			
 
				+            text: 'AI迎宾判客系统',
			
 
				+            Url:'/productCenter/AIwelcome'
			
 
				+          },
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/Bitmap.png'),
			
 
				+            text: '智慧大屏机',
			
 
				+            Url:'/productCenter/bigscreen'
			
 
				+          },
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/yinchenglogo.png'),
			
 
				+            text: '全案发布平台',
			
 
				+              Url:'/productCenter/release'
			
 
				+          },
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/yuejian.png'),
			
 
				+            text: '微楼书',
			
 
				+              Url:'/productCenter/micro'
			
 
				+          },
			
 
				+        ]
			
 
				+      },
			
 
				+      smartCommunity: {
			
 
				+        id: 'community',
			
 
				+        title:  '智慧社区',
			
 
				+        items: [
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/icon1.png'),
			
 
				+            text: '银城慧家APP',
			
 
				+              Url:'/productCenter/community'
			
 
				+          },
			
 
				+          {
			
 
				+            icon: require('../../../assets/image/logoicon/cityLOGO.png'),
			
 
				+            text: '城的空间',
			
 
				+              Url:'/productCenter/city'
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+    }
			
 
				+  },
			
 
				+  watch: {
			
 
				+    ['activeCard.product'] (nw, od) {
			
 
				+      if (nw && !od) {
			
 
				+        this.activeCard.case = this.activeCard.community = false
			
 
				+      }
			
 
				+    },
			
 
				+    ['activeCard.case'] (nw, od) {
			
 
				+      if (nw && !od) {
			
 
				+        this.activeCard.product = this.activeCard.community = false
			
 
				+      }
			
 
				+    },
			
 
				+    ['activeCard.community'] (nw, od) {
			
 
				+      if (nw && !od) {
			
 
				+        this.activeCard.case = this.activeCard.product = false
			
 
				+      }
			
 
				+    },
			
 
				+    default (nw) {
			
 
				+      console.log('--------->', nw)
			
 
				+      if (!nw) return
			
 
				+      this.activeCard[nw] = true
			
 
				+    }
			
 
				+  },
			
 
				+  mounted () {
			
 
				+
			
 
				+  },
			
 
				+  methods: {    
			
 
				+    handleCardClick(item) {
			
 
				+      this.$router.push({path:item.Url})
			
 
				+    },
			
 
				+  },
			
 
				+}
			
 
				+</script>
			
 
				+
			
--- a/src/components/pages/productCenter/productCenter.vue
+++ b/src/components/pages/productCenter/productCenter.vue
@@ -41,121 +41,8 @@
 
				           </el-menu-item>
			
 
				         </el-menu>
			
 
				       </div>-->
			
 
				-      <div class="nav">
			
 
				-        <div class="order_nav">
			
 
				-          <div class="tittle">
			
 
				-            <!-- <div class="blue_bar"></div> -->
			
 
				-            <div class="product-order">产品订制</div>
			
 
				-          </div>
			
 
				-          <div class="product_order_nav">
			
 
				-                <p class="online">
			
 
				-                  全渠道在线平台
			
 
				-                </p>
			
 
				-                <div class="vertical_line"></div>
			
 
				-                <p class="second_house">
			
 
				-                  二手房管理平台
			
 
				-                </p>
			
 
				-          </div>
			
 
				-        </div>
			
 
				-
			
 
				-
			
 
				-        <!-- ------------------------------------------------- -->
			
 
				-        
			
 
				-        <!-- <el-row class="tac">
			
 
				-  <el-col :span="8">
			
 
				-    <el-menu
			
 
				-      default-active="1"
			
 
				-      class="el-menu-vertical-demo"
			
 
				-      @open="handleOpen"
			
 
				-      @close="handleClose"
			
 
				-      background-color="#fff"
			
 
				-       text-color="rgba(153,153,153,1)"
			
 
				-       active-text-color="rgba(78,132,255,1)"
			
 
				-      >
			
 
				-
			
 
				-        <el-submenu index="1">
			
 
				-        <template slot="title">
			
 
				-          <div class="tittle">
			
 
				-           
			
 
				-            <div class="product-order">产品订制</div>
			
 
				-          </div>
			
 
				-        </template>
			
 
				-        <el-menu-item-group>
			
 
				-          <el-menu-item index="1-1" style="display:inline-block">
			
 
				-            <div class="order_bot_online">
			
 
				-              <img src="../../../assets/image/logoicon/shape.png" alt="">
			
 
				-              <span>全渠道在线平台</span>
			
 
				-            </div>
			
 
				-            
			
 
				-          </el-menu-item>
			
 
				-          <el-menu-item index="1-2" style="display:inline-block">
			
 
				-            <div  class="order_bot_secondHandHouse">
			
 
				-              <img src="../../../assets/image/logoicon/huijulogo.png" alt="">
			
 
				-            <span>二手房管理平台</span>
			
 
				-            </div>
			
 
				-          </el-menu-item>
			
 
				-        </el-menu-item-group>
			
 
				-      </el-submenu>
			
 
				-  
			
 
				-      
			
 
				-    </el-menu>
			
 
				-  </el-col>
			
 
				 
			
 
				-  <el-col :span="8">
			
 
				-    <el-menu
			
 
				-      default-active="1"
			
 
				-      class="el-menu-vertical-demo"
			
 
				-      @open="handleOpen"
			
 
				-      @close="handleClose"
			
 
				-      background-color="#fff"
			
 
				-       text-color="rgba(153,153,153,1)"
			
 
				-       active-text-color="rgba(78,132,255,1)"
			
 
				-      >
			
 
				-      
			
 
				-      <el-submenu index="2" >
			
 
				-        <template slot="title">
			
 
				-          <div class="tittle">
			
 
				-            
			
 
				-            <div class="product-order">产品订制</div>
			
 
				-          </div>
			
 
				-        </template>
			
 
				-        <el-menu-item-group>
			
 
				-          <el-menu-item index="2-1" style="display:inline-block">选项1</el-menu-item>
			
 
				-          <el-menu-item index="2-2" style="display:inline-block">选项2</el-menu-item>
			
 
				-        </el-menu-item-group>
			
 
				-      </el-submenu>
			
 
				-     
			
 
				-    </el-menu>
			
 
				-  </el-col>
			
 
				-
			
 
				-  <el-col :span="8">
			
 
				-    <el-menu
			
 
				-      default-active="1"
			
 
				-      class="el-menu-vertical-demo"
			
 
				-      @open="handleOpen"
			
 
				-      @close="handleClose"
			
 
				-      background-color="#fff"
			
 
				-       text-color="rgba(153,153,153,1)"
			
 
				-       active-text-color="rgba(78,132,255,1)"
			
 
				-       v-model="collapse"
			
 
				-      >
			
 
				-      <el-submenu index="3">
			
 
				-        <template slot="title">
			
 
				-          <div class="tittle">
			
 
				-          
			
 
				-            <div class="product-order">产品订制</div>
			
 
				-          </div>
			
 
				-        </template>
			
 
				-        <el-menu-item-group>
			
 
				-          <el-menu-item index="3-1" style="display:inline-block">选项1</el-menu-item>
			
 
				-          <el-menu-item index="3-2" style="display:inline-block">选项2</el-menu-item>
			
 
				-        </el-menu-item-group>
			
 
				-      </el-submenu>
			
 
				-    </el-menu>
			
 
				-  </el-col>
			
 
				-
			
 
				-</el-row> -->
			
 
				-      </div>
			
 
				+      <prod-navi class="nav" default="product"></prod-navi>
			
 
				     </div>
			
 
				     <div class="secondHouse-middle">
			
 
				       <div class="secondHouse_content">
			
@@ -213,6 +100,7 @@
 
				         </div>
			
 
				       </div>
			
 
				     </div>
			
 
				+    
			
 
				     <footerNav></footerNav>
			
 
				   </div>
			
 
				 </template>
			
@@ -220,9 +108,14 @@
 
				 <script>
			
 
				 import headerTab from "@/components/commonComponents/headerTab";
			
 
				 import footerNav from "@/components/commonComponents/footerNav";
			
 
				+// import ProdNavi from "./prodNavi";
			
 
				 
			
 
				 export default {
			
 
				-  components: { headerTab, footerNav },
			
 
				+  components: {
			
 
				+    headerTab,
			
 
				+    footerNav,
			
 
				+    ProdNavi: () => import('./prodNavi'),
			
 
				+  },
			
 
				 
			
 
				   data () {
			
 
				     return {
			
@@ -233,9 +126,21 @@ export default {
 
				       activeIndex2: '1',
			
 
				       activeName: 'first',
			
 
				       collapse:'true',
			
 
				+      order1:true,
			
 
				+      order_big:false,
			
 
				+      wisdom_nav:true,
			
 
				+      wisdom_big:false,
			
 
				+      community:true,
			
 
				+      community_big:false,
			
 
				     }
			
 
				   },
			
 
				   methods: {
			
 
				+    active1(){
			
 
				+      this.order1 = false;
			
 
				+      this.order_big = true;
			
 
				+      this.wisdom_nav = true;
			
 
				+      this.wisdom_big = false;
			
 
				+    },
			
 
				     handleOpen(key, keyPath) {
			
 
				       // this.collapse == 'false'
			
 
				         console.log(key, keyPath);
			
@@ -249,6 +154,27 @@ export default {
 
				 
			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->
			
 
				 <style scoped lang="less">
			
 
				+
			
 
				+.order_nav_big {
			
 
				+  background-color: #fff;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+.order_nav_big,.wisdom_nav_big,.community_big{
			
 
				+  width: 430px;
			
 
				+  height: 134px;
			
 
				+  box-shadow:0px 1px 14px 0px rgba(65,101,242,0.2);
			
 
				+  border-radius:10px;
			
 
				+  span{
			
 
				+    font-size: 12px;
			
 
				+  }
			
 
				+  
			
 
				+}
			
 
				+.product_order_nav_big,.case_nav_big,.community_nav_big{
			
 
				+  display: flex;
			
 
				+  justify-content: space-around;
			
 
				+}
			
 
				+
			
 
				 .nav_logo {
			
 
				   width: 414px;
			
 
				   margin: auto;
			
@@ -260,19 +186,31 @@ export default {
 
				     height: 42px;
			
 
				   }
			
 
				 }
			
 
				-.order_nav {
			
 
				-  width: 414px;
			
 
				-  height: 134px;
			
 
				+.nav{
			
 
				+  width: 1280px;
			
 
				+  position: relative;
			
 
				+  top: -64px;
			
 
				+  // margin-top: -207px;
			
 
				+  margin: auto;
			
 
				+  display: flex;
			
 
				+  justify-content: space-between;
			
 
				+  align-items: center;
			
 
				+}
			
 
				+.order_nav,.wisdom_nav,.community,.community_nav {
			
 
				+  width: 320px;
			
 
				+  height: 85px;
			
 
				   box-shadow: 0px 1px 14px 0px rgba(65, 101, 242, 0.2);
			
 
				   border-radius: 10px;
			
 
				+  // background-color: red;
			
 
				   // margin: auto;
			
 
				 }
			
 
				-.product_order_nav {
			
 
				+.product_order_nav,.case_nav,.community_nav_big {
			
 
				   // margin: 0 auto;
			
 
				   display: flex;
			
 
				   justify-content: center;
			
 
				   justify-content: space-around;
			
 
				-  
			
 
				+  color:rgba(153,153,153,1);
			
 
				+  font-size: 12px;
			
 
				 }
			
 
				 .nav1,
			
 
				 .nav2,
			
@@ -284,11 +222,13 @@ export default {
 
				   border-radius: 4px;
			
 
				 }
			
 
				 .product-center {
			
 
				-  background: url(../../../assets/image/program/bg1.jpg) no-repeat center;
			
 
				+  background: url(../../../assets/image/program/bg2.jpg) no-repeat center;
			
 
				   width: 100%;
			
 
				   min-width: 1260px;
			
 
				   height: 780px;
			
 
				+  // background-color: red;
			
 
				   background-size: cover;
			
 
				+  // border-radius: 
			
 
				 }
			
 
				 .product_box {
			
 
				   width: 1260px;
			
@@ -350,18 +290,22 @@ export default {
 
				   margin: 5px 0;
			
 
				   // line-height: 10px;
			
 
				 }
			
 
				-.order_bot_online {
			
 
				+.order_bot_online,.order_bot_secondHandHouse,.AIwelcome_big,.bigScreen_big,.yinchenglogo_big,.yuejian_big,.yincheng_big,.city_big {
			
 
				   height: 58px;
			
 
				   width: 115px;
			
 
				+  margin-top: 20px;
			
 
				   display: flex;
			
 
				-
			
 
				   flex-wrap: wrap;
			
 
				   justify-content: center;
			
 
				   align-content: space-between;
			
 
				   img {
			
 
				-    width: 35px;
			
 
				+    // width: 35px;
			
 
				     height: 42px;
			
 
				   }
			
 
				+  span{
			
 
				+    display: flex;
			
 
				+    align-content: flex-end;
			
 
				+  }
			
 
				 }
			
 
				 .blue_bar {
			
 
				   width: 73px;
			
@@ -384,6 +328,11 @@ export default {
 
				     width: 110px;
			
 
				     height: 32px;
			
 
				   }
			
 
				+  span{
			
 
				+    display: flex;
			
 
				+    align-content: flex-end;
			
 
				+    
			
 
				+  }
			
 
				 }
			
 
				 .item1,
			
 
				 .item2,
			
@@ -411,6 +360,7 @@ export default {
 
				   width: 100%;
			
 
				   // background-color: red;
			
 
				   background: url(../../../assets/image/program/bg.jpg) no-repeat center;
			
 
				+  
			
 
				   background-size: 100%;
			
 
				   .secondHouse_content {
			
 
				     width: 1260px;
			
@@ -489,6 +439,7 @@ export default {
 
				 .vertical_line{
			
 
				   // width:px;
			
 
				 height:15px;
			
 
				-border:1px solid rgba(196,196,196,1);
			
 
				+border:1px dashed rgba(196,196,196,1);
			
 
				 }
			
 
				+
			
 
				 </style>
			
--- a/src/components/pages/productCenter/release.vue
+++ b/src/components/pages/productCenter/release.vue
@@ -13,34 +13,8 @@
 
				           <div class="product_top_con_right"></div>

			
 
				         </div>

			
 
				       </div>

			
 
				-      <!-- <div class="product_bar">

			
 
				-        <el-menu :default-active="activeIndex2" class="el-menu-demo"  @select="handleSelect" background-color="rgba(0,0,0,0)" text-color="#999999" active-text-color="#000000">

			
 
				-          <el-menu-item index="1" class="item1"  background-color="#fff">

			
 
				-            <div class="order">

			
 
				-              <div class="blue_bar"></div>

			
 
				-              <div class="product-order">产品订制</div>

			
 
				-              <div class="order_bot">

			
 
				-                <div class="order_bot_online">

			
 
				-                  <img src="../../../assets/image/logoicon/shape.png" alt="">

			
 
				-                 

			
 
				-                  <span>全渠道在线平台</span>

			
 
				-                </div>

			
 
				-                <div class="order_bot_secondHandHouse">

			
 
				-                  <img src="../../../assets/image/logoicon/huijulogo.png" alt="">

			
 
				-                  

			
 
				-                  <span>二手房管理平台</span>

			
 
				-                </div>

			
 
				-              </div>

			
 
				-            </div>

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="2" class="item2">

			
 
				-            智慧案场

			
 
				-          </el-menu-item>

			
 
				-          <el-menu-item index="3" class="item3">

			
 
				-            智慧社区

			
 
				-          </el-menu-item>

			
 
				-        </el-menu>

			
 
				-      </div>-->

			
 
				+      <prod-navi class="nav" default="case"></prod-navi>

			
 
				+      

			
 
				     </div>

			
 
				 

			
 
				     <div class="secondHouse-middle">

			
@@ -188,9 +162,12 @@
 
				 <script>

			
 
				 import headerTab from "@/components/commonComponents/headerTab";

			
 
				 import footerNav from "@/components/commonComponents/footerNav";

			
 
				-

			
 
				 export default {

			
 
				-  components: { headerTab, footerNav },

			
 
				+  components: {

			
 
				+    headerTab,

			
 
				+    footerNav,

			
 
				+    ProdNavi: () => import('./prodNavi'),

			
 
				+  },

			
 
				 

			
 
				   data () {

			
 
				     return {

			
@@ -198,19 +175,39 @@ export default {
 
				       P1: '线上售楼处平台，连接开发商与购房者的沟通桥梁',

			
 
				       P2: '房产商借助微信小程序，基于微信生态圈，完成商业模式闭环',

			
 
				       P3: 'INTELLIGENT FACE RISK CONTROL SYSTEM',

			
 
				-      activeIndex2: '1'

			
 
				+      activeIndex2: '1',

			
 
				     }

			
 
				   },

			
 
				   methods: {

			
 
				-    handleSelect (key, keyPath) {

			
 
				-      console.log(key, keyPath);

			
 
				-    }

			
 
				+    active1(){

			
 
				+      this.order1 = false;

			
 
				+      this.order_big = true;

			
 
				+      this.wisdom_nav = true;

			
 
				+      this.wisdom_big = false;

			
 
				+    },

			
 
				+    handleOpen(key, keyPath) {

			
 
				+      // this.collapse == 'false'

			
 
				+        console.log(key, keyPath);

			
 
				+      },

			
 
				+      handleClose(key, keyPath) {

			
 
				+        console.log(key, keyPath);

			
 
				+      }

			
 
				   }

			
 
				 }

			
 
				 </script>

			
 
				 

			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->

			
 
				 <style scoped lang="less">

			
 
				+.nav{

			
 
				+  width: 1280px;

			
 
				+  position: relative;

			
 
				+  top: -64px;

			
 
				+  // margin-top: -207px;

			
 
				+  margin: auto;

			
 
				+  display: flex;

			
 
				+  justify-content: space-between;

			
 
				+  align-items: center;

			
 
				+}

			
 
				 .product-center {

			
 
				   background: url(../../../assets/image/program/bg3.jpg) no-repeat center;

			
 
				   width: 100%;

			
--- a/src/components/pages/solution/solution.vue
+++ b/src/components/pages/solution/solution.vue
@@ -1,14 +1,309 @@
 
				 <template>
			
 
				   <div class="solution">
			
 
				       <headerTab></headerTab>
			
 
				+        <div class="title">
			
 
				+        <p class="tit">{{title}}</p>
			
 
				+        <p class="label">{{desc}}</p>
			
 
				+        <p class="label">{{desc2}}</p>
			
 
				+        <p class="desc">{{engdesc}}</p>
			
 
				+      </div>  
			
 
				+      <div class="solution-main"> 
			
 
				+      <el-tabs class="tab-bar" v-model="activeName" @tab-click="handleClick">
			
 
				+        <el-tab-pane name="first">
			
 
				+            <span slot="label"> <img src="../../../assets/image/program/building.png" alt="">智慧案场</span>
			
 
				+            <div class="problem-box">
			
 
				+           <div class="main-box">
			
 
				+             <p class="con-tit">痛点描述</p>
			
 
				+             <span class="con-desc">Existing problem</span>
			
 
				+             <div class="img-box">
			
 
				+               <div class="img-con"><img src="../../../assets/image/wisdom/wisdom01.jpg" alt="">营销费用高效果差</div>
			
 
				+               <div class="img-con"><img src="../../../assets/image/wisdom/wisdom02.jpg" alt="">营销手段传统、数据反馈慢</div>
			
 
				+               <div class="img-con"><img src="../../../assets/image/wisdom/wisdom03.jpg" alt="">渠道商载客、大量飞单</div>
			
 
				+               <div class="img-con"><img src="../../../assets/image/wisdom/wisdom04.jpg" alt="">客户归属、划分不清</div>
			
 
				+             </div>
			
 
				+           </div>
			
 
				+           <div class="programme-box">
			
 
				+                 <p class="con-tit">解决实践</p>
			
 
				+             <span class="con-desc">The solution</span>
			
 
				+             <div class="programme-con">
			
 
				+               <img class="hudong" src="../../../assets/image/wisdom/group01.png" alt="">
			
 
				+               <img class="shuzi" src="../../../assets/image/wisdom/group02.png" alt="">
			
 
				+               <img class="zhineng" src="../../../assets/image/wisdom/group03.png" alt="">
			
 
				+               <img class="yunduan" src="../../../assets/image/wisdom/group04.png" alt="">
			
 
				+               <img class="line-one" src="../../../assets/image/wisdom/line/3.png" alt="">
			
 
				+               <img class="line-two" src="../../../assets/image/wisdom/line/2.png" alt="">
			
 
				+               <img class="line-three" src="../../../assets/image/wisdom/line/1.png" alt="">
			
 
				+               <div class="con-one text-con">
			
 
				+                 <img src="../../../assets/image/wisdom/hudong.png" alt="">
			
 
				+                 <p class="text-tit">刷脸互动，精准营销</p>
			
 
				+                 <p class="text-desc">多点部署刷脸广告机，以增加趣味性</p>
			
 
				+                 <p class="text-desc">楼盘信息精准推送</p>
			
 
				+               </div>
			
 
				+               <div class="con-two text-con">
			
 
				+                 <img src="../../../assets/image/wisdom/yinxiao.png" alt="">
			
 
				+                 <p class="text-tit">数字化营销手段更易传播</p>
			
 
				+                 <p class="text-desc">自媒体时代新工具 </p>
			
 
				+                 <p class="text-desc">楼盘信息小程序一键分享，不受时间空间限制、线上预约更方便</p>
			
 
				+               </div>
			
 
				+               <div class="con-three text-con">
			
 
				+                 <img src="../../../assets/image/wisdom/zhuapai.png" alt="">
			
 
				+                 <p class="text-tit">智能人脸、车牌抓拍</p>
			
 
				+                 <p class="text-desc">无感自适应识别，准确率达99%、专业地产案场场景设计</p>
			
 
				+                 <p class="text-desc">VIP迎宾，提升接待服务</p>
			
 
				+               </div>
			
 
				+               <div class="con-four text-con">
			
 
				+                 <img src="../../../assets/image/wisdom/pipei.png" alt="">
			
 
				+                 <p class="text-tit">云端智能匹配到数据库</p>
			
 
				+                 <p class="text-desc">自动识别标记自然访客与渠道客户、有效防止截客、飞单 </p>
			
 
				+                 <p class="text-desc">低成本，高效率</p>
			
 
				+               </div>
			
 
				+          
			
 
				+             </div>
			
 
				+           </div>
			
 
				+           <div class="best-box">
			
 
				+               <p class="con-tit">最佳方案</p>
			
 
				+             <span class="con-desc">Successful cases</span>
			
 
				+             <div class="best-con">
			
 
				+               <div class="logo">
			
 
				+                 <img src="../../../assets/image/logoicon/Bitmap.png" alt="">
			
 
				+                 <span>智慧大屏机</span>
			
 
				+               </div>
			
 
				+               <div class="logo">
			
 
				+                 <img src="../../../assets/image/logoicon/yinchenglogo.png" alt="">
			
 
				+                 <span>全案发布平台</span>
			
 
				+               </div>
			
 
				+               <div class="logo">
			
 
				+                 <img src="../../../assets/image/logoicon/aicustomer.png" alt="">
			
 
				+                 <span>AI迎宾判客系统</span>
			
 
				+               </div>
			
 
				+             </div>
			
 
				+           </div>
			
 
				+           </div>
			
 
				+           <footerNav></footerNav>
			
 
				+        </el-tab-pane>
			
 
				+        
			
 
				+        <el-tab-pane  name="second">
			
 
				+            <span slot="label"><img src="../../../assets/image/program/house.png" alt="">智慧社区</span>
			
 
				+            <div class="second-box">
			
 
				+            <div class="community-box">
			
 
				+              <p class="con-tit">智慧社区组成</p>
			
 
				+              <p class="con-desc">Smart community composition</p>
			
 
				+              <div class="community-con">
			
 
				+                <div class="make-up">
			
 
				+                  <div class="make-img">
			
 
				+                    <img src="../../../assets/image/program/community/group10.png" alt="">
			
 
				+                  </div>
			
 
				+                  <p>智能门禁</p>
			
 
				+                </div>
			
 
				+                <div class="make-up">
			
 
				+                     <div class="make-img">
			
 
				+                  <img src="../../../assets/image/program/community/group01.png" alt="">
			
 
				+                  </div>
			
 
				+                  <p>智慧出行</p>
			
 
				+                </div>
			
 
				+                <div class="make-up">
			
 
				+                  <div class="make-img">
			
 
				+                    <img src="../../../assets/image/program/community/group07.png" alt="">
			
 
				+                  </div>
			
 
				+                  <p>智慧家居</p>
			
 
				+                </div>
			
 
				+                <div class="make-up">
			
 
				+                  <div class="make-img">
			
 
				+                    <img src="../../../assets/image/program/community/group02.png" alt="">
			
 
				+                  </div>
			
 
				+                  <p>智慧安防</p>
			
 
				+                </div>
			
 
				+                <div class="make-up">
			
 
				+                  <div class="make-img">
			
 
				+                    <img src="../../../assets/image/program/community/group09.png" alt="">
			
 
				+                  </div>
			
 
				+                  <p>智慧空间</p>
			
 
				+                </div>
			
 
				+                <div class="make-up">
			
 
				+                  <div class="make-img">
			
 
				+                    <img src="../../../assets/image/program/community/group04.png" alt="">
			
 
				+                  </div>
			
 
				+                  <p>自助大堂</p>
			
 
				+                </div>
			
 
				+                <div class="make-up">
			
 
				+                  <div class="make-img">
			
 
				+                    <img src="../../../assets/image/program/community/group05.png" alt="">
			
 
				+                  </div>
			
 
				+                  <p>智慧管家</p>
			
 
				+                </div>
			
 
				+              </div>
			
 
				+            </div>
			
 
				+            <div class="page-main main-first">
			
 
				+              <p class="con-tit">智慧社区拓扑图</p>
			
 
				+              <p class="con-desc">Topology of smart community</p>
			
 
				+              <div class="page-box">
			
 
				+                <img class="smart-img" src="../../../assets/image/program/community/Resource01.png" alt="">
			
 
				+              </div>
			
 
				+            </div>
			
 
				+            <div class="page-main">
			
 
				+              <p class="con-tit" style="width:95px;height:12px">解决方案</p>
			
 
				+              <p class="con-desc">The solution</p>
			
 
				+             <img class="solution-img" src="../../../assets/image/program/community/G2.png" alt="">
			
 
				+            </div>
			
 
				+               <div class="page-main super-box">
			
 
				+                 <p class="con-tit" style="width:60px;">超脑</p>
			
 
				+              <p class="con-desc">Super brain</p>
			
 
				+              <div class="page-box"> 
			
 
				+                <img class="img-up" src="../../../assets/image/program/community/group03.png" alt="">
			
 
				+                 <img class="img-down" src="../../../assets/image/program/community/group06.png" alt="">
			
 
				+                <img class="super-img" src="../../../assets/image/program/community/Resource02.png" alt="">
			
 
				+                <div class="super-con super-one">
			
 
				+                  <p class="super-tit">整合操作系统</p>
			
 
				+                  <p class="super-desc">超脑平台一方面可以整合Windows和linux两个操作系统，通过操作系统内部署硬件厂商的软件系统来管理硬件。</p>
			
 
				+                </div>
			
 
				+                <div class="super-con super-two">
			
 
				+                  <p class="super-tit">软件整合便于管理</p>
			
 
				+                  <p class="super-desc">超脑平台通过荟房自主研发技术整合各个厂商的软件系统，形成统一的界面，便于管理社区各个硬件。</p>
			
 
				+                </div>
			
 
				+                <div class="super-con super-three">
			
 
				+                  <img src="../../../assets/image/program/community/group08.png" alt="">
			
 
				+                  <p class="super-tit">加快建设步伐</p>
			
 
				+                  <p class="super-desc">不同的社区采购的硬件类别可能不同，厂商也可能不同。此时，只需接入超脑平台，即可打破各协议标准的屏障，加快智慧社区建设步伐。</p>
			
 
				+                </div>
			
 
				+                <div class="super-con super-four">
			
 
				+                  <img src="../../../assets/image/program/community/group11.png" alt="">
			
 
				+                  <p class="super-tit">方便用户使用</p>
			
 
				+                  <p class="super-desc">对物业工作人员而言，不光免除需记住多个厂商的账号密码来进入社区各管理系统的繁杂。对于社区居民则大大提高了其用户体验，只需通过一个APP，即可在社区内畅行无阻。</p>
			
 
				+                </div>
			
 
				+              </div>
			
 
				+              <p class="super-text">智慧社区作为新形势下社会管理创新的一种新模式，充分利用物联网、云计算、移动互联网等新一代信息技术的集成应用，为社区居民提供一个安全、舒适、便利的现代化、智慧化生活环境。而作为智慧社区不可或缺的智能硬件品类繁多，产品开发还面临多种协议标准的抉择，导致归属不同厂商的的不同硬件很难做到相互兼容，限制了各智能硬件的协同集成发展，故而提出“智慧社区超脑计划”。 </p>
			
 
				+              <p class="super-text">为了更加快速有效的进行硬件对接及调试，我们倾尽开发能力打造了“超脑平台”。该平台可实现不同品牌、不同类型、不同接口的硬件设备轻松对接，对接完成后，再由超脑对接云端。在智慧社区建设中可以减轻后期开发量，缩短开发时间，提升效率。</p>
			
 
				+            </div>
			
 
				+              <div class="page-main">
			
 
				+              <p class="con-tit" style="width:120px;">智慧家居</p>
			
 
				+              <p class="con-desc">Intelligent household</p>
			
 
				+             <img class="solution-img" src="../../../assets/image/program/community/Resource08.jpg" alt="">
			
 
				+            </div>
			
 
				+              <div class="page-main">
			
 
				+              <p class="con-tit">美好生活畅想</p>
			
 
				+              <p class="con-desc">Imagine a better life</p>
			
 
				+             <img class="life-img" style="margin-top:40px;" src="../../../assets/image/program/community/Resource06.jpg" alt="">
			
 
				+             <img class="life-img" src="../../../assets/image/program/community/Resource05.jpg" alt="">
			
 
				+             <img class="life-img" src="../../../assets/image/program/community/Resource07.jpg" alt="">
			
 
				+             <img class="life-img" src="../../../assets/image/program/community/Resource04.jpg" alt="">
			
 
				+             <img class="life-img" style="margin-bottom:60px;" src="../../../assets/image/program/community/Resource03.jpg" alt="">
			
 
				+            </div>
			
 
				+            </div>
			
 
				+            <footerNav></footerNav>
			
 
				 
			
 
				-   <div>
			
 
				-
			
 
				-  解决方案
			
 
				-
			
 
				-
			
 
				-    </div>
			
 
				-    <footerNav></footerNav>
			
 
				+        </el-tab-pane>
			
 
				+        <el-tab-pane name="third">
			
 
				+            <span slot="label" ><img src="../../../assets/image/program/orderImg.png" alt="">产品定制</span>
			
 
				+            <div class="third-box">
			
 
				+          <div class="main-box">
			
 
				+             <p class="con-tit">痛点描述</p>
			
 
				+             <span class="con-desc">Existing problem</span>
			
 
				+             <div class="img-box">
			
 
				+             <div class="img-con"><img src="../../../assets/image/program/order/Bitmap.jpg" alt="">自建团队费时费力成本高</div>
			
 
				+             <div class="img-con"><img src="../../../assets/image/program/order/Bitmap2.jpg" alt="">存在技术壁垒，项目周期长</div>
			
 
				+             <div class="img-con"><img src="../../../assets/image/program/order/Bitmap3.jpg" alt="">企业业务分散，难专注</div>
			
 
				+            </div>
			
 
				+          </div>
			
 
				+             <div class="main-box">
			
 
				+             <p class="con-tit">解决方案</p>
			
 
				+             <span class="con-desc">The solution</span>
			
 
				+             <div class="label-box">
			
 
				+               <div class="label-con" :class="bgHover==1?'hover-div':''"  @mouseenter="divHover(1)">
			
 
				+                 <div class="label-img">
			
 
				+                 <img v-if="bgHover==1" src="../../../assets/image/program/order/team1.png" alt="">
			
 
				+                 <img v-if="bgHover!=1" src="../../../assets/image/program/order/team.png" alt="">
			
 
				+                 </div>
			
 
				+                 <p class="label-tit">专业开发团队</p>
			
 
				+                 <p class="label-desc">团队拥有丰富实战经验，千万金额成功项目，实力不容小觑</p>
			
 
				+               </div>
			
 
				+               <div class="label-con" :class="bgHover==2?'hover-div':''"  @mouseenter="divHover(2)">
			
 
				+                 <div class="label-img">
			
 
				+                 <img v-if="bgHover==2" src="../../../assets/image/program/order/cost1.png" alt="">
			
 
				+                 <img v-if="bgHover!=2" src="../../../assets/image/program/order/cost.png" alt="">
			
 
				+                 </div>
			
 
				+                 <p class="label-tit">开发费用透明</p>
			
 
				+                 <p class="label-desc">消除行业壁垒，信息不对称问题，价格透明，比肩行业水平</p>
			
 
				+               </div>
			
 
				+               <div class="label-con" :class="bgHover==3?'hover-div':''"  @mouseenter="divHover(3)">
			
 
				+                 <div class="label-img">
			
 
				+                 <img v-if="bgHover==3" src="../../../assets/image/program/order/time1.png" alt="">
			
 
				+                 <img v-if="bgHover!=3" src="../../../assets/image/program/order/time.png" alt="">
			
 
				+                 </div>
			
 
				+                 <p class="label-tit">高质按时交付</p>
			
 
				+                 <p class="label-desc">不随意拖延开发工期，保证高质量按时交付成品</p>
			
 
				+               </div>
			
 
				+               <div class="label-con" :class="bgHover==4?'hover-div':''"  @mouseenter="divHover(4)">
			
 
				+                 <div class="label-img">
			
 
				+                 <img v-if="bgHover==4" src="../../../assets/image/program/order/Operation.png" alt="">
			
 
				+                 <img v-if="bgHover!=4" src="../../../assets/image/program/order/Operation1.png" alt="">
			
 
				+                 </div>
			
 
				+                 <p class="label-tit">持续运营支持</p>
			
 
				+                 <p class="label-desc">按需提供软件上线后运营支持，修复漏洞服务</p>
			
 
				+               </div>
			
 
				+               <div class="label-con" :class="bgHover==5?'hover-div':''"  @mouseenter="divHover(5)">
			
 
				+                 <div class="label-img">
			
 
				+                 <img  v-if="bgHover==5" src="../../../assets/image/program/order/afterSale1.png" alt="">
			
 
				+                 <img  v-if="bgHover!=5" src="../../../assets/image/program/order/afterSale.png" alt="">
			
 
				+                 </div>
			
 
				+                 <p class="label-tit">售后服务周到</p>
			
 
				+                 <p class="label-desc">秉承顾客至上理念，全方位跟进需求，专业解答您的所有疑惑</p>
			
 
				+               </div>
			
 
				+             
			
 
				+            </div>
			
 
				+           </div>
			
 
				+               <div class="main-box">
			
 
				+             <p class="con-tit">业务范围</p>
			
 
				+             <span class="con-desc">The business scope</span>
			
 
				+             <div class="business-box">
			
 
				+               <div class="business-con" :class="colorHover==0?'hover-con':''"  @mouseenter="spanHover(0)">
			
 
				+                 <img src="../../../assets/image/program/order/web.png" alt="">
			
 
				+                 <p class="business-tit">web应用程序</p>
			
 
				+                 <p class="business-desc">基于互联网，浏览器端的应用程序</p>
			
 
				+               </div>
			
 
				+               <div class="business-con" :class="colorHover==1?'hover-con':''"  @mouseenter="spanHover(1)">
			
 
				+                 <img src="../../../assets/image/program/order/app.png" alt="">
			
 
				+                 <p class="business-tit">APP软件开发</p>
			
 
				+                 <p class="business-desc">基于iOS/Android应用开发 掌控智能终端时代</p>
			
 
				+               </div>
			
 
				+               <div class="business-con" :class="colorHover==2?'hover-con':''"  @mouseenter="spanHover(2)">
			
 
				+                 <img src="../../../assets/image/program/order/wx.png" alt="">
			
 
				+                 <p class="business-tit">微信二次开发</p>
			
 
				+                 <p class="business-desc">定制手机网站 制作 布局移动互联网</p>
			
 
				+               </div>
			
 
				+               <div class="business-con" :class="colorHover==3?'hover-con':''"  @mouseenter="spanHover(3)">
			
 
				+                 <img src="../../../assets/image/program/order/Applets.png" alt="">
			
 
				+                 <p class="business-tit">小程序/H5定制</p>
			
 
				+                 <p class="business-desc">满足各类移动营销需求</p>
			
 
				+               </div>
			
 
				+               <div class="business-con" :class="colorHover==4?'hover-con':''"  @mouseenter="spanHover(4)">
			
 
				+                 <img src="../../../assets/image/program/order/software.png" alt="">
			
 
				+                 <p class="business-tit">系统软件开发</p>
			
 
				+                 <p class="business-desc">CRM\ERP\OA等软件系统的设计开发</p>
			
 
				+               </div>
			
 
				+               <div class="business-con" :class="colorHover==5?'hover-con':''"  @mouseenter="spanHover(5)">
			
 
				+                 <img src="../../../assets/image/program/order/UI.png" alt="">
			
 
				+                 <p class="business-tit">界面品牌设计</p>
			
 
				+                 <p class="business-desc">专业高端视角页面设计 树立品牌形象</p>
			
 
				+               </div>
			
 
				+            </div>
			
 
				+          <div class="main-box">
			
 
				+             <p class="con-tit">最佳实践</p>
			
 
				+             <span class="con-desc">Successful cases</span>
			
 
				+             <div class="cases-box">
			
 
				+                    <div class="cases-con"><img src="../../../assets/image/program/order/huiju.png" alt="">二手房</div>
			
 
				+                    <div class="cases-con"><img src="../../../assets/image/program/order/quan.png" alt="">全渠道在线平台</div>
			
 
				+                    <div class="cases-con" ><img style="height:40px;margin:50px auto;" src="../../../assets/image/program/order/yuejian.png" alt="">微楼书</div>
			
 
				+                    <div class="cases-con"><img src="../../../assets/image/program/order/h5.png" alt="">H5</div>
			
 
				+                    <div class="cases-con"><img src="../../../assets/image/program/order/Applets.png" alt="">小程序</div>
			
 
				+            </div>
			
 
				+            </div>
			
 
				+            </div>
			
 
				+            </div>
			
 
				+            <footerNav></footerNav>
			
 
				+        </el-tab-pane>
			
 
				+      </el-tabs>
			
 
				+  </div>
			
 
				+    
			
 
				 
			
 
				   </div>
			
 
				 </template>
			
@@ -21,11 +316,571 @@ export default {
 
				   components: { headerTab, footerNav },
			
 
				 
			
 
				   data() {
			
 
				-    return {};
			
 
				+    return {
			
 
				+      activeName: "first",
			
 
				+      title: "智慧案场",
			
 
				+      desc: "精准营销、人脸抓取、智能判客",
			
 
				+      desc2: "",
			
 
				+      engdesc: "Intelligent face risk control system",
			
 
				+      colorHover: 2,
			
 
				+      bgHover: 3
			
 
				+    };
			
 
				+  },
			
 
				+  methods: {
			
 
				+    handleClick(tab, event) {
			
 
				+      console.log(tab, event);
			
 
				+      if (this.activeName === "second") {
			
 
				+        this.title = "智慧社区服务平台 ";
			
 
				+        this.desc = "一个全系平台，四大集群系统";
			
 
				+        this.desc2 = "";
			
 
				+        this.engdesc = "Intelligent face risk control system";
			
 
				+      } else if (this.activeName === "third") {
			
 
				+        this.title = "按需定制";
			
 
				+        this.desc = "软件开发 我们更懂你 ";
			
 
				+        this.desc2 = "我们提供的就是您想要的服务";
			
 
				+        this.engdesc = "We provide the service you want";
			
 
				+      } else {
			
 
				+        this.title = "智慧案场";
			
 
				+        this.desc = "精准营销、人脸抓取、智能判客";
			
 
				+        this.desc2 = "";
			
 
				+        this.engdesc = "Intelligent face risk control system";
			
 
				+      }
			
 
				+    },
			
 
				+
			
 
				+    spanHover(index) {
			
 
				+      this.colorHover = index;
			
 
				+    },
			
 
				+    divHover(index) {
			
 
				+      this.bgHover = index;
			
 
				+    }
			
 
				   }
			
 
				 };
			
 
				 </script>
			
 
				 
			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->
			
 
				-<style scoped>
			
 
				+<style lang="less" >
			
 
				+
			
 
				+.solution {
			
 
				+  .title {
			
 
				+    background: url("../../../assets/image/program/bannerbg.jpg") no-repeat
			
 
				+      center;
			
 
				+    width: 100%;
			
 
				+    height: 760px;
			
 
				+    background-size: 100% 100%;
			
 
				+    opacity: 1 !important;
			
 
				+    color: #fff;
			
 
				+    .tit {
			
 
				+      font-size: 64px;
			
 
				+      padding-top: 220px;
			
 
				+      font-weight: 100;
			
 
				+      line-height: 100px;
			
 
				+    }
			
 
				+    .label {
			
 
				+      font-size: 40px;
			
 
				+      line-height: 60px;
			
 
				+      font-weight: 100;
			
 
				+    }
			
 
				+    .desc {
			
 
				+      font-size: 12px;
			
 
				+      letter-spacing: 4px;
			
 
				+      line-height: 50px;
			
 
				+    }
			
 
				+  }
			
 
				+  .solution .solution-main .tab-bar{
			
 
				+    
			
 
				+  }
			
 
				+  
			
 
				+  .solution-main {
			
 
				+    width: 100%;
			
 
				+    .tab-bar {
			
 
				+      height: 110px;
			
 
				+      margin: 0 auto;
			
 
				+      
			
 
				+      background-color: #fff;
			
 
				+      border-radius: 10px;
			
 
				+      box-shadow: 0px 1px 4px 0px #4165f2;
			
 
				+      margin-top: -55px;
			
 
				+      .problem-box {
			
 
				+        background-size: 100% 7300px;
			
 
				+        background-image: -webkit-linear-gradient(#ebf1fc, #fdfcff, #e9f0fe);
			
 
				+        background: url("../../../assets/image/bg.png") no-repeat 0 70px;
			
 
				+      }
			
 
				+      .el-tabs__header {
			
 
				+        height: 100px;
			
 
				+        margin: 0;
			
 
				+        .el-tabs__active-bar {
			
 
				+          left: 10%;
			
 
				+          top: 0;
			
 
				+          // width: 95px !important;
			
 
				+          
			
 
				+          display: flex;
			
 
				+          justify-content: center;
			
 
				+          // text-align: center;
			
 
				+          height: 95px;
			
 
				+          height: 12px;
			
 
				+          border-radius:0px 0px 100px 100px;
			
 
				+          background-color: #4e84ff;
			
 
				+          width: 20px;
			
 
				+        }
			
 
				+        .el-tabs__item.is-active {
			
 
				+          color: #4e84ff;
			
 
				+        }
			
 
				+        .el-tabs__item {
			
 
				+          height: 100px;
			
 
				+          width: 230px;
			
 
				+          img {
			
 
				+            display: block;
			
 
				+            width: 22px;
			
 
				+            height: 22px;
			
 
				+            margin: 30px auto 0 auto;
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+      .main-box {
			
 
				+        width: 100%;
			
 
				+        margin-top: -120px;
			
 
				+        padding: 110px 0;
			
 
				+        .con-tit {
			
 
				+          background: repeating-linear-gradient(transparent, #4e84ff 100%);
			
 
				+          width: 120px;
			
 
				+          margin: 0 auto;
			
 
				+          font-size: 30px;
			
 
				+          color: #000;
			
 
				+          margin-top: 80px;
			
 
				+        }
			
 
				+        .con-desc {
			
 
				+          font-size: 13px;
			
 
				+          letter-spacing: 4px;
			
 
				+          line-height: 40px;
			
 
				+          color: #4e84ff;
			
 
				+        }
			
 
				+        .img-box {
			
 
				+          margin: 20px auto 0 auto;
			
 
				+          .img-con {
			
 
				+            width: 288px;
			
 
				+            height: 250px;
			
 
				+            border-radius: 6px;
			
 
				+            background-color: rgb(243, 240, 240);
			
 
				+            margin: 0 5px;
			
 
				+            display: inline-block;
			
 
				+            line-height: 50px;
			
 
				+            color: #808080;
			
 
				+            img {
			
 
				+              display: block;
			
 
				+              width: 100%;
			
 
				+              border-radius: 6px 6px 0 0;
			
 
				+            }
			
 
				+          }
			
 
				+        }
			
 
				+        .label-box {
			
 
				+          margin: 20px auto 0 auto;
			
 
				+          width: 1300px;
			
 
				+          .label-con {
			
 
				+            width: 230px;
			
 
				+            height: 160px;
			
 
				+            box-shadow: 0px 0px 4px 0px #4181f2;
			
 
				+            display: inline-block;
			
 
				+            border-radius: 4px;
			
 
				+            background-color: #fff;
			
 
				+            margin: 0 10px;
			
 
				+            .label-img {
			
 
				+              width: 40px;
			
 
				+              height: 40px;
			
 
				+              background-color: #4e84ff;
			
 
				+              border-radius: 20px;
			
 
				+              margin: -20px auto 0 auto;
			
 
				+              img {
			
 
				+                width: 22px;
			
 
				+                margin-top: 9px;
			
 
				+              }
			
 
				+            }
			
 
				+            .label-tit {
			
 
				+              font-size: 17px;
			
 
				+              color: #000;
			
 
				+              font-weight: 600;
			
 
				+              margin-top: 20px;
			
 
				+              line-height: 34px;
			
 
				+            }
			
 
				+            .label-desc {
			
 
				+              font-size: 13px;
			
 
				+              color: #808080;
			
 
				+              text-align: left;
			
 
				+              padding: 0 20px;
			
 
				+              line-height: 20px;
			
 
				+            }
			
 
				+          }
			
 
				+          .hover-div {
			
 
				+            background-color: #4e84ff;
			
 
				+            .label-tit {
			
 
				+              color: #fff;
			
 
				+            }
			
 
				+            .label-desc {
			
 
				+              color: #fff;
			
 
				+            }
			
 
				+            .label-img {
			
 
				+              background-color: #fff;
			
 
				+              box-shadow: 0px 0px 4px 0px #4181f2;
			
 
				+            }
			
 
				+          }
			
 
				+        }
			
 
				+        .business-box {
			
 
				+          margin: 30px auto;
			
 
				+          width: 816px;
			
 
				+          height: 360px;
			
 
				+          .business-con {
			
 
				+            width: 230px;
			
 
				+            height: 150px;
			
 
				+            margin: 10px 20px;
			
 
				+            float: left;
			
 
				+            border-radius: 4px;
			
 
				+            img {
			
 
				+              height: 38px;
			
 
				+              margin-top: 12px;
			
 
				+            }
			
 
				+            .business-tit {
			
 
				+              font-size: 18px;
			
 
				+              color: #000;
			
 
				+              font-weight: 600;
			
 
				+              line-height: 36px;
			
 
				+            }
			
 
				+            .business-desc {
			
 
				+              font-size: 13px;
			
 
				+              color: #444;
			
 
				+              line-height: 20px;
			
 
				+              width: 130px;
			
 
				+              margin: 0 auto;
			
 
				+            }
			
 
				+          }
			
 
				+          .hover-con {
			
 
				+            box-shadow: 0px 0px 4px 0px #4181f2;
			
 
				+          }
			
 
				+        }
			
 
				+        .cases-box {
			
 
				+          margin: 40px auto;
			
 
				+          width: 1050px;
			
 
				+          height: 30px;
			
 
				+          .cases-con {
			
 
				+            width: 190px;
			
 
				+            height: 186px;
			
 
				+            border-radius: 6px;
			
 
				+            margin: 0 10px;
			
 
				+            box-shadow: 0px 0px 4px 0px #4181f2;
			
 
				+            font-size: 18px;
			
 
				+            color: #000;
			
 
				+            float: left;
			
 
				+            img {
			
 
				+              display: block;
			
 
				+              height: 60px;
			
 
				+              margin: 40px auto;
			
 
				+            }
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+      .programme-box {
			
 
				+        // background-color: #e3e9fd;
			
 
				+        min-height: 1000px;
			
 
				+        padding-top: 80px;
			
 
				+        .con-tit {
			
 
				+          background: repeating-linear-gradient(transparent, #4e84ff 100%);
			
 
				+          width: 120px;
			
 
				+          margin: 0 auto;
			
 
				+          font-size: 30px;
			
 
				+          color: #000;
			
 
				+        }
			
 
				+        .con-desc {
			
 
				+          font-size: 13px;
			
 
				+          letter-spacing: 4px;
			
 
				+          line-height: 40px;
			
 
				+          color: #4e84ff;
			
 
				+        }
			
 
				+        .programme-con {
			
 
				+          width: 940px;
			
 
				+          min-height: 1160px;
			
 
				+          margin: 40px auto 0 auto;
			
 
				+          position: relative;
			
 
				+          .hudong {
			
 
				+            width: 300px;
			
 
				+            position: absolute;
			
 
				+            left: 80px;
			
 
				+          }
			
 
				+          .shuzi {
			
 
				+            width: 340px;
			
 
				+            position: absolute;
			
 
				+            right: 0;
			
 
				+            top: 230px;
			
 
				+          }
			
 
				+          .zhineng {
			
 
				+            width: 330px;
			
 
				+            position: absolute;
			
 
				+            left: 0;
			
 
				+            top: 550px;
			
 
				+          }
			
 
				+          .yunduan {
			
 
				+            width: 280px;
			
 
				+            position: absolute;
			
 
				+            right: 100px;
			
 
				+            top: 840px;
			
 
				+          }
			
 
				+          .line-one {
			
 
				+            width: 490px;
			
 
				+            height: 230px;
			
 
				+            position: absolute;
			
 
				+            right: 360px;
			
 
				+            top: 60px;
			
 
				+          }
			
 
				+          .line-two {
			
 
				+            width: 484px;
			
 
				+            position: absolute;
			
 
				+            left: 88px;
			
 
				+            top: 320px;
			
 
				+          }
			
 
				+          .line-three {
			
 
				+            width: 530px;
			
 
				+            position: absolute;
			
 
				+            right: 360px;
			
 
				+            top: 560px;
			
 
				+          }
			
 
				+          .text-con {
			
 
				+            text-align: left;
			
 
				+            img {
			
 
				+              width: 36px;
			
 
				+            }
			
 
				+            .text-tit {
			
 
				+              font-size: 22px;
			
 
				+              color: #000;
			
 
				+              line-height: 40px;
			
 
				+            }
			
 
				+            .text-desc {
			
 
				+              font-size: 17px;
			
 
				+              color: #808080;
			
 
				+            }
			
 
				+          }
			
 
				+          .con-one {
			
 
				+            position: absolute;
			
 
				+            right: 100px;
			
 
				+            top: 20px;
			
 
				+          }
			
 
				+          .con-two {
			
 
				+            position: absolute;
			
 
				+            left: 70px;
			
 
				+            top: 290px;
			
 
				+          }
			
 
				+          .con-three {
			
 
				+            position: absolute;
			
 
				+            right: -40px;
			
 
				+            top: 580px;
			
 
				+          }
			
 
				+          .con-four {
			
 
				+            position: absolute;
			
 
				+            left: 40px;
			
 
				+            top: 870px;
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+      .best-box {
			
 
				+        padding-top: 100px;
			
 
				+        .con-tit {
			
 
				+          background: repeating-linear-gradient(transparent, #4e84ff 100%);
			
 
				+          width: 120px;
			
 
				+          margin: 0 auto;
			
 
				+          font-size: 30px;
			
 
				+          color: #000;
			
 
				+        }
			
 
				+        .con-desc {
			
 
				+          font-size: 13px;
			
 
				+          letter-spacing: 4px;
			
 
				+          line-height: 40px;
			
 
				+          color: #4e84ff;
			
 
				+        }
			
 
				+        .best-con {
			
 
				+          width: 930px;
			
 
				+          height: 240px;
			
 
				+          margin: 60px auto 0 auto;
			
 
				+          .logo {
			
 
				+            float: left;
			
 
				+            width: 280px;
			
 
				+            height: 130px;
			
 
				+            box-shadow: 0px 0px 5px 0 #4171f2;
			
 
				+            margin: 0 15px;
			
 
				+            border-radius: 4px;
			
 
				+            img {
			
 
				+              margin-top: 30px;
			
 
				+            }
			
 
				+            span {
			
 
				+              float: right;
			
 
				+              margin: 60px 20px 0 0;
			
 
				+              font-size: 18px;
			
 
				+            }
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+      .second-box {
			
 
				+        background: url("../../../assets/image/bg.png") no-repeat 0 70px;
			
 
				+        background-size: 100% 7300px;
			
 
				+        width: 100%;
			
 
				+      }
			
 
				+      .community-box {
			
 
				+        width: 100%;
			
 
				+        margin-top: -120px;
			
 
				+        background-image: -webkit-linear-gradient(#ebf1fc, #fdfcff, #e9f0fe);
			
 
				+        padding: 110px 0;
			
 
				+        z-index: 1;
			
 
				+        .con-tit {
			
 
				+          background: repeating-linear-gradient(transparent, #4e84ff 100%);
			
 
				+          width: 180px;
			
 
				+          font-size: 30px;
			
 
				+          color: #000;
			
 
				+          margin: 90px auto 0 auto;
			
 
				+        }
			
 
				+        .con-desc {
			
 
				+          font-size: 13px;
			
 
				+          letter-spacing: 4px;
			
 
				+          line-height: 40px;
			
 
				+          color: #4e84ff;
			
 
				+        }
			
 
				+        .community-con {
			
 
				+          width: 980px;
			
 
				+          margin: 60px auto 0 auto;
			
 
				+          height: 120px;
			
 
				+
			
 
				+          .make-up {
			
 
				+            width: 100px;
			
 
				+            float: left;
			
 
				+            margin: 0 20px;
			
 
				+            .make-img {
			
 
				+              width: 50px;
			
 
				+              margin: 0 auto;
			
 
				+              height: 46px;
			
 
				+              img {
			
 
				+                width: 40px;
			
 
				+                max-height: 46px;
			
 
				+                display: block;
			
 
				+                margin: 0 auto;
			
 
				+              }
			
 
				+            }
			
 
				+
			
 
				+            p {
			
 
				+              line-height: 40px;
			
 
				+              font-size: 18px;
			
 
				+              color: #000;
			
 
				+              height: 40px;
			
 
				+            }
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+
			
 
				+      .page-main {
			
 
				+        width: 100%;
			
 
				+        padding: 20px 0;
			
 
				+        .con-tit {
			
 
				+          background: repeating-linear-gradient(transparent, #4e84ff 100%);
			
 
				+          width: 210px;
			
 
				+          font-size: 30px;
			
 
				+          color: #000;
			
 
				+          margin: 50px auto 0 auto;
			
 
				+        }
			
 
				+        .con-desc {
			
 
				+          font-size: 13px;
			
 
				+          letter-spacing: 4px;
			
 
				+          line-height: 40px;
			
 
				+          color: #4e84ff;
			
 
				+        }
			
 
				+        .page-box {
			
 
				+          width: 1000px;
			
 
				+          box-shadow: 0px 0px 6px 0px #4e6ef0;
			
 
				+          padding: 40px 0;
			
 
				+          margin: 40px auto;
			
 
				+          border-radius: 6px;
			
 
				+          background-color: #fff;
			
 
				+          .smart-img {
			
 
				+            width: 820px;
			
 
				+          }
			
 
				+        }
			
 
				+        .solution-img {
			
 
				+          width: 1000px;
			
 
				+          margin: 20px auto;
			
 
				+        }
			
 
				+        .life-img {
			
 
				+          width: 1000px;
			
 
				+        }
			
 
				+      }
			
 
				+      .main-first {
			
 
				+        padding-top: 60px;
			
 
				+      }
			
 
				+      .super-box {
			
 
				+        .page-box {
			
 
				+          position: relative;
			
 
				+          padding: 20px;
			
 
				+          margin: 40px auto 20px auto;
			
 
				+          .img-up {
			
 
				+            position: absolute;
			
 
				+            left: 20px;
			
 
				+            top: -160px;
			
 
				+            width: 36px;
			
 
				+          }
			
 
				+          .img-down {
			
 
				+            position: absolute;
			
 
				+            left: 20px;
			
 
				+            top: -40px;
			
 
				+            width: 36px;
			
 
				+          }
			
 
				+          .super-img {
			
 
				+            width: 340px;
			
 
				+          }
			
 
				+          .super-con {
			
 
				+            position: absolute;
			
 
				+            width: 260px;
			
 
				+            text-align: left;
			
 
				+            .super-tit {
			
 
				+              font-size: 16px;
			
 
				+              color: #000;
			
 
				+              line-height: 30px;
			
 
				+            }
			
 
				+            .super-desc {
			
 
				+              font-size: 13px;
			
 
				+              color: #666;
			
 
				+            }
			
 
				+            img {
			
 
				+              width: 34px;
			
 
				+            }
			
 
				+          }
			
 
				+          .super-one {
			
 
				+            left: 30px;
			
 
				+            top: 120px;
			
 
				+          }
			
 
				+          .super-two {
			
 
				+            left: 30px;
			
 
				+            top: 260px;
			
 
				+          }
			
 
				+          .super-three {
			
 
				+            right: 30px;
			
 
				+            top: 50px;
			
 
				+          }
			
 
				+          .super-four {
			
 
				+            right: 20px;
			
 
				+            top: 200px;
			
 
				+          }
			
 
				+        }
			
 
				+        .super-text {
			
 
				+          font-size: 13px;
			
 
				+          color: #666;
			
 
				+          width: 1040px;
			
 
				+          margin: 0 auto;
			
 
				+          text-align: left;
			
 
				+          line-height: 20px;
			
 
				+        }
			
 
				+      }
			
 
				+      .third-box {
			
 
				+        background: url("../../../assets/image/bg.png") no-repeat 0 90px;
			
 
				+        background-size: 100% 7100px;
			
 
				+        width: 100%;
			
 
				+        .img-box {
			
 
				+          .img-con {
			
 
				+            margin: 0 26px;
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				 </style>
			
--- a/src/main.js
+++ b/src/main.js
@@ -6,13 +6,13 @@ import router from './router'
 
				 
			
 
				 Vue.config.productionTip = false
			
 
				 
			
 
				-import 'animate.css'
			
 
				-
			
 
				+import animate from 'animate.css'
			
 
				 import 'vue-fullpage/vue-fullpage.css'
			
 
				-
			
 
				 import VueFullpage from 'vue-fullpage'
			
 
				 Vue.use(VueFullpage)
			
 
				 
			
 
				+Vue.use(animate)
			
 
				+
			
 
				 import ElementUI from 'element-ui'
			
 
				 import 'element-ui/lib/theme-chalk/index.css'
			
 
				 
			
@@ -25,6 +25,8 @@ Vue.use(ElementUI)
 
				 // })
			
 
				 
			
 
				 /* eslint-disable no-new */
			
 
				+
			
 
				+
			
 
				 new Vue({