diff --git a/src/api/index.js b/src/api/index.js
index 3a1a34d..41e8d61 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -19,8 +19,8 @@ export default {
     logNotification: `nakadai/nakadai/log/logNotification`,
     //实验台
     curriculumDetail: `nakadai/nakadai/curriculum/curriculumDetail`, // 课程详情
-    curriculumChapter: `nakadai/nakadai/curriculum/chapter/queryChaptersAndSubsections`, // 根据课程id查询章节小节,树状结构
-    queryChaptersAndSubsections: `occupationlab/occupationlab/management/edu/courseChapter/queryChaptersAndSubsections`,
+    curriculumChapter: `nakadai/nakadai/curriculum/chapter/queryChaptersAndSubsections`,
+    queryChaptersAndSubsections: `occupationlab/occupationlab/theoreticalCourseChapter/queryChaptersAndSubsections`,
     curriculumGetSubsection: `nakadai/nakadai/curriculum/subsection/getSubsection`, // 根据小节id获取预览文件地址
     getProjectBySystemId: 'occupationlab/occupationlab/projectManage/getProjectBySystemId',
     getTheMostRecentlyRunProject: 'python/python/getTheMostRecentlyRunProject',
@@ -68,6 +68,8 @@ export default {
     findByIdCourse: `occupationlab/occupationlab/theoreticalCourse/findById`,
     playRecordSave: `occupationlab/occupationlab/playRecord/save`,
     studentLoginPreCourse: `occupationlab/occupationlab/theoreticalCourse/studentLoginPreCourse`,
+    getRedisCache: `occupationlab/occupationlab/theoreticalCourse/getRedisCache`,
+    getSubsection: `occupationlab/occupationlab/theoreticalCourseSubsection/getSubsection`,
 
     // 资讯
     queryAllColumns: `occupationlab/occupationlab/information/column/queryAllColumns`, // 栏目树
@@ -75,7 +77,7 @@ export default {
     getArticle: `occupationlab/occupationlab/information/article/getArticle`, // 根据id查询文章
 
     // 线上赛事
-    notLoggedInBeforeStudentEvents: `occupationlab/occupationlab/match/contest/notLoggedInBeforeStudentEvents`,
+    notLoggedInBeforeStudentEvents: `occupationlab/occupationlab/enterprise/match/contest/notLoggedInBeforeStudentEvents`,
     contestPageConditionQueryByOccupationlabStu: `occupationlab/occupationlab/match/contest/contestPageConditionQueryByOccupationlabStu`,
     contestPageConditionQueryByOccupationlab: `occupationlab/occupationlab/match/contest/onlineCompetitionByStudent`,
     listOfRegisteredEvents: `occupationlab/occupationlab/match/contest/listOfRegisteredEvents`,
diff --git a/src/assets/img/course-bg2.png b/src/assets/img/course-bg2.png
index 5624234..4ad3dfc 100644
Binary files a/src/assets/img/course-bg2.png and b/src/assets/img/course-bg2.png differ
diff --git a/src/assets/img/course-bg4.png b/src/assets/img/course-bg4.png
new file mode 100644
index 0000000..1b8bf97
Binary files /dev/null and b/src/assets/img/course-bg4.png differ
diff --git a/src/assets/img/course4.png b/src/assets/img/course4.png
new file mode 100644
index 0000000..9c96834
Binary files /dev/null and b/src/assets/img/course4.png differ
diff --git a/src/assets/img/info-bg7.png b/src/assets/img/info-bg7.png
index aeaabdb..7d33c7d 100644
Binary files a/src/assets/img/info-bg7.png and b/src/assets/img/info-bg7.png differ
diff --git a/src/assets/img/screen/medal.png b/src/assets/img/screen/medal.png
new file mode 100644
index 0000000..bc245a4
Binary files /dev/null and b/src/assets/img/screen/medal.png differ
diff --git a/src/layouts/navbar/index.vue b/src/layouts/navbar/index.vue
index f5be3e7..7c788a5 100644
--- a/src/layouts/navbar/index.vue
+++ b/src/layouts/navbar/index.vue
@@ -14,6 +14,7 @@
 <script>
 import Setting from "@/setting"
 import util from "@/libs/util"
+import { mapActions } from "vuex";
 export default {
     data() {
         return {
@@ -65,14 +66,6 @@ export default {
                     index: "/touristMatch/list",
                     title: "大赛资讯"
                 },
-                {
-                    index: 'data',
-                    title: "数据科研"
-                },   
-                {
-                    index: "/log/list",
-                    title: "更新日志"
-                },
                 {
                     index: "/preCourse/list",
                     title: "精品课程"
@@ -81,6 +74,14 @@ export default {
                     index: "/preInfo/list",
                     title: "最新资讯"
                 },
+                {
+                    index: 'data',
+                    title: "数据科研"
+                },   
+                {
+                    index: "/log/list",
+                    title: "更新日志"
+                },
                 // {
                 //     index: "trial",
                 //     title: "试用申请"
@@ -117,6 +118,9 @@ export default {
         this.isTourist || this.getColumns()
     },
     methods: {
+        ...mapActions("info", [
+            "setColumnId"
+        ]),
         // 跳转
         jump(item) {
             const { index } = item
@@ -141,6 +145,7 @@ export default {
                 } else {
                     this.active = index
                     this.columnActive = ''
+                    this.setColumnId('')
                     index === '/preInfo/list' || index === '/info/list' || this.$router.push(index).catch(err => {})
                     token !== this.token && location.reload() // 如果登录后再返回该页面，浏览器里会存有token，但是这个页面里的token是刚进到页面时获取的，应该是空，如果是这个情况，则刷新，否则右上角还会显示为登录按钮
                 }
diff --git a/src/pages/account/login/index.vue b/src/pages/account/login/index.vue
index 706df76..92565fd 100644
--- a/src/pages/account/login/index.vue
+++ b/src/pages/account/login/index.vue
@@ -208,9 +208,12 @@ export default {
         };
     },
     computed: {
-        ...mapState('match', [
-          'toMatch'
-        ])
+      ...mapState('match', [
+        'toMatch'
+      ]),
+      ...mapState('project', [
+        'courseId'
+      ])
     },
     components: {
         vFooter
@@ -320,11 +323,15 @@ export default {
         },
         // 处理登录成功
         setLogin() {
-            util.local.set(Setting.tokenKey, this.token, Setting.tokenExpires)
-            util.cookies.remove('serverLogin')
-            this.reloadIndex()
-            util.successMsg('登录成功')
-            this.$router.replace(this.toMatch ? `/touristMatch` : '/station')
+          util.local.set(Setting.tokenKey, this.token, Setting.tokenExpires)
+          util.cookies.remove('serverLogin')
+          this.reloadIndex()
+          util.successMsg('登录成功')
+          this.$router.replace(this.courseId ?
+            `/course/details?id=${this.courseId}` :
+            this.toMatch ?
+              `/touristMatch` :
+              '/station')
         },
         // 提交登录
         submit() {
diff --git a/src/pages/course/details/index.vue b/src/pages/course/details/index.vue
index 991753c..e67b5d5 100644
--- a/src/pages/course/details/index.vue
+++ b/src/pages/course/details/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="wrap pb">
-        <breadcrumb ref="breadcrumb" :data="'课程学习/' + courseName"></breadcrumb>
+        <breadcrumb ref="breadcrumb" :data="'课程学习/' + courseName" :query="breadcrumbQuery"></breadcrumb>
         <div class="flex">
             <div class="cover" :class="{'is-word': showMask1}">
                 <img v-if="coverUrl" :src="coverUrl" alt="" width="100%" height="100%">
@@ -43,8 +43,6 @@
                     <div class="desc-wrap">
                         <div class="desc" :class="{active: desShrink}" v-html="description"></div>
                         <i class="arrow" :class="{active: desShrink}" v-if="description && description.length > 40">
-                            <!-- <span>...</span> -->
-                            <i class="el-icon-arrow-down" @click="desShrink = !desShrink"></i>
                         </i>
                     </div>
                     <div class="chapters">
@@ -74,16 +72,20 @@
 </template>
 
 <script>
-import { mapState } from 'vuex';
+import { mapState, mapMutations } from 'vuex';
 import pdf from "vue-pdf";
 import 'quill/dist/quill.core.css';
 import 'quill/dist/quill.snow.css';
 import 'quill/dist/quill.bubble.css';
-import bus from '@/libs/bus'
 import breadcrumb from '@/components/breadcrumb'
+import Setting from "@/setting"
+import util from "@/libs/util"
 export default {
     data() {
         return {
+            breadcrumbQuery: {
+              source: this.$route.query.source
+            },
             startTime: Date.now(), // 页面进来的时间
             id: this.$route.query.id,
             video: 'http://liuwanr.oss-cn-shenzhen.aliyuncs.com/mp4/20200519/1589871025648.mp4',
@@ -126,23 +128,27 @@ export default {
         this.getChapter()
     },
     destroyed() {
-      this.$post(this.api.playRecordSave, {
+      // 记录播放时长
+      util.local.get(Setting.tokenKey) && this.$post(this.api.playRecordSave, {
         courseId: this.id,
         courseType: 1,
         playTime: Math.ceil((Date.now() - this.startTime) / 1000 / 60)
       }).then(({ data }) => {}).catch(res => {})
     },
     methods: {
+        ...mapMutations('project', [
+          'SET_COURSE'
+        ]),
         getData(){
           this.$post(`${this.api.findByIdCourse}?id=${this.id}`).then(({ data }) => {
             this.courseName = data.courseName
             this.description = data.courseIntroduction
             this.coverUrl = data.coverUrl || 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20220224/png/1496735335294984192.png'
-            this.$refs.breadcrumb.update('课程学习/' + this.courseName)
+            this.$refs.breadcrumb.update('课程学习/' + (this.$route.query.source == 1 ? '本校课程' : '共享课程') + '/' + this.courseName)
           }).catch(res => {})
         },
         async getChapter(){
-            let res = await this.$get(`${this.api.queryChaptersAndSubsections}/${this.id}`)
+            let res = await this.$get(`${this.api.queryChaptersAndSubsections}?courseId=${this.id}`)
             this.chapterList = res.chapterList
             if (this.chapterList.length && this.chapterList[0].subsectionList && this.chapterList[0].subsectionList.length) {
                 this.preview(this.chapterList[0].subsectionList[0], this.chapterList[0].name);
@@ -165,6 +171,16 @@ export default {
             return ext
         },
         preview(row, chapterName){
+            // 如果没登录，直接去登录
+            if (!util.local.get(Setting.tokenKey)) {
+              this.$confirm('请先登录，是否直接前往登录？', "提示", {
+                type: 'success'
+              }).then(() => {
+                this.SET_COURSE(this.id)
+                this.$router.push('/login')
+              }).catch(() => {})
+              return false
+            }
             this.curLink = `${chapterName}${row.name}`;
             this.player = null
             this.playauth = ''
@@ -199,7 +215,7 @@ export default {
                 this.pdfSrc = row.fileUrl
                 this.pdfVisible = true
             }else{
-                this.$get(`${this.api.getSubsection}/${row.id}`).then(res => {
+                this.$get(`${this.api.getSubsection}?subsectionId=${row.id}`).then(res => {
                     if(row.fileType == 'pptx'){
                         this.isPPT = true
                         this.isWord = false
diff --git a/src/pages/course/list/index.vue b/src/pages/course/list/index.vue
index b879b9c..d3245ce 100644
--- a/src/pages/course/list/index.vue
+++ b/src/pages/course/list/index.vue
@@ -26,33 +26,35 @@
         </div>
         <!-- 课程列表 -->
         <div class="courses">
-            <div class="wrap-inner">
-                <template v-if="list.length">
-                    <ul>
-                        <li v-for="(item, index) in list" :key="index" @click="toDetail(item.id)">
-                            <img :src="item.coverUrl" alt="" />
-                            <div class="title">{{ item.courseName }}</div>
-                            <div class="desc" :class="{ie: core.isIE(),ie: core.isFirefox()}" v-html="item.courseIntroduction"></div>
-                            <div class="metas">
-                              <i class="el-icon-view"></i>
-                              {{ item.pageviews }}
-                            </div>
-                        </li>
-                    </ul>
-                    <div class="pagination">
-                        <el-pagination background layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange" :current-page="page">
-                        </el-pagination>
-                    </div>
-                </template>
-                <template v-else>
-                    <div class="empty">
-                        <div>
-                            <img src="@/assets/img/none.png" alt="">
-                            <p>暂无课程</p>
+          <div class="course-bg"></div>
+          <template v-if="list.length">
+              <ul>
+                  <li v-for="(item, index) in list" :key="index" @click="toDetail(item.id)">
+                      <img :src="item.coverUrl" alt="" />
+                      <div class="title">{{ item.courseName }}</div>
+                      <div class="desc" :class="{ie: core.isIE(),ie: core.isFirefox()}" v-html="item.courseIntroduction"></div>
+                      <div class="metas">
+                        <div class="meta">
+                          <i class="el-icon-view"></i>
+                          {{ item.pageviews }}
                         </div>
-                    </div>
-                </template>
-            </div>
+                        <span v-if="item.courseType == 0" class="type">{{ item.courseType == 1 ? '付费' : '免费'}}</span>
+                      </div>
+                  </li>
+              </ul>
+              <div class="pagination">
+                  <el-pagination background layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange" :current-page="page">
+                  </el-pagination>
+              </div>
+          </template>
+          <template v-else>
+              <div class="empty">
+                  <div>
+                      <img src="@/assets/img/none.png" alt="">
+                      <p>暂无课程</p>
+                  </div>
+              </div>
+          </template>
         </div>
     </div>
 </template>
@@ -64,8 +66,9 @@ export default {
     name: "course",
     data() {
         return {
+            timer: null,
             isTourist: !!Setting.whiteList.find(e => e === this.$route.path),
-            active: 0,
+            active: +this.$route.query.source || 0,
             tabs: [
               {
                 id: 0,
@@ -95,7 +98,7 @@ export default {
             keyword: '',
             total: 0,
             page: 1,
-            pageSize: 10,
+            pageSize: window.innerWidth > 1700 ? 10 : 8,
             searchTimer: null,
             loadIns: null
         };
@@ -108,6 +111,9 @@ export default {
       })
       this.getClassification(0)
       this.getData()
+      this.$once('hook:beforeDestroy', function() {
+        clearInterval(this.timer)
+      })
     },
     watch: {
         keyword: function(val) {
@@ -118,8 +124,7 @@ export default {
         }
     },
     methods: {
-        getData() {
-          this.loadIns = Loading.service()
+        getList() {
           // 登录前登录后页面调的课程接口不是同一个
           this.$post(this.api[this.isTourist ? 'studentLoginPreCourse' : 'pageConditionalQueryCourseByStudent'], {
             ...this.form,
@@ -138,6 +143,20 @@ export default {
             this.loadIns.close()
           })
         },
+        // 获取redis缓存
+        getRedis() {
+          this.$post(this.api.getRedisCache).then(({ data }) => {
+            data && this.getList()
+          }).catch(res => {})
+        },
+        getData() {
+          this.loadIns = Loading.service()
+          this.getList()
+          if (!Setting.isDev) {
+            clearInterval(this.timer)
+            this.timer = setInterval(this.getRedis, 1000)
+          }
+        },
         initData() {
             this.page = 1;
             this.getData();
@@ -177,7 +196,7 @@ export default {
             this.getData();
         },
         toDetail(id) {
-            this.$router.push(`/${this.isTourist ? 'preCourse' : 'course'}/details?id=${id}`);
+            this.$router.push(`/${this.isTourist ? 'preCourse' : 'course'}/details?id=${id}&source=${this.active}`);
         }
     }
 };
@@ -188,7 +207,8 @@ export default {
     position: relative;
     padding: 100px 0 130px;
     text-align: center;
-    background: url(../../../assets/img/course-bg2.png) (73px 50px)/auto no-repeat,
+    background: url(../../../assets/img/course-bg2.png) (73px 50px)/200px auto no-repeat,
+                url(../../../assets/img/course-bg4.png) (top left)/auto no-repeat,
                 url(../../../assets/img/course-bg3.png) (top right)/auto no-repeat,
                 url(../../../assets/img/course-bg1.png) 0 0/100% 100% no-repeat;
     h6 {
@@ -266,29 +286,39 @@ export default {
         }
     }
     .courses {
-        padding-top: 10px;
+        position: relative;
+        padding: 10px 0 20px;
         background: url(../../../assets/img/course3.png) 0 0/auto no-repeat;
+        .course-bg {
+          position: absolute;
+          top: 0;
+          right: 0;
+          width: 602px;
+          height: 100%;
+          background: url(../../../assets/img/course4.png) (0 -100px)/140% 140% no-repeat;
+        }
         ul {
+            position: relative;
             display: flex;
             flex-wrap: wrap;
+            width: 90%;
+            margin: 0 auto;
         }
         li {
-            width: 24%;
+            width: calc(20% - 20px);
             min-height: 250px;
             overflow: hidden;
             padding: 18px;
-            margin: 10px .5%;
+            margin: 10px;
             cursor: pointer;
             border-radius: 8px;
             background-color: #fff;
             transition: all 0.3s;
-
             img {
                 width: 100%;
                 height: 165px;
                 transition: .3s;
             }
-
             .title {
                 margin: 10px 0 5px;
                 color: #0B1D30;
@@ -299,13 +329,11 @@ export default {
                 text-overflow: ellipsis;
                 white-space: nowrap;
             }
-
             .desc span {
                 color: #f00;
                 font-size: 14px;
                 background-color: #f00;
             }
-
             .desc {
                 color: #757F92;
                 font-size: 14px;
@@ -320,12 +348,23 @@ export default {
                     white-space: nowrap;
                 }
             }
+            .type {
+              display: inline-block;
+              padding: 2px 10px;
+              border-radius: 20px;
+              color: #1cdbb8;
+              border: 1px solid;
+            }
             .metas {
+              display: flex;
+              justify-content: space-between;
+              align-items: center;
               margin-top: 10px;
+            }
+            .meta {
               color: #a9a9a9;
               font-size: 12px;
             }
-
             &:hover {
                 box-shadow: 0px 5px 12px 4px rgba(142, 123, 253, 0.09), 0px 3px 6px 0px rgba(142, 123, 253, 0.12), 0px 1px 2px -2px rgba(142, 123, 253, 0.16);
                 img {
@@ -333,6 +372,11 @@ export default {
                 }
             }
         }
+        @media (max-width: 1700px) {
+          li {
+            width: calc(25% - 20px);
+          }
+        }
     }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/info/details/index.vue b/src/pages/info/details/index.vue
index 52ff439..8461aff 100644
--- a/src/pages/info/details/index.vue
+++ b/src/pages/info/details/index.vue
@@ -27,10 +27,10 @@ import breadcrumb from '@/components/breadcrumb'
 export default {
     data() {
         return {
-            firstName: this.$route.query.first,
+            columnNames: this.$route.query.columnNames,
             breadcrumbQuery: {
               parentId: this.$route.query.parentId,
-              name: this.$route.query.first
+              name: this.$route.query.name
             },
             id: this.$route.query.id,
             coverUrl: '',
@@ -61,7 +61,7 @@ export default {
                     this.content = data.content
                     this.viewCount = data.viewCount
                     this.$forceUpdate()
-                    this.$refs.breadcrumb.update('最新资讯/' + this.title)
+                    this.$refs.breadcrumb.update(`最新资讯/${this.$route.query.name}/${this.columnNames.split(',').join('/')}/${this.title}`)
                     this.loadIns.close()
                 })
                 .catch(err => {
diff --git a/src/pages/info/list/index.vue b/src/pages/info/list/index.vue
index 496e22f..040bb30 100644
--- a/src/pages/info/list/index.vue
+++ b/src/pages/info/list/index.vue
@@ -24,6 +24,8 @@
                                             <span>作者：{{item.author}}</span>
                                             <i class="spe">|</i>
                                             <span>{{item.date.replace(' 00:00:00','')}}</span>
+                                            <i class="spe">|</i>
+                                            <span>浏览量：{{item.viewCount}}</span>
                                         </div>
                                         <div class="desc" :class="{ie: core.isIE() || core.isEdge(),firefox: core.isFirefox() || core.isEdge()}" v-html="item.content"></div>
                                         <a class="detail">查看详情 ></a>
@@ -68,7 +70,9 @@ export default {
             listData: [],
             loadIns: null,
             columnId: '',
-            menuRefresh: false
+            menuRefresh: false,
+            deepId: '',
+            columnNames: []
         };
     },
     components: {
@@ -112,21 +116,40 @@ export default {
             })
             data = res.columnTree
           }
-          this.menuRefresh = false
-          this.menuList = data
-          // 从文章页返回的情况,需要回到之前进文章页的那个分类
-          const historyId = this.historyId
-          if (historyId && data.find(e => e.id === historyId)) {
-            this.defaultIndex = historyId + ''
-            this.getContent(historyId)
+          if (data.length) {
+            this.menuRefresh = false
+            this.menuList = data
+            // 从文章页返回的情况,需要回到之前进文章页的那个分类
+            const historyId = this.historyId
+            console.log("🚀 ~ file: index.vue ~ line 122 ~ getData ~ historyId", historyId)
+            if (historyId) {
+              this.setColumnId('')
+              this.defaultIndex = historyId + ''
+              this.getContent(historyId)
+            } else {
+              // 正常情况默认展示第一个分类下的文章列表
+              data.length && this.getDeepId(data[0].children)
+              const id = this.deepId
+              if (id) {
+                this.getContent(id)
+                this.defaultIndex = id + ''
+              }
+            }
+            this.$nextTick(() => {
+              this.menuRefresh = true
+            })
           } else {
-            // 正常情况默认展示第一个分类下的文章列表
-            const id = data.length ? data[0].id : parentId
-            this.getContent(id)
-            this.defaultIndex = id + ''
+            this.loadIns.close()
           }
-          this.$nextTick(() => {
-            this.menuRefresh = true
+        },
+        // 获取最深的层级的id
+        getDeepId(data) {
+          data.map(e => {
+            if (e.children.length) {
+              this.getDeepId(e.children)
+            } else {
+              this.deepId = e.id
+            }
           })
         },
         initData(index,indexPath){
@@ -156,10 +179,27 @@ export default {
             this.page = val;
             this.getContent(this.columnId);
         },
-        toArticle(id){
+        // 获取该文章所属的所有栏目名称
+        getColumnName(data, names = []) {
+          for (let i = 0; i < data.length; i++) {
+            const e = data[i]
+            names.push(e.name)
+            if (e.id == this.columnId) {
+              console.log("🚀 ~ file: index.vue ~ line 188 ~ getColumnName ~ this.defaultIndex", this.defaultIndex)
+              this.columnNames = JSON.parse(JSON.stringify(names))
+              break
+            } else {
+              this.getColumnName(e.children, names)
+            }
+            names = []
+          }
+        },
+        toArticle(id) {
           const columnId = this.columnId
           this.setColumnId(columnId)
-          this.$router.push(`/${this.$route.path === '/info/list' ? 'info' : 'preInfo'}/details?parentId=${this.$route.query.parentId}&id=${id}`)
+          this.getColumnName(this.menuList, [])
+          console.log("🚀 ~ file: index.vue ~ line 199 ~ toArticle ~ menuList", this.columnNames)
+          this.$router.push(`/${this.$route.path === '/info/list' ? 'info' : 'preInfo'}/details?parentId=${this.$route.query.parentId}&name=${this.$route.query.name}&id=${id}&columnNames=${this.columnNames}`)
         }
     }
 };
@@ -171,7 +211,7 @@ export default {
         height: 350px;
         padding: 100px 0 0 180px;
         background: url(../../../assets/img/info-bg6.png) (0 0)/auto no-repeat,
-                    url(../../../assets/img/info-bg7.png) (25% 140px)/auto no-repeat,
+                    url(../../../assets/img/info-bg7.png) (25% 110px)/400px auto no-repeat,
                     url(../../../assets/img/info-bg4.png) (top right)/auto no-repeat,
                     url(../../../assets/img/info-bg5.png) (80% 20px)/auto no-repeat,
                     url(../../../assets/img/info-bg3.png) 0 0/100% 100% no-repeat;
diff --git a/src/pages/screen/index.vue b/src/pages/screen/index.vue
index e37ae11..b026e52 100644
--- a/src/pages/screen/index.vue
+++ b/src/pages/screen/index.vue
@@ -83,7 +83,7 @@
                   <i class="b_r_line"></i> 
               </div> 
               <div class="main_title">
-                  <img src="@/assets/img/screen/t_2.png" alt="">
+                  <img src="@/assets/img/screen/t_7.png" alt="">
                   月人均在线学习时长情况
               </div>
               <div id="chart3" class="chart t_btn9"></div>
@@ -206,7 +206,11 @@
                   本月综合学习积极性最高的实验课程
               </div>
               <ul class="list">
-                <li v-for="(item, i) in courses" :key="i">{{ item.curriculumName }}</li>
+                <li v-for="(item, i) in courses" :key="i">
+                  <span class="index">{{ i + 1 }}</span>
+                  <p class="text">{{ item.curriculumName }}</p>
+                  <img class="icon" src="@/assets/img/screen/medal.png" alt="">
+                </li>
               </ul>
           </div>
           <div class="item" style="height: 240px">
@@ -234,9 +238,14 @@
                   <img src="@/assets/img/screen/t_5.png" alt="">
                   热门理论课程排行榜
               </div>
-              <ul class="list" style="margin-top: 45px;">
-                <li v-for="(item, i) in popularCourses" :key="i">{{ item }}</li>
-              </ul>
+              <div class="popular-wrap" ref="popularCourses">
+                <ul class="list popular">
+                  <li v-for="(item, i) in popularCourses" :key="i">
+                    <span class="index">{{ i + 1 }}</span>
+                    <p class="text">{{ item }}</p>
+                  </li>
+                </ul>
+              </div>
           </div>
           <div class="item" style="height: 630px">
             <div class="t_line_box">
@@ -267,12 +276,12 @@
                     <th width="20%">姓名</th>
                     <th width="20%">班级</th>
                     <th width="20%">练习次数</th>
-                    <th width="20%">练习平均分</th>
+                    <th width="20%">平均分</th>
                   </tr>
                 </thead>
               </table>
             </div>
-            <div class="main_table" ref="tableWrap" style="margin-top: 0;overflow: auto">
+            <div class="main_table" style="margin-top: 0;overflow: auto">
               <table>
                 <tbody>
                   <tr v-for="(item, i) in achs" :key="i">
@@ -314,7 +323,8 @@ export default {
           cryptoList: [],
           courses: [],
           popularCourses: [],
-          achs: []
+          achs: [],
+          examChart: null
         }
     },
     mounted() {
@@ -370,6 +380,7 @@ export default {
           })
           this.achs = data
         }).catch(res => {})
+        this.scrollTable()
       },
       // 切换时间单位
       switchTime(id) {
@@ -434,7 +445,8 @@ export default {
 							}
 						]
 					}
-          echarts.init(document.querySelector(`#chart1`)).setOption(option)
+          this.examChart = echarts.init(document.querySelector(`#chart1`))
+          this.examChart.setOption(option)
         }).catch(res => {})
       },
       // 获取图标数据并渲染
@@ -508,7 +520,7 @@ export default {
                 endValue: 5  // 一次性展示6个。
               }
             ],
-						color:['#56f3f7', '#b76fff', '#5492ff', '#e51579'],
+						color:['#4388ff', '#44cfff', '#8c2bff', '#2defe2'],
             xAxis: [
               {
                 type: 'category',
@@ -517,7 +529,14 @@ export default {
                   lineStyle: {
                     color: '#fff'
                   }
-                }
+                },
+                axisLabel: {
+                  interval: 0,
+                  textStyle: {
+                    color: '#fff',
+                  },
+                  rotate: 60
+                },
               }
             ],
             yAxis: [
@@ -540,7 +559,7 @@ export default {
             ],
             series: [
               {
-                name: '不及格',
+                name: '60以下',
                 type: 'bar',
                 stack: 'Ad',
                 emphasis: {
@@ -549,7 +568,7 @@ export default {
                 data: data1
               },
               {
-                name: '及格',
+                name: '60-69',
                 type: 'bar',
                 stack: 'Ad',
                 emphasis: {
@@ -558,7 +577,7 @@ export default {
                 data: data2
               },
               {
-                name: '良',
+                name: '70-89',
                 type: 'bar',
                 stack: 'Ad',
                 emphasis: {
@@ -601,152 +620,185 @@ export default {
           {
             color1: '#f9d437',
             color2: 'rgba(255, 234, 144, 0.4)'
+          },
+          {
+            color1: '#912892',
+            color2: 'rgba(31, 24, 153, 0.4)'
+          },
+          {
+            color1: '#f21259',
+            color2: 'rgba(213, 22, 11, 0.4)'
+          },
+          {
+            color1: '#7343fe',
+            color2: 'rgba(243, 123, 2, 0.4)'
+          },
+          {
+            color1: '#ea7321',
+            color2: 'rgba(65, 94, 123, 0.4)'
+          },
+          {
+            color1: '#934ea2',
+            color2: 'rgba(32, 123, 223, 0.4)'
+          },
+          {
+            color1: '#672313',
+            color2: 'rgba(156, 163, 2, 0.4)'
           }
         ]
-        this.$post(this.api.studentAssessSchievement, times).then(({ data }) => {
-          const times = []
-          const courses = []
-          const series = []
+        this.$get(this.api.schoolCourse).then(({ data }) => {
+          const courseList = data
+          const ids = data.map(e => e.cid)
+          times.map(e => {
+            e.cid = ids
+          })
           const courseData = {}
-          data.map(e => {
-            times.push(e.time)
-            e.assesScoreRespList.map(n => {
-              const name = n.curriculumName
-              courses.push(n.curriculumName)
-              if (courseData[name]) {
-                courseData[name].push(+n.avgScore)
-              } else {
-                courseData[name] = [+n.avgScore]
-              }
-            })
+          courseList.map(e => {
+            e.curriculumName = e.curriculumName.substring(0, 10)
+            courseData[e.curriculumName] = []
           })
-          let index = 0
-          // 生成series
-          for (const i in courseData) {
-            series.push({
-              name: i,
-              type: 'line',
-              smooth: true,
-              symbol: 'circle',
-              symbolSize: 5,
-              showSymbol: false,
-              lineStyle: {
-                normal: {
-                  color: colors[index].color1,
-                  width: 2
-                }
-              },
-              areaStyle: {
-                normal: {
-                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                    offset: 0,
-                    color: colors[index].color2
-                  }, {
-                    offset: 0.8,
-                    color: colors[index].color2
-                  }], false),
-                  shadowColor: 'rgba(0, 0, 0, 0.1)',
-                }
-              },
-              itemStyle: {
-                normal: {
-                  color: colors[index].color1,
-                  borderColor: 'rgba(221, 220, 107, .1)',
-                  borderWidth: 12
+          this.$post(this.api.studentAssessSchievement, times).then(({ data }) => {
+            const times = []
+            const series = []
+            data.map(e => {
+              times.push(e.time)
+              e.assesScoreRespList.map(n => {
+                const item = courseList.find(j => j.cid == n.curriculumId)
+                if (item) {
+                  const name = item.curriculumName
+                  if (courseData[name]) {
+                    courseData[name].push(+n.avgScore)
+                  }
                 }
-              },
-              data: courseData[i]
+              })
             })
-            ++index
-            if (index > 3) index = 0
-          }
-          const option = {
-            tooltip: {
-              trigger: 'axis',
-              axisPointer: {
+            let index = 0
+            // 生成series
+            for (const i in courseData) {
+              series.push({
+                name: i,
+                type: 'line',
+                smooth: true,
+                symbol: 'circle',
+                symbolSize: 5,
+                showSymbol: false,
                 lineStyle: {
-                    color: '#dddc6b'
-                }
-              }
-            },
-            legend: {
-              top:'8%',
-              data: courses,
-              textStyle: {
-                color: 'rgba(255,255,255,.5)',
-                fontSize:'12',
-              }
-            },
-            dataZoom: [//滑动条
-              {
-                xAxisIndex: 0,//这里是从X轴的0刻度开始
-                show: false,//是否显示滑动条，不影响使用
-                type: 'slider', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-                startValue: 0, // 从头开始。
-                endValue: 6  // 一次性展示6个。
-              }
-            ],
-            grid: {
-              left: '30',
-              top: '27%',
-              right: '10',
-              bottom: '5%',
-              containLabel: true
-            },
-            xAxis: [{
-              type: 'category',
-              boundaryGap: false,
-              axisLabel:  {
-                textStyle: {
-                  color: "rgba(255,255,255,.9)",
-                  fontSize:12,
+                  normal: {
+                    color: colors[index].color1,
+                    width: 2
+                  }
                 },
-              },
-              axisLine: {
-                lineStyle: { 
-                  color: 'rgba(255,255,255,.2)'
+                areaStyle: {
+                  normal: {
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                      offset: 0,
+                      color: colors[index].color2
+                    }, {
+                      offset: 0.8,
+                      color: colors[index].color2
+                    }], false),
+                    shadowColor: 'rgba(0, 0, 0, 0.1)',
+                  }
+                },
+                itemStyle: {
+                  normal: {
+                    color: colors[index].color1,
+                    borderColor: 'rgba(221, 220, 107, .1)',
+                    borderWidth: 12
+                  }
+                },
+                data: courseData[i]
+              })
+              ++index
+              if (index > 9) index = 0
+            }
+            const option = {
+              tooltip: {
+                trigger: 'axis',
+                axisPointer: {
+                  lineStyle: {
+                      color: '#dddc6b'
+                  }
                 }
               },
-              data: times
-            }, {
-              axisPointer: {show: false},
-              axisLine: {show: false},
-              position: 'bottom',
-              offset: 20,
-            }],
-            yAxis: [{
-              type: 'value',
-              name: '平均分',
-              nameTextStyle: {
-                color: '#fff'
+              legend: {
+                top:'8%',
+                data: courseList.map(e => e.curriculumName),
+                textStyle: {
+                  color: 'rgba(255,255,255,.5)',
+                  fontSize:'12',
+                }
               },
-              axisTick: {show: false},
-              axisLine: {
-                lineStyle: {
-                  color: 'rgba(255,255,255,.1)'
+              dataZoom: [//滑动条
+                {
+                  xAxisIndex: 0,//这里是从X轴的0刻度开始
+                  show: false,//是否显示滑动条，不影响使用
+                  type: 'slider', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+                  startValue: 0, // 从头开始。
+                  endValue: 6  // 一次性展示6个。
                 }
+              ],
+              grid: {
+                left: '30',
+                top: '32%',
+                right: '10',
+                bottom: '5%',
+                containLabel: true
               },
-              axisLabel:  {
-                textStyle: {
-                  color: "rgba(255,255,255,.9)",
-                  fontSize:12,
+              xAxis: {
+                type: 'category',
+                boundaryGap: false,
+                axisLabel:  {
+                  textStyle: {
+                    color: "rgba(255,255,255,.9)",
+                    fontSize:12,
+                  },
+                },
+                axisLine: {
+                  lineStyle: { 
+                    color: 'rgba(255,255,255,.2)'
+                  }
                 },
+                data: times
               },
-              splitLine: {
-                lineStyle: {
-                  color: 'rgba(255,255,255,.1)'
+              yAxis: [{
+                type: 'value',
+                name: '平均分',
+                min: 0,
+                max: 100,
+                interval: 10,
+                splitNumber: 10,
+                nameTextStyle: {
+                  color: '#fff'
+                },
+                axisTick: {show: false},
+                axisLine: {
+                  lineStyle: {
+                    color: 'rgba(255,255,255,.1)'
+                  }
+                },
+                axisLabel:  {
+                  textStyle: {
+                    color: "rgba(255,255,255,.9)",
+                    fontSize:12,
+                  },
+                },
+                splitLine: {
+                  lineStyle: {
+                    color: 'rgba(255,255,255,.1)'
+                  }
                 }
-              }
-            }],
-            series
-          }
-          chart[1] = echarts.init(document.querySelector(`#chart5`))
-          chart[1].setOption(option)
-          setInterval(function () {
-            animateChart(chart[1], option, times)
-          }, 5000)
-        }).catch(res => {})
-        
+              }],
+              series
+            }
+            chart[1] = echarts.init(document.querySelector(`#chart5`))
+            chart[1].setOption(option)
+            // setInterval(function () {
+            //   animateChart(chart[1], option, times)
+            // }, 5000)
+          }).catch(res => {})
+        }).catch(err => {})
+
         // 月人均在线学习时长情况
         const date = new Date()
         date.setMonth(date.getMonth() + 1)
@@ -949,28 +1001,27 @@ export default {
             animateChart(chart[3], option, data, 3)
           }, 1500)
         }).catch(res => {})
-        
-        // this.scrollTable()
 
         // 监听resize事件，动态改变chart大小
         window.addEventListener('resize', () => {
+          this.examChart && this.examChart.resize()
           for (let i = 0; i < 4; i++) {
             chart[i] && chart[i].resize()
           }
         })
       },
       // 表格滚动效果
-      // scrollTable() {
-      //   const dom = this.$refs.tableWrap
-      //   const dom1 = this.$refs.gdpList
-      //   setInterval(() => {
-      //     dom.scrollTop += 1
-      //     if (dom.clientHeight + dom.scrollTop === dom.scrollHeight) dom.scrollTop = 0
+      scrollTable() {
+        const dom = this.$refs.popularCourses
+        // const dom1 = this.$refs.gdpList
+        setInterval(() => {
+          dom.scrollTop += 1
+          if (dom.clientHeight + dom.scrollTop === dom.scrollHeight) dom.scrollTop = 0
 
-      //     dom1.scrollTop += 1
-      //     if (dom1.clientHeight + dom1.scrollTop === dom1.scrollHeight) dom1.scrollTop = 0
-      //   }, 30)
-      // }
+          // dom1.scrollTop += 1
+          // if (dom1.clientHeight + dom1.scrollTop === dom1.scrollHeight) dom1.scrollTop = 0
+        }, 30)
+      }
     }
 };
 </script>
diff --git a/src/pages/station/preview/index.vue b/src/pages/station/preview/index.vue
index 9d75e34..95cea99 100644
--- a/src/pages/station/preview/index.vue
+++ b/src/pages/station/preview/index.vue
@@ -162,6 +162,7 @@ export default {
         this.getChapter();
     },
     destroyed() {
+      // 记录播放时长
       this.$post(this.api.playRecordSave, {
         courseId: this.courseId,
         courseType: 0,
diff --git a/src/setting.js b/src/setting.js
index f6cf359..fc0ccb8 100644
--- a/src/setting.js
+++ b/src/setting.js
@@ -27,7 +27,7 @@ if (isPro) {
     systemPath = `http://${location.hostname}:8093`
     host = "http://121.37.12.51/"; // 测试服
     // host = 'https://www.occupationlab.com/' // 正式服
-    host = "http://192.168.31.151:9000/"; // 榕
+    // host = "http://192.168.31.151:9000/"; // 榕
     // host = "http://192.168.31.137:9000/"; // 赓
 }
 
diff --git a/src/store/modules/project.js b/src/store/modules/project.js
index 73d0746..7fb12d9 100644
--- a/src/store/modules/project.js
+++ b/src/store/modules/project.js
@@ -5,7 +5,8 @@ export default {
     namespaced: true,
     state: {
         currId: '',
-        lastRecordType: "practice"
+        lastRecordType: "practice",
+        courseId: ''
     },
     mutations: {
         SET_CURRICULUM: (state, currId) => {
@@ -13,6 +14,9 @@ export default {
         },
         SET_RECORD: (state, type) => {
             state.lastRecordType = type;
+        },
+        SET_COURSE: (state, courseId) => {
+            state.courseId = courseId
         }
     },
     actions: {
diff --git a/src/styles/page/screen.scss b/src/styles/page/screen.scss
index c7e0eeb..aa0f718 100644
--- a/src/styles/page/screen.scss
+++ b/src/styles/page/screen.scss
@@ -1,6 +1,15 @@
 @import "../var.scss";
+// ::-webkit-scrollbar-thumb {
+//   display: none;
+// }
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
 ::-webkit-scrollbar-thumb {
-  display: none;
+  width: 5px;
+  border-radius: 6px;
+  background: rgba(85, 219, 255, .8);
 }
 .video {
   position: absolute;
@@ -144,7 +153,7 @@
   z-index: 2;
   position: absolute;
   display: flex;
-  top: 10px;
+  top: 24px;
   right: 10px;
   li {
     padding: 0 14px;
@@ -288,7 +297,9 @@ $height: 250px;
     width: 24%;
   }
   .middle {
-    flex: 1;
+    // flex: 1;
+    width: 913px;
+    min-width: 913px;
     margin: 0 30px;
   }
   .item {
@@ -297,21 +308,101 @@ $height: 250px;
     margin-bottom: 30px;
     border: 1px solid #2C58A6;
     box-shadow: 0 0 10px #2C58A6;
-    // background-color: #073a7d;
   }
 }
 .chart {
   height: $height;
 }
+.popular-wrap {
+  height: 170px;
+  margin-top: 45px;
+  overflow: auto;
+  &::-webkit-scrollbar-thumb {
+    display: none;
+  }
+}
 .list {
   padding: 0 15px;
   margin-top: 25px;
-  text-align: center;
+  overflow: auto;
   li {
-    line-height: 40px;
+    position: relative;
+    padding: 10px 10px;
+    &:nth-child(2) {
+      .index {
+        background-color: #67a0ff;
+      }
+    }
+    &:nth-child(3) {
+      .index {
+        background-color: #2b71ff;
+      }
+    }
+    &:nth-child(4) {
+      .index {
+        background-color: #8c2bff;
+      }
+    }
+    &:nth-child(5) {
+      .index {
+        background-color: #ff612b;
+      }
+    }
+    &:nth-child(6) {
+      .index {
+        background-color: #4152f1;
+      }
+    }
+    &:nth-child(7) {
+      .index {
+        background-color: #d14cc9;
+      }
+    }
+    &:nth-child(8) {
+      .index {
+        background-color: #f52c8d;
+      }
+    }
+    &:nth-child(9) {
+      .index {
+        background-color: #f1561b;
+      }
+    }
+    &:nth-child(10) {
+      .index {
+        background-color: #f50000;
+      }
+    }
+  }
+  &.popular {
+    margin-top: 0;
+    li:nth-child(odd) {
+      background-color: #072951;
+      box-shadow:-10px 0px 15px #2C58A6 inset, 10px 0px 15px #2C58A6 inset;
+    }
+  }
+  .index {
+    position: absolute;
+    width: 20px;
+    line-height: 20px;
+    color: #fff;
+    font-size: 12px;
+    text-align: center;
+    border-radius: 50%;
+    background-color: #2defe2;
+  }
+  .text {
+    width: 60%;
+    margin: 0 auto;
     color: #61d2f7;
+    text-align: center;
     @include ellipsis;
   }
+  .icon {
+    position: absolute;
+    top: 10px;
+    right: 10%;
+  }
 }
 .main_title{
   display: flex;
diff --git a/vue.config.js b/vue.config.js
index 08992b8..824ccda 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -13,6 +13,9 @@ module.exports = {
     outputDir: Setting.outputDir,
     assetsDir: Setting.assetsDir,
     devServer: {
-        port: 8082 // 固定端口
+      // client: {
+      //   webSocketURL: 'ws://0.0.0.0:8082/notice',
+      // },
+      port: 8082 // 固定端口
     }
 };
\ No newline at end of file