样式更新

src/views/trainStatistics/index.vue

@@ -28,7 +28,7 @@
             @load="getList"
         >
             <van-cell-group class="data-content" v-for="(item, index) in list" :key="index" @click="onHref(item)">
-                <van-cell style="padding: 16px 12px; 12px" :center="true">
+                <van-cell style="padding: 16px 12px;" :center="true">
                     <template #title>
                         <div class="teacher_info">
                             <img class="logo" v-if="item.avatar" :src="item.avatar" alt="" />
@@ -44,12 +44,12 @@
                             <van-grid-item text="训练时长">
                                 <template #icon>{{ item.totalPlayTime }}分钟</template>
                             </van-grid-item>
-                            <van-grid-item text="训练天数">
-                                <template #icon><span style="color: #01C1B5">{{ item.trainDay }}天</span></template>
-                            </van-grid-item>
                             <van-grid-item text="训练次数">
                                 <template #icon><span style="color: #01C1B5">{{ item.trainDay }}次</span></template>
                             </van-grid-item>
+                            <van-grid-item text="训练天数">
+                                <template #icon><span style="color: #01C1B5">{{ item.trainDay }}天</span></template>
+                            </van-grid-item>
                             <van-grid-item text="评测次数">
                                 <template #icon><span style="color: #FF802C">{{ item.recordNum }}次</span></template>
                             </van-grid-item>
@@ -141,7 +141,9 @@ export default {
                 path: '/trainDetail',
                 query: {
                     userId: item.userId,
-                    username: item.username
+                    username: item.username,
+                    musicGroupName: item.musicGroupName,
+                    avatar: item.avatar
                 }
             })
         },
@@ -253,6 +255,12 @@ export default {
     margin: .15rem .15rem 0;
     border-radius: .1rem;
     overflow: hidden;
+    .logo {
+        width: 0.40rem;
+        height: 0.4rem;
+        // margin-right: 0.12rem;
+        border-radius: 100%;
+    }
     &:first-child {
         margin-top: 0;
     }

src/views/trainStatistics/trainDetail.vue

@@ -2,19 +2,48 @@
 <div class="trainDetail">
     <van-sticky>
         <m-header v-if="headerStatus" :isFixed="false" />
-        <van-row class="dataSearch" type="flex">
-            <van-col span="9" offset="1">
-                <van-cell @click="onChangeDate('showStart')" :value="searchList.startTime"></van-cell>
-            </van-col>
-            <van-col span="1" class="flexCenter">-</van-col>
-            <van-col span="9">
-                <van-cell @click="onChangeDate('showEnd')" :value="searchList.endTime"></van-cell>
-            </van-col>
-            <van-col span="4" class="flexCenter">
-                <span class="btn-search" @click="onSearch">搜索</span>
-            </van-col>
-        </van-row>
     </van-sticky>
+
+    <div class="evaluation">
+        <van-cell style="padding: 16px 12px; background-color: transparent" :center="true">
+            <template #title>
+                <div class="teacher_info">
+                    <img class="logo" v-if="avatar" :src="avatar" alt="" />
+                    <img class="logo" v-else src="../../assets/images/icon_student.png" alt="" />
+                    <div class="teacher_content">
+                        <p style="color: #1a1a1a; font-size: .18rem;">{{ username }}</p>
+                        <p style="font-size: 14px; color: #333;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 2.4rem;">{{ musicGroupName }}</p>
+                    </div>
+                </div>
+            </template>
+            <!-- <p style="font-size: 14px; color: #808080;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">{{ musicGroupName }}</p> -->
+        </van-cell>
+    </div>
+
+    <van-row class="dataSearch" type="flex">
+        <van-col span="9" offset="1">
+            <van-cell @click="onChangeDate('showStart')" is-link>
+                <template #right-icon>
+                    <van-icon :name="arrowIcon" class="search-icon" size="10" />
+                </template>
+                <template v-if="searchList.startTime">{{ searchList.startTime }}</template>
+                <span v-else style="color: #adadad;">开始日期</span>
+            </van-cell>
+        </van-col>
+        <van-col span="1" class="flexCenter">-</van-col>
+        <van-col span="9">
+            <van-cell @click="onChangeDate('showEnd')">
+                <template #right-icon>
+                    <van-icon :name="arrowIcon" class="search-icon" size="10" />
+                </template>
+                <template v-if="searchList.endTime">{{ searchList.endTime }}</template>
+                <span v-else style="color: #adadad;">结束日期</span>
+            </van-cell>
+        </van-col>
+        <van-col span="4" class="flexCenter">
+            <span class="btn-search" @click="onSearch">搜索</span>
+        </van-col>
+    </van-row>
     <van-popup v-model="dataForm.status" position="bottom" round :style="{ height: '40%' }">
         <van-datetime-picker
             v-model="dataForm.currentDate"
@@ -32,12 +61,17 @@
             finished-text="- 没有更多内容 -"
             :immediate-check="false"
             @load="getList()">
-            <van-cell-group class="data-content" v-for="(item, index) in dataList" :key="index" @click="onDetail(item)">
+            <van-cell-group class="data-content" v-for="(item, index) in dataList" :key="index">
                 <van-cell style="padding: 16px 12px; 12px" :center="true">
                     <template #title>
                         <span style="font-size: .17rem; color:#333333; font-weight: 500; padding-right: .05rem;padding-bottom: .05rem;">{{ item.sysMusicScoreName }}</span>
+                        <p style="font-size: 14px; color: #808080;">{{ item.createTime }}</p>
                     </template>
-                    <p style="font-size: 14px; color: #808080;">{{ item.createTime }}</p>
+                    <p>
+                        <img v-if="getLevelByScore(item.score) == 1" class="scoreImg" src="./images/1.png" alt="">
+                        <img v-if="getLevelByScore(item.score) == 2" class="scoreImg" src="./images/2.png" alt="">
+                        <img v-if="getLevelByScore(item.score) == 3" class="scoreImg" src="./images/3.png" alt="">
+                    </p>
                 </van-cell>
                 <van-cell :clickable="false" center style="padding: 12px 12px 16px">
                     <template #title>
@@ -62,7 +96,7 @@
         <m-empty v-else key="trainDetail" msg="暂无训练详情" />
 
         <div class="button-group">
-            <van-button type="primary" size="large" @click="addVisited">添加回访</van-button>
+            <van-button type="primary" size="large" round @click="addVisited">添加回访</van-button>
             <div class="placeholder-btn"></div>
         </div>
     </div>
@@ -79,12 +113,15 @@ export default {
     data() {
         const query = this.$route.query
         return {
+            arrowIcon: require('./images/arrow_down.png'),
             headerStatus: true,
             show: true,
+            avatar: query.avatar,
             username: query.username,
+            musicGroupName: query.musicGroupName,
             searchList: {
-                startTime: dayjs().format('YYYY-MM-DD'),
-                endTime: dayjs().format('YYYY-MM-DD'),
+                startTime: null,
+                endTime: null,
                 userId: query.userId,
                 page: 1,
                 rows: 20
@@ -114,8 +151,7 @@ export default {
             this.$router.push({
                 path: '/addVisit',
                 query: {
-                    userId: this.searchList.userId,
-                    username: this.username,
+                    ...this.$route.query,
                     type: 'train',
                     name: '新增回访记录'
                 }
@@ -145,6 +181,13 @@ export default {
             }
         },
         onSearch() {
+            if(!this.searchList.startTime) {
+                this.$toast('请选择开始时间')
+                return
+            } else if(!this.searchList.endTime) {
+                this.$toast('请选择结束时间')
+                return
+            }
             this.dataList = [] // 重置数据
             this.show = true
             this.loading = true
@@ -154,15 +197,13 @@ export default {
         },
         onChangeDate(type) {
             let dataForm = this.dataForm
-            if(type == 'showEnd') {
-                // if(this.endTime) {
-                    dataForm.minDate = new Date(dayjs(this.searchList.startTime))
-                    dataForm.maxDate = new Date(2030, 11, 31)
-                // }
+            if(type == 'showEnd' && this.searchList.startTime) {
+                dataForm.minDate = new Date(dayjs(this.searchList.startTime))
+                dataForm.maxDate = new Date(2030, 11, 31)
                 setTimeout(() => {
                     dataForm.currentDate = this.searchList.endTime ? new Date(dayjs(this.searchList.endTime)) : new Date()
                 }, 500)
-            } else if(type == 'showStart') {
+            } else if(type == 'showStart' && this.searchList.endTime) {
                 dataForm.minDate = new Date(2000, 0, 1)
                 dataForm.maxDate = new Date(dayjs(this.searchList.endTime))
                 setTimeout(() => {
@@ -191,6 +232,15 @@ export default {
             }
             return val;
         },
+        getLevelByScore(score) {
+            let level = 3
+             if (score > 60 && score <= 80) {
+                level = 2
+            } else if (score > 80) {
+                level = 1
+            }
+            return level
+        }
     }
 }
 </script>
@@ -200,6 +250,34 @@ export default {
     background: #f5f5f5;
     min-height: 100vh;
 }
+.evaluation {
+    display: flex;
+    align-items: center;
+    margin: .12rem .12rem 0;
+    height: 1.05rem;
+    border-radius: .1rem;
+    background: url('./images/user_bg.png') no-repeat center #fff;
+    background-size: contain;
+
+    .teacher_info {
+        display: flex;
+        align-items: center;
+        img {
+            margin-right: .15rem;
+            width: .6rem;
+            height: .6rem;
+            border-radius: 50%;
+        }
+    }
+}
+.search-icon {
+    display: flex;
+    align-items: center;
+}
+.scoreImg {
+    width: 66px;
+    height: 25px;
+}
 .data-content {
     margin: .15rem .15rem 0;
     border-radius: .1rem;
@@ -238,14 +316,14 @@ export default {
 }
 .specialList {
     padding-top: .1rem;
-    margin-bottom: 50px;
+    padding-bottom: 65px;
     // padding-bottom: calc(env(safe-area-inset-bottom) / 2);
 }
 .dataSearch {
     padding: .12rem;
-    background-color: #fff;
+    background-color: #F5F5F5;
     /deep/.van-cell {
-        background: #F5F5F5;
+        background: #fff;
         padding: .05rem .16rem;
         border-radius: 1rem;
         overflow: hidden;
@@ -271,8 +349,9 @@ export default {
     overflow: hidden;
     position: fixed;
     bottom: 0;
-    width: 100%;
+    width: calc(100% - .24rem);
     z-index: 9;
+    margin: 0 .12rem 12px;
     .van-button--primary {
         background: #01C1B5;
         border: 1px solid #01C1B5;

src/views/visitManager/addVisit.vue

@@ -340,11 +340,11 @@ export default {
         this.$toast("添加成功");
         setTimeout(() => {
           if(this.userId) {
+            const query = this.$route.query
             this.$router.replace({
               path: '/trainDetail',
               query: {
-                username: this.studentName,
-                userId: this.userId
+                ...query
               }
             });
           } else {