usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update MkDrive.vue

This commit is contained in:
syuilo 2025-05-10 14:41:56 +09:00
parent 8ce2f43722
commit eccd27d74a
1 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
packages/frontend/src/components/MkDrive.vue
View File

@ -46,9 +46,9 @@ SPDX-License-Identifier: AGPL-3.0-only
> >
<div ref="contents"> <div ref="contents">
<MkInfo v-if="!store.r.readDriveTip.value" closable @close="closeTip()"><div v-html="i18n.ts.driveAboutTip"></div></MkInfo> <MkInfo v-if="!store.r.readDriveTip.value" closable @close="closeTip()"><div v-html="i18n.ts.driveAboutTip"></div></MkInfo>
<div v-show="folders.length > 0" ref="foldersContainer" :class="$style.folders"> <div v-show="foldersPaginator.items.value.length > 0" ref="foldersContainer" :class="$style.folders">
<XFolder <XFolder
v-for="(f, i) in folders" v-for="(f, i) in foldersPaginator.items.value"
:key="f.id" :key="f.id"
v-anim="i" v-anim="i"
:class="$style.folder" :class="$style.folder"
@ -66,7 +66,7 @@ SPDX-License-Identifier: AGPL-3.0-only
/> />
<!-- SEE: https://stackoverflow.com/questions/18744164/flex-box-align-last-row-to-grid --> <!-- SEE: https://stackoverflow.com/questions/18744164/flex-box-align-last-row-to-grid -->
<div v-for="(n, i) in 16" :key="i" :class="$style.padding"></div> <div v-for="(n, i) in 16" :key="i" :class="$style.padding"></div>
<MkButton v-if="moreFolders" ref="moreFolders" @click="fetchMoreFolders">{{ i18n.ts.loadMore }}</MkButton> <MkButton v-if="foldersPaginator.canFetchOlder" ref="moreFolders" @click="foldersPaginator.fetchOlder()">{{ i18n.ts.loadMore }}</MkButton>
</div> </div>
<div v-show="filesPaginator.items.value.length > 0" ref="filesContainer" :class="$style.files"> <div v-show="filesPaginator.items.value.length > 0" ref="filesContainer" :class="$style.files">
@ -90,7 +90,8 @@ SPDX-License-Identifier: AGPL-3.0-only
</div> </div>
<MkButton v-show="filesPaginator.canFetchOlder" ref="loadMoreFiles" @click="filesPaginator.fetchOlder()">{{ i18n.ts.loadMore }}</MkButton> <MkButton v-show="filesPaginator.canFetchOlder" ref="loadMoreFiles" @click="filesPaginator.fetchOlder()">{{ i18n.ts.loadMore }}</MkButton>
</div> </div>
<div v-if="files.length == 0 && folders.length == 0 && !fetching" :class="$style.empty">
<div v-if="filesPaginator.items.value.length == 0 && foldersPaginator.items.value.length == 0 && !fetching" :class="$style.empty">
<div v-if="draghover">{{ i18n.ts['empty-draghover'] }}</div> <div v-if="draghover">{{ i18n.ts['empty-draghover'] }}</div>
<div v-if="!draghover && folder == null"><strong>{{ i18n.ts.emptyDrive }}</strong><br/>{{ i18n.ts['empty-drive-description'] }}</div> <div v-if="!draghover && folder == null"><strong>{{ i18n.ts.emptyDrive }}</strong><br/>{{ i18n.ts['empty-drive-description'] }}</div>
<div v-if="!draghover && folder != null">{{ i18n.ts.emptyFolder }}</div> <div v-if="!draghover && folder != null">{{ i18n.ts.emptyFolder }}</div>
@ -145,7 +146,7 @@ const loadMoreFiles = useTemplateRef('loadMoreFiles');
const filesPaginator = usePagination({ const filesPaginator = usePagination({
ctx: { ctx: {
endpoint: 'drive/files' as const, endpoint: 'drive/files',
limit: 30, limit: 30,
params: computed(() => ({ params: computed(() => ({
folderId: folder.value ? folder.value.id : null, folderId: folder.value ? folder.value.id : null,
@ -157,7 +158,7 @@ const filesPaginator = usePagination({
const foldersPaginator = usePagination({ const foldersPaginator = usePagination({
ctx: { ctx: {
endpoint: 'drive/folders' as const, endpoint: 'drive/folders',
limit: 30, limit: 30,
params: computed(() => ({ params: computed(() => ({
folderId: folder.value ? folder.value.id : null, folderId: folder.value ? folder.value.id : null,