refactor: 迁移到 @nuxt/ui@4

- https://ui.nuxt.com/docs/getting-started/migration/v4#changes-from-v3

app/components/ModalAuthentication.vue

@@ -411,7 +411,7 @@ const onForgetPasswordSubmit = (
                   name="mobile"
                   required
                 >
-                  <UButtonGroup class="w-full">
+                  <UFieldGroup class="w-full">
                     <UInput
                       v-model="smsForm.mobile"
                       :disabled="final_loading"
@@ -437,7 +437,7 @@ const onForgetPasswordSubmit = (
                       class="text-xs font-bold"
                       color="neutral"
                     />
-                  </UButtonGroup>
+                  </UFieldGroup>
                 </UFormField>
                 <Transition name="pin-root">
                   <div v-if="sms_triggered">
@@ -485,7 +485,7 @@ const onForgetPasswordSubmit = (
                     name="mobile"
                     required
                   >
-                    <UButtonGroup class="w-full">
+                    <UFieldGroup class="w-full">
                       <UInput
                         v-model="forgetPasswordState.mobile"
                         :disabled="final_loading"
@@ -512,7 +512,7 @@ const onForgetPasswordSubmit = (
                         class="text-xs font-bold"
                         color="neutral"
                       />
-                    </UButtonGroup>
+                    </UFieldGroup>
                   </UFormField>
                   <UFormField
                     label="验证码"

app/components/aigc/generation/CGTaskCard.client.vue

@@ -327,7 +327,7 @@ const onRetryClick = (course: resp.gen.CourseGenItem) => {
         </p>
       </div>
       <div class="flex items-end gap-1">
-        <UButtonGroup>
+        <UFieldGroup>
           <UButton
             color="neutral"
             variant="outline"
@@ -411,7 +411,7 @@ const onRetryClick = (course: resp.gen.CourseGenItem) => {
               trailing-icon="i-tabler-dots"
             />
           </UDropdownMenu>
-        </UButtonGroup>
+        </UFieldGroup>
       </div>
     </div>
 

app/components/aigc/generation/GBTaskCard.vue

@@ -314,7 +314,7 @@ const startDownload = (url: string, filename: string) => {
             variant="soft"
             @click="emit('delete', video)"
           />
-          <UButtonGroup size="xs">
+          <UFieldGroup size="xs">
             <UButton
               :label="
                 downloadingState.subtitle > 0 && downloadingState.subtitle < 100
@@ -374,7 +374,7 @@ const startDownload = (url: string, filename: string) => {
                 variant="soft"
               />
             </UDropdownMenu>
-          </UButtonGroup>
+          </UFieldGroup>
         </div>
       </div>
     </div>

app/components/aigc/generation/TitlesTemplate.vue

@@ -79,7 +79,7 @@ const closePreview = () => {
         </p>
       </div>
       <div>
-        <UButtonGroup
+        <UFieldGroup
           size="xs"
           v-if="type === 'system'"
         >
@@ -101,7 +101,7 @@ const closePreview = () => {
               color="error"
             />
 
-            <template #panel="{ close }">
+            <template #content="{ close }">
               <div class="flex flex-col gap-2 p-2">
                 <p class="text-xs text-gray-500 dark:text-gray-400">
                   素材删除后不可恢复，确认删除？
@@ -117,7 +117,7 @@ const closePreview = () => {
               </div>
             </template>
           </UPopover>
-        </UButtonGroup>
+        </UFieldGroup>
         <div v-if="type === 'user'">
           <!-- <UButton
             icon="tabler:trash"
@@ -135,7 +135,7 @@ const closePreview = () => {
               size="xs"
             />
 
-            <template #panel="{ close }">
+            <template #content="{ close }">
               <div class="flex flex-col gap-2 p-2">
                 <p class="text-xs text-gray-500 dark:text-gray-400">
                   素材删除后不可恢复，确认删除？