修复: 修改不分页面布局问题；

src/components/chart/Trend.vue

@@ -66,7 +66,6 @@ export default {
   .chart-trend{
     display: inline-block;
     font-size: 14px;
-    line-height: 22px;
     .chart-trend-icon{
       font-size: 12px;
       &.up{

src/components/page/PageHeader.vue

@@ -104,7 +104,7 @@ export default {
             margin-right: 16px;
           }
           .content{
-            margin-bottom: 16px;
+            /*margin-bottom: 16px;*/
             flex: auto;
           }
           .extra{

src/components/setting/Setting.vue

@@ -116,7 +116,11 @@ export default {
     onColorChange (values, colors) {
       if (colors.length > 0) {
         let closeMessage = this.$message.info(`您选择了主题色 ${colors}, 正在切换...`)
-        themeUtil.changeThemeColor(colors[0]).then(closeMessage)
+        let _this = this
+        themeUtil.changeThemeColor(colors[0]).then(() => {
+          _this.$store.commit('setting/setThemeColor', colors[0])
+          closeMessage()
+        })
       }
     },
     setTheme (values) {

src/components/transition/PageToggleTransition.vue

@@ -75,13 +75,13 @@
 <style lang="less">
   .page-toggle-enter-active{
     position: absolute !important;
-    animation-duration: 0.6s !important;
+    animation-duration: 0.8s !important;
-    width: calc(100%);
+    width: calc(100%) !important;
   }
   .page-toggle-leave-active{
     position: absolute !important;
-    animation-duration: 0.6s !important;
+    animation-duration: 0.8s !important;
-    width: calc(100%);
+    width: calc(100%) !important;
   }
   .page-toggle-enter{
   }

src/layouts/GlobalHeader.vue

@@ -85,6 +85,7 @@ export default {
     padding: 0 12px 0 0;
     -webkit-box-shadow: 0 1px 4px rgba(0,21,41,.08);
     box-shadow: 0 1px 4px rgba(0,21,41,.08);
+    z-index: 99;
     position: relative;
     &.light{
       background: #fff;

src/layouts/GlobalLayout.vue

@@ -30,6 +30,7 @@ import GlobalFooter from './GlobalFooter'
 import Drawer from '../components/tool/Drawer'
 import SiderMenu from '../components/menu/SiderMenu'
 import Setting from '../components/setting/Setting'
+import {mapState} from 'vuex'
 
 const minHeight = window.innerHeight - 64 - 24 - 122
 
@@ -52,21 +53,7 @@ export default {
     }
   },
   computed: {
-    isMobile () {
+    ...mapState('setting', ['isMobile', 'theme', 'layout', 'footerLinks', 'copyright']),
-      return this.$store.state.setting.isMobile
-    },
-    theme () {
-      return this.$store.state.setting.theme
-    },
-    layout () {
-      return this.$store.state.setting.layout
-    },
-    linkList () {
-      return this.$store.state.setting.footerLinks
-    },
-    copyright () {
-      return this.$store.state.setting.copyright
-    }
   },
   methods: {
     toggleCollapse () {

src/layouts/MenuView.vue

@@ -5,7 +5,7 @@
         @contextmenu.native="e => onContextmenu(e)"
         v-if="multiPage"
         :active-key="activePage"
-        style="margin-top: -8px; margin-bottom: 8px"
+        :style="`margin: -16px auto 8px; ${layout == 'head' ? 'max-width: 1400px;' : ''}`"
         :hide-add="true"
         type="editable-card"
         @change="changePage"
@@ -48,7 +48,7 @@ export default {
     }
   },
   computed: {
-    ...mapState('setting', ['multiPage', 'animate'])
+    ...mapState('setting', ['multiPage', 'animate', 'layout'])
   },
   created () {
     this.pageList.push(this.$route)

src/layouts/PageLayout.vue

@@ -5,7 +5,7 @@
       <slot slot="content" name="headerContent"></slot>
       <div slot="content" v-if="!this.$slots.headerContent && desc">
         <p style="font-size: 14px;line-height: 1.5;color: rgba(0,0,0,.65)">{{desc}}</p>
-        <div class="link">
+        <div v-if="this.linkList" class="link">
           <template  v-for="(link, index) in linkList">
             <a :key="index" :href="link.href"><a-icon :type="link.icon" />{{link.title}}</a>
           </template>
@@ -54,7 +54,7 @@ export default {
     margin: -24px -24px 0;
   }
   .link{
-    margin-top: 16px;
+    /*margin-top: 16px;*/
     line-height: 24px;
     a{
       font-size: 14px;

src/pages/dashboard/Analysis.vue

@@ -1,7 +1,7 @@
 <template>
-  <div>
+  <div class="analysis">
-    <a-row style="margin: 0 -12px">
+    <a-row :gutter="24">
-      <a-col :sm="24" :md="12" :xl="6" style="padding: 12px 12px 24px;">
+      <a-col :sm="24" :md="12" :xl="6">
         <chart-card title="总销售额" total="￥ 189,345">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
@@ -13,7 +13,7 @@
           <div slot="footer">日均销售额<span> ￥234.56</span></div>
         </chart-card>
       </a-col>
-      <a-col :sm="24" :md="12" :xl="6" style="padding: 12px 12px 24px;">
+      <a-col :sm="24" :md="12" :xl="6">
         <chart-card title="总销售额" total="￥ 189,345">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
@@ -24,7 +24,7 @@
           <div slot="footer">日访问量<span> 123,4</span></div>
         </chart-card>
       </a-col>
-      <a-col :sm="24" :md="12" :xl="6" style="padding: 12px 12px 24px;">
+      <a-col :sm="24" :md="12" :xl="6">
         <chart-card title="总销售额" total="￥ 189,345">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
@@ -35,7 +35,7 @@
           <div slot="footer">转化率 <span>60%</span></div>
         </chart-card>
       </a-col>
-      <a-col :sm="24" :md="12" :xl="6" style="padding: 12px 12px 24px;">
+      <a-col :sm="24" :md="12" :xl="6">
         <chart-card title="运营活动效果" total="73%">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
@@ -50,7 +50,7 @@
         </chart-card>
       </a-col>
     </a-row>
-    <a-card :bordered="false" :body-style="{padding: '24px'}">
+    <a-card style="margin-top: 24px" :bordered="false" :body-style="{padding: '24px'}">
       <div class="salesCard">
         <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
           <div class="extra-wrap" slot="tabBarExtraContent">

src/pages/list/search/ApplicationList.vue

@@ -2,9 +2,10 @@
   <div>
     <search-form />
     <a-list
-      :grid="{ gutter: 24, xl: 4, lg: 3, md: 3, sm: 2, xs: 1 }"
+      :grid="{gutter: 16, xl: 4, lg: 3, md: 3, sm: 2, xs: 1}"
+      style="margin: 0 -8px"
     >
-      <a-list-item style="padding: 0 12px" :key="n" v-for="n in 12">
+      <a-list-item :key="n" v-for="n in 12" style="padding: 0 8px">
         <a-card>
           <a-card-meta title="Angular">
             <a-avatar slot="avatar" src="https://gw.alipayobjects.com/zos/rmsportal/zOsKZmFRdUtvpqCImOVY.png" size="small" />

src/pages/list/search/ProjectList.vue

@@ -3,8 +3,9 @@
     <search-form />
     <a-list
       :grid='{ gutter: 24, xl: 4, lg: 3, md: 3, sm: 2, xs: 1 }'
+      style="margin: 0 -8px"
     >
-      <a-list-item :key="n" v-for="n in 8" style="padding: 0 12px">
+      <a-list-item :key="n" v-for="n in 8" style="padding: 0 8px">
         <a-card>
           <img slot="cover" src="https://gw.alipayobjects.com/zos/rmsportal/iZBVOIhGJiAnhplqjvZW.png" height="154"/>
           <a-card-meta title="Ant Design">

src/store/modules/setting.js

@@ -1,9 +1,10 @@
-import {footerLinks, animates} from '@/config'
+import {footerLinks, animates, themeColor} from '@/config'
 export default {
   namespaced: true,
   state: {
     isMobile: false,
     theme: 'dark',
+    themeColor,
     layout: 'side',
     systemName: 'Vue Antd Admin',
     copyright: '2018 ICZER 工作室出品',
@@ -30,6 +31,9 @@ export default {
     },
     setAnimate (state, animate) {
       state.animate = animate
+    },
+    setThemeColor (state, color) {
+      state.themeColor = color
     }
   }
 }