测试欢迎新同学

tv/src/Mock/index.js

@@ -371,7 +371,7 @@ let getClassStat = function (ClassOn, dp) {
     };
 };
 
-let t = 1;//0 is on 1 is off
+let t = 0;//0 is on 1 is off
 if (t == 0) {
     // 列表测试
     Mock.mock('/api/testTable', 'post', testTable());
@@ -380,11 +380,11 @@ if (t == 0) {
     let curheadapi = 'http://192.168.0.63:8080/';
 
     // 0: 下课 团课/私教/PK 的排名
-    let LessonClass = 3;
+    let LessonClass = 1;
     // 1：团课/私教
     // 2：竞技课2PK
     // 3：竞技课threepk
-    let LessonDp = 3;
+    let LessonDp = 1;
 
 
     if (LessonClass == 1) {
@@ -425,7 +425,7 @@ if (t == 0) {
     // 用户排行榜
     Mock.mock(curheadapi + 'UserRankingQuery', 'post', UserRankingQuery(8));
     // 新同学 0 999
-    Mock.mock(curheadapi + 'getNewUser', 'post', getNewUser(999));
+    Mock.mock(curheadapi + 'getNewUser', 'post', getNewUser(0));
     // 彩蛋 0 999
     Mock.mock(curheadapi + 'getRecordBreak', 'post', getRecordBreak(999));
 }

tv/src/components/newStudent.vue

@@ -1,6 +1,6 @@
 <template>
-    <el-dialog title="" :visible.sync="studentInfo.dialogVisible" :close-on-click-modal="false">
-        <div class="newStudentContainer">
+    <el-dialog title="" class="sss" :visible.sync="studentInfo.dialogVisible" :close-on-click-modal="false">
+        <div :class="[{'newStudentContainer1':bg == 0},{'newStudentContainer2':bg != 0}]">
             <div class="info">
                 <span v-for="(s,i) in studentInfo.Rs" v-if="i < 8">{{s.Name}}</span>
             </div>
@@ -16,6 +16,7 @@
                 <el-progress :percentage="studentInfo.percent" :show-text="false"></el-progress>
             </div>
         </div>
+        <img class="long" src="../static/img/newStudent/long.png" alt="">
     </el-dialog>
 
 </template>
@@ -27,9 +28,26 @@
                 percent: 0,
                 totalTime: 0,
                 sumTime: 4,
+                bg: 0,
             };
         },
         props: ['studentInfo'],
+        watch: {
+            studentInfo: {
+                handler(newName, oldName) {
+                    let that = this;
+                    if (newName != '') {
+                        if (Math.random(1,10)*100 > 50) {
+                            that.bg = 0
+                        }else{
+                            that.bg = 1
+                        }
+                    }
+                },
+                deep: true,
+                immediate: true
+            }
+        }
     }
 </script>
 
@@ -38,19 +56,36 @@
     /deep/ .el-dialog {
         width: 80%;
         height: 6rem;
-        background: url("../static/img/newStudent/newStudent.svg");
-        background-position: top center;
-        background-repeat: no-repeat;
-        background-size: 120% 100%;
+        background: none;
+        /*background: url("../static/img/newStudent/newStudent1.png");*/
+        /*background-position: top center;*/
+        /*background-repeat: no-repeat;*/
+        /*background-size: 100% 100%;*/
         box-shadow: none;
+        border: none;
         padding-bottom: 1rem;
     }
 
-    .info {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
+    /deep/ .el-dialog__header {
+        display: none;
+    }
+
+    .newStudentContainer1 {
+        height: 6rem;
+        margin-top: 0;
+        background: url("../static/img/newStudent/newStudent1.png");
+        background-position: top center;
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .newStudentContainer2 {
+        height: 6rem;
+        margin-top: 0;
+        background: url("../static/img/newStudent/newStudent2.png");
+        background-position: top center;
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
     }
 
     .info .lt {
@@ -111,33 +146,25 @@
         bottom: 1rem;
     }
 
-    .newStudentContainer {
-        width: 100%;
-        overflow: visible;
-        display: block;
-        margin: 0 auto;
-        margin-top: 2rem;
-    }
-
     .info {
         width: 50%;
         height: 2rem;
         overflow: hidden;
         display: flex;
         margin: 0 auto;
-        padding-top: 0.5rem;
+        padding-top: 2.9rem;
         flex: 1;
         flex-wrap: wrap;
         /*justify-content: space-between;*/
-        justify-content:center;
+        justify-content: center;
     }
 
     .info span {
         font-weight: 900;
         font-size: 0.4rem;
         text-align: center;
-        color: #a00;
-        text-shadow: 0px 0px 1px #ffa200;
+        color: #FDED2E;
+        text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.38);
         /*margin-right: 1rem;*/
         padding-left: 0.1rem;
         padding-right: 0.1rem;
@@ -166,19 +193,29 @@
         align-items: center;
         justify-content: center;
     }
+
     .progress {
         position: relative;
-        top:0.1rem;
+        top: 0.1rem;
         width: 94%;
         overflow: hidden;
         display: block;
         margin: 0 auto;
     }
+
     /deep/ .el-progress-bar .el-progress-bar__outer {
         height: 0.4rem;
 
     }
+
     /deep/ .el-progress-bar__inner {
         background-color: #FFEE00;
     }
+
+    .long {
+        position: relative;
+        float: right;
+        bottom: 1.8rem;
+        right: -0.5rem;
+    }
 </style>