Browse Source

feat: 设置中增加放大谱面功能

TIANYONG 5 months ago
parent
commit
9d8e848027

+ 1 - 1
osmd-extended

@@ -1 +1 @@
-Subproject commit 4282eb7cbebffd4427350db176c3de0f37bf0fc4
+Subproject commit 3689e3c4aac7182ec7cc8ed24b0953dd37c41227

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

@@ -219,6 +219,11 @@
                         }
                     }
                 }
+                .speBox {
+                    >div {
+                        width: 48px;
+                    }
+                }
                 .frequency{
                     display: flex;
                     align-items: center;

+ 26 - 1
src/page-instrument/header-top/settting/index.tsx

@@ -25,6 +25,7 @@ export default defineComponent({
 			screenModelShow: false, // 投屏帮助
 			recommendationShow: false, // 建议
 		});
+        const zoomList = [{name:'原始',value: 0.8},{name:'1.25x',value: 1.25},{name:'1.5x',value: 1.5},{name:'1.75x',value: 1.75}] 
 		const parentClassName = "recommenBoxClass_drag";
 		const userId = storeData.user?.id ? String(storeData.user?.id) : "";
 		const positionInfo =
@@ -252,7 +253,31 @@ export default defineComponent({
                                 </div>
                             </div> : null
                         }
-
+                        {
+                            state.isCbsView ? 
+                            <div class={styles.cellBox}>
+                                <div class={styles.tit}>放大谱面</div>
+                                <div class={[styles.radioBox, styles.speBox]}>
+                                    {
+                                        zoomList.map(item=>{
+                                            return <div class={ state.zoom===item.value && styles.active } onClick={ async ()=>{ 
+                                                if(state.zoom === item.value){
+                                                    return
+                                                }
+                                                await checkMoveNoSave();
+                                                headTopData.settingMode = false
+                                                // resetRenderMusicScore(state.musicRenderType)
+                                                const _time = setTimeout(() => {
+                                                    state.zoom = item.value as any
+                                                    clearTimeout(_time)
+                                                    refreshMusicSvg();
+                                                }, 100);
+                                            } }>{item.name}</div>
+                                        })
+                                    }
+                                </div>
+                            </div> : null
+                        }
                         <div class={styles.cellBtnBox}>
                             <img  src={headImg("tpbz.png")} onClick={() => (helperData.screenModelShow = true)} />
                             {