1

src/api/customerstudent/customerstudent.js

@@ -280,4 +280,16 @@ export function GetStudentAdvisorPage(data) {
     method: 'post',
     data
   })
+}
+
+/**
+ * 获取上课记录
+ * @param {JSON参数} data
+ */
+export function GetStuLearnChapterList(data) {
+  return request({
+    url: '/Scroll/GetStuLearnChapterList',
+    method: 'post',
+    data
+  })
 }
\ No newline at end of file

src/components/school/student/class-record.vue

+<style>
+  .record_Main {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    height: 100%;
+  }
+
+  .StuCkedType {
+    color: #3470ff;
+    font-weight: 700;
+  }
+  .record_cala_Num {
+    height: 20px;
+    padding-left: 14px;
+    background: #d0d5db;
+    border-radius: 10px;
+    margin: 10px 20px 0 0;
+    position: absolute;
+    left: 15px;
+    top: 50%;
+    margin-top: -10px;
+  }
+
+ .record_cala_Num>span {
+    min-width: 24px;
+    height: 24px;
+    padding: 4px;
+    margin: -2px -4px 0 0;
+    background: #d0d5db;
+    display: block;
+    border-radius: 20px;
+  }
+
+ .record_cala_Num>span>i {
+    min-width: 16px;
+    height: 16px;
+    padding: 0 2px;
+    line-height: 16px;
+    background: #fff;
+    font-size: 12px;
+    font-family: Arial;
+    color: #a8a8b3;
+    border-radius: 20px;
+    display: block;
+    text-align: center;
+    font-style: normal;
+  }
+
+
+</style>
+<template>
+  <div>
+    <div>
+        <q-tabs v-model="ckedTab" @input="getTabcheck()" dense align="left" class="text-teal" style="margin-bottom:20px;">
+            <q-tab v-for="(item,index) in dataList" :key="index" :name="index" :label="item.CourseName+'('+item.OrderId+')'" />
+        </q-tabs>
+    </div>
+    <div class="record_Main">
+      <div style="display:flex;justify-content:space-between;align-items:center;">
+        <div>课程进度：{{CourseChapterNo}}/{{TotalChapterNo}}</div>
+        <div>
+          <q-select dense filled v-model="Status" @input="getStatus" style="width:160px;margin-right:10px;" :options="StatusList" option-label="Name" option-value="Id"
+            emit-value map-options label="状态" />
+        </div>
+      </div>
+      <div>
+          <el-table :data="chapterList" v-loading="loading" ref="table" :height="tableHeight" style="width: 100%;">
+            <el-table-column prop="ChapterNo" label="章节" width="450">
+              <template slot-scope="scope">
+                <div style="display: inline-block;">
+                  <div class="flex q-ml-md">
+                    <div class="record_cala_Num" v-if="scope.row.ChapterNo.indexOf('.') == -1" style="cursor:pointer;">
+                      <span>
+                        <i>{{ scope.row.ChapterNo }}</i>
+                      </span>
+                    </div>
+                    <div style="margin-left: 36px;width:360px;cursor:pointer;" class="ellipsis"
+                      v-if="scope.row.ChapterNo.indexOf('.') == -1">
+                      {{ scope.row.ChapterName }}
+                    </div>
+                  </div>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column prop="State" label="状态" width="100">
+              <template slot-scope="scope">
+                <div class="text-positive" v-if="scope.row.State == 1">
+                  正常上课
+                </div>
+                <div class="text-warning" v-if="scope.row.State == 2">补课</div>
+                <div class="text-negative" v-if="scope.row.State == 3">缺课</div>
+              </template>
+            </el-table-column>
+          </el-table>
+
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+  import {
+    GetStuLearnChapterList //学员订单分页列表
+  } from "../../../api/customerstudent/customerstudent";
+  export default {
+    meta: {
+      title: "上课记录"
+    },
+    components: {},
+    props: {
+      saveObj: {
+        type: Object,
+        default: null
+      }
+    },
+    data() {
+      return {
+        persistent: true,
+        StatusList: [{
+          Name: '全部',
+          Id: 0
+        },{
+          Name: '正常上课',
+          Id: 1
+        }, {
+          Name: '补课',
+          Id: 2
+        }, {
+          Name: '缺课',
+          Id: 3
+        }],
+        dataList: [],
+        loading: false,
+        Status:0,//状态
+        msg: {
+          StuId: ''
+        },
+        chapterList:[], //章节
+        ckedTab:0,
+        CourseChapterNo:0, //当前进度
+        TotalChapterNo:0, //总进度
+        tableHeight: 200,
+      };
+    },
+    created() {
+      if (this.saveObj.StuId > 0) {
+        this.msg.StuId = this.saveObj.StuId;
+      }
+    },
+    mounted() {
+      setTimeout(() => {
+        this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 100;
+      }, 100)
+      this.getList();
+    },
+    methods: {
+      getList() {
+        this.loading = true;
+        GetStuLearnChapterList(this.msg).then(res => {
+          this.loading = false;
+          if (res.Code == 1) {
+            this.dataList = res.Data;
+            if(this.dataList.length>0){
+                this.chapterList = this.dataList[0].ChapterList;
+                this.CourseChapterNo = this.dataList[0].CourseChapterNo;
+                this.TotalChapterNo = this.dataList[0].TotalChapterNo;
+            }
+          }
+        });
+      },
+      getTabcheck(){
+        this.chapterList = this.dataList[this.ckedTab].ChapterList;
+        this.CourseChapterNo = this.dataList[this.ckedTab].CourseChapterNo;
+        this.TotalChapterNo = this.dataList[this.ckedTab].TotalChapterNo;
+      },
+      //根据状态过滤
+      getStatus(){
+        let dataArray = [];
+        if(this.Status==0){
+            dataArray = this.dataList[this.ckedTab].ChapterList;
+        }else{
+            this.dataList[this.ckedTab].ChapterList.forEach(x=>{
+                if(x.State==this.Status){
+                    dataArray.push(x);
+                }
+            })
+        }
+        this.chapterList = dataArray;
+      }
+    }
+  };
+
+</script>

src/components/school/student/studentRight-form.vue

@@ -47,6 +47,7 @@
               <q-tab :name="3" label="订单" />
               <q-tab :name="4" label="合同" />
               <q-tab v-if="!baseObj.noEdit" :name="5" label="服务人员" />
+              <q-tab :name="6" label="上课记录" />
             </q-tabs>
             <div class="operate_Content" style="flex:1;">
               <div class="detail_Main">
@@ -91,6 +92,9 @@
                   <student-Assit :save-obj="baseObj" :BelongType="BelongType" @success="refreshStudentPage">
                   </student-Assit>
                 </template>
+                <template v-if="ckedTab == 6">
+                  <classRecord :save-obj="baseObj" @success="refreshStudentPage"></classRecord>
+                </template>
               </div>
             </div>
           </div>
@@ -126,6 +130,7 @@
   import studentOrder from "../student/student-order";
   import studentAssit from "../student/student-Assit";
   import consultFrom from "../student/consult-from";
+  import classRecord from "../student/class-record"
   import {
     SetStudentAssistBatch
   } from "../../../api/sale/sale";
@@ -144,7 +149,8 @@
       studentOrder,
       studentAssit,
       consultFrom,
-      studentConsult
+      studentConsult,
+      classRecord
     },
     props: {
       saveObj: {