From afdb091a3e4994250d8228fd1238658b45a4e35e Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期三, 10 七月 2024 15:41:24 +0800
Subject: [PATCH] 教学资源增加分类
---
src/layout/components/Header/index.vue | 2
src/views/folder/index.vue | 89 +++++++++++++++++++++++++++++++-------------
src/api/modules/file.js | 6 +-
components.d.ts | 2 +
src/api/modules/subject.js | 6 +++
5 files changed, 75 insertions(+), 30 deletions(-)
diff --git a/components.d.ts b/components.d.ts
index 14021a3..b2d1c50 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -19,10 +19,12 @@
ElIcon: typeof import('element-plus/es')['ElIcon']
ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
ElInput: typeof import('element-plus/es')['ElInput']
+ ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElProgress: typeof import('element-plus/es')['ElProgress']
ElRow: typeof import('element-plus/es')['ElRow']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
+ ElSelect: typeof import('element-plus/es')['ElSelect']
ElSlider: typeof import('element-plus/es')['ElSlider']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
diff --git a/src/api/modules/file.js b/src/api/modules/file.js
index ecf2801..bce9bbd 100644
--- a/src/api/modules/file.js
+++ b/src/api/modules/file.js
@@ -1,5 +1,5 @@
import service from "@/api";
-export const getFileList = () => {
- return service.get('/api/student/education/resource/page');
-};
\ No newline at end of file
+export const getFileList = (getData = {introduction: '', subjectId: '', contentType: ''}) => {
+ return service.get('/api/student/education/resource/page', {params: getData});
+};
diff --git a/src/api/modules/subject.js b/src/api/modules/subject.js
index e69de29..c64deda 100644
--- a/src/api/modules/subject.js
+++ b/src/api/modules/subject.js
@@ -0,0 +1,6 @@
+import service from "@/api";
+
+
+export const getSubjectList = () => {
+ return service.post('/api/student/subject/list');
+};
diff --git a/src/layout/components/Header/index.vue b/src/layout/components/Header/index.vue
index a7351aa..1793068 100644
--- a/src/layout/components/Header/index.vue
+++ b/src/layout/components/Header/index.vue
@@ -96,4 +96,4 @@
opacity: 1;
}
}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/folder/index.vue b/src/views/folder/index.vue
index e9a2f4c..90ef798 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>
@@ -61,7 +72,7 @@
<el-button type="danger" size="large" circle @click="closeViewer">
<template #icon>
<el-icon :size="18">
- <Close />
+ <Close/>
</el-icon>
</template>
</el-button>
@@ -80,7 +91,7 @@
<el-button type="danger" size="large" circle @click="closeViewer">
<template #icon>
<el-icon :size="20">
- <Close />
+ <Close/>
</el-icon>
</template>
</el-button>
@@ -91,22 +102,23 @@
</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 { 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({
+const {userInfo} = storeToRefs(userStore);
+const {status, message, error, connect, disconnect, sendMessage} = useWebScoket({
url: 'wss://42.193.1.25:8000/websocket/' + userInfo.value.id,
heartBeatData: 'ping'
});
@@ -120,7 +132,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 +141,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 +150,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,7 +170,14 @@
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);
@@ -173,7 +194,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 +203,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 +263,13 @@
margin-right: 20px;
}
}
+.long-input {
+ width: 200px;
+}
+.long-select {
+ width: 200px;
+}
.pdf-container {
width: 100%;
height: 100%;
--
Gitblit v1.8.0