161 lines
3.9 KiB
Vue
161 lines
3.9 KiB
Vue
<template>
|
||
<div class="container">
|
||
<Info :infoData="projectData" />
|
||
<div class="test-container">
|
||
<div class="title">测试结果</div>
|
||
<div class="report-container">
|
||
<div class="report-item">成功率 ：{{ reportData?.successRate || '' }}</div>
|
||
<div class="report-item">成功率得分 ：{{ reportData?.successRateScore || '' }}</div>
|
||
<!-- <el-button @click="handler('重庆')">生成报告</el-button>
|
||
<el-button>导出结果</el-button> -->
|
||
</div>
|
||
</div>
|
||
|
||
<el-table :data="tableData" style="width: 100%">
|
||
<el-table-column prop="aeId" width="150" show-overflow-tooltip label="结果ID" />
|
||
<el-table-column prop="content" label="功能" width="260" show-overflow-tooltip />
|
||
<el-table-column prop="status" label="状态" show-overflow-tooltip>
|
||
<template #default="{ row }">
|
||
<el-tag :type="statusType[row.status] || 'info'">{{ statusTypeContext[row.status] }}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="videoPath" label="视频路径" show-overflow-tooltip>
|
||
<template #default="{ row }">
|
||
<el-text class="mx-1" type="primary" @click="openVideoDialog(row)">播放视频</el-text>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="itemResponseTime" label="响应时间" />
|
||
<el-table-column prop="failureReason" label="失败原因"></el-table-column>
|
||
<el-table-column prop="executionDetail" label="执行详情" />
|
||
</el-table>
|
||
|
||
<el-dialog v-model="centerDialogVisible" title="播放视频" width="800" center>
|
||
<Video :src="videoSrc" />
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
<script setup>
|
||
import Info from './info.vue';
|
||
import { getValuationProject } from '@/api/is/project'
|
||
import Video from '@/components/Video/index.vue'
|
||
|
||
const route = useRoute();
|
||
|
||
const projectData = route.query.data
|
||
? JSON.parse(route.query.data)
|
||
: {};
|
||
|
||
const tableData = ref([]);
|
||
const reportData = ref(null)
|
||
const getListScheme = async () => {
|
||
const res = await getValuationProject(projectData.projectId)
|
||
if (res.code === 200) {
|
||
reportData.value = {
|
||
successRate: res.data.successRate,
|
||
successRateScore: res.data.successRateScore
|
||
}
|
||
tableData.value = res.data.itemDetails
|
||
}
|
||
}
|
||
|
||
const statusType = {
|
||
0: 'info',
|
||
1: 'conductedState',
|
||
2: 'successfulState',
|
||
3: 'danger'
|
||
}
|
||
|
||
const statusTypeContext = {
|
||
0: '待评估',
|
||
1: '评估中',
|
||
2: '评估成功',
|
||
3: '评估失败'
|
||
}
|
||
|
||
const centerDialogVisible = ref(false)
|
||
const videoSrc = ref('')
|
||
const openVideoDialog = (row) => {
|
||
videoSrc.value = row.videoPath
|
||
centerDialogVisible.value = true
|
||
}
|
||
|
||
onMounted(() => {
|
||
getListScheme()
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.container {
|
||
width: 100%;
|
||
height: 100%;
|
||
|
||
.btn-container {
|
||
background: #fff;
|
||
margin: 4px 0;
|
||
padding: 4px 0;
|
||
}
|
||
|
||
.test-container {
|
||
height: 40px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.report-container {
|
||
display: flex;
|
||
gap: 12px;
|
||
}
|
||
}
|
||
|
||
.context-container {
|
||
height: calc(100% - 200px);
|
||
display: flex;
|
||
gap: 10px;
|
||
|
||
.left {
|
||
width: 300px;
|
||
|
||
.title {
|
||
height: 40px;
|
||
display: flex;
|
||
align-items: center;
|
||
background: #fff;
|
||
padding-left: 12px;
|
||
border: 1px solid #e4e7ed;
|
||
margin-bottom: 2px;
|
||
}
|
||
|
||
.schemaList {
|
||
height: calc(100% - 40px);
|
||
overflow-y: auto;
|
||
background: #fff;
|
||
border: 1px solid #e4e7ed;
|
||
|
||
.schema {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 12px;
|
||
|
||
&:hover {
|
||
background: #f0ecec;
|
||
}
|
||
}
|
||
|
||
.activeItem {
|
||
background: #f0ecec;
|
||
}
|
||
}
|
||
}
|
||
|
||
.right {
|
||
flex: 1;
|
||
}
|
||
}
|
||
}
|
||
</style> |