✨ 新增卡片布局模式

Author: zhaojun1998

src/layouts/file.vue

@@ -7,7 +7,7 @@
         </template>
       </Suspense>
     </el-header>
-    <el-main>
+		<el-main :class="'el-main-' + storageConfigStore.globalConfig?.layout">
       <router-view />
     </el-main>
     <el-footer v-if="storageConfigStore.globalConfig?.icp">
@@ -90,6 +90,10 @@ const loadGlobalSiteSetting = () => {
     overflow-x: hidden;
   }
 
+  .el-main-card {
+    @apply bg-gray-100;
+  }
+
   // 定义脚部高度，边框
   .el-footer {
     border-top: var(--zfile-header-footer-border-top);

src/pages/admin/view-setting.vue

@@ -15,6 +15,7 @@
 		<z-form-item label="页面布局">
 			<el-radio v-model="data.layout" label="full">全屏</el-radio>
 			<el-radio v-model="data.layout" label="center">居中</el-radio>
+      <el-radio v-model="data.layout" label="card">卡片</el-radio>
 		</z-form-item>
 
 		<z-form-item label="根目录显示所有存储源">