v1.10.0

smart-admin-web/src/components/main/components/header-bar/header-bar.less

@@ -12,3 +12,8 @@
     }
   }
 }
+
+
+.step-bottom-btn{
+  width: 380px !important;
+}

smart-admin-web/src/components/main/components/header-bar/header-bar.vue

@@ -6,7 +6,7 @@
       icon="icon iconfont icondaohangzhedie"
     />
 
-    <div class="custom-bread-crumb" style="margin-left: 30px;">
+    <div class="custom-bread-crumb" style="margin-left: 30px;" id="topMenuSelectDiv">
       <div class="ivu-breadcrumb" >
          <Dropdown @on-click="changeTopMenu">
           <a href="javascript:void(0)" style="font-size:15px;font-weight:600">
@@ -35,6 +35,11 @@
     <div class="custom-content-con">
       <slot></slot>
     </div>
+
+    <e-guide-layer
+      :current-index.sync="guideActiveIndex"
+      :guide-list="guideList"
+    />
   </div>
 </template>
 <script>
@@ -64,6 +69,27 @@ export default {
       required:true
     }
   },
+  data(){
+    return {
+      guideActiveIndex: 0,
+      guideList: [
+        {
+          confirmBtnText: '第一步：选择顶级菜单（SmartAdmin是支持四级菜单的哦）',
+          targetDom: '#topMenuSelectDiv',
+          clickHandle: () => {
+            this.guideActiveIndex = 1
+          },
+        },
+        {
+          confirmBtnText: '第二步：选择顶级下单下的三级菜单',
+          targetDom: '.side-menu-wrapper',
+          clickHandle: () => {
+            this.guideActiveIndex = 2
+          }
+        }
+      ],
+    }
+  },
   computed: {
     // 面包屑集合
     breadCrumbList() {
@@ -80,3 +106,5 @@ export default {
   }
 };
 </script>
+
+

smart-admin-web/src/main.js

@@ -23,9 +23,13 @@ import enumInfo from '@/constants';
 // 处理table操作按钮
 import tableAction from './lib/table-action';
 
-//时间
+// 时间
 import moment from 'moment';
 
+import 'e-guide-layer/dist/e-guide-layer.css'
+import eGuideLayer from 'e-guide-layer'
+
+Vue.use(eGuideLayer);
 
 Vue.prototype.$tableAction = tableAction;
 Vue.use(Enum, { enumInfo });