Merge branch 'feature-tianyong' into gym-test

src/helpers/metronome.ts

@@ -453,7 +453,7 @@ class Metronome {
 						left = measure.stepList[currentIdx] + "px";
 					} else {
 						const preLeft = measure.stepList[j - 1];
-						left = !preLeft || preLeft.toString().indexOf("%") > -1 ? `${widthStep}%` : `${preLeft}px + ${widthStep}%`;
+						left = !preLeft || preLeft.toString().indexOf("%") > -1 ? `${widthStep*(j+1)}%` : `${preLeft}px + ${widthStep}%`;
 						measure.stepList[j] = left;
 					}					
 					metroMeasure[i].push({

src/state.ts

@@ -704,7 +704,8 @@ export const initSetPlayRate = () => {
     state.isAutoRePlay = false
     return
   }
-  let item: any = (state.sectionStatus && state.section.length === 2) ? state.sectionFirst || state.section[0] : state.times[state.activeNoteIndex];
+  // let item: any = (state.sectionStatus && state.section.length === 2) ? state.sectionFirst || state.section[0] : state.times[state.activeNoteIndex];
+  let item: any = state.times[state.activeNoteIndex];
   console.log('播放状态',state.playState)
   if (item && item.measureSpeed) {
     const ratio = state.speed / item.measureSpeed

src/view/selection/index.module.less

@@ -353,33 +353,85 @@
 
 .middleZoom {
     .line {
-        height: 70PX;
+        height: 75PX;
     }
     :global {
         .node-dot::before{
-            height: 70PX;
+            height: 75PX;
         }
     }
 }
 
 .bigZoom {
     .line {
-        height: 80PX;
+        height: 90PX;
     }
     :global {
         .node-dot::before{
-            height: 80PX;
+            height: 90PX;
         }
     }
 }
 
 .largeZoom {
     .line {
-        height: 90PX;
+        height: 105PX;
     }
     :global {
         .node-dot::before{
-            height: 90PX;
+            height: 105PX;
+        }
+    }
+}
+
+.largeZoom2 {
+    .line {
+        height: 120PX;
+        width: 3PX;
+    }
+    :global {
+        .node-dot::before{
+            height: 120PX;
+            width: 3PX;
+        }
+    }
+}
+
+.largeZoom3 {
+    .line {
+        height: 140PX;
+        width: 3PX;
+    }
+    :global {
+        .node-dot::before{
+            height: 140PX;
+            width: 3PX;
+        }
+    }
+}
+
+.smallZoom {
+    .line {
+        height: 45PX;
+        width: 1PX;
+    }
+    :global {
+        .node-dot::before{
+            height: 45PX;
+            width: 1PX;
+        }
+    }
+}
+
+.litteZoom {
+    .line {
+        height: 35PX;
+        width: 1PX;
+    }
+    :global {
+        .node-dot::before{
+            height: 35PX;
+            width: 1PX;
         }
     }
 }

src/view/selection/index.tsx

@@ -275,7 +275,8 @@ export default defineComponent({
 					class={[
 						styles.selectionContainer,
 						isPad && styles.isPad,
-						state.zoom == 1.25 ? styles.middleZoom : state.zoom == 1.5 ? styles.bigZoom : state.zoom == 1.75 ? styles.largeZoom : ''
+						state.zoom == 1.25 ? styles.middleZoom : state.zoom == 1.5 ? styles.bigZoom : state.zoom == 1.75 ? styles.largeZoom : state.zoom == 2 ? styles.largeZoom2 : state.zoom == 2.25 ? styles.largeZoom3 : 
+						state.zoom == 0.65 ? styles.smallZoom : state.zoom == 0.5 ? styles.litteZoom : ''
 					]}
 					onClick={(e: Event) => e.stopPropagation()}
 				>