Merge branch 'feature-tianyong-newVersion' into feature-wxl-newVersion

src/helpers/customMusicScore.ts

@@ -538,7 +538,7 @@ export const resetFormate = () => {
 		};
 
 		// 给小节添加背景色
-		if (!state.isCreateImg) {
+		if (!state.isCreateImg && !state.isPreView) {
 			staves.forEach((stave: any) => {
 				const list = [
 					Array.from(stave?.querySelectorAll(".vf-StaveSection") || []),

src/helpers/metronome.ts

@@ -286,14 +286,19 @@ class Metronome {
 			const measureListIndex = note?.noteElement?.sourceMeasure?.measureListIndex;
 			if (measureNumberXML > -1) {
 				if (measureNumberXML != xmlNumber) {
+					// 弱起的时候 根据音符结尾时间减去音符开头时间，得到的不是正常小节的时间，然后平均分配节拍之后，当前节拍间隔会非常短 这里弱起拿正常
+					// 妙极客的弱起不受这个影响
+					let startTime = note.measures[0].time
+					if(!state.isEvxml && i === 0){
+						startTime = note.measures[note.measures.length - 1].endtime - note.measures[0].measureLength
+					}
 					const m = {
 						measureNumberXML: measureNumberXML,
 						measureNumberIndex: measureListIndex,
 						numerator: note?.noteElement?.sourceMeasure?.ActiveTimeSignature?.numerator || 0,
-						start: note.measures[0].time,
+						start: startTime,
 						end: note.measures[note.measures.length - 1].endtime,
-						// bug todo  弱起的时候 根据音符结尾时间减去音符开头时间，得到的不是正常小节的时间，然后平均分配节拍之后，当前节拍间隔会非常短
-						time: note.measures[note.measures.length - 1].endtime - note.measures[0].time,
+						time: note.measures[note.measures.length - 1].endtime - startTime,
 						stave_x: note?.noteElement?.sourceMeasure?.verticalMeasureList?.[0]?.stave?.x || 0,
 						end_x: note?.stave?.end_x || 0 || 0,
 						stepList: [] as number[],

src/page-instrument/component/the-music-list/index.module.less

@@ -25,9 +25,11 @@
                             height: 30px;
                             background: url("./imgs/qtqm.png") no-repeat;
                             background-size: 100% 100%;
+                            background-position-y: 2px;
                             &.van-tab--active{
                                 background: url("./imgs/qtqmAct.png") no-repeat;
                                 background-size: 100% 100%;
+                                background-position-y: 2px;
                             }
                         }                   
                         &:nth-child(2){
@@ -37,9 +39,11 @@
                             height: 30px;
                             background: url("./imgs/zjlx.png") no-repeat;
                             background-size: 100% 100%;
+                            background-position-y: 2px;
                             &.van-tab--active{
                                 background: url("./imgs/zjlxAct.png") no-repeat;
                                 background-size: 100% 100%;
+                                background-position-y: 2px;
                             }
                         }
                     }
@@ -137,6 +141,12 @@
             margin-top: 10px;
             height: calc(100% - 44px);
             overflow-y: auto;
+            .van-loading__circular{
+                color: rgba(0,0,0,0.3);
+            }
+            .van-loading__text{
+                color: rgba(0,0,0,0.3);
+            }
         }
     }
 }

src/page-instrument/custom-plugins/helper-model/recommendation/index.module.less

@@ -67,6 +67,18 @@
                 width: 0;
                 display: none;
             }
+            .rowCon{
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+                .tit{
+                    margin-right: 2px;
+                    font-family: PingFangSC, PingFang SC;
+                    font-weight: 500;
+                    font-size: 13px;
+                    color: #B6C4D2;
+                }
+            }
             .dropdownMenu{
                 width: 138px;
                 position: relative;
@@ -75,6 +87,7 @@
                         height: 30px;
                         background: #FFFFFF;
                         border-radius: 15px;
+                        box-shadow: initial;
                         .van-dropdown-menu__item{
                             padding: 0 12px;
                         }
@@ -91,10 +104,12 @@
                         }
                     }
                     .recommendationDropdownItem{
-                        top: 112px !important;
-                        left: 24px;
-                        width: 152px;
+                        top: 106px !important;
+                        left: 14px;
+                        width: 172px;
                         .van-dropdown-item__content{
+                            margin: 6px 0 0 10px;
+                            width: 152px;
                             max-height:162px;
                             padding: 0 10px;
                             background: #FFFFFF;
@@ -160,6 +175,9 @@
                 :global{
                     .van-uploader__preview{
                         margin: 0 8px 0 0;
+                        &:nth-child(5){
+                            margin-right: 0;
+                        }
                         .van-uploader__preview-image{
                             width: 56px;
                             height: 56px;

src/page-instrument/custom-plugins/helper-model/recommendation/index.tsx

@@ -105,6 +105,12 @@ export default defineComponent({
 		onMounted(() => {
 			getTypeList();
 		});
+		function beforeRead(file:any[]){
+			if(file.length > 5){
+				showToast(`最多只能选择5张图片`);
+			}
+			return true
+		}
 		return () => (
 			<div class={[styles.recommendation,styles[state.modeType]]}>
 				<div class={styles.head}>
@@ -113,9 +119,12 @@ export default defineComponent({
 				</div>
 				<div class={styles.content}>
                     <div class={styles.conBox}>
-						<DropdownMenu class={[styles.dropdownMenu, currItem.value && styles.currItem]} overlay={false}>
-							<DropdownItem class={['recommendationDropdownItem']} title={ currItem.value?currItem.value.name:"请选择反馈类型"} v-model={recommenData.suggestId} options={suggestionTypeList.value}/>
-						</DropdownMenu>
+						<div class={styles.rowCon}>
+							<DropdownMenu class={[styles.dropdownMenu, currItem.value && styles.currItem]} overlay={false}>
+								<DropdownItem class={['recommendationDropdownItem']} title={ currItem.value?currItem.value.name:"请选择反馈类型"} v-model={recommenData.suggestId} options={suggestionTypeList.value}/>
+							</DropdownMenu>
+							<div class={styles.tit}>{`${recommenData.message.length}/200`}</div>
+						</div>
 						<Field
 							class={styles.field}
 							v-model={recommenData.message}
@@ -124,7 +133,7 @@ export default defineComponent({
 							maxlength={200}
 							placeholder="请详细描述您遇到的问题，以便我们尽快为您解决"
 						/>
-						<Uploader accept=".jpg,jpeg,.png" class={styles.uploader} max-size={maxSize * 1024 * 1024} onOversize={onOversize} v-model={fileList.value} after-read={afterRead} multiple max-count={4}>
+						<Uploader accept=".jpg,jpeg,.png" class={styles.uploader} max-size={maxSize * 1024 * 1024} onOversize={onOversize} v-model={fileList.value} beforeRead={beforeRead} after-read={afterRead} multiple max-count={5}>
 							<div class={styles.uploaderbox}>
 								<img class={styles.img} src={headImg("photo.png")}></img>
 								<div>上传图片</div>

src/page-instrument/evaluat-model/evaluat-result/index.module.less

@@ -131,7 +131,7 @@
                 font-weight: 400;
                 font-size: 12px;
                 color: #8A541E;
-
+                font-family: PingFangSC, PingFang SC;
                 &>span {
                     margin: -2px 4px 0;
                 }
@@ -167,13 +167,20 @@
 
 .ctrls {
     display: flex;
-    justify-content: space-between;
     align-items: center;
+    justify-content: center;
     margin: 0 27px 14px;
 
     .ctrlsBtn {
         width: 107px;
         height: 39px;
+        display: block;
+    }
+    >img:first-child{
+        margin-right: 10px;
+    }
+    >img:last-child{
+        margin-left: 10px;
     }
 }
 
@@ -200,7 +207,7 @@
       min-width: 12Px;
       width: 12Px;
       height: 12Px;
-      background-image: url('./icons/close_icon.png');
+      background-image: url('./img/close_icon.png');
       background-size: 100% 100%;
       background-position: center center;
       background-repeat: no-repeat;
@@ -299,6 +306,9 @@
         font-size: 18px;
         color: #FF5510;
         line-height: 25px;
+        .scores{
+            font-size: 14px;
+        }
     }
 
 }

src/page-instrument/evaluat-model/evaluat-result/index.tsx

@@ -148,21 +148,21 @@ export default defineComponent({
                       <img src={yzImg} />
                       <span>音准</span>
                     </div>
-                    <div>{evaluatingData.resultData.intonation}分</div>
+                    <div>{evaluatingData.resultData.intonation}<span class={styles.scores}>分</span></div>
                   </div>
                   <div class={styles.progressitem}>
                     <div>
                       <img src={jzImg} />
                       <span>节奏</span>
                     </div>
-                    <div>{evaluatingData.resultData.cadence}分</div>
+                    <div>{evaluatingData.resultData.cadence}<span class={styles.scores}>分</span></div>
                   </div>
                   <div class={styles.progressitem}>
                     <div>
                       <img src={wzxImg} />
                       <span>完成度</span>
                     </div>
-                    <div>{evaluatingData.resultData.integrity}分</div>
+                    <div>{evaluatingData.resultData.integrity}<span class={styles.scores}>分</span></div>
                   </div>
                 </div>
               )}

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

@@ -40,6 +40,12 @@ let actualBeatLength = 0;
 let calculateInfo: any = {};
 let checkErjiTimer: any = null
 
+export const reCheckDelay = () => {
+  headTopData.settingMode = false
+  state.setting.soundEffect = false
+  api_startDelayCheck({});
+}
+
 export default defineComponent({
   name: "evaluat-model",
   setup() {
@@ -59,8 +65,8 @@ export default defineComponent({
         api_back();
       } else {
         evaluatingData.soundEffectMode = false;
-        handleRessetState();
-        headTopData.modeType = "init";
+        // handleRessetState();
+        // headTopData.modeType = "init";
       }
     };
     /**
@@ -154,6 +160,7 @@ export default defineComponent({
 
     /** 生成评测曲谱数据 */
     const formatTimes = () => {
+      console.log('评测111')
       let starTime = 0;
       let ListenMode = false;
       let dontEvaluatingMode = false;
@@ -187,6 +194,11 @@ export default defineComponent({
       }
       // 阶段评测beatLength需要加上预备小节的持续时长
       actualBeatLength = preTimes.length ? actualBeatLength + preTimes[preTimes.length - 1].relaMeasureLength * 1000 : actualBeatLength;
+      // 如果是弱起，并且预备小节是第一节
+      if (state.section.length && state.sectionFirst && state.sectionFirst.measureListIndex == 0) {
+        actualBeatLength = actualBeatLength < Math.round((state.times[0].fixtime * 1000) / 1) ? Math.round((state.times[0].fixtime * 1000) / 1) : actualBeatLength;
+      }
+      
       let firstNoteTime = unitTestIdx > 1 ? preTime : 0;
       let measureIndex = -1;
       let recordMeasure = -1;
@@ -197,7 +209,8 @@ export default defineComponent({
         // #8701 bug： 评测模式，是以曲谱本身的速度进行评测，所以rate取1，不需要转换
         // const rate = state.speed / state.originSpeed;
         const rate = state.basePlayRate * state.originAudioPlayRate; // 播放倍率
-        const difftime = item.difftime;
+        // const difftime = item.difftime;
+        const difftime = 0;
         const start = difftime + (item.sourceRelativeTime || item.relativeTime) - starTime;
         const end = difftime + (item.sourceRelaEndtime || item.relaEndtime) - starTime;
         const isStaccato = note.noteElement.voiceEntry.isStaccato();
@@ -244,6 +257,7 @@ export default defineComponent({
           // 重复的情况index会自然累加,render的index是谱面渲染的index
           measureIndex: measureIndex,
           measureRenderIndex: item.measureListIndex,
+          //  item.MeasureNumberXML >= 1 ? item.MeasureNumberXML - 1 : note.noteElement.sourceMeasure.measureListIndex,
           dontEvaluating: item.hasGraceNote || ListenMode || dontEvaluatingMode || !!item?.voiceEntry?.ornamentContainer || !!item.noteElement?.speedInfo?.startWord?.includes('rit.') || item.skipMode,
           musicalNotesIndex: index,
           denominator: note.noteElement?.Length.denominator,
@@ -372,6 +386,13 @@ export default defineComponent({
     };
 
     const startBtnHandle = async () => {
+      // 如果打开了延迟检测开关，需要先发送开始检测的消息
+      const delayData = await api_getDeviceDelay();
+      console.log('设备的延迟值',delayData.content?.value)
+      if (delayData && delayData.content?.value <= 0) {
+        await api_startDelayCheck({});
+        return;
+      }
       evaluatingData.needReplayEvaluat = false;
       // 选段未完成时，清除选段状态
       if (state.sectionStatus && state.section.length < 2) {
@@ -439,15 +460,16 @@ export default defineComponent({
 			return evaluatingData.earphoneMode && !state.isLoading && !state.hasDriverPop;
 		});
 
-    watch(
-      () => state.setting.soundEffect,
-      (val) => {
-        if (val) {
-          headTopData.settingMode = false
-          api_startDelayCheck({});
-        }
-      }
-    );
+    // watch(
+    //   () => state.setting.soundEffect,
+    //   (val) => {
+    //     if (val) {
+    //       headTopData.settingMode = false
+    //       api_startDelayCheck({});
+    //       state.setting.soundEffect = false
+    //     }
+    //   }
+    // );
 
     // 手动取消评测，需要自动再次评测
     watch(
@@ -465,7 +487,7 @@ export default defineComponent({
       // 如果打开了延迟检测开关，需要先发送开始检测的消息
       const delayData = await api_getDeviceDelay();
       console.log('设备的延迟值',delayData.content?.value)
-      if (state.setting.soundEffect || (delayData && delayData.content?.value <= 0)) {
+      if (delayData && delayData.content?.value <= 0) {
         await api_startDelayCheck({});
       } else {
         evaluatingData.checkEnd = true;
@@ -488,7 +510,7 @@ export default defineComponent({
     return () => (
       <div>
         <div class={styles.operatingBtn}>
-          {evaluatingData.websocketState && !evaluatingData.startBegin && (
+          {!evaluatingData.startBegin && (
             <img
               class={[styles.iconBtn, "evaluting-1"]}
               src={headImg("icon_play.png")}
@@ -497,7 +519,7 @@ export default defineComponent({
               }}
             />
           )}
-          {evaluatingData.websocketState && evaluatingData.startBegin && (
+          {evaluatingData.startBegin && (
             <>
               <img class={styles.iconBtn} src={headImg("icon_reset.png")} onClick={() => {
                 // 校验评测最小间隔时间

src/page-instrument/follow-model/microphone/index.module.less

@@ -41,4 +41,32 @@
     width: 100px;
     margin: 18px 6px 17px 6px;
     cursor: pointer;
+}
+
+.microBox {
+    position: relative;
+    width: 100vw;
+    height: 100vh;
+    .microBg {
+        position: absolute;
+        left: 50%;
+        top: 20%;
+        height: 60%;
+        transform: translateX(-50%);
+    }
+    .microCancel {
+        position: absolute;
+        bottom: 85px;
+        left: 39.5%;
+        width: 91px;
+        height: 39px;
+    }
+    .microConfirm {
+        position: absolute;
+        bottom: 85px;
+        right: 28.5%;
+        transform: translateX(-80%);
+        width: 91px;
+        height: 39px;
+    }
 }

src/page-instrument/follow-model/microphone/index.tsx

@@ -3,22 +3,19 @@ import styles from "./index.module.less";
 import icons from "./images/index.json";
 import icon_cancel from "./images/icon_cancel.svg";
 import icon_confirm from "./images/icon_confirm.svg";
+import microBg from "./images/microBg.png";
+import microCancel from "./images/micro_cancel.png";
+import microConfirm from "./images/micro_confirm.png";
 
 export default defineComponent({
 	name: "earphone",
 	emits: ["close"],
 	setup(props, { emit }) {
 		return () => (
-			<div class={styles.fraction}>
-				<img class={styles.erji} src={icons.title} />
-				<div class={styles.content}>
-					<div class={styles.title}>开启权限</div>
-					<div class={styles.tip}>请开启麦克风访问权限</div>
-					<div class={styles.btns}>
-						<img src={icon_cancel} class={styles.btn} onClick={() => emit("close")} />
-						<img src={icon_confirm} class={styles.btn} onClick={() => emit("close")} />
-					</div>
-				</div>
+			<div class={styles.microBox}>
+				<img class={styles.microBg} src={microBg} />
+				<img class={styles.microCancel} src={microCancel} onClick={() => emit("close")} />
+				<img class={styles.microConfirm} src={microConfirm} onClick={() => emit("close")} />
 			</div>
 		);
 	},

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

@@ -390,4 +390,8 @@
     height: 1px;
     overflow: hidden;
     opacity: 0;
+}
+
+.socketErrorStatus{
+    top: 10vh;
 }

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

@@ -94,6 +94,8 @@ export const headTopData = reactive({
     }
     headTopData.modeType = "show";
   },
+  // 改变模式之前的状态
+  oldPlayType: "play"
 });
 
 export const headData = reactive({
@@ -105,6 +107,8 @@ let resetBtn: ComputedRef<{
   display: boolean;
   disabled: boolean;
 }>;
+// 点击切换的时候才触发提醒
+let isClickMode = false
 /**
  * 处理模式切换
  * @param oldPlayType   没改变之前的播放模式
@@ -126,6 +130,15 @@ export function handlerModeChange(oldPlayType: "play" | "sing", oldPlaySource: I
     // 隐藏重播按钮
     resetBtn && (resetBtn.value.display = false);
   }
+  // 当模式改变的时候  放在这里是因为需要等谱面加载完成之后再提示（点击按钮模式切换才提示）
+  if(isClickMode){
+    showToast({
+      message: state.playType === "play" ? "已切换为演奏场景" : "已切换为演唱场景",
+      position: "top",
+      className: "selectionToast",
+    });
+    isClickMode = false
+  }
 }
 // 模式切换之后重新给times赋值
 function modeChangeHandleTimes(oldPlayType: "play" | "sing", oldPlaySource: IPlayState) {
@@ -711,6 +724,7 @@ export default defineComponent({
               class={["driver-2", styles.btn, playTypeBtn.value.disabled && styles.disabled, styles.playType]}
               onClick={() => {
                 const oldPlayType = state.playType;
+                headTopData.oldPlayType = oldPlayType
                 const oldPlaySource = state.playSource;
                 if (state.playType === "play") {
                   state.playType = "sing";
@@ -719,6 +733,7 @@ export default defineComponent({
                   state.playType = "play";
                   state.playSource = state.music ? "music" : "background";
                 }
+                isClickMode = true
                 // 有指法并且显示指法的时候 切换到演唱模式 需要影藏指法
                 let isRefresh = false;
                 if (state.isShowFingering && state.fingeringInfo.name && (state.setting.displayFingering || displayFingeringCache)) {
@@ -740,11 +755,6 @@ export default defineComponent({
                 } else if (!isRefresh) {
                   handlerModeChange(oldPlayType, oldPlaySource, true);
                 }
-                showToast({
-                  message: state.playType === "play" ? "已切换为演奏场景" : "已切换为演唱场景",
-                  position: "top",
-                  className: "selectionToast",
-                });
               }}
             >
               <img style={{ display: state.playType === "play" ? "" : "none" }} class={styles.iconBtn} src={headImg(`perform.png`)} />

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

@@ -118,7 +118,7 @@ export default defineComponent({
         {data.showVip && <TheVip />}
         {/** 延迟检测中途，socket出错，网络提示弹窗 */}
         <div>
-            <Popup teleport="body" closeOnClickOverlay={false} class={["popup-custom", "van-scale"]} transition="van-scale" v-model:show={evaluatingData.socketErrorPop}>
+            <Popup teleport="body" closeOnClickOverlay={false} class={["popup-custom", "van-scale", evaluatingData.socketErrorStatus === 2 && styles.socketErrorStatus]} transition="van-scale" v-model:show={evaluatingData.socketErrorPop} overlay-style={evaluatingData.socketErrorStatus === 2?{ background: "initial" }:{}}>
               <AbnormalPop onConfirm={hanldeConfirmPop} onClose={hanldeClosePop} />
             </Popup>
         </div>         

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

@@ -9,6 +9,9 @@
             box-shadow: 0px 4px 0px 0px #5EA2B9;
             .conBox{
                 background: #E3F3F5;
+                .cellBox{
+                    border-color: #CFE6EC;
+                }
             }
         }
     }
@@ -99,6 +102,18 @@
                     color: #000000;
                     line-height: 21px;
                 }
+                .titbtn {
+                    width: 76px;
+                    height: 26px;
+                    font-weight: 600;
+                    font-size: 14px;
+                    color: #fff;
+                    text-align: center;
+                    line-height: 26px;
+                    background: url("../image/titBtn.png") no-repeat;
+                    background-size: 100% 100%;
+                    cursor: pointer;
+                }
                 .spendCon{
                     flex-grow: 1;
                     display: flex;
@@ -116,6 +131,27 @@
                                     background: linear-gradient( 270deg, #7ADEFF 0%, #29A9FF 100%);
                                     box-shadow: inset 1px 0px 5px 0px rgba(150,254,255,0.79);
                                     border: 1px solid #4A91D4;
+                                    &::after{
+                                        position: absolute;
+                                        content: "";
+                                        left: 4px;
+                                        top: 2px;
+                                        width: 100%;
+                                        height: 1px;
+                                        background: #FFFFFF;
+                                        border-radius: 1px;
+                                        filter: blur(1px);
+                                    }
+                                    &::before{
+                                        position: absolute;
+                                        content: "";
+                                        left: 2px;
+                                        top: 1px;
+                                        width: 4px;
+                                        height: 4px;
+                                        background: url("../image/gg.png") no-repeat;
+                                        background-size: 100% 100%;
+                                    }
                                     .van-slider__button-wrapper{
                                         bottom: 0;
                                         top: initial;

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

@@ -10,6 +10,7 @@ import Recommendation from "../../custom-plugins/helper-model/recommendation";
 import { resetRenderMusicScore } from "/src/view/music-score";
 import ScreenModel from "../../custom-plugins/helper-model/screen-model";
 import { getQuery } from "/src/utils/queryString";
+import { reCheckDelay } from "/src/page-instrument/evaluat-model"
 
 export default defineComponent({
 	name: "settting",
@@ -87,8 +88,11 @@ export default defineComponent({
                                     </div>   
                                 }                     
                                 <div class={styles.cellBox}>
-                                    <div class={styles.tit}>重新延迟检测</div>
-                                    <Switch v-model={state.setting.soundEffect}></Switch>
+                                    <div class={styles.tit}>延迟检测</div>
+                                    {/* <Switch v-model={state.setting.soundEffect}></Switch> */}
+                                    <div class={styles.titbtn} onClick={() => {
+                                        reCheckDelay();
+                                    }}>重新检测</div>
                                 </div> 
                                 <div class={[styles.cellBox, state.setting.camera && styles.isCamera]}>
                                     <div class={styles.tit}>摄像头</div>
@@ -153,10 +157,16 @@ export default defineComponent({
                                     {
                                         [{name:'单行谱',value:true},{name:'多行谱',value:false}].map(item=>{
                                             return <div class={ state.isSingleLine===item.value && styles.active } onClick={ ()=>{ 
+                                                if(state.isSingleLine === item.value){
+                                                    return
+                                                }
+                                                headTopData.settingMode = false
                                                 state.isSingleLine = item.value 
                                                 // resetRenderMusicScore(state.musicRenderType)
-                                                headTopData.settingMode = false
-                                                refreshMusicSvg();
+                                                const _time = setTimeout(() => {
+                                                    clearTimeout(_time)
+                                                    refreshMusicSvg();
+                                                }, 100);
                                                 // musicScoreRef.value?.refreshMusicScore()
                                             } }>{item.name}</div>
                                         })
@@ -172,10 +182,16 @@ export default defineComponent({
                                     {
                                         notationList.value.map(item=>{
                                             return <div class={ state.musicRenderType===item.value && styles.active } onClick={ ()=>{ 
+                                                if(state.musicRenderType === item.value){
+                                                    return
+                                                }
+                                                headTopData.settingMode = false
                                                 state.musicRenderType = item.value as any
                                                 // resetRenderMusicScore(state.musicRenderType)
-                                                headTopData.settingMode = false
-                                                refreshMusicSvg();
+                                                const _time = setTimeout(() => {
+                                                    clearTimeout(_time)
+                                                    refreshMusicSvg();
+                                                }, 100);
                                             } }>{item.name}</div>
                                         })
                                     }

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

@@ -9,6 +9,9 @@
             box-shadow: 0px 4px 0px 0px #5EA2B9;
             .conBox{
                 background: #E3F3F5;
+                .speedSel{
+                    border-color: #CFE6EC ;
+                }
             }
         }
     }
@@ -97,6 +100,27 @@
                                 background: linear-gradient( 270deg, #7ADEFF 0%, #29A9FF 100%);
                                 box-shadow: inset 1px 0px 5px 0px rgba(150,254,255,0.79);
                                 border: 1px solid #4A91D4;
+                                &::after{
+                                    position: absolute;
+                                    content: "";
+                                    left: 4px;
+                                    top: 2px;
+                                    width: 100%;
+                                    height: 1px;
+                                    background: #FFFFFF;
+                                    border-radius: 1px;
+                                    filter: blur(1px);
+                                }
+                                &::before{
+                                    position: absolute;
+                                    content: "";
+                                    left: 2px;
+                                    top: 1px;
+                                    width: 4px;
+                                    height: 4px;
+                                    background: url("../image/gg.png") no-repeat;
+                                    background-size: 100% 100%;
+                                }
                                 .van-slider__button-wrapper{
                                     bottom: 0;
                                     top: initial;
@@ -137,16 +161,17 @@
                 display: flex;
                 justify-content: space-between;
                 & > div{
-                    padding: 3px 13px;
+                    padding: 6px 13px;
                     background: #FFFFFF;
                     border-radius: 14px;
                     font-weight: 400;
                     font-size: 13px;
                     color: rgba(0,0,0,0.6);
-                    line-height: 18px;
+                    line-height: 1;
                     cursor: pointer;
                     &:active{
                         background: linear-gradient( 131deg, #44CAFF 0%, #259CFE 100%);
+                        color: #fff;
                     }
                 }
             }

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

@@ -6,7 +6,7 @@ import { headImg } from "../image";
 import state, { handleSetSpeed, resetBaseRate } from "../../../state";
 import { metronomeData } from "../../../helpers/metronome"; 
 import { getQuery } from "/src/utils/queryString";
-import { api_createMusicPlayer, api_updateMusicPlayer } from "/src/helpers/communication";
+import { api_createMusicPlayer, api_updateMusicPlayer, api_checkSocketStatus } from "/src/helpers/communication";
 import { storeData } from "/src/store";
 
 export default defineComponent({
@@ -35,6 +35,11 @@ export default defineComponent({
 			() => {
 				// handleSetSpeed(speed.value);
 				state.speed = Math.floor(speed.value);
+				// handleSetSpeed(speed.value);
+				if (state.playState === 'paused') {
+					const currentItem: any = (state.sectionStatus && state.section.length === 2) ? state.sectionFirst || state.section[0] : state.times[state.activeNoteIndex];
+					state.basePlayRate = currentItem?.measureSpeed ? state.speed / currentItem.measureSpeed : state.speed / state.originSpeed;
+				}
 			}
 		);
 		watch(
@@ -53,20 +58,26 @@ export default defineComponent({
 				metronomeData.disable = !val
 			}
 		})
+		// 切换节拍器
 		const toggleSwitch = async (res: any) => {
 			switchLoading.value = true;
 			try {
-			  // 模拟异步操作，例如 API 调用
-			  console.log(123567,res)
 			  if (storeData.isApp) {
+				state.loadingText = '节拍器准备中，请稍等…'
+				state.isLoading = true;
 				const targetSrc = res ? state.beatSong.accompany || state.beatSong.music : state.accompany || state.music;
-				api_updateMusicPlayer({
+				const resData = await api_updateMusicPlayer({
 					musicSrc: targetSrc || state.accompany || state.music, // 曲谱音频url，有可能含节拍器的音频不存在
 					tuneSrc: "https://oss.dayaedu.com/MECMP/1722593665681.mp3", //效音音频url
 					checkFrequence: 496,
 				})
-				metronomeDisable.value = res;
-				switchLoading.value = false;
+				// console.log('切换节拍器音频',resData)
+				if (resData?.content) {
+					state.isLoading = false;
+					metronomeDisable.value = res;
+					switchLoading.value = false;
+				}
+				// api_checkSocketStatus();
 			  } else {
 				metronomeDisable.value = res;
 				switchLoading.value = false;
@@ -74,9 +85,10 @@ export default defineComponent({
 			} catch (error) {
 			  console.log(error)
 			} finally {
-				//switchLoading.value = false;
+				state.isLoading = false;
+				switchLoading.value = false;
 			}
-		  };
+		};
 		return () => (
 			<div class={[styles.speedContainer, styles[state.modeType]]}>
 				<div class={styles.head}>

src/page-instrument/view-detail/index.module.less

@@ -74,7 +74,7 @@
         overflow: hidden;
     }
     .pcContainer {
-        height: calc(100vh - var(--header-height) - var(--pc-header-height));
+        // height: calc(100vh - var(--header-height) - var(--pc-header-height));
     }
     .fingeringCon{
         transition: scale 0.2s;
@@ -177,6 +177,9 @@
 
 .preViewDetail {
     background: #fff !important;
+    >.pageBg {
+        display: none;
+    }
     .headHeight {
         background: #fff !important;
     }
@@ -192,6 +195,15 @@
         #cursorImg-0 {
             opacity: 0 !important;
         }
+        .noteActive {
+            path {
+                fill: #000000;
+                stroke: #000000;
+            }
+            rect {
+                stroke: #000000;
+            }
+        }
     }
 }
 

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

@@ -146,6 +146,9 @@ export default defineComponent({
       if (state.isPreView) {
         state.zoom = 0.65
       }
+      if (id == '1814218144844087298' && state.isSingleLine) {
+        state.zoom = 0.7
+      }
       // 只有总控平台和预览 默认是多行谱
       (state.isPreView || query.isCbs) && (state.isSingleLine = false)
       // Promise.all([sysMusicScoreAccompanimentQueryPage(id)]).then((values) => {
@@ -277,6 +280,7 @@ export default defineComponent({
 
       evaluatCreateMusicPlayer();
       resetPlaybackToStart();
+      // 需要重新设置作业选段
       if (state.workSectionNeedReset) {
         resetSection();
       }
@@ -494,7 +498,7 @@ export default defineComponent({
           {!detailData.isLoading && 
             <MusicScore 
               ref={musicScoreRef}
-              musicColor={'#FFFFFF'}
+              musicColor={state.isPreView ? '#000000' : '#FFFFFF'}
               showPartNames={state.isCombineRender}
               onRendered={handleRendered} 
             > 

src/page-instrument/view-detail/smoothAnimation/index.ts

@@ -19,7 +19,7 @@ type smoothAnimationType = {
    osmdCanvasPageDom: null | HTMLElement
    osdmScrollDom: null | HTMLElement
    osdmScrollDomWith: number
-   osdmScrollDomOffsetWidth: number
+   osdmScrollDomOffsetLeft: number
    selectionBoxDom: null | HTMLElement
    pointsPos: pointsPosType
    translateXNum: number
@@ -39,7 +39,7 @@ export const smoothAnimationState = {
    osmdCanvasPageDom: null,
    osdmScrollDom: null,
    osdmScrollDomWith: 0,
-   osdmScrollDomOffsetWidth: 0,
+   osdmScrollDomOffsetLeft: 0,
    selectionBoxDom: null,
    pointsPos: [], // 计算之后的点坐标数组
    translateXNum: 0, // 当前谱面的translateX的距离   谱面的位置信息 由translateX和scrollLeft的偏移一起决定
@@ -105,7 +105,7 @@ export function destroySmoothAnimation() {
       osmdCanvasPageDom: null,
       osdmScrollDom: null,
       osdmScrollDomWith: 0,
-      osdmScrollDomOffsetWidth: 0,
+      osdmScrollDomOffsetLeft: 0,
       selectionBoxDom: null,
       pointsPos: [],
       translateXNum: 0,
@@ -135,6 +135,10 @@ export function moveSmoothAnimationByPlayTime(time?: number) {
    const noteDuration =
       (nextIndex > state.times.length - 1 ? state.times[state.activeNoteIndex]?.endtime : state.times[nextIndex].time) -
       state.times[state.activeNoteIndex]?.time
+   // 妙极客曲目 有可能2个音符时值一样
+   if (noteDuration <= 0) {
+      return
+   }
    // 当前时值在该区间的占比
    let playProgress = (currentTime - state.times[state.activeNoteIndex]?.time) / noteDuration
    // 华为手机 fixtime 有个默认0.08的值，所以进度可能为负数 ，这里兼容一下
@@ -187,8 +191,8 @@ function move_osmd(nowPointsPos: pointsPosType[0]) {
    const clientWidth = smoothAnimationState.osdmScrollDomWith
    const clientMidWidth = clientWidth / 2
    let { left, right, width } = smoothAnimationState.smoothBotDom!.getBoundingClientRect()
-   left -= smoothAnimationState.osdmScrollDomOffsetWidth
-   right -= smoothAnimationState.osdmScrollDomOffsetWidth
+   left -= smoothAnimationState.osdmScrollDomOffsetLeft
+   right -= smoothAnimationState.osdmScrollDomOffsetLeft
    const midBotNum = left + width / 2
    // 分阶段移动
    if (right > clientWidth) {
@@ -233,8 +237,8 @@ function move_osmd(nowPointsPos: pointsPosType[0]) {
       smoothAnimationState.translateXNum += speed * 5
    }
    // 最多移动的位置
-   const maxTranslateXNum =
-      smoothAnimationState.canvasDomWith - smoothAnimationState.osdmScrollDomWith - (smoothAnimationState.osdmScrollDom?.scrollLeft || 0)
+   const osdmScrollDomScrollLeft = smoothAnimationState.osdmScrollDom?.scrollLeft || 0
+   const maxTranslateXNum = smoothAnimationState.canvasDomWith - smoothAnimationState.osdmScrollDomWith - osdmScrollDomScrollLeft
    if (smoothAnimationState.translateXNum > maxTranslateXNum) {
       smoothAnimationState.translateXNum = maxTranslateXNum
    }
@@ -262,7 +266,7 @@ function smoothAnimationMove(pos: { x: number; y: number }, pointsPos: pointsPos
  */
 export function calcClientWidth() {
    smoothAnimationState.osdmScrollDomWith = smoothAnimationState.osdmScrollDom?.offsetWidth || 0
-   smoothAnimationState.osdmScrollDomOffsetWidth = smoothAnimationState.osdmScrollDom?.offsetLeft || 0
+   smoothAnimationState.osdmScrollDomOffsetLeft = smoothAnimationState.osdmScrollDom?.getBoundingClientRect().left || 0
 }
 /**
  * 创建dom
@@ -469,8 +473,8 @@ function createSmoothCurvePoints(pointsPos: pointsPosType, tension?: number, clo
  */
 function drawSmoothCurve(context: CanvasRenderingContext2D, pointsPos: pointsPosType, progresspointsPos?: pointsPosType) {
    context.lineWidth = 2
-   context.lineJoin = 'round';// 优化锯齿
-   context.lineCap = 'round'; // 优化锯齿
+   context.lineJoin = "round" // 优化锯齿
+   context.lineCap = "round" // 优化锯齿
    context.strokeStyle = "rgba(255,255,255,0.6)"
    drawLines(context, pointsPos)
    if (progresspointsPos?.length) {

src/page-instrument/view-evaluat-report/component/share-top/index.module.less

@@ -340,6 +340,7 @@
         position: relative;
         border-radius: 16px;
         box-shadow: 4px -3px 6px 0px #B2E8FF;
+        overflow: hidden;
 
         .audioBga {
             width: 100%;

src/page-instrument/view-evaluat-report/component/share-top/index.tsx

@@ -98,15 +98,15 @@ export default defineComponent({
 						const canvasDom = document.querySelector("#audioVisualizer") as HTMLCanvasElement
 						const { pauseVisualDraw, playVisualDraw } = audioVisualDraw(audioDom, canvasDom)
 						shareData._plrl.on('play', () => {
-							lottieDom.value.play()
-							lottieDom1.value.play()
-							lottieDom2.value.play()
+							lottieDom.value?.play()
+							lottieDom1.value?.play()
+							lottieDom2.value?.play()
 							playVisualDraw()
 						});
 						shareData._plrl.on('pause', () => {
-							lottieDom.value.pause()
-							lottieDom1.value.pause()
-							lottieDom2.value.pause()
+							lottieDom.value?.pause()
+							lottieDom1.value?.pause()
+							lottieDom2.value?.pause()
 							pauseVisualDraw()
 						});
 					}, 300); // 弹窗动画是0.25秒 这里用定时器 确保canvas 能获取到宽高
@@ -357,7 +357,7 @@ export default defineComponent({
                   {itemType.value === "integrity" && (
                     <div>
                       <Note fill="#65FFAE" />
-                      <span>时值正确</span>
+                      <span>演奏正确</span>
                     </div>
                   )}
                   <div>
@@ -417,7 +417,7 @@ export default defineComponent({
                   {itemType.value === "integrity" && (
                     <div>
                       <i style={{ background: bgColors.right }}></i>
-                      <span>时值正确</span>
+                      <span>演奏正确</span>
                     </div>
                   )}
                   <div>

src/page-instrument/view-evaluat-report/index.module.less

@@ -67,7 +67,7 @@
         overflow: initial;
         height: initial;
         max-height: initial;
-        transform: translateY(-3%) !important;
+        // transform: translateY(-3%) !important;
         & > #osmdCanvasPage1 {
           top: 0.5rem;
           position: relative !important;

src/state.ts

@@ -733,6 +733,7 @@ const handlePlaying = () => {
 };
 /** 跳转到指定音符开始播放 */
 export const skipNotePlay = async (itemIndex: number, isStart = false) => {
+  console.log('点击音符')
   const item = state.times[itemIndex];
   let itemTime = item.time;
   if (isStart) {
@@ -1073,7 +1074,10 @@ export const handleResetPlay = () => {
   if (state.isAppPlay) {
     audioData.progress = 0
   }
-  resetBaseRate();
+  // 如果是作业模式，不还原速度
+  if (!query.workRecord) {
+    resetBaseRate();
+  }
   resetPlaybackToStart();
   // 如果是暂停, 直接播放
   togglePlay("play");
@@ -1674,7 +1678,6 @@ export const addNoteBBox = (list: any[]) => {
       } : null;
       voicesBBox = currentVoicesBBox;
     }
-    //  todo  连续修止小节bug
     note.bbox = bbox;
   }
 }
@@ -1709,6 +1712,9 @@ export const fillWordColor = () => {
     if ((index === currentNote.repeatIdx && currentNote.repeatIdx + 1 == lyricIndex) || (currentNote.repeatIdx > 0 && currentNote.formatLyricsEntries?.length === 1)) {
       lyric?.classList.add('lyricActive')
     }
+    // if ((index === currentNote.repeatIdx && currentNote.repeatIdx + 1 == lyricIndex)) {
+    //   lyric?.classList.add('lyricActive')
+    // }
   })
 }
 
@@ -1785,7 +1791,7 @@ watch(
         item.querySelector('.vf-custom-bg')?.setAttribute("fill", "#132D4C")
         item.querySelector('.vf-custom-bot')?.setAttribute("fill", "#040D1E")
         // 预备小节
-        if(state.sectionFirst && measureNum === state.sectionFirst.MeasureNumberXML){
+        if(state.sectionFirst && measureNum === state.sectionFirst.MeasureNumberXML && state.section.length === 2){
           item?.querySelector('.vf-custom-bg')?.setAttribute("fill", "#71B8BD")
           item?.querySelector('.vf-custom-bot')?.setAttribute("fill", "#448F9C")
         }

src/style.css

@@ -4,7 +4,11 @@
   box-sizing: border-box;
 }
 img {
-  -webkit-touch-callout: none;
+    -webkit-touch-callout: none;
+    -webkit-user-drag: none;
+    -moz-user-drag: none;
+    -ms-user-drag: none;
+    user-drag: none;
 }
 body {
   -webkit-user-select: none; /* Safari */

src/view/abnormal-pop/icon_btn.svg

@@ -1,31 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="104px" height="32px" viewBox="0 0 104 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>查看报告备份 5</title>
-    <defs>
-        <linearGradient x1="2.90034287%" y1="45.0839481%" x2="100%" y2="54.5984817%" id="linearGradient-1">
-            <stop stop-color="#31C5FF" offset="0%"></stop>
-            <stop stop-color="#1294FF" offset="100%"></stop>
-        </linearGradient>
-        <text id="text-2" font-family="PingFangSC-Semibold, PingFang SC" font-size="14" font-weight="500" fill="#FFFFFF">
-            <tspan x="24.5" y="21">重新连接</tspan>
-        </text>
-        <filter x="-3.6%" y="-5.0%" width="107.1%" height="120.0%" filterUnits="objectBoundingBox" id="filter-3">
-            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0.455105392   0 0 0 0 0.751613451  0 0 0 0.788188374 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
-        </filter>
-    </defs>
-    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="18、练习模式-网络连接失败" transform="translate(-354.000000, -216.000000)">
-            <g id="编组-5备份" transform="translate(316.000000, 126.000000)">
-                <g id="查看报告备份-5" transform="translate(38.000000, 90.000000)">
-                    <rect id="button-normal" fill="url(#linearGradient-1)" x="4.5" y="0" width="96" height="32" rx="16"></rect>
-                    <g id="重新连接" fill="#FFFFFF" fill-opacity="1">
-                        <use filter="url(#filter-3)" xlink:href="#text-2"></use>
-                        <use xlink:href="#text-2"></use>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>

src/view/abnormal-pop/icon_success.svg

@@ -1,113 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>编组 17</title>
-    <defs>
-        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
-            <stop stop-color="#00AD67" offset="0%"></stop>
-            <stop stop-color="#01B776" offset="41.8587195%"></stop>
-            <stop stop-color="#38DCA1" offset="100%"></stop>
-        </linearGradient>
-        <circle id="path-2" cx="9" cy="9" r="9"></circle>
-        <filter x="-1.4%" y="-1.4%" width="102.8%" height="102.8%" filterUnits="objectBoundingBox" id="filter-4">
-            <feOffset dx="0" dy="-0.5" in="SourceAlpha" result="shadowOffsetInner1"></feOffset>
-            <feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
-            <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 0.809030813 0" type="matrix" in="shadowInnerInner1" result="shadowMatrixInner1"></feColorMatrix>
-            <feOffset dx="0" dy="-0.3" in="SourceAlpha" result="shadowOffsetInner2"></feOffset>
-            <feComposite in="shadowOffsetInner2" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner2"></feComposite>
-            <feColorMatrix values="0 0 0 0 0.0941176471   0 0 0 0 0.882352941   0 0 0 0 0.643137255  0 0 0 1 0" type="matrix" in="shadowInnerInner2" result="shadowMatrixInner2"></feColorMatrix>
-            <feMerge>
-                <feMergeNode in="shadowMatrixInner1"></feMergeNode>
-                <feMergeNode in="shadowMatrixInner2"></feMergeNode>
-            </feMerge>
-        </filter>
-        <linearGradient x1="51.0356343%" y1="19.927734%" x2="51.0356343%" y2="77.257697%" id="linearGradient-5">
-            <stop stop-color="#01CD75" offset="0%"></stop>
-            <stop stop-color="#00D889" offset="100%"></stop>
-        </linearGradient>
-        <circle id="path-6" cx="8.1" cy="8.1" r="8.1"></circle>
-        <filter x="-1.5%" y="-4.6%" width="103.1%" height="106.2%" filterUnits="objectBoundingBox" id="filter-8">
-            <feOffset dx="0" dy="-0.5" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 1 0" type="matrix" in="shadowOffsetOuter1" result="shadowMatrixOuter1"></feColorMatrix>
-            <feOffset dx="0" dy="-0.3" in="SourceAlpha" result="shadowOffsetOuter2"></feOffset>
-            <feColorMatrix values="0 0 0 0 0.0431372549   0 0 0 0 0.843137255   0 0 0 0 0.556862745  0 0 0 1 0" type="matrix" in="shadowOffsetOuter2" result="shadowMatrixOuter2"></feColorMatrix>
-            <feMerge>
-                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
-                <feMergeNode in="shadowMatrixOuter2"></feMergeNode>
-            </feMerge>
-        </filter>
-        <linearGradient x1="22.677906%" y1="27.9588842%" x2="32.3549805%" y2="41.7238512%" id="linearGradient-9">
-            <stop stop-color="#A0F4C6" offset="0%"></stop>
-            <stop stop-color="#3DD390" offset="100%"></stop>
-        </linearGradient>
-        <filter x="-51.4%" y="-128.6%" width="202.9%" height="357.1%" filterUnits="objectBoundingBox" id="filter-10">
-            <feGaussianBlur stdDeviation="0.514285714" in="SourceGraphic"></feGaussianBlur>
-        </filter>
-        <linearGradient x1="50%" y1="21.847569%" x2="50%" y2="100%" id="linearGradient-11">
-            <stop stop-color="#5AE1B4" offset="0%"></stop>
-            <stop stop-color="#A9EFDA" offset="100%"></stop>
-        </linearGradient>
-        <linearGradient x1="50%" y1="12.5608239%" x2="50%" y2="100%" id="linearGradient-12">
-            <stop stop-color="#2DF1AD" stop-opacity="0.0682637675" offset="0%"></stop>
-            <stop stop-color="#34E8BD" offset="100%"></stop>
-        </linearGradient>
-        <filter x="-128.6%" y="-107.1%" width="357.1%" height="314.3%" filterUnits="objectBoundingBox" id="filter-13">
-            <feGaussianBlur stdDeviation="1.28571429" in="SourceGraphic"></feGaussianBlur>
-        </filter>
-        <linearGradient x1="22.4201736%" y1="4.76840789e-12%" x2="87.6284479%" y2="89.4580037%" id="linearGradient-14">
-            <stop stop-color="#FFFFFF" offset="0%"></stop>
-            <stop stop-color="#FFFFFF" stop-opacity="0.351535184" offset="99.9754152%"></stop>
-        </linearGradient>
-        <linearGradient x1="70.6044425%" y1="3.79627683e-12%" x2="33.2276295%" y2="92.3941404%" id="linearGradient-15">
-            <stop stop-color="#FFFFFF" offset="0%"></stop>
-            <stop stop-color="#FFFFFF" stop-opacity="0.406004152" offset="99.9754152%"></stop>
-        </linearGradient>
-        <filter x="-27.0%" y="-33.8%" width="154.0%" height="167.5%" filterUnits="objectBoundingBox" id="filter-16">
-            <feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0.613168025   0 0 0 0 0.367900815  0 0 0 1 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
-            <feMerge>
-                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
-                <feMergeNode in="SourceGraphic"></feMergeNode>
-            </feMerge>
-        </filter>
-    </defs>
-    <g id="所有页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="20、练习模式-连接成功" transform="translate(-352.000000, -79.000000)">
-            <g id="tips" transform="translate(340.000000, 70.000000)">
-                <g id="编组-17" transform="translate(12.000000, 9.000000)">
-                    <g id="功能按键/蓝色备份">
-                        <g id="位图备份-10">
-                            <mask id="mask-3" fill="white">
-                                <use xlink:href="#path-2"></use>
-                            </mask>
-                            <g id="蒙版">
-                                <use fill="url(#linearGradient-1)" fill-rule="evenodd" xlink:href="#path-2"></use>
-                                <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
-                            </g>
-                        </g>
-                        <g id="路径-5" transform="translate(0.900000, 0.900000)">
-                            <mask id="mask-7" fill="white">
-                                <use xlink:href="#path-6"></use>
-                            </mask>
-                            <g id="蒙版">
-                                <use fill="black" fill-opacity="1" filter="url(#filter-8)" xlink:href="#path-6"></use>
-                                <use fill="url(#linearGradient-5)" fill-rule="evenodd" xlink:href="#path-6"></use>
-                            </g>
-                            <path d="M0.582032602,13.2047439 C0.364694815,8.55443279 2.31855382,5.43808024 6.44360961,3.85568621 C12.6311933,1.48209518 17.6180597,4.68584962 17.6180597,4.68584962 C15.2252223,0.601547819 11.3229933,-0.955605094 5.9113729,0.0143908806 C0.499752461,0.984386855 -1.2766943,5.38117118 0.582032602,13.2047439 Z" fill="url(#linearGradient-9)" mask="url(#mask-7)"></path>
-                            <path d="M6.63842689,2.02297192 C7.46685401,2.02297192 8.13842689,1.75434277 8.13842689,1.42297192 C8.13842689,1.09160107 7.46685401,0.822971921 6.63842689,0.822971921 C5.80999976,0.822971921 5.13842689,1.09160107 5.13842689,1.42297192 C5.13842689,1.75434277 5.80999976,2.02297192 6.63842689,2.02297192 Z" id="椭圆形" fill="#FFFFFF" opacity="0.699999988" filter="url(#filter-10)" mask="url(#mask-7)" transform="translate(6.638427, 1.422972) rotate(-12.000000) translate(-6.638427, -1.422972) "></path>
-                            <path d="M16.1765407,7.47888329 C16.1920858,7.68388482 16.2,7.89101818 16.2,8.1 C16.2,12.5735065 12.5735065,16.2 8.1,16.2 C3.62649353,16.2 0,12.5735065 0,8.1 C0,7.89101818 0.00791421399,7.68388482 0.0234592778,7.47888329 C0.343093095,11.3506468 3.83695067,14.4 8.1,14.4 C12.3154196,14.4 15.7787392,11.4184052 16.1643224,7.60858279 Z" id="形状结合" fill="url(#linearGradient-11)" mask="url(#mask-7)"></path>
-                            <path d="M16.1019621,6.42328314 C16.1664981,6.77412163 16.2,7.13372803 16.2,7.5 C16.2,11.3107648 12.5735065,14.4 8.1,14.4 C3.62649353,14.4 0,11.3107648 0,7.5 C0,7.13372803 0.0335019421,6.77412163 0.0980378656,6.42328314 C0.701112527,9.58304386 4.05415218,12 8.1,12 C12.1261558,12 15.4662312,9.60651427 16.0939847,6.47055428 Z" id="形状结合" fill="url(#linearGradient-12)" mask="url(#mask-7)"></path>
-                            <path d="M3.89545323,14.7389406 C4.72388035,14.7389406 5.39545323,13.9330532 5.39545323,12.9389406 C5.39545323,11.9448281 4.72388035,11.1389406 3.89545323,11.1389406 C3.0670261,11.1389406 2.39545323,11.9448281 2.39545323,12.9389406 C2.39545323,13.9330532 3.0670261,14.7389406 3.89545323,14.7389406 Z" id="椭圆形" fill="#FFF09B" opacity="0.693498884" filter="url(#filter-13)" mask="url(#mask-7)" transform="translate(3.895453, 12.938941) rotate(-62.000000) translate(-3.895453, -12.938941) "></path>
-                            <path d="M1.46414428,12.2758958 C2.10252007,13.4183461 2.98096657,14.3208436 4.09948378,14.9833884 C5.77725959,15.9772054 7.97504317,16.0253339 7.97504317,16.0253339 C6.63663223,15.8225046 5.40097182,15.3870725 4.26806192,14.7190376 C3.13515203,14.0510027 2.20051282,13.2366221 1.46414428,12.2758958 Z" id="路径-41" fill="#FDFEFC" mask="url(#mask-7)"></path>
-                        </g>
-                        <path d="M12.395268,2.49338426 C12.827241,2.37896207 13.1041845,2.32175097 13.2260986,2.32175097 C13.4089698,2.32175097 14.4501813,3.17242011 15.1400701,3.96565243 C15.5950554,4.48879328 16.0821181,5.34305251 16.6012582,6.52843012 C16.6124997,6.55090354 16.6087873,6.57775004 16.5925926,6.59694833 L16.0834296,7.18962146 L16.0834296,7.18962146 C15.6101302,6.01632982 15.0994139,5.08983934 14.5512809,4.41015003 C14.0031478,3.73046071 13.2844769,3.09153879 12.395268,2.49338426 Z" id="路径-39" fill="url(#linearGradient-14)" opacity="0.800000012"></path>
-                        <path d="M5.20475785,2.26805654 C5.01136352,2.68119984 4.94853738,3.26332093 5.01627944,4.01441981 C4.0241796,4.67959296 3.25425177,5.82324929 2.70649593,7.44538881 C2.19377579,7.19371793 1.88067921,6.85536367 1.76720617,6.43032603 C2.0412279,5.43303633 2.44504907,4.59275748 2.97866967,3.90948949 C3.51229028,3.22622149 4.25431967,2.67907718 5.20475785,2.26805654 Z" id="路径-40" fill="url(#linearGradient-15)" opacity="0.800000012"></path>
-                    </g>
-                    <g id="Path-2" filter="url(#filter-16)" transform="translate(4.000000, 5.500000)" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0.4">
-                        <path d="M9.96121623,0.319521975 L4.56156694,7.66601148 C4.23594706,8.11132951 3.56163188,8.11132951 3.23601201,7.66601148 L0.0387837725,3.31849988 C-0.0586457968,3.18515607 0.0387837725,2.99897791 0.205439615,2.99897791 L1.40792562,2.99897791 C1.66944709,2.99897791 1.91814889,3.12225804 2.07198505,3.33359541 L3.8975075,5.81932542 L7.92801495,0.334617501 C8.08185111,0.125796053 8.32798897,0 8.59207438,0 L9.79456039,0 C9.96121623,0 10.0586458,0.186178159 9.96121623,0.319521975 Z" id="Path"></path>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>

src/view/abnormal-pop/index.module.less

@@ -8,7 +8,7 @@
     width: 100vw;
     height: 100vh;
     overflow: hidden;
-    .close {
+    .closeIcon {
         position: absolute;
         width: 20px;
         height: 20px;
@@ -20,14 +20,14 @@
     }
     .content {
         .title {
-            font-size: 16px;
+            font-size: 18px;
             font-family: PingFangSC, PingFang SC;
-            font-weight: 500;
+            font-weight: 600;
             color: #fff;
             text-align: center;
         }
         .desc {
-            font-size: 14px;
+            font-size: 15px;
             font-family: PingFangSC, PingFang SC;
             font-weight: 400;
             color: rgba(255, 255, 255, 0.8);     
@@ -36,15 +36,18 @@
         }
     }
     .btn {
-        width: 104px;
+        width: 97px;
         height: 32px;
+        &:active{
+            opacity: 0.8;
+        }
     }
 }
 
 .loadColumn {
     display: flex;
     align-items: center;
-    background: rgba(0, 0, 0, 0.8);
+    background: rgba(0, 0, 0, 0.6);
     border-radius: 8px;
     padding: 8px 12px;
     position: relative;
@@ -82,14 +85,20 @@
     .loadingTip {
         font-size: 16px;
         color: #fff;
-        margin: 18px 0;
+        margin: 8px 0 18px;
     }
     .loadingClose {
-        padding: 0 20px;
+        font-weight: 400;
         font-size: 14px;
-        color: #fff;
-        line-height: 30px;
+        color: #FFFFFF;
+        line-height: 32px;
         border: 1px solid rgba(255, 255, 255, 0.7);
         border-radius: 16px;
+        text-align: center;
+        width: 97px;
+        height: 32px;
+        &:active{
+            opacity: 0.8;
+        }
     }
 }

src/view/abnormal-pop/index.tsx

@@ -15,7 +15,7 @@ export default defineComponent({
       <>
         {evaluatingData.socketErrorStatus === 0 && (
           <div class={styles.fraction}>
-            <img class={styles.close} src={popImgs.icon_close} onClick={() => emit("close")} />
+            {evaluatingData.socketErrorStatus === 0 && <img class={styles.closeIcon} src={popImgs.icon_close} onClick={() => emit("close")} />}
             <div class={styles.content}>
               <div class={styles.title}>网络连接失败</div>
               <div class={styles.desc}>请确保网络正常后重新连接</div>
@@ -32,7 +32,8 @@ export default defineComponent({
           // 	<p>正在连接服务器，请稍后…</p>
           // </div>
           <div class={styles.loadingPop}>
-            <Vue3Lottie animationData={animBg} class={styles.loadingIcon}></Vue3Lottie>
+            <img class={styles.loadingIcon} src={animBg} />
+            {/* <Vue3Lottie animationData={animBg} class={styles.loadingIcon}></Vue3Lottie> */}
             <div class={styles.loadingTip}>正在连接中，请稍等…</div>
             <div class={styles.loadingClose} onClick={() => emit("close")}>
               取消连接

src/view/audio-list/index.tsx

@@ -12,6 +12,8 @@ import state, { IPlayState, onEnded, onPlay } from "/src/state";
 import { api_playProgress, api_cloudTimeUpdae, api_cloudplayed, api_remove_cloudplayed, api_remove_cloudTimeUpdae } from "/src/helpers/communication";
 import { evaluatingData } from "/src/view/evaluating";
 import { cloudToggleState } from "/src/helpers/midiPlay"
+import { storeData } from "/src/store";
+import { handleStartTick } from "../tick";
 
 export const audioData = reactive({
 	songEle: null as HTMLAudioElement | null, // 原生
@@ -133,9 +135,13 @@ export const toggleMutePlayAudio = (source: IPlayState, muted: boolean) => {
 /** 切换节拍器音源 */
 export const changeSongSourceByBate = (isDisBate:boolean) => {
 	// isDisBate 为true 切换到不带节拍的，为false 切换到带节拍的
-	const songEleCurrentTime = audioData.songEle?.currentTime || 0
-	const backgroundEleCurrentTime = audioData.backgroundEle?.currentTime || 0
-	const mingSongEleCurrentTime = audioData.mingSongEle?.currentTime || 0
+	let songEleCurrentTime = audioData.songEle?.currentTime || 0
+	let backgroundEleCurrentTime = audioData.backgroundEle?.currentTime || 0
+	let mingSongEleCurrentTime = audioData.mingSongEle?.currentTime || 0
+	// 有一种场景，默认模式没有文件内容的时候，songEle，backgroundEle，mingSongEle都为空，在设置音源之前点击跳转位置，这时候以audioData.progress的时间为准
+	if(!audioData.songEle&&!audioData.backgroundEle&&!audioData.mingSongEle){
+		songEleCurrentTime = backgroundEleCurrentTime = mingSongEleCurrentTime = audioData.progress || 0
+	}
 	if (isDisBate) {
 		if(state.playType === "play"){
 			audioData.songEle = audioData.songCollection.songEle
@@ -223,13 +229,26 @@ export default defineComponent({
 				};
 			});
 		};
+
+		/**
+		 * #11046
+		 * 声音与圆点消失的节点不一致，可能原因是部分安卓手机没有立即播放，所以需要等待有音频进度返回时再播放节拍器
+		 * mp3节拍器的圆点动画
+		 */
+		const tickAnimate = (time: number) => {
+			if (storeData.isApp && state.modeType === 'evaluating' && evaluatingData.needPlayTick && time > 0) {
+				evaluatingData.needPlayTick = false;
+				handleStartTick()
+			}
+		}
+
 		// 监听评测曲谱音频播放进度，返回
 		const progress = (res: any) => {
 			const currentTime = res?.currentTime || res?.content?.currentTime;
-			console.log('app进度时间',currentTime)
 			const total = res?.totalDuration || res?.content?.totalDuration;
 			const time = currentTime / 1000;
 			audioData.progress = time;
+			tickAnimate(time);
 			audioData.songEle && (audioData.songEle.currentTime = time);
 			audioData.backgroundEle && (audioData.backgroundEle.currentTime = time);
 			audioData.mingSongEle && (audioData.mingSongEle.currentTime = time);

src/view/evaluating/index.module.less

@@ -30,4 +30,8 @@
     height: 1px;
     overflow: hidden;
     opacity: 0;
+}
+
+.socketErrorStatus{
+    top: 10vh;
 }

src/view/evaluating/index.tsx

@@ -45,8 +45,8 @@ import AbnormalPop from "../abnormal-pop";
 import { storeData } from "../../store";
 import icon_bg from "../abnormal-pop/icon_bg.svg";
 import icon_close from "../abnormal-pop/icon_close.svg";
-import icon_btn from "../abnormal-pop/icon_btn.svg";
-import icon_success from "../abnormal-pop/icon_success.svg";
+import icon_btn from "../abnormal-pop/icon_btn.png";
+import icon_success from "../abnormal-pop/icon_success.png";
 import { data } from "../../page-instrument/custom-plugins/work-index";
 import { startCountdown } from "/src/page-instrument/evaluat-model/countdown";
 
@@ -112,6 +112,7 @@ export const evaluatingData = reactive({
   endEvaluatingTime: 0, // 调用endEvaluating的时间 
   evaluatSpeed: 0, // 评测记录的速度
   needReplayEvaluat: false, // 手动取消评测，需要自动开始评测
+  needPlayTick: false, // 评测时，mp3节拍器需要等待音频开始播放后再执行播放节拍器的圆点动画
 });
 
 const sendOffsetTime = async (offsetTime: number) => {
@@ -347,12 +348,14 @@ const handleScoreResult = (res?: IPostMessage) => {
       };
       // console.log("🚀 ~ evaluatingData.resultData:", evaluatingData.resultData)
       closeToast();
+      state.isLoading = false
     }
   }
 };
 
 /** 开始评测 */
 export const handleStartBegin = async (preTimes?: number) => {
+  evaluatingData.needPlayTick = false;
 	if (state.isAppPlay) {
 		await api_cloudSetCurrentTime({
 			currentTime: 0,
@@ -397,7 +400,9 @@ export const handleStartBegin = async (preTimes?: number) => {
 					return;
 				}
 			}else{
-				handleStartTick()
+				// handleStartTick()
+        // 需要等待音频返回进度后再执行节拍器圆点动画
+        evaluatingData.needPlayTick = true;
 			}
 		}
 		evaluatingData.isBeginMask = false
@@ -509,12 +514,14 @@ export const handleEndEvaluat = (isComplete = false, endType?: string) => {
     });
   } else {
     if (!endType) {
-      showLoadingToast({
-        message: "评分中",
-        duration: 0,
-        overlay: true,
-        overlayClass: styles.scoreMode,
-      });
+      state.loadingText = "正在评分中，请稍等..."
+      state.isLoading = true
+      // showLoadingToast({
+      //   message: "评分中",
+      //   duration: 0,
+      //   overlay: true,
+      //   overlayClass: styles.scoreMode,
+      // });
     }
   }
   setTimeout(() => {
@@ -812,7 +819,7 @@ export default defineComponent({
           <img src={popImgs.icon_success} />
           <img src={popImgs.icon_close} />
         </div>
-        <Popup teleport="body" closeOnClickOverlay={false} class={["popup-custom", "van-scale"]} transition="van-scale" v-model:show={evaluatingData.socketErrorPop}>
+        <Popup teleport="body" closeOnClickOverlay={false} class={["popup-custom", "van-scale", evaluatingData.socketErrorStatus === 2 && styles.socketErrorStatus]} transition="van-scale" v-model:show={evaluatingData.socketErrorPop} overlay-style={evaluatingData.socketErrorStatus === 2?{ background: "initial" }:{}}>
           <AbnormalPop onConfirm={hanldeConfirmPop} onClose={hanldeClosePop} />
         </Popup>
       </div>

src/view/fingering/fingering-config.ts

@@ -453,16 +453,16 @@ export const subjectFingering = (subjectId: number | string): IFingering => {
         hasTizhi: true,
         id: 2,
       };
-    case "piccolo": // 德式竖笛
-      return {
-        name: "piccolo",
-        direction: "vertical",
-        width: "3rem",
-        orientation: 0,
-        code: "竖笛",
-        hasTizhi: true,
-        id: 37,
-      };
+    // case "piccolo": // 德式竖笛
+    //   return {
+    //     name: "piccolo",
+    //     direction: "vertical",
+    //     width: "3rem",
+    //     orientation: 0,
+    //     code: "竖笛",
+    //     hasTizhi: true,
+    //     id: 37,
+    //   };
     case "hulusi-flute": // 葫芦丝
       return {
         name: "hulusi-flute",

src/view/fingering/index.module.less

@@ -11,7 +11,7 @@
 .vertical {
   position: relative;
   padding: 10px 0 10px 0;
-  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 10px;
+  //box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 10px;
 
   .imgs {
     flex: 1;

src/view/music-score/index.tsx

@@ -118,15 +118,16 @@ export default defineComponent({
 			if (state.isSimplePage) {
 				osmd.EngravingRules.PageTopMargin = state.musicRenderType === 'staff' ? 2 : 4;
 				osmd.EngravingRules.PageTopMarginNarrow = 0;
-				osmd.EngravingRules.PageLeftMargin = 1;
+				osmd.EngravingRules.PageLeftMargin = 3.6;
 				osmd.EngravingRules.PageRightMargin = 0;
 				osmd.EngravingRules.BreathMarkDistance = 0.1; 
 				osmd.EngravingRules.PageBottomMargin = 0;
 			} else {
-				osmd.EngravingRules.PageTopMargin = state.isEvaluatReport && storeData.isApp ? 10 : state.isEvaluatReport ? 7 : 3; // 顶部间距
+				// osmd.EngravingRules.PageTopMargin = state.isEvaluatReport ? 7 : 3; // 顶部间距
+				osmd.EngravingRules.PageTopMargin = 3;
 				osmd.EngravingRules.PageTopMarginNarrow = 3;
-				osmd.EngravingRules.PageLeftMargin = 2;
-				osmd.EngravingRules.PageRightMargin = 2;
+				osmd.EngravingRules.PageLeftMargin = 3.6;
+				osmd.EngravingRules.PageRightMargin = 3;
 				osmd.EngravingRules.BreathMarkDistance = 0.1; // 呼吸标记距离音符的位置，百分比
 				osmd.EngravingRules.PageBottomMargin = state.isSingleLine ? 2 : 18;
 			}
@@ -137,6 +138,10 @@ export default defineComponent({
 				(window as any).sett = {
 					keySignature: true,
 				};
+			} else {
+				(window as any).sett = {
+					keySignature: false,
+				};
 			}
 			osmd.EngravingRules.DYMusicScoreId = state.examSongId || ''
 			osmd.EngravingRules.DYCustomRepeatCount = state.maxLyricNum || 0;
@@ -160,7 +165,7 @@ export default defineComponent({
 		};
 		onMounted(async () => {
 			getContainerWidth();
-			setRenderType();
+			//setRenderType();
 			await getXML();
 			await init();
 			musicData.isRenderLoading = false;
@@ -199,7 +204,7 @@ export default defineComponent({
 			// 在下一帧再执行，确保出现loading
 			requestAnimationFrame(async ()=>{
 				getContainerWidth();
-				setRenderType();
+				//setRenderType();
 				await getXML();
 				await init();
 				musicData.isRenderLoading = false;
@@ -220,7 +225,7 @@ export default defineComponent({
 					isInTheGradualRange.value && styles.inGradualRange,
 					state.musicRenderType == EnumMusicRenderType.staff ? "staff" : "jianpuTone",
 					state.isSingleLine && "singleLineMusicBox",
-					(!state.isCreateImg && state.musicRenderType === EnumMusicRenderType.staff) ? "blueMusicXml" : ""
+					(!state.isCreateImg && !state.isPreView && state.musicRenderType === EnumMusicRenderType.staff) ? "blueMusicXml" : ""
 				]}
 			>
 				{slots.default?.()}

src/view/plugins/move-music-score/index.module.less

@@ -27,7 +27,7 @@
     border-radius: 4px;
     display: flex;
     flex-direction: column;
-    z-index: 10;
+    z-index: 9999;
     backdrop-filter: blur(10px);
     &>div,
     &>button {

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

@@ -9,6 +9,18 @@
         box-shadow: 0px 4px 0px 0px #5EA2B9;
         .pickerBox{
             background: #E3F3F5;
+            .picker{
+              :global{
+                .van-picker__mask {
+                  background-image:linear-gradient( rgba(227,243,245,0.8), rgba(227,243,245,0.8)),linear-gradient( rgba(227,243,245,0.8), rgba(227,243,245,0.8));
+                }
+                .van-picker__columns{
+                  .van-picker__frame{
+                    border-color: #CFE6EC;
+                  }
+                }
+              }
+            }
         }
     }
 }
@@ -22,6 +34,13 @@
         box-shadow: 0px 4px 0px 0px #759CE4;
         .pickerBox{
             background: #EAF1FB;
+            .picker{
+              :global{
+                .van-picker__mask {
+                  background-image:linear-gradient( rgba(234,241,251,0.8), rgba(234,241,251,0.8)),linear-gradient( rgba(234,241,251,0.8), rgba(234,241,251,0.8));
+                }
+              }
+            }
         }
     }
 }
@@ -61,6 +80,7 @@
       height: 100%;
       background: #EAF2FB;
       border-radius: 12px;
+      overflow: hidden;
     }
   }
   .picker {
@@ -71,10 +91,14 @@
     align-items: center;
     :global{
       .van-picker__mask {
-        background-image: initial;
+        background-image:linear-gradient( rgba(234,242,251,0.8), rgba(234,242,251,0.8)),linear-gradient( rgba(234,242,251,0.8), rgba(234,242,251,0.8));
       }
       .van-picker__columns{
         width: 100%;
+        .van-picker__frame{
+          border-top: 1px solid #D5E0ED;
+          border-bottom: 1px solid #D5E0ED;
+        }
       }
       .van-picker-column__wrapper{
         padding: 0 16px;
@@ -82,12 +106,6 @@
       .van-picker-column__item{
         font-weight: 600;
         font-size: 15px;
-        color: rgba(0,0,0,0.2);
-        &.van-picker-column__item--selected{
-          border-top: 1px solid #D5E0ED;
-          border-bottom: 1px solid #D5E0ED;
-          color: rgb(0,0,0);
-        }
       }
     }
   }

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

@@ -67,7 +67,8 @@ export default defineComponent({
               v-model={selValues.value}
               showToolbar={false}
               columns={columns.value}
-              visibleItemCount={Math.ceil(document.body.clientHeight / 40 / 3)}
+              visible-option-num={5}
+              option-height={"1.06666rem"}
               onChange={(row) => {
                 console.log(1111,'选择的索引', row)
                 if (!partIndexChanged.value) partIndexChanged.value = true

src/view/selection/index.tsx

@@ -208,7 +208,7 @@ export default defineComponent({
 							return stave.MeasureNumberXML === actualEndIndex
 						})
 						return currItem && {
-							left: parseFloat(currItem.staveBox.left)+parseFloat(currItem.staveBox.width)+"px",
+							left: parseFloat(currItem.staveBox.left)+parseFloat(currItem.staveBox.width)-2 +"px",
 							top: currItem.staveBox.top,
 							height: selectData.measureHeight + 'px'
 						}
@@ -336,7 +336,7 @@ export default defineComponent({
 					sectionPosData.value.map((item,index) =>{
 						return (
 							item && <div class={styles.selectBox} style={item}>
-								<div class={[styles.selectHandle,index>0&&styles.selectHandleRight,state.playState==="play"&&styles.playIng]} onClick={()=>{
+								<div class={[styles.selectHandle,index>0&&styles.selectHandleRight,(state.playState==="play" || query.workRecord)&&styles.playIng]} onClick={()=>{
 									// 如果选择了2个 删除左边的时候
 									if(state.section.length===2&&index === 0){
 										state.section = []

src/view/tick/index.tsx

@@ -41,7 +41,14 @@ const tickPlayCb = (i: any, resolve: any, source: any) => {
 		resolve(i)
 		return
 	};
-	tickData.index++;
+	// 第一个点，延迟100ms再消失
+	if (i === 0) {
+		setTimeout(() => {
+			tickData.index++;
+		}, 100);
+	} else {
+		tickData.index++;
+	}
 	// 当系统节拍器才播放声音，跟练模式需要播放系统节拍器的声音，评测模式，如果没有伴奏，也需要播放系统节拍器的声音
 	if (source && (isUseSystemBeat.value || state.modeType === 'follow' || (state.modeType === 'evaluating' && !state.accompany)) ) {
 		const beatVolume = state.setting.beatVolume / 100

vite.config.ts

@@ -76,7 +76,7 @@ export default defineConfig({
         // target: "https://kt.colexiu.com",
         // target: "https://test.lexiaoya.cn",
         // target: "https://kt.colexiu.com",
-        // target: "https://dev.resource.colexiu.com", // 内容平台开发环境，内容平台开发，需在url链接上加上isCbs=true
+        //target: "https://dev.resource.colexiu.com", // 内容平台开发环境，内容平台开发，需在url链接上加上isCbs=true
         target: "https://test.kt.colexiu.com",
         //target: "https://mec.colexiu.com",
         changeOrigin: true,