From ff46cc24356b2cd2f23ab3cd7892e61b682d2b8c Mon Sep 17 00:00:00 2001
From: 祖安之光 <11848914+light-of-zuan@user.noreply.gitee.com>
Date: Mon, 11 May 2026 10:03:42 +0800
Subject: [PATCH] 主线提交
---
src/views/onlineEducation/courseManage/courseResource/index.vue | 84 +++++++++++++++++++++++++++++++++++------
1 files changed, 71 insertions(+), 13 deletions(-)
diff --git a/src/views/onlineEducation/courseManage/courseResource/index.vue b/src/views/onlineEducation/courseManage/courseResource/index.vue
index e0b3274..c4ae811 100644
--- a/src/views/onlineEducation/courseManage/courseResource/index.vue
+++ b/src/views/onlineEducation/courseManage/courseResource/index.vue
@@ -1,22 +1,51 @@
<template>
<div class="app-container">
- <div style="margin-bottom: 10px">
- <el-button
- type="primary"
- plain
- icon="Plus"
- @click="openDialog('add',{})"
- >新增</el-button>
+ <div style="display: flex;justify-content: space-between">
+ <el-form :inline="true" style="display: flex;align-items: center;flex-wrap: wrap;" >
+ <el-form-item>
+ <el-button
+ type="primary"
+ plain
+ icon="Plus"
+ @click="openDialog('add',{})"
+ >新增</el-button>
+ </el-form-item>
+ <el-form-item label="资源名称：" >
+ <el-input v-model="data.queryParams.name" placeholder="请输入资源名称"></el-input>
+ </el-form-item>
+ <el-form-item >
+ <el-button
+ type="primary"
+ @click="getList"
+ >查询</el-button>
+ <el-button
+ type="primary"
+ plain
+ @click="reset"
+ >重置</el-button>
+ </el-form-item>
+ </el-form>
</div>
<!-- 表格数据 -->
<el-table v-loading="loading" :data="dataList" :border="true">
<el-table-column label="序号" type="index" align="center" width="80" />
- <el-table-column label="资源名称" prop="name" align="center" />
+ <el-table-column label="资源名称" prop="name" align="center" >
+ <template #default="scope">
+ <div style="display:flex;align-items: center;justify-content: center">
+ <span >{{scope.row.name}}</span>
+ <VideoPlay v-if="scope.row.resourceType === 1" style="width: 1em; height: 1em; margin-left: 3px;cursor: pointer" @click="openVideo(scope.row)" />
+ </div>
+ </template>
+ </el-table-column>
<el-table-column label="资源大小" prop="sizeMB" align="center" >
</el-table-column>
<el-table-column label="资源类型" prop="resourceType" align="center" >
<template #default="scope">
- <span>{{scope.row.resourceType == 1 ? '视频':scope.row.resourceType == 2 ? '音频':'文档'}}</span>
+ <div style="display: flex;flex-direction: column">
+ <span>{{scope.row.resourceType == 1 ? '视频':scope.row.resourceType == 2 ? '音频':'文档'}}</span>
+ <span style="font-size: 14px">{{scope.row.timeFormat}}</span>
+ </div>
+
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
@@ -34,23 +63,29 @@
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
-<resource-dialog ref="dialogRef" @getList="getList"></resource-dialog>
+ <resource-dialog ref="dialogRef" @getList="getList"></resource-dialog>
+ <viewVideo ref="videoRef" @getList="getList"></viewVideo>
</div>
</template>
<script setup>
-import {getCurrentInstance, onMounted, onUnmounted, reactive, ref, toRefs} from "vue";
+import {getCurrentInstance, nextTick, onMounted, onUnmounted, reactive, ref, toRefs} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import resourceDialog from './componets/resourceDialog.vue'
+import viewVideo from './componets/viewVideo.vue'
import {checkResourceName, delResource, getResource} from "@/api/onlineEducation/courseResource";
import {checkName} from "@/api/onlineEducation/company";
+import {VideoPlay} from "@element-plus/icons-vue";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const dialogRef = ref();
+const videoRef = ref();
+
const data = reactive({
queryParams: {
pageNum: 1,
pageSize: 10,
+ name: ''
},
total: 0,
dataList: []
@@ -73,7 +108,8 @@
data.dataList = res.data.list.map(item => {
return{
...item,
- sizeMB: Number((item.resourceSize /1024 /1024).toFixed(2))+'MB'
+ sizeMB: Number((item.resourceSize /1024 /1024).toFixed(2))+'MB',
+ timeFormat: item.resourceType === 1 || item.resourceType === 2 ? secondsToTime(item.resourceLength) : item.docPage + '页'
}
})
console.log("ddd",data.dataList)
@@ -87,10 +123,32 @@
const openDialog = (type, value) => {
dialogRef.value.openDialog(type, value);
}
+const openVideo = (value) => {
+ videoRef.value.openDialog(value);
+}
+const secondsToTime = (seconds) => {
+ const hours = Math.floor(seconds / 3600);
+ const minutes = Math.floor((seconds % 3600) / 60);
+ const secs = seconds % 60;
+
+ return [
+ hours,
+ hours > 0 ? pad(minutes) : minutes,
+ pad(secs)
+ ].join(':');
+}
+const pad = (number) => {
+ return (number < 10 ? '0' : '') + number;
+}
/** 重置新增的表单以及其他数据 */
function reset() {
- proxy.resetForm("roleRef");
+ data.queryParams = {
+ pageNum: 1,
+ pageSize: 10,
+ name: ''
+ }
+ getList()
}
const handleDelete = (val) => {
ElMessageBox.confirm(
--
Gitblit v1.9.2