NEZ-963 chart 鼠标移入悬浮提示

This commit is contained in:
@changcode
2021-09-02 14:43:06 +08:00
parent cfdb06bd39
commit 1afdff8de1
11 changed files with 108 additions and 12 deletions

View File

@@ -37,7 +37,11 @@
<el-dropdown trigger="click" class="nz-chart-top" :key="'chartDropdown'+chartIndex" v-clickoutside="clickos" :class="{'move-able':!isLock}">
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<!-- <span class="chart-title-text">{{chartData.name}}</span>-->
<span class="chart-title-text" v-on:mouseover="changeActive()" v-on:mouseout="removeActive()">{{chartData.name}}</span>
<transition name="el-fade-in-linear">
<span v-show="chartDataList" class="chart-title-pit" >{{chartData.name}}</span>
</transition>
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
@@ -66,7 +70,11 @@
</el-dropdown>
</div>
<div v-if="from==='topology'" :class="{'drag-disabled': this.filter.from == $CONSTANTS.fromRoute.alertRule}" :id="'chartTitle'+chartIndex" class="topology-chart-title">
<span class="topology-chart-title-text">{{chartData.name}}</span>
<!-- <span class="topology-chart-title-text">{{chartData.name}}</span>-->
<span class="topology-chart-title-text" v-on:mouseover="changeActive()" v-on:mouseout="removeActive()">{{chartData.name}}</span>
<transition name="el-fade-in-linear">
<span v-show="chartDataList" class="chart-title-pit" >{{chartData.name}}</span>
</transition>
</div>
<div class="line-area" ref="lineChartArea" :id="'lineChartArea'+chartIndex" v-show="firstShow" style="width:100%;"></div>
<div class="chart-no-data" v-show="noData">No Data</div>
@@ -205,6 +213,7 @@ import chartConfig from '../page/dashboard/overview/chartConfig'
import { getChart, setChart, lineChartMove, getMousePoint } from '../common/js/common'
import { getMetricTypeValue, chartResizeTool, formatScientificNotation } from '../common/js/tools'
import moment from 'moment-timezone'
import chartDataList from '@/components/common/mixin/chartDataList'
export default {
name: 'lineChartBlock',
@@ -259,6 +268,7 @@ export default {
}
}
},
mixins: [chartDataList],
data () {
return {
data: {}, // 该图表信息,chartItem