Browse Source

Merge branch 'feature-tianyong-newVersion' of http://git.dayaedu.com/liushengqiang/music-score into kt-dev

TIANYONG 1 năm trước cách đây
mục cha
commit
c662c7cc91

+ 24 - 0
src/helpers/communication.ts

@@ -504,4 +504,28 @@ export const api_cancelDelayCheck = (callback: any) => {
 /** 监听延迟检测成功的回调 */
 export const api_finishDelayCheck = (callback: any) => {
 	listenerMessage("finishDelayCheck", callback);
+};
+
+/** 监听APP播放进度 */
+export const simple_playProgress = (callback: any) => {
+	listenerMessage("api_playProgress", callback);
+};
+/** 卸载播放 */
+export const simple_remove_playProgress = (callback: any) => {
+	removeListenerMessage("api_playProgress", callback);
+};
+
+/** 监听APP播放开始 */
+export const simple_play = (callback: any) => {
+	listenerMessage("api_play", callback);
+};
+
+/** 监听APP播放暂停 */
+export const simple_paused = (callback: any) => {
+	listenerMessage("api_paused", callback);
+};
+
+/** 监听APP拖动进度 */
+export const simple_updateProgress = (callback: any) => {
+	listenerMessage("api_updateProgress", callback);
 };

+ 1 - 1
src/page-instrument/App.tsx

@@ -18,7 +18,7 @@ export default defineComponent({
     };
     const setUser = async () => {
       try {
-        const res = query.isCbs ? { code: 200, data: {} } : await getUserInfo();
+        const res = query.isCbs || window.location.href.includes("simple-detail") ? { code: 200, data: {} } : await getUserInfo();
         if (res?.code === 5000) {
           const browserInfo = browser();
           showToast(res.message);

+ 1 - 2
src/page-instrument/simple-detail/index.module.less

@@ -14,13 +14,12 @@
     width: 100vw;
     height: auto;
     overflow: hidden;
-    overflow-y: auto;
     --header-height: 62px;
     // background: var(--container-background);
     background: transparent;
 
     .container {
-        margin: 0 10px;
+        margin: 0;
         border-radius: 10px;
     }
     :global{

+ 56 - 19
src/page-instrument/simple-detail/index.tsx

@@ -8,7 +8,7 @@ import store from "store";
 import { formateTimes } from "../../helpers/formateMusic";
 import { setCustomGradual, setCustomNoteRealValue } from "/src/helpers/customMusicScore"
 import { initSmoothAnimation, smoothAnimationState, destroySmoothAnimation, moveSmoothAnimationByPlayTime } from "../view-detail/smoothAnimation";
-import { api_playProgress } from "/src/helpers/communication";
+import { api_playProgress, api_cloudLoading, simple_playProgress, simple_remove_playProgress, simple_play, simple_paused, simple_updateProgress } from "/src/helpers/communication";
 
 export default defineComponent({
 	name: "simple-detail",
@@ -22,31 +22,60 @@ export default defineComponent({
 		});
 
 		const communicateCb = (res: any) => {
+			// console.log('h5消息',res)
+			// 开始播放
+			if (res?.data?.api === "api_play") {
+				console.log('开始播放')
+				state.playState = 'play';
+				setStep();
+			}
+			// 暂停播放
+			if (res?.data?.api === "api_paused") {
+				console.log('暂停播放')
+				state.playState = 'paused';
+			}
+			// 暂停状态下,拖动进度
+			if (res?.data?.api === "api_updateProgress") {
+				console.log('拖动的进度')
+				if (state.playState === 'paused') {
+					detailData.currentTime = res?.data?.data ? res?.data?.data : detailData.currentTime;
+					handlePlaying();
+				}
+			}
 			// 播放进度
-			if (res?.data?.api === "playProgress") {
+			if (res?.data?.api === "api_playProgress") {
 				if (res?.data.data) {
-					state.playState = 'play';
-					console.log(res.data)
+					if (res?.data.data < detailData.currentTime) {
+						state.activeNoteIndex = 0
+					}
+					detailData.currentTime = res?.data.data
 				}
 			}
 		};
 		// 监听评测曲谱音频播放进度,返回
 		const progress = (res: any) => {
-			detailData.currentTime = res?.currentTime || res?.content?.currentTime;
-			detailData.totalTime = res?.totalDuration || res?.content?.totalDuration;
-			const time = detailData.currentTime / 1000;
-			if (res?.content?.totalDuration > 1000 && detailData.currentTime >= detailData.totalTime) {
-				// 播放结束
+			const currentTime = res?.currentTime || res?.content?.currentTime;
+			if (currentTime) {
+				if (currentTime < detailData.currentTime) {
+					state.activeNoteIndex = 0
+				}
+				detailData.currentTime = currentTime
 			}
+			
 		};
 
+		const simplePlay = () => {
+			state.playState = 'play';
+			setStep();
+		}
 		onMounted(async () => {
 			const id = query.id || '';
-			await getMusicDetail(id);
+			state.isSimplePage = true;
+			await getMusicDetail(id, 'open');
 			detailData.isLoading = false;
 			state.isSingleLine = true;
-			state.isSimplePage = true;
-			api_playProgress(progress);
+			simple_playProgress(progress);
+			simple_play(simplePlay);
 			window.addEventListener("message", communicateCb);
 		});
 
@@ -56,7 +85,7 @@ export default defineComponent({
 		});
 		/** 渲染完成 */
 		const handleRendered = async (osmd: any) => {
-			console.log('渲染完成')
+			const svgHeight = document.getElementById('scrollContainer')?.getBoundingClientRect().height;
 			state.osmd = osmd;
 			// 没有设置速度使用读取的速度
 			if (state.originSpeed === 0) {
@@ -76,23 +105,31 @@ export default defineComponent({
 			// 一行谱创建 动画
 			initSmoothAnimation();
 			//destroySmoothAnimation();
-			smoothAnimationState.isShow.value = false;
-			state.playState = 'play';
-			setStep();
+			//smoothAnimationState.isShow.value = false;
+			api_cloudLoading();
+			console.log('渲染完成',svgHeight)
+			window.parent.postMessage(
+				{
+				  api: "api_musicPage",
+				  height: svgHeight
+				},
+				"*"
+			);			
+			// state.playState = 'play';
+			// setStep();
 		};
 		/**
 		 * 播放一直触发的事件
 		 */
 		const handlePlaying = () => {
-			detailData.currentTime += 0.03;
+			//detailData.currentTime += 0.03
 			const currentTime = detailData.currentTime;
-			const duration = detailData.totalTime;
-			state.playProgress = (currentTime / duration) * 100;
 			// console.log('👀~播放进度',currentTime)
 			let item = getNote(currentTime);
 			if (item) {
 				gotoNext(item);
 			}
+			state.activeNoteIndex = item?.i || 0
 			// 一行谱,需要滚动小节
 			if (state.isSingleLine) {
 				moveSmoothAnimationByPlayTime(currentTime)

+ 4 - 4
src/state.ts

@@ -1202,8 +1202,8 @@ export const evaluatCreateMusicPlayer = () => {
 
 
 /** 获取内容平台的接口详情并初始化state信息 */
-export const getMusicDetail = async (id: string) => {
-  const res = await getMusicSheetDetail(id);
+export const getMusicDetail = async (id: string, type?: string) => {
+  const res = await getMusicSheetDetail(id, type);
   if (res?.code === 200) {
     await getMusicInfo(res)
   }
@@ -1215,7 +1215,7 @@ const getMusicInfo = async (res: any) => {
   downloadXmlStr.value = xmlString //给musice-score 赋值xmlString 以免加载2次
   const tracks = xmlToTracks(xmlString) //获取声轨列表
   let index = query["part-index"] ? parseInt(query["part-index"]) : 0
-  const musicObj = initMusicSource(res.data, tracks[index]) //当前part-index找不到声源的时候以第一个为准
+  const musicObj = state.isSimplePage ? {} : initMusicSource(res.data, tracks[index]) //当前part-index找不到声源的时候以第一个为准
   index = tracks.findIndex(item => {  // 筛选出当前的index
     return item === musicObj?.track
   })
@@ -1295,7 +1295,7 @@ const setState = (data: any, index: number) => {
   state.detailId = data.bizId;
   state.xmlUrl = data.xmlFileUrl;
   state.paymentType = data.paymentType
-  state.partIndex = index;
+  state.partIndex = index >= 0 ? index : 0;
   state.trackId = data.track;
   state.subjectId = data.subjectIds ? data.subjectIds.split(',')?.[0] : 0;
   // 声部code

+ 3 - 2
src/utils/baseApi.ts

@@ -8,8 +8,9 @@ import request from "./request";
 // };
 
 /** 获取内容平台的曲谱详情 */
-export const getMusicSheetDetail = (sysMusicScoreId: string) => {
-  return request.get("/musicSheet/cbsDetail/" + sysMusicScoreId);
+export const getMusicSheetDetail = (sysMusicScoreId: string, type?: string) => {
+  const url = type === 'open' ? `/open/musicSheet/cbsDetail/${sysMusicScoreId}` : `/musicSheet/cbsDetail/${sysMusicScoreId}`;
+  return request.get(url, { noToken: type === 'open' ? true : false });
 };
 
 /** 生成图片 */

+ 1 - 1
src/utils/request.ts

@@ -51,7 +51,7 @@ request.interceptors.request.use(
 		const Authorization = getToken();
 		const authHeaders: any = {};
 		// 内容平台的接口不需要传token,需要传签名
-		if (Authorization && !options.isContentCenter) {
+		if (Authorization && !options.isContentCenter && !options.noToken) {
 			authHeaders.Authorization = Authorization;
 		}
 		return {

+ 10 - 0
src/view/evaluating/index.tsx

@@ -33,6 +33,7 @@ import {
 	api_cloudSetCurrentTime,
 	api_cloudChangeSpeed,
 	api_startDelayCheck,
+	api_closeDelayCheck,
 } from "/src/helpers/communication";
 import state, {
 	IPlayState,
@@ -731,6 +732,15 @@ export default defineComponent({
 				}
 			}
 		);
+		watch(
+			() => evaluatingData.socketErrorPop,
+			() => {
+				if (evaluatingData.socketErrorPop && state.setting.soundEffect) {
+					// 监听到socket状态异常,需要关闭延迟检测
+					api_closeDelayCheck({});
+				}	
+			}
+		);
 		onMounted(() => {
 			resetPlaybackToStart();
 			hanlde_record();

+ 16 - 7
src/view/music-score/index.tsx

@@ -106,18 +106,27 @@ export default defineComponent({
 			// osmd.EngravingRules.PageRightMargin = state.isSingleLine ? (window.innerWidth+200)/10 : 2;
 			// osmd.EngravingRules.FixedMeasureWidth = state.isSingleLine ? true : false; // 是否固定小节的宽度(小节同一宽度渲染)
 			//osmd.EngravingRules.PageTopMargin = state.platform === IPlatform.PC ? 0 : 1; // 老师端顶部间距
-			osmd.EngravingRules.PageTopMargin = 2; // 老师端顶部间距
-			osmd.EngravingRules.PageTopMarginNarrow = 3;
-			osmd.EngravingRules.PageLeftMargin = 2;
-			osmd.EngravingRules.PageRightMargin = 2;
-			osmd.EngravingRules.BreathMarkDistance = 0.1; // 呼吸标记距离音符的位置,百分比
 			// 老师端上课页面,左右两边有功能按钮,所以左右边距需要加大
 			// if (state.isAttendClass && state.platform === IPlatform.PC) {
 			// 	osmd.EngravingRules.PageLeftMargin = 7;
 			// 	osmd.EngravingRules.PageRightMargin = 7;
 			// }
 			//osmd.EngravingRules.PageBottomMargin = state.platform === IPlatform.PC ? 1 : 2;
-			osmd.EngravingRules.PageBottomMargin = state.isSingleLine ? 2 : 18;
+			if (state.isSimplePage) {
+				osmd.EngravingRules.PageTopMargin = 0;
+				osmd.EngravingRules.PageTopMarginNarrow = 0;
+				osmd.EngravingRules.PageLeftMargin = 0;
+				osmd.EngravingRules.PageRightMargin = 0;
+				osmd.EngravingRules.BreathMarkDistance = 0.1; 
+				osmd.EngravingRules.PageBottomMargin = 0;
+			} else {
+				osmd.EngravingRules.PageTopMargin = 2; // 老师端顶部间距
+				osmd.EngravingRules.PageTopMarginNarrow = 3;
+				osmd.EngravingRules.PageLeftMargin = 2;
+				osmd.EngravingRules.PageRightMargin = 2;
+				osmd.EngravingRules.BreathMarkDistance = 0.1; // 呼吸标记距离音符的位置,百分比
+				osmd.EngravingRules.PageBottomMargin = state.isSingleLine ? 2 : 18;
+			}
 			osmd.EngravingRules.DYMusicScoreType =
 				state.musicRenderType === EnumMusicRenderType.staff ? "staff" : "jianpu";
 			// 如果为固定调,需要加入全局
@@ -129,7 +138,7 @@ export default defineComponent({
 			osmd.EngravingRules.DYMusicScoreId = state.examSongId || ''
 			osmd.EngravingRules.DYCustomRepeatCount = state.maxLyricNum || 0;
 			await osmd.load(musicData.score);
-			osmd.zoom = state.zoom;
+			osmd.zoom = state.isSimplePage ? 0.6 : state.zoom;
 			osmd.render();
 			console.log("🚀 ~ osmd:", osmd)
 			emit("rendered", osmd);

+ 1 - 1
vite.config.ts

@@ -78,7 +78,7 @@ export default defineConfig({
         // target: "https://kt.colexiu.com",
         // target: "https://test.resource.colexiu.com", // 内容平台开发环境,内容平台开发,需在url链接上加上isCbs=true
         //target: "https://dev.resource.colexiu.com",
-        target: "https://test.kt.colexiu.com",
+        target: "https://dev.kt.colexiu.com",
         //target: "https://mec.colexiu.com",
         changeOrigin: true,
         rewrite: (path) => path.replace(/^\/instrument/, ""),