修正排箫，口风琴和midi里面的乐器音色映射

src/pc/create/component/the-create/index.tsx

@@ -49,13 +49,13 @@ export default defineComponent({
 			},
 			{
 				label: "排箫",
-				key: "piccolo",
+				key: "pan_flute",
 				id: 1,
 				icon: getImage("icon_27_1.png"),
 			},
 			{
 				label: "口风琴",
-				key: "pan_flute",
+				key: "piccolo",
 				id: 5,
 				icon: getImage("icon_27_2.png"),
 			},

src/pc/home/index.tsx

@@ -285,7 +285,7 @@ export default defineComponent({
 			visualObj: null as any,
 			midiBuffer: null as unknown as ABCJS.MidiBuffer,
 			abcOptions: {
-				selectionColor: '#0f81ff',
+				selectionColor: "#0f81ff",
 				add_classes: true,
 				clickListener: clickListener,
 				responsive: "resize",
@@ -1867,36 +1867,6 @@ export default defineComponent({
 									</div>
 								</div>
 							</CollapseItem>
-							<CollapseItem title="谱号" name="clef">
-								<div class={styles.wrapBox}>
-									{ABC_DATA.clef.map((item) => (
-										<div
-											class={styles.topBtn}
-											onClick={() => handleChange({ type: "clef", value: item.value })}
-										>
-											<div class={[styles.btnImg]}>
-												<TheIcon iconClassName={item.icon} />
-											</div>
-											<div>{item.name}</div>
-										</div>
-									))}
-								</div>
-							</CollapseItem>
-							<CollapseItem title="调号" name="key">
-								<div class={styles.wrapBox}>
-									{ABC_DATA.key.map((item) => (
-										<div
-											class={styles.topBtn}
-											onClick={() => handleChange({ type: "key", value: item.value })}
-										>
-											<div class={[styles.btnImg]}>
-												<TheIcon iconClassName={item.icon} />
-											</div>
-											<div>{item.name}</div>
-										</div>
-									))}
-								</div>
-							</CollapseItem>
 
 							<CollapseItem title="拍号" name="meter">
 								<div class={styles.wrapBox}>
@@ -2007,6 +1977,37 @@ export default defineComponent({
 									))}
 								</div>
 							</CollapseItem>
+
+							<CollapseItem title="谱号" name="clef">
+								<div class={styles.wrapBox}>
+									{ABC_DATA.clef.map((item) => (
+										<div
+											class={styles.topBtn}
+											onClick={() => handleChange({ type: "clef", value: item.value })}
+										>
+											<div class={[styles.btnImg]}>
+												<TheIcon iconClassName={item.icon} />
+											</div>
+											<div>{item.name}</div>
+										</div>
+									))}
+								</div>
+							</CollapseItem>
+							<CollapseItem title="调号" name="key">
+								<div class={styles.wrapBox}>
+									{ABC_DATA.key.map((item) => (
+										<div
+											class={styles.topBtn}
+											onClick={() => handleChange({ type: "key", value: item.value })}
+										>
+											<div class={[styles.btnImg]}>
+												<TheIcon iconClassName={item.icon} />
+											</div>
+											<div>{item.name}</div>
+										</div>
+									))}
+								</div>
+							</CollapseItem>
 						</Collapse>
 					</div>
 					<div class={styles.box}>