From 2436182baf12be2199a4748e9f3cfaaff5f3a316 Mon Sep 17 00:00:00 2001
From: samulle <334168792@qq.com>
Date: Fri, 28 Aug 2020 15:21:16 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E8=AE=BE=E7=BD=AE?=
 =?UTF-8?q?=E9=9D=A2=E6=9D=BF=E2=80=98=E6=B5=81=E5=BC=8F=E2=80=99=E3=80=81?=
 =?UTF-8?q?=E2=80=98=E5=AE=9A=E5=AE=BD=E2=80=99=E5=88=87=E6=8D=A2=E7=95=8C?=
 =?UTF-8?q?=E9=9D=A2=E9=9A=8F=E4=B9=8B=E4=BF=AE=E6=94=B9=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/page/header/PageHeader.vue |  6 +++---
 src/components/page/header/index.less     |  4 ++++
 src/components/setting/Setting.vue        | 10 +++++-----
 src/layouts/PageLayout.vue                |  4 ++--
 src/layouts/header/AdminHeader.vue        |  4 ++--
 src/layouts/header/index.less             |  2 ++
 src/layouts/tabs/TabsView.vue             |  4 ++--
 src/store/modules/setting.js              |  4 ++++
 8 files changed, 24 insertions(+), 14 deletions(-)

diff --git a/src/components/page/header/PageHeader.vue b/src/components/page/header/PageHeader.vue
index 26dda7b..e483c0d 100644
--- a/src/components/page/header/PageHeader.vue
+++ b/src/components/page/header/PageHeader.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="page-header">
-    <div :class="['page-header-wide', layout]">
+  <div :class="['page-header', layout == 'head' && fixedWidth == 2 ? layout : '']">
+    <div :class="['page-header-wide']">
       <div class="breadcrumb">
         <a-breadcrumb>
           <a-breadcrumb-item :key="index" v-for="(item, index) in breadcrumb">
@@ -50,7 +50,7 @@ export default {
     },
   },
   computed: {
-    ...mapState('setting', ['layout', 'showPageTitle'])
+    ...mapState('setting', ['layout', 'showPageTitle', 'fixedWidth'])
   }
 }
 </script>
diff --git a/src/components/page/header/index.less b/src/components/page/header/index.less
index ba5b1d5..8103630 100644
--- a/src/components/page/header/index.less
+++ b/src/components/page/header/index.less
@@ -1,6 +1,10 @@
 .page-header{
   background: @base-bg-color;
   padding: 16px 24px;
+  &.head{
+    margin: auto;
+    max-width: 1400px;
+  }
   .page-header-wide{
     &.head{
       margin: auto;
diff --git a/src/components/setting/Setting.vue b/src/components/setting/Setting.vue
index 93ec7f1..e00e2f1 100644
--- a/src/components/setting/Setting.vue
+++ b/src/components/setting/Setting.vue
@@ -32,9 +32,9 @@
       <a-list :split="false">
         <a-list-item>
           {{$t('navigate.content.title')}}
-          <a-select :getPopupContainer="getPopupContainer" :dropdown-style="{zIndex: 2001}" size="small" defaultValue="1" slot="actions" style="width: 80px">
-            <a-select-option value="1">{{$t('navigate.content.fluid')}}</a-select-option>
-            <a-select-option value="2">{{$t('navigate.content.fixed')}}</a-select-option>
+          <a-select :getPopupContainer="getPopupContainer" :dropdown-style="{zIndex: 2001}" size="small" :defaultValue="fixedWidth" @change="setFixedWidth" slot="actions" style="width: 80px">
+            <a-select-option :value="1">{{$t('navigate.content.fluid')}}</a-select-option>
+            <a-select-option :value="2">{{$t('navigate.content.fixed')}}</a-select-option>
           </a-select>
         </a-list-item>
         <a-list-item>
@@ -131,7 +131,7 @@ export default {
     directions() {
       return this.animates.find(item => item.name == this.animate.name).directions
     },
-    ...mapState('setting', ['theme', 'layout', 'animate', 'animates', 'palettes', 'multiPage', 'weekMode', 'fixedHeader', 'fixedSideBar', 'hideSetting'])
+    ...mapState('setting', ['theme', 'layout', 'animate', 'animates', 'palettes', 'multiPage', 'weekMode', 'fixedHeader', 'fixedSideBar', 'hideSetting', 'fixedWidth'])
   },
   watch: {
     'animate.name': function(val) {
@@ -165,7 +165,7 @@ export default {
       })
     },
     ...mapMutations('setting', ['setTheme', 'setLayout', 'setMultiPage', 'setWeekMode',
-      'setFixedSideBar', 'setFixedHeader', 'setAnimate', 'setHideSetting'])
+      'setFixedSideBar', 'setFixedHeader', 'setAnimate', 'setHideSetting', 'setFixedWidth'])
   }
 }
 </script>
diff --git a/src/layouts/PageLayout.vue b/src/layouts/PageLayout.vue
index f292e8a..6c05db2 100644
--- a/src/layouts/PageLayout.vue
+++ b/src/layouts/PageLayout.vue
@@ -13,7 +13,7 @@
       </div>
       <slot v-if="this.$slots.extra" slot="extra" name="extra"></slot>
     </page-header>
-    <div ref="page" :class="['page-content', layout]" >
+    <div ref="page" :class="['page-content', layout == 'head' ? (fixedWidth == 2 ? layout : '') : '']" >
       <slot></slot>
     </div>
   </div>
@@ -60,7 +60,7 @@ export default {
     this.updatePageHeight(0)
   },
   computed: {
-    ...mapState('setting', ['layout', 'multiPage', 'pageMinHeight']),
+    ...mapState('setting', ['layout', 'multiPage', 'pageMinHeight', 'fixedWidth']),
     pageTitle() {
       let pageTitle = this.page && this.page.title
       return pageTitle === undefined ? (this.title || this.routeName) : this.$t(pageTitle)
diff --git a/src/layouts/header/AdminHeader.vue b/src/layouts/header/AdminHeader.vue
index b320432..4c536f6 100644
--- a/src/layouts/header/AdminHeader.vue
+++ b/src/layouts/header/AdminHeader.vue
@@ -1,6 +1,6 @@
 <template>
   <a-layout-header :class="[headerTheme, 'admin-header']">
-    <div :class="['admin-header-wide', layout]">
+    <div :class="['admin-header-wide', layout == 'side' ? layout : (fixedWidth == 2 ? layout : '')]">
       <router-link v-if="isMobile || layout === 'head'" to="/" :class="['logo', isMobile ? null : 'pc', headerTheme]">
         <img width="32" src="@/assets/img/logo.png" />
         <h1 v-if="!isMobile">{{systemName}}</h1>
@@ -53,7 +53,7 @@ export default {
     }
   },
   computed: {
-    ...mapState('setting', ['theme', 'isMobile', 'layout', 'systemName', 'lang']),
+    ...mapState('setting', ['theme', 'isMobile', 'layout', 'systemName', 'lang', 'fixedWidth']),
     headerTheme () {
       if (this.layout == 'side' && this.theme.mode == 'dark' && !this.isMobile) {
         return 'light'
diff --git a/src/layouts/header/index.less b/src/layouts/header/index.less
index 443f030..b388f19 100644
--- a/src/layouts/header/index.less
+++ b/src/layouts/header/index.less
@@ -14,9 +14,11 @@
     }
   }
   .admin-header-wide{
+    padding-left: 24px;
     &.head{
       max-width: 1400px;
       margin: auto;
+      padding-left: 0;
     }
     &.side{
       padding-right: 12px;
diff --git a/src/layouts/tabs/TabsView.vue b/src/layouts/tabs/TabsView.vue
index cf33f73..4ffafed 100644
--- a/src/layouts/tabs/TabsView.vue
+++ b/src/layouts/tabs/TabsView.vue
@@ -5,7 +5,7 @@
       v-if="multiPage"
       type="editable-card"
       :active-key="activePage"
-      :style="`margin: -16px auto 8px; ${layout == 'head' ? 'max-width: 1400px;' : ''}`"
+      :style="`margin: -16px auto 8px; ${layout == 'head' && fixedWidth == 2 ? 'max-width: 1400px;' : ''}`"
       :hide-add="true"
       @change="changePage"
       @edit="editPage"
@@ -48,7 +48,7 @@ export default {
     }
   },
   computed: {
-    ...mapState('setting', ['multiPage', 'animate', 'layout']),
+    ...mapState('setting', ['multiPage', 'animate', 'layout', 'fixedWidth']),
     menuItemList() {
       return [
         { key: '1', icon: 'vertical-right', text: this.$t('closeLeft') },
diff --git a/src/store/modules/setting.js b/src/store/modules/setting.js
index 7f0c22b..2e85f44 100644
--- a/src/store/modules/setting.js
+++ b/src/store/modules/setting.js
@@ -4,6 +4,7 @@ export default {
   namespaced: true,
   state: {
     isMobile: false,
+    fixedWidth: 2,
     animates: ADMIN.animates,
     palettes: ADMIN.palettes,
     pageMinHeight: 0,
@@ -49,6 +50,9 @@ export default {
     },
     setAsyncRoutes(state, asyncRoutes) {
       state.asyncRoutes = asyncRoutes
+    },
+    setFixedWidth(state, fixedWidth) {
+      state.fixedWidth = fixedWidth
     }
   }
 }

From b2b62914efb1991009766484616d87e5926e075f Mon Sep 17 00:00:00 2001
From: samulle <334168792@qq.com>
Date: Fri, 28 Aug 2020 16:25:04 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E8=AE=BE=E7=BD=AE?=
 =?UTF-8?q?=E9=9D=A2=E6=9D=BF=E2=80=98=E6=B5=81=E5=BC=8F=E2=80=99=E3=80=81?=
 =?UTF-8?q?=E2=80=98=E5=AE=9A=E5=AE=BD=E2=80=99=E5=88=87=E6=8D=A2=E7=95=8C?=
 =?UTF-8?q?=E9=9D=A2=E9=9A=8F=E4=B9=8B=E4=BF=AE=E6=94=B9=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/page/header/PageHeader.vue |  4 ++--
 src/components/setting/Setting.vue        | 10 +++++-----
 src/layouts/PageLayout.vue                |  4 ++--
 src/layouts/header/AdminHeader.vue        |  4 ++--
 src/layouts/tabs/TabsView.vue             |  4 ++--
 src/store/modules/setting.js              |  6 +++---
 6 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/components/page/header/PageHeader.vue b/src/components/page/header/PageHeader.vue
index e483c0d..8825c8a 100644
--- a/src/components/page/header/PageHeader.vue
+++ b/src/components/page/header/PageHeader.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :class="['page-header', layout == 'head' && fixedWidth == 2 ? layout : '']">
+  <div :class="['page-header', layout == 'head' && pageWidth == 'fixed' ? layout : '']">
     <div :class="['page-header-wide']">
       <div class="breadcrumb">
         <a-breadcrumb>
@@ -50,7 +50,7 @@ export default {
     },
   },
   computed: {
-    ...mapState('setting', ['layout', 'showPageTitle', 'fixedWidth'])
+    ...mapState('setting', ['layout', 'showPageTitle', 'pageWidth'])
   }
 }
 </script>
diff --git a/src/components/setting/Setting.vue b/src/components/setting/Setting.vue
index e00e2f1..f488af9 100644
--- a/src/components/setting/Setting.vue
+++ b/src/components/setting/Setting.vue
@@ -32,9 +32,9 @@
       <a-list :split="false">
         <a-list-item>
           {{$t('navigate.content.title')}}
-          <a-select :getPopupContainer="getPopupContainer" :dropdown-style="{zIndex: 2001}" size="small" :defaultValue="fixedWidth" @change="setFixedWidth" slot="actions" style="width: 80px">
-            <a-select-option :value="1">{{$t('navigate.content.fluid')}}</a-select-option>
-            <a-select-option :value="2">{{$t('navigate.content.fixed')}}</a-select-option>
+          <a-select :getPopupContainer="getPopupContainer" :dropdown-style="{zIndex: 2001}" size="small" :defaultValue="pageWidth" @change="setPageWidth" slot="actions" style="width: 80px">
+            <a-select-option value="fluid">{{$t('navigate.content.fluid')}}</a-select-option>
+            <a-select-option value="fixed">{{$t('navigate.content.fixed')}}</a-select-option>
           </a-select>
         </a-list-item>
         <a-list-item>
@@ -131,7 +131,7 @@ export default {
     directions() {
       return this.animates.find(item => item.name == this.animate.name).directions
     },
-    ...mapState('setting', ['theme', 'layout', 'animate', 'animates', 'palettes', 'multiPage', 'weekMode', 'fixedHeader', 'fixedSideBar', 'hideSetting', 'fixedWidth'])
+    ...mapState('setting', ['theme', 'layout', 'animate', 'animates', 'palettes', 'multiPage', 'weekMode', 'fixedHeader', 'fixedSideBar', 'hideSetting', 'pageWidth'])
   },
   watch: {
     'animate.name': function(val) {
@@ -165,7 +165,7 @@ export default {
       })
     },
     ...mapMutations('setting', ['setTheme', 'setLayout', 'setMultiPage', 'setWeekMode',
-      'setFixedSideBar', 'setFixedHeader', 'setAnimate', 'setHideSetting', 'setFixedWidth'])
+      'setFixedSideBar', 'setFixedHeader', 'setAnimate', 'setHideSetting', 'setPageWidth'])
   }
 }
 </script>
diff --git a/src/layouts/PageLayout.vue b/src/layouts/PageLayout.vue
index 6c05db2..908cba4 100644
--- a/src/layouts/PageLayout.vue
+++ b/src/layouts/PageLayout.vue
@@ -13,7 +13,7 @@
       </div>
       <slot v-if="this.$slots.extra" slot="extra" name="extra"></slot>
     </page-header>
-    <div ref="page" :class="['page-content', layout == 'head' ? (fixedWidth == 2 ? layout : '') : '']" >
+    <div ref="page" :class="['page-content', layout == 'head' ? (pageWidth == 'fixed' ? layout : '') : '']" >
       <slot></slot>
     </div>
   </div>
@@ -60,7 +60,7 @@ export default {
     this.updatePageHeight(0)
   },
   computed: {
-    ...mapState('setting', ['layout', 'multiPage', 'pageMinHeight', 'fixedWidth']),
+    ...mapState('setting', ['layout', 'multiPage', 'pageMinHeight', 'pageWidth']),
     pageTitle() {
       let pageTitle = this.page && this.page.title
       return pageTitle === undefined ? (this.title || this.routeName) : this.$t(pageTitle)
diff --git a/src/layouts/header/AdminHeader.vue b/src/layouts/header/AdminHeader.vue
index 4c536f6..f3f4ae8 100644
--- a/src/layouts/header/AdminHeader.vue
+++ b/src/layouts/header/AdminHeader.vue
@@ -1,6 +1,6 @@
 <template>
   <a-layout-header :class="[headerTheme, 'admin-header']">
-    <div :class="['admin-header-wide', layout == 'side' ? layout : (fixedWidth == 2 ? layout : '')]">
+    <div :class="['admin-header-wide', layout == 'side' ? layout : (pageWidth == 'fixed' ? layout : '')]">
       <router-link v-if="isMobile || layout === 'head'" to="/" :class="['logo', isMobile ? null : 'pc', headerTheme]">
         <img width="32" src="@/assets/img/logo.png" />
         <h1 v-if="!isMobile">{{systemName}}</h1>
@@ -53,7 +53,7 @@ export default {
     }
   },
   computed: {
-    ...mapState('setting', ['theme', 'isMobile', 'layout', 'systemName', 'lang', 'fixedWidth']),
+    ...mapState('setting', ['theme', 'isMobile', 'layout', 'systemName', 'lang', 'pageWidth']),
     headerTheme () {
       if (this.layout == 'side' && this.theme.mode == 'dark' && !this.isMobile) {
         return 'light'
diff --git a/src/layouts/tabs/TabsView.vue b/src/layouts/tabs/TabsView.vue
index 4ffafed..2488e83 100644
--- a/src/layouts/tabs/TabsView.vue
+++ b/src/layouts/tabs/TabsView.vue
@@ -5,7 +5,7 @@
       v-if="multiPage"
       type="editable-card"
       :active-key="activePage"
-      :style="`margin: -16px auto 8px; ${layout == 'head' && fixedWidth == 2 ? 'max-width: 1400px;' : ''}`"
+      :style="`margin: -16px auto 8px; ${layout == 'head' && pageWidth == 'fixed' ? 'max-width: 1400px;' : ''}`"
       :hide-add="true"
       @change="changePage"
       @edit="editPage"
@@ -48,7 +48,7 @@ export default {
     }
   },
   computed: {
-    ...mapState('setting', ['multiPage', 'animate', 'layout', 'fixedWidth']),
+    ...mapState('setting', ['multiPage', 'animate', 'layout', 'pageWidth']),
     menuItemList() {
       return [
         { key: '1', icon: 'vertical-right', text: this.$t('closeLeft') },
diff --git a/src/store/modules/setting.js b/src/store/modules/setting.js
index 2e85f44..eefe1c0 100644
--- a/src/store/modules/setting.js
+++ b/src/store/modules/setting.js
@@ -4,7 +4,7 @@ export default {
   namespaced: true,
   state: {
     isMobile: false,
-    fixedWidth: 2,
+    pageWidth: 'fixed',
     animates: ADMIN.animates,
     palettes: ADMIN.palettes,
     pageMinHeight: 0,
@@ -51,8 +51,8 @@ export default {
     setAsyncRoutes(state, asyncRoutes) {
       state.asyncRoutes = asyncRoutes
     },
-    setFixedWidth(state, fixedWidth) {
-      state.fixedWidth = fixedWidth
+    setPageWidth(state, pageWidth) {
+      state.pageWidth = pageWidth
     }
   }
 }