fix: corrects sorting order and enhances link sorting UX

- Fixes ascending/descending sort order for newest/oldest links
- Automatically sets sort to 'newest' when creating a link
- Updates Chinese translation for A-Z/Z-A sort labels
- Shows current sort option in dropdown button
- Reduces tooltip delay for better responsiveness
- Removes unused Button import in QRCode component
This commit is contained in:
ccbikai 2025-03-16 13:57:29 +08:00
parent ac7caf141f
commit 744f949972
4 changed files with 7 additions and 7 deletions

View file

@ -14,9 +14,9 @@ const displayedLinks = computed(() => {
const sorted = [...links.value] const sorted = [...links.value]
switch (sortBy.value) { switch (sortBy.value) {
case 'newest': case 'newest':
return sorted.sort((a, b) => a.createdAt - b.createdAt)
case 'oldest':
return sorted.sort((a, b) => b.createdAt - a.createdAt) return sorted.sort((a, b) => b.createdAt - a.createdAt)
case 'oldest':
return sorted.sort((a, b) => a.createdAt - b.createdAt)
case 'az': case 'az':
return sorted.sort((a, b) => a.slug.localeCompare(b.slug)) return sorted.sort((a, b) => a.slug.localeCompare(b.slug))
case 'za': case 'za':
@ -68,6 +68,7 @@ function updateLinkList(link, type) {
} }
else { else {
links.value.unshift(link) links.value.unshift(link)
sortBy.value = 'newest'
} }
} }
</script> </script>

View file

@ -1,5 +1,4 @@
<script setup> <script setup>
import { Button } from '#components'
import { Download } from 'lucide-vue-next' import { Download } from 'lucide-vue-next'
import QRCodeStyling from 'qr-code-styling' import QRCodeStyling from 'qr-code-styling'

View file

@ -16,11 +16,11 @@ const emit = defineEmits(['update:sortBy'])
<DropdownMenuTrigger as-child> <DropdownMenuTrigger as-child>
<Button variant="outline"> <Button variant="outline">
<TooltipProvider> <TooltipProvider>
<Tooltip> <Tooltip :delay-duration="100">
<TooltipTrigger class="flex items-center"> <TooltipTrigger class="flex items-center">
<ArrowUpDown class="h-4 w-4 sm:mr-2" /> <ArrowUpDown class="h-4 w-4 sm:mr-2" />
<span class="hidden sm:inline"> <span class="hidden sm:inline">
{{ $t('links.sort.newest') }} {{ $t(`links.sort.${sortBy}`) }}
</span> </span>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipContent>

View file

@ -161,8 +161,8 @@
"sort": { "sort": {
"newest": "最新", "newest": "最新",
"oldest": "最旧", "oldest": "最旧",
"az": "字母(A-Z)", "az": "短链(A-Z)",
"za": "字母(Z-A)", "za": "短链(Z-A)",
"tip": "体验功能: 仅对已经加载的链接有效" "tip": "体验功能: 仅对已经加载的链接有效"
} }
} }