Browse Source

style: ui走查样式修改

TIANYONG 11 months ago
parent
commit
fc9778d035

+ 4 - 2
src/helpers/customMusicScore.ts

@@ -557,8 +557,10 @@ export const resetFormate = () => {
 					}
 				} catch (error) {}
 				const bbox = stave?.getBBox() || {};
-				const rect = `<rect class="vf-custom-bg" x="${bbox.x}" y="${bbox.y}" width="${bbox.width}" height="${bbox.height}" fill="#609FCF" />`
-				const rectBottom = `<rect class="vf-custom-bot" x="${bbox.x}" y="${bbox.y+bbox.height}" width="${bbox.width}" height="7.5" fill="#2B70A5" />`
+				const bgColor = state.isEvaluatReport ? '#132D4C' : '#609FCF';
+				const botColor = state.isEvaluatReport ? '#040D1E' : '#2B70A5';
+				const rect = `<rect class="vf-custom-bg" x="${bbox.x}" y="${bbox.y}" width="${bbox.width}" height="${bbox.height}" fill=${bgColor} />`
+				const rectBottom = `<rect class="vf-custom-bot" x="${bbox.x}" y="${bbox.y+bbox.height}" width="${bbox.width}" height="7.5" fill=${botColor} />`
 				// const filterDom = `<defs>
 				// 						<filter id="shadow">
 				// 						<feDropShadow dx="5" dy="5" stdDeviation="3" flood-color="black" />

BIN
src/page-instrument/header-top/image/headImg2.png


+ 11 - 3
src/page-instrument/view-detail/index.tsx

@@ -336,9 +336,9 @@ export default defineComponent({
               fingerBox: {
                 position: "absolute",
                 width: state.fingeringInfo.width,
-                height: "80%",
+                height: state.fingeringInfo.name === "hulusi-flute" ? "86%" : "80%",
                 left: 0,
-                top: 0,
+                top: state.fingeringInfo.name === "ocarina" ? "50px" : 0,
               },
             };
           }
@@ -392,6 +392,13 @@ export default defineComponent({
         sendParentMessage(state.playState);
       }
     );
+    // 监听跟练的开启状态
+    watch(
+      () => followData.start,
+      () => {
+        detailData.headerHide = followData.start;
+      }
+    );
     /** 指法预览切换 */
     watch(
       () => detailData.fingerPreView,
@@ -489,7 +496,8 @@ export default defineComponent({
             // if (state.playState === "play" && state.platform != IPlatform.PC) {
             //   detailData.headerHide = !detailData.headerHide;
             // }
-            if (state.playState === "play") {
+            // 点击谱面跟练也需要切换显示按钮栏
+            if (state.playState === "play" || followData.start) {
               detailData.headerHide = !detailData.headerHide;
             }
           }}

+ 2 - 1
src/page-instrument/view-detail/smoothAnimation/index.ts

@@ -186,7 +186,8 @@ export function moveSmoothAnimation(progress: number, activeIndex: number, isMov
  * 谱面移动逻辑
  */
 function move_osmd(nowPointsPos: pointsPosType[0]) {
-   const speed = smoothAnimationState.aveSpeed * (state.speed / 60)
+   // 评测移动太快看不到前面小节的分数,评测改成0.5倍速移动谱面
+   const speed = (state.modeType === 'evaluating' ? smoothAnimationState.aveSpeed * 0.5 : smoothAnimationState.aveSpeed) * (state.speed / 60)
    // 视口宽度
    const clientWidth = smoothAnimationState.osdmScrollDomWith
    const clientMidWidth = clientWidth / 2

BIN
src/page-instrument/view-evaluat-report/component/share-top/image/icon-huifang.png


BIN
src/page-instrument/view-evaluat-report/component/share-top/image/icon-shiyi.png


+ 1 - 1
src/page-instrument/view-evaluat-report/component/share-top/index.module.less

@@ -48,7 +48,7 @@
             line-height: 20px;
             margin-bottom: 2px;
             padding: 0 !important;
-
+            width: 200px;
             :global {
                 .van-notice-bar {
                     height: 20px;

+ 5 - 5
src/page-instrument/view-evaluat-report/component/share-top/index.tsx

@@ -4,8 +4,8 @@ import styles from "./index.module.less";
 import { api_back } from "/src/helpers/communication";
 import state from "/src/state";
 import iconBack from "./image/back_icon.png";
-import iconShiyi from "./image/icon-shiyi.svg";
-import iconhuifang from "./image/icon-huifang.svg";
+import iconShiyi from "./image/icon-shiyi.png";
+import iconhuifang from "./image/icon-huifang.png";
 import shiyiTop from "./image/shiyi-top.png";
 import shiyiClose from "./image/closeImg.png";
 import { Grid, GridItem, Popup } from "vant";
@@ -56,7 +56,7 @@ export default defineComponent({
       low: "#FFB900",
       right: "#65FFAE",
       wrong: "#DA3736",
-      lack: "#A5CBFF",
+      lack: "#7AB2FF",
       not: "#FFFFFF",
       fast: "#B366FF",
       slow: "#FF7B00",
@@ -352,7 +352,7 @@ export default defineComponent({
 
                   {itemType.value === "integrity" && (
                     <div>
-                      <Note fill="#A5CBFF" />
+                      <Note fill="#7AB2FF" />
                       <span>时值不足</span>
                     </div>
                   )}
@@ -484,7 +484,7 @@ export default defineComponent({
                     <span>紫色音符:节奏偏快</span>
                   </div>
                   <div class={styles.item}>
-                    <Note fill="#A5CBFF" />
+                    <Note fill="#7AB2FF" />
                     <span>浅蓝色音符:时值不足</span>
                   </div>
                   <div class={styles.item}>

+ 4 - 4
src/page-instrument/view-evaluat-report/index.module.less

@@ -87,8 +87,8 @@
 
 .beam {
   path {
-    fill: #ADADAD !important;
-    stroke: #ADADAD;
+    // fill: #ADADAD !important;
+    // stroke: #ADADAD;
   }
 }
 
@@ -171,8 +171,8 @@
 // 完成度
 .integrity_wrong {
   path {
-    fill: #A5CBFF;
-    stroke: #A5CBFF;
+    fill: #7AB2FF;
+    stroke: #7AB2FF;
   }
 }
 

+ 7 - 7
src/page-instrument/view-evaluat-report/index.tsx

@@ -294,13 +294,13 @@ export default defineComponent({
           svgEl?.classList.add(colorsClass[errType]);
           // console.log(123456,'添加颜色',errType)
           // 评测过的音符,需要给小节添加背景色
-          if (errType !== "NOT_PLAYED") {
-            const staveNote = svgEl?.parentNode?.parentNode?.querySelector(".vf-stave");
-            if (staveNote) {
-              staveNote.querySelector(".vf-custom-bg")?.setAttribute("fill", "#132D4C");
-              staveNote.querySelector(".vf-custom-bot")?.setAttribute("fill", "#040D1E");
-            }
-          }
+          // if (errType !== "NOT_PLAYED") {
+          //   const staveNote = svgEl?.parentNode?.parentNode?.querySelector(".vf-stave");
+          //   if (staveNote) {
+          //     staveNote.querySelector(".vf-custom-bg")?.setAttribute("fill", "#132D4C");
+          //     staveNote.querySelector(".vf-custom-bot")?.setAttribute("fill", "#040D1E");
+          //   }
+          // }
           if (svgEl && isNeedCopyElement) {
             stemEl?.classList.remove(colorsClass[errType]);
             svgEl?.classList.remove(colorsClass[errType]);

+ 1 - 0
src/state.ts

@@ -1432,6 +1432,7 @@ const setState = (data: any, index: number) => {
    */
   const currentInstrumentId = query.instrumentId || storeData.user?.instrumentId;
   let musicalCode = !currentInstrumentId ? data.musicSheetSoundList?.find((item:any)=>{ return item.audioPlayType === "PLAY" })?.track || '' : data.musicSheetSoundList?.find((item: any) => item?.musicalInstrumentId == currentInstrumentId && item.audioPlayType === "PLAY")?.track || '';
+  musicalCode =  "Alto Ocarina" || "Panpipes";
   const pitchSubject = musicalInstrumentCodeInfo.find((n) => n.code.toLocaleLowerCase() === subjectCode.toLocaleLowerCase())
   const pitchMusical = musicalInstrumentCodeInfo.find((n) => n.code.toLocaleLowerCase() === musicalCode.toLocaleLowerCase())
   state.subjectCodeId = pitchSubject ? pitchSubject.id : 0

+ 11 - 11
src/view/fingering/fingering-config.ts

@@ -260,7 +260,7 @@ export const matchVoicePart = (id: number | string, type: "SINGLE" | "CONCERT"):
   } else {
     let code = id;
     const subject: { [_key: string | number]: any } = {
-      Piccolo: "piccolo",
+      Piccolo: 1,
       Flute: 2,
       "Flute 1": 2,
       "Flute 2": 2,
@@ -448,16 +448,16 @@ export const subjectFingering = (subjectId: number | string): IFingering => {
         hasTizhi: true,
         id: 2,
       };
-    // case "piccolo": // 德式竖笛
-    //   return {
-    //     name: "piccolo",
-    //     direction: "vertical",
-    //     width: "3rem",
-    //     orientation: 0,
-    //     code: "竖笛",
-    //     hasTizhi: true,
-    //     id: 37,
-    //   };
+    case "piccolo": // 德式竖笛
+      return {
+        name: "piccolo",
+        direction: "vertical",
+        width: "3rem",
+        orientation: 0,
+        code: "竖笛",
+        hasTizhi: true,
+        id: 37,
+      };
     case "hulusi-flute": // 葫芦丝
       return {
         name: "hulusi-flute",

File diff suppressed because it is too large
+ 0 - 0
src/view/fingering/fingering-img/baroque-recorder/index.json


File diff suppressed because it is too large
+ 0 - 0
src/view/fingering/fingering-img/ocarina/index.json


File diff suppressed because it is too large
+ 0 - 0
src/view/fingering/fingering-img/piccolo/index.json


File diff suppressed because it is too large
+ 0 - 0
src/view/fingering/fingering-img/whistling/index.json


+ 7 - 1
src/view/fingering/index.tsx

@@ -27,6 +27,12 @@ export default defineComponent({
       return state.times[state.activeNoteIndex]?.realKey || -1;
     });
 
+    // 竖笛、陶笛,云教练的乐器图片不需要正面两个字
+    const specialBgFinger = computed(() => {
+      const list: any = ['baroque-recorder', 'piccolo', 'ocarina', 'whistling']
+      return list.includes(state.fingeringInfo.name);
+    });
+
     const doubeClick = () => {
       const nowTime = Date.now();
       if (nowTime - fingerData.delay < 300) {
@@ -61,7 +67,7 @@ export default defineComponent({
           ) : (
             <div onClick={() => doubeClick()} class={[styles.fingeringContainer, styles.vertical, state.fingeringInfo.name, state.fingeringInfo.name === 'hulusi-flute' ? styles.hulusiTop : '']}>
               <div class={styles.imgs}>
-                <img class="driver-7" src={fingerData.subject?.json?.full} />
+                <img class="driver-7" src={specialBgFinger.value ? fingerData.subject?.json?.fullSpe : fingerData.subject?.json?.full} />
                 {rs.map((key: number | string, index: number) => {
                   const nk: string = typeof key === "string" ? key.replace("active-", "") : String(key);
                   return <img data-index={nk} src={fingerData.subject?.json?.[nk]} />;

+ 2 - 1
src/view/selection/index.tsx

@@ -236,6 +236,7 @@ export default defineComponent({
 				onClick={(e: Event) => e.stopPropagation()}
 			>
 				{selectData.staves.map((item: any) => {
+					// 评测得分
 					const scoreItem = item.id && evaluatingData.evaluatings[item.measureListIndex];
 					// for(let idx in evaluatingData.evaluatings) {
 					// 	const { show, measureIndex } = evaluatingData.evaluatings[idx]
@@ -260,7 +261,7 @@ export default defineComponent({
 								<div
 									class={[
 										styles.position,
-										scoreItem ? `scoreItemLeve${scoreItem.leve}` : "",
+										// scoreItem ? `scoreItemLeve${scoreItem.leve}` : "", // 去掉评测小节得分的背景色
 										item.multipleRestMeasures <= 1 ? styles.staveBg : "",
 										(state.platform === IPlatform.PC && state.zoom > 0.8) ? styles.linePC : '',
 									]}

Some files were not shown because too many files changed in this diff