1

src/components/work/bonus.vue

@@ -213,6 +213,7 @@
 
     .block-name {
       font-size: 14px;
+      white-space:nowrap;
       font-family: PingFang SC;
       color: #A4A5B7;
     }
@@ -248,10 +249,11 @@
         font-size: 14px;
         color: #111111;
         margin-right: 55px;
+        white-space:nowrap;
       }
 
       .progress {
-        width: 100px;
+        width: 5.2vw;
         font-size: 14px;
         color: #A4A5B7;
         border-radius: 6px;
@@ -264,13 +266,13 @@
       }
 
       .progress-charts {
-        width: 150px;
+        width: 7.81vw;
         font-size: 12px;
         color: #666666;
       }
 
       .grade {
-        width: 70px;
+        width: 3.64vw;
         font-size: 14px;
         color: #999999;
       }

src/components/work/commission.vue

@@ -33,12 +33,12 @@
             </q-btn>
           </div>
         </div>
-        <div class="row items-center q-my-lg">
-          <div class="col flex q-pl-lg" style="height:62px">
+        <div class="row no-wrap items-center q-my-lg">
+          <div class="col flex no-wrap  q-pl-lg" style="height:62px">
             <img src="../../assets/images/newindex/ticheng1.png" alt="">
             <div class="flex content-between q-pl-lg" style="height:62px">
               <div class="full-width block-name">本月交易额</div>
-              <div class="block-num flex items-baseline"><span class="block-icon">¥</span> 0<span
+              <div class="block-num flex no-wrap items-baseline"><span class="block-icon">¥</span> 0<span
                   class="block-after">.00</span> </div>
             </div>
           </div>
@@ -99,17 +99,17 @@
           </div>
         </div>
         <div class="commission-block2 flex wrap content-between">
-          <div class="col flex q-pl-xs">
+          <div class="col flex no-wrap q-pl-xs">
             <img src="../../assets/images/newindex/ticheng2.png" alt="" style="height:62px">
             <div class="flex content-between q-pl-lg">
               <div class="full-width block-name">提成</div>
-              <div class="block-num flex items-baseline"><span class="block-icon">¥</span> 0<span
+              <div class="block-num flex no-wrap items-baseline"><span class="block-icon">¥</span> 0<span
                   class="block-after">.00</span> </div>
             </div>
           </div>
-          <div class="flex justify-between full-width">
+          <div class="flex no-wrap justify-between full-width">
             <div class="statistic-block flex wrap justify-center content-center">
-              <div class="statistic-price full-width flex justify-center items-baseline">
+              <div class="statistic-price full-width flex no-wrap justify-center items-baseline">
                 <span class="before">¥</span>
                 0
                 <span class="after">.00</span>
@@ -329,6 +329,7 @@
       font-size: 14px;
       font-family: PingFang SC;
       color: #A4A5B7;
+      white-space:no-wrap;
     }
 
     .block-num {
@@ -349,7 +350,7 @@
     }
 
     .progress-box {
-      width: 600px;
+      width: 31.25vw;
       height: 20px;
       margin: 10px auto;
       border-radius: 2px;
@@ -368,7 +369,7 @@
     }
 
     .commission-block2 {
-      width: 600px;
+      width: 31.25vw;
       height: 250px;
       margin: 50px auto 25px;
       border-radius: 8px;
@@ -376,7 +377,7 @@
       padding: 40px 30px;
 
       .statistic-block {
-        width: 150px;
+        width: 7.8vw;
         height: 75px;
         background-color: #FFFFFF;
         border-radius: 6px;
@@ -407,7 +408,7 @@
     }
 
     .commission-table {
-      width: 600px;
+      width: 31.25vw;
       height: 375px;
       margin: 0 auto;
       border-top: 1px solid #EAEBF0;

src/components/work/dasbord.vue

@@ -3,7 +3,7 @@
     <div class="q-my-md text-dark" style="font-size:20px">
       客户关系
     </div>
-    <div class="row q-gutter-md  wrap work-con">
+    <div class="row q-gutter-md  no-wrap work-con">
       <div >
         <div class="item-shadow return-commission" style="flex-shrink:1">
 

src/components/work/sell.vue

@@ -12,7 +12,7 @@
       </div>
       <div class="bottom flex justify-between content-between">
         <div class="sell-block">
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell1.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
               <q-menu auto-close>
@@ -34,13 +34,13 @@
           <div class="sell-num">
             0<span class="unit">人</span>
           </div>
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日新名单</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
         <div class="sell-block" style="background-color:#FFF5F8">
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell2.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
               <q-menu auto-close>
@@ -62,13 +62,13 @@
           <div class="sell-num">
             0<span class="unit">人</span>
           </div>
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">待跟进</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
         <div class="sell-block" style="background-color:#E8FFF3">
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell3.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
               <q-menu auto-close>
@@ -90,13 +90,13 @@
           <div class="sell-num">
             0<span class="unit">人</span>
           </div>
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日到访</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
         <div class="sell-block" style="background-color:#F2FAFF;box-shadow: 1px 3px 49px 0px rgba(0, 158, 247, 0.28);">
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell4.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
               <q-menu auto-close>
@@ -118,13 +118,13 @@
           <div class="sell-num">
             0<span class="unit">人</span>
           </div>
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日拜访</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
         <div class="sell-block" style="background-color:#FFFAF5">
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell5.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
               <q-menu auto-close>
@@ -146,13 +146,13 @@
           <div class="sell-num">
             0<span class="unit">人</span>
           </div>
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日新同行</div>
             <img src="../../assets/images/newindex/sell7.png" alt="" style="width:10px;">
           </div>
         </div>
         <div class="sell-block" style="background-color:#FEF4FE">
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell6.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
               <q-menu auto-close>
@@ -174,7 +174,7 @@
           <div class="sell-num">
             0<span class="unit">人</span>
           </div>
-          <div class="flex justify-between items-center">
+          <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日试听</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
@@ -388,16 +388,16 @@
     }
 
     .bottom {
-      width: 600px;
+      width: 31.25vw;
       height:320px;
       position: absolute;
       top: 160px;
       left: 50%;
       transform: translateX(-50%);
-      padding:0 15px;
+      padding: 0 1vw;
 
       .sell-block {
-        width: 175px;
+        width: 9vw;
         height: 145px;
         background-color: #F8F5FF;
         border-radius: 6px;
@@ -423,6 +423,7 @@
             font-family: PingFang SC;
             font-weight: 400;
             color: #404040;
+            white-space:nowrap;
         }
       }
     }