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

src/hooks/useCreateElement.ts

@@ -354,7 +354,7 @@ export default () => {
         }
       ],
       id: nanoid(10),
-      width: 670,
+      width: 706,
       height: 102,
       rotate: 0,
       left: 629,

src/views/Editor/Canvas/Operate/index.vue

@@ -13,12 +13,14 @@
       v-if="isSelected"
       :is="currentOperateComponent"
       :elementInfo="elementInfo"
-      :handlerVisible="!elementInfo.lock && (isActiveGroupElement || !isMultiSelect)"
+      :handlerVisible="
+        !elementInfo.lock && (isActiveGroupElement || !isMultiSelect) && !(elementInfo.type === 'elf' && elementInfo.subtype === 'elf-enjoy')
+      "
       :rotateElement="rotateElement"
       :scaleElement="scaleElement"
       :dragLineElement="dragLineElement"
       :moveShapeKeypoint="moveShapeKeypoint"
-    ></component>
+    />
 
     <div class="animation-index" v-if="toolbarState === 'elAnimation' && elementIndexListInAnimation.length">
       <div class="index-item" v-for="index in elementIndexListInAnimation" :key="index">{{ index + 1 }}</div>

src/views/Editor/CanvasTool/index.vue

@@ -402,9 +402,19 @@ function handleResources(item: Record<string, any>) {
           title: item.name,
           src: item.content
         })
+        ElMessage({
+          showClose: true,
+          message: "已添加到音频列表",
+          type: "success"
+        })
       }
     } else {
       createEnjoyElement(item.id, item.name, item.content)
+      ElMessage({
+        showClose: true,
+        message: "已添加到音频列表",
+        type: "success"
+      })
     }
   } else if (item.type === "IMG") {
     createImageElement(item.content)

src/views/Screen/hooks/useExecPlay.ts

@@ -190,12 +190,16 @@ export default () => {
   const touchInfo = ref<{ x: number; y: number } | null>(null)
 
   const touchStartListener = (e: TouchEvent) => {
+    // 控制能不能翻页
+    if (!isPPTWheelPage.value) return
     touchInfo.value = {
       x: e.changedTouches[0].pageX,
       y: e.changedTouches[0].pageY
     }
   }
   const touchEndListener = (e: TouchEvent) => {
+    // 控制能不能翻页
+    if (!isPPTWheelPage.value) return
     if (!touchInfo.value) return
 
     const offsetX = Math.abs(touchInfo.value.x - e.changedTouches[0].pageX)

src/views/components/element/enjoyElement/enjoyElement.vue

@@ -73,6 +73,7 @@ const handleSelectElement = (e: MouseEvent | TouchEvent, canMove = true) => {
 .handler-border {
   position: absolute;
   cursor: move;
+  z-index: 1;
 
   &.t {
     width: 100%;

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:
@@ -339,8 +355,8 @@ const handleMousedownPlayBar = () => {
       inset 0px -6px 6px 0px rgba(0, 0, 0, 0.08);
     border-radius: 112px;
     outline: 2px solid rgba(0, 0, 0, 0.03);
-    padding: 16px 21px;
-    width: 670px;
+    padding: 16px 24px;
+    width: 706px;
     display: flex;
     align-items: center;
     position: relative;
@@ -349,7 +365,7 @@ const handleMousedownPlayBar = () => {
       position: absolute;
       width: 44px;
       height: 12px;
-      right: 47px;
+      right: 36px;
       top: 7px;
     }
     .operateBtn {
@@ -365,7 +381,7 @@ const handleMousedownPlayBar = () => {
       }
     }
     .operateMidCon {
-      margin: 0 21px;
+      margin: 0 30px;
       flex-grow: 1;
       .titleCon {
         display: flex;
@@ -426,9 +442,9 @@ const handleMousedownPlayBar = () => {
             .thumb {
               position: absolute;
               top: -12px;
-              right: -26px;
+              right: -20px;
               cursor: pointer;
-              width: 52px;
+              width: 38px;
               height: 38px;
               background: url("./imgs/td.png") no-repeat;
               background-size: 100% 100%;
@@ -446,7 +462,7 @@ const handleMousedownPlayBar = () => {
         background-size: 100% 100%;
         width: 56px;
         height: 56px;
-        margin-right: 14px;
+        margin-right: 20px;
         cursor: pointer;
       }
       .nextBtn {
@@ -454,7 +470,7 @@ const handleMousedownPlayBar = () => {
         background-size: 100% 100%;
         width: 56px;
         height: 56px;
-        margin-right: 14px;
+        margin-right: 20px;
         cursor: pointer;
       }
       .listBtn {
@@ -468,13 +484,13 @@ const handleMousedownPlayBar = () => {
   }
   .enjoyPlayerList {
     width: 100%;
-    height: 520px;
+    height: 524px;
     position: absolute;
     left: 0;
     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;

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 && 'active']"
+            :class="['queryTip tabQueryTip', queryData.type === item.value && 'active']"
           >
             {{ item.text }}
           </div>
@@ -132,7 +132,7 @@
             <Empty v-if="!musicList.length && !loading" />
           </div>
           <div class="pagination" v-show="musicList.length">
-            <el-pagination layout="prev, pager, next" :default-page-size="21" @current-change="handleCurrentChange" :total="queryData.total" />
+            <el-pagination layout="prev, pager, next" :default-page-size="20" @current-change="handleCurrentChange" :total="queryData.total" />
           </div>
         </div>
       </div>
@@ -206,9 +206,9 @@ const subjectList = ref<any[]>([])
 
 const queryData = reactive({
   page: 1,
-  rows: 21,
+  rows: 20,
   total: 0,
-  type: "SONG",
+  type: "IMG",
   materialTagId: "",
   sourceType: tabData[0].value,
   name: "",
@@ -261,11 +261,10 @@ function handleSubjectDefault() {
 }
 function clearQueryData() {
   queryData.page = 1
-  queryData.rows = 21
+  queryData.rows = 20
   queryData.total = 0
   queryData.sourceType = 5
   queryData.name = ""
-  queryData.type = "SONG"
   queryData.materialTagId = ""
   queryData.subject = {
     id: "",
@@ -304,7 +303,7 @@ function handleCurrentChange(e: number) {
 }
 function handleQuery() {
   queryData.page = 1
-  queryData.rows = 21
+  queryData.rows = 20
   handleGetQuery()
 }
 
@@ -478,6 +477,16 @@ const highlightedText = (text: string, query: string) => {
             background: #d2ecff;
             color: rgba(0, 0, 0, 1);
           }
+          &.tabQueryTip {
+            &:hover {
+              background: #e8e9ed;
+              color: #5d5d5e;
+            }
+            &.active {
+              background: #198cfe;
+              color: #ffffff;
+            }
+          }
         }
       }
       .query {
@@ -657,8 +666,8 @@ const highlightedText = (text: string, query: string) => {
                 }
                 .jxImg {
                   position: absolute;
-                  left: 0;
-                  top: 0;
+                  left: 0px;
+                  top: 0px;
                   width: 50px;
                   height: 27px;
                 }

vite.config.ts

@@ -28,7 +28,7 @@ export default defineConfig({
     proxy: {
       // 正则表达式写法
       "^/pptApi/.*": {
-        target: "https://dev.kt.colexiu.com",
+        target: "https://test.kt.colexiu.com",
         changeOrigin: true,
         rewrite: path => path.replace(/^\/pptApi/, "")
       }