1

src/components/pages/myReport/components/mrOverPer.vue

@@ -32,11 +32,25 @@
             <div>
               <el-tooltip
                 effect="light"
-                :content="data.toolSubRate != null ? data.toolSubRate : 0 + '%'"
+                :content="data.toolSubRate"
                 placement="top"
               >
                 <div>
-                  {{ data.toolSubRate != null ? data.toolSubRate : 0 + "%" }}
+                  {{ data.toolSubRate }}
+                </div>
+              </el-tooltip>
+            </div>
+          </div>
+          <div class="perItem">
+            <div>课堂平均得分</div>
+            <div>
+              <el-tooltip
+                effect="light"
+                :content="data.courseaScore"
+                placement="top"
+              >
+                <div>
+                  {{ data.courseaScore }}
                 </div>
               </el-tooltip>
             </div>
@@ -93,16 +107,17 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
-  justify-content: space-around;
+  justify-content: flex-start;
   width: 90%;
   margin: 0 auto;
+  flex-wrap: wrap;
 }
 .perItem {
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   align-items: center;
-  margin: 0 5px;
+  margin: 0 15px;
 }
 .perItem > div:nth-child(1) {
   font-size: 14px;
@@ -110,7 +125,6 @@ export default {
 .perItem > div:nth-child(2) {
   border-radius: 50%;
   border: 1px solid #91ccff;
-  margin: 5px 0 0 0;
 }
 .perItem > div:nth-child(2) > div {
   width: 70px;
@@ -141,6 +155,9 @@ export default {
 .allPerTop > div:nth-child(3) > div:nth-child(2) > div {
   background: #e78686;
 }
+.allPerTop > div:nth-child(4) > div:nth-child(2) > div {
+  background: #89dcbe;
+}
 .avaImg {
   width: 65px;
   height: 64px;