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

pull/1/head
duhang 2024-01-10 10:58:32 +08:00
parent 24387955fe
commit 3ef14d2406
3 changed files with 198 additions and 102 deletions

View File

@ -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");

View File

@ -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") {
data.videoDialog.playAuth = respData.playAuth;
data.videoDialog.vid = row.VIDEOFILES;
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.result === "success") {
if (respData && respData.type === "success") {
data.videoDialog.playAuth = respData.playAuth;
data.videoDialog.vid = row.VIDEOFILES;
data.videoDialog.visible = true;

View File

@ -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>