feat: 优化

frontend/app/web-gold/src/layouts/components/FullWidthLayout.vue

@@ -1,5 +1,4 @@
 <script setup>
-import { ArrowLeftOutlined } from '@ant-design/icons-vue'
 import LayoutHeader from './LayoutHeader.vue'
 
 defineOptions({ name: 'FullWidthLayout' })
@@ -34,27 +33,27 @@ const handleBack = () => {
 </script>
 
 <template>
-  <div class="full-width-layout">
-    <div v-if="$slots.header || showBack" class="full-width-layout__header-wrapper">
-       <LayoutHeader 
-        :show-back="showBack" 
+  <div class="flex flex-col h-full overflow-hidden bg-card">
+    <div v-if="$slots.header || showBack" class="shrink-0">
+      <LayoutHeader
+        :show-back="showBack"
         :ghost="headerGhost"
         :padding="headerPadding"
         @back="handleBack"
       >
         <template #header v-if="$slots.header">
-           <slot name="header"></slot>
+          <slot name="header"></slot>
         </template>
         <template #extra>
           <slot name="extra"></slot>
         </template>
       </LayoutHeader>
     </div>
-   
+
     <!-- 全宽内容 -->
     <div
-      class="full-width-layout__content"
-      :class="{ 'no-padding': !showPadding }"
+      class="flex-1 overflow-auto bg-background"
+      :class="{ 'p-0': !showPadding, 'p-4': showPadding }"
     >
       <slot></slot>
     </div>
@@ -62,25 +61,5 @@ const handleBack = () => {
 </template>
 
 <style scoped lang="less">
-.full-width-layout {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  background: var(--color-bg-card);
-}
-
-.full-width-layout__header-wrapper {
-  flex-shrink: 0;
-}
-
-.full-width-layout__content {
-  flex: 1;
-  overflow: auto;
-  background: var(--color-bg);
-
-  &.no-padding {
-    padding: 0;
-  }
-}
+/* 使用 Tailwind 类，已移除旧样式 */
 </style>