Skip to content

T
test_platform_web
Commit dd2e719e authored by Wallen姚文辉's avatar Wallen姚文辉
Browse files
Options

接口测试报告重构

parent 2b0bf9d7
Show whitespace changes
Inline Side-by-side
Showing with 99 additions and 55 deletions
dist/css/app.bb0d11f7.css → dist/css/app.787b06e3.css
View file @ dd2e719e
.layout{border:1px solid #d7dde4;background:#f5f7f9;position:relative;border-radius:4px;overflow:hidden}.layout-logo{width:100px;height:30px;background:#5b6270;border-radius:3px;float:left;position:relative;top:15px;left:20px}.layout-nav{margin:0 auto;display:flex}.card{height:300px;background:rgba(103,176,185,.7);transform:translateY(90%);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:30px 5px 15px 5px;text-align:center}.login{max-width:400px;margin:0 auto!important;transform:translateY(40%)}.vertical-center-modal{display:flex;align-items:center;justify-content:center}.vertical-center-modal .ivu-modal{top:0}.chart{height:100vh}.info-card{margin:10px 5px 10px 5px;background-color:#fff;border-radius:8px;box-shadow:0 0 8px 0 hsla(0,0%,71%,.58)}#my_table{text-align:left;width:90%;margin:0 10px 10px 10px;margin-right:auto;margin-left:auto}#my-table td:first-child{width:80%}#my-table td:nth-child(2){width:10%}.header_style{border-bottom:1px solid #dcdee2}.center_style{width:90%;margin:auto}.background_sytle{background-color:#f8f8f9;padding-top:.5px;padding-bottom:.5px;border-radius:8px;margin-top:2px;margin-bottom:2px}.near_left{width:25%;display:inline-block;height:100%}.near_right{width:75%;display:inline-block}@keyframes changDeg{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.demo-spin-icon-load{color:#2b85e4;animation:changDeg 2s linear .2s infinite}
\ No newline at end of file
.layout{border:1px solid #d7dde4;background:#f5f7f9;position:relative;border-radius:4px;overflow:hidden}.layout-logo{width:100px;height:30px;background:#5b6270;border-radius:3px;float:left;position:relative;top:15px;left:20px}.layout-nav{margin:0 auto;display:flex}.card{height:300px;background:rgba(103,176,185,.7);transform:translateY(90%);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:30px 5px 15px 5px;text-align:center}.login{max-width:400px;margin:0 auto!important;transform:translateY(40%)}.vertical-center-modal{display:flex;align-items:center;justify-content:center}.vertical-center-modal .ivu-modal{top:0}.chart{height:100vh}.info-card{margin:10px 5px 10px 5px;background-color:#fff;border-radius:8px;box-shadow:0 0 8px 0 hsla(0,0%,71%,.58)}#my_table{text-align:left;width:90%;margin:0 10px 10px 10px;margin-right:auto;margin-left:auto}#my-table td:first-child{width:80%}#my-table td:nth-child(2){width:10%}.header_style{border-bottom:1px solid #dcdee2}.center_style{width:90%;margin:auto}.background_sytle{background-color:#f8f8f9;padding-top:.5px;padding-bottom:.5px;border-radius:8px;margin-top:2px;margin-bottom:2px}.near_left{width:25%;display:inline-block;height:100%}.near_right{width:75%;display:inline-block}.fontstyle{text-align:left}@keyframes changDeg{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.demo-spin-icon-load{color:#2b85e4;animation:changDeg 2s linear .2s infinite}
\ No newline at end of file
dist/index.html
View file @ dd2e719e
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>yinhe_test</title><script defer="defer" src="/js/chunk-vendors.822ae491.js"></script><script defer="defer" src="/js/app.70a836e3.js"></script><link href="/css/chunk-vendors.187ae3e6.css" rel="stylesheet"><link href="/css/app.bb0d11f7.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but yinhe_test doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
\ No newline at end of file
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>yinhe_test</title><script defer="defer" src="/js/chunk-vendors.822ae491.js"></script><script defer="defer" src="/js/app.5e0ba442.js"></script><link href="/css/chunk-vendors.187ae3e6.css" rel="stylesheet"><link href="/css/app.787b06e3.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but yinhe_test doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
\ No newline at end of file
dist/js/app.70a836e3.js → dist/js/app.5e0ba442.js
View file @ dd2e719e
This source diff could not be displayed because it is too large. You can view the blob instead.
dist/js/app.5e0ba442.js.map 0 → 100644
View file @ dd2e719e
This source diff could not be displayed because it is too large. You can view the blob instead.
dist/js/app.70a836e3.js.map deleted 100644 → 0
View file @ 2b0bf9d7
This source diff could not be displayed because it is too large. You can view the blob instead.
src/views/tool/TestReport.vue
View file @ dd2e719e
......@@ -146,21 +146,26 @@
</Table>
<template v-if="plugs.includes('左移-接口测试')">
<Button shape="circle" style="margin-top: 10px;margin-bottom: 10px;" type="primary">左移-接口测试</Button>
<Upload v-if="(!apitestinfo) || edit" :before-upload="handleUpload"
<!-- <Upload v-if="(!apitestinfo) || edit" :before-upload="handleUpload"
action="//jsonplaceholder.typicode.com/posts/">
<Button icon="ios-cloud-upload-outline">上传apifox的html文件</Button>
</Upload>
</Upload> -->
<br>
<Input v-if="(!apitestinfo) || edit" v-model="api_url" @on-blur="renderapihtml()"
placeholder="请输入apifox分享的报告链接" style="width: 300px" />
<br>
<div v-if="apitestinfo">
<div class="info-card">
<div class="header_style">
<p style="height: 35px;">
&nbsp;&nbsp;
<span style="font-weight: bold;font-size: 20px;margin-left: 5px;line-height: 35px;">
{{ apitestinfo["测试场景"] }}
</span>
<a target="_blank" :href="apitestinfo.url"
style="font-weight: bold;font-size: 20px;margin-left: 5px;line-height: 35px;">
{{ apitestinfo.data.name }}
</a>
<span
style="float:right; position: relative;margin-right: 10px;line-height: 35px;">运行时间：{{
apitestinfo["运行时间"] }}</span>
apitestinfo.data.timings.started }}</span>
</p>
</div>
<div class="center_style">
......@@ -173,10 +178,25 @@
</tr>
</thead>
<tbody>
<tr v-for="item in apirenderinfo.p0">
<!-- <tr v-for="item in apirenderinfo.p0">
<th>{{ item }}</th>
<th>{{ apitestinfo[item][0] }}</th>
<th>{{ apitestinfo[item][1] }}</th>
</tr> -->
<tr>
<th>用例条目</th>
<th>{{ apitestinfo.data.stats.iterations.total }}</th>
<th>{{ apitestinfo.data.stats.iterations.failed }}</th>
</tr>
<tr>
<th>请求接口</th>
<th>{{ apitestinfo.data.stats.requests.total }}</th>
<th>{{ apitestinfo.data.stats.requests.failed }}</th>
</tr>
<tr>
<th>断言数</th>
<th>{{ apitestinfo.data.stats.assertions.total }}</th>
<th>{{ apitestinfo.data.stats.assertions.failed }}</th>
</tr>
</tbody>
</table>
......@@ -184,13 +204,28 @@
<br>
<div class="center_style">
<p>
<template v-for="item in apirenderinfo.p1">
<span style="display: inline-block;width: 25%;">{{ item
}}： {{ apitestinfo[item] }}</span>
</template>
<span style="display: inline-block;width: 5%;"></span>
<span class="fontstyle" style="display: inline-block;width: 25%;">
平均响应字节数： {{ apitestinfo.data.timings.firstByteAverage.toFixed(2) }}Byte</span>
<span class="fontstyle" style="display: inline-block;width: 25%;">
平均响应时长： {{ apitestinfo.data.timings.responseAverage.toFixed(2) }}ms</span>
</p>
<p>
<span style="display: inline-block;width: 5%;"></span>
<span class="fontstyle" style="display: inline-block;width: 25%;">
通过率： {{
(apitestinfo.data.stats.steps.passed / apitestinfo.data.stats.steps.passed *
100).toFixed(2)
}}%</span>
<span class="fontstyle" style="display: inline-block;width: 25%;">
失败率： {{
(apitestinfo.data.stats.steps.failed / apitestinfo.data.stats.steps.passed *
100).toFixed(2)
}}%</span>
</p>
</div>
<br>
</div>
<!-- <br>
<div class="center_style" style="width: 98%">
<template v-for="item in apitestinfo['运行列表']">
<div class="background_sytle">
......@@ -249,7 +284,7 @@
</div>
</div>
</template>
</div>
</div> -->
</div>
</div>
</template>
......@@ -417,7 +452,8 @@ export default {
run_script: [],
all_script: [],
plugs: [],
apihtmlfile: null,
// apihtmlfile: null,
api_url: null,
apitestinfo: null,
apirenderinfo: {
p0: ["循环数", "HTTP 接口请求数", "断言数"],
......@@ -721,24 +757,28 @@ export default {
this.getdefaultCC();
this.modlShow = true;
},
handleUpload(file) {
if (file.name.split(".").pop() != 'html') this.$Message.error('请上传html文件')
else {
this.apihtmlfile = file;
this.renderapihtml();
}
return false;
},
// handleUpload(file) {
// if (file.name.split(".").pop() != 'html') this.$Message.error('请上传html文件')
// else {
// this.apihtmlfile = file;
// this.renderapihtml();
// }
// return false;
// },
renderapihtml() {
const reader = new FileReader()
reader.readAsText(this.apihtmlfile, 'utf8')
reader.onload = () => {
this.$request("post", '/tool/testport/getapitestinfo', { data: reader.result }, this, (data) => {
this.apitestinfo = data.data;
console.info(this.apitestinfo)
})
// const reader = new FileReader()
// reader.readAsText(this.apihtmlfile, 'utf8')
// reader.onload = () => {
// this.$request("post", '/tool/testport/getapitestinfo', { data: reader.result }, this, (data) => {
// this.apitestinfo = data.data;
// console.info(this.apitestinfo)
// })
}
// }
if (!this.api_url) return
this.$request("post", '/tool/testport/getapitestinfo', { url: this.api_url }, this, (data) => {
this.apitestinfo = data.data
})
},
show() {
var info = ''
......@@ -846,7 +886,7 @@ export default {
stylestart = stylestart + ".ivu-table {width: inherit;max-width: 100%;overflow: hidden;color: rgb(81, 90, 110);font-size: 14px;background-color: rgb(255, 255, 255);box-sizing: border-box;}"
}
else if (j.selectorText.includes("ivu-btn") || j.selectorText.includes("ivu-typography") || j.selectorText.includes("ivu-table") || j.selectorText.includes("body") || j.selectorText.includes("info-card") || j.selectorText.includes("my_table")
|| j.selectorText.includes("header_style") || j.selectorText.includes("center_style") || j.selectorText.includes("background_sytle") || j.selectorText.includes("near_left") || j.selectorText.includes("near_right")) { stylestart = stylestart + j.cssText }
|| j.selectorText.includes("header_style") || j.selectorText.includes("center_style") || j.selectorText.includes("background_sytle") || j.selectorText.includes("near_left") || j.selectorText.includes("near_right") || j.selectorText.includes("fontstyle")) { stylestart = stylestart + j.cssText }
}
}
const c = (stylestart + styleend + html).replace(/style="width(.*?)"/gm, 'style="width:100%"')
......@@ -1088,6 +1128,10 @@ export default {
display: inline-block
}
.fontstyle {
text-align: left;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment