Merge branch 'feature-wxl-newVersion' into ktyq-test-new

src/page-instrument/custom-plugins/guide-driver/index.tsx

@@ -1122,12 +1122,17 @@ export const EvaluatingReportDriver = defineComponent({
               title: "",
               description: "",
               popoverClass: "popoverClass popoverClassReport2",
-              align: "start",
+              align: "end",
               side: "bottom",
               nextBtnText: "下一步 (1/2)",
               showButtons: ["next"],
               onPopoverRender: (popover: PopoverDOM, options: { config: Config; state: State }) => {
-                driverInitialPosition(popover, options);
+                options.config.stageRadius = 12;
+                options.config.stagePadding = 0;
+                try {
+                  const rect = options.state.activeElement?.getBoundingClientRect();
+                  popover.wrapper.style.marginLeft = ((rect?.width || 0) / 2) * -1 + 4 + "px";
+                } catch {}
               },
             },
           },
@@ -1167,12 +1172,17 @@ export const EvaluatingReportDriver = defineComponent({
               title: "",
               description: "",
               popoverClass: "popoverClass popoverClassReport2 popoverClose",
-              align: "start",
+              align: "end",
               side: "bottom",
               doneBtnText: "完成",
               showButtons: ["next"],
               onPopoverRender: (popover: PopoverDOM, options: { config: Config; state: State }) => {
-                driverInitialPosition(popover, options);
+                options.config.stageRadius = 12;
+                options.config.stagePadding = 0;
+                try {
+                  const rect = options.state.activeElement?.getBoundingClientRect();
+                  popover.wrapper.style.marginLeft = ((rect?.width || 0) / 2) * -1 + 4 + "px";
+                } catch {}
               },
               onPrevClick: () => {
                 driverObj.drive(0);
@@ -1208,12 +1218,17 @@ export const EvaluatingReportDriver = defineComponent({
             title: "",
             description: "",
             popoverClass: "popoverClass popoverClassReport2",
-            align: "start",
+            align: "end",
             side: "bottom",
             nextBtnText: `下一步 (2/${count})`,
             showButtons: ["next"],
             onPopoverRender: (popover: PopoverDOM, options: { config: Config; state: State }) => {
-              driverInitialPosition(popover, options);
+              options.config.stageRadius = 12;
+              options.config.stagePadding = 0;
+              try {
+                const rect = options.state.activeElement?.getBoundingClientRect();
+                popover.wrapper.style.marginLeft = ((rect?.width || 0) / 2) * -1 + 4 + "px";
+              } catch {}
             },
           },
         },

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

@@ -63,25 +63,19 @@
     .title {
         width: 210px;
         margin-left: 10px;
+        position: relative;
 
-        &.isMusicList {
-            :global {
-                .van-notice-bar {
-                    &::after {
-                        max-width: calc(216px + 16px);
-                        position: absolute;
-                        top: 0;
-                        left: 0;
-                        content: "";
-                        width: calc(var(--noticeBarWidth, 100%) + 16px);
-                        height: 100%;
-                        background: url("./image/sj.png") no-repeat;
-                        background-size: 9px 6px;
-                        background-position: center right;
-                    }
-
-                }
-            }
+        .symbolNote {
+            max-width: calc(216px + 16px);
+            position: absolute;
+            top: 0;
+            left: 0;
+            content: "";
+            width: calc(var(--noticeBarWidth, 100%) + 16px);
+            height: 100%;
+            background: url("./image/sj.png") no-repeat;
+            background-size: 9px 6px;
+            background-position: center right;
         }
 
         :global {

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

@@ -98,7 +98,7 @@ export const headTopData = reactive({
   // 改变模式之前的状态
   oldPlayType: "play",
   // 记录切换模式前的状态
-  oldModeType: "practise" as "practise" | "follow" | "evaluating"
+  oldModeType: "practise" as "practise" | "follow" | "evaluating",
 });
 
 export const headData = reactive({
@@ -643,59 +643,63 @@ export default defineComponent({
           }}
         >
           {/* 返回和标题 */}
-          {
-            !(state.playState == "play" || followData.start || evaluatingData.startBegin) &&
-              <div id="noticeBarRollDom" class={styles.headTopLeftBox}>
-                <img src={iconBack} class={['headTopBackBtn', styles.img, !headTopData.showBack && styles.hidenBack]} onClick={handleBack} />
-                {
-                  smoothAnimationState.isShow.value ?
-                    <div 
-                      style={
-                        noticeBarWidth.value ? {
-                          "--noticeBarWidth":noticeBarWidth.value + "px"
-                        } : {}
-                      }
-                      class={[styles.title,isMusicList.value && styles.isMusicList, "driver-8"]} 
-                      onClick={()=>{
-                        isMusicList.value && (musicListShow.value = true)
-                      }}>
-                        <NoticeBar
-                          text={state.examSongName}
-                          background="none"
-                        />
-                    </div> :
-                    isMusicList.value &&
-                    <img src={listImg} class={[styles.img, styles.listImg, "driver-8"]} onClick={()=>{
-                      musicListShow.value = true
-                    }} />
-                }
-              </div>
-          }
+          {!(state.playState == "play" || followData.start || evaluatingData.startBegin) && (
+            <div id="noticeBarRollDom" class={styles.headTopLeftBox}>
+              <img src={iconBack} class={["headTopBackBtn", styles.img, !headTopData.showBack && styles.hidenBack]} onClick={handleBack} />
+              {smoothAnimationState.isShow.value ? (
+                <div
+                  style={
+                    noticeBarWidth.value
+                      ? {
+                          "--noticeBarWidth": noticeBarWidth.value + "px",
+                        }
+                      : {}
+                  }
+                  class={[styles.title, "headeTopTitleBtn"]}
+                  onClick={() => {
+                    isMusicList.value && (musicListShow.value = true);
+                  }}
+                >
+                  {isMusicList.value && <div class={[styles.symbolNote, "driver-8"]}></div>}
+                  <NoticeBar text={state.examSongName} background="none" />
+                </div>
+              ) : (
+                isMusicList.value && (
+                  <img
+                    src={listImg}
+                    class={[styles.img, styles.listImg, "driver-8"]}
+                    onClick={() => {
+                      musicListShow.value = true;
+                    }}
+                  />
+                )
+              )}
+            </div>
+          )}
           {/* 模式切换 */}
           {
-            <div 
+            <div
               id={state.platform === IPlatform.PC ? "teacherTop-0" : "studnetT-0"}
               style={{ display: toggleBtn.value.display ? "" : "none" }}
-              class={["driver-9", styles.modeChangeBox, toggleBtn.value.disabled && styles.disabled]} 
+              class={["driver-9", styles.modeChangeBox, toggleBtn.value.disabled && styles.disabled]}
               onClick={() => {
-                  headTopData.oldModeType = state.modeType
-                  handleRessetState();
-                  headTopData.modeType = "init";
+                headTopData.oldModeType = state.modeType;
+                handleRessetState();
+                headTopData.modeType = "init";
               }}
             >
               <img class={styles.img} src={iconMode} />
-              <div class={styles.title}>{state.modeType==="practise" ? '练习模式' : state.modeType==="follow" ? "跟练模式" : state.modeType==="evaluating" ? "评测模式" : ""}</div>
+              <div class={styles.title}>{state.modeType === "practise" ? "练习模式" : state.modeType === "follow" ? "跟练模式" : state.modeType === "evaluating" ? "评测模式" : ""}</div>
             </div>
           }
 
           {/* 模式提醒 */}
-          {
-            state.modeType === "practise" &&
-              <div class={[styles.modeWarn, "practiseModeWarn", state.platform === IPlatform.PC && state.musicScoreBtnDirection === "left" ? styles.modeWarnRight : ""]}>
-                <img src={state.playType === "play" ? headImg("perform1.png") : headImg("sing1.png")} />
-                <div>{state.playType === "play" ? "演奏场景" : "演唱场景"}</div>
-              </div>
-          }
+          {state.modeType === "practise" && (
+            <div class={[styles.modeWarn, "practiseModeWarn", state.platform === IPlatform.PC && state.musicScoreBtnDirection === "left" ? styles.modeWarnRight : ""]}>
+              <img src={state.playType === "play" ? headImg("perform1.png") : headImg("sing1.png")} />
+              <div>{state.playType === "play" ? "演奏场景" : "演唱场景"}</div>
+            </div>
+          )}
           {/* 功能按钮 */}
           <div
             class={[styles.headRight]}
@@ -814,7 +818,7 @@ export default defineComponent({
               <img style={{ display: state.section.length === 2 ? "" : "none" }} class={styles.iconBtn} src={headImg(`section2.png`)} />
               <span>选段</span>
             </div>
-            {(
+            {
               <>
                 <div
                   style={{ display: metronomeBtn.value.display ? "" : "none" }}
@@ -838,7 +842,7 @@ export default defineComponent({
                   </Popup>
                 }
               </>
-            )}
+            }
             {/* {state.enableNotation ? (
               <Popover trigger="manual" v-model:show={headData.musicTypeShow} class={state.platform === IPlatform.PC && styles.pcTransPop} placement={state.platform === IPlatform.PC ? "top-end" : "bottom-end"} overlay={false} offset={state.platform === IPlatform.PC ? [0, 40] : [0, 8]}>
                 {{

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

@@ -12,11 +12,11 @@
 
 :global {
 
-    .headHeight>.driver-active-element,
-    #noticeBarRollDom>.driver-active-element,
-    :not(body):has(>.headHeight),
-    :not(body):has(>#noticeBarRollDom),
-    body .headHeight,
+    // .headHeight>.driver-active-element,
+    // #noticeBarRollDom>.driver-active-element,
+    // :not(body):has(>.headHeight),
+    // :not(body):has(>#noticeBarRollDom),
+    body .headeTopTitleBtn,
     body #noticeBarRollDom {
         overflow: initial !important;
     }

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

@@ -118,7 +118,8 @@ export default defineComponent({
       api_setStatusBarVisibility();
       const settting = store.get("musicscoresetting");
       if (settting) {
-        state.setting = settting;
+        //state.setting = settting;
+        Object.assign(state.setting, settting)
         //state.setting.beatVolume = state.setting.beatVolume || 50
         state.setting.beatVolume = 50;
         if (state.setting.camera) {

src/view/music-score/index.tsx

@@ -148,7 +148,7 @@ export default defineComponent({
 			await osmd.load(musicData.score);
 			// 对外暴露 一行谱时候 缩小谱面
 			if(state.isSimplePage){
-				state.zoom = 0.6
+				state.zoom = 0.5
 			}
 			osmd.zoom = state.zoom;
 			osmd.render();