fix: bug修改

src/page-instrument/header-top/settting/index.tsx

@@ -3,7 +3,7 @@ import styles from "./index.module.less"
 import { headImg } from "../image";
 import { headTopData } from "../index"
 import { Switch, showToast, Field, Popup, Slider } from "vant";
-import state, { refreshMusicSvg, IPlatform, checkMoveNoSave, handleGuide } from "/src/state"
+import state, { refreshMusicSvg, IPlatform, checkMoveNoSave, handleGuide, resetCursorPosition } from "/src/state"
 import { api_closeCamera, api_openCamera, api_savePicture } from "/src/helpers/communication";
 import { smoothAnimationState} from "/src/page-instrument/view-detail/smoothAnimation"
 import Recommendation from "../../custom-plugins/helper-model/recommendation";
@@ -103,8 +103,12 @@ export default defineComponent({
                                     {
                                         metronomeList.value.map(item=>{
                                             return <div class={ metronomeData.cursorMode===item.value && styles.active } onClick={ ()=>{
+                                                if (metronomeData.cursorMode === item.value) {
+                                                    return
+                                                }
                                                  // 切换光标模式
                                                 metronomeData.cursorMode = item.value
+                                                resetCursorPosition()
                                             }}>{item.name}</div>
                                         })
                                     }

src/page-instrument/header-top/speed/index.tsx

@@ -38,7 +38,7 @@ export default defineComponent({
 				state.speed = Math.floor(speed.value);
 				// handleSetSpeed(speed.value);
 				if (state.playState === 'paused') {
-					const currentItem: any = (state.sectionStatus && state.section.length === 2) ? state.sectionFirst || state.section[0] : state.times[state.activeNoteIndex];
+					const currentItem: any = (state.sectionStatus && state.section.length === 2) ? state.section[0] : state.times[state.activeNoteIndex];
 					state.basePlayRate = currentItem?.measureSpeed ? state.speed / currentItem.measureSpeed : state.speed / state.originSpeed;
 				}
 			}

src/page-instrument/view-detail/index.module.less

@@ -116,7 +116,7 @@
         // opacity: var(--corsor-opacity);
         //transform: translateX(10PX);
         z-index: 1 !important;
-        // opacity: 0; // 新版小酷AI不显示光标指针
+        opacity: 0 !important; // 新版小酷AI不显示光标指针
     }
 
     .staff {

src/state.ts

@@ -668,7 +668,7 @@ export const onEnded = () => {
 const dynamicShowPlaySpeed = (index: number, isPlaying?: boolean) => {
   if (!headerColumnHide.value) {
     const item: any = state.times[index];
-    if (state.section.length === 2 && item.MeasureNumberXML === state.sectionFirst.MeasureNumberXML) {
+    if (state.sectionFirst && state.section.length === 2 && item.MeasureNumberXML === state.sectionFirst.MeasureNumberXML) {
       state.speed = Math.floor(state.section[0].measureSpeed * state.basePlayRate) || state.speed
       return;
     }
@@ -1058,6 +1058,16 @@ export const gotoNext = (note: any, skipNote?: boolean) => {
   state.activeNoteIndex = num;
   state.activeMeasureIndex = note.MeasureNumberXML;
   osmd.cursor.activeMeasureNum = note.MeasureNumberXML;
+  // 赋值音符id
+  osmd.cursor.noteGraphicalId = state.times[state.activeNoteIndex].id;
+  // 设置光标位置
+  nextTick(() => {
+      if (osmd.cursor.noteGraphicalId) {
+      const { x, y } = document.getElementById(`vf-${osmd.cursor.noteGraphicalId}`)?.getBoundingClientRect() || { x: 0, y: 0}
+      osmd.cursor.cursorElement.style.left = x + "px";
+      // cursorElement.style.top = y + "px";
+    }
+  })
   dynamicShowPlaySpeed(state.activeNoteIndex);
   if (prev && num - prev === 1) {
     // console.log('跳转音符',11111,osmd.cursor)
@@ -2263,7 +2273,7 @@ watch(
   }
 )
 
-		// 完成拖动弹窗引导页
+// 完成拖动弹窗引导页
 export const handleGuide = async () => {
     const guideInfoStore = localStorage.getItem('guideInfo') ? JSON.parse(localStorage.getItem('guideInfo')) : {};
     guideInfoStore.teacherDrag = true;
@@ -2273,4 +2283,26 @@ export const handleGuide = async () => {
     } catch (e) {
       console.log(e);
     }
-};
+};
+
+export const resetCursorPosition = () => {
+  if (metronomeData.cursorMode === 1) {
+    const currentActive = document.querySelector(`.dotActive`);
+    currentActive?.classList.remove('dotActive');
+    const currentDot = document.querySelector(`.noteIndex_${state.activeNoteIndex}`)
+    if (currentDot) {
+      currentDot.classList.add('dotActive')
+    }
+  } else {
+    const currentActive = document.querySelector(`.dotActive`);
+    currentActive?.classList.remove('dotActive');
+  }
+}
+
+
+watch(
+  () => state.activeNoteIndex,
+  () => {
+    resetCursorPosition();
+  }
+);

src/view/music-score/index.tsx

@@ -2,7 +2,7 @@ import { computed, defineComponent, onMounted, reactive, ref, onUnmounted } from
 import { formatXML, onlyVisible } from "../../helpers/formateMusic";
 // // @ts-ignore
 import { OpenSheetMusicDisplay } from "/osmd-extended/src";
-import state, { EnumMusicRenderType, IPlatform } from "/src/state";
+import state, { EnumMusicRenderType, IPlatform, resetCursorPosition } from "/src/state";
 import Selection from "../selection";
 import styles from "./index.module.less";
 import queryString from "query-string";
@@ -229,6 +229,7 @@ export default defineComponent({
 				await init();
 				musicData.showSelection = true;
 				state.isLoading = false
+				resetCursorPosition()
 			}, 60);
 		}
 		expose({

src/view/selection/index.module.less

@@ -54,8 +54,8 @@
     position: absolute;
     height: 120%;
     background-color: rgba(45, 199, 170, 1);
-    min-height: 58PX;
-    height: 58PX;
+    min-height: 40px;
+    height: 40px;
     top: 50%;
     // width: 14PX;
     width: 2PX !important;
@@ -298,6 +298,22 @@
         }
 
     }
+
+    .dotActive {
+        // background: #01C1B5;
+        :global {
+            .node-dot::before{
+                content: "";
+                position: absolute;
+                left: 50%;
+                top: 50%;
+                width: 2PX;
+                height: 40px;
+                transform: translate(-50%, -50%);
+                background: #2DC7AA;
+            }
+        }
+    }
 }
 
 .linePC {
@@ -317,6 +333,7 @@
     // background: #07c160;
 }
 
+
 // 阴影
 .staveBgContainer{
     position: absolute;
@@ -332,4 +349,37 @@
         opacity: 0.7;
         margin-top: -4px;
     }
+}
+
+.middleZoom {
+    .line {
+        height: 50px;
+    }
+    :global {
+        .node-dot::before{
+            height: 50px;
+        }
+    }
+}
+
+.bigZoom {
+    .line {
+        height: 60px;
+    }
+    :global {
+        .node-dot::before{
+            height: 60px;
+        }
+    }
+}
+
+.largeZoom {
+    .line {
+        height: 70px;
+    }
+    :global {
+        .node-dot::before{
+            height: 70px;
+        }
+    }
 }

src/view/selection/index.tsx

@@ -240,6 +240,7 @@ export default defineComponent({
 			}
 			return []
 		})
+
 		onMounted(() => {
 			selectData.notes = [];
 			selectData.staves = [];
@@ -266,7 +267,8 @@ export default defineComponent({
 					id="selectionBox"
 					class={[
 						styles.selectionContainer,
-						isPad && styles.isPad
+						isPad && styles.isPad,
+						state.zoom == 1.25 ? styles.middleZoom : state.zoom == 1.5 ? styles.bigZoom : state.zoom == 1.75 ? styles.largeZoom : ''
 					]}
 					onClick={(e: Event) => e.stopPropagation()}
 				>