feat: 更新存储选项以包含图标并简化存储逻辑

This commit is contained in:
jxxghp
2024-11-14 17:21:48 +08:00
parent 7998b51e6b
commit e785997d99
4 changed files with 16 additions and 46 deletions

View File

@@ -2,22 +2,27 @@ export const storageOptions = [
{
title: '本地',
value: 'local',
icon: 'mdi-folder-multiple-outline',
},
{
title: '阿里云盘',
value: 'alipan',
icon: 'mdi-cloud-outline',
},
{
title: '115网盘',
value: 'u115',
icon: 'mdi-cloud-outline',
},
{
title: 'Rclone网盘',
title: 'RClone',
value: 'rclone',
icon: 'mdi-cloud-outline',
},
{
title: 'AList',
value: 'alist',
icon: 'mdi-cloud-outline',
},
]

View File

@@ -3,6 +3,7 @@ import type { Axios } from 'axios'
import FileList from './filebrowser/FileList.vue'
import FileToolbar from './filebrowser/FileToolbar.vue'
import type { EndPoints, FileItem, StorageConf } from '@/api/types'
import { storageOptions } from '@/api/constants'
// 输入参数
const props = defineProps({
@@ -27,34 +28,6 @@ const props = defineProps({
// 对外事件
const emit = defineEmits(['pathchanged'])
const availableStorages = [
{
name: '本地',
code: 'local',
icon: 'mdi-folder-multiple-outline',
},
{
name: '阿里云盘',
code: 'alipan',
icon: 'mdi-cloud-outline',
},
{
name: '115网盘',
code: 'u115',
icon: 'mdi-cloud-outline',
},
{
name: 'Rclone网盘',
code: 'rclone',
icon: 'mdi-cloud-outline',
},
{
name: 'AList',
code: 'alist',
icon: 'mdi-cloud-outline',
},
]
const fileIcons = {
// 压缩包
zip: 'mdi-folder-zip-outline',
@@ -156,7 +129,7 @@ const sort = ref('name')
// 计算属性
const storagesArray = computed(() => {
const storageCodes = props.storages?.map(item => item.type)
return availableStorages.filter(item => storageCodes?.includes(item.code))
return storageOptions.filter(item => storageCodes?.includes(item.value))
})
// 方法

View File

@@ -1,9 +1,9 @@
<script lang="ts" setup>
import type { TransferDirectoryConf } from '@/api/types'
import { VDivider, VSpacer, VTextField } from 'vuetify/lib/components/index.mjs'
import { useToast } from 'vue-toast-notification'
import api from '@/api'
import { nextTick } from 'vue'
import { storageOptions } from '@/api/constants'
// 输入参数
const props = defineProps({
@@ -36,14 +36,6 @@ const typeItems = [
{ title: '电视剧', value: '电视剧' },
]
// 存储下拉字典
const storageItems = [
{ title: '本地', value: 'local' },
{ title: '阿里云盘', value: 'alipan' },
{ title: '115网盘', value: 'u115' },
{ title: 'Rclone网盘', value: 'rclone' },
]
// 自动整理方式下拉字典
const transferSourceItems = [
{ title: '不整理', value: '' },
@@ -228,7 +220,7 @@ watch(
/>
</VCol>
<VCol cols="4">
<VSelect v-model="props.directory.storage" variant="underlined" :items="storageItems" label="下载存储" />
<VSelect v-model="props.directory.storage" variant="underlined" :items="storageOptions" label="下载存储" />
</VCol>
<VCol cols="8">
<VPathField @update:modelValue="updateDownloadPath" :storage="props.directory.storage">
@@ -273,7 +265,7 @@ watch(
<VSelect
v-model="props.directory.library_storage"
variant="underlined"
:items="storageItems"
:items="storageOptions"
label="媒体库存储"
/>
</VCol>

View File

@@ -63,7 +63,7 @@ const pathSegments = computed(() => {
// 当前存储
const storageObject = computed(() => {
return inProps.storages?.find(item => item.code === inProps.storage)
return inProps.storages?.find(item => item.value === inProps.storage)
})
// 切换存储
@@ -127,19 +127,19 @@ const sortIcon = computed(() => {
<VListItem
v-for="(item, index) in storages"
:key="index"
:disabled="item.code === storageObject?.code"
@click="changeStorage(item.code)"
:disabled="item.value === storageObject?.value"
@click="changeStorage(item.value)"
>
<template #prepend>
<Icon :icon="item.icon" />
</template>
<VListItemTitle>{{ item.name }}</VListItemTitle>
<VListItemTitle>{{ item.title }}</VListItemTitle>
</VListItem>
</VList>
</VMenu>
<VBtn variant="text" :input-value="item.path === '/'" class="px-1" @click="changePath(inProps.itemstack[0])">
<VIcon :icon="storageObject?.icon" class="mr-2" />
{{ storageObject?.name }}
{{ storageObject?.title }}
</VBtn>
<template v-for="(segment, index) in pathSegments" :key="index">
<VBtn