diff --git a/src/App.vue b/src/App.vue index b4c332d..97c2adc 100644 --- a/src/App.vue +++ b/src/App.vue @@ -89,24 +89,24 @@ const activeFileGroups = computed(() => {
-
- + - - - - -
+
+ +
+ +
diff --git a/src/components/Yys.vue b/src/components/Yys.vue index 71b9a40..67f5d5d 100644 --- a/src/components/Yys.vue +++ b/src/components/Yys.vue @@ -43,7 +43,8 @@
@@ -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 { diff --git a/src/stores/files.ts b/src/stores/files.ts index a0cddcb..dae4bdf 100644 --- a/src/stores/files.ts +++ b/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: '', - groupInfo: [{}, {}, {}, {}, {}], + shortDescription: '

鬼灵歌姬

这是一个演示项目,用于测试显示效果

', + 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: '' }, {