Browse Source

Merge branch 'hqyDev' of http://git.dayaedu.com/huangqiyong/pptList into test-online

黄琪勇 2 months ago
parent
commit
52f060d18a

+ 2 - 2
src/views/Editor/CanvasTool/index.vue

@@ -404,7 +404,7 @@ function handleResources(item: Record<string, any>) {
         })
         ElMessage({
           showClose: true,
-          message: "已添加到音频列表!",
+          message: "已添加到音频列表",
           type: "success"
         })
       }
@@ -412,7 +412,7 @@ function handleResources(item: Record<string, any>) {
       createEnjoyElement(item.id, item.name, item.content)
       ElMessage({
         showClose: true,
-        message: "已添加到音频列表!",
+        message: "已添加到音频列表",
         type: "success"
       })
     }

+ 22 - 6
src/views/components/element/enjoyElement/enjoyPlayer.vue

@@ -1,5 +1,11 @@
 <template>
-  <div class="enjoyPlayer">
+  <div
+    class="enjoyPlayer"
+    v-click-outside="handleListOutside"
+    :style="{
+      transform: `scale(${scaleStyle})`
+    }"
+  >
     <div v-if="!isBase" v-show="isShowEnjoyPlayerList" class="enjoyPlayerList">
       <div class="titNameCon">
         <div class="titName">
@@ -8,6 +14,7 @@
       </div>
       <div class="enjoyPlayerListCon">
         <draggable
+          :forceFallback="true"
           :handle="'.drag-handle_enjoyPlayer'"
           v-model="elementInfo.enjoyList"
           itemKey="id"
@@ -78,6 +85,7 @@ import message from "@/utils/message"
 import type { PPTEnjoyElement } from "@/types/slides"
 import { useSlidesStore, useMainStore } from "@/store"
 import draggable from "vuedraggable"
+import queryParams from "@/queryParams"
 
 const slidesStore = useSlidesStore()
 const mainStore = useMainStore()
@@ -94,6 +102,14 @@ const props = withDefaults(
     isBase: false
   }
 )
+// 学生端 不是isBase预览下面的缩放比例
+const scaleStyle = queryParams.fromType === "CLASS" && !props.isBase && props.isScreening ? 1.5 : 1
+
+function handleListOutside() {
+  if (!props.isBase && isShowEnjoyPlayerList.value) {
+    hanleEnjoyList()
+  }
+}
 
 const isShowEnjoyPlayerList = ref(false)
 
@@ -290,7 +306,7 @@ const handleError = () => message.error("音频加载失败")
 const thumbMove = (e: MouseEvent | TouchEvent) => {
   if (!audioRef.value || !playBarWrap.value) return
   const clientX = "clientX" in e ? e.clientX : e.changedTouches[0].clientX
-  let percentage = (clientX - getBoundingClientRectViewLeft(playBarWrap.value)) / playBarWrap.value.clientWidth / props.scale
+  let percentage = (clientX - getBoundingClientRectViewLeft(playBarWrap.value)) / playBarWrap.value.clientWidth / props.scale / scaleStyle
   percentage = Math.max(percentage, 0)
   percentage = Math.min(percentage, 1)
   const time = percentage * duration.value
@@ -303,7 +319,7 @@ const thumbUp = (e: MouseEvent | TouchEvent) => {
   if (!audioRef.value || !playBarWrap.value) return
 
   const clientX = "clientX" in e ? e.clientX : e.changedTouches[0].clientX
-  let percentage = (clientX - getBoundingClientRectViewLeft(playBarWrap.value)) / playBarWrap.value.clientWidth / props.scale
+  let percentage = (clientX - getBoundingClientRectViewLeft(playBarWrap.value)) / playBarWrap.value.clientWidth / props.scale / scaleStyle
   percentage = Math.max(percentage, 0)
   percentage = Math.min(percentage, 1)
   const time = percentage * duration.value
@@ -331,7 +347,7 @@ const handleMousedownPlayBar = () => {
 
 <style lang="scss" scoped>
 .enjoyPlayer {
-  transform-origin: left top;
+  transform-origin: center bottom;
   .playerCon {
     background: linear-gradient(180deg, #ffffff 0%, #dfdfdf 100%);
     box-shadow:
@@ -474,7 +490,7 @@ const handleMousedownPlayBar = () => {
     bottom: 51px;
     box-shadow: 0px 3px 22px 0px rgba(0, 0, 0, 0.12);
     border-radius: 20px 20px 0px 0px;
-    background-color: rgba(255, 255, 255, 0.9);
+    background-color: rgb(255, 255, 255);
     padding: 20px 0 61px 10px;
     .titNameCon {
       padding-left: 10px;
@@ -513,7 +529,7 @@ const handleMousedownPlayBar = () => {
         justify-content: space-between;
         align-items: center;
         &.active {
-          background: rgba(85, 176, 255, 0.15);
+          background: #e6f3ff;
           border-radius: 10px;
           .itemLeft {
             color: #198cfe;

BIN
src/views/components/element/enjoyElement/resourcesList/imgs/jxImg.png


+ 12 - 7
src/views/components/element/enjoyElement/resourcesList/resourcesList.vue

@@ -30,7 +30,7 @@
             v-for="item in resourcesTypeOption"
             :key="item.value"
             @click="handleTypeChange(item.value)"
-            :class="['queryTip', queryData.type === item.value && 'tabActive']"
+            :class="['queryTip tabQueryTip', queryData.type === item.value && 'active']"
           >
             {{ item.text }}
           </div>
@@ -265,7 +265,6 @@ function clearQueryData() {
   queryData.total = 0
   queryData.sourceType = 5
   queryData.name = ""
-  queryData.type = "SONG"
   queryData.materialTagId = ""
   queryData.subject = {
     id: "",
@@ -478,9 +477,15 @@ const highlightedText = (text: string, query: string) => {
             background: #d2ecff;
             color: rgba(0, 0, 0, 1);
           }
-          &.tabActive {
-            background: #198cfe;
-            color: #ffffff;
+          &.tabQueryTip {
+            &:hover {
+              background: #e8e9ed;
+              color: #5d5d5e;
+            }
+            &.active {
+              background: #198cfe;
+              color: #ffffff;
+            }
           }
         }
       }
@@ -661,8 +666,8 @@ const highlightedText = (text: string, query: string) => {
                 }
                 .jxImg {
                   position: absolute;
-                  left: -1px;
-                  top: -1px;
+                  left: 0px;
+                  top: 0px;
                   width: 50px;
                   height: 27px;
                 }