From 7abe69a7d009a62e5f77c2093c8bdf606ca4b06a Mon Sep 17 00:00:00 2001
From: yangjun <1173114630@qq.com>
Date: Sat, 20 Jul 2024 15:03:34 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../renKeJiaoCheng/checkKecheng/dqxqkc.vue    |   2 +-
 .../checkKecheng/dqxqkcMenu.vue               |  10 +-
 src/views/zy/jiaoXueDanYuanNeiRong/index.vue  | 137 ++++++++++++++++--
 src/views/zy/zyInfo/ZyInfoList.vue            |  14 +-
 .../zy/zyInfoStudent/ZyInfoStudentList.vue    |   1 +
 5 files changed, 144 insertions(+), 20 deletions(-)

diff --git a/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkc.vue b/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkc.vue
index a1072a2..d12abf3 100644
--- a/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkc.vue
+++ b/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkc.vue
@@ -23,7 +23,7 @@
             <div class="skddDiv" style="margin-top: 20px">{{ item.skdd }}</div>
             <div class="skddDiv" style="margin-top: 20px">学分：{{ item.xf }}</div>
             <!-- <div class="skddDiv" style="margin-top: 20px">教课周次：{{ item.jkzc }}</div> -->
-            <div class="xkrsDiv" @click="openXkrs(item)" style="cursor: pointer;">{{ item.xkrs }}人选课&nbsp;&nbsp;&nbsp;
+            <div class="xkrsDiv"><span @click="openXkrs(item)" style="cursor: pointer;">{{ item.xkrs }}人选课&nbsp;&nbsp;&nbsp;</span>
               <a-button class="buttonClass" @click="openKechengDetail(item)">进入课程</a-button>
             </div>
           </div>
diff --git a/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkcMenu.vue b/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkcMenu.vue
index 34f817f..bf9241b 100644
--- a/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkcMenu.vue
+++ b/src/views/site/renKeJiaoCheng/checkKecheng/dqxqkcMenu.vue
@@ -16,11 +16,17 @@
                     <a-menu-item key="1" @click="getGzt('kcjs')">课程简介</a-menu-item>
                     <a-menu-item key="3" @click="gotoPageByName('jiaoXueDanYuanNeiRong')">教学单元内容</a-menu-item>
                   </a-sub-menu>
-                  <a-sub-menu key="sub2">
+                  <a-menu-item key="sub2">
+                    <span @click="getGzt('dqzy')">课程作业</span>
+                  </a-menu-item>
+                  <a-menu-item key="sub21">
+                    <span @click="getGzt('kcjc')">课程测验</span>
+                  </a-menu-item>
+                  <!-- <a-sub-menu key="sub2">
                     <template #title>作业/测验</template>
                     <a-menu-item key="4" @click="getGzt('dqzy')">课程作业</a-menu-item>
                     <a-menu-item key="5" @click="getGzt('kcjc')">课程测验</a-menu-item>
-                  </a-sub-menu>
+                  </a-sub-menu> -->
                   <a-sub-menu key="sub3">
                     <template #title>教学工具</template>
                     <a-menu-item key="6" @click="getGzt('dcwj')">问卷调查</a-menu-item>
diff --git a/src/views/zy/jiaoXueDanYuanNeiRong/index.vue b/src/views/zy/jiaoXueDanYuanNeiRong/index.vue
index 95e66d7..b769c93 100644
--- a/src/views/zy/jiaoXueDanYuanNeiRong/index.vue
+++ b/src/views/zy/jiaoXueDanYuanNeiRong/index.vue
@@ -220,6 +220,15 @@
                                           class="addBtn"
                                           ><Icon icon="ant-design:vertical-align-bottom-outlined"
                                         /></a-button>
+                                        <a-button
+                                          type="primary"
+                                          size="small"
+                                          title="查看"
+                                          v-if="three.type == 'video'"
+                                          @click="handleVideo(three)"
+                                          class="addBtn"
+                                          ><Icon icon="ant-design:video-camera-add-outlined"
+                                        /></a-button>
                                         <a-button
                                           type="primary"
                                           size="small"
@@ -260,6 +269,32 @@
         <!-- <a-button @click="sureChange" type="primary" style="margin-top: 100px">确定</a-button> -->
         <!-- </template> -->
       </draggable>
+      <a-modal
+        title="视频播放"
+        :width="800"
+        :visible="videoOpen"
+        :maskClosable="false"
+        :okButtonProps="{ class: { 'jee-hidden': true } }"
+        @cancel="videoHandleCancel"
+        cancelText="关闭"
+      >
+      <div style="text-align: center;width:100%;">
+        <video
+        style="text-align: center;"
+          ref="videoPlayer"
+          :controls="controls"
+          :autoplay="autoplay"
+          :loop="loop"
+          @loadedmetadata="playVideoInFullscreen"
+        >
+          <source :src="videoUrl" type="video/mp4" />
+          Your browser does not support the video tag.
+        </video>
+    
+        <!-- <button @click="playVideo">开始播放</button>
+        <button @click="pauseVideo">停止播放</button> -->
+      </div>
+      </a-modal>
       <a-modal
         :title="threePageTitle"
         :width="800"
@@ -324,7 +359,7 @@
 </template>
 
 <script lang="ts" name="jiaoXueDanYuanNeiRongIndex" setup>
-import { ref, reactive, onMounted, unref, nextTick } from 'vue';
+import { ref, reactive, onMounted,onUnmounted, unref, nextTick } from 'vue';
 import { Input, Popover, Pagination, Empty, Affix as aAffix } from 'ant-design-vue';
 import { defHttp } from '/@/utils/http/axios';
 import { useMessage } from '/@/hooks/web/useMessage';
@@ -354,9 +389,27 @@ const saveLoading = ref<boolean>(false);
 const isPreview = ref<boolean>(false);
 
 const threePageTitle = ref<String>('详细');
+const videoUrl = ref<String>('');
 const threePageOpen = ref<boolean>(false);
 const threePageDisableSubmit = ref<boolean>(false);
 const threePageData = ref<Object>(null);
+const videoPlayer = ref(null);
+const videoOpen = ref<boolean>(false);
+  const controls = ref(true);
+  const autoplay = ref(false)
+  const loop = ref(false);
+
+  const playVideoInFullscreen = async () => {
+  if (videoPlayer.value) {
+    try {
+      // 使用原生DOM方法请求全屏
+      await videoPlayer.value.requestFullscreen();
+    } catch (err) {
+      console.error(err);
+    }
+  }
+};
+
 
 const stuIndexRef = ref<any>();
 const zykYylistPageRef = ref();
@@ -426,20 +479,18 @@ function handleYinyong() {
 }
 
 function handleYyOk(record){
-console.log(`🚀 ~ handleYyOk ~ record:`, record)
-console.log(`🚀 ~ handleYyOk ~ threePageData:`, threePageData)
-var fileName = record.substring(record.lastIndexOf('.')+1,record.length);
-if(threePageData.value.three.type == 'video' ){
-  if(fileName == 'mp4' || fileName == 'webm' || fileName == 'ogv' ){
+  console.log(`🚀 ~ handleYyOk ~ record:`, record)
+  console.log(`🚀 ~ handleYyOk ~ threePageData:`, threePageData)
+  var fileName = record.substring(record.lastIndexOf('.')+1,record.length);
+  if(threePageData.value.three.type == 'video' ){
+    if(fileName == 'mp4' || fileName == 'webm' || fileName == 'ogv' ){
+      threePageData.value.three.filePath = record;
+    }else{
+      createMessage.error('请引用视频文件，格式为：.mp4,.webm,.ogv');
+    }
+  }else if(threePageData.value.three.type == 'document' ){
     threePageData.value.three.filePath = record;
-  }else{
-    createMessage.error('请引用视频文件，格式为：.mp4,.webm,.ogv');
   }
-}else if(threePageData.value.three.type == 'document' ){
-  threePageData.value.three.filePath = record;
-}
-
-
 }
 
 function reload() {
@@ -450,6 +501,52 @@ function reloadStn() {
   stuIndexRef.value.reload();
 }
 
+function videoHandleCancel(){
+  pauseVideo();
+  videoOpen.value = false;
+}
+
+// --------------------------视频------------------------------
+const playVideo = () => {
+  videoPlayer.value.play();
+};
+
+const pauseVideo = () => {
+  videoPlayer.value.pause();
+};
+const handleFullScreenChange = () => {
+  if (!document.fullscreenElement) {
+    console.log('Video exited fullscreen');
+    // 这里可以执行取消全屏后的逻辑
+    videoOpen.value = false;
+    videoPlayer.value.pause();
+  }
+};
+
+onMounted(() => {
+  document.addEventListener('fullscreenchange', handleFullScreenChange);
+});
+ 
+onUnmounted(() => {
+  document.removeEventListener('fullscreenchange', handleFullScreenChange);
+});
+
+//视频预览
+function handleVideo(three){
+  let url = getFileAccessHttpUrl(three.filePath);
+  console.log('视频预览-----》',url);
+  videoOpen.value = true;
+  videoUrl.value = url;
+  playVideoInFullscreen();
+  setTimeout(() => {
+    playVideo();
+  }, 1000);
+  
+}
+
+// --------------------------视频------------------------------
+
+
 async function loadData() {
   dataSource.value = [];
   let params = {
@@ -710,6 +807,8 @@ function downloadFile(three) {
   openWindowWithLoading(url);
 }
 
+
+
 function openWindowWithLoading(url) {
   spinning.value = true;
   let fileName = url.substring(url.lastIndexOf('/') + 1);
@@ -963,4 +1062,16 @@ loadData();
   font-size: 14px;
   border-radius: 2px;
 }
+
+.video-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh; /* Full height of the viewport */
+}
+ 
+video {
+  max-width: 100%;
+  height: auto;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/zy/zyInfo/ZyInfoList.vue b/src/views/zy/zyInfo/ZyInfoList.vue
index 7cdbb27..e4f863c 100644
--- a/src/views/zy/zyInfo/ZyInfoList.vue
+++ b/src/views/zy/zyInfo/ZyInfoList.vue
@@ -47,8 +47,8 @@
             <a-col :span="24" class="zyCon">开始时间：{{dayjs(item.startTime).format('YYYY.MM.DD HH:mm')}}</a-col>
             <a-col :span="24" class="zyCon">结束时间：{{dayjs(item.endTime).format('YYYY.MM.DD HH:mm')}}</a-col>
             <a-col :span="24" class="zyCon"><div style="float:left">&nbsp;</div><div style="float:right;" @click="openXkrs(item)"><a>{{item.xkxs}}人选课</a></div></a-col>
-            <a-col :span="24" class="zyCon"><div style="float:left">未提交：{{item.wtjnum}}人;</div><div style="float:right;" >已提交：{{item.ytjnum}}人</div></a-col>
-            <a-col :span="24" class="zyCon"><div style="float:left">未评阅：{{item.wpynum}}人;</div><div style="float:right;" >已评阅：{{item.ypynum}}人</div></a-col>
+            <a-col :span="24" class="zyCon"><div style="float:left" class="zuanqu" @click="handleZyxx(item,'1')">未提交：{{item.wtjnum}}人;</div><div style="float:right;" class="zuanqu" @click="handleZyxx(item,'2')" >已提交：{{item.ytjnum}}人</div></a-col>
+            <a-col :span="24" class="zyCon"><div style="float:left" class="zuanqu" @click="handleZyxx(item,'3')">未评阅：{{item.wpynum}}人;</div><div style="float:right;" class="zuanqu" @click="handleZyxx(item,'4')" >已评阅：{{item.ypynum}}人</div></a-col>
 
             <a-col :span="24" style="text-align:center;margin-top:8px;">
               <a-button type="primary" @click="handleEdit(item)" style="margin-left:5px;margin-bottom:5px;padding: 0px 4px;background:rgb(28, 132, 198);" v-if="item.zyStatus==0">编辑作业</a-button>
@@ -56,7 +56,7 @@
               <a-button type="primary" @click="handleDelete(item)" style="margin-left:5px;margin-bottom:5px;padding: 0px 4px;background:rgb(28, 132, 198);" v-if="item.zyStatus==0">删除作业</a-button>
               <a-button type="primary" @click="handleBjzy(item)" style="margin-left:5px;margin-bottom:5px;padding: 0px 4px;background:rgb(28, 132, 198);" v-if="item.zyStatus==1||item.zyStatus==2||item.zyStatus==3">编辑作业</a-button>
               <!-- <a-button type="primary" @click="handleDetail(item)" style="margin-left:5px;margin-bottom:5px;padding: 0px 4px;background:rgb(28, 132, 198);" v-if="item.zyStatus==1||item.zyStatus==2||item.zyStatus==3">作业详情</a-button> -->
-              <a-button type="primary" @click="handleZyxx(item)" style="margin-left:5px;margin-bottom:5px;padding: 0px 4px;background:rgb(28, 132, 198);" v-if="item.zyStatus==1||item.zyStatus==2||item.zyStatus==3">查看作业</a-button>
+              <a-button type="primary" @click="handleZyxx(item,'')" style="margin-left:5px;margin-bottom:5px;padding: 0px 4px;background:rgb(28, 132, 198);" v-if="item.zyStatus==1||item.zyStatus==2||item.zyStatus==3">查看作业</a-button>
               <!-- <a-button type="primary" @click="handleShangchuan(item)" style="margin-left:5px;background:rgb(28, 132, 198);" v-if="item.zyStatus==1||item.zyStatus==2||item.zyStatus==3">上传</a-button> -->
             </a-col>
           </a-row>
@@ -113,6 +113,7 @@ import dayjs from 'dayjs';
   const ZyInfoStudentModalPage = ref();
   const XxhbbksListModalPage = ref();
   const registerEditModal  = ref();
+  const registerDetialModal  = ref();
   const current = ref<number>(0);
   const total = ref<number>(0);
   const pageNo = ref<number>(0);
@@ -169,7 +170,8 @@ import dayjs from 'dayjs';
   }
 
   //查看作业信息
-  function handleZyxx(record){
+  function handleZyxx(record,type){
+    record.queryType = type;
     ZyInfoStudentListModalPage.value.disableSubmit = true;
     ZyInfoStudentListModalPage.value.init(record);
   }
@@ -338,4 +340,8 @@ import dayjs from 'dayjs';
   text-align: center;
   font-size: 11px;
 }
+.zuanqu:hover{
+  cursor: pointer;
+  color:#18a689;
+}
 </style>
diff --git a/src/views/zy/zyInfoStudent/ZyInfoStudentList.vue b/src/views/zy/zyInfoStudent/ZyInfoStudentList.vue
index def7791..a30c8fe 100644
--- a/src/views/zy/zyInfoStudent/ZyInfoStudentList.vue
+++ b/src/views/zy/zyInfoStudent/ZyInfoStudentList.vue
@@ -465,6 +465,7 @@ function handleYulan(text){
     selectedRowKeys.value = [];
     queryParam.value = {};
     queryParam.value.mainId = record.id;
+    queryParam.value.queryType = record.queryType;
     mainId.value = record.id;
       reload();
   }