点击显示六边形
This commit is contained in:
zhangyu
Binary file not shown.
@@ -20,6 +20,15 @@ Created by iconfont
|
||||
/>
|
||||
<missing-glyph />
|
||||
|
||||
<glyph glyph-name="hexagonBorder" unicode="" d="M102.51377778 148.13866667000002L102.51377778 620.88533333 512.11377778 857.31555555l409.6-236.43022222 1e-8-472.74666666-409.60000001-236.43022222-409.6 236.43022222z m41.64266667 448.96711111l0-425.18755556 367.95733333-212.65066667 368.07111111 212.65066667L880.18488889 597.1057777799999 512.11377778 809.75644445l-367.95733333-212.65066667z m0 0" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="liubianxing" unicode="" d="M512.02151123 834l391.47651123-224.98650088V158.98650088l-391.47651123-224.98650088L120.45500528 158.98650088V608.95950263z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="tuichuquanping" unicode="" d="M402.295461 222.588953L62.505056-117.274588a36.568059 36.568059 0 1 0-51.780371 51.780371L350.588226 274.296188H73.18293a36.568059 36.568059 0 0 0 0 73.136119h365.68059a36.421787 36.421787 0 0 0 36.56806-36.568059v-365.680591a36.568059 36.568059 0 0 0-73.136119 0V222.588953z m219.408355 322.822825L961.494221 885.27532a36.568059 36.568059 0 1 0 51.780372-51.780372L673.411051 493.704543H950.816348a36.568059 36.568059 0 0 0 0-73.136118H585.135757a36.568059 36.568059 0 0 0-36.568059 36.568059V822.817075a36.568059 36.568059 0 0 0 73.136118 0v-277.405297z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="stack" unicode="" d="M1024 492l-512 256-512-256 512-256 512 256zM512 663.04l342.048-171.04-342.048-171.04-342.048 171.04 342.048 171.04zM921.44 351.264l102.56-51.264-512-256-512 256 102.56 51.264 409.44-204.736zM921.44 159.264l102.56-51.264-512-256-512 256 102.56 51.264 409.44-204.736z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 86 KiB After Width: | Height: | Size: 87 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 2.7 KiB |
@@ -27,7 +27,48 @@
|
||||
<el-form-item label="image">
|
||||
<el-input v-model="form.image"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!--<div class="right-box-sub-title">-->
|
||||
<!--<span>{{$t('alert.config.expr')}}</span>-->
|
||||
<!--<span class="float-right" @click="addExpression"><i style="font-size: 16px; cursor: pointer;" class="nz-icon nz-icon-create-square"></i></span>-->
|
||||
<!--</div>-->
|
||||
<!--<el-row class="element-item" style="" v-for="index of promqlKeys.length" :key="'ele' + index">-->
|
||||
<!--<promql-input-->
|
||||
<!--:ref="'promql-'+(index-1)"-->
|
||||
<!--:id="promqlKeys[index-1]"-->
|
||||
<!--:key="promqlKeys[index-1]"-->
|
||||
<!--:expression-list="expressions"-->
|
||||
<!--:index="index-1"-->
|
||||
<!--:styleType="2"-->
|
||||
<!--:plugins="['metric-selector', 'metric-input', 'remove']"-->
|
||||
<!--@change="expressionChange"-->
|
||||
<!--@removeExpression="removeExpression"-->
|
||||
<!--></promql-input>-->
|
||||
<!--<el-row>-->
|
||||
<!--<template v-if="editChart.type != 'singleStat'">-->
|
||||
<!--<el-col style="width: 120px; padding-right: 20px; text-align: right; color: #666">-->
|
||||
<!--{{$t('dashboard.panel.chartForm.legend')}} -->
|
||||
<!--<el-popover :content="$t('dashboard.panel.chartForm.legendTip')" placement="top" width="150" trigger="hover">-->
|
||||
<!--<i slot="reference" class="nz-icon nz-icon-info-normal" style="font-size: 12px; -webkit-transform:scale(0.75);display:inline-block;" @mouseover="rz"></i>-->
|
||||
<!--</el-popover>-->
|
||||
<!--</el-col>-->
|
||||
<!--<el-col style="width: calc(100% - 120px);">-->
|
||||
<!--<el-input v-model="legends[index-1]" type="text" size="small"></el-input>-->
|
||||
<!--</el-col>-->
|
||||
<!--</template>-->
|
||||
<!--<template v-else>-->
|
||||
<!--<el-col style="width: 120px; padding-right: 20px; text-align: right; color: #666">-->
|
||||
<!--{{$t('dashboard.panel.chartForm.statistics')}} -->
|
||||
<!--</el-col>-->
|
||||
<!--<el-col style="width: calc(100% - 120px);">-->
|
||||
<!--<el-select popper-class="chart-box-dropdown-mini" v-model="statistics" placeholder="" size="small">-->
|
||||
<!--<el-option v-for="item in statisticsList" :key="item.value" :label="item.label" :value="item.value">-->
|
||||
<!--<span class="panel-dropdown-label-txt" >{{item.label}}</span>-->
|
||||
<!--</el-option>-->
|
||||
<!--</el-select>-->
|
||||
<!--</el-col>-->
|
||||
<!--</template>-->
|
||||
<!--</el-row>-->
|
||||
<!--</el-row>-->
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
|
||||
@@ -46,8 +87,12 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import promqlInput from "@compotents/page/dashboard/explore/promqlInput";
|
||||
export default {
|
||||
name:"addNode",
|
||||
components:{
|
||||
// 'promql-input': promqlInput,
|
||||
},
|
||||
props:{
|
||||
nodeData:{}
|
||||
},
|
||||
@@ -69,7 +114,9 @@
|
||||
modelId:'',
|
||||
label:'',
|
||||
image:'',
|
||||
}
|
||||
},
|
||||
promqlKeys:[],
|
||||
expressions: [],
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
@@ -77,6 +124,32 @@
|
||||
let model=Object.assign({id:this.form.modelId,shape:'image',shapeProperties:{useImageSize:false}},{...this.form});
|
||||
this.$emit('addModel',model)
|
||||
},
|
||||
expressionChange: function () {
|
||||
|
||||
},
|
||||
addExpression() {
|
||||
this.expressions.push('');
|
||||
this.legends.push('');
|
||||
this.promqlKeys.push(getUUID());
|
||||
this.elementIds.push("");
|
||||
this.promqlCount++;
|
||||
},
|
||||
removeExpression(index) {
|
||||
if (this.promqlCount > 1) {
|
||||
this.expressions.splice(index, 1);
|
||||
this.legends.splice(index, 1);
|
||||
this.promqlKeys.splice(index, 1);
|
||||
this.elementIds.splice(index, 1);
|
||||
this.promqlCount--;
|
||||
this.$nextTick(() => {
|
||||
this.expressions.forEach((ex, index) => {
|
||||
if (ex) {
|
||||
this.$refs[`promql-${index}`][0].metricChange(ex);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
/*关闭弹框*/
|
||||
esc(refresh) {
|
||||
this.$emit("close", refresh);
|
||||
@@ -211,6 +284,61 @@
|
||||
margin: 6px 0 0 7px;
|
||||
}
|
||||
/* end--table*/
|
||||
|
||||
|
||||
.el-row {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.el-row:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.el-col {
|
||||
border-radius: 4px;
|
||||
}
|
||||
.bg-purple {
|
||||
background: white;
|
||||
}
|
||||
.grid-content {
|
||||
border-radius: 4px;
|
||||
min-height: 36px;
|
||||
}
|
||||
|
||||
.common-float-left {
|
||||
float: left;
|
||||
display:inline-block;
|
||||
}
|
||||
|
||||
.el-inner {
|
||||
width: 200px;
|
||||
border-top-width: 0px;
|
||||
border-left-width: 0px;
|
||||
border-right-width: 0px;
|
||||
border-bottom-width: 10px;
|
||||
border-color:red;
|
||||
/*outline: medium;*/
|
||||
}
|
||||
|
||||
.element-bottom-border {
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 1px solid #dfe7f2;
|
||||
margin-top: 15px;
|
||||
}
|
||||
/*metric样式--begin*/
|
||||
.element-item {
|
||||
padding: 20px 0;
|
||||
border-bottom: 1px dashed #dfe7f2;
|
||||
width: 100%;
|
||||
}
|
||||
/*metric样式--end*/
|
||||
.label-center{
|
||||
vertical-align: middle;
|
||||
line-height: 34px;
|
||||
}
|
||||
|
||||
.z-top {
|
||||
z-index: 2900;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
@@ -464,7 +464,7 @@
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
.line-chart-block, .chart-table, .chart-single-stat, .chart-url, .chart-asset-info, .chart-alert-info, .chart-project-info, .chart-alert-rule-info {
|
||||
.line-chart-block, .chart-table, .chart-single-stat, .chart-url, .chart-asset-info, .chart-alert-info, .chart-project-info, .chart-alert-rule-info ,.vis-network{
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background-color: white;
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="editTopology">
|
||||
<!--<button @click="addModelShow" v-show="!selectNodeTitle">add model</button>-->
|
||||
<!--<button @click="addLineTitleShow" v-show="!selectNodeTitle">add line</button>-->
|
||||
<!--<button @click="lineDel" v-show="!selectNodeTitle">remove line</button>-->
|
||||
<span>Module element :<span class="editTopologyAdd">Add</span><span class="editTopologyRemove">Remove</span></span>
|
||||
<span>Line :<span class="editTopologyAdd">Add</span><span class="editTopologyRemove">Remove</span></span>
|
||||
</div>
|
||||
<div class="network" v-clickoutside="networkPopClose">
|
||||
<!--图拓扑图-->
|
||||
<div id="network_id" ref="visNetwork" :class="{'cursorMove': cursorMove}"></div>
|
||||
@@ -10,16 +17,18 @@
|
||||
:style="{'top':networkPopTop,'left':networkPopLeft}"
|
||||
v-show="networkPopShow"
|
||||
>
|
||||
<i class="nz-icon nz-icon-edit" @click.stop="nodeEdit"></i>
|
||||
<i class="nz-icon nz-icon-delete" @click="nodeDel"></i>
|
||||
<div class="btmTriangle"></div>
|
||||
<i class="nz-icon nz-icon-hexagonBorder" v-for="item in popData" :style="{top:item.top,left:item.left}">
|
||||
<i class="nz-icon nz-icon-liubianxing"></i>
|
||||
<i :class="[item.className,{'nz-icon':item.className},'noMove']"></i>
|
||||
</i>
|
||||
<!--<i class="nz-icon nz-icon-delete" @click="nodeDel"></i>-->
|
||||
</div>
|
||||
<!--拓扑图选中-->
|
||||
<div></div>
|
||||
<div></div>
|
||||
<!--图谱图右侧-->
|
||||
<!--<div class="networkContent">33333</div>-->
|
||||
</div>
|
||||
<button @click="addModelShow" v-show="!selectNodeTitle">add model</button>
|
||||
<button @click="addLineTitleShow" v-show="!selectNodeTitle">add line</button>
|
||||
<button @click="lineDel" v-show="!selectNodeTitle">remove line</button>
|
||||
<span v-show="selectNodeTitle">请选择两个节点 <button @click="closeAddLine">取消</button></span>
|
||||
<transition name="right-box">
|
||||
<add-model v-if="addNodeShow" @addModel="addModel" :nodeData="nodeData" @close="addNodeShow=false" @del="nodeDel"></add-model>
|
||||
@@ -95,6 +104,14 @@
|
||||
y:'',
|
||||
image:'',
|
||||
},
|
||||
popData:[
|
||||
{top:'-20px', left:'-17px',className:'nz-icon-chart',id:'1'},
|
||||
{top:'-20px', left:'28px',className:'nz-icon-chart',id:'2'},
|
||||
{top:'18px', left:'52px',className:'nz-icon-chart',id:'3'},
|
||||
{top:'56px', left:'28px',className:'',id:'4'},
|
||||
{top:'56px', left:'-17px',className:'nz-icon-chart',id:'5'},
|
||||
{top:'18px', left:'-38px',className:'nz-icon-chart',id:'6'},
|
||||
],
|
||||
//viewsCenter
|
||||
viewsCenter:{
|
||||
x:0,y:0
|
||||
@@ -132,18 +149,10 @@
|
||||
nodes: {
|
||||
shape: 'dot',
|
||||
size: 40,
|
||||
font: {
|
||||
size: 16,
|
||||
},
|
||||
borderWidth: 2,
|
||||
// chosen:{
|
||||
// node:(values, id, selected, hovering)=>{
|
||||
// console.log(values, id, selected, hovering);
|
||||
// if(hovering){
|
||||
// this_.cursorMove=true;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
font:{
|
||||
size:'20',
|
||||
},
|
||||
},
|
||||
|
||||
edges: {
|
||||
@@ -389,6 +398,10 @@
|
||||
.content{
|
||||
height: 100%;
|
||||
}
|
||||
.editTopology{
|
||||
width: 100%;
|
||||
height: 28px;
|
||||
}
|
||||
.network{
|
||||
display: flex;
|
||||
height: calc(100% - 30px);
|
||||
@@ -397,13 +410,42 @@
|
||||
.networkPop{
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
border: 1px solid #e6e6e6;
|
||||
/*border: 1px solid #e6e6e6;*/
|
||||
border-radius: 5px;
|
||||
height: 32px;
|
||||
background: #fff;
|
||||
/*background: #fff;*/
|
||||
padding: 0 3px;
|
||||
line-height: 32px;
|
||||
}
|
||||
.networkPop .nz-icon-hexagonBorder{
|
||||
position: absolute;
|
||||
font-size: 48px;
|
||||
color: #84d5c2;
|
||||
}
|
||||
.networkPop .nz-icon-liubianxing{
|
||||
color:#e2f3ef;
|
||||
font-size: 41px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 3px;
|
||||
}
|
||||
.noMove{
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
left: 12px;
|
||||
font-size: 24px;
|
||||
color: #27c09c;
|
||||
}
|
||||
.networkPop .nz-icon-hexagonBorder:hover{
|
||||
transform: scale(1.2);
|
||||
}
|
||||
.networkPop .nz-icon-hexagonBorder:hover .nz-icon-liubianxing{
|
||||
transform: scale(1.1);
|
||||
left: 4px;
|
||||
}
|
||||
.networkPop .nz-icon-hexagonBorder:hover .noMove{
|
||||
transform: scale(1.1);
|
||||
}
|
||||
.btmTriangle{
|
||||
position: absolute;
|
||||
width: 0;
|
||||
@@ -449,4 +491,12 @@
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.editTopology{
|
||||
color: #1a1a1a;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.editTopologyAdd{
|
||||
color: #1989fa;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -2,9 +2,9 @@
|
||||
<div class="nz-chart-resize">
|
||||
<div class="resize-shadow" ref="resizeShadow"></div>
|
||||
<div class="resize-box resize-box-table" ref="resizeBox">
|
||||
<div class="chart-table" :id="'chartTableDiv'+chartIndex" @mouseenter="caretShow=true" @mouseleave="caretShow=false">
|
||||
<div class="vis-network" :id="'chartTableDiv'+chartIndex" @mouseenter="caretShow=true" @mouseleave="caretShow=false">
|
||||
<loading :ref="'localLoading'+chartIndex"></loading>
|
||||
<div class="clearfix chartTitle" :class="{'dragTitle':dragTitleShow}" :id="'chartTitle'+chartIndex">
|
||||
<div class="clearfix chartTitle text-right" :class="{'dragTitle':dragTitleShow}" :id="'chartTitle'+chartIndex">
|
||||
<el-popover
|
||||
v-if="isError"
|
||||
:close-delay=10
|
||||
@@ -17,40 +17,13 @@
|
||||
<span class="panel-info-corner-inner"></span>
|
||||
</span>
|
||||
</el-popover>
|
||||
<el-dropdown trigger="click" class="nz-chart-top" :key="'chartDropdown'+chartIndex" v-clickoutside="clickos">
|
||||
<el-dropdown-menu style="display: none"></el-dropdown-menu>
|
||||
<span class="el-dropdown-link chart-title" @click="dropdownMenuShow=!dropdownMenuShow">
|
||||
<span class="chart-title-text">{{chartData.title}}</span>
|
||||
<span class="chart-title-icon"><i class="el-icon-caret-bottom el-icon--right" :class="{'visible':caretShow,'hidden':!caretShow}"></i></span>
|
||||
</span>
|
||||
<ul slot="dropdown" v-show="dropdownMenuShow" :id="'dropdownUl'+chartIndex" class="el-dropdown-menu nz-chart-dropdown" style="position: absolute; top: 30px; left: calc(50% - 79px); transform-origin: center top; z-index: 1000;" >
|
||||
<li @click="refreshChart" class="el-dropdown-menu__item">
|
||||
<i class="global-active-color el-icon-refresh-right" style="font-size: 16px;"></i><span>{{$t('dashboard.refresh')}}</span></li>
|
||||
<li @click="editChart" class="el-dropdown-menu__item">
|
||||
<i class="nz-icon nz-icon-edit" style="font-size: 14px; margin-right: 11px; margin-left: 1px;"></i>{{$t('dashboard.edit')}}</li>
|
||||
<li @click="removeChart" class="el-dropdown-menu__item">
|
||||
<i class="el-icon-delete" style="font-size: 16px;"></i>{{$t('dashboard.delete')}}</li>
|
||||
<li @click="showAllScreen" class="el-dropdown-menu__item">
|
||||
<i class="el-icon-full-screen" style="font-size: 16px;"></i>{{$t('dashboard.screen')}}</li>
|
||||
<li @click="duplicate" class="el-dropdown-menu__item">
|
||||
<i class="el-icon-copy-document" style="font-size: 16px;"></i>{{$t('dashboard.duplicate')}}</li>
|
||||
</ul>
|
||||
</el-dropdown>
|
||||
<i class="nz-icon nz-icon-edit"></i>
|
||||
<i class="nz-icon nz-icon-zoomin"></i>
|
||||
<i class="nz-icon nz-icon-exit-full-screen"></i>
|
||||
</div>
|
||||
<div class="mt-10 table-container">
|
||||
<topology :nodesArray="nodesArray" :edgesArray="edgesArray" @setTopologyData="setTopologyData" :isFullScreen="false" ref="topology"></topology>
|
||||
</div>
|
||||
<!--全屏-->
|
||||
<el-dialog class="nz-dialog table-chart-dialog" :title="$t('dashboard.panel.view')" :visible.sync="screenModal" width="96%" @close="exitFull">
|
||||
<div slot="title">
|
||||
<!--<span class="nz-dialog-title">{{data.title}}</span>-->
|
||||
<div class="float-right panel-calendar dialog-tool">
|
||||
<time-picker ref="calendarPanel" class="nz-dashboard-picker" style="margin-top: -12px;" @change="dateChange"></time-picker>
|
||||
</div>
|
||||
</div>
|
||||
<topology :nodesArray="nodesArray" :edgesArray="edgesArray" @setTopologyData="setTopologyData" :isFullScreen="true" ref="topologyFull"></topology>
|
||||
<loading :ref="'localLoadingScreen'+chartIndex"></loading>
|
||||
</el-dialog>
|
||||
<span class="vue-resizable-handle" @mousedown="startResize"></span>
|
||||
</div>
|
||||
|
||||
@@ -84,67 +57,11 @@
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
//其他
|
||||
tableHeight: 0,
|
||||
data: {}, // 该图表信息,chartItem
|
||||
unit:{},
|
||||
isError:false,
|
||||
errorContent:'',
|
||||
pageSizes:[50,100,200],
|
||||
pageObj: {
|
||||
pageNo: 1,
|
||||
pageSize: 50,
|
||||
total: 0
|
||||
},
|
||||
screenPageObj:{
|
||||
pageNo: 1,
|
||||
pageSize: 50,
|
||||
total: 0
|
||||
},
|
||||
storedTableData:[],
|
||||
storedScreanTableData:[],
|
||||
seriesItem: [], // 保存信息
|
||||
seriesItemScreen:[],//全屏数据
|
||||
images: '',
|
||||
loading:Object,
|
||||
items: {
|
||||
metric_name: [], // 每条数据列名称
|
||||
xAxis: [],
|
||||
theData: [], // series数据组
|
||||
},
|
||||
panelIdInner: '', // 看板id=panelId,原写作chart,由set_data获取
|
||||
firstLoad: true, // 是否第一次加载
|
||||
chartType: 'table', // 图表类型
|
||||
screenModal: false,
|
||||
// 查询数据使用
|
||||
filter: {
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
},
|
||||
stableFilter: {}, // 保存数据使用,初始化起止时间,单图or多图等
|
||||
firstShow: false, // 默认不显示操作按钮,
|
||||
caretShow:false,
|
||||
dragTitleShow:false,
|
||||
dropdownMenuShow:false,
|
||||
divFirstShow:false,
|
||||
columns: [
|
||||
{
|
||||
title:'Element',
|
||||
key:'element',
|
||||
sortable: true
|
||||
}
|
||||
, {
|
||||
title: '采集时间',
|
||||
key: 'time',
|
||||
width: 160,
|
||||
render: (h, params) => h('span', bus.timeFormate(params.row.time, 'yyyy-MM-dd hh:mm:ss')),
|
||||
}, {
|
||||
title: '数值',
|
||||
key: 'value',
|
||||
width: 160,
|
||||
sortable: true,
|
||||
render: (h, params) => h('span', this.getNumStr(params.row.value)),
|
||||
}],
|
||||
searchTime: [new Date().setHours(new Date().getHours() - 1), new Date()],//全屏显示的时间
|
||||
oldSearchTime: [],
|
||||
nodesArray:[
|
||||
@@ -296,54 +213,6 @@
|
||||
})
|
||||
}
|
||||
},
|
||||
// 设置数据, filter区分
|
||||
setData(chartItem, seriesItem, panelId, filter,area,errorMsg) {
|
||||
if(errorMsg && errorMsg!==''){
|
||||
this.isError = true;
|
||||
this.errorContent = errorMsg;
|
||||
}else {
|
||||
this.isError = false;
|
||||
this.errorContent = '';
|
||||
}
|
||||
if(area==='showFullScreen'){//全屏按时间查询
|
||||
this.data = chartItem;
|
||||
this.unit = chartDataFormat.getUnit(this.data.unit);
|
||||
this.searchTime[0] = filter.start_time;//将列表的查询时间复制给全屏的查询时间
|
||||
this.searchTime[1] = filter.end_time;
|
||||
// this.seriesItemScreen = seriesItem;
|
||||
this.storedScreanTableData=seriesItem;
|
||||
this.storedScreanTableData=Object.assign([],this.storedScreanTableData.reverse());
|
||||
this.screenPageObj.total=this.storedScreanTableData.length;
|
||||
this.seriesItemScreen=this.filterShowData(this.storedScreanTableData,this.screenPageObj);
|
||||
this.endLoading('screen');
|
||||
} else{
|
||||
//设置高度 chart-table
|
||||
this.divFirstShow = true;
|
||||
this.$nextTick(() => {
|
||||
this.resize(chartItem);
|
||||
});
|
||||
this.firstShow = true; // 展示操作按键
|
||||
|
||||
this.panelIdInner = panelId;
|
||||
this.data = chartItem;
|
||||
this.unit = chartDataFormat.getUnit(this.data.unit);
|
||||
this.storedTableData =seriesItem;
|
||||
this.storedScreanTableData=seriesItem;
|
||||
this.storedTableData=Object.assign([],this.storedTableData.reverse());
|
||||
this.storedScreanTableData=Object.assign([],this.storedScreanTableData.reverse());
|
||||
this.pageObj.total=this.storedTableData.length;
|
||||
this.screenPageObj.total=this.storedScreanTableData.length;
|
||||
this.seriesItem=this.filterShowData(this.storedTableData,this.pageObj);
|
||||
this.seriesItemScreen =this.filterShowData(this.storedScreanTableData,this.screenPageObj)
|
||||
if (filter) { // 保存数据,用于同步时间
|
||||
this.searchTime[0] = filter.start_time;//将列表的查询时间复制给全屏的查询时间
|
||||
this.searchTime[1] = filter.end_time;
|
||||
this.oldSearchTime[0] = this.searchTime[0];
|
||||
this.oldSearchTime[1] = this.searchTime[1];
|
||||
}
|
||||
this.endLoading();
|
||||
}
|
||||
},
|
||||
dealLegendAlias:function(legend,expression){
|
||||
if(/\{\{.+\}\}/.test(expression)){
|
||||
let labelValue=expression.replace(/(\{\{.+?\}\})/g,function(i){
|
||||
@@ -393,8 +262,8 @@
|
||||
this.nodesArray=nodesArr;
|
||||
this.edgesArray=edgesArr;
|
||||
},
|
||||
//退出全屏
|
||||
exitFull(){
|
||||
//重置拓扑图数据
|
||||
resetAllNodes(){
|
||||
this.screenModal = false;
|
||||
this.$refs.topology.resetAllNodes()
|
||||
}
|
||||
@@ -414,4 +283,10 @@
|
||||
.table-container{
|
||||
height: calc(100% - 30px);
|
||||
}
|
||||
.nz-icon{
|
||||
cursor: pointer;
|
||||
}
|
||||
.resize-box .vis-network .text-right{
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user