修改保险后端代码，政府前端代码

bank-frontend/src/App.vue

@@ -9,7 +9,7 @@
     </div>
     
     <!-- 桌面端布局 -->
-    <a-layout v-else style="min-height: 100vh">
+    <a-layout v-else class="desktop-layout">
       <a-layout-header class="header">
         <div class="logo">
           <a-button 
@@ -50,24 +50,24 @@
         </div>
       </a-layout-header>
       
-      <a-layout>
+      <a-layout class="main-layout">
         <a-layout-sider 
+          class="sidebar"
           width="200" 
-          style="background: #001529"
           :collapsed="sidebarCollapsed"
           collapsible
         >
           <DynamicMenu :collapsed="sidebarCollapsed" />
         </a-layout-sider>
         
-        <a-layout style="padding: 0 24px 24px">
-          <a-layout-content
-            :style="{ background: '#fff', padding: '24px', margin: '16px 0' }"
-          >
-            <router-view />
+        <a-layout class="content-layout">
+          <a-layout-content class="main-content">
+            <div class="content-wrapper">
+              <router-view />
+            </div>
           </a-layout-content>
           
-          <a-layout-footer style="text-align: center">
+          <a-layout-footer class="footer">
             银行管理后台系统 ©2025
           </a-layout-footer>
         </a-layout>
@@ -156,14 +156,32 @@ onUnmounted(() => {
 </script>
 
 <style scoped>
-/* 桌面端样式 */
+/* 桌面端布局样式 */
+.desktop-layout {
+  height: 100vh;
+  overflow: hidden;
+}
+
+.main-layout {
+  height: calc(100vh - 64px);
+  overflow: hidden;
+}
+
+/* 头部样式 */
 .header {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
   display: flex;
   align-items: center;
   justify-content: space-between;
   background: #001529;
   color: white;
   padding: 0 24px;
+  height: 64px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
 }
 
 .logo {
@@ -179,6 +197,114 @@ onUnmounted(() => {
   gap: 16px;
 }
 
+/* 侧边栏样式 */
+.sidebar {
+  position: fixed;
+  top: 64px;
+  left: 0;
+  height: calc(100vh - 64px);
+  background: #001529 !important;
+  z-index: 999;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+
+.sidebar::-webkit-scrollbar {
+  width: 6px;
+}
+
+.sidebar::-webkit-scrollbar-track {
+  background: #001529;
+}
+
+.sidebar::-webkit-scrollbar-thumb {
+  background: #1890ff;
+  border-radius: 3px;
+}
+
+.sidebar::-webkit-scrollbar-thumb:hover {
+  background: #40a9ff;
+}
+
+/* 内容区域样式 */
+.content-layout {
+  margin-left: 200px;
+  height: calc(100vh - 64px);
+  transition: margin-left 0.2s;
+}
+
+.main-content {
+  height: calc(100vh - 64px - 70px);
+  overflow-y: auto;
+  overflow-x: hidden;
+  background: #f0f2f5;
+}
+
+.content-wrapper {
+  padding: 24px;
+  min-height: 100%;
+  background: #fff;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+}
+
+.footer {
+  height: 70px;
+  line-height: 70px;
+  text-align: center;
+  background: #fff;
+  border-top: 1px solid #f0f0f0;
+  color: #666;
+}
+
+/* 侧边栏折叠时的样式 */
+.desktop-layout :deep(.ant-layout-sider-collapsed) {
+  width: 80px !important;
+  min-width: 80px !important;
+  max-width: 80px !important;
+  flex: 0 0 80px !important;
+}
+
+.desktop-layout :deep(.ant-layout-sider-collapsed) + .content-layout {
+  margin-left: 80px;
+  transition: margin-left 0.2s;
+}
+
+/* 响应式支持 */
+@media (max-width: 768px) {
+  .content-layout {
+    margin-left: 0 !important;
+  }
+  
+  .sidebar {
+    transform: translateX(-100%);
+    transition: transform 0.3s;
+  }
+  
+  .sidebar.ant-layout-sider-collapsed {
+    transform: translateX(0);
+  }
+}
+
+/* 内容区域滚动条样式 */
+.main-content::-webkit-scrollbar {
+  width: 8px;
+}
+
+.main-content::-webkit-scrollbar-track {
+  background: #f0f0f0;
+  border-radius: 4px;
+}
+
+.main-content::-webkit-scrollbar-thumb {
+  background: #d9d9d9;
+  border-radius: 4px;
+}
+
+.main-content::-webkit-scrollbar-thumb:hover {
+  background: #bfbfbf;
+}
+
 /* 移动端布局样式 */
 .mobile-layout {
   min-height: 100vh;