feat: 添加卡片布局控制功能,支持动态调整每行卡片数量

This commit is contained in:
2025-08-06 15:56:15 +08:00
parent 5ad4e7cef6
commit 11de60ab06
3 changed files with 155 additions and 3 deletions

View File

@@ -167,6 +167,19 @@
<path d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" stroke="currentColor" stroke-width="2"/>
</svg>
</button>
</div>
<!-- 卡片布局控制 -->
<div class="cards-layout-controls" id="cardsLayoutControls" style="display: none;">
<select class="cards-per-row-select"
onchange="changeCardsPerRow(this.value)"
aria-label="每行卡片数量">
<option value="1">1 列</option>
<option value="2" selected>2 列</option>
<option value="3">3 列</option>
<option value="4">4 列</option>
<option value="6">6 列</option>
</select>
</div>
<!-- 导出功能 -->
@@ -267,7 +280,7 @@
<!-- 卡片视图 -->
<div class="data-cards-container" style="display: none;">
<div class="data-cards">
<div class="data-cards" data-columns="2">
{{range $row := .Data}}
<div class="data-card">
<div class="data-card-title">