xinyin025/geekai
1
0
Fork 0
mirror of https://github.com/yangjian102621/geekai.git synced 2025-11-12 20:23:46 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: new UI for chat file manager is ready

Browse Source
This commit is contained in:
RockYang
2024-06-25 18:59:27 +08:00
parent d63536d5ef
commit f8fed83507
16 changed files with 386 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
web/src/components/FileSelect.vue
View File

@@ -1,5 +1,5 @@
<template>
<el-container class="file-list-box">
<el-container class="file-select-box">
<a class="file-upload-img" @click="fetchFiles">
<i class="iconfont icon-attachment-st"></i>
</a>
@@ -34,8 +34,8 @@
effect="dark"
:content="file.name"
placement="top">
<el-image :src="file.url" fit="cover" v-if="isImage(file.ext)" @click="insertURL(file.url)"/>
<el-image :src="getFileIcon(file.ext)" fit="cover" v-else @click="insertURL(file.url)"/>
<el-image :src="file.url" fit="cover" v-if="isImage(file.ext)" @click="insertURL(file)"/>
<el-image :src="GetFileIcon(file.ext)" fit="cover" v-else @click="insertURL(file)"/>
</el-tooltip>
<div class="opt">
@@ -55,6 +55,7 @@ import {ElMessage} from "element-plus";
import {httpGet, httpPost} from "@/utils/http";
import {Delete, Plus} from "@element-plus/icons-vue";
import {isImage, removeArrayItem} from "@/utils/libs";
import {GetFileIcon} from "@/store/system";
const props = defineProps({
userId: Number,
@@ -65,30 +66,12 @@ const fileList = ref([])
const fetchFiles = () => {
show.value = true
httpGet("/api/upload/list").then(res => {
httpPost("/api/upload/list").then(res => {
fileList.value = res.data
}).catch(() => {
})
}
const getFileIcon = (ext) => {
const files = {
".docx": "doc.png",
".doc": "doc.png",
".xls": "xls.png",
".xlsx": "xls.png",
".ppt": "ppt.png",
".pptx": "ppt.png",
".md": "md.png",
".pdf": "pdf.png",
".sql": "sql.png"
}
if (files[ext]) {
return '/images/ext/' + files[ext]
}
return '/images/ext/file.png'
}
const afterRead = (file) => {
const formData = new FormData();
@@ -113,19 +96,19 @@ const removeFile = (file) => {
})
}
const insertURL = (url) => {
const insertURL = (file) => {
show.value = false
// 如果是相对路径，处理成绝对路径
if (url.indexOf("http") === -1) {
url = location.protocol + "//" + location.host + url
if (file.url.indexOf("http") === -1) {
file.url = location.protocol + "//" + location.host + file.url
}
emits('selected', url)
emits('selected', file)
}
</script>
<style lang="stylus">
.file-list-box {
.file-select-box {
.file-upload-img {
.iconfont {
font-size: 24px;