添加声音练习

src/components/card-preview/index.tsx

@@ -9,6 +9,7 @@ import RhythmModal from './rhythm-modal';
 import InstruemntDetail from '/src/views/prepare-lessons/model/source-instrument/detail';
 import TheoryDetail from '/src/views/prepare-lessons/model/source-knowledge/detail';
 import MusicDetail from '/src/views/prepare-lessons/model/source-music/detail';
+import ListenModal from './listen-modal';
 
 export default defineComponent({
   name: 'card-preview',
@@ -104,6 +105,10 @@ export default defineComponent({
             <RhythmModal class={styles.musicPreview} item={item.value} />
           )}
 
+          {item.value.type === 'LISTEN' && (
+            <ListenModal class={styles.musicPreview} item={item.value} />
+          )}
+
           {(item.value.type === 'INSTRUMENT' ||
             item.value.type === 'MUSICIAN') && (
             <div class={styles.instrumentGroup}>
@@ -151,7 +156,8 @@ export default defineComponent({
             'INSTRUMENT',
             'THEORY',
             'MUSICIAN',
-            'MUSIC_WIKI'
+            'MUSIC_WIKI',
+            'LISTEN'
           ].includes(item.value.type) && <TheEmpty />}
         </NModal>
       </>

src/components/card-preview/listen-modal/index.module.less

@@ -0,0 +1,15 @@
+.musicScore {
+  width: 100%;
+  height: 100%;
+
+  iframe {
+    width: inherit;
+    height: inherit;
+
+    :global {
+      .headTopBackBtn {
+        display: none;
+      }
+    }
+  }
+}

src/components/card-preview/listen-modal/index.tsx

@@ -0,0 +1,72 @@
+import { defineComponent, ref, watch } from 'vue';
+import styles from './index.module.less';
+import { useUserStore } from '/src/store/modules/users';
+import { vaildMusicScoreUrl } from '/src/utils/urlUtils';
+
+export default defineComponent({
+  name: 'song-modal',
+  props: {
+    item: {
+      type: Object,
+      default: () => ({})
+    },
+    activeStatus: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ['setIframe'],
+  setup(props, { emit }) {
+    const userStore = useUserStore();
+    const iframeRef = ref();
+    const isLoaded = ref(false);
+
+    // const src = `${vaildMusicScoreUrl()}/instrument/#/view-figner?Authorization=${
+    //   userStore.getToken
+    // }&code=${item.code}&platform=pc&type=listenMode`;
+    // // const src = `http://192.168.3.220:3000/instrument.html#/view-figner?Authorization=${userStore.getToken}&code=${item.code}`;
+    // if (window.matchMedia('(display-mode: standalone)').matches) {
+    //   state.application = window.matchMedia(
+    //     '(display-mode: standalone)'
+    //   ).matches;
+    //   forms.previewModal = true;
+    //   forms.previewParams.src = src + '&matchMedia=1';
+    // } else {
+    //   window.open(src);
+    // }
+
+    const src = `${vaildMusicScoreUrl()}/instrument/#/view-figner?Authorization=${
+      userStore.getToken
+    }&code=${props.item.content}&platform=pc&type=listenMode`;
+    // if (/(localhost|192)/.test(location.host)) {
+    //   src = `http://localhost:9002/#/tempo-practice?v=${Date.now()}&Authorization=${
+    //     userStore.getToken
+    //   }&platform=modal`;
+    // }
+    // if (props.item.dataJson) {
+    //   src += '&dataJson=' + props.item.dataJson;
+    // }
+
+    watch(
+      () => props.activeStatus,
+      () => {
+        if (!props.activeStatus) {
+          iframeRef.value.contentWindow?.postMessage({ api: 'resetPlay' }, '*');
+        }
+      }
+    );
+    return () => (
+      <div class={styles.musicScore}>
+        <iframe
+          ref={iframeRef}
+          onLoad={() => {
+            emit('setIframe', iframeRef.value);
+            isLoaded.value = true;
+          }}
+          class={[styles.container, 'musicIframe']}
+          frameborder="0"
+          src={src}></iframe>
+      </div>
+    );
+  }
+});

src/views/attend-class/index.tsx

@@ -84,6 +84,7 @@ import RhythmModal from './component/rhythm-modal';
 import InstruemntDetail from '/src/views/prepare-lessons/model/source-instrument/detail';
 import TheotyDetail from '/src/views/prepare-lessons/model/source-knowledge/detail';
 import MusicDetail from '/src/views/prepare-lessons/model/source-music/detail';
+import ListenModal from '/src/components/card-preview/listen-modal';
 
 export type ToolType = 'init' | 'pen' | 'whiteboard' | 'call';
 export type ToolItem = {
@@ -1587,6 +1588,14 @@ export default defineComponent({
                             m.iframeRef = el;
                           }}
                         />
+                      ) : m.type === 'LISTEN' ? (
+                        <ListenModal
+                          item={m}
+                          activeStatus={popupData.activeIndex === mIndex}
+                          onSetIframe={(el: any) => {
+                            m.iframeRef = el;
+                          }}
+                        />
                       ) : m.type === 'INSTRUMENT' || m.type === 'MUSICIAN' ? (
                         <InstruemntDetail
                           type="preview"

src/views/prepare-lessons/components/lesson-main/courseware/addCourseware.tsx

@@ -301,17 +301,18 @@ export default defineComponent({
         }
 
         forms.messageOperation.loading = true;
-        await onSaveCourseWare();
+        const resultStatus = await onSaveCourseWare();
         forms.messageOperation.loading = false;
-
-        if (
-          type === 'pageLive' &&
-          typeof forms.messageCallBack === 'function'
-        ) {
-          forms.messageCallBack();
+        if (resultStatus) {
+          if (
+            type === 'pageLive' &&
+            typeof forms.messageCallBack === 'function'
+          ) {
+            forms.messageCallBack();
+          }
+          emit('change', { status: false });
+          eventGlobal.emit('teacher-slideshow', false);
         }
-        emit('change', { status: false });
-        eventGlobal.emit('teacher-slideshow', false);
       }
       forms.messageOperation.visiable = false;
     };
@@ -376,12 +377,17 @@ export default defineComponent({
           message.error('请至少添加一个资源');
           return;
         }
-        await onSaveCourseWare(true);
+        const resultStatus = await onSaveCourseWare();
+
+        if (resultStatus) {
+          emit('change', { status: false });
+          eventGlobal.emit('teacher-slideshow', false);
+        }
       } catch {
         //
       }
     };
-    const onSaveCourseWare = async (hasBack = false) => {
+    const onSaveCourseWare = async () => {
       try {
         const params = {
           name: forms.name,
@@ -391,7 +397,6 @@ export default defineComponent({
           chapterKnowledgeList: [] as any
         };
 
-        console.log(forms.coursewareList, '121212');
         forms.coursewareList.forEach((item: any) => {
           let tempItem: any = [];
           if (Array.isArray(item.list) && item.list.length > 0) {
@@ -428,12 +433,10 @@ export default defineComponent({
         }
         message.success('保存成功');
 
-        if (hasBack) {
-          emit('change', { status: false });
-          eventGlobal.emit('teacher-slideshow', false);
-        }
+        return true;
       } catch {
         //
+        return false;
       }
     };
 

src/views/prepare-lessons/model/add-other-source/index.tsx

@@ -280,10 +280,24 @@ export default defineComponent({
             onConfirm={async (item: any) => {
               //
               try {
-                // forms.editSubjectIds = subjectIds.join(',');
-                // await onOverEdit();
-                console.log(item, 'Subject');
+                state.musicStatus = false;
+                const value = item.subjectCode || [];
+                const temp: any[] = [];
+                value.forEach((item: any) => {
+                  temp.push({
+                    materialId: item.materialId,
+                    coverImg: item.coverImg,
+                    dataJson: null,
+                    title: item.title,
+                    isCollect: false,
+                    isSelected: false,
+                    content: item.content,
+                    type: 'LISTEN'
+                  });
+                });
                 state.listenStatus = false;
+                emit('comfirm', temp);
+                emit('close');
               } catch {
                 //
               }

src/views/prepare-lessons/model/subject-sync/index.tsx

@@ -4,6 +4,7 @@ import { NButton, NSpace, useMessage } from 'naive-ui';
 import { useCatchStore } from '/src/store/modules/catchData';
 import iconSelect from '../../images/icon-select.png';
 import { usePrepareStore } from '/src/store/modules/prepareLessons';
+import { PageEnum } from '/src/enums/pageEnum';
 
 export default defineComponent({
   name: 'subject-sync',
@@ -21,6 +22,24 @@ export default defineComponent({
     const selectSubjectIds = ref([] as any);
     const subjectList = ref([] as any);
 
+    const subjectImgs = {
+      Panpipes: 'https://oss.dayaedu.com/ktqy/17103860536976fd4a751.png',
+      Ocarina: 'https://oss.dayaedu.com/ktqy/171038605369851874b22.png',
+      Woodwind: 'https://oss.dayaedu.com/ktqy/17103860536966826c50d.png',
+      'Tenor Recorder':
+        'https://oss.dayaedu.com/ktqy/17103860536950592e357.png',
+      Nai: 'https://oss.dayaedu.com/ktqy/1710386053697af4aa985.png',
+      'Baroque Recorder':
+        'https://oss.dayaedu.com/ktqy/1710386053698031e847a.png'
+    } as any;
+    /*
+      https://oss.dayaedu.com/ktqy/17103860536950592e357.png
+      https://oss.dayaedu.com/ktqy/17103860536966826c50d.png
+      https://oss.dayaedu.com/ktqy/1710386053697af4aa985.png
+      https://oss.dayaedu.com/ktqy/17103860536976fd4a751.png
+      https://oss.dayaedu.com/ktqy/171038605369851874b22.png
+      https://oss.dayaedu.com/ktqy/1710386053698031e847a.png
+    */
     const onSubmit = () => {
       if (selectSubjectIds.value.length <= 0) {
         message.error('至少选择一个声部进行同步');
@@ -30,7 +49,15 @@ export default defineComponent({
       const subjectCode: any[] = [];
       subjectList.value.forEach((subject: any) => {
         if (selectSubjectIds.value.includes(subject.id)) {
-          subjectCode.push(subject.code);
+          subjectCode.push({
+            materialId: subject.id,
+            coverImg: subjectImgs[subject.code] || subjectImgs.Panpipes,
+            dataJson: null,
+            title: subject.name,
+            isCollect: false,
+            isSelected: false,
+            content: subject.code
+          });
         }
       });
       emit('confirm', { subjectIds: selectSubjectIds.value, subjectCode });
@@ -39,19 +66,19 @@ export default defineComponent({
       // 获取教材分类列表
       await catchStore.getSubjects();
 
-      const baseAllSubjectList = catchStore.getSubjectList;
-      const teachingSubjectList = prepareStore.getSubjectList; // 教材自带声部；
-      const tempSubjectList: any = [];
-      baseAllSubjectList.forEach((subject: any) => {
-        const index = teachingSubjectList.findIndex(
-          (t: any) => t.id == subject.id
-        );
-        if (index != -1) {
-          tempSubjectList.push(subject);
-        }
-      });
+      subjectList.value = catchStore.getSubjectList;
+      // const teachingSubjectList = prepareStore.getSubjectList; // 教材自带声部；
+      // const tempSubjectList: any = [];
+      // baseAllSubjectList.forEach((subject: any) => {
+      //   const index = teachingSubjectList.findIndex(
+      //     (t: any) => t.id == subject.id
+      //   );
+      //   if (index != -1) {
+      //     tempSubjectList.push(subject);
+      //   }
+      // });
 
-      subjectList.value = tempSubjectList;
+      // subjectList.value = tempSubjectList;
       if (props.subjectId) {
         selectSubjectIds.value = [Number(props.subjectId)];
       }