wangpeng
/
integrated_traffic_vue
forked from integrated_whb/integrated_whb_vue
1
0
Fork 0
Code Pull Requests Activity

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

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/views/platform_resource_library/courseware/data.vue
View File

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

14
src/views/platform_resource_library/courseware/video.vue
View File

@ -197,6 +197,9 @@ const fnAdd = debounce(1000, async (VIDEOCOURSEWARE_ID) => {
}); });
const fnPreviewVideo = async (row) => { const fnPreviewVideo = async (row) => {
data.videoDialog.src = "";
data.videoDialog.vid = "";
data.videoDialog.playAuth = "";
if ( if (
row.VIDEOCOURSEWARE_ID_REMOTE && row.VIDEOCOURSEWARE_ID_REMOTE &&
row.VIDEOCOURSEWARE_ID_REMOTE.length > 0 row.VIDEOCOURSEWARE_ID_REMOTE.length > 0
@ -205,16 +208,19 @@ const fnPreviewVideo = async (row) => {
VIDEOCOURSEWARE_ID: row.VIDEOCOURSEWARE_ID_REMOTE, VIDEOCOURSEWARE_ID: row.VIDEOCOURSEWARE_ID_REMOTE,
CURRICULUM_ID: row.CURRICULUM_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; data.videoDialog.visible = true;
} }
} else if (row.VIDEOFILES && row.VIDEOFILES.length > 0) { } else if (row.VIDEOFILES && row.VIDEOFILES.length > 0) {
const respData = await getVideoAuth({ const respData = await getVideoAuth({
videoId: row.VIDEOFILES, videoId: row.VIDEOFILES,
}); });
if (respData && respData.result === "success") { if (respData && respData.type === "success") {
data.videoDialog.playAuth = respData.playAuth; data.videoDialog.playAuth = respData.playAuth;
data.videoDialog.vid = row.VIDEOFILES; data.videoDialog.vid = row.VIDEOFILES;
data.videoDialog.visible = true; data.videoDialog.visible = true;

277
src/views/platform_resource_library/curriculum/view.vue
View File

@ -1,93 +1,141 @@
<template> <template>
<layout-card> <div>
<el-divider content-position="left">课程信息</el-divider> <layout-card>
<el-descriptions :column="1" border> <el-divider content-position="left">课程信息</el-divider>
<el-descriptions-item label="课程名称"> <el-descriptions :column="1" border>
{{ data.curriculumInfo.CURRICULUMNAME }} <el-descriptions-item label="课程名称">
</el-descriptions-item> {{ data.curriculumInfo.CURRICULUMNAME }}
<el-descriptions-item label="培训行业类型"> </el-descriptions-item>
{{ <el-descriptions-item label="培训行业类型">
data.curriculumInfo.CURRENCY === "1" {{
? "通用" data.curriculumInfo.CURRENCY === "1"
: data.curriculumInfo.train_type_name ? "通用"
}} : data.curriculumInfo.train_type_name
</el-descriptions-item> }}
<el-descriptions-item label="岗位培训类型"> </el-descriptions-item>
{{ data.curriculumInfo.post_type_name }} <el-descriptions-item label="岗位培训类型">
</el-descriptions-item> {{ data.curriculumInfo.post_type_name }}
<el-descriptions-item label="课程图片"> </el-descriptions-item>
<img <el-descriptions-item label="课程图片">
:src="FILE_URL + data.curriculumInfo.CAPTURE" <img
width="100" :src="FILE_URL + data.curriculumInfo.CAPTURE"
height="100" width="100"
/> height="100"
</el-descriptions-item> />
<el-descriptions-item label="课程介绍"> </el-descriptions-item>
{{ data.curriculumInfo.CURRICULUMINTRODUCE }} <el-descriptions-item label="课程介绍">
</el-descriptions-item> {{ data.curriculumInfo.CURRICULUMINTRODUCE }}
</el-descriptions> </el-descriptions-item>
<template v-for="(chapter, index) in data.chapterList" :key="index"> </el-descriptions>
<el-divider content-position="left">{{ data.NAME }}</el-divider> <template v-for="(chapter, index) in data.chapterList" :key="index">
<el-divider content-position="left">视频课件</el-divider> <el-divider content-position="left">{{ data.NAME }}</el-divider>
<layout-table :data="chapter.xzVideoList" :showPagination="false"> <el-divider content-position="left">视频课件</el-divider>
<el-table-column <layout-table :data="chapter.xzVideoList" :showPagination="false">
show-overflow-tooltip <el-table-column
prop="COURSEWARENAME" show-overflow-tooltip
label="视频课件名称" prop="COURSEWARENAME"
/> label="视频课件名称"
<el-table-column >
show-overflow-tooltip <template v-slot="{ row }">
prop="post_type_name" <template
label="岗位培训类型" v-if="
/> (row.VIDEOCOURSEWARE_ID_REMOTE &&
<el-table-column row.VIDEOCOURSEWARE_ID_REMOTE.length > 0) ||
show-overflow-tooltip (row.VIDEOFILES && row.VIDEOFILES.length > 0)
prop="train_type_name" "
label="培训行业类型" >
/> <a @click="fnPreviewVideo(row)">
<el-table-column show-overflow-tooltip prop="CLASSHOUR" label="学时" /> {{ row.COURSEWARENAME }}
<el-table-column </a>
show-overflow-tooltip </template>
prop="COURSEWAREINTRODUCE" <template v-else>
label="课件描述" {{ row.COURSEWARENAME }}
/> </template>
<el-table-column </template>
show-overflow-tooltip </el-table-column>
prop="teacherName" <el-table-column
label="讲师" show-overflow-tooltip
/> prop="post_type_name"
</layout-table> label="岗位培训类型"
<el-divider content-position="left">资料课件</el-divider> />
<layout-table :data="chapter.xzDataList" :showPagination="false"> <el-table-column
<el-table-column show-overflow-tooltip
show-overflow-tooltip prop="train_type_name"
prop="COURSEWARENAME" label="培训行业类型"
label="资料课件名称" />
/> <el-table-column
<el-table-column show-overflow-tooltip
show-overflow-tooltip prop="CLASSHOUR"
prop="post_type_name" label="学时"
label="岗位培训类型" />
/> <el-table-column
<el-table-column show-overflow-tooltip
show-overflow-tooltip prop="COURSEWAREINTRODUCE"
prop="train_type_name" label="课件描述"
label="培训行业类型" />
/> <el-table-column
<el-table-column show-overflow-tooltip prop="CLASSHOUR" label="学时" /> show-overflow-tooltip
<el-table-column prop="teacherName"
show-overflow-tooltip label="讲师"
prop="COURSEWAREINTRODUCE" />
label="课件描述" </layout-table>
/> <el-divider content-position="left">资料课件</el-divider>
<el-table-column <layout-table :data="chapter.xzDataList" :showPagination="false">
show-overflow-tooltip <el-table-column
prop="teacherName" show-overflow-tooltip
label="讲师" prop="COURSEWARENAME"
/> label="资料课件名称"
</layout-table> >
</template> <template v-slot="{ row }">
</layout-card> <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"
label="岗位培训类型"
/>
<el-table-column
show-overflow-tooltip
prop="train_type_name"
label="培训行业类型"
/>
<el-table-column
show-overflow-tooltip
prop="CLASSHOUR"
label="学时"
/>
<el-table-column
show-overflow-tooltip
prop="COURSEWAREINTRODUCE"
label="课件描述"
/>
<el-table-column
show-overflow-tooltip
prop="teacherName"
label="讲师"
/>
</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> </template>
<script setup> <script setup>
@ -95,6 +143,10 @@ import LayoutTable from "@/components/table/index.vue";
import { reactive } from "vue"; import { reactive } from "vue";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import { getCurriculumInfo } from "@/request/platform_resource_library.js"; 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; const FILE_URL = import.meta.env.VITE_FILE_URL;
@ -104,6 +156,16 @@ const { CURRICULUM_ID } = route.query;
const data = reactive({ const data = reactive({
curriculumInfo: {}, curriculumInfo: {},
chapterList: [], chapterList: [],
pdfDialog: {
src: "",
visible: false,
},
videoDialog: {
src: "",
vid: "",
playAuth: "",
visible: false,
},
}); });
const fnGetCurriculumInfo = async () => { const fnGetCurriculumInfo = async () => {
@ -114,6 +176,43 @@ const fnGetCurriculumInfo = async () => {
} }
}; };
await fnGetCurriculumInfo(); 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> </script>
<style scoped lang="scss"></style> <style scoped lang="scss"></style>