- 更新纵坐标刻度算法,优化小数趋势图范围显示 - 添加稳态趋势图全屏模式和共享工具组件 - 实现多图联动的鼠标悬停竖线同步功能 - 调整主线线宽分档策略,降低最大线宽限制 - 重构稳态趋势工具栏,优化谐波次数选择逻辑 - 添加周时间周期搜索支持和自定义时间范围选择 - 完善稳态数据表格和指示器浮动面板功能 - 优化稳态趋势图性能,添加LTB采样和动画控制 - 修复数据表格打开前的趋势数据验证问题 - 统一时间轴标签格式化和网格对齐处理
62 lines
1.6 KiB
Vue
62 lines
1.6 KiB
Vue
<template>
|
|
<div class="trend-tool-groups">
|
|
<div v-for="group in toolGroups" :key="group.key" class="trend-tool-group">
|
|
<el-tooltip v-for="item in group.items" :key="item.action" :content="getToolTooltip(item)" placement="top">
|
|
<el-button
|
|
:type="isToolActive(item.action) ? 'primary' : 'default'"
|
|
:icon="item.icon"
|
|
:disabled="isToolDisabled(item.action)"
|
|
circle
|
|
@click="emit('tool-action', item.action)"
|
|
/>
|
|
</el-tooltip>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { SteadyTrendToolAction, SteadyTrendToolGroup, SteadyTrendToolItem } from './chartTools'
|
|
|
|
defineOptions({
|
|
name: 'SteadyTrendChartTools'
|
|
})
|
|
|
|
defineProps<{
|
|
toolGroups: SteadyTrendToolGroup[]
|
|
isToolActive: (action: SteadyTrendToolAction) => boolean
|
|
isToolDisabled: (action: SteadyTrendToolAction) => boolean
|
|
getToolTooltip: (item: SteadyTrendToolItem) => string
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
'tool-action': [action: SteadyTrendToolAction]
|
|
}>()
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.trend-tool-groups {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
gap: 8px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.trend-tool-group {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
}
|
|
|
|
.trend-tool-group + .trend-tool-group {
|
|
padding-left: 8px;
|
|
border-left: 1px dashed var(--el-border-color);
|
|
}
|
|
|
|
.trend-tool-group :deep(.el-button.is-circle) {
|
|
width: 28px;
|
|
height: 28px;
|
|
padding: 6px;
|
|
}
|
|
</style>
|