From 9c2eb9ed6da32c1830b02431875dacaa7f904b1f Mon Sep 17 00:00:00 2001
From: 黄何裕 <1053952480@qq.com>
Date: 星期五, 12 七月 2024 18:16:56 +0800
Subject: [PATCH] 修改资料校验

---
 src/views/folder/index.vue |  112 ++++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 81 insertions(+), 31 deletions(-)

diff --git a/src/views/folder/index.vue b/src/views/folder/index.vue
index e9a2f4c..69536e8 100644
--- a/src/views/folder/index.vue
+++ b/src/views/folder/index.vue
@@ -9,7 +9,18 @@
             <div class="card-wrapper w-full h-full flex flex-col px-8 box-border">
               <div class="card-header flex justify-between items-center shrink-0">
                 <div class="header-search flex items-center">
-                  <el-input v-model="searchText" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" :prefix-icon="Search" maxlength="20" />
+                  <el-input v-model="searchText" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" class="long-input" :prefix-icon="Search"/>
+                  <el-select v-model="searchSubject" placeholder="璇烽�夋嫨绉戠洰" class="ml-4 long-select" clearable>
+                    <el-option v-for="item in subjectList" :key="item.id" :label="item.name" :value="item.id"/>
+                  </el-select>
+                  <el-select v-model="searchContentType" placeholder="璇烽�夋嫨鏂囦欢绫诲瀷" class="ml-4 long-select" clearable>
+                    <el-option
+                        v-for="item in contentTypeList"
+                        :key="item.value"
+                        :label="item.name"
+                        :value="item.value">
+                    </el-option>
+                  </el-select>
                   <el-button type="primary" class="ml-4" @click="searchFile">鎼滅储</el-button>
                 </div>
               </div>
@@ -21,15 +32,15 @@
                       <template #default="scope">
                         <div class="row-info">
                           <div class="icon">
-                            <img :src="getIcon(scope.row.contentType)" class="width-img" />
+                            <img :src="getIcon(scope.row.contentType)" class="width-img"/>
                           </div>
                           <div class="label">{{ scope.row.introduction }}</div>
                         </div>
                       </template>
                     </el-table-column>
-                    <el-table-column prop="className" label="鐝骇" align="center" />
-                    <el-table-column prop="typeName" label="绉戠洰" align="center" />
-                    <el-table-column prop="updateTime" label="涓婁紶鏃堕棿" align="center" />
+                    <el-table-column prop="className" label="鐝骇" align="center"/>
+                    <el-table-column prop="typeName" label="绉戠洰" align="center"/>
+                    <el-table-column prop="updateTime" label="涓婁紶鏃堕棿" align="center"/>
                     <el-table-column>
                       <template #default="scope">
                         <el-button link type="primary" @click.prevent="checkRow(scope.row)">
@@ -43,10 +54,10 @@
 
               <div class="card-footer flex justify-center mb-7 shrink-0">
                 <el-pagination background layout="prev, pager, next" :total="fileList.length"
-                :default-page-size="20"
-                :currentPage="currentIndex"
-                :hide-on-single-page="true"
-                @current-change="handleCurrentChange" />
+                               :default-page-size="20"
+                               :currentPage="currentIndex"
+                               :hide-on-single-page="true"
+                               @current-change="handleCurrentChange"/>
               </div>
             </div>
           </el-card>
@@ -55,18 +66,18 @@
     </div>
 
     <!-- pdf鏌ョ湅 -->
-    <div class="pdf-container" v-show="pdfViewer">
+    <!-- <div class="pdf-container" v-show="pdfViewer">
       <PDFViewer :pdfUrl="pdfFile"></PDFViewer>
       <div class="close-btn">
         <el-button type="danger" size="large" circle @click="closeViewer">
           <template #icon>
             <el-icon :size="18">
-              <Close />
+              <Close/>
             </el-icon>
           </template>
         </el-button>
       </div>
-    </div>
+    </div> -->
 
     <!-- image鏌ョ湅 -->
     <div class="image-container" v-show="imageViewer">
@@ -80,34 +91,39 @@
         <el-button type="danger" size="large" circle @click="closeViewer">
           <template #icon>
             <el-icon :size="20">
-              <Close />
+              <Close/>
             </el-icon>
           </template>
         </el-button>
       </div>
     </div>
-
+    <!-- 寮圭獥 -->
+    <el-drawer v-model="fileViewer" direction="btt" size="90%" :before-close="handleClose">
+        <DocumentViewer :fileUrl="fileUrl"></DocumentViewer>
+    </el-drawer>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onBeforeUnmount } from 'vue';
-import { storeToRefs } from 'pinia';
-import { Close } from '@element-plus/icons-vue';
+import {ref, onMounted, onBeforeUnmount} from 'vue';
+import {storeToRefs} from 'pinia';
+import {Close} from '@element-plus/icons-vue';
 import NormalHeader from '@/components/NormalHeader/index.vue';
-import { Search } from '@element-plus/icons-vue';
-import { getFileList } from '@/api/modules/file.js';
+import {Search} from '@element-plus/icons-vue';
+import {getFileList} from '@/api/modules/file.js';
+import {getSubjectList} from '@/api/modules/subject.js';
 
 import PDFViewer from '@/components/PDFViewer/index.vue';
 import VideoViewer from '@/components/VideoViewer/index.vue';
+import DocumentViewer from "@/components/DocumentViewer/index.vue";
 
-import { useUserStore } from '@/store/index.js';
+import {useUserStore} from '@/store/index.js';
 import useWebScoket from '@/hooks/useWebScoket.js';
 
 const userStore = useUserStore();
-const { userInfo } = storeToRefs(userStore);
-const { status, message, error, connect, disconnect, sendMessage } = useWebScoket({
-  url: 'wss://42.193.1.25:8000/websocket/' + userInfo.value.id,
+const {userInfo} = storeToRefs(userStore);
+const {status, message, error, connect, disconnect, sendMessage} = useWebScoket({
+  url: 'ws://42.193.1.25:8000/websocket/' + userInfo.value.id,
   heartBeatData: 'ping'
 });
 
@@ -120,7 +136,7 @@
     handle: (item) => {
       console.log(item);
       imageViewer.value = true;
-      imageList.value = ['/api/files/'+item.contentUrl.url];
+      imageList.value = ['/api/files/' + item.contentUrl.url];
       resendMessage();
     }
   },
@@ -129,7 +145,7 @@
     handle: (item) => {
       console.log(item);
       videoViewer.value = true;
-      videoUrl.value = ['/api/files/'+item.contentUrl.url];
+      videoUrl.value = ['/api/files/' + item.contentUrl.url];
       resendMessage();
     }
   },
@@ -138,12 +154,14 @@
     handle: (item) => {
       console.log(item);
       pdfViewer.value = true;
-      pdfFile.value = '/api/files/'+item.contentUrl.url;
+      pdfFile.value = '/api/files/' + item.contentUrl.url;
       resendMessage();
     }
   },
 };
 const searchText = ref('');
+const searchSubject = ref('')
+const searchContentType = ref('')
 
 const loading = ref(false);
 
@@ -156,12 +174,28 @@
 const videoUrl = ref('');
 
 const fileList = ref([]);
-
+const subjectList = ref([]);
+const contentTypeList = ref([{ name: '瑙嗛', value: 'video' },
+  { name: '鍥剧墖', value: 'img' },
+  { name: '闊抽', value: 'audio' },
+  { name: 'PDF', value: 'pdf' },
+  { name: 'EXCEL', value: 'excel' },
+  { name: 'WORD', value: 'word' },
+  { name: 'PPT', value: 'ppt' }]);
 const currentIndex = ref(1);
 
-
+const fileUrl = ref("");
+const fileViewer = ref(false);
 const checkRow = (item) => {
+    fileUrl.value = item.contentUrl.url;
   fileType[item.contentType] && fileType[item.contentType].handle(item);
+  fileViewer.value = true
+};
+
+const handleClose = () => {
+  fileViewer.value = false;
+  fileUrl.value = "";
+  console.log("鎴戞槸鍚﹀叧闂細",fileUrl.value);
 };
 
 const closeViewer = () => {
@@ -173,7 +207,7 @@
 
 const getData = () => {
   loading.value = true;
-  getFileList().then(res => {
+  getFileList({introduction: searchText.value, subjectId: searchSubject.value, contentType:searchContentType.value}).then(res => {
     loading.value = false;
     fileList.value = res.data;
   }).catch(() => {
@@ -182,13 +216,23 @@
 };
 getData();
 
+const getSubject = () => {
+  loading.value = true;
+  getSubjectList().then(res => {
+    loading.value = false;
+    subjectList.value = res.data;
+  }).catch(() => {
+    loading.value = false;
+  });
+};
+getSubject();
 const resendMessage = () => {
   if (time.value) {
     clearInterval(time.value);
   }
-  sendMessage({ id: userInfo.value.id, command: 'recordStudyTime' });
+  sendMessage({id: userInfo.value.id, command: 'recordStudyTime'});
   time.value = setInterval(() => {
-    sendMessage({ id: userInfo.value.id, command: 'recordStudyTime' });
+    sendMessage({id: userInfo.value.id, command: 'recordStudyTime'});
   }, 5000);
 };
 
@@ -232,7 +276,13 @@
     margin-right: 20px;
   }
 }
+.long-input {
+  width: 200px;
+}
 
+.long-select {
+  width: 200px;
+}
 .pdf-container {
   width: 100%;
   height: 100%;

--
Gitblit v1.8.0