移调显示问题

src/pc/home/index.tsx

@@ -276,6 +276,7 @@ export default defineComponent({
 				speed: "Q:1/4=60",
 				key: "K:C",
 				visualTranspose: 0,
+				visualKey: 'K:C',
 				subjectCode: "acoustic_grand_piano",
 				measures: initMusic(30),
 			} as IAbc,
@@ -1233,6 +1234,7 @@ export default defineComponent({
 			// 			: item.step + 12
 			// 		: item.step;
 			abcData.abc.visualTranspose = item.step;
+			abcData.abc.visualKey = item.value;
 			popup.moveKeyShow = false;
 			if (data.playState) {
 				abcData.synthControl.disable(true);
@@ -1297,6 +1299,7 @@ export default defineComponent({
 					abcData.abc.meter = abc.meter.value || abc.meter || "M:4/4";
 					abcData.abc.speed = abc.speed || "Q:1/4=60";
 					abcData.abc.visualTranspose = abc.visualTranspose || 0;
+					abcData.abc.visualKey = abc.visualKey || "K:C";
 					abcData.abc.subjectCode = abc.subjectCode || "acoustic_grand_piano";
 					const _instruments = ABCJS.synth.instrumentIndexToName.indexOf(abcData.abc.subjectCode as any);
 					abcData.synthOptions.program = _instruments > -1 ? _instruments : 0;
@@ -1910,7 +1913,7 @@ export default defineComponent({
 															<div
 																class={[
 																	styles.btnItem,
-																	abcData.abc.key === item.value && styles.btnItemActive,
+																	abcData.abc.visualKey === item.value && styles.btnItemActive,
 																]}
 																onClick={() => handleMoveKey(item)}
 															>

src/pc/types.ts

@@ -67,6 +67,7 @@ export interface IAbc {
 	measures: IMeasure[];
 	/** 移调 */
 	visualTranspose?: number;
+	visualKey?: string;
 	/** 声部 */
 	subjectCode?: string;
 }