fix 文件管理默认路径、特殊字符问题

src/components/FileBrowser.vue

@@ -18,6 +18,9 @@ const props = defineProps({
   axiosconfig: Object,
 })
 
+// 对外事件
+const emit = defineEmits(['pathchanged'])
+
 const availableStorages = [
   {
     name: '本地',
@@ -48,8 +51,6 @@ const fileIcons = {
   other: 'mdi-file-outline',
 }
 
-// 当前路径
-const path = ref(props.path)
 // 加载次数
 const loading = ref(0)
 // 当前存储
@@ -77,23 +78,22 @@ function storageChanged(storage: string) {
   activeStorage.value = storage
 }
 
+// 路径变化
 function pathChanged(_path: string) {
-  path.value = _path
+  emit('pathchanged', _path)
 }
 
 // 初始化
 onBeforeMount(() => {
   activeStorage.value = props.storage ?? 'local'
   axiosInstance.value = props.axios ?? axios.create(props.axiosconfig)
-  if (!path.value)
-    pathChanged('/')
 })
 </script>
 
 <template>
   <VCard class="mx-auto" :loading="loading > 0">
     <Toolbar
-      :path="path"
+      :path="props.path"
       :storages="storagesArray"
       :storage="activeStorage"
       :endpoints="props.endpoints"
@@ -105,7 +105,7 @@ onBeforeMount(() => {
     <VRow no-gutters>
       <VCol v-if="tree" sm="auto" class="d-none d-md-block">
         <Tree
-          :path="path"
+          :path="props.path"
           :storage="activeStorage"
           :icons="fileIcons"
           :endpoints="endpoints"
@@ -119,7 +119,7 @@ onBeforeMount(() => {
       <VDivider v-if="tree" vertical />
       <VCol>
         <List
-          :path="path"
+          :path="props.path"
           :storage="activeStorage"
           :icons="fileIcons"
           :endpoints="endpoints"

src/components/filebrowser/List.vue

@@ -109,7 +109,7 @@ async function load() {
   if (isDir.value) {
     const url = inProps.endpoints?.list.url
       .replace(/{storage}/g, storage.value)
-      .replace(/{path}/g, inProps.path)
+      .replace(/{path}/g, encodeURIComponent(inProps.path || ''))
 
     const config = {
       url,
@@ -140,7 +140,7 @@ async function deleteItem(item: FileItem) {
     emit('loading', true)
     const url = inProps.endpoints?.delete.url
       .replace(/{storage}/g, storage.value)
-      .replace(/{path}/g, item.path)
+      .replace(/{path}/g, encodeURIComponent(item.path))
 
     const config = {
       url,
@@ -167,7 +167,7 @@ function download(path: string) {
   const token = store.state.auth.token
   const url_path = inProps.endpoints?.download.url
     .replace(/{storage}/g, storage.value)
-    .replace(/{path}/g, path)
+    .replace(/{path}/g, encodeURIComponent(path))
   const url = `${import.meta.env.VITE_API_BASE_URL}${url_path.slice(1)}&token=${token}`
   // 下载文件
   window.open(url, '_blank')
@@ -180,7 +180,7 @@ function getImgLink(path: string) {
   const token = store.state.auth.token
   const url_path = inProps.endpoints?.image.url
     .replace(/{storage}/g, storage.value)
-    .replace(/{path}/g, path)
+    .replace(/{path}/g, encodeURIComponent(path))
   return `${import.meta.env.VITE_API_BASE_URL}${url_path.slice(1)}&token=${token}`
 }
 
@@ -196,8 +196,8 @@ async function rename() {
   emit('loading', true)
   const url = inProps.endpoints?.rename.url
     .replace(/{storage}/g, inProps.storage)
-    .replace(/{path}/g, currentItem.value?.path)
-    .replace(/{newname}/g, newName.value)
+    .replace(/{path}/g, encodeURIComponent(currentItem.value?.path || ''))
+    .replace(/{newname}/g, encodeURIComponent(newName.value))
 
   const config = {
     url,
@@ -223,7 +223,7 @@ function showTransfer(item: FileItem) {
 
 // 整理文件
 async function transfer() {
-  transferForm.path = currentItem.value?.path || ''
+  transferForm.path = encodeURIComponent(currentItem.value?.path || '')
   // 开始整理文件
   try {
     transferPopper.value = false

src/components/filebrowser/Toolbar.vue

@@ -64,7 +64,7 @@ async function mkdir() {
   emit('loading', true)
   const url = inProps.endpoints?.mkdir.url
     .replace(/{storage}/g, inProps.storage)
-    .replace(/{path}/g, inProps.path + newFolderName.value)
+    .replace(/{path}/g, encodeURIComponent(inProps.path + newFolderName.value))
 
   const config = {
     url,