fix(接口定义): 修复部分样式问题

This commit is contained in:
fit2-zhao 2020-12-09 13:22:08 +08:00
parent 9f4adbbbf9
commit f800f09b73
5 changed files with 22 additions and 83 deletions

View File

@ -102,5 +102,7 @@
</script> </script>
<style scoped> <style scoped>
/deep/ .el-tabs__nav-wrap::after {
height: 0px;
}
</style> </style>

View File

@ -226,5 +226,4 @@
height: 18px; height: 18px;
border-radius: 42%; border-radius: 42%;
} }
</style> </style>

View File

@ -1,34 +1,18 @@
<template> <template>
<div class="metric-container"> <div class="metric-container">
<el-row type="flex"> <el-row type="flex">
<div class="metric"> <el-col>
<div class="value">{{response.responseResult.responseTime}} ms</div> <div style="font-size: 14px;color: #AAAAAA;float: left">{{$t('api_report.response_code')}} :</div>
<div class="name">{{$t('api_report.response_time')}}</div> <div style="font-size: 14px;color:#61C550;margin-top:2px;margin-left:10px;float: left">{{response.responseResult.responseCode ? response.responseResult.responseCode :'0'}}</div>
<br> </el-col>
<div class="value">{{response.responseResult.latency}} ms</div> <el-col>
<div class="name">{{$t('api_report.latency')}}</div> <div style="font-size: 14px;color: #AAAAAA;float: left">{{$t('api_report.response_time')}} :</div>
</div> <div style="font-size: 14px;color:#61C550;margin-top:2px;margin-left:10px;float: left">{{response.responseResult.responseTime?response.responseResult.responseTime:0}} ms</div>
<div class="metric"> </el-col>
<div class="value">{{response.requestSize}} bytes</div> <el-col>
<div class="name">{{$t('api_report.request_size')}}</div> <div style="font-size: 14px;color: #AAAAAA;float: left">{{$t('api_report.response_size')}} :</div>
<br> <div style="font-size: 14px;color:#61C550; margin-top:2px;margin-left:10px;float: left">{{response.responseResult.responseSize?response.responseResult.responseSize:0}} bytes</div>
<div class="value">{{response.responseResult.responseSize}} bytes</div> </el-col>
<div class="name">{{$t('api_report.response_size')}}</div>
</div>
<div class="metric horizontal">
<el-row type="flex">
<div class="code">
<div class="value" :class="{'error': error}">{{response.responseResult.responseCode}}</div>
<div class="name">{{$t('api_report.response_code')}}</div>
</div>
<div class="split"></div>
<div class="message">
<div class="value">{{response.responseResult.responseMessage}}</div>
<div class="name">{{$t('api_report.response_message')}}</div>
</div>
</el-row>
</div>
</el-row> </el-row>
</div> </div>
</template> </template>
@ -51,56 +35,6 @@
<style scoped> <style scoped>
.metric-container { .metric-container {
padding: 10px; padding-bottom: 20px;
}
.metric {
padding: 10px;
border: 1px solid #EBEEF5;
min-width: 120px;
height: 114px;
}
.metric + .metric {
margin-left: 20px;
}
.metric .value {
font-size: 16px;
font-weight: 500;
word-break: break-all;
}
.metric .name {
color: #404040;
opacity: 0.5;
padding: 5px 0;
}
.metric.horizontal {
width: 100%;
}
.metric .code {
min-width: 120px;
}
.metric .code .value {
color: #67C23A;
}
.metric .code .value.error {
color: #F56C6C;
}
.metric .split {
height: 114px;
border-left: 1px solid #EBEEF5;
margin-right: 20px;
}
.metric .message {
max-height: 114px;
overflow-y: auto;
} }
</style> </style>

View File

@ -86,7 +86,7 @@
}, },
computed: { computed: {
isSqlType() { isSqlType() {
return (this.currentProtocol === "SQL" && this.response.responseResult.responseCode === '200' && this.mode ==='table'); return (this.currentProtocol === "SQL" && this.response.responseResult.responseCode === '200' && this.mode === 'table');
} }
} }
} }
@ -120,6 +120,10 @@
padding: 0; padding: 0;
} }
/deep/ .el-tabs__nav-wrap::after {
height: 0px;
}
pre { pre {
margin: 0; margin: 0;
} }

@ -1 +1 @@
Subproject commit a22a3005d9bd254793fcf634d72539cbdf31be3a Subproject commit 8a972a198775b3783ed6e4cef27197e53d1ebdc8