优化按钮组件逻辑.

This commit is contained in:
lijiahang
2024-09-29 10:20:45 +08:00
parent ef57040e1d
commit 3b1d6ab8a4
24 changed files with 417 additions and 275 deletions

View File

@@ -36,65 +36,65 @@
<!-- 右侧操作 -->
<a-space class="log-header-right" :size="12">
<!-- 搜索 -->
<span class="log-action click-icon-wrapper"
title="搜索"
@click="() => appender?.openSearch()">
<a-button class="log-action icon-button"
title="搜索"
@click="() => appender?.openSearch()">
<icon-find-replace />
</span>
</a-button>
<!-- 增大字号 -->
<span class="log-action click-icon-wrapper"
title="增大字号"
@click="() => appender?.addFontSize(1)">
<a-button class="log-action icon-button"
title="增大字号"
@click="() => appender?.addFontSize(1)">
<icon-zoom-in />
</span>
</a-button>
<!-- 减小字号 -->
<span class="log-action click-icon-wrapper"
title="减小字号"
@click="() => appender?.addFontSize(-1)">
<a-button class="log-action icon-button"
title="减小字号"
@click="() => appender?.addFontSize(-1)">
<icon-zoom-out />
</span>
</a-button>
<!-- 去顶部 -->
<span class="log-action click-icon-wrapper"
title="去顶部"
@click="() => appender?.toTop()">
<a-button class="log-action icon-button"
title="去顶部"
@click="() => appender?.toTop()">
<icon-up />
</span>
</a-button>
<!-- 去底部 -->
<span class="log-action click-icon-wrapper"
title="去底部"
@click="() => appender?.toBottom()">
<a-button class="log-action icon-button"
title="去底部"
@click="() => appender?.toBottom()">
<icon-down />
</span>
</a-button>
<!-- 全选 -->
<span class="log-action click-icon-wrapper"
title="全选"
@click="() => appender?.selectAll()">
<a-button class="log-action icon-button"
title="全选"
@click="() => appender?.selectAll()">
<icon-expand />
</span>
</a-button>
<!-- 复制 -->
<span class="log-action click-icon-wrapper"
title="复制"
@click="() => appender?.copy()">
<a-button class="log-action icon-button"
title="复制"
@click="() => appender?.copy()">
<icon-copy />
</span>
</a-button>
<!-- 复制全部 -->
<span class="log-action click-icon-wrapper"
title="复制全部"
@click="() => appender?.copyAll()">
<a-button class="log-action icon-button"
title="复制全部"
@click="() => appender?.copyAll()">
<icon-brush />
</span>
</a-button>
<!-- 清空 -->
<span class="log-action click-icon-wrapper"
title="清空"
@click="() => appender?.clear()">
<a-button class="log-action icon-button"
title="清空"
@click="() => appender?.clear()">
<icon-delete />
</span>
</a-button>
<!-- 下载 -->
<span class="log-action click-icon-wrapper"
title="下载"
@click="downloadLogFile(host.id)">
<a-button class="log-action icon-button"
title="下载"
@click="downloadLogFile(host.id)">
<icon-download />
</span>
</a-button>
</a-space>
</div>
<!-- 右键菜单 -->
@@ -255,7 +255,6 @@
.log-action {
width: 24px;
height: 24px;
font-size: 16px;
}
}

View File

@@ -24,13 +24,13 @@
<div class="card-list-handler-left">
<a-space>
<!-- 创建 -->
<div v-permission="addPermission"
v-if="!handleVisible?.disableAdd"
class="click-icon-wrapper card-header-icon-wrapper"
title="创建"
@click="bubblesEmitter(HeaderEmitter.ADD)">
<a-button v-permission="addPermission"
v-if="!handleVisible?.disableAdd"
class="icon-button card-header-icon-button"
title="创建"
@click="bubblesEmitter(HeaderEmitter.ADD)">
<icon-plus />
</div>
</a-button>
<!-- 左侧侧操作槽位 -->
<slot name="leftHandle" />
</a-space>
@@ -54,14 +54,14 @@
</div>
<!-- 过滤条件 -->
<a-popover position="br" trigger="click" content-class="card-filter-wrapper">
<div v-if="!handleVisible?.disableFilter"
ref="filterRef"
class="click-icon-wrapper card-header-icon-wrapper"
title="选择过滤条件">
<a-button v-if="!handleVisible?.disableFilter"
ref="filterRef"
class="icon-button card-header-icon-button"
title="选择过滤条件">
<a-badge :count="filterCount as number" :dot-style="{zoom: '.75'}" :offset="[9, -6]">
<icon-filter />
</a-badge>
</div>
</a-button>
<template #content>
<div class="card-filter-container">
<!-- 过滤表单 -->
@@ -77,19 +77,19 @@
</template>
</a-popover>
<!-- 搜索 -->
<div v-if="!handleVisible?.disableSearch"
class="click-icon-wrapper card-header-icon-wrapper"
title="搜索"
@click="bubblesEmitter(HeaderEmitter.SEARCH)">
<a-button v-if="!handleVisible?.disableSearch"
class="icon-button card-header-icon-button"
title="搜索"
@click="bubblesEmitter(HeaderEmitter.SEARCH)">
<icon-search />
</div>
</a-button>
<!-- 重置 -->
<div v-if="!handleVisible?.disableReset"
class="click-icon-wrapper card-header-icon-wrapper"
title="重置"
@click="bubblesEmitter(HeaderEmitter.RESET)">
<a-button v-if="!handleVisible?.disableReset"
class="icon-button card-header-icon-button"
title="重置"
@click="bubblesEmitter(HeaderEmitter.RESET)">
<icon-refresh />
</div>
</a-button>
</a-space>
</div>
</div>