Merge branch 'master' of https://github.com/Zebzhong/weichen

Author: Zebzhong

build/logo.png

@@ -1,6 +1,6 @@
 <template>
   <header>
-    <router-link class="goback"></router-link>
+    <!-- <router-link to= class="goback"></router-link> -->
     <div class="header-content">
       <slot></slot>
     </div>

src/components/Header.vue

@@ -0,0 +1,13 @@
+<template>
+  <div id="myNote">
+    我的纸条
+  </div>
+</template>
+<script>
+export default {
+  name: 'myNote',
+  data () {
+    return {}
+  }
+}
+</script>

src/page/note/myNote.vue

@@ -0,0 +1,13 @@
+<template>
+  <div id="noteCommunity">
+    纸条社区
+  </div>
+</template>
+<script>
+export default {
+  name: 'noteCommunity',
+  data () {
+    return {}
+  }
+}
+</script>

src/page/note/noteCommunity.vue

@@ -1,19 +1,23 @@
 <template>
   <div>
-      <myheader>
-          <div class="tab-nav">
-              <a>纸条</a>
-              <a>作业</a>
-          </div>
+      <myheader class="header">
+        <div class="tab-nav">
+          <span @click="tabNavActive = !tabNavActive" class="tab-nav-item" :class="tabNavActive?'active':''">纸条</span>
+          <span @click="tabNavActive = !tabNavActive" class="tab-nav-item" :class="!tabNavActive?'active':''">作业</span>
+        </div>
       </myheader>
       <div class="tab-content">
-          <div>
-              <div>
-                  <router-link>纸条社区</router-link>
+          <div v-if="tabNavActive">
+              <div id="tab-btn">
+                  <router-link to="community">纸条社区</router-link>
+                  <router-link to="myNote">我的纸条</router-link>
+                  <router-link to="writeNote">去贴纸条</router-link>
               </div>
               <router-view></router-view>
           </div>
-          <div></div>
+          <div v-if="!tabNavActive">
+            作业
+          </div>
       </div>
 
       <foot-bottom :active=1></foot-bottom>
@@ -24,10 +28,54 @@ import footBottom from '@/components/Footer'
 import myheader from '@/components/Header'
 export default {
   data () {
-    return {}
+    return {
+      tabNavActive: true
+    }
   },
   components: {
     footBottom, myheader
   }
 }
 </script>
+<style scoped lang="scss">
+@import '../../style/variable.scss';
+  .header {
+    .tab-nav {
+      .tab-nav-item{
+        padding: 5px 40px;
+        background-color: $green;
+        border-radius: 5px;
+        border: 1px solid #ffffff;
+        color: #ffffff;
+        margin-left: -11px;
+        &:first-child{
+          border-top-right-radius: 0;
+          border-bottom-right-radius: 0;
+        }
+        &:last-child{
+          border-top-left-radius: 0;
+          border-bottom-left-radius: 0;
+        }
+      }
+      .active{
+        background-color: #ffffff;
+        color: $green;
+      }
+    }
+  }
+  .tab-content{
+    #tab-btn{
+      display: flex;
+      a{
+        flex: 1;
+        text-align: center;
+        padding: 10px;
+        border-bottom: 4px solid $backgroundColor;
+      }
+      .router-link-active{
+        color: $orange;
+        border-bottom-color: $orange;
+      }
+    }
+  }
+</style>

src/page/note/noteIndex.vue

@@ -0,0 +1,13 @@
+<template>
+  <div id="writeNote">
+    去贴纸条
+  </div>
+</template>
+<script>
+export default {
+  name: 'writeNote',
+  data () {
+    return {}
+  }
+}
+</script>

src/page/note/writeNote.vue

@@ -2,7 +2,10 @@ const home = r => require.ensure([], () => r(require('@/page/home/Home')), 'home
 const lesson = r => require.ensure([], () => r(require('@/page/home/Lesson')), 'lesson')
 const noteIndex = r => require.ensure([], () => r(require('@/page/note/noteIndex')), 'noteIndex')
 const lessonTable = r => require.ensure([], () => r(require('@/page/lessontable/Lessontable')), 'lessonTable')
-
+const noteCommunity = r => require.ensure([], () => r(require('@/page/note/noteCommunity')), 'noteCommunity')
+const myNote = r => require.ensure([], () => r(require('@/page/note/myNote')), 'myNote')
+const writeNote = r => require.ensure([], () => r(require('@/page/note/writeNote')), 'writeNote')
+// writeNote
 export default {
   routes: [
     {
@@ -19,7 +22,25 @@ export default {
     },
     {
       path: '/noteIndex',
-      component: noteIndex
+      component: noteIndex,
+      children: [
+        {
+          path: '',
+          redirect: 'community'
+        },
+        {
+          path: 'community',
+          component: noteCommunity
+        },
+        {
+          path: 'myNote',
+          component: myNote
+        },
+        {
+          path: 'writeNote',
+          component: writeNote
+        }
+      ]
     },
     {
       path: '/lessonTable',