Merge branch 'feature-tianyong'

src/page-instrument/component/mode-type-mode/index.tsx

@@ -90,8 +90,9 @@ export default defineComponent({
 						/>
 						<img
 							id="modeType-2"
+							style={{ cursor: state.enableEvaluation ? "pointer" : "not-allowed" }}
 							onClick={() => headTopData.handleChangeModeType("evaluating")}
-							src={icons.icon_3}
+							src={state.enableEvaluation ? icons.icon_3 : icons.icon_4}
 						/>
 					</div>
 					{data.showPC && data.showTip ? <TeacherBootom></TeacherBootom> : null}

src/page-instrument/evaluat-model/delay-check/index.tsx

@@ -111,9 +111,10 @@ export default defineComponent({
 			// data.step = evaluatingData.earphone ? 4 : 3;
 		};
 		const hanldeEndTune = () => {
+			console.log('设置soundEffect')
 			data.step = 7;
 			anim.value?.play();
-			state.setting.soundEffect = false;
+			// state.setting.soundEffect = false;
 		};
 
 		const toggleTune = async (state: "start" | "stop" | "finishTune") => {

src/page-instrument/header-top/index.tsx

@@ -23,6 +23,7 @@ import { browser } from "/src/utils";
 import store from "store";
 import "../component/the-modal-tip/index.module.less";
 import { metronomeData } from "../../helpers/metronome";
+import { toggleMusicSheet } from "/src/view/plugins/toggleMusicSheet"
 
 /** 头部数据和方法 */
 export const headTopData = reactive({
@@ -34,6 +35,7 @@ export const headTopData = reactive({
   settingMode: false,
   /** 切换模式 */
   handleChangeModeType(value: "practise" | "follow" | "evaluating") {
+    if (!state.enableEvaluation) return
     // 跟练模式，光标只有音符模式，无节拍模式
     if (value === 'follow' && metronomeData.cursorMode === 2) {
       metronomeData.cursorMode = 1
@@ -350,7 +352,14 @@ export default defineComponent({
                 </>}
               </span>
             </div>
-
+            {state.musicRendered && !query.lessonTrainingId && !query.questionId && (
+              <div class={[styles.btn]} onClick={() => {
+                toggleMusicSheet.toggle(true)
+              }}>
+                <img class={styles.iconBtn} src={headImg(`shenggui.svg`)} />
+                <span>声轨</span>
+              </div>
+            )}
             <div
               id={state.platform === IPlatform.PC ? "teacherTop-1" : "studnetT-1"}
               style={{ display: originBtn.value.display ? "" : "none" }}
@@ -403,26 +412,28 @@ export default defineComponent({
                 default: () => <Speed />,
               }}
             </Popover>
-            <Popover trigger="manual" v-model:show={headData.musicTypeShow} placement="bottom-end" overlay={false}>
-              {{
-                reference: () => (
-                  <div
-                    id={state.platform === IPlatform.PC ? "teacherTop-5" : "studnetT-5"}
-                    style={{ display: converBtn.value.display ? "" : "none" }}
-                    class={[styles.btn, converBtn.value.disabled && styles.disabled]}
-                    onClick={(e: Event) => {
-                      e.stopPropagation();
-                      headData.musicTypeShow = !headData.musicTypeShow;
-                    }}
-                  >
-                    <img class={styles.iconBtn} src={headImg("icon_zhuanpu.svg")} />
-                    <span>{state.musicRenderType === "staff" ? "转谱" : "转谱"}</span>
-                  </div>
-                ),
-                default: () => <MusicType />,
-              }}
-            </Popover>
-
+            {
+              state.enableNotation ? 
+              <Popover trigger="manual" v-model:show={headData.musicTypeShow} placement="bottom-end" overlay={false}>
+                {{
+                  reference: () => (
+                    <div
+                      id={state.platform === IPlatform.PC ? "teacherTop-5" : "studnetT-5"}
+                      style={{ display: converBtn.value.display ? "" : "none" }}
+                      class={[styles.btn, converBtn.value.disabled && styles.disabled]}
+                      onClick={(e: Event) => {
+                        e.stopPropagation();
+                        headData.musicTypeShow = !headData.musicTypeShow;
+                      }}
+                    >
+                      <img class={styles.iconBtn} src={headImg("icon_zhuanpu.svg")} />
+                      <span>{state.musicRenderType === "staff" ? "转简谱" : "转五线谱"}</span>
+                    </div>
+                  ),
+                  default: () => <MusicType />,
+                }}
+              </Popover> : null            
+            }
             <div id={state.platform === IPlatform.PC ? "teacherTop-6" : "studnetT-6"} style={{ display: settingBtn.value.display ? "" : "none" }} class={[styles.btn, settingBtn.value.disabled && styles.disabled]} onClick={() => (headTopData.settingMode = true)}>
               <img class={styles.iconBtn} src={headImg("icon_menu.svg")} />
               <span>设置</span>

src/page-instrument/header-top/settting/index.module.less

@@ -173,7 +173,7 @@
         display: flex;
         justify-content: space-evenly;
         align-items: center;
-        width: 30%;
+        width: 42%;
         height: 30px;
         padding: 0 6px;
         border-radius: 6px;

src/page-instrument/header-top/settting/index.tsx

@@ -98,10 +98,10 @@ export default defineComponent({
 								}}
 							</Cell>
 							<div class={styles.btnsbar}>
-								<div class={styles.btn} onClick={downPng}>
+								{/* <div class={styles.btn} onClick={downPng}>
 									<img src={iconDown} />
 									下载曲谱
-								</div>
+								</div> */}
 								<div class={styles.btn} onClick={() => (helperData.show = true)}>
 									<img src={iconTv} />
 									投屏帮助

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

@@ -26,6 +26,7 @@ import TheMusicList from "../component/the-music-list";
 import { storeData } from "/src/store";
 import ViewFigner from "../view-figner";
 import { recalculateNoteData } from "/src/view/selection";
+import ToggleMusicSheet from "/src/view/plugins/toggleMusicSheet"
 
 const calcCeilFrequency = (frequency: number) => {
   if (frequency) return frequency * 1000 * 2 / 1000;
@@ -123,7 +124,7 @@ export default defineComponent({
 			state.detailId = data.id;
 			state.xmlUrl = data.xmlFileUrl;
 			state.partIndex = index;
-			state.subjectId = data.musicSubject;
+			state.subjectId = data.track;
 			state.categoriesId = data.categoriesId;
 			state.categoriesName = data.musicTagNames;
 			state.enableEvaluation = data.canEvaluate ? true : false;
@@ -177,8 +178,9 @@ export default defineComponent({
         state.zoom = query.zoom || 1.5;
       }
 
-      //课堂乐器,默认简谱
-      state.musicRenderType = EnumMusicRenderType.firstTone;
+      //课堂乐器, 渲染类型: 五线谱, 简谱
+      state.musicRenderType = query.musicRenderType || EnumMusicRenderType.firstTone;
+      console.log('state对象', state)
     };
 
     const setCustom = () => {
@@ -212,7 +214,7 @@ export default defineComponent({
       state.times = formateTimes(osmd);
       state.times = resetFrequency(state.times);
       state.times = setNoteHalfTone(state.times);
-      console.log("🚀 ~ state.times:", state.times, state.subjectId);
+      console.log("🚀 ~ state.times:", state.times, state.subjectId, state);
       try {
         metronomeData.metro = new Metronome();
         metronomeData.metro.init(state.times);
@@ -430,6 +432,11 @@ export default defineComponent({
           </>
         )}
 
+        {/* 切换曲谱 */}
+        {!query.lessonTrainingId && !query.questionId && (
+          <ToggleMusicSheet />
+        )}
+
         {state.musicRendered && (
           <>
             {/* 统计训练时长 */}

src/page-orchestra/evaluat-model/index.tsx

@@ -294,6 +294,7 @@ export default defineComponent({
 					<SoundEffect
 						onClose={(value: any) => {
 							evaluatingData.soundEffectMode = false;
+							console.log('设置soundEffect')
 							if (value) {
 								state.setting.soundEffect = false;
 							}

src/page-orchestra/header-top/mode-type-mode/index.tsx

@@ -1,6 +1,7 @@
 import { defineComponent, onMounted, Teleport, Transition } from "vue";
 import styles from "./index.module.less";
-import { model1, model2, model3 } from "../image/headerTop.json";
+import { model1, model2, model3, model4 } from "../image/headerTop.json";
+import state from "/src/state";
 
 export default defineComponent({
 	name: "modelWraper",
@@ -10,7 +11,7 @@ export default defineComponent({
 			<div class={styles.wrap}>
 				<img id="modeType-0" onClick={() => emit("close", "practise")} src={model1} />
 				<img id="modeType-1" onClick={() => emit("close", "follow")} src={model3} />
-				<img id="modeType-2" onClick={() => emit("close", "evaluating")} src={model2} />
+				<img id="modeType-2" onClick={() => emit("close", "evaluating")} src={ model4 } />
 			</div>
 		);
 	},

src/state.ts

@@ -266,6 +266,12 @@ const handlePlaying = () => {
           onEnded();
           return;
         }
+        // #8698 bug修复
+        if (state.modeType === "practise" && state.sectionStatus && !state.setting.repeatAutoPlay) {
+          onEnded();
+          resetPlaybackToStart();
+          return;
+        }
         item = selectStartItem;
         setAudioCurrentTime(selectStartItem.time, selectStartItem.i);
       }

src/view/fingering/fingering-config.ts

@@ -123,13 +123,15 @@ export const mappingVoicePart = (
 			1: "pan-flute",
 			2: "ocarina",
 			5: "melodica",
+			26: 12,
 			tenorrecorder: "piccolo",
 			woodwind: "hulusi-flute",
 			panpipes: "pan-flute",
 			ocarina: "ocarina",
 			nai: "melodica",
 		};
-		return subject[code] || 0;
+		const _track = typeof code === 'string' ? Object.keys(subject).filter((key) => key.includes(String(code)) || String(code).includes(key))[0] : code
+		return subject[_track] || 0;
 	}
 	return 0;
 };

src/view/plugins/toggleMusicSheet/choosePartName/index.module.less

@@ -0,0 +1,39 @@
+.container {
+  display: flex;
+  flex-direction: column;
+  width: 50vw;
+  height: 80vh;
+  max-height: 500px;
+  background-color: #fff;
+  overflow: hidden;
+
+  .top {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 8px 10px;
+    position: relative;
+    font-size: 14Px;
+    &::before {
+      content: '';
+      position: absolute;
+      left: 4px;
+      top: 50%;
+      height: 30%;
+      transform: translateY(-50%);
+      width: 2px;
+      background-color: var(--van-primary-color);
+      border-radius: 2px;
+    }
+  }
+
+  .picker {
+    flex: 1;
+  }
+
+  .button {
+    width: 50%;
+    height: 40Px;
+    margin: 10Px auto;
+  }
+}

src/view/plugins/toggleMusicSheet/choosePartName/index.tsx

@@ -0,0 +1,49 @@
+import { PropType, computed, defineComponent, ref, toRefs } from 'vue'
+import { Picker, Button, Icon } from 'vant'
+import styles from './index.module.less'
+
+export default defineComponent({
+  name: 'choosePartName',
+  props: {
+    partListNames: {
+      type: Array as PropType<string[]>,
+      default: () => [],
+    },
+    partIndex: {
+      type: Number,
+      default: 0,
+    },
+  },
+  emits: ['close'],
+  setup(props, { emit }) {
+    const { partListNames, partIndex } = toRefs(props)
+    const selectIndex = ref((partListNames.value[partIndex.value] as any).value)
+    const columns = computed(() => {
+      return partListNames.value
+    })
+    return () => (
+      <div class={styles.container}>
+        <div class={styles.top}>
+          <div class={styles.title}>请选择您练习的乐器</div>
+          <Icon name="cross" size={24} onClick={() => emit('close')} />
+        </div>
+        <Picker
+          class={styles.picker}
+          defaultIndex={partIndex.value}
+          showToolbar={false}
+          columns={columns.value}
+          visibleItemCount={Math.ceil(document.body.clientHeight / 44 / 3)}
+          onChange={(row) => {
+            //console.log('选择的索引', row)
+            selectIndex.value = row.selectedValues[0]
+          }}
+        />
+        <Button class={styles.button} type="primary" round block onClick={() => {
+          emit('close', selectIndex.value)}
+        }>
+          确定
+        </Button>
+      </div>
+    )
+  },
+})

src/view/plugins/toggleMusicSheet/index.module.less

@@ -0,0 +1,15 @@
+.iconToggle {
+    position: fixed;
+    left: 0;
+    bottom: 20%;
+    transform: scaleX(-1);
+    z-index: 10;
+    margin: 0;
+    background: rgba(0, 0, 0, 0.24);
+    border-radius: 5px 0px 0px 5px;
+    padding: 7px 3px;
+}
+.popup{
+    border-radius: 4px;
+    overflow: hidden;
+}

src/view/plugins/toggleMusicSheet/index.tsx

@@ -0,0 +1,79 @@
+import { computed, defineComponent, reactive } from 'vue'
+import styles from './index.module.less'
+import { Icon, Popup } from 'vant'
+import ChoosePartName from './choosePartName'
+import runtime, * as RuntimeUtils from '/src/pages/detail/runtime'
+import state, { togglePlay } from "/src/state";
+import qs from 'query-string'
+import { getInstrumentName } from "/src/constant/instruments";
+import { getQuery } from "/src/utils/queryString";
+
+export const toggleMusicSheet = reactive({
+  show: false,
+  toggle: (type = true) => {
+    toggleMusicSheet.show = type
+  },
+})
+
+export default defineComponent({
+  name: 'ToggleMusicSheet',
+  setup() {
+    const query = getQuery();
+
+    const partListNames = computed(() => {
+      let partList = state.partListNames || []
+      partList = partList.filter((item: any) => !item?.toLocaleUpperCase()?.includes('COMMON'))
+      return partList.map((item: any, index: number) => {
+        const instrumentName = getInstrumentName(item)
+        return {
+          text: item + (instrumentName ? `(${instrumentName})` : ''),
+          value: index,
+        }
+      }).filter(Boolean)
+    })
+
+    const switchMusic = (index: number) => {
+      // 暂停播放
+      togglePlay("paused");
+      // 销毁播放器
+      postMessage({
+        api: 'cloudDestroy',
+      })
+      postMessage({
+        api: 'cloudLoading',
+        content: {
+          show: true,
+          type: 'fullscreen',
+        },
+      })
+      const _url =
+        location.origin +
+        location.pathname +
+        '?' +
+        qs.stringify({
+          ...query,
+          behaviorId: sessionStorage.getItem('behaviorId') || '',
+          _t: new Date().valueOf(),
+          'part-index': index,
+        })
+      console.log(_url)
+      location.href = _url
+    }
+
+    return () => (
+      <Popup class={styles.popup} v-model:show={toggleMusicSheet.show}>
+        <ChoosePartName
+          partIndex={state.partIndex}
+          partListNames={partListNames.value}
+          onClose={(value) => {
+            console.log("🚀 ~ value:", value)
+            toggleMusicSheet.show = false
+            if (value !== undefined) {
+              switchMusic(value)
+            }
+          }}
+        />
+      </Popup>
+    )
+  },
+})