接口优化2

src/views/index.vue

@@ -100,14 +100,15 @@
         <div class="rbox_con">
           <!-- 各场馆实时人数 cg1 -->
           <!-- v-for="(item, index) in 6" :key="index" -->
-          <div class="rbitem">
+          <div class="rbitem" v-for="item in ssjgNumDatas" :key="item.groupId">
             <span class="rbcgname">体育场</span>
             <span class="rbtitle">当前人数</span>
-            <span class="rbval">4,738</span>
-            <span class="rbrate">40%</span>
+            <!-- <span class="rbval">4,738</span> -->
+            <span class="rbval">{{ item.allEnter }}</span>
+            <span class="rbrate" :class="[{rbrate2: parseInt(item.proportion) >= 80 && parseInt(item.proportion) < 90},{rbrate3: parseInt(item.proportion) >= 90 }]">{{ item.proportion }}</span>
           </div>
 
-          <div class="rbitem">
+          <!-- <div class="rbitem">
             <span class="rbcgname">图书馆</span>
             <span class="rbtitle">当前人数</span>
             <span class="rbval">4,738</span>
@@ -140,7 +141,7 @@
             <span class="rbtitle">当前人数</span>
             <span class="rbval">4,738</span>
             <span class="rbrate">75%</span>
-          </div>
+          </div> -->
 
         </div>
       </div>
@@ -164,7 +165,8 @@ export default {
       week_num: 0,
       mon_num: 0,
       year_num: 0,
-      klqsDatas: []
+      klqsDatas: [],
+      ssjgNumDatas: []
     };
   },
   //创建的时候修改背景图片
@@ -848,8 +850,22 @@ export default {
       console.log(that);
       homeApi.allInfoDatas().then(res => {
         // get allTimeData
-        const tmpdata = res.data.returnData
-        console.log(tmpdata);
+        this.ssjgNumDatas = res.data.returnData
+        // let ssjgNumDatas = this.ssjgNumDatas
+        // ssjgNumDatas.forEach(item => {
+        //   console.log(parseInt(item.proportion));
+        //   let proportion = parseInt(item.proportion)
+        //   if (proportion >= 80 && proportion <= 90) {
+        //     console.log('11111111');
+        //     this.$refs.proportionbox.addClass('rbrate2')
+        //   }
+        //   if (proportion > 90) {
+        //     console.log('222222');
+        //     // console.log(this.$refs.proportionbox)
+        //     this.$refs.proportionbox.addClass('rbrate3')
+        //   }
+        // })
+        // console.log(tmpdata);
         // console.log(tmpdata.01.proportion);
         // let arr = JSON.stringify(tmpdata)
         // console.log(arr);