xiaoe/test
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui自动化报表截图查看

Browse Source
This commit is contained in:
guocan
2025-05-28 18:20:06 +08:00
parent e5dc3bab05
commit a9d0f68f52
4 changed files with 94 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
test-ui/src/api/uiTest/testReport.js
View File

@@ -24,3 +24,13 @@ export function getTestReportDetail(query) {
method: 'get',
})
}
// 测试报告 - 获取截图
export function getScreenshot(path) {
return request({
url: '/test/report/screenshot',
method: 'get',
params: { path },
responseType: 'blob'
})
}

64
test-ui/src/views/test/uiTest/testReportDetail.vue
View File

@@ -105,7 +105,7 @@
</div>
<div class="right-collapse">
<div>{{ item.take }}</div>
<el-button size="mini" type="text" @click.native.stop="clickHandleScreenshot">截图</el-button>
<el-button v-if="item.screenshot" size="mini" type="text" @click.native.stop="clickHandleScreenshot(item.screenshot)">截图</el-button>
<div class="collapse-status">
<div v-if="item.executionFlag === '1'">成功</div>
<div v-if="item.executionFlag === '0'">未执行</div>
@@ -148,7 +148,7 @@
</div>
<div class="right-collapse">
<div>{{ item.take }}</div>
<el-button size="mini" type="text" @click.native.stop="clickHandleScreenshot">截图</el-button>
<el-button v-if="item.screenshot" size="mini" type="text" @click.native.stop="clickHandleScreenshot(item.screenshot)">截图</el-button>
<div class="collapse-status">
<div v-if="item.executionFlag === '1'">成功</div>
<div v-if="item.executionFlag === '0'">未执行</div>
@@ -191,7 +191,7 @@
</div>
<div class="right-collapse">
<div>{{ item.take }}</div>
<el-button size="mini" type="text" @click.native.stop="clickHandleScreenshot">截图</el-button>
<el-button v-if="item.screenshot" size="mini" type="text" @click.native.stop="clickHandleScreenshot(item.screenshot)">截图</el-button>
<div class="collapse-status">
<div v-if="item.executionFlag === '1'">成功</div>
<div v-if="item.executionFlag === '0'">未执行</div>
@@ -219,12 +219,25 @@
</el-tab-pane>
</el-tabs>
</div>
<!-- 图片预览对话框 -->
<el-dialog :visible.sync="dialogVisible" append-to-body width="80%" :close-on-click-modal="false">
<div v-loading="imageLoading" style="min-height: 200px;">
<el-image
v-if="previewUrl"
style="width: 100%"
:src="previewUrl"
:preview-src-list="[previewUrl]"
fit="contain"
/>
</div>
</el-dialog>
</div>
</template>
<script>
import * as echarts from 'echarts';
import { getTestReportDetail } from '../../../api/uiTest/testReport';
import { getTestReportDetail, getScreenshot } from '../../../api/uiTest/testReport';
export default {
name: "TestReportDetail",
@@ -233,10 +246,13 @@ export default {
return {
activeName: 'first',
uiSceneStepsAllReportVOList: [], // 全部
uiSceneStepsErrorReportVOList: [{ title: 'aaa', contentList: [{}, {}] }, { title: 'bbb', contentList: [{}, {}] }], // 失败
uiSceneStepsNotReportVOList: [{ title: 'aaa', contentList: [{}, {}] }, { title: 'bbb', contentList: [{}, {}] }], // 未执行
uiSceneStepsErrorReportVOList: [], // 失败
uiSceneStepsNotReportVOList: [], // 未执行
active: 'first',
detailData: {}, // 详情内容
dialogVisible: false, // 图片预览对话框是否显示
previewUrl: '', // 预览图片的URL
imageLoading: false, // 图片加载状态
}
},
mounted() {
@@ -255,18 +271,40 @@ export default {
}
})
},
// 截图
clickHandleScreenshot() {
console.log('截图')
// 截图预览
async clickHandleScreenshot(screenshot) {
if (screenshot) {
try {
this.imageLoading = true;
this.dialogVisible = true;
// 获取图片数据
const response = await getScreenshot(screenshot);
// 创建 Blob URL
const blob = new Blob([response], { type: 'image/png' });
if (this.previewUrl) {
URL.revokeObjectURL(this.previewUrl); // 释放之前的 URL
}
this.previewUrl = URL.createObjectURL(blob);
} catch (error) {
this.$message.error('图片加载失败');
this.dialogVisible = false;
} finally {
this.imageLoading = false;
}
}
},
},
beforeDestroy() {
// 清理 Blob URL
if (this.previewUrl) {
URL.revokeObjectURL(this.previewUrl);
}
}
}
</script>
<style scoped lang="scss">
.report-detail {
padding: 20px;