Skip to content

C
center-resource
提交 7ff44ed3 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

update

上级 38bb54e2
隐藏空白字符变更
内嵌 并排
正在显示 包含 201 行增加 和 113 行删除
src/components/base/PreviewFiles.vue
浏览文件 @ 7ff44ed3
...@@ -6,25 +6,32 @@ const props = defineProps({ ...@@ -6,25 +6,32 @@ const props = defineProps({
} }
}) })
// 判断展示标签 let isShowType = ref(1)
let isIframeShow = ref(true) // 判断用什么标签展示内容
// 不可用iframe展示的文件 if (props.url?.indexOf('.pdf') !== -1 || props.url?.indexOf('.txt') !== -1) {
const filesType = ['.pdf', '.txt'] isShowType.value = 2
filesType.forEach((item: string) => { } else if (props.url?.indexOf('.mp4') !== -1) {
if (props.url?.indexOf(item) != -1) { isShowType.value = 3
isIframeShow.value = false } else if (props.url?.indexOf('.mp3') !== -1) {
} isShowType.value = 4
}) } else if (props.url?.indexOf('.png') !== -1 || props.url?.indexOf('.jpg') !== -1 || props.url?.indexOf('.jpeg') !== -1) {
isShowType.value = 5
}
</script> </script>
<template> <template>
<iframe <iframe
v-if="isIframeShow" v-if="isShowType === 1"
width="812" width="812"
height="433" height="433"
:src="`https://view.officeapps.live.com/op/view.aspx?src=${props.url}`" :src="`https://view.officeapps.live.com/op/view.aspx?src=${props.url}`"
></iframe> ></iframe>
<embed width="812" height="433" :src="props.url" v-else /> <embed width="812" height="433" :src="props.url" v-else-if="isShowType === 2" />
<video v-else-if="isShowType === 3" width="812" height="433" controls id="video">
<source :src="props.url" />
</video>
<audio v-else-if="isShowType === 4" :src="props.url" controls></audio>
<img v-else-if="isShowType === 5" :src="props.url" style="max-width:812px;display: block;">
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
</style> </style>
src/modules/resource/courseware/components/ViewBottom.vue
浏览文件 @ 7ff44ed3
...@@ -30,16 +30,36 @@ onMounted(() => { ...@@ -30,16 +30,36 @@ onMounted(() => {
}) })
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '访问时间', prop: 'name', align: 'center' }, { label: '访问时间', prop: 'date', align: 'center' },
{ label: '姓名', prop: 'bumen', align: 'center' }, { label: '姓名', prop: 'name', align: 'center' },
{ label: '所在项目', prop: 'update', align: 'center' }, { label: '所在项目', prop: 'project', align: 'center' },
{ label: '访问时长', prop: 'time', align: 'center' } { label: '访问时长', prop: 'duration', align: 'center' }
], ],
data: [ data: [
{ time: '111', id: 1, name: '宏观经济学.pptx', type: '1', index: '1', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, {
{ time: '111', id: 2, name: '宏观经济学.pptx', type: '2', index: '2', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, duration: '120分钟',
{ time: '111', id: 3, name: '宏观经济学.pptx', type: '3', index: '3', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, date: '2022-06-15',
{ time: '111', id: 4, name: '宏观经济学.pptx', type: '4', index: '4', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
}
] ]
} }
</script> </script>
......
src/modules/resource/courseware/views/View.vue
浏览文件 @ 7ff44ed3
...@@ -10,20 +10,20 @@ const id = route.query.id as string ...@@ -10,20 +10,20 @@ const id = route.query.id as string
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '课程图片', prop: 'img', align: 'center' }, { label: '课程图片', slots: 'table-img', align: 'center' },
{ label: '课程名称', prop: 'cursor_name', align: 'center' }, { label: '课程名称', prop: 'cursor_name', align: 'center' },
{ label: '分类名称', prop: 'type_name', align: 'center' }, { label: '分类名称', prop: 'type_name', align: 'center' },
{ label: '所在章', slots: 'zhang', align: 'center' }, { label: '所在章', prop: 'zhang', align: 'center' },
{ label: '所在小结', prop: 'jie', align: 'center' }, { label: '所在小结', prop: 'jie', align: 'center' },
{ label: '创建日期', prop: 'update', align: 'center' }, { label: '创建日期', prop: 'update', align: 'center' },
{ label: '操作', slots: 'table-operate', align: 'center' } { label: '操作', slots: 'table-operate', align: 'center' }
], ],
data: [ data: [
{ img: 1, cursor_name: '宏观经济学.pptx', type_name: '1', zhang: '1', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 2, cursor_name: '宏观经济学.pptx', type_name: '2', zhang: '2', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 3, cursor_name: '宏观经济学.pptx', type_name: '3', zhang: '3', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 4, cursor_name: '宏观经济学.pptx', type_name: '4', zhang: '4', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 5, cursor_name: '宏观经济学.pptx', type_name: '5', zhang: '5', jie: '吉林师范大学', update: '王重阳' } { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' }
] ]
} }
...@@ -43,6 +43,9 @@ getCourseDetails({ id: id }).then(res => { ...@@ -43,6 +43,9 @@ getCourseDetails({ id: id }).then(res => {
</AppCard> </AppCard>
<AppCard title="课件资源关联使用课程"> <AppCard title="课件资源关联使用课程">
<AppList v-bind="listOptions" ref="appList" stripe> <AppList v-bind="listOptions" ref="appList" stripe>
<template #table-img="{ row }">
<img :src="row.img" style="width: 100px;display:block;">
</template>
<template #table-operate="{ row }"> <template #table-operate="{ row }">
<el-space> <el-space>
<router-link :to="`/resource/courseware/update/?id=${row.id}`"> <router-link :to="`/resource/courseware/update/?id=${row.id}`">
......
src/modules/resource/lessonplan/components/ViewBottom.vue
浏览文件 @ 7ff44ed3
...@@ -30,16 +30,36 @@ onMounted(() => { ...@@ -30,16 +30,36 @@ onMounted(() => {
}) })
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '访问时间', prop: 'name', align: 'center' }, { label: '访问时间', prop: 'date', align: 'center' },
{ label: '姓名', prop: 'bumen', align: 'center' }, { label: '姓名', prop: 'name', align: 'center' },
{ label: '所在项目', prop: 'update', align: 'center' }, { label: '所在项目', prop: 'project', align: 'center' },
{ label: '访问时长', prop: 'time', align: 'center' } { label: '访问时长', prop: 'duration', align: 'center' }
], ],
data: [ data: [
{ time: '111', id: 1, name: '宏观经济学.pptx', type: '1', index: '1', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, {
{ time: '111', id: 2, name: '宏观经济学.pptx', type: '2', index: '2', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, duration: '120分钟',
{ time: '111', id: 3, name: '宏观经济学.pptx', type: '3', index: '3', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, date: '2022-06-15',
{ time: '111', id: 4, name: '宏观经济学.pptx', type: '4', index: '4', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
}
] ]
} }
</script> </script>
......
src/modules/resource/lessonplan/views/View.vue
浏览文件 @ 7ff44ed3
...@@ -9,20 +9,20 @@ const route = useRoute() ...@@ -9,20 +9,20 @@ const route = useRoute()
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '课程图片', prop: 'img', align: 'center' }, { label: '课程图片', slots: 'table-img', align: 'center' },
{ label: '课程名称', prop: 'cursor_name', align: 'center' }, { label: '课程名称', prop: 'cursor_name', align: 'center' },
{ label: '分类名称', prop: 'type_name', align: 'center' }, { label: '分类名称', prop: 'type_name', align: 'center' },
{ label: '所在章', slots: 'zhang', align: 'center' }, { label: '所在章', prop: 'zhang', align: 'center' },
{ label: '所在小结', prop: 'jie', align: 'center' }, { label: '所在小结', prop: 'jie', align: 'center' },
{ label: '创建日期', prop: 'update', align: 'center' }, { label: '创建日期', prop: 'update', align: 'center' },
{ label: '操作', slots: 'table-operate', align: 'center' } { label: '操作', slots: 'table-operate', align: 'center' }
], ],
data: [ data: [
{ img: 1, cursor_name: '宏观经济学.pptx', type_name: '1', zhang: '1', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 2, cursor_name: '宏观经济学.pptx', type_name: '2', zhang: '2', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 3, cursor_name: '宏观经济学.pptx', type_name: '3', zhang: '3', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 4, cursor_name: '宏观经济学.pptx', type_name: '4', zhang: '4', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 5, cursor_name: '宏观经济学.pptx', type_name: '5', zhang: '5', jie: '吉林师范大学', update: '王重阳' } { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' }
] ]
} }
const id = route.query.id as string const id = route.query.id as string
...@@ -42,6 +42,9 @@ getLessonDetails({ id: id }).then((res: any) => { ...@@ -42,6 +42,9 @@ getLessonDetails({ id: id }).then((res: any) => {
</AppCard> </AppCard>
<AppCard title="课件资源关联使用课程"> <AppCard title="课件资源关联使用课程">
<AppList v-bind="listOptions" ref="appList" stripe> <AppList v-bind="listOptions" ref="appList" stripe>
<template #table-img="{ row }">
<img :src="row.img" style="width: 100px;display:block;">
</template>
<template #table-operate="{ row }"> <template #table-operate="{ row }">
<el-space> <el-space>
<router-link :to="`/video/update/?id=${row.id}`"> <router-link :to="`/video/update/?id=${row.id}`">
......
src/modules/resource/other/components/ViewBottom.vue
浏览文件 @ 7ff44ed3
...@@ -30,16 +30,36 @@ onMounted(() => { ...@@ -30,16 +30,36 @@ onMounted(() => {
}) })
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '访问时间', prop: 'name', align: 'center' }, { label: '访问时间', prop: 'date', align: 'center' },
{ label: '姓名', prop: 'bumen', align: 'center' }, { label: '姓名', prop: 'name', align: 'center' },
{ label: '所在项目', prop: 'update', align: 'center' }, { label: '所在项目', prop: 'project', align: 'center' },
{ label: '访问时长', prop: 'time', align: 'center' } { label: '访问时长', prop: 'duration', align: 'center' }
], ],
data: [ data: [
{ time: '111', id: 1, name: '宏观经济学.pptx', type: '1', index: '1', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, {
{ time: '111', id: 2, name: '宏观经济学.pptx', type: '2', index: '2', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, duration: '120分钟',
{ time: '111', id: 3, name: '宏观经济学.pptx', type: '3', index: '3', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, date: '2022-06-15',
{ time: '111', id: 4, name: '宏观经济学.pptx', type: '4', index: '4', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
}
] ]
} }
</script> </script>
......
src/modules/resource/other/views/Update.vue
浏览文件 @ 7ff44ed3
...@@ -123,7 +123,7 @@ const protocol = ref(false) ...@@ -123,7 +123,7 @@ const protocol = ref(false)
<div> <div>
<div class="upload-video"> <div class="upload-video">
<div class="upload-box"> <div class="upload-box">
<AppUpload :limit="1" v-model="form.file"></AppUpload> <AppUpload accept=".doc,.docx,.xls,.xlsx,.pdf,.ppt,.pptx,.mp3,.mp4,.png,.jpeg,.jpg" :limit="1" v-model="form.file"></AppUpload>
<div class="upload-btn">本地文件</div> <div class="upload-btn">本地文件</div>
</div> </div>
</div> </div>
......
src/modules/resource/other/views/View.vue
浏览文件 @ 7ff44ed3
...@@ -11,20 +11,20 @@ const id = route.query.id as string ...@@ -11,20 +11,20 @@ const id = route.query.id as string
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '课程图片', prop: 'img', align: 'center' }, { label: '课程图片', slots: 'table-img', align: 'center' },
{ label: '课程名称', prop: 'cursor_name', align: 'center' }, { label: '课程名称', prop: 'cursor_name', align: 'center' },
{ label: '分类名称', prop: 'type_name', align: 'center' }, { label: '分类名称', prop: 'type_name', align: 'center' },
{ label: '所在章', slots: 'zhang', align: 'center' }, { label: '所在章', prop: 'zhang', align: 'center' },
{ label: '所在小结', prop: 'jie', align: 'center' }, { label: '所在小结', prop: 'jie', align: 'center' },
{ label: '创建日期', prop: 'update', align: 'center' }, { label: '创建日期', prop: 'update', align: 'center' },
{ label: '操作', slots: 'table-operate', align: 'center' } { label: '操作', slots: 'table-operate', align: 'center' }
], ],
data: [ data: [
{ img: 1, cursor_name: '宏观经济学.pptx', type_name: '1', zhang: '1', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 2, cursor_name: '宏观经济学.pptx', type_name: '2', zhang: '2', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 3, cursor_name: '宏观经济学.pptx', type_name: '3', zhang: '3', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 4, cursor_name: '宏观经济学.pptx', type_name: '4', zhang: '4', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 5, cursor_name: '宏观经济学.pptx', type_name: '5', zhang: '5', jie: '吉林师范大学', update: '王重阳' } { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' }
] ]
} }
...@@ -37,13 +37,16 @@ getOtherDetails({ id: id }).then((res: any) => { ...@@ -37,13 +37,16 @@ getOtherDetails({ id: id }).then((res: any) => {
<template> <template>
<AppCard title="课件资源信息"> <AppCard title="课件资源信息">
<Operation :data="otherDetails" style="margin-bottom: 20px"></Operation> <Operation :data="otherDetails"></Operation>
<ViewTop :data="otherDetails"></ViewTop> <ViewTop :data="otherDetails"></ViewTop>
<ViewCenter v-if="Object.keys(otherDetails).length" :data="otherDetails"></ViewCenter> <ViewCenter v-if="Object.keys(otherDetails).length" :data="otherDetails"></ViewCenter>
<ViewBottom></ViewBottom> <ViewBottom></ViewBottom>
</AppCard> </AppCard>
<AppCard title="课件资源关联使用课程"> <AppCard title="课件资源关联使用课程">
<AppList v-bind="listOptions" ref="appList" stripe> <AppList v-bind="listOptions" ref="appList" stripe>
<template #table-img="{ row }">
<img :src="row.img" style="width: 100px;display:block;">
</template>
<template #table-operate="{ row }"> <template #table-operate="{ row }">
<el-space> <el-space>
<router-link :to="`/other/update/?id=${row.id}`"> <router-link :to="`/other/update/?id=${row.id}`">
......
src/modules/resource/video/components/ViewBottom.vue
浏览文件 @ 7ff44ed3
<script setup lang="ts"> <script setup lang="ts">
import * as echarts from "echarts" import * as echarts from 'echarts'
const echartsRef = ref() const echartsRef = ref()
onMounted(() => { onMounted(() => {
const myEcharts = echarts.init(echartsRef.value) const myEcharts = echarts.init(echartsRef.value)
...@@ -23,80 +23,92 @@ onMounted(() => { ...@@ -23,80 +23,92 @@ onMounted(() => {
barWidth: '18', barWidth: '18',
data: [5, 20, 36, 10, 10, 20] data: [5, 20, 36, 10, 10, 20]
} }
], ]
} }
//设置配置 //设置配置
myEcharts.setOption(option) myEcharts.setOption(option)
}) })
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '访问时间', prop: 'name', align: 'center' }, { label: '访问时间', prop: 'date', align: 'center' },
{ label: '姓名', prop: 'bumen', align: 'center' }, { label: '姓名', prop: 'name', align: 'center' },
{ label: '所在项目', prop: 'update', align: 'center' }, { label: '所在项目', prop: 'project', align: 'center' },
{ label: '访问时长', prop: 'time', align: 'center' } { label: '访问时长', prop: 'duration', align: 'center' }
], ],
data: [ data: [
{ time: '111', id: 1, name: '宏观经济学.pptx', type: '1', index: '1', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, {
{ time: '111', id: 2, name: '宏观经济学.pptx', type: '2', index: '2', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, duration: '120分钟',
{ time: '111', id: 3, name: '宏观经济学.pptx', type: '3', index: '3', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, date: '2022-06-15',
{ time: '111', id: 4, name: '宏观经济学.pptx', type: '4', index: '4', bumen: '吉林师范大学', update: '王重阳', relation: '22' }, name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
},
{
duration: '120分钟',
date: '2022-06-15',
name: '王重阳',
project: '资源管理系统',
}
] ]
} }
</script> </script>
<template> <template>
<div class="data-box"> <div class="data-box">
<div class="echart"> <div class="echart">
<div class="name">访问量/关联量一周走势图</div> <div class="name">访问量/关联量一周走势图</div>
<div <div
class="echarts" class="echarts"
ref="echartsRef" ref="echartsRef"
:style="{ :style="{
width: '600px', width: '600px',
height: '300px' height: '300px'
}" }"
></div> ></div>
</div> </div>
<div class="label-box"> <div class="label-box">
<div class="name">最近访问</div> <div class="name">最近访问</div>
<AppList v-bind="listOptions" ref="appList" stripe></AppList> <AppList v-bind="listOptions" ref="appList" stripe></AppList>
</div>
</div> </div>
</div>
<!-- <div
class="echarts"
ref="echartsRef"
:style="{
width: '600px',
height: '300px'
}"
></div> -->
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.data-box{ .data-box {
display: flex; display: flex;
.echart{ .echart {
flex: 1; flex: 1;
height: 369px; height: 369px;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid #E0E0E0; border: 1px solid #e0e0e0;
border-radius: 10px; border-radius: 10px;
margin-right: 10px; margin-right: 10px;
padding: 20px; padding: 20px;
.name{ .name {
font-size: 16px; font-size: 16px;
line-height: 100%; line-height: 100%;
color: #333333; color: #333333;
} }
} }
.label-box{ .label-box {
box-sizing: border-box; box-sizing: border-box;
flex: 1; flex: 1;
height: 369px; height: 369px;
border: 1px solid #E0E0E0; border: 1px solid #e0e0e0;
border-radius: 10px; border-radius: 10px;
margin-left: 10px; margin-left: 10px;
padding: 20px; padding: 20px;
.name{ .name {
font-size: 16px; font-size: 16px;
line-height: 100%; line-height: 100%;
color: #333333; color: #333333;
......
src/modules/resource/video/components/ViewCenter.vue
浏览文件 @ 7ff44ed3
...@@ -3,12 +3,9 @@ const props = defineProps(['data']) ...@@ -3,12 +3,9 @@ const props = defineProps(['data'])
</script> </script>
<template> <template>
<div class="center-video-box"> <div class="center-video-box">
<!-- <video width="812" height="433" controls> <video width="812" height="433" :poster="props.data.cover" controls>
<source :src="props.data.play_auth.play_info_list[0].PlayURL" type="video/mp4"> <source type="application/x-mpegURL" :src="props.data.play_auth.play_info_list[0].PlayURL">
</video> --> </video>
<video width="812" height="433" controls id="video" :src="props.data.play_auth.play_info_list[0].PlayURL" :poster="props.data.cover">
<source :src="props.data.play_auth.play_info_list[1].PlayURL" />
</video>
<div class="right-statistics"> <div class="right-statistics">
<div class="stat-item"> <div class="stat-item">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/center_resource/view-vicon1.png"> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/center_resource/view-vicon1.png">
......
src/modules/resource/video/components/ViewTop.vue
浏览文件 @ 7ff44ed3
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/center_resource/video-view-icon7.png" class="icons"> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/center_resource/video-view-icon7.png" class="icons">
<div class="text-box"> <div class="text-box">
<div class="name">视频分类</div> <div class="name">视频分类</div>
<div class="value">{{ props.data.classification_name }}</div> <div class="value">{{ props.data.classification_name || '暂无' }}</div>
</div> </div>
</div> </div>
<div class="i-items" style="align-items: flex-start;"> <div class="i-items" style="align-items: flex-start;">
......
src/modules/resource/video/views/View.vue
浏览文件 @ 7ff44ed3
...@@ -11,20 +11,20 @@ const id = route.query.id as string ...@@ -11,20 +11,20 @@ const id = route.query.id as string
const listOptions = { const listOptions = {
columns: [ columns: [
{ label: '课程图片', prop: 'img', align: 'center' }, { label: '课程图片', slots: 'table-img', align: 'center' },
{ label: '课程名称', prop: 'cursor_name', align: 'center' }, { label: '课程名称', prop: 'cursor_name', align: 'center' },
{ label: '分类名称', prop: 'type_name', align: 'center' }, { label: '分类名称', prop: 'type_name', align: 'center' },
{ label: '所在章', slots: 'zhang', align: 'center' }, { label: '所在章', prop: 'zhang', align: 'center' },
{ label: '所在小结', prop: 'jie', align: 'center' }, { label: '所在小结', prop: 'jie', align: 'center' },
{ label: '创建日期', prop: 'update', align: 'center' }, { label: '创建日期', prop: 'update', align: 'center' },
{ label: '操作', slots: 'table-operate', align: 'center' } { label: '操作', slots: 'table-operate', align: 'center' }
], ],
data: [ data: [
{ img: 1, cursor_name: '宏观经济学.pptx', type_name: '1', zhang: '1', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 2, cursor_name: '宏观经济学.pptx', type_name: '2', zhang: '2', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 3, cursor_name: '宏观经济学.pptx', type_name: '3', zhang: '3', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 4, cursor_name: '宏观经济学.pptx', type_name: '4', zhang: '4', jie: '吉林师范大学', update: '王重阳' }, { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' },
{ img: 5, cursor_name: '宏观经济学.pptx', type_name: '5', zhang: '5', jie: '吉林师范大学', update: '王重阳' } { img: 'https://webapp-pub.ezijing.com/upload/admin/527caa9260ce1d6f9b2477902337e9e4.jpeg', cursor_name: '宏观经济学', type_name: '产业学院', zhang: '第一章', jie: '第三小节', update: '2020-01-01' }
] ]
} }
...@@ -44,6 +44,9 @@ getVideoDetails({ id: id }).then(res => { ...@@ -44,6 +44,9 @@ getVideoDetails({ id: id }).then(res => {
</AppCard> </AppCard>
<AppCard title="视频资源信息"> <AppCard title="视频资源信息">
<AppList v-bind="listOptions" ref="appList" stripe> <AppList v-bind="listOptions" ref="appList" stripe>
<template #table-img="{ row }">
<img :src="row.img" style="width: 100px;display:block;">
</template>
<template #table-operate="{ row }"> <template #table-operate="{ row }">
<el-space> <el-space>
<router-link :to="`/video/update/${row.id}`"> <router-link :to="`/video/update/${row.id}`">
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论