style: 统一页面按钮样式与尺寸

This commit is contained in:
2026-08-01 19:06:41 +08:00
parent a87fdba4cc
commit 297320446c
8 changed files with 40 additions and 44 deletions
+21
View File
@@ -35,6 +35,27 @@ a:hover {
box-shadow: var(--shadow-soft);
}
/* 按钮操作区统一规范:窄屏下操作按钮纵向全宽 */
.action-row .el-button,
.edit-actions .el-button,
.fragment-edit-actions .el-button {
margin: 0;
}
@media (max-width: 768px) {
.action-row,
.edit-actions,
.fragment-edit-actions {
flex-direction: column;
}
.action-row .el-button,
.edit-actions .el-button,
.fragment-edit-actions .el-button {
width: 100%;
}
}
.fade-up-enter-active,
.fade-up-leave-active {
transition: opacity 0.22s ease, transform 0.22s ease;
+4 -2
View File
@@ -66,7 +66,7 @@ onMounted(() => {
<section class="review-page">
<div class="table-toolbar">
<span class="toolbar-placeholder"></span>
<el-button type="success" plain size="small" :loading="loading" @click="loadTasks">刷新</el-button>
<el-button type="success" plain :loading="loading" @click="loadTasks">刷新</el-button>
</div>
<div class="summary-grid">
@@ -99,6 +99,7 @@ onMounted(() => {
<el-button
text
type="success"
size="small"
:loading="openingTaskNum === row.taskNum"
@click.stop="openTaskReview(row)"
>
@@ -106,7 +107,8 @@ onMounted(() => {
</el-button>
<el-button
text
type="primary"
type="success"
size="small"
@click.stop="router.push(`/review/recall/${row.taskNum}`)"
>
回忆复习
+2 -2
View File
@@ -252,8 +252,8 @@ watch(
placeholder="请输入学习内容"
/>
<div class="edit-actions">
<el-button @click="cancelEdit">取消</el-button>
<el-button type="success" :loading="saving" @click="saveEdit">保存</el-button>
<el-button size="small" @click="cancelEdit">取消</el-button>
<el-button type="success" size="small" :loading="saving" @click="saveEdit">保存</el-button>
</div>
</div>
<!-- 只读模式 -->
+1 -8
View File
@@ -374,7 +374,6 @@ onMounted(() => {
<section class="recall-page">
<!-- 顶部操作栏 -->
<div class="page-header">
<el-button size="small" @click="router.back()"> 返回</el-button>
<h2>回忆复习</h2>
<el-button size="small" @click="loadHistory" v-if="!showHistory">
历史记录
@@ -478,18 +477,16 @@ onMounted(() => {
<div class="panel-actions">
<el-button
v-if="hasCompared"
size="small"
type="success"
@click="resetComparison"
>
返回完整导图
</el-button>
<el-button size="small" @click="standardExpanded = !standardExpanded">
<el-button @click="standardExpanded = !standardExpanded">
{{ standardExpanded ? "折叠" : "展开" }}
</el-button>
<el-button
v-if="standardExpanded"
size="small"
type="warning"
:loading="regenerating"
@click="handleRegenerate"
@@ -498,7 +495,6 @@ onMounted(() => {
</el-button>
<el-button
v-if="standardExpanded && !editingStandard"
size="small"
type="primary"
@click="startEditStandard"
>
@@ -612,9 +608,6 @@ onMounted(() => {
.surface-card {
padding: 20px 22px;
background: #fff;
border-radius: 8px;
border: 1px solid var(--border-soft, #e0e0e0);
}
.surface-card h3 {
+3 -14
View File
@@ -663,6 +663,7 @@ onUnmounted(() => {
<el-button
text
size="small"
type="primary"
@click="expectationContent = expectationSaved; expectationDialogVisible = true"
>
修改
@@ -749,12 +750,12 @@ onUnmounted(() => {
/>
<div class="fragment-edit-actions">
<el-button size="small" @click="cancelEditFragment">取消</el-button>
<el-button size="small" type="primary" :loading="savingFragment" @click="saveEditFragment(fragment.id)">保存</el-button>
<el-button size="small" type="success" :loading="savingFragment" @click="saveEditFragment(fragment.id)">保存</el-button>
</div>
</template>
<template v-else>
<span class="fragment-content">{{ fragment.content }}</span>
<el-button size="small" @click="startEditFragment(fragment)">编辑</el-button>
<el-button text type="primary" size="small" @click="startEditFragment(fragment)">编辑</el-button>
</template>
</div>
</article>
@@ -1104,10 +1105,6 @@ onUnmounted(() => {
gap: 8px;
}
.action-row .el-button {
margin: 0;
}
.fragments-card {
padding: 20px;
}
@@ -1172,14 +1169,6 @@ onUnmounted(() => {
.info-grid {
grid-template-columns: 1fr;
}
.action-row {
flex-direction: column;
}
.action-row .el-button {
width: 100%;
}
}
/* ---- 历史学习记录 ---- */
+5 -5
View File
@@ -457,12 +457,12 @@ onMounted(() => {
<aside class="surface-card action-card">
<div class="block-title">常用操作</div>
<el-button size="large" @click="fetchTasks" :loading="loading">刷新列表</el-button>
<el-button @click="fetchTasks" :loading="loading">刷新列表</el-button>
<el-button type="success" size="large" @click="startTask">开始任务</el-button>
<el-button size="large" @click="addTask">添加任务</el-button>
<el-button size="large" @click="changeTask">更新任务</el-button>
<el-button size="large" @click="openWeightsDialog">权重配置</el-button>
<el-button type="danger" size="large" @click="removeTask">删除任务</el-button>
<el-button @click="addTask">添加任务</el-button>
<el-button @click="changeTask">更新任务</el-button>
<el-button @click="openWeightsDialog">权重配置</el-button>
<el-button type="danger" @click="removeTask">删除任务</el-button>
</aside>
</main>
</div>
+1 -10
View File
@@ -410,7 +410,7 @@ async function previewMaterial() {
<div class="group" v-if="isUpdateMode" v-loading="applicationLoading">
<div class="application-header">
<h3>应用场景</h3>
<el-button type="primary" @click="openApplicationDialog()">添加应用场景</el-button>
<el-button type="success" @click="openApplicationDialog()">添加应用场景</el-button>
</div>
<div class="application-list" v-if="applications.length > 0">
<div class="application-item" v-for="item in applications" :key="item.id">
@@ -608,15 +608,6 @@ async function previewMaterial() {
padding: 16px;
}
.action-row {
flex-direction: column;
}
.action-row .el-button {
width: 100%;
margin: 0;
}
.application-main {
align-items: flex-start;
flex-direction: column;
+3 -3
View File
@@ -216,11 +216,11 @@ onMounted(() => {
</div>
</template>
<template #footer>
<el-button v-if="!recallCard.revealed" type="success" @click="revealRecallContent">
<el-button v-if="!recallCard.revealed" type="success" plain @click="revealRecallContent">
回忆好了展开对照
</el-button>
<el-button v-else type="success" @click="openRecallDetail">进入详情页</el-button>
<el-button type="success" plain @click="goToRecallFromCard">前往回忆复习</el-button>
<el-button v-else type="success" plain @click="openRecallDetail">进入详情页</el-button>
<el-button type="success" @click="goToRecallFromCard">前往回忆复习</el-button>
<el-button @click="recallCard.visible = false">关闭</el-button>
</template>
</el-dialog>