diff --git a/src/App.vue b/src/App.vue
index 4a905e41..e09d8670 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -77,9 +77,9 @@ async function loadSystemSettings() {
}
// 页面加载时,加载当前用户数据
-onMounted(() => {
- loadAccountInfo()
- loadSystemSettings()
+onBeforeMount(async () => {
+ await loadAccountInfo()
+ await loadSystemSettings()
startSSEMessager()
})
diff --git a/src/api/types.ts b/src/api/types.ts
index c1876679..2915004c 100644
--- a/src/api/types.ts
+++ b/src/api/types.ts
@@ -892,6 +892,7 @@ export interface EndPoints {
mkdir: any
delete: any
download: any
+ image: any
}
// 文件浏览项目
diff --git a/src/components/FileBrowser.vue b/src/components/FileBrowser.vue
index 02d4ea6a..ff365347 100644
--- a/src/components/FileBrowser.vue
+++ b/src/components/FileBrowser.vue
@@ -32,8 +32,8 @@ const fileIcons = {
htm: 'mdi-language-html5',
html: 'mdi-language-html5',
js: 'mdi-nodejs',
- json: 'mdi-json',
- md: 'mdi-markdown',
+ json: 'mdi-file-document-outline',
+ md: 'mdi-language-markdown-outline',
pdf: 'mdi-file-pdf',
png: 'mdi-file-image',
jpg: 'mdi-file-image',
diff --git a/src/components/filebrowser/List.vue b/src/components/filebrowser/List.vue
index 291d1261..3d76bec9 100644
--- a/src/components/filebrowser/List.vue
+++ b/src/components/filebrowser/List.vue
@@ -5,6 +5,7 @@ import { useConfirm } from 'vuetify-use-dialog'
import axios from 'axios'
import { formatBytes } from '@core/utils/formatters'
import type { EndPoints, FileItem } from '@/api/types'
+import store from '@/store'
// 输入参数
const props = defineProps({
@@ -50,6 +51,12 @@ const isDir = computed(() => props.path?.endsWith('/'))
// 是否文件
const isFile = computed(() => !isDir.value)
+// 是否为图片文件
+const isImage = computed(() => {
+ const ext = props.path?.split('.').pop()?.toLowerCase()
+ return ['png', 'jpg', 'jpeg', 'gif', 'bmp'].includes(ext ?? '')
+})
+
// 调API加载内容
async function load() {
emit('loading', true)
@@ -110,13 +117,26 @@ function changePath(_path: string) {
function download(path: string) {
if (!path)
return
- const url = props.endpoints?.download.url
+ const token = store.state.auth.token
+ const url_path = props.endpoints?.download.url
.replace(/{storage}/g, storage.value)
.replace(/{path}/g, path)
- // FIXME 下载文件
+ const url = `${import.meta.env.VITE_API_BASE_URL}${url_path.slice(1)}&token=${token}`
+ // 下载文件
window.open(url, '_blank')
}
+// 显示图片
+function getImgLink(path: string) {
+ if (!path)
+ return ''
+ const token = store.state.auth.token
+ const url_path = props.endpoints?.image.url
+ .replace(/{storage}/g, storage.value)
+ .replace(/{path}/g, path)
+ return `${import.meta.env.VITE_API_BASE_URL}${url_path.slice(1)}&token=${token}`
+}
+
// 转移文件
function transfer(item: FileItem) {
// TODO 转移文件
@@ -156,10 +176,16 @@ onMounted(() => {
选择目录或文件
- 文件: {{ path }}
+ 文件: {{ path }}
+
+
+
diff --git a/src/views/reorganize/FileBrowserView.vue b/src/views/reorganize/FileBrowserView.vue
index 1b9adbae..d05c7d0f 100644
--- a/src/views/reorganize/FileBrowserView.vue
+++ b/src/views/reorganize/FileBrowserView.vue
@@ -8,16 +8,20 @@ const endpoints = {
mkdir: { url: '/filebrowser/mkdir?path={path}', method: 'get' },
delete: { url: '/filebrowser/delete?path={path}', method: 'get' },
download: { url: '/filebrowser/download?path={path}', method: 'get' },
+ image: { url: '/filebrowser/image?path={path}', method: 'get' },
}
// 读取下载目录
const systemEnv: Setting = inject('systemEnv') ?? {
DOWNLOAD_PATH: '/',
}
+
+if (systemEnv?.DOWNLOAD_PATH && !systemEnv.DOWNLOAD_PATH?.endsWith('/'))
+ systemEnv.DOWNLOAD_PATH += '/'
-
+