refactor!: upgrade to nuxt v4 (#658)

* refactor!: migrate to nuxt v4

* update path alias pt.2

* do not ignore shadcn components

* still. do not ignore shadcn components

* move utils to rootDir

components/custom/CAS/ClassroomReservation/NewClassroomReservation.vue → app/components/custom/CAS/ClassroomReservation/NewClassroomReservation.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
+import type { AllClubs } from '@@/types/api/user/all_clubs'
 import type { ClassroomData } from '@prisma/client'
-import type { AllClubs } from '~/types/api/user/all_clubs'
+import { enums } from '@/components/custom/enum2str'
 import { Button } from '@/components/ui/button'
 import {
   Card,
@@ -11,7 +12,6 @@ import {
 } from '@/components/ui/card'
 import { useToast } from '@/components/ui/toast/use-toast'
 import { LoaderCircle } from 'lucide-vue-next'
-import { enums } from '~/components/custom/enum2str'
 
 const { toast } = useToast()
 

components/custom/CAS/Record/NewActivityRecord.vue → app/components/custom/CAS/Record/NewActivityRecord.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { AllClubs } from '@@/types/api/user/all_clubs'
 import { Button } from '@/components/ui/button'
 import { Calendar } from '@/components/ui/calendar'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
@@ -12,16 +13,15 @@ import {
 } from '@/components/ui/number-field'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
 import { Textarea } from '@/components/ui/textarea'
+import { Toaster } from '@/components/ui/toast'
 import { useToast } from '@/components/ui/toast/use-toast'
+import { cn } from '@/lib/utils'
 import { CalendarDate, DateFormatter, getLocalTimeZone, parseDate, today } from '@internationalized/date'
 import { toTypedSchema } from '@vee-validate/zod'
 import { Calendar as CalendarIcon } from 'lucide-vue-next'
 import { toDate } from 'radix-vue/date'
 import { useForm } from 'vee-validate'
 import * as z from 'zod'
-import { Toaster } from '~/components/ui/toast'
-import { cn } from '~/lib/utils'
-import type { AllClubs } from '~/types/api/user/all_clubs'
 
 const emit = defineEmits(['refresh'])
 

components/custom/CAS/Record/ViewMyActivityRecords.vue → app/components/custom/CAS/Record/ViewMyActivityRecords.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
+import type { MyRecords } from '@@/types/api/cas/record/my'
+import type { AllClubs } from '@@/types/api/user/all_clubs'
 import type { Ref } from 'vue'
-import type { MyRecords } from '~/types/api/cas/record/my'
-import type { AllClubs } from '~/types/api/user/all_clubs'
 import {
   Card,
   CardContent,
@@ -17,10 +17,9 @@ import {
   SelectTrigger,
   SelectValue,
 } from '@/components/ui/select'
-import { Toaster } from '~/components/ui/toast'
+import { Toaster } from '@/components/ui/toast'
 import { columns } from './view-activity-records/columns'
 import DataTable from './view-activity-records/DataTable.vue'
-import { useQuery } from '@tanstack/vue-query';
 
 const props = defineProps<{
   refreshWatcher: Ref<boolean>
@@ -115,7 +114,7 @@ const totalCASTime = computed(() => {
         </Button>
       </div>
       <div v-if="selectedClub" class="mb-4 text-sm">
-        <div class="rounded border p-2 mt-1 flex justify-between">
+        <div class="mt-1 flex justify-between border rounded p-2">
           <div class="flex items-center space-x-0.5">
             <p class="font-bold">
               C:

components/custom/CAS/Record/view-activity-records/columns.ts → app/components/custom/CAS/Record/view-activity-records/columns.ts

@@ -1,9 +1,9 @@
 import type { ActivityRecord, Club, ClubMembership } from '@prisma/client'
 import type { ColumnDef } from '@tanstack/vue-table'
+import DropdownAction from '@/components/custom/CAS/Record/view-activity-records/DataTableAction.vue'
+import { Button } from '@/components/ui/button'
 import { ArrowUpDown } from 'lucide-vue-next'
 import { h } from 'vue'
-import { Button } from '~/components/ui/button'
-import DropdownAction from './DataTableAction.vue'
 
 export const columns: ColumnDef<ActivityRecord>[] = [
   {

components/custom/Index/announcements.vue → app/components/custom/Index/announcements.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { Announcements } from '~/types/payloadcms/announcements'
+import type { Announcements } from '@@/types/payloadcms/announcements'
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'
 
 const { data, suspense } = useQuery<Announcements>({

components/custom/club-card.vue → app/components/custom/club-card.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
+import type { Club } from '@@/types/clubs'
 import type { PropType } from 'vue'
-import type { Club } from '~/types/clubs'
 import Badge from '@/components/ui/badge/Badge.vue'
 import { Button } from '@/components/ui/button'
 import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'

components/custom/sidebar.vue → app/components/custom/sidebar.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { AllClubs } from '~/types/api/user/all_clubs'
+import type { AllClubs } from '@@/types/api/user/all_clubs'
 import { Button } from '@/components/ui/button'
 import { cn } from '@/lib/utils'
 
@@ -72,36 +72,36 @@ if (clubs.value) {
         </h2>
         <div class="mt-2">
           <NuxtLink v-if="isPresidentOrVicePresident" to="/manage/reservation">
-            <Button :variant="route.name === 'manage-reservation' ? 'secondary' : 'ghost'" class="w-full justify-start mt-1">
+            <Button :variant="route.name === 'manage-reservation' ? 'secondary' : 'ghost'" class="mt-1 w-full justify-start">
               <Icon class="mr-2 h-4 w-4" name="material-symbols:calendar-today-outline" />
               预约教室
             </Button>
           </NuxtLink>
           <NuxtLink to="/manage/manage">
-            <Button v-if="isPresidentOrVicePresident" :variant="route.name === 'manage-manage' ? 'secondary' : 'ghost'" class="w-full justify-start mt-1">
+            <Button v-if="isPresidentOrVicePresident" :variant="route.name === 'manage-manage' ? 'secondary' : 'ghost'" class="mt-1 w-full justify-start">
               <Icon class="mr-2 h-4 w-4" name="material-symbols:calendar-today-outline" />
               管理预约
             </Button>
           </NuxtLink>
           <NuxtLink to="/manage/statuses">
-            <Button :variant="route.name === 'manage-statuses' ? 'secondary' : 'ghost'" class="w-full justify-start mt-1">
+            <Button :variant="route.name === 'manage-statuses' ? 'secondary' : 'ghost'" class="mt-1 w-full justify-start">
               <Icon class="mr-2 h-4 w-4" name="material-symbols:calendar-today-outline" />
               教室状态
             </Button>
           </NuxtLink>
           <NuxtLink to="/manage/record">
-            <Button :variant="route.name === 'manage-record' ? 'secondary' : 'ghost'" class="w-full justify-start mt-1">
+            <Button :variant="route.name === 'manage-record' ? 'secondary' : 'ghost'" class="mt-1 w-full justify-start">
               <Icon class="mr-2 h-4 w-4" name="charm:tick-double" />
               活动签到
             </Button>
           </NuxtLink>
         </div>
       </div>
-      <div class="py-2 px-3">
+      <div class="px-3 py-2">
         <h2 class="relative px-4 text-lg font-semibold tracking-tight">
           信息
         </h2>
-        <div class="space-y-1 mt-2">
+        <div class="mt-2 space-y-1">
           <NuxtLink to="/about">
             <Button :variant="route.name === 'about' ? 'secondary' : 'ghost'" class="w-full justify-start">
               <Icon class="mr-2 h-4 w-4" name="material-symbols:info-outline" />

app/components/ui/alert-dialog/index.ts

@@ -0,0 +1,9 @@
+export { default as AlertDialog } from '@/components/ui/alert-dialog/AlertDialog.vue'
+export { default as AlertDialogTrigger } from '@/components/ui/alert-dialog/AlertDialogTrigger.vue'
+export { default as AlertDialogContent } from '@/components/ui/alert-dialog/AlertDialogContent.vue'
+export { default as AlertDialogHeader } from '@/components/ui/alert-dialog/AlertDialogHeader.vue'
+export { default as AlertDialogTitle } from '@/components/ui/alert-dialog/AlertDialogTitle.vue'
+export { default as AlertDialogDescription } from '@/components/ui/alert-dialog/AlertDialogDescription.vue'
+export { default as AlertDialogFooter } from '@/components/ui/alert-dialog/AlertDialogFooter.vue'
+export { default as AlertDialogAction } from '@/components/ui/alert-dialog/AlertDialogAction.vue'
+export { default as AlertDialogCancel } from '@/components/ui/alert-dialog/AlertDialogCancel.vue'

components/ui/alert/index.ts → app/components/ui/alert/index.ts

@@ -1,8 +1,8 @@
 import { type VariantProps, cva } from 'class-variance-authority'
 
-export { default as Alert } from './Alert.vue'
-export { default as AlertTitle } from './AlertTitle.vue'
-export { default as AlertDescription } from './AlertDescription.vue'
+export { default as Alert } from '@/components/ui/alert/Alert.vue'
+export { default as AlertTitle } from '@/components/ui/alert/AlertTitle.vue'
+export { default as AlertDescription } from '@/components/ui/alert/AlertDescription.vue'
 
 export const alertVariants = cva(
   'relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7',

components/ui/avatar/index.ts → app/components/ui/avatar/index.ts

@@ -1,8 +1,8 @@
 import { cva } from 'class-variance-authority'
 
-export { default as Avatar } from './Avatar.vue'
-export { default as AvatarImage } from './AvatarImage.vue'
-export { default as AvatarFallback } from './AvatarFallback.vue'
+export { default as Avatar } from '@/components/ui/avatar/Avatar.vue'
+export { default as AvatarImage } from '@/components/ui/avatar/AvatarImage.vue'
+export { default as AvatarFallback } from '@/components/ui/avatar/AvatarFallback.vue'
 
 export const avatarVariant = cva(
   'inline-flex items-center justify-center font-normal text-foreground select-none shrink-0 bg-muted overflow-hidden',

components/ui/badge/index.ts → app/components/ui/badge/index.ts

@@ -1,6 +1,6 @@
 import { type VariantProps, cva } from 'class-variance-authority'
 
-export { default as Badge } from './Badge.vue'
+export { default as Badge } from '@/components/ui/badge/Badge.vue'
 
 export const badgeVariants = cva(
   'inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',

components/ui/button/index.ts → app/components/ui/button/index.ts

@@ -1,6 +1,6 @@
 import { cva } from 'class-variance-authority'
 
-export { default as Button } from './Button.vue'
+export { default as Button } from '@/components/ui/button/Button.vue'
 
 export const buttonVariants = cva(
   'inline-flex items-center justify-center rounded-md whitespace-nowrap text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50',

app/components/ui/calendar/index.ts

@@ -0,0 +1,12 @@
+export { default as Calendar } from '@/components/ui/calendar/Calendar.vue'
+export { default as CalendarCell } from '@/components/ui/calendar/CalendarCell.vue'
+export { default as CalendarCellTrigger } from '@/components/ui/calendar/CalendarCellTrigger.vue'
+export { default as CalendarGrid } from '@/components/ui/calendar/CalendarGrid.vue'
+export { default as CalendarGridBody } from '@/components/ui/calendar/CalendarGridBody.vue'
+export { default as CalendarGridHead } from '@/components/ui/calendar/CalendarGridHead.vue'
+export { default as CalendarGridRow } from '@/components/ui/calendar/CalendarGridRow.vue'
+export { default as CalendarHeadCell } from '@/components/ui/calendar/CalendarHeadCell.vue'
+export { default as CalendarHeader } from '@/components/ui/calendar/CalendarHeader.vue'
+export { default as CalendarHeading } from '@/components/ui/calendar/CalendarHeading.vue'
+export { default as CalendarNextButton } from '@/components/ui/calendar/CalendarNextButton.vue'
+export { default as CalendarPrevButton } from '@/components/ui/calendar/CalendarPrevButton.vue'

app/components/ui/card/index.ts

@@ -0,0 +1,6 @@
+export { default as Card } from '@/components/ui/card/Card.vue'
+export { default as CardHeader } from '@/components/ui/card/CardHeader.vue'
+export { default as CardTitle } from '@/components/ui/card/CardTitle.vue'
+export { default as CardDescription } from '@/components/ui/card/CardDescription.vue'
+export { default as CardContent } from '@/components/ui/card/CardContent.vue'
+export { default as CardFooter } from '@/components/ui/card/CardFooter.vue'

components/ui/chart-donut/DonutChart.vue → app/components/ui/chart-donut/DonutChart.vue

@@ -4,7 +4,7 @@ import { Donut } from '@unovis/ts'
 import { type Component, computed, ref } from 'vue'
 import { useMounted } from '@vueuse/core'
 import type { BaseChartProps } from '.'
-import { ChartSingleTooltip, defaultColors } from '~/components/ui/chart'
+import { ChartSingleTooltip, defaultColors } from '@/components/ui/chart'
 import { cn } from '@/lib/utils'
 
 const props = withDefaults(defineProps<Pick<BaseChartProps<T>, 'data' | 'colors' | 'index' | 'margin' | 'showLegend' | 'showTooltip' | 'filterOpacity'> & {

components/ui/chart-donut/index.ts → app/components/ui/chart-donut/index.ts

@@ -1,4 +1,4 @@
-export { default as DonutChart } from './DonutChart.vue'
+export { default as DonutChart } from '@/components/ui/chart-donut/DonutChart.vue'
 
 import type { Spacing } from '@unovis/ts'
 

components/ui/chart/ChartLegend.vue → app/components/ui/chart/ChartLegend.vue

@@ -3,7 +3,7 @@ import { VisBulletLegend } from '@unovis/vue'
 import type { BulletLegendItemInterface } from '@unovis/ts'
 import { BulletLegend } from '@unovis/ts'
 import { nextTick, onMounted, ref } from 'vue'
-import { buttonVariants } from '~/components/ui/button'
+import { buttonVariants } from '@/components/ui/button'
 
 const props = withDefaults(defineProps<{ items: BulletLegendItemInterface[] }>(), {
   items: () => [],

components/ui/chart/ChartTooltip.vue → app/components/ui/chart/ChartTooltip.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Card, CardContent, CardHeader, CardTitle } from '~/components/ui/card'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 
 defineProps<{
   title?: string

components/ui/chart/index.ts → app/components/ui/chart/index.ts

@@ -1,7 +1,7 @@
-export { default as ChartTooltip } from './ChartTooltip.vue'
-export { default as ChartSingleTooltip } from './ChartSingleTooltip.vue'
-export { default as ChartLegend } from './ChartLegend.vue'
-export { default as ChartCrosshair } from './ChartCrosshair.vue'
+export { default as ChartTooltip } from '@/components/ui/chart/ChartTooltip.vue'
+export { default as ChartSingleTooltip } from '@/components/ui/chart/ChartSingleTooltip.vue'
+export { default as ChartLegend } from '@/components/ui/chart/ChartLegend.vue'
+export { default as ChartCrosshair } from '@/components/ui/chart/ChartCrosshair.vue'
 
 export function defaultColors(count: number = 3) {
   const quotient = Math.floor(count / 2)

app/components/ui/checkbox/index.ts

@@ -0,0 +1 @@
+export { default as Checkbox } from '@/components/ui/checkbox/Checkbox.vue'

app/components/ui/command/index.ts

@@ -0,0 +1,9 @@
+export { default as Command } from '@/components/ui/command/Command.vue'
+export { default as CommandDialog } from '@/components/ui/command/CommandDialog.vue'
+export { default as CommandEmpty } from '@/components/ui/command/CommandEmpty.vue'
+export { default as CommandGroup } from '@/components/ui/command/CommandGroup.vue'
+export { default as CommandInput } from '@/components/ui/command/CommandInput.vue'
+export { default as CommandItem } from '@/components/ui/command/CommandItem.vue'
+export { default as CommandList } from '@/components/ui/command/CommandList.vue'
+export { default as CommandSeparator } from '@/components/ui/command/CommandSeparator.vue'
+export { default as CommandShortcut } from '@/components/ui/command/CommandShortcut.vue'

app/components/ui/dialog/index.ts

@@ -0,0 +1,9 @@
+export { default as Dialog } from '@/components/ui/dialog/Dialog.vue'
+export { default as DialogClose } from '@/components/ui/dialog/DialogClose.vue'
+export { default as DialogTrigger } from '@/components/ui/dialog/DialogTrigger.vue'
+export { default as DialogHeader } from '@/components/ui/dialog/DialogHeader.vue'
+export { default as DialogTitle } from '@/components/ui/dialog/DialogTitle.vue'
+export { default as DialogDescription } from '@/components/ui/dialog/DialogDescription.vue'
+export { default as DialogContent } from '@/components/ui/dialog/DialogContent.vue'
+export { default as DialogScrollContent } from '@/components/ui/dialog/DialogScrollContent.vue'
+export { default as DialogFooter } from '@/components/ui/dialog/DialogFooter.vue'

app/components/ui/dropdown-menu/index.ts

@@ -0,0 +1,16 @@
+export { DropdownMenuPortal } from 'radix-vue'
+
+export { default as DropdownMenu } from '@/components/ui/dropdown-menu/DropdownMenu.vue'
+export { default as DropdownMenuTrigger } from '@/components/ui/dropdown-menu/DropdownMenuTrigger.vue'
+export { default as DropdownMenuContent } from '@/components/ui/dropdown-menu/DropdownMenuContent.vue'
+export { default as DropdownMenuGroup } from '@/components/ui/dropdown-menu/DropdownMenuGroup.vue'
+export { default as DropdownMenuRadioGroup } from '@/components/ui/dropdown-menu/DropdownMenuRadioGroup.vue'
+export { default as DropdownMenuItem } from '@/components/ui/dropdown-menu/DropdownMenuItem.vue'
+export { default as DropdownMenuCheckboxItem } from '@/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue'
+export { default as DropdownMenuRadioItem } from '@/components/ui/dropdown-menu/DropdownMenuRadioItem.vue'
+export { default as DropdownMenuShortcut } from '@/components/ui/dropdown-menu/DropdownMenuShortcut.vue'
+export { default as DropdownMenuSeparator } from '@/components/ui/dropdown-menu/DropdownMenuSeparator.vue'
+export { default as DropdownMenuLabel } from '@/components/ui/dropdown-menu/DropdownMenuLabel.vue'
+export { default as DropdownMenuSub } from '@/components/ui/dropdown-menu/DropdownMenuSub.vue'
+export { default as DropdownMenuSubTrigger } from '@/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue'
+export { default as DropdownMenuSubContent } from '@/components/ui/dropdown-menu/DropdownMenuSubContent.vue'

app/components/ui/form/index.ts

@@ -0,0 +1,7 @@
+export { default as FormControl } from '@/components/ui/form/FormControl.vue'
+export { default as FormDescription } from '@/components/ui/form/FormDescription.vue'
+export { default as FormItem } from '@/components/ui/form/FormItem.vue'
+export { default as FormLabel } from '@/components/ui/form/FormLabel.vue'
+export { default as FormMessage } from '@/components/ui/form/FormMessage.vue'
+export { FORM_ITEM_INJECTION_KEY } from './injectionKeys'
+export { Field as FormField, Form } from 'vee-validate'

app/components/ui/hover-card/index.ts

@@ -0,0 +1,3 @@
+export { default as HoverCard } from '@/components/ui/hover-card/HoverCard.vue'
+export { default as HoverCardTrigger } from '@/components/ui/hover-card/HoverCardTrigger.vue'
+export { default as HoverCardContent } from '@/components/ui/hover-card/HoverCardContent.vue'

app/components/ui/input/index.ts

@@ -0,0 +1 @@
+export { default as Input } from '@/components/ui/input/Input.vue'

app/components/ui/label/index.ts

@@ -0,0 +1 @@
+export { default as Label } from '@/components/ui/label/Label.vue'

app/components/ui/menubar/index.ts

@@ -0,0 +1,15 @@
+export { default as Menubar } from '@/components/ui/menubar/Menubar.vue'
+export { default as MenubarItem } from '@/components/ui/menubar/MenubarItem.vue'
+export { default as MenubarContent } from '@/components/ui/menubar/MenubarContent.vue'
+export { default as MenubarGroup } from '@/components/ui/menubar/MenubarGroup.vue'
+export { default as MenubarMenu } from '@/components/ui/menubar/MenubarMenu.vue'
+export { default as MenubarRadioGroup } from '@/components/ui/menubar/MenubarRadioGroup.vue'
+export { default as MenubarRadioItem } from '@/components/ui/menubar/MenubarRadioItem.vue'
+export { default as MenubarCheckboxItem } from '@/components/ui/menubar/MenubarCheckboxItem.vue'
+export { default as MenubarSeparator } from '@/components/ui/menubar/MenubarSeparator.vue'
+export { default as MenubarSub } from '@/components/ui/menubar/MenubarSub.vue'
+export { default as MenubarSubContent } from '@/components/ui/menubar/MenubarSubContent.vue'
+export { default as MenubarSubTrigger } from '@/components/ui/menubar/MenubarSubTrigger.vue'
+export { default as MenubarTrigger } from '@/components/ui/menubar/MenubarTrigger.vue'
+export { default as MenubarShortcut } from '@/components/ui/menubar/MenubarShortcut.vue'
+export { default as MenubarLabel } from '@/components/ui/menubar/MenubarLabel.vue'

app/components/ui/multiselect/index.ts

@@ -0,0 +1 @@
+export { default as Multiselect } from '@/components/ui/multiselect/Multiselect.vue'

app/components/ui/number-field/index.ts

@@ -0,0 +1,5 @@
+export { default as NumberField } from '@/components/ui/number-field/NumberField.vue'
+export { default as NumberFieldInput } from '@/components/ui/number-field/NumberFieldInput.vue'
+export { default as NumberFieldIncrement } from '@/components/ui/number-field/NumberFieldIncrement.vue'
+export { default as NumberFieldDecrement } from '@/components/ui/number-field/NumberFieldDecrement.vue'
+export { default as NumberFieldContent } from '@/components/ui/number-field/NumberFieldContent.vue'

app/components/ui/popover/index.ts

@@ -0,0 +1,4 @@
+export { PopoverAnchor } from 'radix-vue'
+export { default as Popover } from '@/components/ui/popover/Popover.vue'
+export { default as PopoverTrigger } from '@/components/ui/popover/PopoverTrigger.vue'
+export { default as PopoverContent } from '@/components/ui/popover/PopoverContent.vue'

app/components/ui/scroll-area/index.ts

@@ -0,0 +1,2 @@
+export { default as ScrollArea } from '@/components/ui/scroll-area/ScrollArea.vue'
+export { default as ScrollBar } from '@/components/ui/scroll-area/ScrollBar.vue'