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

report

Browse Source
This commit is contained in:
赵昱涵
2025-03-07 00:27:49 +08:00
parent 632c673e99
commit cb7c61f4ab
1 changed files with 256 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

256
test-ui/src/views/test/case/report/index.vue Normal file
View File

@@ -0,0 +1,256 @@
<template>
<el-collapse v-model="activeName" accordion>
<el-collapse-item :name="index" v-for="(item, index) in list" :key="index" v-if="!item.parentId">
<template slot="title">
<el-button size="mini" plain type="warning" icon="el-icon-rank" circle style="margin-right: 12px" class="drag-handle"/>
<el-tag effect="plain" style="width: 70px;text-align: center;margin-right: 12px;" class="drag-handle">{{ dict.type.step_type.findLast(t => t.value == item.type).label }}</el-tag>
<el-tag v-if="item.name" effect="plain" style="width: 240px;text-align: center;margin-right: 12px;" type="info" class="drag-handle">{{ item.name }}</el-tag>
<el-tag v-if="item.datasourceId" effect="plain" style="width: 240px;text-align: center;margin-right: 12px;" type="info" class="drag-handle">{{ datasourceList.findLast(t => t.id === item.datasourceId).name }}</el-tag>
<el-tag v-if="item.requestUrl" effect="plain" style="text-align: center;margin-right: 12px;" type="success" class="drag-handle">{{ item.requestUrl }}</el-tag>
<el-tag effect="plain" style="text-align: center;margin-right: 12px;" class="drag-handle">{{ index + 1 }}</el-tag>
</template>
<el-tabs v-model="tabsActiveName" v-if="item.type == 2 || item.type == 1">
<el-tab-pane v-if="item.type == 1" label="Headers" name="Headers">
<el-table :data="form.requestHeader">
<el-table-column label="参数名">
<template slot-scope="scope">
<el-input placeholder="请输入参数名" v-model="form.requestHeader[scope.$index].key" @input="e => handleTableEdit(e, 'header', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="示例值">
<template slot-scope="scope">
<el-input placeholder="请输入参数名" v-model="form.requestHeader[scope.$index].value" @input="e => handleTableEdit(e, 'header', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.requestHeader.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('header', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane v-if="item.type == 1" label="Params" name="Params">
<el-table :data="form.requestParams">
<el-table-column label="参数名">
<template slot-scope="scope">
<el-input placeholder="请输入参数名" v-model="form.requestParams[scope.$index].key" @input="e => handleTableEdit(e, 'param', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="示例值">
<template slot-scope="scope">
<el-input placeholder="请输入示例值" v-model="form.requestParams[scope.$index].value" @input="e => handleTableEdit(e, 'param', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.requestParams.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('param', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane v-if="item.type == 1" label="Body" name="Body">
<JsonEditorVue mode="text" v-model="form.requestBody" class="jse-theme-dark"/>
</el-tab-pane>
<el-tab-pane v-if="item.type == 2" label="SQL指令" name="sql">
<codemirror v-model="form.sqlCommand" :options="editorOptions" />
</el-tab-pane>
<el-tab-pane label="提取" name="assignment">
<el-table :data="form.assignment">
<el-table-column label="变量名">
<template slot-scope="scope">
<el-input placeholder="请输入变量名" v-model="form.assignment[scope.$index].name" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="提取方式">
<template slot-scope="scope">
<el-input placeholder="请输入提取方式" v-model="form.assignment[scope.$index].type" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="提取对象">
<template slot-scope="scope">
<el-input placeholder="请输入提取对象" v-model="form.assignment[scope.$index].content" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="提取表达式">
<template slot-scope="scope">
<el-input placeholder="请输入提取表达式" v-model="form.assignment[scope.$index].path" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.assignment.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('assignment', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="校验" name="assertion">
<el-table :data="form.assertion">
<el-table-column label="描述">
<template slot-scope="scope">
<el-input placeholder="请输入描述" v-model="form.assertion[scope.$index].name" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="对象">
<template slot-scope="scope">
<el-input placeholder="请输入对象" v-model="form.assertion[scope.$index].source" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="条件">
<template slot-scope="scope">
<el-input placeholder="请输入条件" v-model="form.assertion[scope.$index].fn" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="内容">
<template slot-scope="scope">
<el-input placeholder="请输入内容" v-model="form.assertion[scope.$index].target" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.assertion.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('assertion', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
<div v-if="item.type == 3 || item.type == 4">
<el-collapse-item :name="index" v-for="(item, index) in list" :key="index" v-if="item.parentId && item.parentId === form.id">
<template slot="title">
<el-button size="mini" plain type="warning" icon="el-icon-rank" circle style="margin-right: 12px" class="drag-handle"/>
<el-tag effect="plain" style="width: 70px;text-align: center;margin-right: 12px;" class="drag-handle">{{ dict.type.step_type.findLast(t => t.value == item.type).label }}</el-tag>
<el-tag v-if="item.name" effect="plain" style="width: 240px;text-align: center;margin-right: 12px;" type="info" class="drag-handle">{{ item.name }}</el-tag>
<el-tag v-if="item.datasourceId" effect="plain" style="width: 240px;text-align: center;margin-right: 12px;" type="info" class="drag-handle">{{ datasourceList.findLast(t => t.id === item.datasourceId).name }}</el-tag>
<el-tag v-if="item.requestUrl" effect="plain" style="text-align: center;margin-right: 12px;" type="success" class="drag-handle">{{ item.requestUrl }}</el-tag>
<el-tag effect="plain" style="text-align: center;margin-right: 12px;" class="drag-handle">{{ index + 1 }}</el-tag>
</template>
<el-tabs v-model="childrenTabsActiveName" v-if="item.type == 2 || item.type == 1">
<el-tab-pane v-if="item.type == 1" label="Headers" name="Headers">
<el-table :data="form.requestHeader">
<el-table-column label="参数名">
<template slot-scope="scope">
<el-input placeholder="请输入参数名" v-model="form.requestHeader[scope.$index].key" @input="e => handleTableEdit(e, 'header', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="示例值">
<template slot-scope="scope">
<el-input placeholder="请输入参数名" v-model="form.requestHeader[scope.$index].value" @input="e => handleTableEdit(e, 'header', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.requestHeader.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('header', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane v-if="item.type == 1" label="Params" name="Params">
<el-table :data="form.requestParams">
<el-table-column label="参数名">
<template slot-scope="scope">
<el-input placeholder="请输入参数名" v-model="form.requestParams[scope.$index].key" @input="e => handleTableEdit(e, 'param', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="示例值">
<template slot-scope="scope">
<el-input placeholder="请输入示例值" v-model="form.requestParams[scope.$index].value" @input="e => handleTableEdit(e, 'param', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.requestParams.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('param', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane v-if="item.type == 1" label="Body" name="Body">
<JsonEditorVue mode="text" v-model="form.requestBody" class="jse-theme-dark"/>
</el-tab-pane>
<el-tab-pane v-if="item.type == 2" label="SQL指令" name="sql">
<codemirror v-model="form.sqlCommand" :options="editorOptions" />
</el-tab-pane>
<el-tab-pane label="提取" name="assignment">
<el-table :data="form.assignment">
<el-table-column label="变量名">
<template slot-scope="scope">
<el-input placeholder="请输入变量名" v-model="form.assignment[scope.$index].name" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="提取方式">
<template slot-scope="scope">
<el-input placeholder="请输入提取方式" v-model="form.assignment[scope.$index].type" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="提取对象">
<template slot-scope="scope">
<el-input placeholder="请输入提取对象" v-model="form.assignment[scope.$index].content" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="提取表达式">
<template slot-scope="scope">
<el-input placeholder="请输入提取表达式" v-model="form.assignment[scope.$index].path" @input="e => handleTableEdit(e, 'assignment', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.assignment.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('assignment', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="校验" name="assertion">
<el-table :data="form.assertion">
<el-table-column label="描述">
<template slot-scope="scope">
<el-input placeholder="请输入描述" v-model="form.assertion[scope.$index].name" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="对象">
<template slot-scope="scope">
<el-input placeholder="请输入对象" v-model="form.assertion[scope.$index].source" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="条件">
<template slot-scope="scope">
<el-input placeholder="请输入条件" v-model="form.assertion[scope.$index].fn" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="内容">
<template slot-scope="scope">
<el-input placeholder="请输入内容" v-model="form.assertion[scope.$index].target" @input="e => handleTableEdit(e, 'assertion', scope)" clearable/>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<el-button v-if="form.assertion.length > scope.$index+1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete('assertion', scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</el-collapse-item>
</div>
</el-collapse-item>
</el-collapse>
</template>
<script>
import JsonEditorVue from "json-editor-vue";
export default {
components: {JsonEditorVue},
data() {
return {
form: {},
activeName: '',
tabsActiveName: '',
childrenTabsActiveName: '',
list: []
}
}
}
</script>
<style scoped lang="scss">
</style>