Browse Source

首页计数器样式调整

yangc 8 years ago
parent
commit
4719ec5cba
2 changed files with 11 additions and 6 deletions
  1. 3 1
      components/main/count/Box.vue
  2. 8 5
      components/main/count/Item.vue

+ 3 - 1
components/main/count/Box.vue

@@ -58,9 +58,11 @@
     height: 40px;
     height: 40px;
     margin-right: 60px;
     margin-right: 60px;
     overflow: hidden;
     overflow: hidden;
+    border-radius: 3px;
+    background: #83c5f8;
   .swiper-slide{
   .swiper-slide{
     width: 100%;
     width: 100%;
-    background: #83c5f8;
+    /*background: #83c5f8;*/
     border-radius: 3px;
     border-radius: 3px;
   }
   }
 
 

+ 8 - 5
components/main/count/Item.vue

@@ -5,7 +5,7 @@
       <span v-for="num in nums" :class="num == ',' ? 'separator' : num == 0 ? 'zero num' : 'num'">{{ num }}</span>
       <span v-for="num in nums" :class="num == ',' ? 'separator' : num == 0 ? 'zero num' : 'num'">{{ num }}</span>
      <!-- <span v-if="nums.length < 7">个</span>
      <!-- <span v-if="nums.length < 7">个</span>
       <span v-if="nums.length > 7">万</span>-->
       <span v-if="nums.length > 7">万</span>-->
-      <span class="num">个</span>
+      <span v-text="isMore?'万':'个'"></span>
     </div>
     </div>
   </div>
   </div>
 </template>
 </template>
@@ -33,10 +33,12 @@
         if (num > 9999) {
         if (num > 9999) {
           this.isMore = true
           this.isMore = true
           let str = num.toString()
           let str = num.toString()
-          console.log(str.charAt(str.length - 5))
-          console.log(num / 10000)
+          num = Math.floor(num / 10000)
+          if (parseInt(str.charAt(str.length - 4)) > 4) {
+            num = num + 1
+          }
         }
         }
-        num = (Array(10 - String(num).length).join(0) + num)
+        num = (Array(7 - String(num).length).join(0) + num)
         while (re.test(num)) {
         while (re.test(num)) {
           num = num.replace(re, '$1,$2')
           num = num.replace(re, '$1,$2')
         }
         }
@@ -61,7 +63,7 @@
 
 
     .title {
     .title {
       display: inline-block;
       display: inline-block;
-      width: 60px;
+      width: 58px;
       float: left;
       float: left;
       font-weight: bold;
       font-weight: bold;
       line-height: 40px;
       line-height: 40px;
@@ -99,6 +101,7 @@
       span:last-child{
       span:last-child{
         line-height: 30px;
         line-height: 30px;
         color: #6cb7f3;
         color: #6cb7f3;
+        margin-left: 2px;
       }
       }
     }
     }
     .num {
     .num {