From 4f6cdee3d3a9967b6955aacc354bf557430c0643 Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: 星期一, 05 八月 2024 17:05:16 +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