完善上课消耗表

src/api/course/index.js

@@ -277,6 +277,13 @@ export function queryChapterTree(data) {
   })
 }
 
+export function queryScheduleCourseStu(data) {
+  return request({
+    url: "/ScheduleCourse/GetScheduleCourseStu ",
+    method: 'post',
+    data
+  })
+}
 /**
  * 保存课程章节
  * @param {JSON参数} data 

src/components/common/scrollBar.vue

 <template>
-    <div class="col"></div>
+    <div class="col scroll-box" id="scrollBox" @scroll="(e)=>scrollHandle(e)">
+        <div :style="{width: innerW}" id="scrollInnerTemplate"></div>
+    </div>
 </template>
 
 <script>
@@ -15,26 +17,45 @@ export default {
     }
   },
   data() {
-    return {};
+    return {
+        innerW:'0px',
+        ratio:0,
+        boxRatio:0
+    };
   },
   methods: {
     createResizeObserver() {
       this.resizeObserver = new ResizeObserver(entries => {
-        for (let entry of entries) {
-          console.log("Element size changed:", entry.contentRect);
-          // 你可以在这里处理大小变化的逻辑
-        }
+        this.calcHandle()
       });
-      this.resizeObserver.observe(this.$refs.resizeElement);
+      this.resizeObserver.observe(document.querySelector(`#${this.targetBox}`));
+      this.resizeObserver.observe(document.querySelector(`#${this.targetWrap}`));
     },
     destroyResizeObserver() {
       if (this.resizeObserver) {
         this.resizeObserver.disconnect();
       }
+    },
+    calcHandle(){
+        const box = document.querySelector('#scrollBox')
+        const tb = document.querySelector(`#${this.targetBox}`)
+        const tw = document.querySelector(`#${this.targetWrap}`)
+        
+        if(box && tb && tw){
+            this.ratio = tw.offsetWidth/tb.offsetWidth
+            this.innerW = `${this.ratio * box.offsetWidth}px`
+            this.boxRatio = tb.offsetWidth/box.offsetWidth
+        }
+    },
+    scrollHandle(e){
+      const box = document.querySelector('#scrollBox')
+      const sl = box.scrollLeft*this.boxRatio
+      this.$emit("scrollChange", sl);
     }
   },
   mounted() {
     this.createResizeObserver();
+    
   },
   beforeDestroy() {
     this.destroyResizeObserver();
@@ -43,6 +64,11 @@ export default {
 </script>
 
 <style>
+.scroll-box{
+    overflow-x: auto;
+    overflow-y: hidden;
+    height: 15px;
+}
 .scroll-box::-webkit-scrollbar {
   width: 6px;
   height: 6px;