From 7a94cc5c5db1f49372a4fcae3e6a69722375e503 Mon Sep 17 00:00:00 2001
From: iizmg <Cqsvw1234567890>
Date: Fri, 22 May 2020 10:11:05 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=96=87=E7=AB=A0=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E7=9A=84=E5=85=A5=E5=8F=A3(=E8=BF=98=E6=9C=AA?=
 =?UTF-8?q?=E5=BC=80=E5=8F=91),=E8=8F=9C=E5=8D=95=E5=BC=B9=E5=87=BA?=
 =?UTF-8?q?=E6=A0=8F=E7=82=B9=E5=87=BB=E6=9F=90=E4=B8=AA=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E5=90=8E=E8=87=AA=E5=8A=A8=E5=85=B3=E9=97=AD,=E4=BF=AE?=
 =?UTF-8?q?=E5=A4=8D=E8=BF=94=E5=9B=9E=E9=A1=B6=E9=83=A8=E6=97=A0=E6=95=88?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 admin/src/App.vue                 | 14 ++++++---
 admin/src/components/article.vue  | 49 +++++++++++++++++++++++++++++++
 admin/src/components/leftMenu.vue |  5 ++++
 admin/src/router/index.js         |  5 ++++
 4 files changed, 69 insertions(+), 4 deletions(-)
 create mode 100644 admin/src/components/article.vue

diff --git a/admin/src/App.vue b/admin/src/App.vue
index 912a886..446d6a0 100644
--- a/admin/src/App.vue
+++ b/admin/src/App.vue
@@ -79,12 +79,12 @@
       <el-container :style="mainChildElContainerStyle">
         <el-aside v-show="elAsideShow" width="240px">
           <el-scrollbar style="height:100%;">
-            <left-menu :data="menu"></left-menu>
+            <left-menu :data="menu" @leftMenuSelect="leftMenuSelectHandle"></left-menu>
           </el-scrollbar>
         </el-aside>
         <el-container :style="mainChildElContainerStyle">
-          <el-scrollbar style="height:100%;width: 100%;">
-            <el-backtop :style="backtopStyle" target=".el-scrollbar__wrap">
+          <el-scrollbar class="main-el-scrollbar" style="height:100%;width: 100%;">
+            <el-backtop :style="backtopStyle" target=".main-el-scrollbar .el-scrollbar__wrap">
               <i class="el-icon-caret-top"></i>
             </el-backtop>
             <el-main>
@@ -119,7 +119,7 @@
             <span slot="title">功能菜单</span>
             <el-divider></el-divider>
           </div>
-          <left-menu :data="menu"></left-menu>
+          <left-menu :data="menu" @leftMenuSelect="leftMenuSelectHandle"></left-menu>
         </el-scrollbar>
       </div>
     </el-drawer>
@@ -292,6 +292,12 @@
       //菜单按钮点击
       mainMenuBtnClick() {
         this.leftMenuDrawerShow = true;
+      },
+      //左边的菜单选择
+      leftMenuSelectHandle() {
+        if (this.leftMenuDrawerShow) {
+          this.leftMenuDrawerShow = false;
+        }
       }
     }
   }
diff --git a/admin/src/components/article.vue b/admin/src/components/article.vue
new file mode 100644
index 0000000..46afd3d
--- /dev/null
+++ b/admin/src/components/article.vue
@@ -0,0 +1,49 @@
+<template>
+  <div class="article">
+    <el-card class="searcBar">
+      searchBar
+    </el-card>
+    <el-card class="listBar">
+      <ul v-infinite-scroll="load">
+        <li v-for="i in count" :key="i">{{ i }}</li>
+      </ul>
+    </el-card>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "article",
+    data() {
+      return {
+        count: 0
+      }
+    },
+    methods: {
+      load() {
+        if (this.count < 500) {
+          console.log('load');
+          this.count += 10;
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .article {
+    padding: 10px 10px 10px 10px;
+
+    .el-card {
+      border-radius: 0px;
+    }
+
+    .searcBar {
+
+    }
+
+    .listBar {
+      margin-top: 10px;
+    }
+  }
+</style>
diff --git a/admin/src/components/leftMenu.vue b/admin/src/components/leftMenu.vue
index 71b5cb0..d2e853a 100644
--- a/admin/src/components/leftMenu.vue
+++ b/admin/src/components/leftMenu.vue
@@ -5,6 +5,10 @@
         <i class="el-icon-menu"></i>
         <span slot="title">首页</span>
       </el-menu-item>
+      <el-menu-item index="article">
+        <i class="el-icon-edit-outline"></i>
+        <span slot="title">文章</span>
+      </el-menu-item>
       <div v-if="data">
         <left-menu-item :data="data"></left-menu-item>
       </div>
@@ -33,6 +37,7 @@
         if (this.$route.name !== index) {
           this.$router.push({name: index});
         }
+        this.$emit('leftMenuSelect', index);
       }
     }
   }
diff --git a/admin/src/router/index.js b/admin/src/router/index.js
index 83f9cd7..2281cc8 100644
--- a/admin/src/router/index.js
+++ b/admin/src/router/index.js
@@ -6,6 +6,11 @@ export default new VueRouter({
       path: '/',
       name: 'home',
       component: () => import('../components/home'),
+    },
+    {
+      path: '/article',
+      name: 'article',
+      component: () => import('../components/article'),
     }
   ]
 });