monitor_v3 / anji-plus-report · Commits

Go to a project

Authored by 王涛
Commit 2750749fd49459ba0b13587a908e9c1845f1b086 2 parents 391662f7 84177df8

Merge branch 'master-500-dev-lushangqing' into 'master-500-dev' 

表格分页组件增加空数据



See merge request !47
Inline Side-by-side
Showing 9 changed files with 126 additions and 55 deletions
@@ -5,7 +5,8 @@ const prodEnv = require('./prod.env') @@ -5,7 +5,8 @@ const prodEnv = require('./prod.env')
5 module.exports = merge(prodEnv, { 5 module.exports = merge(prodEnv, {
6 NODE_ENV: '"development"', 6 NODE_ENV: '"development"',
7 BASE_API: '"http://192.168.0.75:9095"', 7 BASE_API: '"http://192.168.0.75:9095"',
8 - // MONITOR_GATEWAY: '"https://192.168.0.69:8080"'  
9 MONITOR_GATEWAY: '"http://192.168.0.75:8080"' 8 MONITOR_GATEWAY: '"http://192.168.0.75:8080"'
10 - // BASE_API: '"http://10.108.26.197:9095"' 9 + // BASE_API: '"http://192.168.1.50:9095"',
  10 + // MONITOR_GATEWAY: '"http://192.168.1.50:8080"'
  11 +
11 }) 12 })
@@ -21,7 +21,8 @@ @@ -21,7 +21,8 @@
21 size="small" 21 size="small"
22 >编辑</el-button 22 >编辑</el-button
23 >--> 23 >-->
24 - <el-switch size="mini" @change="switchChange" v-model.trim="scope.row.isDisplay" /> 24 + {{scope.row.isDisplay}}
  25 + <el-switch active-value="1" inactive-value="2" size="mini" @change="switchChange" v-model.trim="scope.row.isDisplay" />
25 26
26 </div> 27 </div>
27 </template> 28 </template>
@@ -323,14 +323,14 @@ export const monitorBasicInformationTwo = { @@ -323,14 +323,14 @@ export const monitorBasicInformationTwo = {
323 ] 323 ]
324 }, 324 },
325 ], 325 ],
326 - { 326 + /*{
327 type: 'el-input-text', 327 type: 'el-input-text',
328 label: '属性key', 328 label: '属性key',
329 name: 'attKey', 329 name: 'attKey',
330 required: false, 330 required: false,
331 placeholder: '请输入Key值，以逗号分割', 331 placeholder: '请输入Key值，以逗号分割',
332 value: 'vmware,ipAddress,resPool,host,vMachine' 332 value: 'vmware,ipAddress,resPool,host,vMachine'
333 - }, 333 + },*/
334 { 334 {
335 type: 'dynamic-detail-table-information', 335 type: 'dynamic-detail-table-information',
336 label: '', 336 label: '',
@@ -339,10 +339,11 @@ export const monitorBasicInformationTwo = { @@ -339,10 +339,11 @@ export const monitorBasicInformationTwo = {
339 chartType:'detail-table', 339 chartType:'detail-table',
340 placeholder: '', 340 placeholder: '',
341 value: [ 341 value: [
342 - {name: 'IP地址', key: 'ipAddress', width: '50%',isDisplay:true},  
343 - {name: '资源池', key: 'resPool', width: '50%',isDisplay:true},  
344 - {name: '宿主机', key: 'host', width: '50%',isDisplay:true},  
345 - {name: '虚拟机', key: 'vMachine', width: '50%',isDisplay:true}, 342 + {name: 'vmware-80.12.89.77', key: 'vmware', width: '50%',isDisplay:'1'},
  343 + {name: 'IP地址', key: 'ipAddress', width: '50%',isDisplay:'1'},
  344 + {name: '资源池', key: 'resPool', width: '50%',isDisplay:'1'},
  345 + {name: '宿主机', key: 'host', width: '50%',isDisplay:'1'},
  346 + {name: '虚拟机', key: 'vMachine', width: '50%',isDisplay:'1'},
346 ] 347 ]
347 } 348 }
348 ], 349 ],
@@ -30,7 +30,7 @@ export const monitorProgressInformation = { @@ -30,7 +30,7 @@ export const monitorProgressInformation = {
30 placeholder: '', 30 placeholder: '',
31 value: '' 31 value: ''
32 }, 32 },
33 - { 33 + /*{
34 type: 'el-switch', 34 type: 'el-switch',
35 label: '加边框', 35 label: '加边框',
36 name: 'isBorder', 36 name: 'isBorder',
@@ -53,6 +53,14 @@ export const monitorProgressInformation = { @@ -53,6 +53,14 @@ export const monitorProgressInformation = {
53 required: false, 53 required: false,
54 placeholder: '', 54 placeholder: '',
55 value: 'rgba(151, 151, 151, 0.13)', 55 value: 'rgba(151, 151, 151, 0.13)',
  56 + },*/
  57 + {
  58 + type: 'vue-color',
  59 + label: '每块背景颜色',
  60 + name: 'itemBackground',
  61 + required: false,
  62 + placeholder: '',
  63 + value: ''
56 }, 64 },
57 { 65 {
58 type: 'el-select', 66 type: 'el-select',
@@ -62,28 +62,28 @@ export const monitorTreeShape = { @@ -62,28 +62,28 @@ export const monitorTreeShape = {
62 // placeholder: '', 62 // placeholder: '',
63 // value: '18' 63 // value: '18'
64 // }, 64 // },
65 - // {  
66 - // type: 'vue-color',  
67 - // label: '字体颜色',  
68 - // name: 'titleColor',  
69 - // required: false,  
70 - // placeholder: '',  
71 - // value: '#666'  
72 - // },  
73 - // {  
74 - // type: 'el-select',  
75 - // label: '字体粗细',  
76 - // name: 'titleFontWeight',  
77 - // required: false,  
78 - // placeholder: '',  
79 - // selectOptions: [  
80 - // {code: 'normal', name: '正常'},  
81 - // {code: 'bold', name: '粗体'},  
82 - // {code: 'bolder', name: '特粗体'},  
83 - // {code: 'lighter', name: '细体'}  
84 - // ],  
85 - // value: 'normal'  
86 - // }, 65 + {
  66 + type: 'vue-color',
  67 + label: '字体颜色',
  68 + name: 'titleColor',
  69 + required: false,
  70 + placeholder: '',
  71 + value: '#666'
  72 + },
  73 + {
  74 + type: 'el-select',
  75 + label: '字体粗细',
  76 + name: 'titleFontWeight',
  77 + required: false,
  78 + placeholder: '',
  79 + selectOptions: [
  80 + {code: 'normal', name: '正常'},
  81 + {code: 'bold', name: '粗体'},
  82 + {code: 'bolder', name: '特粗体'},
  83 + {code: 'lighter', name: '细体'}
  84 + ],
  85 + value: 'normal'
  86 + },
87 87
88 ], 88 ],
89 // 数据 89 // 数据
@@ -125,25 +125,28 @@ export const monitorTreeShape = { @@ -125,25 +125,28 @@ export const monitorTreeShape = {
125 relactiveDomValue: 'staticData', 125 relactiveDomValue: 'staticData',
126 value: [ 126 value: [
127 { 127 {
128 - label: 'Level one 1', 128 + label: '核心征管',
129 id:1, 129 id:1,
130 children: [ 130 children: [
131 { 131 {
132 - label: 'Level two 1-1', 132 + label: '小型机分区',
133 id:"1-1", 133 id:"1-1",
134 children: [ 134 children: [
135 - 135 + {
  136 + label:'核心征管镜像库26',
  137 + id:'1-1-1'
  138 + }
136 ], 139 ],
137 }, 140 },
138 { 141 {
139 - label: 'Level three 1-2', 142 + label: 'PC服务器',
140 id:'1-2', 143 id:'1-2',
141 children:[] 144 children:[]
142 }, 145 },
143 ], 146 ],
144 }, 147 },
145 { 148 {
146 - label: 'Level one 2', 149 + label: '电子税务局',
147 id:2, 150 id:2,
148 children: [ 151 children: [
149 { 152 {
@@ -12,7 +12,7 @@ @@ -12,7 +12,7 @@
12 </div> 12 </div>
13 <!-- <dynamicTableComponents :formData="dtInformationData"></dynamicTableComponents>--> 13 <!-- <dynamicTableComponents :formData="dtInformationData"></dynamicTableComponents>-->
14 <div class="basic-ul-right" :style="borderStyleF" > 14 <div class="basic-ul-right" :style="borderStyleF" >
15 - <div @mouseenter="mouseFun" @mouseleave="leaveFun"> 15 + <div @mouseenter="mouseFun" @mouseleave="leaveFun" v-if="informationData[0].isDisplay=='1'">
16 <el-row class="backColor"> 16 <el-row class="backColor">
17 <el-col class="padding-10" :style="[borderStlye,tableTitleStyle]" aria-colspan="2"> 17 <el-col class="padding-10" :style="[borderStlye,tableTitleStyle]" aria-colspan="2">
18 <a class="link-type" :style="tableTitleStyle" :href="jkAddress.jkUrl" target="_blank">{{informationData[0].name}}</a> 18 <a class="link-type" :style="tableTitleStyle" :href="jkAddress.jkUrl" target="_blank">{{informationData[0].name}}</a>
@@ -21,7 +21,7 @@ @@ -21,7 +21,7 @@
21 </el-row> 21 </el-row>
22 </div> 22 </div>
23 <div class="basic-tbody basic-border-wrap" :style="wrapStyle"> 23 <div class="basic-tbody basic-border-wrap" :style="wrapStyle">
24 - <el-row class="basic-item" :style="itemStyle" v-if="item.isDisplay" v-for="(item,index) in informationData" :key="index"> 24 + <el-row class="basic-item" :style="itemStyle" v-if="item.isDisplay=='1' && index>0" v-for="(item,index) in informationData" :key="index">
25 <!-- <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">--> 25 <!-- <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">-->
26 <el-col :style="[headStyle,borderStlye,lineHeightStyle]" v-if="index>0" class="basic-border basic-item-title basic-flex backColor" :span="10"> 26 <el-col :style="[headStyle,borderStlye,lineHeightStyle]" v-if="index>0" class="basic-border basic-item-title basic-flex backColor" :span="10">
27 {{ item.name }} 27 {{ item.name }}
@@ -31,13 +31,12 @@ @@ -31,13 +31,12 @@
31 </el-col> 31 </el-col>
32 <!-- && attrKey.attrKeyVal.includes(item.code)--> 32 <!-- && attrKey.attrKeyVal.includes(item.code)-->
33 </el-row> 33 </el-row>
34 - <el-row class="basic-item" :style="[itemStyle,borderStlyeLast]" v-if="informationData.length%2==0"> 34 +<!-- <el-row class="basic-item 111" :style="[itemStyle,borderStlyeLast]" v-if="dataLength==informationData.length && informationData.length%2==0">
35 <el-col class="basic-border basic-item-title basic-flex" :span="10"> 35 <el-col class="basic-border basic-item-title basic-flex" :span="10">
36 </el-col> 36 </el-col>
37 <el-col class="basic-border basic-flex basic-item-content" :span="14"><span></span> 37 <el-col class="basic-border basic-flex basic-item-content" :span="14"><span></span>
38 </el-col> 38 </el-col>
39 - <!-- && attrKey.attrKeyVal.includes(item.code)-->  
40 - </el-row> 39 + </el-row>-->
41 </div> 40 </div>
42 41
43 </div> 42 </div>
@@ -72,6 +71,7 @@ @@ -72,6 +71,7 @@
72 optionsData: {}, 71 optionsData: {},
73 informationData: [{name:'',code:''}], 72 informationData: [{name:'',code:''}],
74 informationDataAll: [], 73 informationDataAll: [],
  74 + dataLength:0,
75 tableDate: [], 75 tableDate: [],
76 pressingVisible: false, 76 pressingVisible: false,
77 pressingVisibleTip: false, 77 pressingVisibleTip: false,
@@ -254,6 +254,7 @@ @@ -254,6 +254,7 @@
254 this.optionsPosition = val.position; 254 this.optionsPosition = val.position;
255 this.optionsData = val.data; 255 this.optionsData = val.data;
256 this.handlerData(); 256 this.handlerData();
  257 + // this.setDisplay();
257 }, 258 },
258 deep: true 259 deep: true
259 } 260 }
@@ -287,10 +288,29 @@ @@ -287,10 +288,29 @@
287 }, 288 },
288 handlerStaticData(data) { 289 handlerStaticData(data) {
289 this.informationDataAll = data; 290 this.informationDataAll = data;
290 - this.setDisplay();  
291 - if (this.imgStyle.dataNum) {  
292 - this.informationData = this.informationDataAll.slice(0, this.imgStyle.dataNum); 291 + if (this.informationDataAll && this.informationDataAll.length > 0) {
  292 + this.informationDataAll.map(item => {
  293 + if (typeof (item.value) != 'string') {
  294 + item.value = item.value[0].state;
  295 + }
  296 + item.isDisplay='1';
  297 +
  298 + })
293 } 299 }
  300 + this.setDisplay();
  301 +
  302 + this.dataLength=this.informationData.length;
  303 + console.log("this.dataLength",this.dataLength)
  304 + let addTableData=[];
  305 + this.informationDataAll.map((item,index)=>{
  306 + addTableData.push({
  307 + key:item.code,
  308 + name:item.name,
  309 + width:"50%",
  310 + isDisplay:item.isDisplay
  311 + })
  312 + })
  313 + this.$store.commit('CHANGW_HEAD_INFO', addTableData);
294 }, 314 },
295 handlerDynamicData(data, refreshTime) { 315 handlerDynamicData(data, refreshTime) {
296 if (!data) return; 316 if (!data) return;
@@ -311,20 +331,24 @@ @@ -311,20 +331,24 @@
311 if (this.informationDataAll && this.informationDataAll.length > 0) { 331 if (this.informationDataAll && this.informationDataAll.length > 0) {
312 this.informationDataAll.map(item => { 332 this.informationDataAll.map(item => {
313 if (typeof (item.value) != 'string') { 333 if (typeof (item.value) != 'string') {
314 - item.value = item.value[0].state 334 + item.value = item.value[0].state;
315 } 335 }
  336 + item.isDisplay='1';
  337 +
316 }) 338 })
317 } 339 }
318 this.setDisplay(); 340 this.setDisplay();
319 if (this.imgStyle.dataNum) { 341 if (this.imgStyle.dataNum) {
320 this.informationData = this.informationDataAll.slice(0, this.imgStyle.dataNum); 342 this.informationData = this.informationDataAll.slice(0, this.imgStyle.dataNum);
321 } 343 }
  344 + this.dataLength=this.informationData.length;
322 let addTableData=[]; 345 let addTableData=[];
323 this.informationDataAll.map((item,index)=>{ 346 this.informationDataAll.map((item,index)=>{
324 addTableData.push({ 347 addTableData.push({
325 key:item.code, 348 key:item.code,
326 name:item.name, 349 name:item.name,
327 - width:"50%" 350 + width:"50%",
  351 + isDisplay:item.isDisplay
328 }) 352 })
329 }) 353 })
330 this.$store.commit('CHANGW_HEAD_INFO', addTableData); 354 this.$store.commit('CHANGW_HEAD_INFO', addTableData);
@@ -342,13 +366,24 @@ @@ -342,13 +366,24 @@
342 //设置信息列表数据每一行是否显示 366 //设置信息列表数据每一行是否显示
343 setDisplay() { 367 setDisplay() {
344 let head=this.optionsSetUp.dynamicAddTable; 368 let head=this.optionsSetUp.dynamicAddTable;
  369 + let arr=[];
  370 + head.map(hv=>{
  371 + arr.push({
  372 + code:hv.key,
  373 + isDisplay:hv.isDisplay
  374 + })
  375 + })
345 this.informationDataAll.map(item=>{ 376 this.informationDataAll.map(item=>{
346 - head.map(hv=>{ 377 + arr.map(hv=>{
347 if(item.code==hv.key){ 378 if(item.code==hv.key){
348 - item.isDisplay=hv.isDisplay 379 + item.isDisplay=hv.isDisplay;
349 } 380 }
350 }) 381 })
351 }) 382 })
  383 + if (this.imgStyle.dataNum) {
  384 + this.informationData = this.informationDataAll.slice(0, this.imgStyle.dataNum);
  385 + }
  386 + console.log(" this.informationData", this.informationData)
352 }, 387 },
353 pressingTimes() { 388 pressingTimes() {
354 this.pressingVisible = true; 389 this.pressingVisible = true;
1 <template> 1 <template>
2 - <div :style="styleObj" class="flex-div"> 2 + <div :style="styleObj" class="flex-div" @click="goJump">
3 <div class="percent-title" :style="titleStyle"> 3 <div class="percent-title" :style="titleStyle">
4 <img :src="imgStyle.imageAdress" alt="" class="icon-title"> 4 <img :src="imgStyle.imageAdress" alt="" class="icon-title">
5 {{ optionsSetup.titleName }} 5 {{ optionsSetup.titleName }}
@@ -412,6 +412,23 @@ export default { @@ -412,6 +412,23 @@ export default {
412 this.percentData=res; 412 this.percentData=res;
413 this.setPercentData() 413 this.setPercentData()
414 }); 414 });
  415 + },
  416 + goJump(){
  417 + let locationUrl=this.$route.query;
  418 + console.log("reportCode",locationUrl.second_router)
  419 + //二级路由传递给iframe父页面
  420 + /*let param={
  421 + type:'second_router',
  422 + data:{
  423 + reportCode: this.$route.query.second_router
  424 + }
  425 + }
  426 + window.parent.postMessage(param, '*')
  427 +*/
  428 + this.$router.push({
  429 + path: `/bigscreen/viewer`,
  430 + query: { reportCode: this.$route.query.second_router },
  431 + })
415 } 432 }
416 } 433 }
417 }; 434 };
@@ -68,8 +68,9 @@ export default { @@ -68,8 +68,9 @@ export default {
68 itemStyle(){ 68 itemStyle(){
69 return{ 69 return{
70 width:this.optionsSetup.flexFlow=='column'?'100%':'auto', 70 width:this.optionsSetup.flexFlow=='column'?'100%':'auto',
71 - 'border':this.optionsSetup.isBorder?'0.5px solid '+this.optionsSetup.borderColor:'none',  
72 - 'box-shadow':this.optionsSetup.isShadow?'0px 3px 12px '+this.optionsSetup.borderColor:'none' 71 + // 'border':this.optionsSetup.isBorder?'0.5px solid '+this.optionsSetup.borderColor:'none',
  72 + // 'box-shadow':this.optionsSetup.isShadow?'0px 3px 12px '+this.optionsSetup.borderColor:'none',
  73 + 'background':this.optionsSetup.itemBackground
73 } 74 }
74 }, 75 },
75 //标题样式设置 76 //标题样式设置
@@ -195,12 +196,16 @@ export default { @@ -195,12 +196,16 @@ export default {
195 text-align: left; 196 text-align: left;
196 flex:1; 197 flex:1;
197 padding:10px 20px; 198 padding:10px 20px;
198 - border:1px solid #ccc; 199 + //border:1px solid #ccc;
199 display: flex; 200 display: flex;
200 flex-flow: column; 201 flex-flow: column;
201 justify-content: space-around; 202 justify-content: space-around;
  203 + margin-bottom: 5px;
202 204
203 } 205 }
  206 +.progress-item:last-child{
  207 + margin-bottom: 0;
  208 +}
204 .progress-title-proposal{ 209 .progress-title-proposal{
205 margin-top:20px; 210 margin-top:20px;
206 } 211 }
@@ -157,8 +157,8 @@ export default { @@ -157,8 +157,8 @@ export default {
157 rowHeight:'50px' 157 rowHeight:'50px'
158 }, 158 },
159 header: [], 159 header: [],
160 - list: [],  
161 - listAll: [], 160 + list: [{},{},{},{},{}],
  161 + listAll: [{},{},{},{},{}],
162 optionsSetUp: {}, 162 optionsSetUp: {},
163 optionsPosition: {}, 163 optionsPosition: {},
164 optionsData: {} 164 optionsData: {}