增加演示项目，修复css引起的相关故障

src/App.vue

@@ -89,24 +89,24 @@ const activeFileGroups = computed(() => {
 
       <!-- 工作区 -->
       <div class="workspace">
-        <main id="main-container" :style="{ height: contentHeight, overflow: 'auto' }">
+        <el-tabs
-          <el-tabs
+            v-model="filesStore.activeFile"
-              v-model="filesStore.activeFile"
+            type="card"
-              type="card"
+            class="demo-tabs"
-              class="demo-tabs"
+            editable
-              editable
+            @edit="handleTabsEdit"
-              @edit="handleTabsEdit"
+        >
+          <el-tab-pane
+              v-for="(file, index) in filesStore.visibleFiles"
+              :key="index"
+              :label="file.label"
+              :name="file.name.toString()"
           >
-            <el-tab-pane
+            <main id="main-container" :style="{ height: contentHeight, overflow: 'auto' }">
-                v-for="(file, index) in filesStore.visibleFiles"
+              <Yys :groups="activeFileGroups" ref="yysRef"/>
-                :key="index"
+            </main>
-                :label="file.label"
+          </el-tab-pane>
-                :name="file.name.toString()"
+        </el-tabs>
-            >
-              <Yys :groups="activeFileGroups" ref="yysRef" />
-            </el-tab-pane>
-          </el-tabs>
-        </main>
       </div>
     </div>
   </div>

src/components/Yys.vue

@@ -43,7 +43,8 @@
           <div class="group-body">
             <draggable :list="group.groupInfo" item-key="name" class="body-content">
               <template #item="{element : position, index:positionIndex}">
-                <el-col>
+                <div>
+                  <el-col>
                     <el-card class="group-card" shadow="never">
                       <div class="opt-btn" data-html2canvas-ignore="true">
                         <!-- Add delete button here -->
@@ -88,6 +89,7 @@
                       </div>
                     </el-card>
                   </el-col>
+                </div>
               </template>
             </draggable>
           </div>
@@ -390,7 +392,8 @@ defineExpose({
 }
 
 .group-header {
-    padding: 10px;
+  margin: 10px;
+  padding: 10px;
 }
 
 .group-opt {
@@ -419,6 +422,7 @@ defineExpose({
 
   .avatar-container {
     position: relative;
+    min-width: 100px;
   }
 
   .avatar-container span {

src/stores/files.ts

@@ -4,13 +4,42 @@ export const useFilesStore = defineStore('files', {
     state: () => ({
         fileList: [
             {
-                label: 'File 1',
+                label: 'Welcome',
                 name: "1",
                 visible: true,
                 groups: [
                     {
-                        shortDescription: '',
+                        shortDescription: '<h1>鬼灵歌姬</h1><p>这是一个演示项目，用于测试显示效果</p>',
-                        groupInfo: [{}, {}, {}, {}, {}],
+                        groupInfo: [{
+                            "avatar": "/assets/Shikigami/sp/372.png",
+                            "name": "因幡辉夜姬",
+                            "rarity": "SP"
+                        },
+                            {
+                                "avatar": "/assets/Shikigami/ssr/356.png",
+                                "name": "千姬",
+                                "rarity": "SSR"
+                            },
+                            {
+                                "avatar": "/assets/Shikigami/sp/554.png",
+                                "name": "纺愿缘结神",
+                                "rarity": "SP"
+                            },
+                            {
+                                "avatar": "/assets/Shikigami/ssr/556.png",
+                                "name": "天照",
+                                "rarity": "SSR"
+                            },
+                            {
+                                "avatar": "/assets/Shikigami/ssr/557.png",
+                                "name": "伊邪那美",
+                                "rarity": "SSR"
+                            },
+                            {
+                                "avatar": "/assets/Shikigami/sp/367.png",
+                                "name": "绘世花鸟卷",
+                                "rarity": "SP"
+                            }],
                         details: ''
                     },
                     {