样式再次修改

ybf_admin/src/pages/in/contact/mail.vue

 <template>
-  <div style="width:100%;">
+  <div class="mail">
     <div class="left">
-      <div class="left-c">
+      <!-- <div class="left-c"> -->
         <div class="title">组织架构</div>
         <div class="bottom">
           <div class="ty">
@@ -59,10 +59,10 @@
             <span class="add-r" @click="addStore">添加门店/专柜</span>
           </div>
         </div>
-      </div>
+      <!-- </div> -->
     </div>
     <div class="right">
-      <div class="right-c">
+      <!-- <div class="right-c"> -->
         <div class="top">三号柜组（共18人）</div>
         <div class="searchs">
           <div class="buttons">
@@ -104,7 +104,7 @@
           :data="list.main"
           tooltip-effect="dark"
           style="width: 100%"
-          height="calc(100% - 130px)"
+          height="calc(100% - 140px)"
         >
           <el-table-column type="selection" width="60"></el-table-column>
           <el-table-column
@@ -146,7 +146,8 @@
             width="120"
           ></el-table-column>
         </el-table>
-        <el-pagination
+        <div class="fy">
+          <el-pagination
           @current-change="handleCurrentChange"
           :current-page="page.currentPage"
           :page-size="page.size"
@@ -154,7 +155,9 @@
           :total="page.total"
         >
         </el-pagination>
-      </div>
+        </div>
+        
+      <!-- </div> -->
     </div>
     <move-dialog
       v-if="moveDialogShow"
@@ -392,6 +395,11 @@ export default {
 </script>
 
 <style scoped>
+.mail {
+  display: flex;
+  width: 100%;
+  flex-wrap: nowrap;
+}
 .run {
   height: 34px;
   width: 100%;
@@ -401,10 +409,7 @@ export default {
   padding-bottom: 10px;
   border-bottom: 1px solid #f8f8f8;
 }
-.left {
-  position: relative;
-  width: 20%;
-}
+
 .end {
   position: absolute;
   display: flex;
@@ -460,14 +465,10 @@ export default {
   background-color: #f8f8f8;
   min-height: 100%;
 }
-
-.left,
-.right {
-  display: inline-block;
-  background-color: #fff;
-  height: 100%;
+.left {
+  position: relative;
+  width: 20%;
   overflow: auto;
-  box-sizing: border-box;
 }
 .right {
   position: relative;
@@ -475,6 +476,16 @@ export default {
   margin-left: 10px;
   width: 79%;
 }
+.left,
+.right {  
+  display: flex; 
+   flex-direction: column; 
+  background-color: #fff;
+  height: 100%;
+  
+  box-sizing: border-box;
+}
+
 .right-c, .left-c {
   width: 100%;
 }
@@ -523,4 +534,7 @@ export default {
   justify-content: flex-end;
   align-items: center;
 }
+.fy {
+  height: 35px;
+}
 </style>

ybf_admin/src/pages/in/contact/store.vue

@@ -37,8 +37,7 @@
         ref="multipleTable"
         :data="list.main"
         tooltip-effect="dark"
-        style="width: 100%"
-        
+        style="width: 100%"        
         @selection-change="listPick"
         :height="tableHeight"
       >