Ver código fonte

feat: 标准音高使用范围值

TIANYONG 1 ano atrás
pai
commit
ba12c877cc

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


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


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

@@ -195,4 +195,21 @@
 .disabled{
     opacity: .3;
     pointer-events: none;
+}
+
+.operateHz {
+    display: flex;
+    align-items: center;
+    font-size: 12px;
+    color: var(--van-primary-color);
+    font-weight: 500;
+    img {
+        width: 22px;
+        height: 22px;
+    }
+    span {
+        margin: 0 6px;
+        width: 40px;
+        text-align: center;
+    }
 }

+ 27 - 2
src/page-instrument/header-top/settting/index.tsx

@@ -23,6 +23,8 @@ import iconInfo from "../image/info.svg";
 import iconDown from "../image/down.svg";
 import iconTv from "../image/tv.svg";
 import iconYijian from "../image/yijian.svg";
+import iconSubtract from "../image/subtract.png";
+import iconAdd from "../image/add.png";
 import ScreenModel from "../../custom-plugins/helper-model/screen-model";
 import Recommendation from "../../custom-plugins/helper-model/recommendation";
 import { svg2canvas } from "/src/utils/svg2canvas";
@@ -81,6 +83,20 @@ export default defineComponent({
 				}
 			}, 500);
 		};
+
+		// 加减评测频率
+		const operateHz = (type: number) => {
+			const minFrequency = state.baseFrequency - 10, maxFrequency = state.baseFrequency + 10
+			let currentFrequency = state.setting.frequency
+			if (type === 1) {
+				if (currentFrequency - 1 < minFrequency) return showToast({ message: `最低标准音高${minFrequency}HZ` })
+				currentFrequency = currentFrequency - 1
+			} else {
+				if (currentFrequency + 1 > maxFrequency) return showToast({ message: `最高标准音高${minFrequency}HZ` })
+				currentFrequency = currentFrequency + 1
+			}
+			state.setting.frequency = currentFrequency
+		}
 		
 		return () => (
 			<div class={styles["header-settting"]}>
@@ -124,7 +140,7 @@ export default defineComponent({
 								}}
 							</Cell>
 						</Tab>
-						<Tab title="评测">
+						<Tab title="评测设置">
 							<Cell class={[query.workRecord && styles.disabled]} title="评测难度" center>
 								{{
 									extra: () => (
@@ -199,7 +215,7 @@ export default defineComponent({
 								}}
 							</Cell>
 							<Cell title="标准音高" center>
-								{{
+								{/* {{
 									extra: () => (
 										<RadioGroup
 											iconSize={20}
@@ -210,6 +226,15 @@ export default defineComponent({
 											<Radio name={442}>442Hz</Radio>
 										</RadioGroup>
 									),
+								}} */}
+								{{
+									extra: () => (
+										<div class={styles.operateHz}>
+											<img src={iconSubtract} onClick={() => operateHz(1)} />
+											<span>{state.setting.frequency}HZ</span>
+											<img src={iconAdd} onClick={() => operateHz(2)} />
+										</div>
+									)
 								}}
 							</Cell>
 

+ 5 - 0
src/state.ts

@@ -240,6 +240,8 @@ const state = reactive({
     /** 反应时间 */
     reactionTimeMs: 0,
   },
+  /** 后台设置的基准评测频率 */
+  baseFrequency: 440,
   /** 节拍器的时间 */
   fixtime: 0,
   /** 指法信息 */
@@ -848,8 +850,11 @@ const setState = (data: any, index: number) => {
   //课堂乐器, 渲染类型: 五线谱, 简谱
   state.musicRenderType = query.musicRenderType || EnumMusicRenderType.firstTone;
   console.log("state对象", state);
+  // 评测基准频率
+  state.baseFrequency = data.evaluationFrequency || 440
 };
 
+// 多分轨合并显示标示
 const setCustom = (trackNum?: number) => {
   if (trackNum || state.extConfigJson.multitrack) {
     setGlobalData("multitrack", trackNum || state.extConfigJson.multitrack);