From 1565392ad3fb35498937687caecb35b7bc12633b Mon Sep 17 00:00:00 2001
From: toesbieya <1647775459@qq.com>
Date: Sun, 24 May 2020 23:24:01 +0800
Subject: [PATCH] =?UTF-8?q?=E5=93=8D=E5=BA=94=E5=BC=8F=E5=B0=8F=E6=94=B9?=
 =?UTF-8?q?=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 vue/src/assets/styles/display.scss         |  5 +++++
 vue/src/assets/styles/index.scss           | 12 ++++++++++++
 vue/src/assets/styles/sidebar.scss         |  2 ++
 vue/src/bizComponents/SearchForm/index.vue |  7 ++++++-
 vue/src/layout/components/Navbar/index.vue | 18 ++++++++----------
 vue/src/layout/mixin/ResizeHandler.js      | 14 +++++++++-----
 vue/src/views/purchase/inbound/index.vue   |  2 +-
 vue/src/views/purchase/order/index.vue     |  2 +-
 vue/src/views/sell/order/index.vue         |  2 +-
 vue/src/views/sell/outbound/index.vue      |  2 +-
 vue/src/views/stock/current/index.vue      |  2 +-
 vue/src/views/system/customer/index.vue    |  2 +-
 vue/src/views/system/role/index.vue        |  2 +-
 vue/src/views/system/supplier/index.vue    |  2 +-
 vue/src/views/system/user/index.vue        |  2 +-
 15 files changed, 51 insertions(+), 25 deletions(-)
 create mode 100644 vue/src/assets/styles/display.scss

diff --git a/vue/src/assets/styles/display.scss b/vue/src/assets/styles/display.scss
new file mode 100644
index 0000000..213b1c5
--- /dev/null
+++ b/vue/src/assets/styles/display.scss
@@ -0,0 +1,5 @@
+@media only screen and (max-width: 768px) {
+    .hidden-xs {
+        display: none !important
+    }
+}
diff --git a/vue/src/assets/styles/index.scss b/vue/src/assets/styles/index.scss
index 2dbf271..d2bd9dd 100644
--- a/vue/src/assets/styles/index.scss
+++ b/vue/src/assets/styles/index.scss
@@ -1,5 +1,6 @@
 @import "variables";
 @import "~element-ui/packages/theme-chalk/src/index";
+@import 'display';
 @import "transition";
 @import "element-ui";
 @import "nprogress";
@@ -181,4 +182,15 @@ a:hover {
     }
 }
 
+.button-group {
+    .el-button {
+        margin-top: 10px;
+        margin-right: 10px;
+
+        & + .el-button {
+            margin-left: 0;
+        }
+    }
+}
+
 
diff --git a/vue/src/assets/styles/sidebar.scss b/vue/src/assets/styles/sidebar.scss
index 4d7b054..73559c8 100644
--- a/vue/src/assets/styles/sidebar.scss
+++ b/vue/src/assets/styles/sidebar.scss
@@ -30,6 +30,8 @@ $iconSize: 17px;
     //自动隐藏
     &.hide-sidebar {
         width: 0;
+        pointer-events: none;
+        transform: translateX(-$sideBarWidth);
     }
 
     .sidebar-logo-container {
diff --git a/vue/src/bizComponents/SearchForm/index.vue b/vue/src/bizComponents/SearchForm/index.vue
index 8b66a8e..bde4789 100644
--- a/vue/src/bizComponents/SearchForm/index.vue
+++ b/vue/src/bizComponents/SearchForm/index.vue
@@ -1,4 +1,6 @@
 <script type="text/jsx">
+    import {debounce} from "@/utils"
+
     export default {
         name: "SearchForm",
         provide() {
@@ -36,6 +38,7 @@
             }
         },
         mounted() {
+            this.resize = debounce(this.resize)
             this.resize()
             window.addEventListener('resize', this.resize)
         },
@@ -44,7 +47,7 @@
         },
         render() {
             const slots = this.$slots.default
-            let collapseChildren = []
+            const collapseChildren = []
             if (this.showCollapse) {
                 collapseChildren.push(
                     <el-collapse-transition>
@@ -86,6 +89,8 @@
 
 <style lang="scss">
     .searchForm {
+        margin-bottom: -15px;
+
         .searchForm__collapse {
             position: relative;
             bottom: 20px;
diff --git a/vue/src/layout/components/Navbar/index.vue b/vue/src/layout/components/Navbar/index.vue
index 0b8a6cb..c2a81d9 100644
--- a/vue/src/layout/components/Navbar/index.vue
+++ b/vue/src/layout/components/Navbar/index.vue
@@ -5,11 +5,11 @@
         <breadcrumb v-if="showBreadcrumb"/>
 
         <div class="right-menu">
-            <search id="header-search" class="right-menu-item"/>
+            <search id="header-search" class="right-menu-item hidden-xs"/>
 
-            <fullscreen v-model="fullscreen" class="fullscreen-btn right-menu-item" title="全屏开关"/>
+            <fullscreen v-model="fullscreen" class="fullscreen-btn right-menu-item hidden-xs" title="全屏开关"/>
 
-            <div class="setting-btn right-menu-item" @click="settingDrawer=true">
+            <div class="setting-btn right-menu-item hidden-xs" @click="settingDrawer=true">
                 <i class="el-icon-s-operation navbar-icon" title="个性设置"/>
             </div>
 
@@ -20,24 +20,22 @@
             >
                 <div class="avatar-wrapper">
                     <el-avatar :size="30" :src="avatar" icon="el-icon-user-solid"/>
-                    <span>{{name}}</span>
+                    <span class="hidden-xs">{{name}}</span>
                 </div>
                 <el-dropdown-menu class="user-dropdown" slot="dropdown">
                     <router-link to="/user/index">
                         <el-dropdown-item icon="el-icon-user">个人中心</el-dropdown-item>
                     </router-link>
-                    <el-dropdown-item icon="el-icon-guide" @click.native="$guide(0,steps)">新手指引</el-dropdown-item>
+                    <el-dropdown-item class="hidden-xs" icon="el-icon-guide" @click.native="$guide(0,steps)">
+                        新手指引
+                    </el-dropdown-item>
                     <router-link v-if="showSystemMonitor" to="/system/monitor">
                         <el-dropdown-item icon="el-icon-monitor">系统监控</el-dropdown-item>
                     </router-link>
                     <router-link v-if="showSystemResource" to="/system/resource">
                         <el-dropdown-item icon="el-icon-setting">接口设置</el-dropdown-item>
                     </router-link>
-                    <el-dropdown-item
-                            divided
-                            icon="el-icon-switch-button"
-                            @click.native="logout"
-                    >
+                    <el-dropdown-item divided icon="el-icon-switch-button" @click.native="logout">
                         退出登录
                     </el-dropdown-item>
                 </el-dropdown-menu>
diff --git a/vue/src/layout/mixin/ResizeHandler.js b/vue/src/layout/mixin/ResizeHandler.js
index bae37d1..bbb0d4e 100644
--- a/vue/src/layout/mixin/ResizeHandler.js
+++ b/vue/src/layout/mixin/ResizeHandler.js
@@ -1,21 +1,25 @@
+import {debounce} from '@/utils'
+
 const {body} = document
 const WIDTH = 768
 
+function $_isMobile() {
+    const rect = body.getBoundingClientRect()
+    return rect.width - 1 < WIDTH
+}
+
 export default {
     methods: {
-        $_isMobile() {
-            const rect = body.getBoundingClientRect()
-            return rect.width - 1 < WIDTH
-        },
         $_resizeHandler() {
             if (!document.hidden) {
-                const isMobile = this.$_isMobile()
+                const isMobile = $_isMobile()
                 this.$store.commit('app/device', isMobile ? 'mobile' : 'pc')
                 isMobile && this.$store.commit('setting/sidebarCollapse', true)
             }
         }
     },
     mounted() {
+        this.$_resizeHandler = debounce(this.$_resizeHandler)
         window.addEventListener('resize', this.$_resizeHandler)
         this.$_resizeHandler()
     },
diff --git a/vue/src/views/purchase/inbound/index.vue b/vue/src/views/purchase/inbound/index.vue
index 41af5aa..6f6ba95 100644
--- a/vue/src/views/purchase/inbound/index.vue
+++ b/vue/src/views/purchase/inbound/index.vue
@@ -39,7 +39,7 @@
                 </el-select>
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button icon="el-icon-search" size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" icon="el-icon-plus" size="small" type="primary" @click="add">添 加</el-button>
             <el-button icon="el-icon-view" size="small" type="primary" @click="see">查 看</el-button>
diff --git a/vue/src/views/purchase/order/index.vue b/vue/src/views/purchase/order/index.vue
index 215140c..fcebfe4 100644
--- a/vue/src/views/purchase/order/index.vue
+++ b/vue/src/views/purchase/order/index.vue
@@ -55,7 +55,7 @@
                 />
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button icon="el-icon-search" size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" icon="el-icon-plus" size="small" type="primary" @click="add">添 加</el-button>
             <el-button icon="el-icon-view" size="small" type="primary" @click="see">查 看</el-button>
diff --git a/vue/src/views/sell/order/index.vue b/vue/src/views/sell/order/index.vue
index f4e2487..0d344db 100644
--- a/vue/src/views/sell/order/index.vue
+++ b/vue/src/views/sell/order/index.vue
@@ -55,7 +55,7 @@
                 />
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button icon="el-icon-search" size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" icon="el-icon-plus" size="small" type="primary" @click="add">添 加</el-button>
             <el-button icon="el-icon-view" size="small" type="primary" @click="see">查 看</el-button>
diff --git a/vue/src/views/sell/outbound/index.vue b/vue/src/views/sell/outbound/index.vue
index be9eb3a..b2a38b2 100644
--- a/vue/src/views/sell/outbound/index.vue
+++ b/vue/src/views/sell/outbound/index.vue
@@ -39,7 +39,7 @@
                 </el-select>
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button icon="el-icon-search" size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" icon="el-icon-plus" size="small" type="primary" @click="add">添 加</el-button>
             <el-button icon="el-icon-view" size="small" type="primary" @click="see">查 看</el-button>
diff --git a/vue/src/views/stock/current/index.vue b/vue/src/views/stock/current/index.vue
index ef90bd4..13ea6bd 100644
--- a/vue/src/views/stock/current/index.vue
+++ b/vue/src/views/stock/current/index.vue
@@ -33,7 +33,7 @@
                     />
                 </search-form-item>
             </search-form>
-            <el-row>
+            <el-row class="button-group">
                 <el-button icon="el-icon-search" size="small" type="success" @click="search">查 询</el-button>
                 <el-button icon="el-icon-download" size="small" type="info" @click="downloadExcel">导 出</el-button>
             </el-row>
diff --git a/vue/src/views/system/customer/index.vue b/vue/src/views/system/customer/index.vue
index 2d18cba..67e6145 100644
--- a/vue/src/views/system/customer/index.vue
+++ b/vue/src/views/system/customer/index.vue
@@ -32,7 +32,7 @@
                 />
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" size="small" type="primary" @click="add">添 加</el-button>
             <el-button v-if="canUpdate" size="small" type="primary" @click="edit">编 辑</el-button>
diff --git a/vue/src/views/system/role/index.vue b/vue/src/views/system/role/index.vue
index c8ef2ad..14b7282 100644
--- a/vue/src/views/system/role/index.vue
+++ b/vue/src/views/system/role/index.vue
@@ -23,7 +23,7 @@
                 />
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button icon="el-icon-search" size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" icon="el-icon-plus" size="small" type="primary" @click="add">添 加</el-button>
             <el-button v-if="canUpdate" icon="el-icon-edit" size="small" type="primary" @click="edit">编 辑</el-button>
diff --git a/vue/src/views/system/supplier/index.vue b/vue/src/views/system/supplier/index.vue
index eca060a..4d2900a 100644
--- a/vue/src/views/system/supplier/index.vue
+++ b/vue/src/views/system/supplier/index.vue
@@ -32,7 +32,7 @@
                 />
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" size="small" type="primary" @click="add">添 加</el-button>
             <el-button v-if="canUpdate" size="small" type="primary" @click="edit">编 辑</el-button>
diff --git a/vue/src/views/system/user/index.vue b/vue/src/views/system/user/index.vue
index 4815494..da27a68 100644
--- a/vue/src/views/system/user/index.vue
+++ b/vue/src/views/system/user/index.vue
@@ -23,7 +23,7 @@
                 />
             </search-form-item>
         </search-form>
-        <el-row>
+        <el-row class="button-group">
             <el-button icon="el-icon-search" size="small" type="success" @click="search">查 询</el-button>
             <el-button v-if="canAdd" icon="el-icon-plus" size="small" type="primary" @click="add">添 加</el-button>
             <el-button v-if="canUpdate" icon="el-icon-edit" size="small" type="primary" @click="edit">编 辑</el-button>