mirror of
https://github.com/Powerful-517/yys-editor.git
synced 2025-06-05 05:55:22 +00:00
增加演示项目,修复css引起的相关故障
This commit is contained in:
parent
20232a5d7c
commit
5336b57d9b
34
src/App.vue
34
src/App.vue
@ -89,24 +89,24 @@ const activeFileGroups = computed(() => {
|
||||
|
||||
<!-- 工作区 -->
|
||||
<div class="workspace">
|
||||
<main id="main-container" :style="{ height: contentHeight, overflow: 'auto' }">
|
||||
<el-tabs
|
||||
v-model="filesStore.activeFile"
|
||||
type="card"
|
||||
class="demo-tabs"
|
||||
editable
|
||||
@edit="handleTabsEdit"
|
||||
<el-tabs
|
||||
v-model="filesStore.activeFile"
|
||||
type="card"
|
||||
class="demo-tabs"
|
||||
editable
|
||||
@edit="handleTabsEdit"
|
||||
>
|
||||
<el-tab-pane
|
||||
v-for="(file, index) in filesStore.visibleFiles"
|
||||
:key="index"
|
||||
:label="file.label"
|
||||
:name="file.name.toString()"
|
||||
>
|
||||
<el-tab-pane
|
||||
v-for="(file, index) in filesStore.visibleFiles"
|
||||
:key="index"
|
||||
:label="file.label"
|
||||
:name="file.name.toString()"
|
||||
>
|
||||
<Yys :groups="activeFileGroups" ref="yysRef" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</main>
|
||||
<main id="main-container" :style="{ height: contentHeight, overflow: 'auto' }">
|
||||
<Yys :groups="activeFileGroups" ref="yysRef"/>
|
||||
</main>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -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 {
|
||||
|
@ -4,13 +4,42 @@ export const useFilesStore = defineStore('files', {
|
||||
state: () => ({
|
||||
fileList: [
|
||||
{
|
||||
label: 'File 1',
|
||||
label: 'Welcome',
|
||||
name: "1",
|
||||
visible: true,
|
||||
groups: [
|
||||
{
|
||||
shortDescription: '',
|
||||
groupInfo: [{}, {}, {}, {}, {}],
|
||||
shortDescription: '<h1>鬼灵歌姬</h1><p>这是一个演示项目,用于测试显示效果</p>',
|
||||
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: ''
|
||||
},
|
||||
{
|
||||
|
Loading…
x
Reference in New Issue
Block a user