perf: optimal drag upload functionality and clean up context menu options

This commit is contained in:
jmal 2025-07-25 18:11:53 +08:00
parent 43cb3fd184
commit 260ce945cd
11 changed files with 66 additions and 25 deletions

View File

@ -21,7 +21,7 @@
</v-contextmenu-item> </v-contextmenu-item>
<v-contextmenu-submenu <v-contextmenu-submenu
v-if="item.child" v-if="item.child"
:disabled="item.homeDisable && (!path || path.length < 2)" :disabled="item.operation === 'create' && isNotUploadAllowed"
:title="item.label" :title="item.label"
> >
<!-- 二级菜单 --> <!-- 二级菜单 -->
@ -91,7 +91,7 @@
<el-popover <el-popover
popper-class="upload-file" popper-class="upload-file"
v-if="showUploadButton" v-if="showUploadButton"
v-show="!(isRootPath && homeHidden)" v-show="!isNotUploadAllowed"
v-model="isShowNewFolder" v-model="isShowNewFolder"
placement="bottom" placement="bottom"
trigger="hover" trigger="hover"
@ -839,6 +839,8 @@ import { formatSize, formatTime } from '@/utils/number'
import EditElement from '@/views/markdown/EditElement' import EditElement from '@/views/markdown/EditElement'
import Clipboard from 'clipboard' import Clipboard from 'clipboard'
import { isNotDragUploadAllowed } from '@/components/SimpleUploader/dragUploadUtils'
import _ from 'lodash' import _ from 'lodash'
import path from 'path' import path from 'path'
import { mapGetters, mapState } from 'vuex' import { mapGetters, mapState } from 'vuex'
@ -878,10 +880,6 @@ export default {
type: Number, type: Number,
default: 106, default: 106,
}, },
homeHidden: {
type: Boolean,
default: false,
},
showUploadButton: { showUploadButton: {
type: Boolean, type: Boolean,
default: true, default: true,
@ -1162,15 +1160,15 @@ export default {
return '名称' return '名称'
} }
}, },
isNotUploadAllowed() {
return isNotDragUploadAllowed(this.$route)
},
searchOptionBtnClass() { searchOptionBtnClass() {
return this.hasSearchFilterOption ? 'search-option-btn search-option-btn-active' : 'search-option-btn' return this.hasSearchFilterOption ? 'search-option-btn search-option-btn-active' : 'search-option-btn'
}, },
cmdKey() { cmdKey() {
return navigator.platform.startsWith('Mac') ? '⌘' : 'Ctrl' return navigator.platform.startsWith('Mac') ? '⌘' : 'Ctrl'
}, },
isRootPath() {
return !this.$route.query.path || this.$route.query.path.length < 2
},
fileClipboard() { fileClipboard() {
return store.getters.fileClipboard return store.getters.fileClipboard
}, },

View File

@ -0,0 +1,43 @@
// utils/dragUploadUtils.js
/**
* 拖拽上传相关工具函数
*/
// 特殊路由 - 完全禁止拖拽上传
const SPECIAL_ROUTES = ['/recently', '/document', '/audio', '/image', '/video']
// 禁用拖拽路由 - 需要特定条件才允许
const NO_DRAG_ROUTES = ['/favorite', '/mount', '/trash', '/tag']
/**
* 检查是否禁止拖拽上传
* @param {Object} route - 路由对象 { path, query }
* @returns {boolean}
*/
export function isNotDragUploadAllowed(route) {
if (!route) return false
const { path, query = {} } = route
const { keyword, searchOpenFolder } = query || {}
// 标准化路径
const normalizedPath = path ? path.replace(/\/$/, '') : ''
// 三种禁用拖拽的条件
const isSpecialRoute = SPECIAL_ROUTES.includes(normalizedPath)
const isNoDragRoute = NO_DRAG_ROUTES.includes(normalizedPath) && !query.path
const isSearchWithoutFolder = keyword && !searchOpenFolder
return isSpecialRoute || isNoDragRoute || isSearchWithoutFolder
}
/**
* 检查是否允许拖拽上传
* @param {Object} route - 路由对象 { path, query }
* @returns {boolean}
*/
export function isDragUploadAllowed(route) {
return !isNotDragUploadAllowed(route)
}

View File

@ -118,7 +118,8 @@ import SparkMD5 from 'spark-md5'
import api from '@/api/file-api' import api from '@/api/file-api'
import {formatNetSpeed} from '@/utils/number' import {formatNetSpeed} from '@/utils/number'
import {mapState} from 'vuex' import {mapState} from 'vuex'
import {encodeIfNeeded} from "@/utils/path"; import {encodeIfNeeded} from "@/utils/path"
import { isDragUploadAllowed } from './dragUploadUtils'
export default { export default {
components: {}, components: {},
@ -189,7 +190,7 @@ export default {
fileListScrollTop: 0, fileListScrollTop: 0,
dragoverLoop: null, dragoverLoop: null,
successMsg: null, successMsg: null,
enableDragUpload: false,// 是否启用拖拽上传 enableDragUpload: true,// 是否启用拖拽上传
uploader: null, uploader: null,
} }
}, },
@ -198,8 +199,7 @@ export default {
}, },
watch: { watch: {
$route(route) { $route(route) {
// 只有首页才启用拖拽上传 this.checkDrag(route)
this.enableDragUpload = route.path === '/'
}, },
message(msg) { message(msg) {
switch (msg.event) { switch (msg.event) {
@ -233,7 +233,7 @@ export default {
} }
}, },
mounted() { mounted() {
this.enableDragUpload = this.$route.path === '/' this.checkDrag(this.$route)
let that = this let that = this
let dropbox = document.body let dropbox = document.body
@ -280,6 +280,9 @@ export default {
destroyed() { destroyed() {
}, },
methods: { methods: {
checkDrag(route) {
this.enableDragUpload = isDragUploadAllowed(route)
},
onStorageTypeChange(chunkSize) { onStorageTypeChange(chunkSize) {
localStorage.setItem('uploader_chunk_size', chunkSize) localStorage.setItem('uploader_chunk_size', chunkSize)
if (this.options.chunkSize !== chunkSize && !this.panelShow) { if (this.options.chunkSize !== chunkSize && !this.panelShow) {

View File

@ -9,7 +9,6 @@
:defaultSort="sortable" :defaultSort="sortable"
:queryCondition="queryCondition" :queryCondition="queryCondition"
:contextMenus="contextMenus" :contextMenus="contextMenus"
homeHidden
> >
</show-file> </show-file>
</div> </div>
@ -39,7 +38,7 @@
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles { label: '新建', operation: 'create' , child: createFiles
}, },
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},

View File

@ -39,7 +39,7 @@ export default {
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles { label: '新建', operation: 'create' , child: createFiles
}, },
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},

View File

@ -39,7 +39,7 @@ export default {
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles { label: '新建', operation: 'create' , child: createFiles
}, },
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},

View File

@ -38,7 +38,7 @@ export default {
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles { label: '新建', operation: 'create' , child: createFiles
}, },
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},

View File

@ -39,7 +39,7 @@ export default {
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles { label: '新建', operation: 'create' , child: createFiles
}, },
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},

View File

@ -9,7 +9,6 @@
:defaultSort="sortable" :defaultSort="sortable"
:queryCondition="queryCondition" :queryCondition="queryCondition"
:contextMenus="contextMenus" :contextMenus="contextMenus"
homeHidden
> >
</show-file> </show-file>
</div> </div>
@ -39,7 +38,7 @@
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles { label: '新建', operation: 'create' , child: createFiles
}, },
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},

View File

@ -37,7 +37,7 @@
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles}, { label: '新建', operation: 'create' , child: createFiles},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},
] ]

View File

@ -8,7 +8,6 @@
:defaultSort="sortable" :defaultSort="sortable"
:queryCondition="queryCondition" :queryCondition="queryCondition"
:contextMenus="contextMenus" :contextMenus="contextMenus"
homeHidden
> >
</show-file> </show-file>
</div> </div>
@ -38,7 +37,7 @@ export default {
}, },
{ label: '刷新', operation: 'refresh'}, { label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: createFiles { label: '新建', operation: 'create' , child: createFiles
}, },
{ divider: true, operation: 'divider' }, { divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'}, { label: '写文章', operation: 'createMarkdownFile'},