refactor!: 升级 @nuxt/ui@3，重构所有页面和组件，调整配置，移除不在需求中的页面

app/pages/generation/green-screen.vue

@@ -5,7 +5,8 @@ import { useTourState } from '~/composables/useTourState'
 import SlideCreateCourseGreen from '~/components/SlideCreateCourseGreen.vue'
 
 const route = useRoute()
-const slide = useSlideover()
+const overlay = useOverlay()
+const slide = overlay.create(SlideCreateCourseGreen)
 const toast = useToast()
 const loginState = useLoginState()
 const tourState = useTourState()
@@ -35,12 +36,10 @@ const { data: videoList, refresh: refreshVideoList } = useAsyncData(
   }
 )
 
-const onCreateCourseGreenClick = () => {
-  slide.open(SlideCreateCourseGreen, {
-    onSuccess: () => {
-      refreshVideoList()
-    },
-  })
+const onCreateCourseGreenClick = async () => {
+  const slideInst = slide.open()
+  await slideInst
+  refreshVideoList()
 }
 
 const onCourseGreenDelete = (task: GBVideoItem) => {
@@ -58,14 +57,14 @@ const onCourseGreenDelete = (task: GBVideoItem) => {
       toast.add({
         title: '删除成功',
         description: '已删除任务记录',
-        color: 'green',
+        color: 'success',
         icon: 'i-tabler-check',
       })
     } else {
       toast.add({
         title: '删除失败',
         description: res.msg || '未知错误',
-        color: 'red',
+        color: 'error',
         icon: 'i-tabler-alert-triangle',
       })
     }
@@ -137,7 +136,6 @@ onMounted(() => {
               id="input-search"
               v-model="searchInput"
               :autofocus="false"
-              :ui="{ icon: { trailing: { pointer: '' } } }"
               autocomplete="off"
               placeholder="标题搜索"
               variant="outline"
@@ -146,7 +144,7 @@ onMounted(() => {
                 <UButton
                   v-show="searchInput !== ''"
                   :padded="false"
-                  color="gray"
+                  color="neutral"
                   icon="i-tabler-x"
                   variant="link"
                   @click="searchInput = ''"
@@ -172,7 +170,7 @@ onMounted(() => {
     <Transition name="loading-screen">
       <div
         v-if="videoList?.data.items.length === 0"
-        class="w-full py-20 flex flex-col justify-center items-center gap-2"
+        class="flex w-full flex-col items-center justify-center gap-2 py-20"
       >
         <Icon
           class="text-7xl text-neutral-300 dark:text-neutral-700"
@@ -183,7 +181,7 @@ onMounted(() => {
       <div v-else>
         <div class="p-4">
           <div
-            class="relative grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-3 fhd:grid-cols-5 gap-4"
+            class="relative grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-3 fhd:grid-cols-5"
           >
             <TransitionGroup
               name="card"
@@ -198,9 +196,9 @@ onMounted(() => {
               />
             </TransitionGroup>
           </div>
-          <div class="flex justify-end mt-4">
+          <div class="mt-4 flex justify-end">
             <UPagination
-              v-model="page"
+              v-model:page="page"
               :max="9"
               :page-count="pageCount"
               :total="videoList?.data.total || 0"