mirror of
https://github.com/fawney19/Aether.git
synced 2026-01-03 00:02:28 +08:00
refactor(frontend): 优化 Models 功能模块
- 改进 ModelDetailDrawer 和 AliasDialog 组件
This commit is contained in:
@@ -218,7 +218,6 @@
|
|||||||
import { ref, computed } from 'vue'
|
import { ref, computed } from 'vue'
|
||||||
import { Loader2, Tag, SquarePen } from 'lucide-vue-next'
|
import { Loader2, Tag, SquarePen } from 'lucide-vue-next'
|
||||||
import { Dialog, Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@/components/ui'
|
import { Dialog, Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@/components/ui'
|
||||||
import Badge from '@/components/ui/badge.vue'
|
|
||||||
import Button from '@/components/ui/button.vue'
|
import Button from '@/components/ui/button.vue'
|
||||||
import Input from '@/components/ui/input.vue'
|
import Input from '@/components/ui/input.vue'
|
||||||
import Label from '@/components/ui/label.vue'
|
import Label from '@/components/ui/label.vue'
|
||||||
@@ -262,7 +261,7 @@ const emit = defineEmits<{
|
|||||||
'submit': [data: CreateModelAliasRequest | UpdateModelAliasRequest, isEdit: boolean]
|
'submit': [data: CreateModelAliasRequest | UpdateModelAliasRequest, isEdit: boolean]
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
const { success, error: showError } = useToast()
|
const { error: showError } = useToast()
|
||||||
|
|
||||||
// 状态
|
// 状态
|
||||||
const submitting = ref(false)
|
const submitting = ref(false)
|
||||||
@@ -337,20 +336,6 @@ const dialogDescription = computed(() => {
|
|||||||
// 对话框图标
|
// 对话框图标
|
||||||
const dialogIcon = computed(() => isEditMode.value ? SquarePen : Tag)
|
const dialogIcon = computed(() => isEditMode.value ? SquarePen : Tag)
|
||||||
|
|
||||||
// 作用范围描述
|
|
||||||
const scopeDescription = computed(() => {
|
|
||||||
if (props.fixedProvider) {
|
|
||||||
return `仅对 ${props.fixedProvider.display_name || props.fixedProvider.name} 生效。`
|
|
||||||
}
|
|
||||||
if (form.value.provider_id) {
|
|
||||||
const provider = props.providers.find(p => p.id === form.value.provider_id)
|
|
||||||
if (provider) {
|
|
||||||
return `仅对 ${provider.display_name || provider.name} 生效。`
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return '全局生效。'
|
|
||||||
})
|
|
||||||
|
|
||||||
// 映射模式下可选的源模型(排除已选择的目标模型)
|
// 映射模式下可选的源模型(排除已选择的目标模型)
|
||||||
const availableSourceModels = computed(() => {
|
const availableSourceModels = computed(() => {
|
||||||
return props.globalModels.filter(m => m.id !== form.value.global_model_id)
|
return props.globalModels.filter(m => m.id !== form.value.global_model_id)
|
||||||
|
|||||||
@@ -52,7 +52,7 @@
|
|||||||
variant="ghost"
|
variant="ghost"
|
||||||
size="icon"
|
size="icon"
|
||||||
title="编辑模型"
|
title="编辑模型"
|
||||||
@click="$emit('edit-model', model)"
|
@click="$emit('editModel', model)"
|
||||||
>
|
>
|
||||||
<Edit class="w-4 h-4" />
|
<Edit class="w-4 h-4" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -60,7 +60,7 @@
|
|||||||
variant="ghost"
|
variant="ghost"
|
||||||
size="icon"
|
size="icon"
|
||||||
:title="model.is_active ? '点击停用' : '点击启用'"
|
:title="model.is_active ? '点击停用' : '点击启用'"
|
||||||
@click="$emit('toggle-model-status', model)"
|
@click="$emit('toggleModelStatus', model)"
|
||||||
>
|
>
|
||||||
<Power class="w-4 h-4" />
|
<Power class="w-4 h-4" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -435,7 +435,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-8 w-8"
|
class="h-8 w-8"
|
||||||
title="添加关联"
|
title="添加关联"
|
||||||
@click="$emit('add-provider')"
|
@click="$emit('addProvider')"
|
||||||
>
|
>
|
||||||
<Plus class="w-3.5 h-3.5" />
|
<Plus class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -444,7 +444,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-8 w-8"
|
class="h-8 w-8"
|
||||||
title="刷新"
|
title="刷新"
|
||||||
@click="$emit('refresh-providers')"
|
@click="$emit('refreshProviders')"
|
||||||
>
|
>
|
||||||
<RefreshCw
|
<RefreshCw
|
||||||
class="w-3.5 h-3.5"
|
class="w-3.5 h-3.5"
|
||||||
@@ -563,7 +563,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-7 w-7"
|
class="h-7 w-7"
|
||||||
title="编辑此关联"
|
title="编辑此关联"
|
||||||
@click="$emit('edit-provider', provider)"
|
@click="$emit('editProvider', provider)"
|
||||||
>
|
>
|
||||||
<Edit class="w-3.5 h-3.5" />
|
<Edit class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -572,7 +572,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-7 w-7"
|
class="h-7 w-7"
|
||||||
:title="provider.is_active ? '停用此关联' : '启用此关联'"
|
:title="provider.is_active ? '停用此关联' : '启用此关联'"
|
||||||
@click="$emit('toggle-provider-status', provider)"
|
@click="$emit('toggleProviderStatus', provider)"
|
||||||
>
|
>
|
||||||
<Power class="w-3.5 h-3.5" />
|
<Power class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -581,7 +581,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-7 w-7"
|
class="h-7 w-7"
|
||||||
title="删除此关联"
|
title="删除此关联"
|
||||||
@click="$emit('delete-provider', provider)"
|
@click="$emit('deleteProvider', provider)"
|
||||||
>
|
>
|
||||||
<Trash2 class="w-3.5 h-3.5" />
|
<Trash2 class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -604,7 +604,7 @@
|
|||||||
size="sm"
|
size="sm"
|
||||||
variant="outline"
|
variant="outline"
|
||||||
class="mt-4"
|
class="mt-4"
|
||||||
@click="$emit('add-provider')"
|
@click="$emit('addProvider')"
|
||||||
>
|
>
|
||||||
<Plus class="w-4 h-4 mr-1" />
|
<Plus class="w-4 h-4 mr-1" />
|
||||||
添加第一个关联
|
添加第一个关联
|
||||||
@@ -630,7 +630,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-8 w-8"
|
class="h-8 w-8"
|
||||||
title="添加别名/映射"
|
title="添加别名/映射"
|
||||||
@click="$emit('add-alias')"
|
@click="$emit('addAlias')"
|
||||||
>
|
>
|
||||||
<Plus class="w-3.5 h-3.5" />
|
<Plus class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -639,7 +639,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-8 w-8"
|
class="h-8 w-8"
|
||||||
title="刷新"
|
title="刷新"
|
||||||
@click="$emit('refresh-aliases')"
|
@click="$emit('refreshAliases')"
|
||||||
>
|
>
|
||||||
<RefreshCw
|
<RefreshCw
|
||||||
class="w-3.5 h-3.5"
|
class="w-3.5 h-3.5"
|
||||||
@@ -723,7 +723,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-7 w-7"
|
class="h-7 w-7"
|
||||||
title="编辑"
|
title="编辑"
|
||||||
@click="$emit('edit-alias', alias)"
|
@click="$emit('editAlias', alias)"
|
||||||
>
|
>
|
||||||
<Edit class="w-3.5 h-3.5" />
|
<Edit class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -732,7 +732,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-7 w-7"
|
class="h-7 w-7"
|
||||||
:title="alias.is_active ? '停用' : '启用'"
|
:title="alias.is_active ? '停用' : '启用'"
|
||||||
@click="$emit('toggle-alias-status', alias)"
|
@click="$emit('toggleAliasStatus', alias)"
|
||||||
>
|
>
|
||||||
<Power class="w-3.5 h-3.5" />
|
<Power class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -741,7 +741,7 @@
|
|||||||
size="icon"
|
size="icon"
|
||||||
class="h-7 w-7"
|
class="h-7 w-7"
|
||||||
title="删除"
|
title="删除"
|
||||||
@click="$emit('delete-alias', alias)"
|
@click="$emit('deleteAlias', alias)"
|
||||||
>
|
>
|
||||||
<Trash2 class="w-3.5 h-3.5" />
|
<Trash2 class="w-3.5 h-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -764,7 +764,7 @@
|
|||||||
size="sm"
|
size="sm"
|
||||||
variant="outline"
|
variant="outline"
|
||||||
class="mt-4"
|
class="mt-4"
|
||||||
@click="$emit('add-alias')"
|
@click="$emit('addAlias')"
|
||||||
>
|
>
|
||||||
<Plus class="w-4 h-4 mr-1" />
|
<Plus class="w-4 h-4 mr-1" />
|
||||||
添加别名/映射
|
添加别名/映射
|
||||||
@@ -800,28 +800,6 @@ import {
|
|||||||
Layers
|
Layers
|
||||||
} from 'lucide-vue-next'
|
} from 'lucide-vue-next'
|
||||||
import { useToast } from '@/composables/useToast'
|
import { useToast } from '@/composables/useToast'
|
||||||
|
|
||||||
const props = withDefaults(defineProps<Props>(), {
|
|
||||||
loadingProviders: false,
|
|
||||||
loadingAliases: false,
|
|
||||||
hasBlockingDialogOpen: false
|
|
||||||
})
|
|
||||||
const emit = defineEmits<{
|
|
||||||
'update:open': [value: boolean]
|
|
||||||
'edit-model': [model: GlobalModelResponse]
|
|
||||||
'toggle-model-status': [model: GlobalModelResponse]
|
|
||||||
'add-provider': []
|
|
||||||
'edit-provider': [provider: any]
|
|
||||||
'delete-provider': [provider: any]
|
|
||||||
'toggle-provider-status': [provider: any]
|
|
||||||
'refresh-providers': []
|
|
||||||
'add-alias': []
|
|
||||||
'edit-alias': [alias: ModelAlias]
|
|
||||||
'toggle-alias-status': [alias: ModelAlias]
|
|
||||||
'delete-alias': [alias: ModelAlias]
|
|
||||||
'refresh-aliases': []
|
|
||||||
}>()
|
|
||||||
const { success: showSuccess, error: showError } = useToast()
|
|
||||||
import Card from '@/components/ui/card.vue'
|
import Card from '@/components/ui/card.vue'
|
||||||
import Badge from '@/components/ui/badge.vue'
|
import Badge from '@/components/ui/badge.vue'
|
||||||
import Button from '@/components/ui/button.vue'
|
import Button from '@/components/ui/button.vue'
|
||||||
@@ -839,6 +817,28 @@ import type { ModelAlias } from '@/api/endpoints/aliases'
|
|||||||
import type { TieredPricingConfig, PricingTier } from '@/api/endpoints/types'
|
import type { TieredPricingConfig, PricingTier } from '@/api/endpoints/types'
|
||||||
import type { CapabilityDefinition } from '@/api/endpoints'
|
import type { CapabilityDefinition } from '@/api/endpoints'
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
loadingProviders: false,
|
||||||
|
loadingAliases: false,
|
||||||
|
hasBlockingDialogOpen: false,
|
||||||
|
})
|
||||||
|
const emit = defineEmits<{
|
||||||
|
'update:open': [value: boolean]
|
||||||
|
'editModel': [model: GlobalModelResponse]
|
||||||
|
'toggleModelStatus': [model: GlobalModelResponse]
|
||||||
|
'addProvider': []
|
||||||
|
'editProvider': [provider: any]
|
||||||
|
'deleteProvider': [provider: any]
|
||||||
|
'toggleProviderStatus': [provider: any]
|
||||||
|
'refreshProviders': []
|
||||||
|
'addAlias': []
|
||||||
|
'editAlias': [alias: ModelAlias]
|
||||||
|
'toggleAliasStatus': [alias: ModelAlias]
|
||||||
|
'deleteAlias': [alias: ModelAlias]
|
||||||
|
'refreshAliases': []
|
||||||
|
}>()
|
||||||
|
const { success: showSuccess, error: showError } = useToast()
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
model: GlobalModelResponse | null
|
model: GlobalModelResponse | null
|
||||||
open: boolean
|
open: boolean
|
||||||
|
|||||||
Reference in New Issue
Block a user