系统管理bug

src/components/system/admin.vue

 <template>
   <div class="admin">
-    <div class="head">
-      <el-button @click="add" plain type="success">新增角色</el-button>
+    <div class="head clear-both">
+      <el-button @click="add" plain type="success" style="float: right">新增角色</el-button>
     </div>
     <el-table
       :data="adminList"
@@ -27,15 +27,22 @@
       <el-table-column
         label="操作">
         <template slot-scope="scope">
-          <el-button size="mini" plain type="primary" @click="edit(scope.row)">
-            编辑
-          </el-button>
-          <el-button size="mini" type="warning" plain @click="editPW(scope.row)">
-            修改密码
-          </el-button>
-          <el-button size="mini" type="danger" plain @click="del(scope.row)">
-            删除
-          </el-button>
+          <el-popover
+            placement="top"
+            width="280">
+            <div style="text-align: center">
+              <el-button size="mini" plain type="primary" @click="edit(scope.row)">
+                编辑
+              </el-button>
+              <el-button size="mini" type="warning" plain @click="editPW(scope.row)">
+                修改密码
+              </el-button>
+              <el-button size="mini" type="danger" plain @click="del(scope.row)">
+                删除
+              </el-button>
+            </div>
+            <el-button slot="reference" size="mini" type="text" >操作</el-button>
+          </el-popover>
         </template>
       </el-table-column>
     </el-table>
@@ -318,4 +325,11 @@
       padding-top: 20px
     }
   }
+  .clear-both{
+  &:after{
+     content: '';
+     display: block;
+     clear: both;
+   }
+  }
 </style>

src/components/system/banner.vue

 <template>
   <div class="banner" v-loading="loading">
-    <div class="head">
-      <el-button @click="add" plain type="success">新增banner</el-button>
+    <div class="head clear-both">
+      <el-button @click="add" plain type="success" style="float: right">新增banner</el-button>
     </div>
     <el-table
       :data="bannerList"
@@ -270,6 +270,13 @@
   .short-banner {
     width: 50px;
   }
+  .clear-both{
+  &:after{
+     content: '';
+     display: block;
+     clear: both;
+   }
+  }
 </style>
 <style>
   .disabled .el-upload--picture-card {

src/components/system/menu.vue

 <template>
   <div class="menu">
-    <div class="head">
-      <el-button @click="add" plain type="success">新增菜单</el-button>
+    <div class="head clear-both">
+      <el-button @click="add" plain type="success" style="float: right">新增菜单</el-button>
     </div>
     <el-table
       :data="menuList"
@@ -177,4 +177,11 @@
     padding-top: 20px
   }
   }
+  .clear-both{
+  &:after{
+     content: '';
+     display: block;
+     clear: both;
+   }
+  }
 </style>

src/components/system/role.vue

 <template>
   <div class="role">
-    <div class="head">
-      <el-button @click="add" plain type="success">新增角色</el-button>
+    <div class="head clear-both">
+      <el-button @click="add" plain type="success" style="float: right">新增角色</el-button>
     </div>
     <el-table
       :data="roleList"
@@ -202,4 +202,11 @@
     padding-top: 20px
   }
   }
+  .clear-both{
+  &:after{
+     content: '';
+     display: block;
+     clear: both;
+   }
+  }
 </style>

src/components/system/sysConfig.vue

 <template>
-  <div>
-    <el-row type="flex" class="add-btn" justify="end">
-      <el-col :span="6">
-        <el-button type="success" plain @click="add">添加配置</el-button>
-      </el-col>
-    </el-row>
+  <div class="sys">
+    <div class="clear-both top">
+      <el-button type="success" plain @click="add" style="float: right">添加配置</el-button>
+    </div>
     <el-table
       :data="list"
       style="width: 100%">
@@ -124,7 +122,13 @@
 
 <style scoped lang="less">
   @import "../../util/public";
+  .sys {
+    padding: 10px;
+  }
   .add-btn {
     margin: 10px 0;
   }
+  .top {
+    padding:5px;
+  }
 </style>