update

src/components/course/CoursewareView.vue → src/views/new_task_view/components/common/CoursewareView.vue

@@ -67,7 +67,7 @@ export default {
 
 <script setup>
 import { watch, inject } from 'vue';
-import { useShowCourseware } from './courseware';
+import { useShowCourseware } from '@/components/course/courseware';
 
 const props = defineProps({
   coursewareData: {

src/views/new_task_view/components/common/SubtaskItem.vue

@@ -70,7 +70,7 @@ import {
 import { taskClassify } from '@/views/teacher/create_course/step_three/components/data/constant';
 import { useSwitch } from '@/utils/switch';
 
-import CoursewareView from '@/components/course/CoursewareView.vue';
+import CoursewareView from '@/views/new_task_view/components/common/CoursewareView.vue';
 import FileView from './FileView.vue';
 import MessageView from './MessageView.vue';
 

src/views/new_task_view/components/student/index.vue

@@ -111,7 +111,7 @@ import { MessageBox } from 'element-ui';
 
 import ShowFile from '@/common/show_file/index.vue';
 import FileView from '../common/FileView.vue';
-import CoursewareView from '@/components/course/CoursewareView.vue';
+import CoursewareView from '@/views/new_task_view/components/common/CoursewareView.vue';
 import MessageView from '../common/MessageView.vue';
 import SubtaskItem from '../common/SubtaskItem.vue';
 
@@ -351,7 +351,7 @@ function deleteSubtaskMessageItem(index, subIndex, infoIndex, i) {
   display: flex;
   flex-direction: column;
   row-gap: 48px;
-  width: 830px;
+  width: 910px;
   margin: 0 auto;
 
   & + .task {

src/views/new_task_view/components/teacher/index.vue

@@ -101,7 +101,7 @@ import { MessageBox } from 'element-ui';
 
 import ShowFile from '@/common/show_file/index.vue';
 import FileView from '../common/FileView.vue';
-import CoursewareView from '@/components/course/CoursewareView.vue';
+import CoursewareView from '@/views/new_task_view/components/common/CoursewareView.vue';
 import MessageView from '../common/MessageView.vue';
 import SubtaskItem from '../common/SubtaskItem.vue';
 
@@ -230,7 +230,7 @@ function addRemark(taskIndex) {
   display: flex;
   flex-direction: column;
   row-gap: 48px;
-  width: 830px;
+  width: 910px;
   margin: 0 auto;
 
   & + .task {

src/views/teacher/create_course/step_three/components/preview/task_preview/components/CoursewareView.vue

@@ -0,0 +1,76 @@
+<template>
+  <div class="courseware-container">
+    <template v-if="category === 'OC' || category.length === 0">
+      <bookquestion :context="context" />
+    </template>
+
+    <template v-else-if="category === 'AILP'">
+      <bookailp :context="context" :ui-type="ui_type" :preview-width="720" :preview-height="405" />
+    </template>
+
+    <template v-else-if="category === 'NPC'">
+      <booknpc
+        v-if="context"
+        ref="book"
+        :context="context"
+        task-model=""
+        :is-show-save="false"
+        :is-show-title="false"
+        :theme-color="themeColor"
+        :preview-type="previewType"
+        :preview-group-id="previewGroupId"
+      />
+    </template>
+
+    <template v-if="category === 'NNPE'">
+      <booknnpe
+        v-if="context"
+        ref="book"
+        :context="context"
+        :theme-color="themeColor"
+        task-model=""
+        :is-show-save="false"
+        :is-show-title="false"
+        :preview-type="previewType"
+        :preview-group-id="previewGroupId"
+      />
+    </template>
+
+    <template v-if="category === 'RLC'">
+      <bookrlc v-if="context" :context="context" :theme-color="themeColor" :book-font-size="bookFontSize" />
+    </template>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CoursewareView'
+};
+</script>
+
+<script setup>
+import { useShowCourseware } from '@/components/course/courseware.js';
+
+const props = defineProps({
+  coursewareId: {
+    type: String,
+    required: true
+  },
+  groupIdSelectedInfo: {
+    type: String,
+    required: true
+  }
+});
+
+const { context, ui_type, category, themeColor, bookFontSize, previewType, previewGroupId } = useShowCourseware(
+  props.coursewareId,
+  props.groupIdSelectedInfo,
+  'previewCheckShow'
+);
+</script>
+
+<style lang="scss" scoped>
+.courseware-container {
+  overflow: auto;
+}
+</style>

src/views/teacher/create_course/step_three/components/preview/task_preview/components/SubtaskItem.vue

@@ -50,7 +50,7 @@ import { getTaskClassifyAttr, getInfoBlockTypeCorrespondingTeachingType } from '
 import { taskClassify } from '../../../data/constant';
 import { useSwitch } from '@/utils/switch';
 
-import CoursewareView from '@/components/course/CoursewareView.vue';
+import CoursewareView from './CoursewareView.vue';
 import PreviewFile from './PreviewFile.vue';
 import PreviewMessage from './PreviewMessage.vue';
 

src/views/teacher/create_course/step_three/components/preview/task_preview/index.vue

@@ -66,7 +66,7 @@ import SubtaskItem from './components/SubtaskItem.vue';
 import ShowFile from '@/common/show_file/index.vue';
 import PreviewFile from './components/PreviewFile.vue';
 import PreviewMessage from './components/PreviewMessage.vue';
-import CoursewareView from '@/components/course/CoursewareView.vue';
+import CoursewareView from './components/CoursewareView.vue';
 
 const props = defineProps({
   listName: {
@@ -92,7 +92,7 @@ let { visible, curFileId, curFileName, dialogShowFileClose } = useShowFile();
 
 <style lang="scss" scoped>
 .preview {
-  width: 830px;
+  width: 910px;
   margin: 0 auto;
 
   & + .preview {