lex-xin 2 months ago
parent
commit
c48bfa8e58
2 changed files with 136 additions and 120 deletions
  1. 5 1
      src/constant/instruments.ts
  2. 131 119
      src/tenant/music/music-detail/new-index.tsx

+ 5 - 1
src/constant/instruments.ts

@@ -214,7 +214,11 @@
  * @returns
  */
 export const getInstrumentName = (instruments: any, instrumentName: string) => {
-  const _instrumentName = instrumentName.replace(/ /g, '').toLocaleLowerCase()
+  const _instrumentName = instrumentName
+    .replace(/ /g, '')
+    .replace(/\d+|\d+/g, '')
+    .trim()
+    .toLocaleLowerCase()
   const _instrument = Object.keys(instruments)
   for (let i = 0; i < _instrument.length; i++) {
     const _name = _instrument[i].replace(/ /g, '').toLocaleLowerCase()

+ 131 - 119
src/tenant/music/music-detail/new-index.tsx

@@ -112,7 +112,7 @@ export default defineComponent({
       loading.value = true
       isError.value = false
       try {
-        const {data} = await request.post('/musicSheet/detailSmall', {
+        const { data } = await request.post('/musicSheet/detailSmall', {
           prefix:
             state.platformType === 'TEACHER' ? '/api-teacher' : '/api-student',
           data: {
@@ -148,22 +148,19 @@ export default defineComponent({
         controls: controls
       })
 
-      const config = await request.get(
-        '/sysConfig/queryByParamNameList',
-        {
-          prefix: state.platformType === 'TEACHER' ? '/api-teacher' : '/api-student',
-          params: {
-            paramNames: 'music_sheet_free_rate'
-          }
+      const config = await request.get('/sysConfig/queryByParamNameList', {
+        prefix:
+          state.platformType === 'TEACHER' ? '/api-teacher' : '/api-student',
+        params: {
+          paramNames: 'music_sheet_free_rate'
         }
-      )
+      })
       freeRate.value = config.data[0]?.paramValue || 0
 
-
       nextTick(async () => {
-        console.log("nextTick nextTick")
-        renderStaff();
-      });
+        console.log('nextTick nextTick')
+        renderStaff()
+      })
 
       player.value.on('timeupdate', () => {
         // 允许播放时间
@@ -200,17 +197,18 @@ export default defineComponent({
     const getInstrumentCodes = async () => {
       try {
         const { data } = await request.get('/music/sheet/instrumentCode', {
-          prefix: state.platformType === 'TEACHER'? '/api-teacher' : '/api-student'
+          prefix:
+            state.platformType === 'TEACHER' ? '/api-teacher' : '/api-student'
         })
-        if(Array.isArray(data)) {
+        if (Array.isArray(data)) {
           const tempCodes: any = {}
           data.forEach((item: any) => {
-            const codes = item.code?.split(',');
+            const codes = item.code?.split(',')
             codes.forEach((code: any) => {
-              tempCodes[code] = item.name;
-            });
-          });
-          staffData.instrumentCodes = tempCodes;
+              tempCodes[code] = item.name
+            })
+          })
+          staffData.instrumentCodes = tempCodes
         }
       } catch {
         //
@@ -224,7 +222,7 @@ export default defineComponent({
         staffData.instrumentId = instrumentId
       }
       const subjectIds = state.user.data?.subjectId
-      if(subjectIds) {
+      if (subjectIds) {
         const subjectId = subjectIds.split(',')[0]
         staffData.subjectId = subjectId
       }
@@ -386,7 +384,7 @@ export default defineComponent({
       isComberRender: false, // 是否合并谱显示
       metronomeUrl: '', // 合奏使用链接
       metronomeMp3Url: '', // 独奏使用链接
-      instrumentCodes: [] as any, // 乐器编码
+      instrumentCodes: [] as any // 乐器编码
     })
 
     // 当前先中的数据
@@ -402,7 +400,10 @@ export default defineComponent({
       let isConvertibleScore = details.isConvertibleScore
       let isHiddenStaff = false // 是否隐藏五线谱转谱
 
-      if(!isConvertibleScore && ["FIRST", "JIAN"].includes(details.scoreType)) {
+      if (
+        !isConvertibleScore &&
+        ['FIRST', 'JIAN'].includes(details.scoreType)
+      ) {
         isConvertibleScore = true
         isHiddenStaff = true
       }
@@ -457,7 +458,7 @@ export default defineComponent({
       // 老师端,加上乐器id
       const instrumentIds = staffData.instrumentId // appState.instrumentId || appState.user?.instrumentId || route.query.instrumentId
       if (instrumentIds) {
-        const { track  } =
+        const { track } =
           musicalInstruments.find((item: any) => {
             return instrumentIds == item.musicalInstrumentId
           }) || {}
@@ -518,8 +519,8 @@ export default defineComponent({
             : index
         const cnName = getInstrumentName(staffData.instrumentCodes, item.track)
         return {
-          text: item.track + (cnName ?  `(${cnName})` : ''),
-        name: item.track + (cnName ?  `(${cnName})` : ''), // true
+          text: item.track + (cnName ? `(${cnName})` : ''),
+          name: item.track + (cnName ? `(${cnName})` : ''), // true
           track: item.track,
           musicPdfUrl: item.musicPdfUrl,
           firstPdfUrl: item.firstPdfUrl,
@@ -562,10 +563,7 @@ export default defineComponent({
       }
 
       if (row.musicSheetType === 'SINGLE') {
-        staffData.musicPdfUrl = getCurrentPdf(
-          row,
-          row.scoreType
-        )
+        staffData.musicPdfUrl = getCurrentPdf(row, row.scoreType)
 
         // 生成的图片
         // staffData.imgs = row.musicImg ? row.musicImg.split(',') : [];
@@ -593,10 +591,7 @@ export default defineComponent({
           if (row.defaultScoreRender) {
             pdfUrl = getCurrentPdf(row, row.scoreType)
           } else {
-            pdfUrl = getCurrentPdf(
-              defaultShowStaff,
-              row.scoreType
-            )
+            pdfUrl = getCurrentPdf(defaultShowStaff, row.scoreType)
           }
           staffData.musicPdfUrl = pdfUrl
         } else {
@@ -614,9 +609,7 @@ export default defineComponent({
       // 通过isScoreRender判断是否合并渲染
       // 多声轨,  不是单声部多声轨, 不是老师布置作业选择曲谱
       audioFileUrl.value = row.mp3Url
-      if (
-        audioFileUrl.value
-      ) {
+      if (audioFileUrl.value) {
         // audioFileUrl.value = staffData.isConcert
         //   ? staffData.metronomeUrl
         //   : staffData.metronomeMp3Url
@@ -628,7 +621,11 @@ export default defineComponent({
       }
     }
 
-    const getPreViewCloud = (musicId: string, partIndex: number, track: string) => {
+    const getPreViewCloud = (
+      musicId: string,
+      partIndex: number,
+      track: string
+    ) => {
       const Authorization = sessionStorage.getItem('Authorization') || ''
       const musicScorePath = '/klx-music-score/'
       const musicScoreUrl = getHttpOrigin() + musicScorePath
@@ -639,12 +636,12 @@ export default defineComponent({
       href +=
         '&systemType=' +
         (state.platformType === 'STUDENT' ? `student` : 'teacher')
-        // 总谱还是什么
-        if(partIndex === 999) {
-          href += `&part-index=${partIndex}`
-        } else {
-          href += `&part-name=${encodeURIComponent(track || "")}`
-        }
+      // 总谱还是什么
+      if (partIndex === 999) {
+        href += `&part-index=${partIndex}`
+      } else {
+        href += `&part-name=${encodeURIComponent(track || '')}`
+      }
       // if (location.pathname.includes("accompany-teacher")) {
       //   href += `&systemType=teacher`;
       // }
@@ -698,7 +695,13 @@ export default defineComponent({
 
     const resetRender = () => {
       const iframeRef: any = document.getElementById('staffIframeRef')
-      iframeRef.contentWindow.location.replace(getPreViewCloud(staffData.musicId, currentColumn.value?.xmlIndex || 0, currentColumn.value.track))
+      iframeRef.contentWindow.location.replace(
+        getPreViewCloud(
+          staffData.musicId,
+          currentColumn.value?.xmlIndex || 0,
+          currentColumn.value.track
+        )
+      )
     }
 
     const onDownloadApp = () => {
@@ -852,26 +855,23 @@ export default defineComponent({
               ]}
               onClick={() => {
                 if (browser().isApp) {
-                  if(staffData.imgs.length <= 0 && !staffData.musicPdfUrl) return
+                  if (staffData.imgs.length <= 0 && !staffData.musicPdfUrl)
+                    return
                   if (staffData.musicPdfUrl) {
                     const songName =
                       staffData.details?.name +
-                      (staffData.isConcert &&
-                      currentColumn.value?.name
-                        ? `(${
-                            currentColumn.value
-                              ?.name || ""
-                          })`
-                        : "");
+                      (staffData.isConcert && currentColumn.value?.name
+                        ? `(${currentColumn.value?.name || ''})`
+                        : '')
                     promisefiyPostMessage({
-                      api: "downloadFile",
+                      api: 'downloadFile',
                       content: {
                         downloadUrl: staffData.musicPdfUrl,
-                        fileName: songName,
-                      },
-                    });
+                        fileName: songName
+                      }
+                    })
                   } else {
-                    downloadStatus.value = true;
+                    downloadStatus.value = true
                   }
                 } else {
                   onDownloadApp()
@@ -922,7 +922,8 @@ export default defineComponent({
         </div>
 
         <div class={styles.musicContent}>
-          {defaultConvertible.value.isConvertibleScore && staffData.details?.musicSheetType === 'SINGLE' ? (
+          {defaultConvertible.value.isConvertibleScore &&
+          staffData.details?.musicSheetType === 'SINGLE' ? (
             <span
               class={styles.iconTransfer}
               style={{
@@ -944,6 +945,7 @@ export default defineComponent({
             }}
             onClick={() => {
               staffData.open = true
+              staffData.closed = false;
             }}
           >
             切换声轨
@@ -1073,7 +1075,9 @@ export default defineComponent({
                         }
                         let extraParam: any = {
                           // 'part-index': currentColumn.value.xmlIndex || 0,
-                          'part-name': encodeURIComponent(currentColumn.value.track?.trim() || ''),
+                          'part-name': encodeURIComponent(
+                            currentColumn.value.track?.trim() || ''
+                          ),
                           musicRenderType,
 
                           albumId: route.query.tenantAlbumId || '', // 专辑编号
@@ -1181,12 +1185,9 @@ export default defineComponent({
               imgList={JSON.parse(JSON.stringify(staffData.imgs))}
               musicSheetName={
                 staffData.details.name +
-                  (staffData.isConcert &&
-                  currentColumn.value?.name
-                    ? `(${
-                        currentColumn.value?.name || ""
-                      })`
-                    : "")
+                (staffData.isConcert && currentColumn.value?.name
+                  ? `(${currentColumn.value?.name || ''})`
+                  : '')
               }
             />
           )}
@@ -1204,36 +1205,40 @@ export default defineComponent({
             <div class={styles.staffTitle}>转换曲谱</div>
             <RadioGroup v-model={staff.radio}>
               <CellGroup border={false}>
-                {!defaultConvertible.value.isHiddenStaff ? <Cell
-                  center
-                  border={false}
-                  class={staff.radio === 'STAVE' ? styles.active : ''}
-                  onClick={() => onChangeStaff('STAVE')}
-                >
-                  {{
-                    icon: () => (
-                      <Image src={staffDetafult} class={styles.staffImg} />
-                    ),
-                    title: () => <span class={styles.name}>五线谱</span>,
-                    value: () => (
-                      <Radio name="STAVE">
-                        {{
-                          icon: (props: any) => (
-                            <Icon
-                              class={styles.boxStyle}
-                              size={16}
-                              name={
-                                props.checked
-                                  ? activeButtonIcon
-                                  : inactiveButtonIcon
-                              }
-                            />
-                          )
-                        }}
-                      </Radio>
-                    )
-                  }}
-                </Cell> : ""}
+                {!defaultConvertible.value.isHiddenStaff ? (
+                  <Cell
+                    center
+                    border={false}
+                    class={staff.radio === 'STAVE' ? styles.active : ''}
+                    onClick={() => onChangeStaff('STAVE')}
+                  >
+                    {{
+                      icon: () => (
+                        <Image src={staffDetafult} class={styles.staffImg} />
+                      ),
+                      title: () => <span class={styles.name}>五线谱</span>,
+                      value: () => (
+                        <Radio name="STAVE">
+                          {{
+                            icon: (props: any) => (
+                              <Icon
+                                class={styles.boxStyle}
+                                size={16}
+                                name={
+                                  props.checked
+                                    ? activeButtonIcon
+                                    : inactiveButtonIcon
+                                }
+                              />
+                            )
+                          }}
+                        </Radio>
+                      )
+                    }}
+                  </Cell>
+                ) : (
+                  ''
+                )}
                 <Cell
                   center
                   border={false}
@@ -1304,32 +1309,39 @@ export default defineComponent({
           position="bottom"
           round
           v-model:show={staffData.open}
+          onClosed={() => {
+            staffData.closed = true
+          }}
         >
-          <Picker
-            columns={partColumns.value}
-            defaultIndex={staffData.selectedPartIndex}
-            onConfirm={value => {
-              staffData.open = false;
-              staffData.selectedPartIndex = value.value;
-              staffData.imgs = [];
-              nextTick(() => {
-                const item = partColumns.value.find((child: any) => child.value === value.value)
-                const tempPdf = getCurrentPdf(item, staff.radio)
-                staffData.musicPdfUrl = tempPdf;
-                if (tempPdf) {
-                  renderStaff();
-                } else {
-                  loading.value = true;
-                  if (staffData.musicPdfUrl) {
-                    resetRender();
+          {!staffData.closed && (
+            <Picker
+              columns={partColumns.value}
+              defaultIndex={staffData.selectedPartIndex}
+              onConfirm={value => {
+                staffData.open = false
+                staffData.selectedPartIndex = value.value
+                staffData.imgs = []
+                nextTick(() => {
+                  const item = partColumns.value.find(
+                    (child: any) => child.value === value.value
+                  )
+                  const tempPdf = getCurrentPdf(item, staff.radio)
+                  staffData.musicPdfUrl = tempPdf
+                  if (tempPdf) {
+                    renderStaff()
                   } else {
-                    renderStaff();
+                    loading.value = true
+                    if (staffData.musicPdfUrl) {
+                      resetRender()
+                    } else {
+                      renderStaff()
+                    }
                   }
-                }
-              });
-            }}
-            onCancel={() => (staffData.open = false)}
-          />
+                })
+              }}
+              onCancel={() => (staffData.open = false)}
+            />
+          )}
         </Popup>
       </div>
     )