移调，

src/pc/home/index.tsx

@@ -12,7 +12,7 @@ import { showConfirmDialog, showToast } from "vant";
 import Keys from "../component/keys";
 import { Collapse, CollapseItem } from "@varlet/ui";
 import { IAbc, IMeasure, INote, INoteActive } from "../types";
-import { ABC_DATA, createMeasure, createNote, moveNoteKey, renderMeasures } from "./runtime";
+import { ABC_DATA, createMeasure, createNote, getKeyStep, moveNoteKey, renderMeasures } from "./runtime";
 import TheIcon from "/src/components/The-icon";
 import { cloneDeep } from "lodash";
 import TheSpeed from "./component/the-speed";
@@ -303,7 +303,6 @@ export default defineComponent({
 				speed: "Q:1/4=60",
 				key: "K:C",
 				visualTranspose: 0,
-				transposeKey: "K:C",
 				subjectCode: "acoustic_grand_piano",
 				measures: initMusic(30),
 			} as IAbc,
@@ -596,7 +595,7 @@ export default defineComponent({
 							message.warning("小节内音符总时值过长");
 							return;
 						}
-						
+
 						handleCreateNote(
 							data.active.measureIndex,
 							data.active.noteIndex,
@@ -625,13 +624,14 @@ export default defineComponent({
 								isFirstChecked: false,
 							};
 							const beam = (abcElem.abselem as any).beam;
-							if (beam){
+							if (beam) {
 								const elems: AbcElem[] = beam.elems;
-								if (elems.length){
+								if (elems.length) {
 									const beatDuration = abcData.visualObj.getBeatLength();
 									const beamLength = elems.map((n) => n.duration).reduce((a, b) => a + b);
 									if (beamLength >= beatDuration) {
-										abcData.abc.measures[data.active.measureIndex].notes[data.active.noteIndex].segno = ' '
+										abcData.abc.measures[data.active.measureIndex].notes[data.active.noteIndex].segno =
+											" ";
 										await handleResetRender();
 									}
 								}
@@ -961,22 +961,24 @@ export default defineComponent({
 
 		/** 移调 */
 		const handleMoveKey = (item: (typeof ABC_DATA.key)[0]) => {
+			const step = getKeyStep(item.value, abcData.abc.key, data.moveKeyType);
+			console.log("🚀 ~ item:", abcData.abc.key, "=>", item.value, step);
 			// 将所有的音符移调
 			for (let i = 0; i < abcData.abc.measures.length; i++) {
 				const measure = abcData.abc.measures[i];
 				for (let j = 0; j < measure.notes.length; j++) {
 					const note = measure.notes[j];
 					if (note.content == "z") continue;
-					note.content = moveNoteKey(note.accidental + note.content, item.step, data.moveKeyType);
+					const content = moveNoteKey(note.content, step);
+					const _a = content.substring(0, 1);
+					if (_a === "^" || _a === "_") {
+						note.content = content.substring(1);
+					} else {
+						note.content = content;
+					}
+					console.log("🚀 ~ note.content:", note.content);
 				}
 			}
-			// if (data.moveKeyType === "down") {
-			// 	abcData.abc.visualTranspose = item.step < 0 ? item.step : item.step - 12;
-			// } else if (data.moveKeyType === "up") {
-			// 	abcData.abc.visualTranspose = item.step >= 0 ? item.step : item.step + 12;
-			// } else {
-			// 	abcData.abc.visualTranspose = item.step;
-			// }
 			// // console.log(abcData.abc.visualTranspose, item.step, item.value)
 			abcData.abc.key = item.value;
 			popup.moveKeyShow = false;
@@ -1048,7 +1050,6 @@ export default defineComponent({
 					abcData.abc.meter = abc.meter.value || "M:4/4";
 					abcData.abc.speed = abc.speed || "Q:1/4=60";
 					abcData.abc.visualTranspose = abc.visualTranspose || 0;
-					abcData.abc.transposeKey = abc.transposeKey || "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;
@@ -1506,7 +1507,7 @@ export default defineComponent({
 														<div
 															class={[
 																styles.btnItem,
-																abcData.abc.transposeKey === item.value && styles.btnItemActive,
+																abcData.abc.key === item.value && styles.btnItemActive,
 															]}
 															onClick={() => handleMoveKey(item)}
 														>

src/pc/home/noteData.ts

@@ -129,3 +129,230 @@ export const ABC_NOTE_DATA = [
 	["^a''''", "_b''''"],
 	"b''''",
 ];
+
+export const ABC_KEYS: { [_: string]: any } = {
+	"K:C": {
+		"K:C#": { up: 1, down: -11 },
+		"K:Db": { up: 1, down: -11 },
+		"K:D": { up: 2, down: -10 },
+		"K:Eb": { up: 3, down: -9 },
+		"K:E": { up: 4, down: -8 },
+		"K:F": { up: 5, down: -7 },
+		"K:F#": { up: 6, down: -6 },
+		"K:Gb": { up: 6, down: -6 },
+		"K:G": { up: 7, down: -5 },
+		"K:Ab": { up: 8, down: -4 },
+		"K:A": { up: 9, down: -3 },
+		"K:Bb": { up: 10, down: -2 },
+		"K:B": { up: 11, down: -1 },
+		"K:C": { up: 0, down: 0 },
+	},
+	"K:C#": {
+		"K:D": { up: 1, down: -11 },
+		"K:Eb": { up: 2, down: -10 },
+		"K:E": { up: 3, down: -9 },
+		"K:F": { up: 4, down: -8 },
+		"K:Gb": { up: 5, down: -7 },
+		"K:F#": { up: 5, down: -7 },
+		"K:G": { up: 6, down: -6 },
+		"K:Ab": { up: 7, down: -5 },
+		"K:A": { up: 8, down: -4 },
+		"K:Bb": { up: 9, down: -3 },
+		"K:B": { up: 10, down: -2 },
+		"K:C": { up: 11, down: -1 },
+		"K:C#": { up: 0, down: 0 },
+		"K:Db": { up: 0, down: 0 },
+	},
+	"K:Db": {
+		"K:D": { up: 1, down: -11 },
+		"K:Eb": { up: 2, down: -10 },
+		"K:E": { up: 3, down: -9 },
+		"K:F": { up: 4, down: -8 },
+		"K:Gb": { up: 5, down: -7 },
+		"K:F#": { up: 5, down: -7 },
+		"K:G": { up: 6, down: -6 },
+		"K:Ab": { up: 7, down: -5 },
+		"K:A": { up: 8, down: -4 },
+		"K:Bb": { up: 9, down: -3 },
+		"K:B": { up: 10, down: -2 },
+		"K:C": { up: 11, down: -1 },
+		"K:C#": { up: 0, down: 0 },
+		"K:Db": { up: 0, down: 0 },
+	},
+	"K:D": {
+		"K:Eb": { up: 1, down: -11 },
+		"K:E": { up: 2, down: -10 },
+		"K:F": { up: 3, down: -9 },
+		"K:Gb": { up: 4, down: -8 },
+		"K:F#": { up: 4, down: -8 },
+		"K:G": { up: 5, down: -7 },
+		"K:Ab": { up: 6, down: -6 },
+		"K:A": { up: 7, down: -5 },
+		"K:Bb": { up: 8, down: -4 },
+		"K:B": { up: 9, down: -3 },
+		"K:C": { up: 10, down: -2 },
+		"K:C#": { up: 11, down: -1 },
+		"K:Db": { up: 11, down: -1 },
+		"K:D": { up: 0, down: 0 },
+	},
+	"K:Eb": {
+		"K:E": { up: 1, down: -11 },
+		"K:F": { up: 2, down: -10 },
+		"K:Gb": { up: 3, down: -9 },
+		"K:F#": { up: 3, down: -9 },
+		"K:G": { up: 4, down: -8 },
+		"K:Ab": { up: 5, down: -7 },
+		"K:A": { up: 6, down: -6 },
+		"K:Bb": { up: 7, down: -5 },
+		"K:B": { up: 8, down: -4 },
+		"K:C": { up: 9, down: -3 },
+		"K:C#": { up: 10, down: -2 },
+		"K:Db": { up: 10, down: -2 },
+		"K:D": { up: 11, down: -1 },
+		"K:Eb": { up: 0, down: 0 },
+	},
+	"K:E": {
+		"K:F": { up: 1, down: -11 },
+		"K:Gb": { up: 2, down: -10 },
+		"K:F#": { up: 2, down: -10 },
+		"K:G": { up: 3, down: -9 },
+		"K:Ab": { up: 4, down: -8 },
+		"K:A": { up: 5, down: -7 },
+		"K:Bb": { up: 6, down: -6 },
+		"K:B": { up: 7, down: -5 },
+		"K:C": { up: 8, down: -4 },
+		"K:C#": { up: 9, down: -3 },
+		"K:Db": { up: 9, down: -3 },
+		"K:D": { up: 10, down: -2 },
+		"K:Eb": { up: 11, down: -1 },
+		"K:E": { up: 0, down: 0 },
+	},
+	"K:F": {
+		"K:Gb": { up: 1, down: -11 },
+		"K:F#": { up: 1, down: -11 },
+		"K:G": { up: 2, down: -10 },
+		"K:Ab": { up: 3, down: -9 },
+		"K:A": { up: 4, down: -8 },
+		"K:Bb": { up: 5, down: -7 },
+		"K:B": { up: 6, down: -6 },
+		"K:C": { up: 7, down: -5 },
+		"K:C#": { up: 8, down: -4 },
+		"K:Db": { up: 8, down: -4 },
+		"K:D": { up: 9, down: -3 },
+		"K:Eb": { up: 10, down: -2 },
+		"K:E": { up: 11, down: -1 },
+		"K:F": { up: 0, down: 0 },
+	},
+	"K:F#": {
+		"K:G": { up: 1, down: -11 },
+		"K:Ab": { up: 2, down: -10 },
+		"K:A": { up: 3, down: -9 },
+		"K:Bb": { up: 4, down: -8 },
+		"K:B": { up: 5, down: -7 },
+		"K:C": { up: 6, down: -6 },
+		"K:C#": { up: 7, down: -5 },
+		"K:Db": { up: 7, down: -5 },
+		"K:D": { up: 8, down: -4 },
+		"K:Eb": { up: 9, down: -3 },
+		"K:E": { up: 10, down: -2 },
+		"K:F": { up: 11, down: -1 },
+		"K:Gb": { up: 0, down: 0 },
+		"K:F#": { up: 0, down: 0 },
+	},
+	"K:Gb": {
+		"K:G": { up: 1, down: -11 },
+		"K:Ab": { up: 2, down: -10 },
+		"K:A": { up: 3, down: -9 },
+		"K:Bb": { up: 4, down: -8 },
+		"K:B": { up: 5, down: -7 },
+		"K:C": { up: 6, down: -6 },
+		"K:C#": { up: 7, down: -5 },
+		"K:Db": { up: 7, down: -5 },
+		"K:D": { up: 8, down: -4 },
+		"K:Eb": { up: 9, down: -3 },
+		"K:E": { up: 10, down: -2 },
+		"K:F": { up: 11, down: -1 },
+		"K:Gb": { up: 0, down: 0 },
+		"K:F#": { up: 0, down: 0 },
+	},
+	"K:G": {
+		"K:Ab": { up: 1, down: -11 },
+		"K:A": { up: 2, down: -10 },
+		"K:Bb": { up: 3, down: -9 },
+		"K:B": { up: 4, down: -8 },
+		"K:C": { up: 5, down: -7 },
+		"K:C#": { up: 6, down: -6 },
+		"K:Db": { up: 6, down: -6 },
+		"K:D": { up: 7, down: -5 },
+		"K:Eb": { up: 8, down: -4 },
+		"K:E": { up: 9, down: -3 },
+		"K:F": { up: 10, down: -2 },
+		"K:Gb": { up: 11, down: -1 },
+		"K:F#": { up: 11, down: -1 },
+		"K:G": { up: 0, down: 0 },
+	},
+	"K:Ab": {
+		"K:A": { up: 1, down: -11 },
+		"K:Bb": { up: 2, down: -10 },
+		"K:B": { up: 3, down: -9 },
+		"K:C": { up: 4, down: -8 },
+		"K:C#": { up: 5, down: -7 },
+		"K:Db": { up: 5, down: -7 },
+		"K:D": { up: 6, down: -6 },
+		"K:Eb": { up: 7, down: -5 },
+		"K:E": { up: 8, down: -4 },
+		"K:F": { up: 9, down: -3 },
+		"K:Gb": { up: 10, down: -2 },
+		"K:F#": { up: 10, down: -2 },
+		"K:G": { up: 11, down: -1 },
+		"K:Ab": { up: 0, down: 0 },
+	},
+	"K:A": {
+		"K:Bb": { up: 1, down: -11 },
+		"K:B": { up: 2, down: -10 },
+		"K:C": { up: 3, down: -9 },
+		"K:C#": { up: 4, down: -8 },
+		"K:Db": { up: 4, down: -8 },
+		"K:D": { up: 5, down: -7 },
+		"K:Eb": { up: 6, down: -6 },
+		"K:E": { up: 7, down: -5 },
+		"K:F": { up: 8, down: -4 },
+		"K:Gb": { up: 9, down: -3 },
+		"K:F#": { up: 9, down: -3 },
+		"K:G": { up: 10, down: -2 },
+		"K:Ab": { up: 11, down: -1 },
+		"K:A": { up: 0, down: 0 },
+	},
+	"K:Bb": {
+		"K:B": { up: 1, down: -11 },
+		"K:C": { up: 2, down: -10 },
+		"K:C#": { up: 3, down: -9 },
+		"K:Db": { up: 3, down: -9 },
+		"K:D": { up: 4, down: -8 },
+		"K:Eb": { up: 5, down: -7 },
+		"K:E": { up: 6, down: -6 },
+		"K:F": { up: 7, down: -5 },
+		"K:Gb": { up: 8, down: -4 },
+		"K:F#": { up: 8, down: -4 },
+		"K:G": { up: 9, down: -3 },
+		"K:Ab": { up: 10, down: -2 },
+		"K:A": { up: 11, down: -1 },
+		"K:Bb": { up: 0, down: 0 },
+	},
+	"K:B": {
+		"K:C": { up: 1, down: -11 },
+		"K:C#": { up: 2, down: -10 },
+		"K:Db": { up: 2, down: -10 },
+		"K:D": { up: 3, down: -9 },
+		"K:Eb": { up: 4, down: -8 },
+		"K:E": { up: 5, down: -7 },
+		"K:F": { up: 6, down: -6 },
+		"K:Gb": { up: 7, down: -5 },
+		"K:F#": { up: 7, down: -5 },
+		"K:G": { up: 8, down: -4 },
+		"K:Ab": { up: 9, down: -3 },
+		"K:A": { up: 10, down: -2 },
+		"K:Bb": { up: 11, down: -1 },
+		"K:B": { up: 0, down: 0 },
+	},
+};

src/pc/home/runtime.ts

@@ -1,7 +1,7 @@
 import { reactive } from "vue";
 import { IAbc, IMeasure, INote } from "../types";
 import { getImage } from "./images";
-import { ABC_NOTE_DATA } from "./noteData";
+import { ABC_KEYS, ABC_NOTE_DATA } from "./noteData";
 
 export const ABC_DATA = {
 	/** 音符 */
@@ -231,93 +231,27 @@ export const renderMeasures = (abc: IAbc) => {
 	return text;
 };
 
-const moveNote: any = [
-	"C",
-	["^C", "_D"],
-	"D",
-	["^D", "_E"],
-	"E",
-	"F",
-	["^F", "_G"],
-	"G",
-	["^G", "_A"],
-	"A",
-	["^A", "_B"],
-	"B",
-];
-const keyIndex: any = {
-	C: 0,
-	"^C": 1,
-	_D: 1,
-	D: 2,
-	"^D": 3,
-	_E: 3,
-	E: 4,
-	F: 5,
-	"^F": 6,
-	_G: 6,
-	G: 7,
-	"^G": 8,
-	_A: 8,
-	A: 9,
-	"^A": 10,
-	_B: 10,
-	B: 11,
+export const getKeyStep = (key: string, oldKey: string, keyType: "inset" | "up" | "down") => {
+	let step = 0;
+	const _key = ABC_KEYS[oldKey][key];
+	if (keyType === "down") {
+		step = _key.down;
+	} else if (keyType === "up") {
+		step = _key.up;
+	} else {
+		step = Math.abs(_key.up) > Math.abs(_key.down) ? _key.down : _key.up;
+	}
+	return step;
 };
-const newKey = [
-	"C",
-	"Db",
-	"D",
-	"Eb",
-	"E",
-	"F",
-	"F#",
-	"G",
-	"Ab",
-	"A",
-	"Bb",
-	"B",
-	"C",
-	"Db",
-	"D",
-	"Eb",
-	"E",
-	"F",
-	"F#",
-	"G",
-	"Ab",
-	"A",
-	"Bb",
-	"B",
-];
-export const moveNoteKey = (note: string, step: number, keyType: "inset" | "up" | "down") => {
-	for (let i = 0; i < ABC_NOTE_DATA.length; i++) {
-		const _note = ABC_NOTE_DATA[i];
-		if (_note === note || (Array.isArray(_note) && _note.includes(note))) {
-			let localTranspose = 0;
-			if (keyType === "down") {
-				localTranspose = step < 0 ? step : step - 12;
-			} else if (keyType === "up") {
-				localTranspose = step >= 0 ? step : step + 12;
-			} else {
-				localTranspose = step;
-			}
-
-			// const oldNote = note.replace(/('|,)/g, "");
-			// const oldIndex = ABC_NOTE_DATA.findIndex((item) => item === oldNote || (Array.isArray(item) && item.includes(oldNote)));
-			// let localTranspose = oldIndex - i;
-			// let _localTranspose = 0;	
-			// if (localTranspose > 0) _localTranspose = Math.ceil(localTranspose / 12);
-			// else _localTranspose = Math.floor(localTranspose / 12);
-			// console.log("🚀 ~ _localTranspose:", i , _localTranspose , step, (i + step) % 12)
-			let index = i + localTranspose;
-			const newNote = ABC_NOTE_DATA[index];
-			// console.log("🚀 ~ newNote:", newNote)
-			if (Array.isArray(newNote)) {
-				return newNote[0];
-			} else {
-				return newNote ? newNote : note;
-			}
+export const moveNoteKey = (note: string, step: number) => {
+	var x = ABC_NOTE_DATA.indexOf(note);
+	if (x >= 0) {
+		const _note = ABC_NOTE_DATA[x + step];
+		console.log(note, step, x, _note);
+		if (Array.isArray(_note)) {
+			return step > 0 ? _note[0] : _note[1];
+		} else {
+			return _note ? _note : note;
 		}
 	}
 	return note;

src/pc/types.ts

@@ -54,7 +54,7 @@ export interface IAbc {
 	/** 谱号 */
 	celf?: string;
 	/** 调号 */
-	key?: string;
+	key: string;
 	/** 拍号 */
 	meter?: string;
 	minUnit?: string;
@@ -65,7 +65,6 @@ export interface IAbc {
 	measures: IMeasure[];
 	/** 移调 */
 	visualTranspose?: number;
-	transposeKey?: string;
 	/** 声部 */
 	subjectCode?: string;
 }