Ver código fonte

fix: #8609,#8612 bug修复

TIANYONG 1 ano atrás
pai
commit
0fe0276009

+ 4 - 1
src/page-instrument/header-top/index.module.less

@@ -110,7 +110,7 @@
         }
         .botton-tips {
             position: absolute;
-            left: -30PX;
+            left: -80PX;
             top: 22PX;
             background: rgba(33, 33, 33, 0.56);
             font-size: 14PX;
@@ -121,6 +121,9 @@
             z-index: 1;
             border-radius: 20PX;
             z-index: 9;
+            &.tipSpec {
+                left: -50PX;
+            }
         }          
     }     
 }

+ 24 - 15
src/page-instrument/header-top/index.tsx

@@ -34,6 +34,10 @@ export const headTopData = reactive({
   settingMode: false,
   /** 切换模式 */
   handleChangeModeType(value: "practise" | "follow" | "evaluating") {
+    // 跟练模式,光标只有音符模式,无节拍模式
+    if (value === 'follow' && metronomeData.cursorMode === 2) {
+      metronomeData.cursorMode = 1
+    }
     if (value === "evaluating") {
       // 如果是pc端, 评测模式暂不可用
       if (state.platform === IPlatform.PC) {
@@ -313,21 +317,6 @@ export default defineComponent({
               e.stopPropagation();
             }}
           >
-
-            <div class={[styles.btn]} onClick={() => {
-              // 切换光标模式
-              const mode = metronomeData.cursorMode === 3 ? 1 : metronomeData.cursorMode + 1
-              metronomeData.cursorMode = mode
-            }}>
-              <img class={styles.iconBtn} src={headImg(metronomeData.cursorMode === 1 ? 'cursor-icon-1.svg' : metronomeData.cursorMode === 2 ? 'cursor-icon-2.svg' : metronomeData.cursorMode === 3 ? 'cursor-icon-3.svg' : '')} />
-              <span class={styles.iconContent}>
-                {metronomeData.cursorMode === 1 ? '音符指针' : metronomeData.cursorMode === 2 ? '节拍指针' : metronomeData.cursorMode === 3 ? '关闭指针' : ''}
-                {metronomeData.cursorTips && <>
-                    <i class={styles.arrowIcon}></i>
-                    <div class={styles['botton-tips']}>{metronomeData.cursorTips}</div>
-                </>}
-              </span>
-            </div>
                         
             <div
               id={state.platform === IPlatform.PC ? "teacherTop-0" : "studnetT-0"}
@@ -342,6 +331,26 @@ export default defineComponent({
               <span>模式</span>
             </div>
 
+            <div class={[styles.btn]} onClick={() => {
+              // 切换光标模式
+              let mode = metronomeData.cursorMode
+              if (['follow'].includes(state.modeType)) {
+                mode = metronomeData.cursorMode === 1 ? 3 : 1
+              } else {
+                mode = metronomeData.cursorMode === 3 ? 1 : metronomeData.cursorMode + 1
+              }              
+              metronomeData.cursorMode = mode
+            }}>
+              <img class={styles.iconBtn} src={headImg(metronomeData.cursorMode === 1 ? 'cursor-icon-1.svg' : metronomeData.cursorMode === 2 ? 'cursor-icon-2.svg' : metronomeData.cursorMode === 3 ? 'cursor-icon-3.svg' : '')} />
+              <span class={styles.iconContent}>
+                {metronomeData.cursorMode === 1 ? '音符指针' : metronomeData.cursorMode === 2 ? '节拍指针' : metronomeData.cursorMode === 3 ? '关闭指针' : ''}
+                {metronomeData.cursorTips && <>
+                    <i class={styles.arrowIcon}></i>
+                    <div class={[styles['botton-tips'],metronomeData.cursorMode === 3 ? styles.tipSpec : '']}>{metronomeData.cursorTips}</div>
+                </>}
+              </span>
+            </div>
+
             <div
               id={state.platform === IPlatform.PC ? "teacherTop-1" : "studnetT-1"}
               style={{ display: originBtn.value.display ? "" : "none" }}