feat(zm)初始化

src/App.vue

@@ -14,30 +14,30 @@
               <div class="visible-lg">
                 <!--  菜单栏 -->
                 <div class="col-lg-12 nav-link">
-                  <a class="navbar-brand" href="/index" style="color: #E84E47">
+                  <router-link class="navbar-brand" to="/index" tag="a" >
                     <span>首</span>
                     <span>页</span>
-                  </a>
-                  <router-link class="navbar-brand" to="/food" tag="a">
+                  </router-link>
+                  <router-link class="navbar-brand" to="/food" tag="a" >
 
                     <span>醉</span>
                     <span>面</span>
                     <span>美</span>
                     <span>食</span>
                   </router-link>
-                  <router-link class="navbar-brand" to="/food" tag="a">
+                  <router-link class="navbar-brand" to="/news" tag="a"  >
                     <span>品</span>
                     <span>牌</span>
                     <span>新</span>
                     <span>闻</span>
                   </router-link>
-                  <router-link class="navbar-brand" to="/contact" tag="a">
+                  <router-link class="navbar-brand" to="/contact" tag="a" >
                     <span>联</span>
                     <span>系</span>
                     <span>我</span>
                     <span>们</span>
                   </router-link>
-                    <router-link class="navbar-brand" to="/recruit" tag="a">
+                    <router-link class="navbar-brand" to="/recruit" tag="a"  >
                     <span>人</span>
                     <span>才</span>
                     <span>招</span>
@@ -45,7 +45,7 @@
                     </router-link>
                   <span class="navbar-brand" style="margin-right: 155px">
 
-                   <a :href="'tel:400-086-0777'">
+                   <a :href="'tel:400-878-124'">
                      <img src="./assets/image/img/mobile.png" alt style="height: 34px;width: 34px"/>
                    </a>
                     <span style="margin-left: 14px;width: 160px;text-align: center;color: #E84E47;font-size: 24px">400-878-124</span>
@@ -72,21 +72,21 @@
           </div>
         </div>
         <div class="bt3 flex-row">
-          <a class="bt3-brand " href="/index" style="color: #E84E47">
+          <router-link class="bt3-brand" to="/index" tag="a">
             <span>首页</span>
-          </a>
-          <a class="bt3-brand" href="/food">
+          </router-link>
+          <router-link class="bt3-brand" to="/food" tag="a">
             <span>醉面美食</span>
-          </a>
-          <a class="bt3-brand" href="/index">
+          </router-link>
+          <router-link class="bt3-brand" to="/news" tag="a">
             <span>品牌新闻</span>
-          </a>
-          <a class="bt3-brand" href="/contact">
+          </router-link>
+          <router-link class="bt3-brand" to="/contact" tag="a">
             <span>联系我们</span>
-          </a>
-          <a class="bt3-brand" href="/recruit">
+          </router-link>
+          <router-link class="bt3-brand" to="/recruit" tag="a">
             <span>人才招聘</span>
-          </a>
+          </router-link>
 
         </div>
 
@@ -107,7 +107,7 @@ import './assets/css/common.scss'
 export default {
   data() {
     return {
-
+      index:1
     }
   },
   created() {
@@ -121,7 +121,11 @@ export default {
 
     // window.removeEventListener('scroll', this.btn_pos)
   },
-  methods: {},
+  methods: {
+    choose(index){
+      this.index = index;
+    }
+  },
 
 
 }

src/assets/css/common.scss

@@ -9,3 +9,7 @@
   flex-flow: column nowrap;
   justify-content: left;
 }
+
+.router-link-active{
+  color: #E84E47!important;
+}

src/assets/css/index-banner.scss

@@ -44,7 +44,6 @@
         height: 100px;
         color: #303030;
         margin-left: 80PX;
-
         display: flex;
         flex-flow: row nowrap;
         justify-content: left;

src/assets/css/news.scss

@@ -0,0 +1,19 @@
+
+#news {
+  width: 100%;
+
+}
+
+.news-bg{
+  width: 100%;
+  height: 1450px;
+  background-color: #ffffff;
+  padding: 0px 160px;
+  box-sizing: border-box;
+}
+.news-bottom{
+  width: 100%;
+  margin-top: 130px;
+}
+
+

src/router/index.js

@@ -4,6 +4,7 @@ import index from '../views/index.vue'
 import food from '../views/food.vue'
 import contact from '../views/contact.vue'
 import recruit from '../views/recruit.vue'
+import news from '../views/news.vue'
 
 Vue.use(VueRouter)
 
@@ -36,6 +37,16 @@ const routes = [{
         }
     },
     {
+        path: '/news',
+        component: news,
+        name: 'news',
+        meta: {
+            title: '醉面美食【唯一官网】',
+            keyword: '醉面美食,',
+            description: '北京肉酱面品类领先者,加盟咨询热线400-878-124.'
+        }
+    },
+    {
         path: '/contact',
         component: contact,
         name: 'contact',

src/views/news.vue

@@ -0,0 +1,53 @@
+<template>
+  <div style="overflow:hidden">
+    <div id="news">
+
+
+      <div class="news-bg">
+        <img src="../assets/image/img/news.png" alt="" style="width: 100%">
+        <div class="news-bottom" style="align-items: center">
+
+          <div>
+
+          </div>
+
+        </div>
+      </div>
+
+
+    </div>
+  </div>
+</template>
+
+<script>
+import '../assets/css/news.scss'
+
+export default {
+  data() {
+    return {}
+  },
+  created() {
+
+  },
+
+  mounted: function () {
+
+
+  },
+  methods: {},
+  destroyed() {
+
+  },
+  components: {
+    // introduce,
+    // shopthumb,
+    // productthumb,
+    // "el-card": Card
+  }
+}
+
+
+</script>
+
+<style lang="scss">
+</style>