浏览代码

no message

ZhouFeng 3 年之前
父节点
当前提交
9f1029f149
共有 6 个文件被更改,包括 129 次插入8 次删除
  1. 1 0
      README.md
  2. 45 5
      src/common/sider.vue
  3. 0 0
      src/components/orderSearch.vue
  4. 34 0
      src/components/set.vue
  5. 34 0
      src/components/shopInfo.vue
  6. 15 3
      src/router/index.js

+ 1 - 0
README.md

@@ -19,3 +19,4 @@ npm run build --report
 ```
 
 For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
+

+ 45 - 5
src/common/sider.vue

@@ -5,7 +5,7 @@
           <img src="/static/image/logo.png" class="logo" />
         </div>
         <el-menu class="sidebar-el-menu" :default-active="$route.path" :collapse="collapse" background-color="#00152A"
-          text-color="#bfcbd9" active-text-color="#20a0ff" unique-opened router>
+          text-color="#bfcbd9" active-text-color="#20a0ff" router>
           <template v-for="item in items">
             <template v-if="item.children">
               <el-submenu :index="item.path" :key="item.path">
@@ -27,7 +27,7 @@
             <template v-else>
               <el-menu-item :index="item.path" :key="item.path">
                 <!-- <i :class="[item.icon,'aliFamily']"></i> -->
-                <img :src="item.icon" v-if="item.icon" />
+                <img :src="item.icon" class="side-bar-icon" v-if="item.icon" />
                 <span slot="title">{{ item.title }}</span>
               </el-menu-item>
             </template>
@@ -44,12 +44,51 @@
     data() {
       return {
         collapse: false,
-        items: []
+        //items: []
+        items: [
+          {
+            path: '/',
+            name: 'home',
+            title: '一键发单',
+            icon: '/static/image/order-icon.png',
+            children: [
+              {
+                path: '/',
+                name: 'HomeIndex',
+                title: '订单列表',
+              },
+              {
+                path: '/orderSearch',
+                name: 'orderSearch',
+                title: '订单查询',
+              }
+            ]
+          },
+          {
+            path: '/shopInfo',
+            name: 'shopInfo',
+            title: '商家信息',
+            icon: '/static/image/order-icon.png',
+            children: [
+              {
+                path: '/shopInfo/shopInfos',
+                name: 'shopInfos',
+                title: '订单列表',
+              }
+            ]
+          },
+          {
+            path: '/setUp/set',
+            name: 'setUp',
+            title: '设置',
+            icon: '/static/image/order-icon.png'
+          }
+        ]
       }
     },
     created() {
       console.log(router.options.routes)
-      this.items = [...router.options.routes];
+      //this.items = [...router.options.routes];
       // 通过 Event Bus 进行组件间通信,来折叠侧边栏
       bus.$on('collapse', msg => {
         this.collapse = msg
@@ -59,12 +98,13 @@
   }
 </script>
 
-<style scoped>
+<style lang='scss' scoped='scoped'>
   /deep/ .el-submenu .el-menu-item {
     padding-left: 76px !important;
   }
   /deep/ .el-menu-item.is-active {
     color: #fff !important;
+    background-color: #0C2B47 !important;
     border-right: 6px solid #009CFF;
   }
   .sidebar {

src/components/HelloWorld.vue → src/components/orderSearch.vue


+ 34 - 0
src/components/set.vue

@@ -0,0 +1,34 @@
+<template>
+  <div>
+    我是SET页
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'HelloWorld',
+  data () {
+    return {
+      msg: 'Welcome to Your Vue.js App'
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+h1, h2 {
+  font-weight: normal;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>

+ 34 - 0
src/components/shopInfo.vue

@@ -0,0 +1,34 @@
+<template>
+  <div>
+    我是Hello World页
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'HelloWorld',
+  data () {
+    return {
+      msg: 'Welcome to Your Vue.js App'
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+h1, h2 {
+  font-weight: normal;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>

+ 15 - 3
src/router/index.js

@@ -19,10 +19,22 @@ const router = new Router({
           component: () => import('../components/Home.vue')
         },
         {
-          path: '/helloWorld',
-          name: 'helloWorld',
+          path: '/orderSearch',
+          name: 'orderSearch',
           title: '订单查询',
-          component: () => import('../components/HelloWorld.vue')
+          component: () => import('../components/orderSearch.vue')
+        },
+        {
+          path: '/setUp/set',
+          name: 'set',
+          title: '订单',
+          component: () => import('../components/set.vue')
+        },
+        {
+          path: '/shopInfo/shopInfos',
+          name: 'shopInfos',
+          title: '列表',
+          component: () => import('../components/shopInfo.vue')
         }
       ]
     }