调整info的样式

This commit is contained in:
zhangyu
2020-08-25 17:58:35 +08:00
parent 5ff8472565
commit 4e3ccad277
2 changed files with 40 additions and 15 deletions

View File

@@ -5,31 +5,31 @@
<div class="info-box-content"> <div class="info-box-content">
<div class="content-box"> <div class="content-box">
<span class="content-title">project</span> <span class="content-title">project</span>
<span class="content-text">123</span> <span class="content-text">{{moduleInfo.project.name}}</span>
</div> </div>
<div class="content-box"> <div class="content-box">
<span class="content-title">module name</span> <span class="content-title">module name</span>
<span class="content-text">123</span> <span class="content-text">{{moduleInfo.name}}</span>
</div> </div>
<div class="content-box"> <div class="content-box">
<span class="content-title">Tag</span> <span class="content-title">Tag</span>
<span class="content-text">123</span> <span class="content-text">{{moduleInfo.type}}</span>
</div> </div>
<div class="content-box"> <div class="content-box">
<span class="content-title">Port</span> <span class="content-title">Port</span>
<span class="content-text">123</span> <span class="content-text">{{moduleInfo.port}}</span>
</div> </div>
<div class="content-box"> <div class="content-box">
<span class="content-title">path</span> <span class="content-title">Path</span>
<span class="content-text">123</span> <span class="content-text">{{moduleInfo.path}}</span>
</div> </div>
<div class="content-box"> <div class="content-box">
<span class="content-title">Parameter</span> <span class="content-title">Parameter</span>
<span class="content-text">123</span> <span class="content-text">{{moduleInfo.seq}}</span>
</div> </div>
<div class="content-box"> <div class="content-box">
<span class="content-title">Descripsion</span> <span class="content-title">Descripsion</span>
<span class="content-text">123</span> <span class="content-text">{{moduleInfo.remark?moduleInfo.remark:'--'}}</span>
</div> </div>
</div> </div>
</div> </div>
@@ -46,11 +46,22 @@
watch:{}, watch:{},
data(){ data(){
return{ return{
moduleInfo:{
project:{name:''},
name:'',
type:'http',
remark:'',
port:'',
path:'',
seq:'',
}
} }
}, },
mounted(){ mounted(){
console.log(this.moduleId,this.projectId) this.$get('/module',{id:this.moduleId}).then(res=>{
this.moduleInfo=res.data.list[0];
console.log(this.moduleInfo,this.projectId);
})
}, },
methods:{}, methods:{},
} }
@@ -66,8 +77,9 @@
.info-box{ .info-box{
background: #FFFFFF; background: #FFFFFF;
border: 1px solid #E7EAED; border: 1px solid #E7EAED;
width: 173px; width: 334px;
margin-bottom: 15px; margin-bottom: 15px;
box-shadow: 1px 2px 4px 0 rgba(0,0,0,0.12), -1px 1px 9px -1px rgba(205,205,205,0.77);
} }
.info-box-title{ .info-box-title{
background: #EFEFEF; background: #EFEFEF;
@@ -76,19 +88,32 @@
height: 26px; height: 26px;
line-height: 26px; line-height: 26px;
padding-left: 12px; padding-left: 12px;
font-weight: bold;
} }
.info-box-content{ .info-box-content{
font-size: 12px; font-size: 12px;
color: #333333; color: #333333;
/*padding: 12px;*/ /*border: 1px solid rgba(205,205,205,0.77);*/
} }
.content-box{ .content-box{
padding: 0 12px; padding: 0 12px;
} }
.info-box-content .content-box:not(:last-child){ .info-box-content .content-box:not(:last-child){
margin-bottom: 5px; border-bottom: 1px solid rgba(205,205,205,0.77);
} }
.content-title{ .content-title{
color: #666666; font-size: 12px;
color: #333333;
width: 120px;
display: inline-block;
border-right: 1px solid rgba(205,205,205,0.77);
padding: 3px 0;
}
.content-text{
width: 175px;
color: #333333;
font-size: 12px;
display: inline-block;
padding: 3px 5px;
} }
</style> </style>

View File

@@ -1,6 +1,6 @@
<template> <template>
<div <div
v-scrollBar:chart-box v-scrollBar
class="chart-box" class="chart-box"
> >
<div v-for="(item, index) in dataList" :key="item.id" :id="'chart-' + item.id" :name="item.title" v-show="!item.isHide" class="chart"> <div v-for="(item, index) in dataList" :key="item.id" :id="'chart-' + item.id" :name="item.title" v-show="!item.isHide" class="chart">