2

src/components/work/bonus.vue

@@ -341,14 +341,14 @@
     .list {
       height: 40px;
       margin-bottom: 15px;
-      padding: 0 1.8vw;
+      padding: 0 2vw;
       background-color: #F2F4F7;
       border-radius: 6px;
 
       .name {
         font-size: 14px;
         color: #111111;
-        margin-right: 2.86vw;
+        margin-right: 3vw;
         white-space: nowrap;
       }
 
@@ -357,6 +357,7 @@
         font-size: 14px;
         color: #A4A5B7;
         border-radius: 6px;
+        margin-right:1vw;
 
         .cur {
           font-size: 18px;
@@ -366,15 +367,17 @@
       }
 
       .progress-charts {
-        width: 7.81vw;
+        width: 8vw;
         font-size: 12px;
         color: #666666;
+        margin-right:1vw;
       }
 
       .grade {
-        width: 3.64vw;
+        width: 4vw;
         font-size: 14px;
         color: #999999;
+        margin-right:1vw;
       }
 
       .num {

src/components/work/commission.vue

@@ -44,7 +44,7 @@
         </div>
       </div>
       <div class="q-pr-md">
-        <VueApexCharts width="105" height="105" :options="chartOptions4" :series="series4"></VueApexCharts>
+        <VueApexCharts width="100%" height="105" :options="chartOptions4" :series="series4"></VueApexCharts>
       </div>
     </div>
     <div class="block-name q-px-md">
@@ -173,6 +173,10 @@
             fixed: {
               enabled: false
             }
+          },
+           legend: {
+            position: 'right',
+            show: true,
           }
         },
         commissionData: {
@@ -396,7 +400,7 @@
     }
 
     .progress-box {
-      width: 31.25vw;
+      width: 39vw;
       height: 20px;
       margin: 10px auto;
       border-radius: 2px;
@@ -410,7 +414,7 @@
     }
 
     .commission-block2 {
-      width: 31.25vw;
+      width: 35vw;
       height: 250px;
       margin: 50px auto 25px;
       border-radius: 8px;
@@ -418,7 +422,7 @@
       padding: 40px 30px;
 
       .statistic-block {
-        width: 7.8vw;
+        width: 9vw;
         height: 75px;
         background-color: #FFFFFF;
         border-radius: 6px;
@@ -449,7 +453,7 @@
     }
 
     .commission-table {
-      width: 31.25vw;
+      width: 35vw;
       height: 375px;
       margin: 0 auto;
       border-top: 1px solid #EAEBF0;

src/components/work/dasbord.vue

 <template>
   <div>
-    <div class="q-my-md text-dark" style="font-size:20px">
+    <div class="q-ma-md text-dark" style="font-size:20px">
       客户关系
     </div>
-    <div class="row q-gutter-md  no-wrap work-con">
+    <div class="row q-gutter-md  q-px-md no-wrap work-con">
       <div >
         <div class="item-shadow return-commission">
-
-          <div class="q-px-md q-pt-md row no-wrap items-center">
+          <div class="q-pa-md row no-wrap items-center">
             <div class="col return-commission-title">
               返佣
             </div>
@@ -332,13 +331,14 @@ import {
 
 <style lang="scss" scoped>
   .work-con {
-    height: calc(100vh - 230px);
+    height: calc(100vh - 250px);
     overflow: scroll;
     box-sizing: border-box;
   }
 
   .return-commission {
     // width: 330px;
+    min-width:200px;
     height: 440px;
     border-radius: 8px;
     background-color: #FA9D0A;
@@ -370,6 +370,7 @@ import {
       padding-top: 2vw;
 
       .Statistics-block {
+        min-width:100px;
         width: 50%;
         height: 2.6vw;
         padding-left: 1.3vw;
@@ -400,6 +401,7 @@ import {
 
   .adviser {
     // width: 17.18vw;
+    min-width:200px;
     height: 520px;
     background-color: #FFFFFF;
     border-radius: 8px;
@@ -415,12 +417,15 @@ import {
     }
 
     .adviser-block {
-      width: 14.3vw;
-      height: 5.72vw;
+      width: 16vw;
+      min-width:160px;
+      height: 6vw;
+      min-height:80px;
       background-color: #F8F5FF;
       border-radius: 0.31vw;
       margin: 0 auto 1vw;
       padding: 0 1vw;
+     
 
       .left {
         .num {

src/components/work/sell.vue

@@ -289,7 +289,7 @@
     }
 
     .bottom {
-      width: 31.25vw;
+      width: 34vw;
       height: 320px;
       position: absolute;
       top: 160px;
@@ -298,7 +298,7 @@
       padding: 0 1vw;
 
       .sell-block {
-        width: 9vw;
+        width: 9.5vw;
         height: 145px;
         background-color: #F8F5FF;
         border-radius: 6px;