pda搭建文档

notes.md

+### pda端搭建步骤
+
+（web端更改为pda端）
+
+####   1. 左侧菜单栏调整
+
+① 首先默认左侧菜单栏隐藏，sidebar.opened = false
+
+② header.vue文件内设置menuState属性（控制左侧菜单栏显示还是隐藏），通过hamburger组件点击事件，每次点击取反并存储vuex
+
+③layout/index文件下通过vuex存储的menuState属性来控制菜单栏显示和隐藏时的样式
+
+```
+<sidebar class="sidebar-container" :style="{display:sidebarType ? 'block':'none'}" />
+<div class="main-container" :style="{marginLeft:sidebarType ? '54px':'0px'}">
+  <div class="nav-container fixed-header" :style="{width:sidebarType ? 'calc(100% - 63px)':'calc(100% - 12px)'}">
+  
+    computed: {
+    sidebarType() {
+      return this.$store.state.app.menuState
+    },
+    }
+```
+
+#### 2.页面整体宽度调整
+
+```
+#app {
+  height: 100%;
+  overflow-x: hidden;
+  min-width: 300px;（设置的页面最小宽度）
+}
+```
+