🐜 教育培训-平台资源库-课程管理-课件预览

src/views/platform_resource_library/courseware/data.vue

@@ -135,10 +135,6 @@
       :src="data.pdfDialog.src"
       v-model:visible="data.pdfDialog.visible"
     />
-    <layout-txt
-      :src="data.txtDialog.src"
-      v-model:visible="data.txtDialog.visible"
-    />
   </div>
 </template>
 
@@ -158,7 +154,6 @@ import { debounce } from "throttle-debounce";
 import { ElMessage, ElMessageBox } from "element-plus";
 import { useRouter } from "vue-router";
 import LayoutPdf from "@/components/pdf/index.vue";
-import LayoutTxt from "@/components/txt/index.vue";
 
 const router = useRouter();
 const { list, pagination, searchForm, fnGetData, fnResetPagination } =
@@ -173,10 +168,6 @@ const data = reactive({
     src: "",
     visible: false,
   },
-  txtDialog: {
-    src: "",
-    visible: false,
-  },
 });
 
 // const buttonJurisdiction = await useButtonJurisdiction("courseware"); 原项目没找到在哪用

src/views/platform_resource_library/courseware/video.vue

@@ -197,6 +197,9 @@ const fnAdd = debounce(1000, async (VIDEOCOURSEWARE_ID) => {
 });
 
 const fnPreviewVideo = async (row) => {
+  data.videoDialog.src = "";
+  data.videoDialog.vid = "";
+  data.videoDialog.playAuth = "";
   if (
     row.VIDEOCOURSEWARE_ID_REMOTE &&
     row.VIDEOCOURSEWARE_ID_REMOTE.length > 0
@@ -205,16 +208,19 @@ const fnPreviewVideo = async (row) => {
       VIDEOCOURSEWARE_ID: row.VIDEOCOURSEWARE_ID_REMOTE,
       CURRICULUM_ID: row.CURRICULUM_ID_REMOTE,
     });
-    if (respData && respData.result === "success") {
+    if (respData && respData.type === "success") {
-      data.videoDialog.playAuth = respData.playAuth;
+      const video = {};
-      data.videoDialog.vid = row.VIDEOFILES;
+      respData.videoList.forEach((item) => {
+        video[item.definition] = item.playURL;
+      });
+      data.videoDialog.src = JSON.stringify(video);
       data.videoDialog.visible = true;
     }
   } else if (row.VIDEOFILES && row.VIDEOFILES.length > 0) {
     const respData = await getVideoAuth({
       videoId: row.VIDEOFILES,
     });
-    if (respData && respData.result === "success") {
+    if (respData && respData.type === "success") {
       data.videoDialog.playAuth = respData.playAuth;
       data.videoDialog.vid = row.VIDEOFILES;
       data.videoDialog.visible = true;

src/views/platform_resource_library/curriculum/view.vue

@@ -1,4 +1,5 @@
 <template>
+  <div>
     <layout-card>
       <el-divider content-position="left">课程信息</el-divider>
       <el-descriptions :column="1" border>
@@ -34,7 +35,24 @@
             show-overflow-tooltip
             prop="COURSEWARENAME"
             label="视频课件名称"
-        />
+          >
+            <template v-slot="{ row }">
+              <template
+                v-if="
+                  (row.VIDEOCOURSEWARE_ID_REMOTE &&
+                    row.VIDEOCOURSEWARE_ID_REMOTE.length > 0) ||
+                  (row.VIDEOFILES && row.VIDEOFILES.length > 0)
+                "
+              >
+                <a @click="fnPreviewVideo(row)">
+                  {{ row.COURSEWARENAME }}
+                </a>
+              </template>
+              <template v-else>
+                {{ row.COURSEWARENAME }}
+              </template>
+            </template>
+          </el-table-column>
           <el-table-column
             show-overflow-tooltip
             prop="post_type_name"
@@ -45,7 +63,11 @@
             prop="train_type_name"
             label="培训行业类型"
           />
-        <el-table-column show-overflow-tooltip prop="CLASSHOUR" label="学时" />
+          <el-table-column
+            show-overflow-tooltip
+            prop="CLASSHOUR"
+            label="学时"
+          />
           <el-table-column
             show-overflow-tooltip
             prop="COURSEWAREINTRODUCE"
@@ -63,7 +85,18 @@
             show-overflow-tooltip
             prop="COURSEWARENAME"
             label="资料课件名称"
-        />
+          >
+            <template v-slot="{ row }">
+              <template v-if="interceptTheSuffix(row.COURSEWAREFILES, '.pdf')">
+                <a @click="fnPreviewPdf(row.COURSEWAREFILES)">
+                  {{ row.COURSEWARENAME }}
+                </a>
+              </template>
+              <template v-else>
+                {{ row.COURSEWARENAME }}
+              </template>
+            </template>
+          </el-table-column>
           <el-table-column
             show-overflow-tooltip
             prop="post_type_name"
@@ -74,7 +107,11 @@
             prop="train_type_name"
             label="培训行业类型"
           />
-        <el-table-column show-overflow-tooltip prop="CLASSHOUR" label="学时" />
+          <el-table-column
+            show-overflow-tooltip
+            prop="CLASSHOUR"
+            label="学时"
+          />
           <el-table-column
             show-overflow-tooltip
             prop="COURSEWAREINTRODUCE"
@@ -88,6 +125,17 @@
         </layout-table>
       </template>
     </layout-card>
+    <layout-pdf
+      :src="data.pdfDialog.src"
+      v-model:visible="data.pdfDialog.visible"
+    />
+    <layout-video
+      :src="data.videoDialog.src"
+      :vid="data.videoDialog.vid"
+      :play-auth="data.videoDialog.playAuth"
+      v-model:visible="data.videoDialog.visible"
+    />
+  </div>
 </template>
 
 <script setup>
@@ -95,6 +143,10 @@ import LayoutTable from "@/components/table/index.vue";
 import { reactive } from "vue";
 import { useRoute } from "vue-router";
 import { getCurriculumInfo } from "@/request/platform_resource_library.js";
+import LayoutPdf from "@/components/pdf/index.vue";
+import LayoutVideo from "@/components/video/index.vue";
+import { getVideoAuth, getVideoSource } from "@/request/api.js";
+import { interceptTheSuffix } from "@/assets/js/utils.js";
 
 const FILE_URL = import.meta.env.VITE_FILE_URL;
 
@@ -104,6 +156,16 @@ const { CURRICULUM_ID } = route.query;
 const data = reactive({
   curriculumInfo: {},
   chapterList: [],
+  pdfDialog: {
+    src: "",
+    visible: false,
+  },
+  videoDialog: {
+    src: "",
+    vid: "",
+    playAuth: "",
+    visible: false,
+  },
 });
 
 const fnGetCurriculumInfo = async () => {
@@ -114,6 +176,43 @@ const fnGetCurriculumInfo = async () => {
   }
 };
 await fnGetCurriculumInfo();
+
+const fnPreviewPdf = (FILEPATH) => {
+  data.pdfDialog.visible = true;
+  data.pdfDialog.src = FILEPATH;
+};
+
+const fnPreviewVideo = async (row) => {
+  data.videoDialog.src = "";
+  data.videoDialog.vid = "";
+  data.videoDialog.playAuth = "";
+  if (
+    row.VIDEOCOURSEWARE_ID_REMOTE &&
+    row.VIDEOCOURSEWARE_ID_REMOTE.length > 0
+  ) {
+    const respData = await getVideoSource({
+      VIDEOCOURSEWARE_ID: row.VIDEOCOURSEWARE_ID_REMOTE,
+      CURRICULUM_ID: row.CURRICULUM_ID_REMOTE,
+    });
+    if (respData && respData.type === "success") {
+      const video = {};
+      respData.videoList.forEach((item) => {
+        video[item.definition] = item.playURL;
+      });
+      data.videoDialog.src = JSON.stringify(video);
+      data.videoDialog.visible = true;
+    }
+  } else if (row.VIDEOFILES && row.VIDEOFILES.length > 0) {
+    const respData = await getVideoAuth({
+      videoId: row.VIDEOFILES,
+    });
+    if (respData && respData.type === "success") {
+      data.videoDialog.playAuth = respData.playAuth;
+      data.videoDialog.vid = row.VIDEOFILES;
+      data.videoDialog.visible = true;
+    }
+  }
+};
 </script>
 
 <style scoped lang="scss"></style>