From bed5647b52016a291938e55104fe9f3357681828 Mon Sep 17 00:00:00 2001
From: Vben <ann.vben@gmail.com>
Date: Thu, 17 Oct 2024 22:40:20 +0800
Subject: [PATCH] fix: form required style adjustment (#4668)

---
 .../ui-kit/form-ui/src/form-render/form-field.vue      |  2 +-
 .../ui-kit/form-ui/src/form-render/form-label.vue      | 10 ++++++----
 .../layouts/src/authentication/authentication.vue      |  6 +++---
 3 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
index f66a4bb6b87..091bcc87257 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
+++ b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
@@ -278,7 +278,7 @@ function autofocus() {
           cn(
             'flex leading-6',
             {
-              'mr-2 flex-shrink-0': !isVertical,
+              'mr-2 flex-shrink-0 justify-end': !isVertical,
               'flex-row': isVertical,
             },
             !isVertical && labelClass,
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue b/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue
index 1e135f01d1c..53d84041bd2 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue
+++ b/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue
@@ -1,20 +1,22 @@
 <script setup lang="ts">
 import { FormLabel, VbenHelpTooltip } from '@vben-core/shadcn-ui';
+import { cn } from '@vben-core/shared/utils';
 
 interface Props {
+  class?: string;
   help?: string;
   required?: boolean;
 }
 
-defineProps<Props>();
+const props = defineProps<Props>();
 </script>
 
 <template>
-  <FormLabel class="flex flex-row-reverse items-center">
+  <FormLabel :class="cn('mb-1 flex items-center', props.class)">
+    <span v-if="required" class="text-destructive mr-[2px]">*</span>
+    <slot></slot>
     <VbenHelpTooltip v-if="help" trigger-class="size-3.5 ml-1">
       {{ help }}
     </VbenHelpTooltip>
-    <slot></slot>
-    <span v-if="required" class="text-destructive mr-[2px]">*</span>
   </FormLabel>
 </template>
diff --git a/packages/effects/layouts/src/authentication/authentication.vue b/packages/effects/layouts/src/authentication/authentication.vue
index 1117390a8dc..ceae8027f9e 100644
--- a/packages/effects/layouts/src/authentication/authentication.vue
+++ b/packages/effects/layouts/src/authentication/authentication.vue
@@ -61,12 +61,12 @@ const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
     </AuthenticationFormView>
 
     <!-- 头部 Logo 和应用名称 -->
-    <div class="absolute left-0 top-0 z-10 flex flex-1">
+    <div v-if="logo || appName" class="absolute left-0 top-0 z-10 flex flex-1">
       <div
         class="text-foreground lg:text-foreground ml-4 mt-4 flex flex-1 items-center sm:left-6 sm:top-6"
       >
-        <img :alt="appName" :src="logo" class="mr-2" width="42" />
-        <p class="text-xl font-medium">
+        <img v-if="logo" :alt="appName" :src="logo" class="mr-2" width="42" />
+        <p v-if="appName" class="text-xl font-medium">
           {{ appName }}
         </p>
       </div>