vue 监控 拓扑地址
Showing
2 changed files
with
39 additions
and
7 deletions
@@ -62,7 +62,7 @@ export const monitorBasicInformationTwo = { | @@ -62,7 +62,7 @@ export const monitorBasicInformationTwo = { | ||
62 | name: 'logoAdressBg', | 62 | name: 'logoAdressBg', |
63 | required: false, | 63 | required: false, |
64 | placeholder: '', | 64 | placeholder: '', |
65 | - value: '', | 65 | + value: '' |
66 | }, | 66 | }, |
67 | { | 67 | { |
68 | type: 'el-input-number', | 68 | type: 'el-input-number', |
@@ -73,6 +73,22 @@ export const monitorBasicInformationTwo = { | @@ -73,6 +73,22 @@ export const monitorBasicInformationTwo = { | ||
73 | value: '14' | 73 | value: '14' |
74 | }, | 74 | }, |
75 | { | 75 | { |
76 | + type: 'el-input-text', | ||
77 | + label: '监控地址', | ||
78 | + name: 'jkAddress', | ||
79 | + required: false, | ||
80 | + placeholder: '', | ||
81 | + value: '' | ||
82 | + }, | ||
83 | + { | ||
84 | + type: 'el-input-text', | ||
85 | + label: '拓扑地址', | ||
86 | + name: 'topoAddress', | ||
87 | + required: false, | ||
88 | + placeholder: '', | ||
89 | + value: '' | ||
90 | + }, | ||
91 | + { | ||
76 | type: 'el-input-number', | 92 | type: 'el-input-number', |
77 | label: '图片大小', | 93 | label: '图片大小', |
78 | name: 'pictureSize', | 94 | name: 'pictureSize', |
@@ -13,15 +13,15 @@ | @@ -13,15 +13,15 @@ | ||
13 | <!-- <dynamicTableComponents :formData="dtInformationData"></dynamicTableComponents>--> | 13 | <!-- <dynamicTableComponents :formData="dtInformationData"></dynamicTableComponents>--> |
14 | <div class="basic-ul-right" > | 14 | <div class="basic-ul-right" > |
15 | <div @mouseenter="mouseFun" @mouseleave="leaveFun"> | 15 | <div @mouseenter="mouseFun" @mouseleave="leaveFun"> |
16 | - <el-row :style="fontStyle"> | 16 | + <el-row class="backColor" :style="fontStyle"> |
17 | <el-col aria-colspan="2"> | 17 | <el-col aria-colspan="2"> |
18 | - <a class="link-type" :href="resUrl" target="_blank">{{informationData[0].name}}</a> | 18 | + <a class="link-type" :href="jkAddress.jkUrl" target="_blank">{{informationData[0].name}}</a> |
19 | <i class="el-icon-info" v-if="visible" @click="resTopo"/> | 19 | <i class="el-icon-info" v-if="visible" @click="resTopo"/> |
20 | </el-col> | 20 | </el-col> |
21 | </el-row> | 21 | </el-row> |
22 | </div> | 22 | </div> |
23 | <el-row class="basic-item" :style="fontStyle" v-for="(item,index) in informationData" :key="index"> | 23 | <el-row class="basic-item" :style="fontStyle" v-for="(item,index) in informationData" :key="index"> |
24 | - <el-col v-if="attrKey.attrKeyVal.indexOf(item.code)>0 && index>0" class="basic-border basic-item-title basic-flex" :span="10"> | 24 | + <el-col v-if="attrKey.attrKeyVal.indexOf(item.code)>0 && index>0" class="basic-border basic-item-title basic-flex backColor" :span="10"> |
25 | {{ item.name }} | 25 | {{ item.name }} |
26 | </el-col> | 26 | </el-col> |
27 | <el-col v-if="attrKey.attrKeyVal.indexOf(item.code)>0 && index>0 " class="basic-border basic-item-content" :span="14"><span>{{ item.value }}</span> | 27 | <el-col v-if="attrKey.attrKeyVal.indexOf(item.code)>0 && index>0 " class="basic-border basic-item-content" :span="14"><span>{{ item.value }}</span> |
@@ -132,8 +132,22 @@ | @@ -132,8 +132,22 @@ | ||
132 | imgSizeStyle() { | 132 | imgSizeStyle() { |
133 | return { | 133 | return { |
134 | "width": this.transStyle.pictureSize + "px", | 134 | "width": this.transStyle.pictureSize + "px", |
135 | + "height" : $(".basic-ul-right").height() | ||
135 | } | 136 | } |
136 | }, | 137 | }, |
138 | + //监控地址 | ||
139 | + jkAddress(){ | ||
140 | + return { | ||
141 | + "jkUrl": this.transStyle.jkAddress, | ||
142 | + } | ||
143 | + }, | ||
144 | + //拓扑地址 | ||
145 | + topoAddress(){ | ||
146 | + return { | ||
147 | + "topoUrl": this.transStyle.topoAddress, | ||
148 | + } | ||
149 | + //https://192.168.0.248:8080/api-web/mxgraph/generateByBusId?busId=35964e90f4cf4a48a0e87f406e6088e2&access_token=dbb1a2d3-8c0d-4a3b-b40b-fdbfd16fa7f8 | ||
150 | + } | ||
137 | }, | 151 | }, |
138 | watch: { | 152 | watch: { |
139 | value: { | 153 | value: { |
@@ -229,7 +243,7 @@ | @@ -229,7 +243,7 @@ | ||
229 | }, | 243 | }, |
230 | // | 244 | // |
231 | resTopo() { | 245 | resTopo() { |
232 | - this.topoSrc = "http://www.baidu.com"; | 246 | + this.topoSrc = this.topoAddress.topoUrl; |
233 | this.topoVisible = true; | 247 | this.topoVisible = true; |
234 | }, | 248 | }, |
235 | //弹框关闭确定 | 249 | //弹框关闭确定 |
@@ -259,10 +273,12 @@ | @@ -259,10 +273,12 @@ | ||
259 | text-align: left; | 273 | text-align: left; |
260 | padding: 8px 10px; | 274 | padding: 8px 10px; |
261 | } | 275 | } |
262 | - | 276 | + .backColor { |
277 | + background-color: #f1f6f9; | ||
278 | + } | ||
263 | .basic-ul-left { | 279 | .basic-ul-left { |
264 | /*border: 0;*/ | 280 | /*border: 0;*/ |
265 | - width: 100%; | 281 | + width: 50%; |
266 | height: 100%; | 282 | height: 100%; |
267 | /*padding-left: 10px;*/ | 283 | /*padding-left: 10px;*/ |
268 | /*float: left;*/ | 284 | /*float: left;*/ |
-
Please register or login to post a comment