修改样式

src/businessComponents/globalTools/globalTools.vue

@@ -95,24 +95,25 @@ function computePos(type: "width" | "height", value: number | string) {
 let isLock = false
 let toolMoveY = 0 // 移动的距离
 function drag(el: HTMLElement) {
-   function mousedown(e: MouseEvent) {
-      e.stopPropagation()
-      e.preventDefault()
+   function mousedown(e: MouseEvent | TouchEvent) {
+      const isTouchEv = isTouchEvent(e)
+      const event = isTouchEv ? e.touches[0] : e
       isLock = false
       isMask.value = true
       const parentElement = el
       const parentElementRect = parentElement.getBoundingClientRect()
-      const downX = e.clientX
-      const downY = e.clientY
+      const downX = event.clientX
+      const downY = event.clientY
       // const clientWidth = document.documentElement.clientWidth
       const clientHeight = document.documentElement.clientHeight
       // const minLeft = 0
       const minTop = 0
       // const maxLeft = clientWidth - parentElementRect.width
       const maxTop = clientHeight - parentElementRect.height
-      function onMousemove(e: MouseEvent) {
+      function onMousemove(e: MouseEvent | TouchEvent) {
+         const event = isTouchEvent(e) ? e.touches[0] : e
          // let moveX = parentElementRect.left + (e.clientX - downX)
-         let moveY = parentElementRect.top + (e.clientY - downY)
+         let moveY = parentElementRect.top + (event.clientY - downY)
          // let moveY = e.clientY - downY
          // moveX = moveX < minLeft ? minLeft : moveX > maxLeft ? maxLeft : moveX
          moveY = moveY < minTop ? minTop : moveY > maxTop ? maxTop : moveY
@@ -120,8 +121,8 @@ function drag(el: HTMLElement) {
          document.documentElement.style.setProperty("--toolTranslateY", `${moveY}px`)
 
          // 计算移动的距离
-         const cX = e.clientX - downX
-         const cY = e.clientY - downY
+         const cX = event.clientX - downX
+         const cY = event.clientY - downY
 
          // 如果移动距离超过一定阈值，则认为是拖动
          if (Math.abs(cX) > 3 || Math.abs(cY) > 3) {
@@ -129,14 +130,18 @@ function drag(el: HTMLElement) {
          }
       }
       function onMouseup() {
-         document.removeEventListener("mousemove", onMousemove)
-         document.removeEventListener("mouseup", onMouseup)
+         document.removeEventListener(isTouchEv ? "touchmove" : "mousemove", onMousemove)
+         document.removeEventListener(isTouchEv ? "touchend" : "mouseup", onMouseup)
          isMask.value = false
       }
-      document.addEventListener("mousemove", onMousemove)
-      document.addEventListener("mouseup", onMouseup)
+      document.addEventListener(isTouchEv ? "touchmove" : "mousemove", onMousemove)
+      document.addEventListener(isTouchEv ? "touchend" : "mouseup", onMouseup)
    }
-   el.addEventListener("mousedown", mousedown, true)
+   el.addEventListener("mousedown", mousedown)
+   el.addEventListener("touchstart", mousedown)
+}
+function isTouchEvent(e: MouseEvent | TouchEvent): e is TouchEvent {
+   return window.TouchEvent && e instanceof window.TouchEvent
 }
 //重新计算位置 居中
 function refreshPos() {

src/views/coursewarePlay/components/useCoursewarePlayTip/index.ts

@@ -23,8 +23,8 @@ export default ({ text, onCancel, onOk, onClose, btnShow, headImg }: objType) =>
    modalFrame({
       maskClose: true,
       template: coursewarePlayTip,
-      width: 740,
-      height: 470,
+      width: 840,
+      height: 570,
       btnShow: [],
       modalData: {
          text,

src/views/coursewarePlay/coursewarePlay.vue

@@ -103,7 +103,7 @@
       <el-drawer class="elDrawer" v-model="drawerShow" :show-close="false">
          <template #header="{ close }">
             <img class="directory" src="@/img/coursewarePlay/kcml.png" />
-            <div class="tit">课程目录</div>
+            <div class="tit">知识点目录</div>
             <img class="close" @click="close" src="@/img/coursewarePlay/close.png" />
          </template>
          <ElScrollbar class="elScrollbar">
@@ -395,21 +395,26 @@ function handleKeydown(e: KeyboardEvent) {
 
    if (key === " ") {
       closeAllModalFrame()
+      drawerShow.value = false
       // 视频类型的时候才触发
       fileType.value === "VIDEO" && handleVideoPlay()
    } else if (key === "ArrowLeft") {
       closeAllModalFrame()
+      drawerShow.value = false
       // 视频类型的时候才触发
       fileType.value === "VIDEO" && handleVideoSpeedCurrentTime("slow")
    } else if (key === "ArrowRight") {
       closeAllModalFrame()
+      drawerShow.value = false
       // 视频类型的时候才触发
       fileType.value === "VIDEO" && handleVideoSpeedCurrentTime("fast")
    } else if (key === "ArrowDown") {
       closeAllModalFrame()
+      drawerShow.value = false
       handleChangeCourseware(1)
    } else if (key === "ArrowUp") {
       closeAllModalFrame()
+      drawerShow.value = false
       handleChangeCourseware(-1)
    }
 }