feat: 单行谱嵌入H5联调

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);

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

@@ -16,7 +16,7 @@
     overflow: hidden;
     --header-height: 62px;
     // background: var(--container-background);
-    background: lightcoral;
+    background: transparent;
 
     .container {
         margin: 0;

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

@@ -22,11 +22,24 @@ 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 === "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
 				}
 			}
 		};
@@ -42,10 +55,10 @@ export default defineComponent({
 
 		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);
 			window.addEventListener("message", communicateCb);
 		});
@@ -92,15 +105,13 @@ export default defineComponent({
 		 * 播放一直触发的事件
 		 */
 		const handlePlaying = () => {
-			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
 			// 一行谱，需要滚动小节
 			if (state.isSingleLine) {
 				moveSmoothAnimationByPlayTime(currentTime)

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
   })

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);
 };
 
 /** 生成图片 */

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/, ""),