Merge branch 'iteration-classroom-listen' into jenkins

public/version.json

@@ -1 +1 @@
-{"version":1710391185678}
+{ "version": 1710391185678 }

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 = {
@@ -1588,6 +1589,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/home/modals/class-modal/index.module.less

@@ -88,7 +88,7 @@
       display: inline-block;
       width: 12px;
       height: 12px;
-      background: url('./images/blueArrow.png') no-repeat center;
+      background: url('../../images/blueArrow.png') no-repeat center;
       background-size: contain;
     }
   }

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

@@ -471,11 +471,6 @@
   }
 }
 
-
-.subjectSyncModal {
-  width: 1070px;
-}
-
 .addOtherSource {
   width: 726px;
 }

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

@@ -25,25 +25,25 @@ import {
 import CardType from '/src/components/card-type';
 // import AttendClass from '/src/views/prepare-lessons/model/attend-class';
 import { usePrepareStore } from '/src/store/modules/prepareLessons';
-import { useCatchStore } from '/src/store/modules/catchData';
+// import { useCatchStore } from '/src/store/modules/catchData';
 // import TheEmpty from '/src/components/TheEmpty';
 import {
   api_teacherChapterLessonCoursewareAdd,
   api_teacherChapterLessonCoursewareUpdate,
-  api_teacherChapterLessonCoursewareDetail,
+  api_teacherChapterLessonCoursewareDetail
   // courseScheduleStart,
   // queryCourseware,
-  saveCourseware
+  // saveCourseware
 } from '../../../api';
 import Draggable from 'vuedraggable';
 import iconDelete from '../../../images/icon-delete-default.png';
 import iconAddMusic from '../../../images/icon-add-music.png';
-import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router';
+// import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router';
 // import deepClone from '/src/helpers/deep-clone';
 import CardPreview from '/src/components/card-preview';
 import PreviewWindow from '/src/views/preview-window';
 // import { state } from '/src/state';
-import SubjectSync from '../../../model/subject-sync';
+// import SubjectSync from '../../../model/subject-sync';
 import { eventGlobal } from '/src/utils';
 // import iconTips from '../../../images/icon-tips.png';
 import TheMessageDialog from '/src/components/TheMessageDialog';
@@ -60,10 +60,10 @@ export default defineComponent({
   },
   emits: ['change'],
   setup(props, { emit }) {
-    const catchStore = useCatchStore();
+    // const catchStore = useCatchStore();
     const prepareStore = usePrepareStore();
     // const route = useRoute();
-    const router = useRouter();
+    // const router = useRouter();
     // const dialog = useDialog();
     const message = useMessage();
 
@@ -105,7 +105,6 @@ export default defineComponent({
         confirmButtonText: '确认',
         index: 0
       },
-      subjectSyncVisiable: false, // 同步声部
       show: false,
       item: {} as any,
       previewModal: false,
@@ -179,39 +178,39 @@ export default defineComponent({
     };
 
     // 完成编辑
-    const onOverEdit = async () => {
-      try {
-        const temp: any = [];
-        forms.coursewareList.forEach((item: any) => {
-          temp.push({
-            materialName: item.name,
-            materialType: item.type,
-            materialId: item.materialId,
-            id: item.id
-          });
-        });
-        // 保存课件
-        // 判断是否编辑，如果编辑则取选择的声部
-        await saveCourseware({
-          coursewareDetailKnowledgeId: prepareStore.getSelectKey,
-          lessonCoursewareId: prepareStore.getLessonCoursewareId,
-          lessonCoursewareDetailId: prepareStore.getLessonCoursewareDetailId,
-          // subjectId: forms.isEdit
-          //   ? forms.editSubjectIds
-          //   : prepareStore.getSubjectId,
-          materialList: [...temp]
-        });
-
-        message.success('编辑成功');
-        // forms.removeVisiable = false;
-        prepareStore.setIsEditResource(false);
-        // 重置临时删除编号
-        forms.removeIds = [];
-        await getList();
-      } catch {
-        //
-      }
-    };
+    // const onOverEdit = async () => {
+    //   try {
+    //     const temp: any = [];
+    //     forms.coursewareList.forEach((item: any) => {
+    //       temp.push({
+    //         materialName: item.name,
+    //         materialType: item.type,
+    //         materialId: item.materialId,
+    //         id: item.id
+    //       });
+    //     });
+    //     // 保存课件
+    //     // 判断是否编辑，如果编辑则取选择的声部
+    //     await saveCourseware({
+    //       coursewareDetailKnowledgeId: prepareStore.getSelectKey,
+    //       lessonCoursewareId: prepareStore.getLessonCoursewareId,
+    //       lessonCoursewareDetailId: prepareStore.getLessonCoursewareDetailId,
+    //       // subjectId: forms.isEdit
+    //       //   ? forms.editSubjectIds
+    //       //   : prepareStore.getSubjectId,
+    //       materialList: [...temp]
+    //     });
+
+    //     message.success('编辑成功');
+    //     // forms.removeVisiable = false;
+    //     prepareStore.setIsEditResource(false);
+    //     // 重置临时删除编号
+    //     forms.removeIds = [];
+    //     await getList();
+    //   } catch {
+    //     //
+    //   }
+    // };
 
     const isPointInsideElement = (element: any, x: number, y: number) => {
       const rect = element.getBoundingClientRect();
@@ -302,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;
     };
@@ -377,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,
@@ -392,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) {
@@ -429,12 +433,10 @@ export default defineComponent({
         }
         message.success('保存成功');
 
-        if (hasBack) {
-          emit('change', { status: false });
-          eventGlobal.emit('teacher-slideshow', false);
-        }
+        return true;
       } catch {
         //
+        return false;
       }
     };
 
@@ -922,28 +924,6 @@ export default defineComponent({
           params={forms.previewParams}
         />
 
-        {/* 完成编辑时，选择声部 */}
-        <NModal
-          v-model:show={forms.subjectSyncVisiable}
-          preset="card"
-          class={['modalTitle background', styles.subjectSyncModal]}
-          title={'同步声部'}>
-          <SubjectSync
-            subjectId={prepareStore.getSubjectId as any}
-            onClose={() => (forms.subjectSyncVisiable = false)}
-            onConfirm={async (subjectIds: any) => {
-              //
-              try {
-                forms.editSubjectIds = subjectIds.join(',');
-                await onOverEdit();
-                forms.subjectSyncVisiable = false;
-              } catch {
-                //
-              }
-            }}
-          />
-        </NModal>
-
         {/* 添加其它类型的资源 */}
         <NModal
           v-model:show={forms.addOtherSource}

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

@@ -66,4 +66,8 @@
 .theoryModal {
   width: 1360px;
   position: relative;
+}
+
+.subjectSyncModal {
+  width: 1070px;
 }

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

@@ -15,18 +15,21 @@ import SourceKnowledge from '../source-knowledge';
 import SourceMusician from '../source-musician';
 import SourceMusic from '../source-music';
 import { eventGlobal } from '/src/utils';
+import SubjectSync from '../subject-sync';
+import { usePrepareStore } from '/src/store/modules/prepareLessons';
 
 export default defineComponent({
   name: 'add-other-source',
   emits: ['close', 'comfirm'],
   setup(props, { emit }) {
+    const prepareStore = usePrepareStore();
     const router = useRouter();
     const sourceList = ref([
-      // {
-      //   image: icon1,
-      //   name: '听音练习',
-      //   index: 0
-      // },
+      {
+        image: icon1,
+        name: '听音练习',
+        index: 0
+      },
       {
         image: icon2,
         name: '节奏练习',
@@ -70,6 +73,9 @@ export default defineComponent({
 
     const onDetail = (item: any) => {
       switch (item.index) {
+        case 0:
+          state.listenStatus = true;
+          break;
         case 1:
           state.rhythmStatus = true;
           break;
@@ -261,6 +267,43 @@ export default defineComponent({
             }}
           />
         </NModal>
+
+        {/* 听音练习 */}
+        <NModal
+          v-model:show={state.listenStatus}
+          preset="card"
+          class={['modalTitle background', styles.subjectSyncModal]}
+          title={'听音练习'}>
+          <SubjectSync
+            // subjectId={prepareStore.getSubjectId as any}
+            onClose={() => (state.listenStatus = false)}
+            onConfirm={async (item: any) => {
+              //
+              try {
+                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 {
+                //
+              }
+            }}
+          />
+        </NModal>
       </>
     );
   }

src/views/prepare-lessons/model/subject-sync/index.module.less

@@ -28,7 +28,7 @@
   display: flex;
   align-items: center;
   flex-wrap: wrap;
-  padding: 0 30px;
+  padding: 40px 30px 0;
   gap: 20px 40px;
 }
 

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,42 +22,73 @@ 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('至少选择一个声部进行同步');
         return;
       }
 
-      emit('confirm', selectSubjectIds.value);
+      const subjectCode: any[] = [];
+      subjectList.value.forEach((subject: any) => {
+        if (selectSubjectIds.value.includes(subject.id)) {
+          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 });
     };
     onMounted(async () => {
       // 获取教材分类列表
       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 = tempSubjectList;
+      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;
       if (props.subjectId) {
         selectSubjectIds.value = [Number(props.subjectId)];
       }
     });
     return () => (
       <div class={styles.subjectSync}>
-        <div class={styles.tips}>
+        {/* <div class={styles.tips}>
           请选择当前课件可使用的乐器
           <span>（勾选后则对应乐器下的课件内容将被当前课件内容全部替换）</span>
-        </div>
+        </div> */}
 
         <div class={styles.subjectList}>
           {subjectList.value.map((subject: any) => (