修改bug

2024-07-20 15:03:34 +08:00 · 2024-07-20 15:03:34 +08:00 · 7abe69a7d0
parent 287a7fefa9
commit 7abe69a7d0
5 changed files with 144 additions and 20 deletions
--- 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>
--- 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>
--- 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' ){
+  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' ){
+  }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>
--- 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>
--- 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();
  }