style: UI样式走查修改

src/page-instrument/follow-model/index.module.less

@@ -84,6 +84,9 @@
           margin-left: 20px;
       }
   }
+  &.operatingLeft {
+    left: 30px !important;
+  }
 }
 .beginMask{
   position: fixed;

src/page-instrument/follow-model/index.tsx

@@ -41,7 +41,7 @@ export default defineComponent({
         {
           followData.isBeginMask && <div class={styles.beginMask}></div>
         }        
-        <div class={styles.operatingBtn}>
+        <div class={[styles.operatingBtn, state.playBtnDirection === "left" ? styles.operatingLeft : ""]}>
           {!followData.start && (
             <img
               class={[styles.iconBtn, "follow-1"]}

src/page-instrument/header-top/index.module.less

@@ -313,7 +313,7 @@
     }
 
     &.pauseRightButton {
-        right: 88px !important;
+        right: 108px !important;
         left: auto !important;
         bottom: 12px !important;
     }

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

@@ -618,7 +618,7 @@ export default defineComponent({
     return () => (
       <>
         <div
-          class={[styles.headerTop, state.platform === IPlatform.PC && state.musicScoreBtnDirection === "left" ? styles.headerTopRight : ""]}
+          class={[styles.headerTop]}
           onClick={(e: Event) => {
             e.stopPropagation();
             if (state.platform === IPlatform.PC) {
@@ -680,7 +680,7 @@ export default defineComponent({
           {/* 模式提醒 */}
           {
             state.modeType === "practise" &&
-              <div class={[styles.modeWarn, "practiseModeWarn", state.platform === IPlatform.PC && state.musicScoreBtnDirection === "left" ? styles.modeWarnRight : ""]}>
+              <div class={[styles.modeWarn, "practiseModeWarn"]}>
                 <img src={state.playType === "play" ? headImg("perform1.png") : headImg("sing1.png")} />
                 <div>{state.playType === "play" ? "演奏场景" : "演唱场景"}</div>
               </div>
@@ -871,7 +871,7 @@ export default defineComponent({
             "driver-1",
             styles.playBtn,
             playBtn.value.disabled && styles.disabled,
-            state.platform === IPlatform.PC && state.musicScoreBtnDirection === "left" ? styles.playLeftButton : state.platform === IPlatform.PC && state.musicScoreBtnDirection === "right" ? styles.playRightButton : "",
+            // state.platform === IPlatform.PC && state.musicScoreBtnDirection === "left" ? styles.playLeftButton : state.platform === IPlatform.PC && state.musicScoreBtnDirection === "right" ? styles.playRightButton : "",
           ]}
           onClick={() => togglePlay(state.playState === "play" ? "paused" : "play")}
         >
@@ -886,7 +886,7 @@ export default defineComponent({
         <div
           id="tips-step-9"
           style={{ display: resetBtn.value.display ? "" : "none" }}
-          class={[styles.resetBtn, resetBtn.value.disabled && styles.disabled, state.platform === IPlatform.PC && state.musicScoreBtnDirection === "left" ? styles.pauseLeftButton : state.platform === IPlatform.PC && state.musicScoreBtnDirection === "right" ? styles.pauseRightButton : ""]}
+          class={[styles.resetBtn, resetBtn.value.disabled && styles.disabled]}
           onClick={() => handleResetPlay()}
         >
           <img class={styles.iconBtn} src={headImg("icon_reset.png")} />

src/page-instrument/view-detail/index.tsx

@@ -313,35 +313,47 @@ export default defineComponent({
         } else {
           console.log('指法',state.playBtnDirection,state.platform)
           // 老师端，竖向指法，需要根据功能按钮方向进行设置
-          if (state.platform === IPlatform.PC) {
-            return {
-              container: {
-                paddingRight: state.playBtnDirection === "right" ? "initial" : state.fingeringInfo.width,
-                paddingLeft: state.playBtnDirection === "right" ? state.fingeringInfo.width : "initial",
-              },
-              fingerBox: {
-                position: "absolute",
-                width: state.fingeringInfo.width,
-                height: "80%",
-                right: state.playBtnDirection === "right" ? "initial" : 0,
-                left: state.playBtnDirection === "right" ? 0 : "initial",
-                top: 0,
-              },
-            };
-          } else {
-            return {
-              container: {
-                paddingLeft: state.fingeringInfo.width,
-              },
-              fingerBox: {
-                position: "absolute",
-                width: state.fingeringInfo.width,
-                height: state.fingeringInfo.name === "hulusi-flute" ? "86%" : "80%",
-                left: 0,
-                top: state.fingeringInfo.name === "ocarina" ? "50px" : 0,
-              },
-            };
-          }
+          // if (state.platform === IPlatform.PC) {
+          //   return {
+          //     container: {
+          //       paddingRight: state.playBtnDirection === "right" ? "initial" : state.fingeringInfo.width,
+          //       paddingLeft: state.playBtnDirection === "right" ? state.fingeringInfo.width : "initial",
+          //     },
+          //     fingerBox: {
+          //       position: "absolute",
+          //       width: state.fingeringInfo.width,
+          //       height: state.fingeringInfo.name === "hulusi-flute" ? "86%" : "80%",
+          //       right: state.playBtnDirection === "right" ? "initial" : 0,
+          //       left: state.playBtnDirection === "right" ? 0 : "initial",
+          //       top: state.fingeringInfo.name === "ocarina" ? "60px" : 0,
+          //     },
+          //   };
+          // } else {
+          //   return {
+          //     container: {
+          //       paddingLeft: state.fingeringInfo.width,
+          //     },
+          //     fingerBox: {
+          //       position: "absolute",
+          //       width: state.fingeringInfo.width,
+          //       height: state.fingeringInfo.name === "hulusi-flute" ? "86%" : "80%",
+          //       left: 0,
+          //       top: state.fingeringInfo.name === "ocarina" ? "60px" : 0,
+          //     },
+          //   };
+          // }
+          return {
+            container: {
+              paddingLeft: state.fingeringInfo.width,
+            },
+            fingerBox: {
+              position: "absolute",
+              width: state.fingeringInfo.width,
+              height: state.fingeringInfo.name === "hulusi-flute" ? "86%" : "80%",
+              left: 0,
+              top: state.fingeringInfo.name === "ocarina" ? "60px" : 0,
+            },
+          };
         }
       }
       return {

src/view/plugins/useDrag/index.module.less

@@ -7,20 +7,20 @@
   //overflow: hidden;
   position: absolute;
   bottom: 0;
-  .box {
-    position: relative;
-    bottom: 10px;
-    width: 20px;
-    height: 20px;
-    background: url('./img/left.png') no-repeat;
-    background-size: 100% 100%;
-    border-bottom-left-radius: 16Px;
-    &.right {
-      background: url('./img/right.png') no-repeat;
-      background-size: 100% 100%;
-      border-bottom-right-radius: 16Px;
-    }
-  }
+  // .box {
+  //   position: relative;
+  //   bottom: 10px;
+  //   width: 20px;
+  //   height: 20px;
+  //   background: url('./img/left.png') no-repeat;
+  //   background-size: 100% 100%;
+  //   border-bottom-left-radius: 16Px;
+  //   &.right {
+  //     background: url('./img/right.png') no-repeat;
+  //     background-size: 100% 100%;
+  //     border-bottom-right-radius: 16Px;
+  //   }
+  // }
 }
 .guide {
   position: absolute;