|
...
|
...
|
@@ -12,15 +12,35 @@ |
|
|
|
</div>
|
|
|
|
<!-- <dynamicTableComponents :formData="dtInformationData"></dynamicTableComponents>-->
|
|
|
|
<div class="basic-ul-right" :style="borderStyleF" >
|
|
|
|
<div @mouseenter="mouseFun" @mouseleave="leaveFun" v-if="informationData[0].isDisplay=='1'">
|
|
|
|
<el-row class="backColor">
|
|
|
|
<el-col class="padding-10" :style="[borderStlye,tableTitleStyle]" aria-colspan="2">
|
|
|
|
<span class="link-type" :style="tableTitleStyle" @click="goTrend(informationData[0])">{{informationData[0].name}}</span>
|
|
|
|
<!-- <a class="link-type" :style="tableTitleStyle" :href="jkAddress.jkUrl" target="_blank"></a>-->
|
|
|
|
<i class="el-icon-info" v-if="visible" @click="resTopo"/>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
</div>
|
|
|
|
<div v-if="informationDataAll[0].isDisplay=='1'" >
|
|
|
|
<el-row class="backColor" :style="bodyTitleStyle">
|
|
|
|
<el-col class="padding-10" :style="[tableTitleStyle]" aria-colspan="2">
|
|
|
|
<span class="link-type" :style="tableTitleStyle" @click="goTrend(informationDataAll[0])">{{informationDataAll[0].name}}</span>
|
|
|
|
<el-tooltip v-model="visible" :manual="true" placement="right-start">
|
|
|
|
<template #content>
|
|
|
|
<div class="basic-tbody-all basic-border-nowrap" :style="wrapStyle">
|
|
|
|
<el-row class="basic-item" v-if="item.isDisplay=='1' && index>0" v-for="(item,index) in informationDataAll" :key="index">
|
|
|
|
<el-col :style="[lineHeightStyle]" v-if="index>0" class="basic-border basic-item-title basic-flex" :span="10">
|
|
|
|
{{ item.name }}
|
|
|
|
</el-col>
|
|
|
|
<el-col :style="[lineHeightStyle]" v-if="index>0 " class="basic-border basic-flex basic-item-content" :span="14"><span>{{ item.value }}</span>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<i class="el-icon-info"@mouseenter="visible = true"/>
|
|
|
|
</el-tooltip>
|
|
|
|
<el-tooltip
|
|
|
|
class="box-item"
|
|
|
|
effect="dark"
|
|
|
|
content="查看拓扑图"
|
|
|
|
placement="top"
|
|
|
|
>
|
|
|
|
<i class="el-icon-orange" @click="resTopo(item)" ></i>
|
|
|
|
</el-tooltip>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
</div>
|
|
|
|
<div class="basic-tbody basic-border-wrap" :style="wrapStyle">
|
|
|
|
<el-row class="basic-item" :style="itemStyle" v-if="item.isDisplay=='1' && index>0" v-for="(item,index) in informationData" :key="index">
|
|
|
|
<!-- <el-col :style="headStyle" v-if="attrKey.attrKeyVal.indexOf(item.code)>0 && index>0" class="basic-border basic-item-title basic-flex backColor" :span="10">-->
|
|
...
|
...
|
@@ -32,7 +52,7 @@ |
|
|
|
</el-col>
|
|
|
|
<!-- && attrKey.attrKeyVal.includes(item.code)-->
|
|
|
|
</el-row>
|
|
|
|
<el-row class="basic-item 111" :style="[itemStyle,borderStlyeLast]" v-if="informationData.length%2==0">
|
|
|
|
<el-row class="basic-item 111" :style="[itemStyle,borderStlyeLast]" v-if="optionsSetUp.isTowColumn && informationData.length%2==0">
|
|
|
|
<el-col class="basic-border basic-item-title basic-flex" :span="10">
|
|
|
|
</el-col>
|
|
|
|
<el-col class="basic-border basic-flex basic-item-content" :span="14"><span></span>
|
|
...
|
...
|
@@ -173,6 +193,18 @@ |
|
|
|
"border-top-color": headStyle.borderColor,
|
|
|
|
};
|
|
|
|
},
|
|
|
|
//信息表格内容标题样式
|
|
|
|
bodyTitleStyle(){
|
|
|
|
const headStyle = this.optionsSetUp;
|
|
|
|
return{
|
|
|
|
"border-bottom-style": headStyle.isLine ? "solid" : "none",
|
|
|
|
"border-bottom-width": headStyle.borderWidth + "px",
|
|
|
|
"border-bottom-color":headStyle.borderColor,
|
|
|
|
"border-right-style": headStyle.isLine ? "solid" : "none",
|
|
|
|
"border-right-width": headStyle.borderWidth + "px",
|
|
|
|
"border-right-color":headStyle.borderColor,
|
|
|
|
}
|
|
|
|
},
|
|
|
|
//表格标题样式
|
|
|
|
tableTitleStyle(){
|
|
|
|
return{
|
|
...
|
...
|
@@ -274,7 +306,7 @@ |
|
|
|
methods: {
|
|
|
|
//右侧最后一个元素边框样式
|
|
|
|
borderStyleRight(index){
|
|
|
|
let border='none';
|
|
|
|
/* let border='none';
|
|
|
|
if(index+1==this.informationData.length){
|
|
|
|
border='none'
|
|
|
|
}else{
|
|
...
|
...
|
@@ -282,7 +314,7 @@ |
|
|
|
}
|
|
|
|
return{
|
|
|
|
'border-right':border
|
|
|
|
}
|
|
|
|
}*/
|
|
|
|
},
|
|
|
|
handlerData() {
|
|
|
|
const resData = this.optionsData;
|
|
...
|
...
|
@@ -405,9 +437,18 @@ |
|
|
|
this.visible = false;
|
|
|
|
},
|
|
|
|
//
|
|
|
|
resTopo() {
|
|
|
|
this.topoSrc = this.topoAddress.topoUrl;
|
|
|
|
this.topoVisible = true;
|
|
|
|
resTopo(item) {
|
|
|
|
// this.topoSrc = this.topoAddress.topoUrl;
|
|
|
|
// this.topoVisible = true;
|
|
|
|
let param = {
|
|
|
|
type:'topology',
|
|
|
|
data:{
|
|
|
|
resId: item.resId,
|
|
|
|
resType: item.resType
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
window.parent.postMessage(param, '*')
|
|
|
|
},
|
|
|
|
//弹框关闭确定
|
|
|
|
hideDialog() {
|
|
...
|
...
|
@@ -481,8 +522,15 @@ |
|
|
|
white-space: nowrap;
|
|
|
|
color: #0d82e9;
|
|
|
|
cursor: pointer;
|
|
|
|
margin-right:5px;
|
|
|
|
}
|
|
|
|
.box-item{
|
|
|
|
margin-left:5px;
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
.el-icon-info{
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
.title-name {
|
|
|
|
color: rgb(30, 159, 255);
|
|
|
|
font-size: 16px;
|
|
...
|
...
|
@@ -509,7 +557,7 @@ |
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.basic-ul-all {
|
|
|
|
.basic-tbody-all {
|
|
|
|
.basic-item:nth-child(even) {
|
|
|
|
background-color: #262323 !important;
|
|
|
|
}
|
|
...
|
...
|
@@ -533,7 +581,11 @@ |
|
|
|
//flex-flow: column;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
|
|
|
|
.basic-border-nowrap{
|
|
|
|
display: flex;
|
|
|
|
flex-flow: column;
|
|
|
|
min-width: 200px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.basic-img {
|
|
|
|
width: 16px;
|
|
...
|
...
|
@@ -552,7 +604,7 @@ |
|
|
|
display: inline-block;
|
|
|
|
}
|
|
|
|
}*/
|
|
|
|
.basic-ul-all {
|
|
|
|
.basic-tbody-all {
|
|
|
|
.basic-item-content {
|
|
|
|
text-align: center;
|
|
|
|
}
|
...
|
...
|
|
