|
|
@@ -1,10 +1,11 @@
|
|
|
import { defineComponent, onMounted, watch, reactive, ref, nextTick } from "vue";
|
|
|
import styles from "./index.module.less";
|
|
|
import backImg from "./image/icon-back.png";
|
|
|
+import titmeImg from "./image/modeTitle.png";
|
|
|
import nameImg from "./image/zt.png";
|
|
|
-import lxMode from "./image/lxMode.json";
|
|
|
-import glMode from "./image/glMode.json";
|
|
|
-import pcMode from "./image/pcMode.json";
|
|
|
+// import lxMode from "./image/lxMode.json";
|
|
|
+// import glMode from "./image/glMode.json";
|
|
|
+// import pcMode from "./image/pcMode.json";
|
|
|
import lxImg from "./image/lxImg.png";
|
|
|
import glImg from "./image/glImg.png";
|
|
|
import pcImg from "./image/pcImg.png";
|
|
|
@@ -75,37 +76,38 @@ export default defineComponent({
|
|
|
headTopData.modeType = "show";
|
|
|
}}
|
|
|
/>
|
|
|
+ <img src={titmeImg} class={styles.modeTitle} />
|
|
|
<div class={[styles.modeBox, ((!state.isPercussion && !state.enableEvaluation) || (state.isPercussion && state.enableEvaluation) || (state.isPercussion && !state.enableEvaluation)) && styles.twoModeBox]}>
|
|
|
- <Vue3Lottie ref={modeImgDom1} class={styles.modeImg} animationData={lxMode} autoPlay={false} loop={true} onClick={() => {
|
|
|
+ {/* <Vue3Lottie ref={modeImgDom1} class={styles.modeImg} animationData={lxMode} autoPlay={false} loop={true} onClick={() => {
|
|
|
if(state.isSingleLine){
|
|
|
smoothAnimationState.isShow.value = state.melodyLine;
|
|
|
}
|
|
|
headTopData.handleChangeModeType("practise")
|
|
|
- }}></Vue3Lottie>
|
|
|
- {/* <img class={styles.modeImg} src={lxImg}
|
|
|
+ }}></Vue3Lottie> */}
|
|
|
+ <img class={styles.modeImg} src={lxImg}
|
|
|
onClick={() => {
|
|
|
if(state.isSingleLine){
|
|
|
smoothAnimationState.isShow.value = state.melodyLine;
|
|
|
}
|
|
|
headTopData.handleChangeModeType("practise")
|
|
|
- }} /> */}
|
|
|
+ }} />
|
|
|
{!state.isPercussion &&
|
|
|
- <Vue3Lottie ref={modeImgDom2} class={styles.modeImg} animationData={glMode} autoPlay={false} loop={true} onClick={() => headTopData.handleChangeModeType("follow")}></Vue3Lottie>
|
|
|
- /* <img class={styles.modeImg} src={glImg}
|
|
|
- onClick={() => headTopData.handleChangeModeType("follow")} /> */
|
|
|
+ // <Vue3Lottie ref={modeImgDom2} class={styles.modeImg} animationData={glMode} autoPlay={false} loop={true} onClick={() => headTopData.handleChangeModeType("follow")}></Vue3Lottie>
|
|
|
+ <img class={styles.modeImg} src={glImg}
|
|
|
+ onClick={() => headTopData.handleChangeModeType("follow")} />
|
|
|
}
|
|
|
{state.enableEvaluation &&
|
|
|
- <Vue3Lottie ref={modeImgDom3} class={styles.modeImg} animationData={pcMode} autoPlay={false} loop={true} onClick={() => {
|
|
|
- // 点击评测模式进入评测模块的需要检测耳机状态，通过返回按钮进入评测模块的，不检测耳机状态
|
|
|
- evaluatingData.needCheckErjiStatus = true;
|
|
|
- headTopData.handleChangeModeType("evaluating")
|
|
|
- }}></Vue3Lottie>
|
|
|
- // <img class={styles.modeImg} src={pcImg}
|
|
|
- // onClick={() => {
|
|
|
- // // 点击评测模式进入评测模块的需要检测耳机状态，通过返回按钮进入评测模块的，不检测耳机状态
|
|
|
- // evaluatingData.needCheckErjiStatus = true;
|
|
|
- // headTopData.handleChangeModeType("evaluating")
|
|
|
- // }} />
|
|
|
+ // <Vue3Lottie ref={modeImgDom3} class={styles.modeImg} animationData={pcMode} autoPlay={false} loop={true} onClick={() => {
|
|
|
+ // // 点击评测模式进入评测模块的需要检测耳机状态，通过返回按钮进入评测模块的，不检测耳机状态
|
|
|
+ // evaluatingData.needCheckErjiStatus = true;
|
|
|
+ // headTopData.handleChangeModeType("evaluating")
|
|
|
+ // }}></Vue3Lottie>
|
|
|
+ <img class={styles.modeImg} src={pcImg}
|
|
|
+ onClick={() => {
|
|
|
+ // 点击评测模式进入评测模块的需要检测耳机状态，通过返回按钮进入评测模块的，不检测耳机状态
|
|
|
+ evaluatingData.needCheckErjiStatus = true;
|
|
|
+ headTopData.handleChangeModeType("evaluating")
|
|
|
+ }} />
|
|
|
}
|
|
|
</div>
|
|
|
{/** 延迟检测中途，socket出错，网络提示弹窗 */}
|
