From 19cd6dc5b40ded900490a977d91a287c51210b04 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Thu, 28 Jun 2018 13:07:42 +0800
Subject: [PATCH] no message

Former-commit-id: af2fac8d32b8c8e1d9fbbedd6a86e20b76a59e7a [formerly af2fac8d32b8c8e1d9fbbedd6a86e20b76a59e7a [formerly af2fac8d32b8c8e1d9fbbedd6a86e20b76a59e7a [formerly af2fac8d32b8c8e1d9fbbedd6a86e20b76a59e7a [formerly 8190b68931a7ee45c0aad51d088b55bdbba0616c [formerly e9f465000bb8191da0802fb14745255ecd0f23f3]]]]]
Former-commit-id: e419e25b82c6491c5eef85a3092fced9a23a218c
Former-commit-id: 825c3e2fcc08e9a7ccf7c020479d35d743c5feba
Former-commit-id: f2ed57e49c0eb684c2c87c934c4dc4186b40cf62 [formerly 8850b09180cded84d562004ce7ad55cb82aa63d2]
Former-commit-id: 85ef46ff4656cec63beb187e3d0f7139e9da444f
Former-commit-id: 87c5106346238ed013c34775ebab904504b105db
Former-commit-id: f2ef9a94282af2446fabc4476573e89cab847850
Former-commit-id: 34fbb4bdef4a0b5a127be823b0f4e1400f86d6db
Former-commit-id: f405dfcecf2056781edf17e90b51fb1a37be16fb
---
 src/assets/style/theme/theme.scss             | 377 ------------------
 .../style/theme/theme.scss.REMOVED.git-id     |   1 +
 src/components/core/d2-layout-main/index.vue  |  11 +-
 .../core/d2-multiple-page-control/index.vue   |  26 ++
 src/components/core/register.js               |   3 +-
 5 files changed, 37 insertions(+), 381 deletions(-)
 delete mode 100644 src/assets/style/theme/theme.scss
 create mode 100644 src/assets/style/theme/theme.scss.REMOVED.git-id
 create mode 100644 src/components/core/d2-multiple-page-control/index.vue

diff --git a/src/assets/style/theme/theme.scss b/src/assets/style/theme/theme.scss
deleted file mode 100644
index f5c41252..00000000
--- a/src/assets/style/theme/theme.scss
+++ /dev/null
@@ -1,377 +0,0 @@
-// 主题公用
-.layout-main-group {
-  height: 100%;
-  width: 100%;
-  background-size: cover;
-  background-position: center;
-  overflow: hidden;
-  position: relative;
-  // 背景上面的半透明遮罩
-  .layout-main-mask {
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
-  }
-  // 主体
-  .layout-main {
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
-    // [布局] 顶栏
-    .el-header {
-      padding: 0px;
-      // logo区域
-      .logo-group {
-        transition: width .3s;
-        float: left;
-        text-align: center;
-        img {
-          height: 60px;
-        }
-      }
-      // 折叠侧边栏切换按钮
-      .toggle-aside-btn {
-        float: left;
-        height: 60px;
-        width: 60px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        @extend %unable-select;
-        i {
-          font-size: 20px;
-          margin-top: 4px;
-        }
-      }
-      // [菜单] 顶栏
-      .el-menu {
-        float: left;
-        border-bottom: none;
-        background-color: transparent;
-        %header-menu-item {
-          @extend %unable-select;
-          i.fa {
-            font-size: 16px;
-            margin-right: 4px;
-          }
-        }
-        .el-menu-item {
-          @extend %header-menu-item;
-          border-bottom: none;
-        }
-        .el-submenu {
-          @extend %header-menu-item;
-          .el-submenu__title {
-            border-bottom: none;
-          }
-        }
-      }
-      // 顶栏右侧的按钮
-      .d2-header-right {
-        float: right;
-        height: 60px;
-        display: flex;
-        align-items: center;
-        .btn-text {
-          padding: 14px 12px;
-          border-radius: 4px;
-          margin: 0px !important;
-          margin-left: 10px !important;
-        }
-        .el-dropdown {
-          @extend %unable-select;
-        }
-      }
-    }
-    // [布局] 顶栏下面
-    .el-container {
-      // 侧边栏
-      .el-aside {
-        transition: width .3s;
-        overflow: auto;
-        // [菜单] 正常状态
-        .el-menu {
-          @extend %unable-select;
-          background-color: transparent;
-          border-right: none;
-          .el-menu-item {
-            i {
-              margin-left: 4px;
-              margin-right: 5px;
-              font-size: 16px;
-            }
-          }
-        }
-        .el-submenu {
-          @extend %unable-select;
-          .el-submenu__title {
-            i {
-              margin-left: 4px;
-              margin-right: 5px;
-              font-size: 16px;
-            }
-            .el-submenu__icon-arrow {
-              margin-top: -10px;
-            }
-          }
-        }
-        // 菜单为空的时候显示的信息
-        .menu-empty {
-          height: 160px;
-          margin: 10px;
-          margin-top: 0px;
-          border-radius: 4px;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          flex-direction: column;
-          @extend %unable-select;
-          i {
-            font-size: 30px;
-            margin-bottom: 10px;
-          }
-          span {
-            font-size: 14px;
-          }
-        }
-        // [菜单] 折叠状态
-        .el-menu--collapse {
-          background-color: transparent;
-          .el-submenu__title {
-            text-align: center;
-          }
-        }
-      }
-      .el-main {
-        padding: 0px;
-        position: relative;
-        overflow: hidden;
-      }
-    }
-  }
-}
-
-// 每个主题特有的设置
-
-.theme-#{$theme-name} {
-
-  // 背景图片和遮罩
-  .layout-main-group {
-    background-color: $theme-bg-color;
-    .layout-main-mask {
-      background-color: $theme-bg-mask;
-    }
-  }
-
-  // 菜单项目
-  @mixin theme-menu-hover-style {
-    color: $theme-menu-item-color-hover;
-    i.fa {
-      color: $theme-menu-item-color-hover;
-    }
-    background-color: $theme-menu-item-background-color-hover;
-  }
-  .el-submenu__title {
-    @extend %unable-select;
-    i.fa { margin-right: 5px; }
-  }
-  .el-menu-item {
-    @extend %unable-select;
-    i.fa { margin-right: 5px; }
-  }
-  .el-submenu__title:hover {
-    @include theme-menu-hover-style;
-  }
-  .el-menu-item:hover {
-    @include theme-menu-hover-style;
-  }
-  .el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
-    @include theme-menu-hover-style;
-  }
-  .el-menu--horizontal .el-menu .el-submenu__title:hover {
-    @include theme-menu-hover-style;
-  }
-
-  // [组件] d2-container-full
-  .d2-container-full {
-    border: $theme-container-border-outer;
-    border-bottom: none;
-    background-color: $theme-container-background-color;
-    .d2-container-full__header {
-      border-bottom: $theme-container-border-inner;
-      background-color: $theme-container-header-footer-background-color;
-    }
-    .d2-container-full__footer {
-      border-top: $theme-container-border-inner;
-      background-color: $theme-container-header-footer-background-color;
-    }
-  }
-  // [组件] d2-container-card
-  .d2-container-card {
-    border: $theme-container-border-outer;
-    background-color: $theme-container-background-color;
-    .el-card__header {
-      border-bottom: $theme-container-border-inner;
-      background-color: $theme-container-header-footer-background-color;
-    }
-  }
-  
-  // 顶栏
-  .el-header {
-    // 切换按钮
-    .toggle-aside-btn {
-      i {
-        color: $theme-header-item-color;
-        background: $theme-header-item-background-color;
-        &:hover {
-          color: $theme-header-item-color-hover;
-        }
-      }
-    }
-    // 顶栏菜单
-    .el-menu {
-      .el-menu-item {
-        transition: border-top-color 0s;
-        color: $theme-header-item-color;
-        background: $theme-header-item-background-color;
-        i.fa { color: inherit; }
-        &:hover {
-          color: $theme-header-item-color-hover;
-          background: $theme-header-item-background-color-hover;
-          i.fa { color: inherit; }
-        }
-        &:focus {
-          color: $theme-header-item-color-focus;
-          background: $theme-header-item-background-color-focus;
-          i.fa { color: inherit; }
-        }
-        &.is-active {
-          color: $theme-header-item-color-active;
-          background: $theme-header-item-background-color-active;
-          i.fa { color: inherit; }
-        }
-      }
-      .el-submenu {
-        .el-submenu__title {
-          transition: border-top-color 0s;
-          color: $theme-header-item-color;
-          background: $theme-header-item-background-color;
-          i.fa { color: inherit; }
-          .el-submenu__icon-arrow {
-            color: $theme-header-item-color;
-          }
-          &:hover {
-            color: $theme-header-item-color-hover;
-            background: $theme-header-item-background-color-hover;
-            i.fa { color: inherit; }
-            .el-submenu__icon-arrow {
-              color: $theme-header-item-color-hover;
-            }
-          }
-          &:focus {
-            color: $theme-header-item-color-focus;
-            background: $theme-header-item-background-color-focus;
-            i.fa { color: inherit; }
-            .el-submenu__icon-arrow {
-              color: $theme-header-item-color-focus;
-            }
-          }
-        }
-      }
-    }
-    // 顶栏右侧
-    .d2-header-right {
-      .btn-text {
-        color: $theme-header-item-color;
-        &.can-hover {
-          &:hover {
-            color: $theme-header-item-color-hover;
-            background: $theme-header-item-background-color-hover;
-          }
-        }
-      }
-    }
-  }
-  // [布局] 顶栏下面
-  .el-container {
-    // 侧边栏
-    .el-aside {
-      // 菜单为空的时候显示的信息
-      .menu-empty {
-        background-color: $theme-aside-menu-empty-background-color;
-        i {
-          color: $theme-aside-menu-empty-icon-color;
-        }
-        span {
-          color: $theme-aside-menu-empty-text-color;
-        }
-        &:hover {
-          background-color: $theme-aside-menu-empty-background-color-hover;
-          i {
-            color: $theme-aside-menu-empty-icon-color-hover;
-          }
-          span {
-            color: $theme-aside-menu-empty-text-color-hover;
-          }
-        }
-      }
-      // [菜单] 正常状态
-      .el-menu {
-        .el-menu-item {
-          color: $theme-aside-item-color;
-          background: $theme-aside-item-background-color;
-          i {
-            color: $theme-aside-item-color;
-          }
-          &:hover {
-            color: $theme-aside-item-color-hover;
-            background: $theme-aside-item-background-color-hover;
-            i {
-              color: $theme-aside-item-color-hover;
-            }
-          }
-          &:focus {
-            color: $theme-aside-item-color-focus;
-            background: $theme-aside-item-background-color-focus;
-            i {
-              color: $theme-aside-item-color-focus;
-            }
-          }
-          &.is-active {
-            color: $theme-aside-item-color-active;
-            background: $theme-aside-item-background-color-active;
-            i {
-              color: $theme-aside-item-color-active;
-            }
-          }
-        }
-      }
-      .el-submenu {
-        .el-submenu__title {
-          color: $theme-aside-item-color;
-          background: $theme-aside-item-background-color;
-          i {
-            color: $theme-aside-item-color;
-          }
-          .el-submenu__icon-arrow {
-            color: $theme-aside-item-color;
-          }
-          &:hover {
-            color: $theme-aside-item-color-hover;
-            background: $theme-aside-item-background-color-hover;
-            i {
-              color: $theme-aside-item-color-hover;
-            }
-            .el-submenu__icon-arrow {
-              color: $theme-aside-item-color-hover;
-            }
-          }
-        }
-      }
-    }
-  }
-}
diff --git a/src/assets/style/theme/theme.scss.REMOVED.git-id b/src/assets/style/theme/theme.scss.REMOVED.git-id
new file mode 100644
index 00000000..12f45f6b
--- /dev/null
+++ b/src/assets/style/theme/theme.scss.REMOVED.git-id
@@ -0,0 +1 @@
+77933b866fa9de6f14818a47bca59e5f3b88a628
\ No newline at end of file
diff --git a/src/components/core/d2-layout-main/index.vue b/src/components/core/d2-layout-main/index.vue
index 22e534f3..3bb91351 100644
--- a/src/components/core/d2-layout-main/index.vue
+++ b/src/components/core/d2-layout-main/index.vue
@@ -28,9 +28,14 @@
         </el-aside>
         <!-- 主体 -->
         <el-main>
-          <transition name="fade-transverse">
-            <router-view/>
-          </transition>
+          <div class="d2-layout-main-header">
+            <d2-multiple-page-control></d2-multiple-page-control>
+          </div>
+          <div class="d2-layout-main-body">
+            <transition name="fade-transverse">
+              <router-view/>
+            </transition>
+          </div>
         </el-main>
       </el-container>
     </el-container>
diff --git a/src/components/core/d2-multiple-page-control/index.vue b/src/components/core/d2-multiple-page-control/index.vue
new file mode 100644
index 00000000..b79b07c7
--- /dev/null
+++ b/src/components/core/d2-multiple-page-control/index.vue
@@ -0,0 +1,26 @@
+<template>
+  <el-tabs
+    class="d2-multiple-page-control"
+    v-model="activeName2"
+    type="card"
+    @tab-click="handleClick">
+    <el-tab-pane label="用户管理" name="first"></el-tab-pane>
+    <el-tab-pane label="配置管理" name="second"></el-tab-pane>
+    <el-tab-pane label="角色管理" name="third"></el-tab-pane>
+    <el-tab-pane label="定时任务补偿" name="fourth"></el-tab-pane>
+  </el-tabs>
+</template>
+<script>
+  export default {
+    data () {
+      return {
+        activeName2: 'first'
+      }
+    },
+    methods: {
+      handleClick (tab, event) {
+        console.log(tab, event)
+      }
+    }
+  }
+</script>
\ No newline at end of file
diff --git a/src/components/core/register.js b/src/components/core/register.js
index 0c3bf1fb..38a2cbc4 100644
--- a/src/components/core/register.js
+++ b/src/components/core/register.js
@@ -3,14 +3,15 @@ import Vue from 'vue'
 import { GridLayout, GridItem } from 'vue-grid-layout'
 import SplitPane from 'vue-splitpane'
 
-// 主容器 这个必须要同步注册
 import d2Container from '@/components/core/d2-container'
+import d2MultiplePageControl from '@/components/core/d2-multiple-page-control'
 
 Vue.component('d2-grid-layout', GridLayout)
 Vue.component('d2-grid-item', GridItem)
 Vue.component('SplitPane', SplitPane)
 
 Vue.component('d2-container', d2Container)
+Vue.component('d2-multiple-page-control', d2MultiplePageControl)
 Vue.component('d2-count-up', () => import('@/components/core/d2-count-up'))
 Vue.component('d2-highlight', () => import('@/components/core/d2-highlight'))
 Vue.component('d2-icon', () => import('@/components/core/d2-icon'))