Skip to content

Q
qa-platform-ui
Commit 83bf00cc authored by 王晓铜's avatar 王晓铜
Browse files
Options

添加单个用例管理模块

parent 75ee64d9
Hide whitespace changes
Inline Side-by-side
Showing with 882 additions and 81 deletions
package-lock.json
View file @ 83bf00cc
......@@ -2771,6 +2771,16 @@
"integrity": "sha512-GRMWDxpOB6Dgk2E5Uo+3eEBvtOOlimMmpbFiKuLFnQzYDavtLFY3K5ona41jgN/WdRZtG7utuVSVTL4HbZHGkw==",
"dev": true
},
"clipboard": {
"version": "2.0.8",
"resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.8.tgz",
"integrity": "sha512-Y6WO0unAIQp5bLmk1zdThRhgJt/x3ks6f30s3oE3H1mgIEU33XyQjEf8gsf6DxC7NPX8Y1SsNWjUjL/ywLnnbQ==",
"requires": {
"good-listener": "^1.2.2",
"select": "^1.1.2",
"tiny-emitter": "^2.0.0"
}
},
"cliui": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-4.1.0.tgz",
......@@ -4508,6 +4518,11 @@
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
},
"delegate": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
"integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw=="
},
"depd": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
......@@ -6214,6 +6229,14 @@
"pinkie-promise": "^2.0.0"
}
},
"good-listener": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
"integrity": "sha1-1TswzfkxPf+33JoNR3CWqm0UXFA=",
"requires": {
"delegate": "^3.1.2"
}
},
"graceful-fs": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz",
......@@ -13543,6 +13566,11 @@
}
}
},
"select": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
"integrity": "sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0="
},
"select-hose": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
......@@ -14653,6 +14681,11 @@
"integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=",
"dev": true
},
"tiny-emitter": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
},
"tmp": {
"version": "0.0.33",
"resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
......@@ -15308,6 +15341,15 @@
"vue": "^2.2.6"
}
},
"vue-json-viewer": {
"version": "2.2.18",
"resolved": "https://registry.npmjs.org/vue-json-viewer/-/vue-json-viewer-2.2.18.tgz",
"integrity": "sha512-OytvjRrnmH2cUfz8hbXM34GuYW08LFCQIr7tppQRJIaqGfVpn96F0cOuV+8ezwoEpeRT8xmldpeATBhiimNYDQ==",
"requires": {
"clipboard": "^2.0.4",
"vue": "^2.6.9"
}
},
"vue-loader": {
"version": "13.7.3",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-13.7.3.tgz",
......
src/api/getAutoCase.js 0 → 100644
View file @ 83bf00cc
import request from '@/utils/holmesRequest'
// 获取case列表
export function singleCaseList(queryInfo) {
return request({
url: '/auto/testcase/list',
method: 'get',
params: queryInfo
})
}
// 获取接口详情
export function getInterfaceDetail(queryInfo) {
return request({
url: '/auto/interface/detail',
method: 'get',
params: queryInfo
})
}
// 添加用例接口
export function addCase(data) {
return request({
url: '/auto/testcase/add',
method: 'post',
data
})
}
// 删除case接口
export function delCase(queryInfo) {
return request({
url: '/auto/testcase/delete',
method: 'get',
params: queryInfo
})
}
// 执行单个case
export function executeCase(queryInfo) {
return request({
url: '/auto/execute/testcase',
method: 'get',
params: queryInfo
})
}
// 单个用例编辑接口
export function editCase(data) {
return request({
url: '/auto/testcase/modify',
method: 'post',
data
})
}
src/assets/css/global.css
View file @ 83bf00cc
......@@ -17,7 +17,7 @@ html, body, #app {
.jsoneditor-vue {
height: 300px;
}
/* .el-collapse-item__header{
.el-collapse-item__header{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
......@@ -30,10 +30,9 @@ html, body, #app {
color: #303133;
cursor: pointer;
border-bottom: 1px solid #EBEEF5;
font-size: 13px;
font-weight: 500;
font-size: 15px !important;
font-weight: 550 !important;
-webkit-transition: border-bottom-color .3s;
transition: border-bottom-color .3s;
outline: 0;
font-size: 15px;
} */
\ No newline at end of file
}
\ No newline at end of file
src/main.js
View file @ 83bf00cc
......@@ -9,6 +9,7 @@ import echarts from 'echarts'
import 'element-ui/lib/theme-chalk/index.css'
import axios from 'axios'
import store from './store/store'
import JsonViewer from 'vue-json-viewer'
import {
Container,
Header,
......@@ -89,6 +90,7 @@ Vue.use(Radio)
Vue.use(Row)
Vue.use(Col)
Vue.use(VueBus)
Vue.use(JsonViewer)
/* eslint-disable no-new */
new Vue({
el: '#app',
......
src/router/index.js
View file @ 83bf00cc
......@@ -20,6 +20,8 @@ import ModelList from '../views/auto/Model'
import InterfaceDetail from '../views/auto/InterfaceDetail'
import JiraNotify from '../views/jira/Notify'
import AddInterface from '../views/auto/AddInterface'
import CaseList from '../views/auto/CaseList'
import AddCase from '../views/auto/AddCase'
Vue.use(Router)
const router = new Router({
......@@ -96,24 +98,34 @@ const router = new Router({
// 2021-4-08新添加项目管理页面
{
path: '/auto/Project',
name: '项目管理',
name: ProjectList,
component: ProjectList
},
{
path: '/auto/Model',
name: '模块管理',
name: ModelList,
component: ModelList
},
{
path: '/auto/InterfaceDetail',
name: '接口详情',
name: InterfaceDetail,
component: InterfaceDetail
},
{
path: '/auto/AddInterface',
name: 'AddInterface',
name: AddInterface,
component: AddInterface
},
{
path: '/auto/CaseList',
name: CaseList,
component: CaseList
},
{
path: '/auto/AddCase',
name: AddCase,
component: AddCase
},
{
'path': '/effect/jira/notify',
component: JiraNotify
......
src/views/auto/AddCase.vue 0 → 100644
View file @ 83bf00cc
<template>
<div>
<el-form ref="caseForm" :rules="rules" :model="caseForm" label-width="90px">
<el-form-item label="模块名称:" prop="moduleId">
<el-select v-model="caseForm.moduleId" placeholder="请选择模块" @change="selectChangeModel" clearable>
<el-option v-for="item in modelList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="接口名称:" prop="interfaceId">
<el-select v-model="caseForm.interfaceId" placeholder="请选择接口" @change="selectChangeInterface" clearable>
<el-option v-for="item in interfaceList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-card v-if="this.isShow">
<el-form-item label="用例名称:" prop="name" style="width:310px;margin-left:-20px">
<el-input v-model="caseForm.name" placeholder="请输入用例名称"></el-input>
</el-form-item>
<el-collapse v-model="activeNames">
<!-- Headers -->
<el-collapse-item name="1" title="请求头">
<el-button type="success" plain @click="AddHeaderListRow()" class="el-icon-circle-plus">添加行</el-button>
<el-form-item>
<el-row>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数名称</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数值</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:25px">操作</div>
</el-col>
</el-row>
<el-row v-for="(item,index) in headersList" :key="index">
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsName" placeholder="请输入参数名称"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsValue" placeholder="请输入参数值"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-button size="mini" type="danger" @click="advanceDelss(index)" style="height:40px;margin-left:20px">删除</el-button>
</div>
</el-col>
</el-row>
</el-form-item>
</el-collapse-item>
<!-- 请求参数 -->
<el-collapse-item name="2" title="请求参数">
<el-button type="success" plain @click="AddRequestParamsListRow()" class="el-icon-circle-plus">添加行</el-button>
<el-form-item>
<el-row>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数名称</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数值</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:25px">操作</div>
</el-col>
</el-row>
<el-row v-for="(item,index) in requestParamsList" :key="index">
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsName" placeholder="请输入参数名称"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsValue" placeholder="请输入参数值"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-button size="mini" type="danger" @click="requestParamsDel(index)" style="height:40px;margin-left:20px">删除</el-button>
</div>
</el-col>
</el-row>
</el-form-item>
</el-collapse-item>
<!-- 参数列表 -->
<el-collapse-item name="3" title="参数列表">
<el-button type="success" plain @click="AddParamsListRow()" class="el-icon-circle-plus">添加行</el-button>
<el-form-item>
<el-row>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数名称</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数值</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:25px">操作</div>
</el-col>
</el-row>
<el-row v-for="(item,index) in paramsList" :key="index">
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsName" placeholder="请输入参数名称"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsValue" placeholder="请输入参数值"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-button size="mini" type="danger" @click="paramsDel(index)" style="height:40px;margin-left:20px">删除</el-button>
</div>
</el-col>
</el-row>
</el-form-item>
</el-collapse-item>
<!-- 响应解析列表 -->
<el-collapse-item name="4" title="响应列表">
<el-button type="success" plain @click="AddResponseListRow()" class="el-icon-circle-plus">添加行</el-button>
<el-form-item>
<el-row>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数名称</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:15px">参数值</div>
</el-col>
<el-col :span="6">
<div class="grid-content" style="margin-left:25px">操作</div>
</el-col>
</el-row>
<el-row v-for="(item,index) in responseList" :key="index">
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsName" placeholder="请输入参数名称"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-input v-model.trim="item.paramsValue" placeholder="请输入参数值"></el-input>
</div>
</el-col>
<el-col :span="6">
<div>
<el-button size="mini" type="danger" @click="responeDel(index)" style="height:40px;margin-left:20px">删除</el-button>
</div>
</el-col>
</el-row>
</el-form-item>
</el-collapse-item>
<!-- 断言 -->
<el-collapse-item name="5" title="结果断言">
<el-button type="success" plain @click="AddAssertionListRow()" class="el-icon-circle-plus">添加行</el-button>
<el-table :data="assertionList" border style="width:100%;margin-top: 15px;">
<el-table-column label="参数名称" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsName">
</el-input>
</template>
</el-table-column>
<el-table-column label="参数值" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsValue">
</el-input>
</template>
</el-table-column>
<el-table-column label="是否必填" width="150" style="text-align:center">
<template slot-scope="scope">
<el-switch v-model="scope.row.isRequired" active-color="#13ce66" inactive-color="#A9A9A9" active-text="是" inactive-text="否" @change="changeState()"></el-switch>
</template>
</el-table-column>
<el-table-column label="示例" width="300">
<template slot-scope="scope">
<el-input v-model="scope.row.examples"></el-input>
</template>
</el-table-column>
<el-table-column label="备注" width="300">
<template slot-scope="scope">
<el-input v-model="scope.row.remarks"></el-input>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button size="mini" type="danger" @click="AssertionDelete(scope.$index)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-collapse-item>
</el-collapse>
<div style="margin-left:700px;margin-top:20px">
<el-button type="primary" @click="addCaseFrom">确 定</el-button>
</div>
</el-card>
</el-form>
</div>
</template>
<script>
import { getModulList, interfaceDetailList } from '@/api/getAotoInterface'
import { getInterfaceDetail, addCase, editCase } from '@/api/getAutoCase'
import bus from '@/utils/bus'
export default {
data() {
return {
queryModuleInfo: {
pageNum: 1,
pageSize: 10
},
moduleInfo: {
pageNum: 1,
pageSize: 100
},
interfaceInfo: {
pageNum: 1,
pageSize: 100,
moduleId: ''
},
caseForm: {
id: '',
name: '',
moduleId: '',
moduleName: '',
interfaceName: '',
interfaceId: '',
headers: '',
variables: '',
parameters: '',
extract: '',
validate: ''
},
modelList: [],
interfaceList: [],
selectInterfacelId: '',
rules: {
moduleId: [
{
required: true,
message: '模块名称不能为空！',
trigger: 'blur'
}
],
interfaceId: [
{
required: true,
message: '接口名称不能为空！',
trigger: 'blur'
}
],
name: [
{
required: true,
message: '用例不能为空！',
trigger: 'blur'
}
]
},
isShow: false,
activeNames: '1',
interfaceForm: {
interfaceId: ''
},
assertionList: [],
headersList: [],
requestParamsList: [],
paramsList: [],
responseList: []
}
},
created() {
this.getModelList()
bus.$on('casemsg', (row) => {
// console.log('接收到的信息', row)
if (row !== null) {
if (row === '新增') {
this.isShow = false
this.caseForm.name = ''
this.caseForm.moduleId = ''
this.caseForm.interfaceId = ''
this.headersList = []
this.requestParamsList = []
this.paramsList = []
this.responseList = []
this.assertionList = []
} else {
// 编辑接收到的信息
this.isShow = true
this.caseForm.id = row.id
this.caseForm.name = row.name
this.caseForm.moduleId = row.moduleId
this.caseForm.interfaceId = row.interfaceId
this.caseForm.moduleName = row.moduleName
this.caseForm.interfaceName = row.interfaceName
// 请求头（将json字符串转化为对象）
var newHeaders = JSON.parse(row.headers)
this.headersList = []
for (var i in newHeaders) {
this.headersList.push({
paramsName: i,
paramsValue: newHeaders[i]
})
}
// 请求参数
var newParamters = JSON.parse(row.parameters)
this.requestParamsList = []
for (var j in newParamters) {
this.requestParamsList.push({
paramsName: j,
paramsValue: newParamters[j]
})
}
// 参数列表
var newVariables = JSON.parse(row.variables)
this.paramsList = []
for (var k in newVariables) {
this.paramsList.push({
paramsName: k,
paramsValue: newVariables[k]
})
}
// 响应解析列表
var newExtract = JSON.parse(row.extract)
this.responseList = []
for (var o in newExtract) {
this.responseList.push({
paramsName: o,
paramsValue: newExtract[o]
})
}
// 返回断言
this.assertionList = JSON.parse(row.validate)
}
}
})
},
methods: {
// 获取模块列表
getModelList() {
getModulList(this.moduleInfo).then((resp) => {
this.modelList = resp.data.data.list
})
},
// 模块下拉框改变事件
selectChangeModel() {
interfaceDetailList(this.interfaceInfo).then((resp) => {
this.interfaceList = resp.data.data.list
})
},
// 接口下拉框改变事件
selectChangeInterface() {
this.isShow = true
this.interfaceForm.interfaceId = this.caseForm.interfaceId
// 获取接口详情
getInterfaceDetail(this.interfaceForm).then((resp) => {
this.headersList = JSON.parse(resp.data.data.headers)
this.requestParamsList = JSON.parse(resp.data.data.paramTemplate)
this.responseList = JSON.parse(resp.data.data.responseTemplate)
})
},
// 添加Headers
AddHeaderListRow() {
this.headersList.push({
paramsName: '',
paramsValue: ''
})
},
// 删除Headers
advanceDelss(index) {
this.headersList.splice(index, 1)
},
// 添加请求参数
AddRequestParamsListRow() {
this.requestParamsList.push({
paramsName: '',
paramsValue: ''
})
},
// 删除请求参数
requestParamsDel(index) {
this.requestParamsList.splice(index, 1)
},
// 参数列表
AddParamsListRow() {
this.paramsList.push({
paramsName: '',
paramsValue: ''
})
},
// 参数列表删除
paramsDel(index) {
this.paramsList.splice(index, 1)
},
// 添加响应解析列表
AddResponseListRow() {
this.responseList.push({
paramsName: '',
paramsValue: ''
})
},
// 删除响应解析信息
responeDel(index) {
this.responseList.splice(index, 1)
},
// 添加断言行
AddAssertionListRow() {
this.assertionList.push({
paramsName: '',
paramsValue: '',
isRequired: true,
examples: '',
remarks: ''
})
},
// 断言改变
changeState(e) {
if (e === true) {
this.assertionList.isRequired = e
} else {
this.assertionList.isRequired = e
}
},
// 断言删除
AssertionDelete(index) {
this.assertionList.splice(index, 1)
},
// 添加case信息
addCaseFrom() {
// 将数组转化为对象
var headersObj = {}
this.headersList.forEach((item) => {
headersObj[item.paramsName] = item.paramsValue
})
// 将对象转化为Json
this.caseForm.headers = JSON.stringify(headersObj)
// 请求参数
var requestParamsObj = {}
this.requestParamsList.forEach((item) => {
requestParamsObj[item.paramsName] = item.paramsValue
})
this.caseForm.parameters = JSON.stringify(requestParamsObj)
// 参数列表
var paramsListObj = {}
this.paramsList.forEach((item) => {
paramsListObj[item.paramsName] = item.paramsValue
})
this.caseForm.variables = JSON.stringify(paramsListObj)
// 响应解析列表
var responseObj = {}
this.responseList.forEach((item) => {
responseObj[item.paramsName] = item.paramsValue
})
this.caseForm.extract = JSON.stringify(responseObj)
// 断言
this.caseForm.validate = JSON.stringify(this.assertionList)
// console.log('保存信息', this.caseForm)
if (this.caseForm.id) {
// 编辑接口
editCase(this.caseForm).then((resp) => {
if (resp.data.data === true) {
this.$message.success('修改成功！')
this.$router.push('CaseList')
// 刷新列表页
this.sendResh()
} else {
this.$message.error(resp.data.msg)
}
})
} else {
// 添加接口
addCase(this.caseForm).then((resp) => {
if (resp.data.data === true) {
this.$message.success('添加成功！')
// 返回列表页
this.$router.push('CaseList')
// 刷新列表页
this.sendResh()
} else {
this.$message.error(resp.data.msg)
}
})
}
},
// 刷新列表
sendResh() {
// bus使用
this.$nextTick(function () {
// DOM 现在更新了
bus.$emit('refresh')
})
}
}
}
</script>
<style lang="less" scoped>
.h-list {
line-height: 20px;
padding: 10px 0;
font-size: 14px;
color: #161b22;
border-bottom: 1px solid #e9eaf1;
div {
padding-right: 5px;
max-height: 150px;
//overflow-y: auto;
overflow-x: hidden;
word-wrap: break-word;
}
}
</style>
src/views/auto/AddInterface.vue
View file @ 83bf00cc
<template>
<div>
<el-form ref="interfaceForm" :rules="rules" :model="interfaceForm" label-width="100px">
<el-form ref="interfaceForm" :rules="rules" :model="interfaceForm">
<el-collapse v-model="activeNames">
<el-collapse-item title="基本信息" name="1">
<el-collapse-item name="1" title="基本信息">
<el-row>
<el-col :span="8">
<el-col :span="5">
<el-form-item label="接口名称:" prop="name">
<el-input v-model="interfaceForm.name" style="width:200px"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="所属模块:" prop="modelName" style="margin-left:-200px">
<el-col :span="5">
<el-form-item label="所属模块:" prop="moduleId">
<el-select v-model="interfaceForm.moduleId" placeholder="请选择模块">
<el-option v-for="item in modelList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="请求方式:" prop="method" style="margin-left:-350px">
<el-select v-model="interfaceForm.method" placeholder="请选择模块">
<el-col :span="5">
<el-form-item label="请求方式:" prop="method">
<el-select v-model="interfaceForm.method" placeholder="请选择">
<el-option v-for="item in optionMethod" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-col :span="5">
<el-form-item label="请求路径:" prop="url">
<el-input v-model="interfaceForm.url" style="width:200px"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="参数类型:" prop="reqType" style="margin-left:-200px">
<el-col :span="5">
<el-form-item label="参数类型:" prop="paramType">
<el-select v-model="interfaceForm.paramType" placeholder="请选择参数类型">
<el-option v-for="item in optionReqType" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
......@@ -40,17 +40,17 @@
</el-row>
</el-collapse-item>
<!-- Headers添加 -->
<el-collapse-item title="请求头Headers" name="2">
<el-button type="success" round @click="AddHeaderListRow()">添加行</el-button>
<el-collapse-item title="请求头" name="2">
<el-button type="success" plain class="el-icon-circle-plus" @click="AddHeaderListRow()">添加行</el-button>
<!-- Header参数添加 -->
<el-table :data="headersList" border style="width:95%;margin-top: 15px;">
<el-table-column label="参数名称" width="277">
<el-table :data="headersList" border style="width:100%;margin-top:15px;">
<el-table-column label="参数名称" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsName">
</el-input>
</template>
</el-table-column>
<el-table-column label="参数值" width="300">
<el-table-column label="参数值" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsValue">
</el-input>
......@@ -66,12 +66,12 @@
<el-input v-model="scope.row.examples"></el-input>
</template>
</el-table-column>
<el-table-column label="备注" width="320">
<el-table-column label="备注" width="300">
<template slot-scope="scope">
<el-input v-model="scope.row.remarks"></el-input>
</template>
</el-table-column>
<el-table-column label="操作" width="220">
<el-table-column label="操作">
<template slot-scope="scope">
<el-button size="mini" type="danger" @click="headerDelete(scope.$index)">删除</el-button>
</template>
......@@ -80,15 +80,15 @@
</el-collapse-item>
<!-- 参数添加 -->
<el-collapse-item title="请求参数" name="3">
<el-button type="success" round @click="AddParamsListRow()">添加行</el-button>
<el-table :data="paramList" border style="width:95%;margin-top: 15px;">
<el-table-column label="参数名称" width="277">
<el-button type="success" plain class="el-icon-circle-plus" @click="AddParamsListRow()">添加行</el-button>
<el-table :data="paramList" border style="width:100%;margin-top: 15px;">
<el-table-column label="参数名称" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsName">
</el-input>
</template>
</el-table-column>
<el-table-column label="参数值" width="300">
<el-table-column label="参数值" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsValue">
</el-input>
......@@ -104,12 +104,12 @@
<el-input v-model="scope.row.examples"></el-input>
</template>
</el-table-column>
<el-table-column label="备注" width="320">
<el-table-column label="备注" width="300">
<template slot-scope="scope">
<el-input v-model="scope.row.remarks"></el-input>
</template>
</el-table-column>
<el-table-column label="操作" width="220">
<el-table-column label="操作">
<template slot-scope="scope">
<el-button size="mini" type="danger" @click="paramsDelete(scope.$index)">删除</el-button>
</template>
......@@ -118,15 +118,15 @@
</el-collapse-item>
<!-- 响应参数添加 -->
<el-collapse-item title="响应参数" name="4">
<el-button type="success" round @click="AddResponseListRow()">添加行</el-button>
<el-table :data="responseList" border style="width:95%;margin-top: 15px;">
<el-table-column label="参数名称" width="277">
<el-button type="success" plain class="el-icon-circle-plus" @click="AddResponseListRow()">添加行</el-button>
<el-table :data="responseList" border style="width:100%;margin-top: 15px;">
<el-table-column label="参数名称" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsName">
</el-input>
</template>
</el-table-column>
<el-table-column label="参数值" width="300">
<el-table-column label="参数值" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.paramsValue">
</el-input>
......@@ -142,12 +142,12 @@
<el-input v-model="scope.row.examples"></el-input>
</template>
</el-table-column>
<el-table-column label="备注" width="320">
<el-table-column label="备注" width="300">
<template slot-scope="scope">
<el-input v-model="scope.row.remarks"></el-input>
</template>
</el-table-column>
<el-table-column label="操作" width="220">
<el-table-column label="操作">
<template slot-scope="scope">
<el-button size="mini" type="danger" @click="responseDelete(scope.$index)">删除</el-button>
</template>
......@@ -201,7 +201,7 @@ export default {
trigger: 'blur'
}
],
modelName: [
moduleId: [
{
required: true,
message: '接口名称不能为空！',
......@@ -222,7 +222,7 @@ export default {
trigger: 'blur'
}
],
reqType: [
paramType: [
{
required: true,
message: '接口名称不能为空！',
......@@ -257,18 +257,30 @@ export default {
}
},
created() {
console.log('2222')
bus.$on('msg', (row) => {
console.log('传递的参数信息', row)
this.interfaceForm.id = row.id
this.interfaceForm.name = row.name
this.interfaceForm.moduleId = row.moduleId
this.interfaceForm.method = row.method
this.interfaceForm.url = row.url
this.interfaceForm.paramType = row.paramType
this.headersList = JSON.parse(row.headers)
this.paramList = JSON.parse(row.paramTemplate)
this.responseList = JSON.parse(row.responseTemplate)
if (row !== null) {
if (row === '新增') {
this.interfaceForm.id = ''
this.interfaceForm.name = ''
this.interfaceForm.moduleId = ''
this.interfaceForm.method = ''
this.interfaceForm.url = ''
this.interfaceForm.paramType = ''
this.headersList = []
this.paramList = []
this.responseList = []
} else {
this.interfaceForm.id = row.id
this.interfaceForm.name = row.name
this.interfaceForm.moduleId = row.moduleId
this.interfaceForm.method = row.method
this.interfaceForm.url = row.url
this.interfaceForm.paramType = row.paramType
this.headersList = JSON.parse(row.headers)
this.paramList = JSON.parse(row.paramTemplate)
this.responseList = JSON.parse(row.responseTemplate)
}
}
})
this.getModelList()
},
......@@ -356,29 +368,16 @@ export default {
if (this.interfaceForm.id) {
// 编辑接口
editInterface(this.interfaceForm).then((resp) => {
console.log('编辑信息', this.interfaceForm)
if (resp.data.data === true) {
this.$message.success('修改成功！')
this.$router.push('InterfaceDetail')
// 刷新列表页
this.sendResh()
this.interfaceForm.id = ''
this.interfaceForm.name = ''
this.interfaceForm.moduleId = ''
this.interfaceForm.method = ''
this.interfaceForm.url = ''
this.interfaceForm.paramType = ''
this.interfaceForm.headers = ''
this.interfaceForm.paramTemplate = ''
this.interfaceForm.responseTemplate = ''
} else {
this.$message.error(resp.data.msg)
}
})
} else {
// this.interfaceForm.headers = JSON.stringify(this.headersList)
// this.interfaceForm.paramTemplate = JSON.stringify(this.paramList)
// this.interfaceForm.responseTemplate = JSON.stringify(this.responseList)
addInterface(this.interfaceForm).then((resp) => {
if (resp.data.data === true) {
this.$message.success('添加成功！')
......@@ -405,10 +404,4 @@ export default {
</script>
<style lang="less" scoped>
.el-collapse-item__header {
padding-left: 5px;
background: rgb(230, 235, 241);
border-bottom: solid white 1px;
font-weight: bolder;
}
</style>
src/views/auto/CaseList.vue 0 → 100644
View file @ 83bf00cc
<template>
<div>
<el-card>
<div>
模块:
<el-select v-model="selectModelId" placeholder="请选择模块" @change="selectChangeModel" clearable>
<el-option v-for="item in modelList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
<el-input v-model="queryModuleInfo.testcaseName" clearable placeholder="请输入用例名称" style="width: 300px;"></el-input>
<el-button type="primary" style="margin-left:20px" @click="queryData">查询</el-button>
<el-button type="primary" style="margin-left:20px" @click="addPage">新增</el-button>
</div>
<el-table :data="singleCaseList" border style="width: 100%;margin-top:20px">
<el-table-column type='index' width="50px"></el-table-column>
<el-table-column prop="moduleName" label="模块名称" width="200px"></el-table-column>
<el-table-column prop="interfaceName" label="接口名称" width="200px"></el-table-column>
<el-table-column prop="name" label="用例名称" width="200px"></el-table-column>
<el-table-column prop="createTime" label="创建日期" width="200px"></el-table-column>
<el-table-column prop="updateTime" label="修改日期" width="200px"></el-table-column>
<el-table-column label="操作">
<slot slot-scope="scope">
<el-button type="warning" @click="executeCaseFrom(scope.row)">执行</el-button>
<el-button type="success" @click="editCaseFrom(scope.row)">编辑</el-button>
<el-button type="danger" @click="delCaseFrom(scope.row)">删除</el-button>
</slot>
</el-table-column>
</el-table>
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="queryModuleInfo.pageNum" :page-size="queryModuleInfo.pageSize" layout="total, prev, pager, next"
:total="totalNum"></el-pagination>
</el-card>
<!-- 接口返回数据 -->
<el-card v-if="isShow">
<div slot="header">
<el-row>
<el-col :span="3">
<div>响应结果 :</div>
</el-col>
</el-row>
<json-viewer :value="requestData"></json-viewer>
</div>
</el-card>
</div>
</template>
<script>
import { getModulList } from '@/api/getAotoInterface'
import { singleCaseList, delCase, executeCase } from '@/api/getAutoCase'
import bus from '@/utils/bus'
export default {
data() {
return {
queryModuleInfo: {
pageNum: 1,
pageSize: 20,
moduleId: '',
testcaseName: ''
},
moduleInfo: {
pageNum: 1,
pageSize: 100
},
totalNum: 0,
modelList: [],
selectModelId: '',
singleCaseList: [],
delCase: {
testcaseId: ''
},
executeCaseParam: {
namespace: '',
testcaseId: ''
},
isShow: false,
requestData: ''
}
},
created() {
this.getModulList()
this.getCaseList()
bus.$on('refresh', () => {
this.isShow = false
this.getCaseList()
})
},
methods: {
// 获取模块列表
getModulList() {
getModulList(this.moduleInfo).then((resp) => {
this.modelList = resp.data.data.list
})
},
// 下拉框改变事件
selectChangeModel() {
this.queryModuleInfo.moduleId = this.selectModelId
},
// 查询方法
queryData() {
this.getCaseList()
},
// 获取case列表
getCaseList() {
singleCaseList(this.queryModuleInfo).then((resp) => {
this.singleCaseList = resp.data.data.list
this.totalNum = resp.data.data.total
})
},
// 添加方法
addPage() {
this.$router.push('AddCase')
this.$nextTick(function () {
// DOM 现在更新了
var row = '新增'
bus.$emit('casemsg', row)
})
},
// 执行用例
executeCaseFrom(row) {
this.isShow = true
// 获取用例id
this.executeCaseParam.testcaseId = row.id
this.executeCaseParam.namespace = window.sessionStorage.getItem('env')
// 获取当前场景
executeCase(this.executeCaseParam).then((resp) => {
this.requestData = resp.data.data
})
},
// 编辑用例
editCaseFrom(row) {
this.$router.push({ path: 'AddCase' })
// bus使用
this.$nextTick(function () {
// DOM 现在更新了
bus.$emit('casemsg', row)
})
},
// 对话框方法
openMessage(message, confirmText, doit) {
this.$messageBox
.confirm(message, '确定', {
cancelButtonText: '取消',
confirmButtonText: confirmText,
type: 'warning'
})
.then(() => {
doit()
})
.catch(() => {})
},
// 删除用例
delCaseFrom(row) {
this.delCase.testcaseId = row.id
this.openMessage('您确定要删除吗？', '删除', () => {
delCase(this.delCase)
.then((resp) => {
if (resp.data.data === true) {
this.$message.success('删除成功！')
this.getCaseList()
} else if (resp.data.data === false) {
this.$message.error(resp.data.msg)
}
})
.catch((error) => {
this.$message({ type: 'error', message: error })
})
})
},
handleSizeChange(newSize) {
this.queryModuleInfo.pageSize = newSize
this.getCaseList()
},
handleCurrentChange(newPage) {
this.queryModuleInfo.pageNum = newPage
this.getCaseList()
}
}
}
</script>
src/views/auto/InterfaceDetail.vue
View file @ 83bf00cc
......@@ -10,7 +10,7 @@
<el-select v-model="selectModelId" placeholder="请选择模块" @change="selectChangeModel" clearable>
<el-option v-for="item in modelList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
<el-input v-model="interfaceName" clearable placeholder="请输入接口名称" style="width: 300px;"></el-input>
<el-input v-model="queryModuleInfo.interfaceName" clearable placeholder="请输入接口名称" style="width: 300px;"></el-input>
<el-button type="primary" style="margin-left:20px" @click="queryData">查询</el-button>
<el-button type="primary" style="margin-left:20px" @click="addPage">新增</el-button>
</div>
......@@ -51,9 +51,10 @@ export default {
return {
queryModuleInfo: {
pageNum: 1,
pageSize: 10,
pageSize: 20,
projectId: '',
moduleId: ''
moduleId: '',
interfaceName: ''
},
totalNum: 0,
projectList: [],
......@@ -99,10 +100,18 @@ export default {
// 查询方法
queryData() {
this.getInterfaceDetailList()
// this.queryModuleInfo.projectId = ''
// this.queryModuleInfo.moduleId = ''
// this.queryModuleInfo.interfaceName = ''
},
// 添加跳转页面
addPage() {
this.$router.push('AddInterface')
this.$nextTick(function () {
// DOM 现在更新了
var row = '新增'
bus.$emit('msg', row)
})
},
// 获取接口列表
getInterfaceDetailList() {
......@@ -121,10 +130,7 @@ export default {
},
// 编辑接口方法
editInterfaceFrom(row) {
this.$router.push({
path: 'AddInterface',
name: 'AddInterface'
})
this.$router.push({ path: 'AddInterface' })
// bus使用
this.$nextTick(function () {
// DOM 现在更新了
......
src/views/auto/Model.vue
View file @ 83bf00cc
......@@ -30,7 +30,7 @@
<el-form-item label="模块名称:" prop="name" style="width:400px">
<el-input v-model="modelForm.name"></el-input>
</el-form-item>
<el-form-item label="所属项目:" prop="projectName">
<el-form-item label="所属项目:" prop="projectId">
<el-select v-model="modelForm.projectId" placeholder="请选择项目" clearable style="width:310px">
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
......@@ -87,7 +87,7 @@ export default {
trigger: 'blur'
}
],
projectName: [
projectId: [
{
required: true,
message: '模块名称不能为空！',
......
src/views/layout/leftAside/menu.json
View file @ 83bf00cc
......@@ -107,17 +107,24 @@
},
{
"id": 3,
"title": "接口列表",
"title": "接口管理",
"icon": "el-icon-bank-card",
"path": "/auto/InterfaceDetail"
},
{
"id": 4,
"title": "用例管理",
"icon": "el-icon-postcard",
"path": "/auto/CaseList"
},
{
"id": 6,
"title": "新增接口",
"show": "false",
"icon": "el-icon-bank-card",
"path": "/auto/AddInterface"
}
]
}
]
......
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