样式

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

@@ -442,7 +442,7 @@
 .tizhi {
     position: absolute;
     top: 20%;
-    right: 20%;
+    left: 64%;
     width: 30px;
     height: 30px;
     text-align: center;

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

@@ -130,7 +130,7 @@ export default defineComponent({
 			}
 			setTimeout(() => {
 				data.loadingSoundFonts = false;
-			}, 300)
+			}, 300);
 			// console.log("🚀 ~ data.soundFonts:", data.soundFonts);
 		};
 		onBeforeMount(() => {
@@ -350,16 +350,15 @@ export default defineComponent({
 												typeof key === "string" ? key.replace("active-", "") : String(key);
 											return <img data-index={nk} src={fingerData.subject?.json?.[nk]} />;
 										})}
-									</div>
-
-									<div
-										id="finger-note-2"
-										class={[styles.tizhi, canTizhi && styles.canDisplay]}
-										onClick={() =>
-											(fingerData.relationshipIndex = fingerData.relationshipIndex === 0 ? 1 : 0)
-										}
-									>
-										替指
+										<div
+											id="finger-note-2"
+											class={[styles.tizhi, canTizhi && styles.canDisplay]}
+											onClick={() =>
+												(fingerData.relationshipIndex = fingerData.relationshipIndex === 0 ? 1 : 0)
+											}
+										>
+											替指
+										</div>
 									</div>
 								</div>
 							</div>
@@ -425,14 +424,14 @@ export default defineComponent({
 								))}
 							</div>
 						</div>
-						{data.loadingSoundFonts && (
+						{/* {data.loadingSoundFonts && (
 							<div class={styles.loading}>
 								<Vue3Lottie
 									style={{ width: "100px", height: "100px" }}
 									animationData={refesh_anim}
 								></Vue3Lottie>
 							</div>
-						)}
+						)} */}
 					</div>
 					{!!data.tones.length && (
 						<>