Merge branch 'online'

src/page-instrument/view-product-img/index.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, onMounted, reactive } from "vue";
+import { defineComponent, nextTick, onMounted, reactive } from "vue";
 import state, { EnumMusicRenderType } from "/src/state";
 import MusicScore from "../../view/music-score";
 import styles from "./index.module.less";
@@ -14,6 +14,7 @@ export default defineComponent({
 		const detailData = reactive({
 			isLoading: true,
 			isProductLoading: false,
+			step: 0,
 			product: [
 				{
 					state: false,
@@ -40,26 +41,33 @@ export default defineComponent({
 			(window as any).appName = "colexiu";
 			state.xmlUrl = query.xmlUrl;
 			//课堂乐器,默认简谱
-			state.musicRenderType = EnumMusicRenderType.staff;
-			detailData.isLoading = false;
+			state.musicRenderType = detailData.product[detailData.step].type;
+
 			showLoadingToast({ message: "生成中", duration: 0 });
+			setTimeout(() => {
+				detailData.isLoading = false;
+			}, 500);
 		});
 
 		/** 渲染完成 */
 		const handleRendered = async () => {
-			const item = detailData.product.find((item) => item.type === state.musicRenderType);
-			if (item) {
-				item.state = true;
-				item.base64 = await downPng();
-			}
-			const nextItem = detailData.product.find((item: any) => !item.state);
-			if (!item && nextItem) {
-				nextItem.state = true;
-			}
-			if (nextItem) {
-				state.musicRenderType = nextItem.type;
-				detailData.isLoading = true;
-				setTimeout(() => (detailData.isLoading = false), 500);
+			try {
+				console.log(JSON.parse(JSON.stringify(detailData.product)));
+			} catch (error) {}
+			detailData.product[detailData.step].state = true;
+			detailData.product[detailData.step].base64 = await downPng();
+
+			detailData.step += 1;
+
+			if (detailData.step !== detailData.product.length - 1) {
+				//课堂乐器,默认简谱
+				state.musicRenderType = detailData.product[detailData.step].type;
+				nextTick(() => {
+					detailData.isLoading = true;
+					setTimeout(() => {
+						detailData.isLoading = false;
+					}, 500);
+				});
 				return;
 			}