|
@@ -140,6 +140,7 @@ export const initMusic = (total: number): IMeasure[] => {
|
|
|
dot: "",
|
|
|
slus: "",
|
|
|
tieline: "",
|
|
|
+ segno: "",
|
|
|
},
|
|
|
],
|
|
|
};
|
|
@@ -515,6 +516,23 @@ export default defineComponent({
|
|
|
return abcElem;
|
|
|
};
|
|
|
|
|
|
+ const useIndexGetNote = (indexStr: string) => {
|
|
|
+ const index = data.music.indexOf(indexStr);
|
|
|
+ const note = abcData.visualObj.getElementFromChar(index);
|
|
|
+ return note;
|
|
|
+ };
|
|
|
+
|
|
|
+ const getMeasureNotes = (measureIndex: number) => {
|
|
|
+ const measure = abcData.abc.measures[measureIndex];
|
|
|
+ const notes = [];
|
|
|
+ for (let k = 0; k < measure.notes.length; k++) {
|
|
|
+ const indexStr = `${measureIndex}.${k}`;
|
|
|
+ const note = useIndexGetNote(indexStr);
|
|
|
+ notes.push(note);
|
|
|
+ }
|
|
|
+ return notes;
|
|
|
+ };
|
|
|
+
|
|
|
/**
|
|
|
*
|
|
|
* @param key
|
|
@@ -547,15 +565,24 @@ export default defineComponent({
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
+ // 分割
|
|
|
+ if (type === "segno") {
|
|
|
+ if (!data.active) {
|
|
|
+ showToast("请先选择音符");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (!activeNote) return;
|
|
|
+ activeNote.segno = activeNote.segno ? "" : value;
|
|
|
+ await handleResetRender();
|
|
|
+ rangeHighlight(data.active.startChar);
|
|
|
+ }
|
|
|
+
|
|
|
// 修改音符,或者添加音符
|
|
|
if (type === "note") {
|
|
|
- if (data.active) {
|
|
|
- if (data.active.el_type !== "note") return;
|
|
|
+ if (data.active && data.active.el_type == "note") {
|
|
|
const activeNote =
|
|
|
abcData.abc.measures[data.active.measureIndex]?.notes[data.active.noteIndex] || null;
|
|
|
- // console.log(activeNote, data.active.isFirstChecked);
|
|
|
const _values = value.split("-");
|
|
|
- // console.log("🚀 ~ _value:", _values);
|
|
|
if (data.active.isFirstChecked) {
|
|
|
activeNote.content = _values[0];
|
|
|
activeNote.noteType = data.noteType;
|
|
@@ -563,6 +590,12 @@ export default defineComponent({
|
|
|
activeNote.accidental = _values[1] || "";
|
|
|
}
|
|
|
} else {
|
|
|
+ const notes = getMeasureNotes(data.active.measureIndex);
|
|
|
+ const duration = notes.map((n) => n.duration).reduce((a, b) => a + b);
|
|
|
+ if (duration >= 1) {
|
|
|
+ message.warning("小节内音符总时值过长");
|
|
|
+ return;
|
|
|
+ }
|
|
|
handleCreateNote(
|
|
|
data.active.measureIndex,
|
|
|
data.active.noteIndex,
|
|
@@ -595,18 +628,6 @@ export default defineComponent({
|
|
|
}
|
|
|
if (!_abcElem?.midiPitches) return;
|
|
|
ABCJS.synth.playEvent(_abcElem.midiPitches, _abcElem.midiGraceNotePitches, 1000);
|
|
|
- } else {
|
|
|
- const measureIndex = abcData.abc.measures.length - 1;
|
|
|
- const noteIndex = abcData.abc.measures[measureIndex].notes.length - 1;
|
|
|
- handleCreateNote(
|
|
|
- measureIndex,
|
|
|
- noteIndex,
|
|
|
- createNote({
|
|
|
- content: value,
|
|
|
- noteType: data.noteType,
|
|
|
- })
|
|
|
- );
|
|
|
- handleResetRender();
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -616,8 +637,6 @@ export default defineComponent({
|
|
|
showToast("请先选择音符");
|
|
|
return;
|
|
|
}
|
|
|
- const activeNote =
|
|
|
- abcData.abc.measures[data.active.measureIndex]?.notes[data.active.noteIndex] || null;
|
|
|
if (activeNote.content === "z") {
|
|
|
showToast("休止符无法添加临时升降记号");
|
|
|
return;
|
|
@@ -639,8 +658,6 @@ export default defineComponent({
|
|
|
// 谱号
|
|
|
if (type === "clef") {
|
|
|
if (data.active) {
|
|
|
- const activeNote =
|
|
|
- abcData.abc.measures[data.active.measureIndex]?.notes[data.active.noteIndex] || null;
|
|
|
if (!activeNote) return;
|
|
|
activeNote.clef = `[${value}]`;
|
|
|
await handleResetRender();
|
|
@@ -653,8 +670,6 @@ export default defineComponent({
|
|
|
// 调号
|
|
|
if (type === "key") {
|
|
|
if (data.active) {
|
|
|
- const activeNote =
|
|
|
- abcData.abc.measures[data.active.measureIndex]?.notes[data.active.noteIndex] || null;
|
|
|
if (!activeNote) return;
|
|
|
activeNote.key = `[${value}]`;
|
|
|
await handleResetRender();
|
|
@@ -667,8 +682,6 @@ export default defineComponent({
|
|
|
// 拍号
|
|
|
if (type === "meter") {
|
|
|
if (data.active) {
|
|
|
- const activeNote =
|
|
|
- abcData.abc.measures[data.active.measureIndex]?.notes[data.active.noteIndex] || null;
|
|
|
if (!activeNote) return;
|
|
|
activeNote.meter = `[${value}]`;
|
|
|
await handleResetRender();
|
|
@@ -684,8 +697,6 @@ export default defineComponent({
|
|
|
showToast("请先选择音符");
|
|
|
return;
|
|
|
}
|
|
|
- const activeNote =
|
|
|
- abcData.abc.measures[data.active.measureIndex]?.notes[data.active.noteIndex] || null;
|
|
|
if (!activeNote) return;
|
|
|
if (activeNote.play.includes(value)) {
|
|
|
activeNote.play = activeNote.play.filter((item) => item !== value);
|
|
@@ -701,8 +712,6 @@ export default defineComponent({
|
|
|
message.info("请先选择音符");
|
|
|
return;
|
|
|
}
|
|
|
- const activeNote =
|
|
|
- abcData.abc.measures[data.active?.measureIndex]?.notes[data.active?.noteIndex] || null;
|
|
|
if (!activeNote) return;
|
|
|
if (Array.isArray(value)) {
|
|
|
if (activeNote?.dynamics) {
|
|
@@ -741,8 +750,6 @@ export default defineComponent({
|
|
|
message.info("请先选择音符");
|
|
|
return;
|
|
|
}
|
|
|
- const activeNote =
|
|
|
- abcData.abc.measures[data.active?.measureIndex]?.notes[data.active?.noteIndex] || null;
|
|
|
if (!activeNote) return;
|
|
|
if (Array.isArray(value)) {
|
|
|
if (activeNote?.tie) {
|
|
@@ -1075,7 +1082,6 @@ export default defineComponent({
|
|
|
if (!data.active) return {} as unknown as INote;
|
|
|
const activeNote =
|
|
|
abcData.abc.measures[data.active.measureIndex]?.notes[data.active.noteIndex] || {};
|
|
|
- console.log("🚀 ~ activeNote:", activeNote);
|
|
|
return activeNote;
|
|
|
});
|
|
|
|
|
@@ -1810,10 +1816,19 @@ export default defineComponent({
|
|
|
<div
|
|
|
class={[styles.btnImg, noteComputed.value.content === "z" && styles.btnImgActive]}
|
|
|
>
|
|
|
- <img style={{ width: "24px", height: "24px" }} src={getImage("icon_rest.png")} />
|
|
|
+ <img style={{ width: "20px", height: "20px" }} src={getImage("icon_rest.png")} />
|
|
|
</div>
|
|
|
<div>休止符</div>
|
|
|
</div>
|
|
|
+
|
|
|
+ <div class={styles.topBtn} onClick={() => handleChange({ type: "segno", value: " " })}>
|
|
|
+ <div
|
|
|
+ class={[styles.btnImg, noteComputed.value.segno === " " && styles.btnImgActive]}
|
|
|
+ >
|
|
|
+ {/* <img style={{ width: "20px", height: "20px" }} src={getImage("icon_rest.png")} /> */}
|
|
|
+ </div>
|
|
|
+ <div>分割</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</CollapseItem>
|
|
|
<CollapseItem title="谱号" name="clef">
|