我要申请商品条码切图40%

src/assets/css/_style.scss

@@ -4,7 +4,7 @@ $theme-color1:#F26335;
 $bg-color:#fff;
 
 $side-bg-color: #FEFEFE;
-$side-menu-active-color: #ffb73f;
+$side-menu-active-color: rgba(242, 99, 53, 0.09);
 
 $content-bg-color: #eeebf0;
 

src/assets/css/layout.scss

@@ -120,14 +120,7 @@
 				color: $side-bg-color;
 				background: $side-menu-active-color;
 			}
-			&.is-active {
-				border-radius: 0px 25px 25px 0px;
-				box-shadow: 0px 5px 5px 0px #0D0D0408;
-				margin-right: -8px;
-				i {
-					right: 23px;
-                }
-			}
+			
 		}
 	}
 }

src/main.js

@@ -9,7 +9,7 @@ import './plugins/element.js'
 import './plugins/qrcode.js'
 import "./assets/css/main.scss"
 import "./assets/css/layout.scss"
-import "./assets/css/element-variables.scss"
+// import "./assets/css/element-variables.scss"
 // 公共样式、布局样式
 
 // 主题色调修改在assets/_style.scss  修改里面的变量即可

src/router/index.js

@@ -40,6 +40,24 @@ const routes = [
                         component: () => import("@/views/Org/Branch.vue")
                     }
                 ],
+            },
+            {
+                path: "/Business",
+                name: "Business",
+                meta: {
+                    name: "业务大厅",
+                },
+                component: () => import("@/views/Business/index"),
+                children: [
+                    {
+                        path: "/Business/Register",
+                        name: "Register",
+                        meta: {
+                            name: "地方编码分支机构",
+                        },
+                        component: () => import("@/views/Business/Register.vue")
+                    }
+                ],
             }
         ]
     },

src/views/Business/Register.vue

+<template>
+    <div class="register">
+        <div class="container">
+            <div class="zxzc-btn">在线注册</div>
+            <img src="../../assets/image/business/barcode-register.png" class="barcode-register" alt="">
+        </div>
+    </div>
+</template>
+<style lang="scss" scoped>
+.register{
+    background: #fff;
+    padding: 20px 0;
+    .zxzc-btn{
+        height: 44px;
+        line-height: 44px;
+        background: #F26335;
+        border-radius: 4px;
+        color: #FFFFFF;
+        font-size: 14px;
+        text-align: center;
+        
+    }
+    .barcode-register{
+            width: 100%;
+            margin-top: 20px;
+        }
+}
+</style>
\ No newline at end of file

src/views/Business/index.vue

 <template>
-  <div></div>
+  <div class="org container">
+    <breadcrumb/>
+    <div class="row">
+      <div class="col-lg-3">
+        <left2/>
+      </div>
+      <div class="col-lg-6">
+        <router-view></router-view>
+      </div>
+      <div class="col-lg-3">
+        右侧
+      </div>
+    </div>
+  </div>
 </template>
-
 <script>
-</script>
+import left2 from '../comps/left2.vue'
+import breadcrumb from '../comps/breadcrumb.vue'
 
-<style lang="scss">
+export default {
+  components: {
+    left2,
+    breadcrumb,
+  },
+  data() {
+    return {};
+  },
+  created() {
+    console.log(this.$route, "this.$route");
+  },
+};
+</script>
+<style lang="scss" scoped>
 </style>
\ No newline at end of file

src/views/comps/left2.vue

+<template>
+  <el-menu
+    default-active="2"
+    class="el-menu-vertical"
+    :collapse="false"
+    mode="vertical"
+    :default-openeds="defaultOpeneds"
+    @open="handleOpen"
+    @close="handleClose"
+  >
+    <el-submenu index="1">
+      <template slot="title">
+        <span>我还不是系统成员</span>
+      </template>
+      <el-menu-item-group>
+        <el-menu-item index="1-1">我要申请商品条码</el-menu-item>
+        <el-menu-item index="1-2">选项2</el-menu-item>
+      </el-menu-item-group>
+    </el-submenu>
+    <el-submenu index="2">
+      <template slot="title">
+        <span>我是系统成员</span>
+      </template>
+      <el-menu-item-group>
+        <el-menu-item index="2-1">我要培训——现场培训/线上培训</el-menu-item>
+        <el-menu-item index="2-2">选项2</el-menu-item>
+      </el-menu-item-group>
+    </el-submenu>
+  </el-menu>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      defaultOpeneds: ["1", "2"],
+    };
+  },
+  methods: {
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath);
+    },
+  },
+};
+</script>
+<style lang="scss">
+.el-menu{
+		border-right: none;
+		background: $side-bg-color;
+        .el-submenu__title {
+            background: $side-bg-color;
+        }
+		.menu-title {
+			margin-top: 25px;
+			margin-bottom: 10px;
+			padding-left: 28px;
+			font-size: 12px;
+			color:#B7B6B6;
+		}
+		.el-menu-item {
+			height: 50px;
+			line-height: 50px;
+			color: #6B6A6A;
+			background: transparent;
+			font-size: 16px;
+			i {
+				color: $side-bg-color;
+				font-size: 25px;
+				position: absolute;
+				top: 15px;
+				right: 15px;
+			}
+			&:hover,
+			&:focus,
+			&.is-active {
+				color: #F26335;
+				background: $side-menu-active-color;
+                border-right: 3px solid #F26335;
+			}
+			
+		}
+}
+</style>
\ No newline at end of file