test-version22
/
MeterSphere
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

refactor(性能测试): 查询报告日志修改

This commit is contained in:
Captain.B 2020-12-22 18:03:56 +08:00
parent bb3845e28f
commit 5835bc6ab3
1 changed files with 103 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

199
frontend/src/business/components/performance/report/components/LogDetails.vue
View File

@ -1,119 +1,126 @@
<template> <template>
<div v-loading="result.loading"> <div v-loading="result.loading">
<el-tabs type="border-card" :stretch="true"> <el-tabs type="border-card" :stretch="true" @tab-click="selectTab">
<el-tab-pane v-for="item in resource" :key="item.resourceId" :label="item.resourceName" class="logging-content"> <el-tab-pane v-for="item in resource" :key="item.resourceId" :label="item.resourceName" class="logging-content">
<ul class="infinite-list" v-infinite-scroll="load(item.resourceId)" infinite-scroll-disabled="disabled"> <ul class="infinite-list" v-infinite-scroll="load(item.resourceId)" infinite-scroll-disabled="disabled">
<li class="infinite-list-item" v-for="(log, index) in logContent" :key="index">{{ log.content }}</li> <li class="infinite-list-item" v-for="(log, index) in logContent" :key="index">{{ log.content }}</li>
</ul> </ul>
<el-link type="primary" @click="downloadLogFile(item)">{{$t('load_test.download_log_file')}}</el-link> <el-link type="primary" @click="downloadLogFile(item)">{{ $t('load_test.download_log_file') }}</el-link>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: "LogDetails", name: "LogDetails",
data() { data() {
return { return {
resource: [], resource: [],
logContent: [], logContent: [],
result: {}, result: {},
id: '', id: '',
page: 1, page: 1,
pageCount: 5, pageCount: 5,
loading: false, loading: false,
} }
}, },
computed: { computed: {
disabled() { disabled() {
return this.loading || this.page > this.pageCount; return this.loading || this.page > this.pageCount;
} }
}, },
methods: { methods: {
getResource() { getResource() {
this.result = this.$get("/performance/report/log/resource/" + this.id, data => { this.result = this.$get("/performance/report/log/resource/" + this.id, data => {
this.resource = data.data; this.resource = data.data;
this.page = 1; this.page = 1;
this.logContent = []; this.logContent = [];
}) })
},
load(resourceId) {
if (this.loading || this.page > this.pageCount) return;
this.loading = true;
let url = "/performance/report/log/" + this.id + "/" + resourceId + "/" + this.page;
this.$get(url, res => {
let data = res.data;
data.listObject.forEach(log => {
this.logContent.push(log);
})
this.page++;
this.loading = false;
})
},
downloadLogFile(item) {
let config = {
url: '/performance/report/log/download/' + this.id + '/' + item.resourceId,
method: 'get',
responseType: 'blob'
};
this.result = this.$request(config).then(response => {
const filename = 'jmeter.log'
const blob = new Blob([response.data]);
if ("download" in document.createElement("a")) {
// 非IE下载
// chrome/firefox
let aTag = document.createElement('a');
aTag.download = filename;
aTag.href = URL.createObjectURL(blob);
aTag.click();
URL.revokeObjectURL(aTag.href)
} else {
// IE10+下载
navigator.msSaveBlob(blob, filename);
}
});
}
}, },
watch: { load(resourceId) {
report: { if (this.loading || this.page > this.pageCount) return;
handler(val) { this.loading = true;
if (!val.status || !val.id) { let url = "/performance/report/log/" + this.id + "/" + resourceId + "/" + this.page;
return; this.$get(url, res => {
} let data = res.data;
let status = val.status; data.listObject.forEach(log => {
this.id = val.id; this.logContent.push(log);
if (status === "Completed" || status === "Running") { })
this.getResource(); this.page++;
} else { this.loading = false;
this.resource = []; })
}
},
deep: true
}
}, },
props: ['report'] selectTab(tab) {
} let resourceId = tab.$vnode.key;
this.loading = false;
this.page = 1;
this.logContent = [];
this.load(resourceId);
},
downloadLogFile(item) {
let config = {
url: '/performance/report/log/download/' + this.id + '/' + item.resourceId,
method: 'get',
responseType: 'blob'
};
this.result = this.$request(config).then(response => {
const filename = 'jmeter.log'
const blob = new Blob([response.data]);
if ("download" in document.createElement("a")) {
// 非IE下载
// chrome/firefox
let aTag = document.createElement('a');
aTag.download = filename;
aTag.href = URL.createObjectURL(blob);
aTag.click();
URL.revokeObjectURL(aTag.href)
} else {
// IE10+下载
navigator.msSaveBlob(blob, filename);
}
});
}
},
watch: {
report: {
handler(val) {
if (!val.status || !val.id) {
return;
}
let status = val.status;
this.id = val.id;
if (status === "Completed" || status === "Running") {
this.getResource();
} else {
this.resource = [];
}
},
deep: true
}
},
props: ['report']
}
</script> </script>
<style scoped> <style scoped>
.logging-content { .logging-content {
white-space: pre-line; white-space: pre-line;
overflow: auto; overflow: auto;
} }
.infinite-list { .infinite-list {
height: 500px; height: 500px;
padding: 0; padding: 0;
margin: 0; margin: 0;
list-style: none; list-style: none;
overflow: auto overflow: auto
} }
.infinite-list-item { .infinite-list-item {
overflow: hidden; overflow: hidden;
} }
</style> </style>