浏览代码

Merge branch 'hqyDevNewVersion' of http://git.dayaedu.com/liushengqiang/music-score into feature-tianyong-newVersion

TIANYONG 11 月之前
父节点
当前提交
6e72006673

二进制
src/page-instrument/component/the-music-list/imgs/searImg.png


+ 89 - 4
src/page-instrument/component/the-music-list/index.module.less

@@ -10,7 +10,7 @@
             height: 100%;
             .van-tabs__wrap{
                 display: flex;
-                justify-content: right;
+                justify-content: flex-end;
                 height: 30px;
                 .van-tabs__nav--line{
                     padding-bottom: 0;
@@ -89,15 +89,15 @@
         height: 34px;
         background: #F8F9FC;
         border-radius: 18px;
-        padding: 0 4px 0 12px;
+        padding: 0 4px 0 10px;
         border: 1px solid transparent;
         &.isFocus{
             border-color: #1CACF1;
         }
         >img{
             flex-shrink: 0;
-            width: 14px;
-            height: 14px;
+            width: 16px;
+            height: 16px;
         }
         :global{
             .van-field{
@@ -135,6 +135,74 @@
                 opacity: 0.8;
             }
         }
+        .dropdownMenu{
+            border-right: 1px solid #DADCE5;
+            margin-right: 8px;
+            :global{
+                .van-dropdown-menu__bar{
+                    height: 20px;
+                    background: transparent;
+                    box-shadow: initial;
+                    .van-dropdown-menu__item{
+                        padding: 0 8px 0 0;
+                    }
+                    .van-dropdown-menu__title{
+                        --van-gray-4: #0CA2EA;
+                        font-weight: 400;
+                        font-size: 14px;
+                        color: #0CA2EA;
+                        padding: 0 12px 0 0;
+                        &::after{
+                            right: 0;
+                            opacity: initial;
+                        }
+                    }
+                }
+                .van-dropdown-item.van-dropdown-item--down{
+                    left: 36px;
+                    width: 148px;
+                    margin-top: 7px;
+                    .van-dropdown-item__content{
+                        margin-left: 10px;
+                        padding: 0 10px;
+                        width: 128px;
+                        box-shadow: 0px 2px 14px 0px rgba(0,0,0,0.12);
+                        border-radius: 8px;
+                        .van-cell{
+                            margin-top: 6px;
+                            padding: 0;
+                            font-weight: 500;
+                            font-size: 14px;
+                            color: #323233;
+                            line-height: 32px;
+                            text-align: center;
+                            &::after{
+                                border: none;
+                            }
+                            &:last-child{
+                                margin-bottom: 6px;
+                            }
+                            &.van-dropdown-item__option--active{
+                                background: #EEF8FF;
+                                border-radius: 4px;
+                                color: #1CACF1;
+                            }
+                            .van-cell__value{
+                                display: none;
+                            }
+                        }
+                    }
+                }
+            }
+            &.currItem{
+                :global{
+                    .van-dropdown-menu__bar  .van-dropdown-menu__title{
+                        color: #1CACF1;
+                        --van-gray-4:#1CACF1;
+                    }
+                }
+            }
+        }
     }
     :global{
         .van-list{
@@ -223,6 +291,23 @@
                 font-size: 13px;
                 color: rgba(0,0,0,0.5);
             }
+            .playType,.singType{
+                margin-left: 5px;
+                width: 26px;
+                height: 17px;
+                background: #FFFFFF;
+                border-radius: 3px;
+                text-align: center;
+                line-height: 17px;
+                border: 1px solid #15B2FD;
+                font-weight: 400;
+                font-size: 10px;
+                color: #15B2FD;
+                &.singType{
+                    color: #CD8613;
+                    border-color: #CD8613;
+                }
+            }
         }
     }
 }

+ 19 - 1
src/page-instrument/component/the-music-list/list.tsx

@@ -2,7 +2,7 @@ import { defineComponent, onMounted, reactive, watch } from "vue";
 import styles from "./index.module.less";
 import { api_musicSheetPage } from "../../api";
 import state, { togglePlay } from "/src/state";
-import { List, Image, Field } from "vant";
+import { List, Image, Field, DropdownMenu, DropdownItem } from "vant";
 import { postMessage } from "/src/utils/native-message";
 import qs from "query-string";
 import searImg from "./imgs/searImg.png"
@@ -25,6 +25,7 @@ export default defineComponent({
       musicSheetCategoriesId: state.bizMusicCategoryId,
       recentFlag: props.recentFlag ? true : null,
       excludeMusicId: props.recentFlag ? null : state.examSongId,
+      audioPlayTypes:""
     });
     const data = reactive({
       isFocus: false,
@@ -33,12 +34,21 @@ export default defineComponent({
       loading: false,
       hasNext: true,
     });
+    const audioPlayTypesOption = [
+      { text: '全部场景', value: "" },
+      { text: '演奏', value: "PLAY" },
+      { text: '演唱', value: "SING" },
+      { text: '演奏+演唱', value: "PLAY,SING" },
+    ]
     const getList = async () => {
       if (!data.hasNext) return;
       data.loading = true;
       try {
         const res = await api_musicSheetPage({
           ...forms,
+          ...{
+            audioPlayTypes: forms.audioPlayTypes ? forms.audioPlayTypes.split(",") : []
+          }
         });
         if (res?.code === 200 && Array.isArray(res.data?.rows)) {
           data.list = [...data.list, ...res.data.rows];
@@ -93,6 +103,9 @@ export default defineComponent({
     return () => (
       <div class={styles.wrap}>
         <div class={[styles.searchBox,data.isFocus && styles.isFocus]}>
+          <DropdownMenu class={[styles.dropdownMenu]} overlay={false}>
+							<DropdownItem onChange={handleQuery} v-model={forms.audioPlayTypes} options={audioPlayTypesOption}/>
+					</DropdownMenu>
           <img src={searImg} />
           <Field placeholder="请输入曲目名称" v-model={forms.name} autocomplete="off" onFocus={()=>{ data.isFocus = true }} onBlur={()=>{ data.isFocus = false }} />
           <div class={styles.searchBtn} onClick={handleQuery}>搜索</div>
@@ -117,6 +130,11 @@ export default defineComponent({
                   <p class={styles.name}>{item.musicSheetName}</p>
                   <div class={styles.detail}>
                     {item.usedNum && <div class={styles.usedNum}><img src={huoimg}/><div>{item.usedNum}</div></div>}
+                    {
+                      item.audioPlayTypes && item.audioPlayTypes.split(",").sort().map((type:"PLAY"|"SING")=>{
+                        return <div class={type==="PLAY"?styles.playType:styles.singType}>{type==="PLAY"?"演奏":"演唱"}</div>
+                      })
+                    }
                     {item.composer && <p class={styles.author}>{item.composer}</p>}
                   </div>
                 </div>

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

@@ -96,7 +96,9 @@ export const headTopData = reactive({
     headTopData.modeType = "show";
   },
   // 改变模式之前的状态
-  oldPlayType: "play"
+  oldPlayType: "play",
+  // 记录切换模式前的状态
+  oldModeType: "practise" as "practise" | "follow" | "evaluating"
 });
 
 export const headData = reactive({
@@ -667,6 +669,7 @@ export default defineComponent({
               style={{ display: toggleBtn.value.display ? "" : "none" }}
               class={["driver-9", styles.modeChangeBox, toggleBtn.value.disabled && styles.disabled]} 
               onClick={() => {
+                  headTopData.oldModeType = state.modeType
                   handleRessetState();
                   headTopData.modeType = "init";
               }}

+ 4 - 0
src/page-instrument/header-top/modeView.tsx

@@ -108,6 +108,10 @@ export default defineComponent({
           class={styles.back}
           onClick={() => {
             smoothAnimationState.isShow.value = state.setting.melodyLine;
+            // 返回的时候 跳转到之前记录的模式
+            if(headTopData.oldModeType !== "practise"){
+              headTopData.handleChangeModeType(headTopData.oldModeType)
+            }
             headTopData.modeType = "show";
           }}
         />

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

@@ -1,4 +1,4 @@
-import { computed, defineComponent, nextTick, reactive, ref, toRefs } from "vue";
+import { computed, defineComponent, nextTick, reactive, ref, toRefs, onUnmounted } from "vue";
 import styles from "./index.module.less";
 
 import { api_back } from "/src/helpers/communication";
@@ -67,7 +67,9 @@ export default defineComponent({
     const handleBack = () => {
       api_back();
     };
-
+    onUnmounted(()=>{
+      shareData._plrl?.destroy()
+    })
     const handleChange = (type: IItemType) => {
       itemType.value = type;
       scoreData.value.itemType = type;

+ 3 - 0
src/view/music-score/index.module.less

@@ -77,6 +77,9 @@
         z-index: 999;
     }
 }
+.notTouch{
+    touch-action: none;
+}
 .inGradualRange{
    :global{
         #cursorImg-0{

+ 2 - 1
src/view/music-score/index.tsx

@@ -225,7 +225,8 @@ export default defineComponent({
 					isInTheGradualRange.value && styles.inGradualRange,
 					state.musicRenderType == EnumMusicRenderType.staff ? "staff" : "jianpuTone",
 					state.isSingleLine && "singleLineMusicBox",
-					(!state.isCreateImg && !state.isPreView && state.musicRenderType === EnumMusicRenderType.staff) ? "blueMusicXml" : ""
+					(!state.isCreateImg && !state.isPreView && state.musicRenderType === EnumMusicRenderType.staff) ? "blueMusicXml" : "",
+					state.isSingleLine && state.playState ==="play" && styles.notTouch
 				]}
 			>
 				{slots.default?.()}