三方接口自动生成暂存
parent
6146d61748
commit
bb95543469
|
|
@ -0,0 +1,51 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 查询接口基础信息列表
|
||||||
|
export function listInfo(query) {
|
||||||
|
return request({
|
||||||
|
url: '/tool/api/list',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询接口基础信息详细
|
||||||
|
export function getInfo(id) {
|
||||||
|
return request({
|
||||||
|
url: '/tool/api/' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 新增接口基础信息
|
||||||
|
export function addInfo(data) {
|
||||||
|
return request({
|
||||||
|
url: '/tool/api',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function genCode(data) {
|
||||||
|
return request({
|
||||||
|
url: '/tool/api/code',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 修改接口基础信息
|
||||||
|
export function updateInfo(data) {
|
||||||
|
return request({
|
||||||
|
url: '/tool/api',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除接口基础信息
|
||||||
|
export function delInfo(id) {
|
||||||
|
return request({
|
||||||
|
url: '/tool/api/' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,416 @@
|
||||||
|
<template>
|
||||||
|
<div class="api-form-container">
|
||||||
|
<el-form
|
||||||
|
ref="apiFormRef"
|
||||||
|
:model="apiForm"
|
||||||
|
:rules="formRules"
|
||||||
|
label-width="140px"
|
||||||
|
size="medium"
|
||||||
|
>
|
||||||
|
<!-- 1. 基础信息区 -->
|
||||||
|
<div class="form-section">
|
||||||
|
<div class="section-title">基础信息配置</div>
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="请求路径" prop="requestPath">
|
||||||
|
<el-input
|
||||||
|
v-model="apiForm.requestPath"
|
||||||
|
placeholder="例如：/api/user/login"
|
||||||
|
clearable
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="接口类型（厂家）" prop="apiVendor">
|
||||||
|
<el-select
|
||||||
|
v-model="apiForm.apiVendor"
|
||||||
|
placeholder="请选择接口所属厂家"
|
||||||
|
clearable
|
||||||
|
>
|
||||||
|
<el-option label="厂家A" value="vendorA"></el-option>
|
||||||
|
<el-option label="厂家B" value="vendorB"></el-option>
|
||||||
|
<el-option label="厂家C" value="vendorC"></el-option>
|
||||||
|
<el-option label="自定义" value="custom"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="接口说明" prop="apiDesc">
|
||||||
|
<!-- 可拖拽调节的文本域 row: 缩小默认行数 resize:支持左右/上下拖拽调节 -->
|
||||||
|
<el-input
|
||||||
|
v-model="apiForm.apiDesc"
|
||||||
|
type="textarea"
|
||||||
|
:rows="2"
|
||||||
|
placeholder="请输入接口的详细说明"
|
||||||
|
clearable
|
||||||
|
resize="both"
|
||||||
|
class="resize-textarea"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="当前接口备注">
|
||||||
|
<el-input
|
||||||
|
v-model="apiForm.apiRemark"
|
||||||
|
type="textarea"
|
||||||
|
:rows="2"
|
||||||
|
placeholder="请输入接口的额外备注信息"
|
||||||
|
clearable
|
||||||
|
resize="both"
|
||||||
|
class="resize-textarea"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 2. 入参配置区（按钮与标题同行） -->
|
||||||
|
<div class="form-section">
|
||||||
|
<div class="section-header">
|
||||||
|
<div class="section-title">入参配置</div>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
class="operate-btn"
|
||||||
|
@click="addRequestParam"
|
||||||
|
>
|
||||||
|
添加入参
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-table
|
||||||
|
:data="apiForm.requestParams"
|
||||||
|
border
|
||||||
|
stripe
|
||||||
|
:cell-style="{ 'text-align': 'center' }"
|
||||||
|
:header-cell-style="{ 'text-align': 'center' }"
|
||||||
|
class="auto-fit-table"
|
||||||
|
>
|
||||||
|
<el-table-column label="参数名" prop="paramName">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input
|
||||||
|
v-model="scope.row.paramName"
|
||||||
|
placeholder="请输入参数名"
|
||||||
|
size="small"
|
||||||
|
></el-input>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="是否必选" prop="required" width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.required"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
size="small"
|
||||||
|
></el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="参数类型" prop="paramType">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-select
|
||||||
|
v-model="scope.row.paramType"
|
||||||
|
placeholder="请选择"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
|
<el-option label="String" value="String"></el-option>
|
||||||
|
<el-option label="Integer" value="Integer"></el-option>
|
||||||
|
<el-option label="Long" value="Long"></el-option>
|
||||||
|
<el-option label="Boolean" value="Boolean"></el-option>
|
||||||
|
<el-option label="Double" value="Double"></el-option>
|
||||||
|
<el-option label="Date" value="Date"></el-option>
|
||||||
|
<el-option label="List<String>" value="List<String>"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="参数说明" prop="paramDesc">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input
|
||||||
|
v-model="scope.row.paramDesc"
|
||||||
|
placeholder="请输入参数说明"
|
||||||
|
size="small"
|
||||||
|
></el-input>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="生成入参实体" prop="genRequestEntity" width="120">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.genRequestEntity"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
size="small"
|
||||||
|
></el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="操作" width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
size="mini"
|
||||||
|
@click="deleteRequestParam(scope.$index)"
|
||||||
|
>
|
||||||
|
删除
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 3. 出参配置区（按钮与标题同行） -->
|
||||||
|
<div class="form-section">
|
||||||
|
<div class="section-header">
|
||||||
|
<div class="section-title">出参配置</div>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
class="operate-btn"
|
||||||
|
@click="addResponseParam"
|
||||||
|
>
|
||||||
|
添加出参
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-table
|
||||||
|
:data="apiForm.responseParams"
|
||||||
|
border
|
||||||
|
stripe
|
||||||
|
:cell-style="{ 'text-align': 'center' }"
|
||||||
|
:header-cell-style="{ 'text-align': 'center' }"
|
||||||
|
class="auto-fit-table"
|
||||||
|
>
|
||||||
|
<el-table-column label="参数名" prop="paramName">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input
|
||||||
|
v-model="scope.row.paramName"
|
||||||
|
placeholder="请输入参数名"
|
||||||
|
size="small"
|
||||||
|
></el-input>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="参数类型" prop="paramType">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-select
|
||||||
|
v-model="scope.row.paramType"
|
||||||
|
placeholder="请选择"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
|
<el-option label="String" value="String"></el-option>
|
||||||
|
<el-option label="Integer" value="Integer"></el-option>
|
||||||
|
<el-option label="Long" value="Long"></el-option>
|
||||||
|
<el-option label="Boolean" value="Boolean"></el-option>
|
||||||
|
<el-option label="Double" value="Double"></el-option>
|
||||||
|
<el-option label="Date" value="Date"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="参数注释" prop="paramComment">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input
|
||||||
|
v-model="scope.row.paramComment"
|
||||||
|
placeholder="请输入参数注释"
|
||||||
|
size="small"
|
||||||
|
></el-input>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="生成出参实体" prop="genResponseEntity" width="120">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.genResponseEntity"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
size="small"
|
||||||
|
></el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column label="操作" width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
size="mini"
|
||||||
|
@click="deleteResponseParam(scope.$index)"
|
||||||
|
>
|
||||||
|
删除
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 提交按钮（居中展示） -->
|
||||||
|
<el-form-item class="submit-btn-group">
|
||||||
|
<el-button type="primary" @click="submitForm">提交配置</el-button>
|
||||||
|
<el-button @click="resetForm">重置表单</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'ApiConfigForm',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
apiForm: {
|
||||||
|
requestPath: '',
|
||||||
|
apiVendor: '',
|
||||||
|
apiDesc: '',
|
||||||
|
apiRemark: '',
|
||||||
|
requestParams: [],
|
||||||
|
responseParams: []
|
||||||
|
},
|
||||||
|
formRules: {
|
||||||
|
requestPath: [
|
||||||
|
{ required: true, message: '请输入请求路径', trigger: 'blur' },
|
||||||
|
{ pattern: /^\/\S+$/, message: '请求路径需以/开头，且不能包含空格', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
apiVendor: [
|
||||||
|
{ required: true, message: '请选择接口所属厂家', trigger: 'change' }
|
||||||
|
],
|
||||||
|
apiDesc: [
|
||||||
|
{ required: true, message: '请输入接口说明', trigger: 'blur' }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addRequestParam() {
|
||||||
|
this.apiForm.requestParams.push({
|
||||||
|
paramName: '',
|
||||||
|
required: false,
|
||||||
|
paramType: 'String',
|
||||||
|
paramDesc: '',
|
||||||
|
genRequestEntity: false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
deleteRequestParam(index) {
|
||||||
|
this.apiForm.requestParams.splice(index, 1)
|
||||||
|
},
|
||||||
|
addResponseParam() {
|
||||||
|
this.apiForm.responseParams.push({
|
||||||
|
paramName: '',
|
||||||
|
paramType: 'String',
|
||||||
|
paramComment: '',
|
||||||
|
genResponseEntity: false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
deleteResponseParam(index) {
|
||||||
|
this.apiForm.responseParams.splice(index, 1)
|
||||||
|
},
|
||||||
|
async submitForm() {
|
||||||
|
try {
|
||||||
|
const valid = await this.$refs.apiFormRef.validate()
|
||||||
|
if (!valid) return
|
||||||
|
console.log('表单提交数据：', JSON.stringify(this.apiForm, null, 2))
|
||||||
|
this.$message({
|
||||||
|
type: 'success',
|
||||||
|
message: '接口配置提交成功！'
|
||||||
|
})
|
||||||
|
} catch (error) {
|
||||||
|
console.error('提交失败：', error)
|
||||||
|
this.$message({
|
||||||
|
type: 'error',
|
||||||
|
message: '接口配置提交失败，请重试！'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
resetForm() {
|
||||||
|
this.$refs.apiFormRef.resetFields()
|
||||||
|
this.apiForm.requestParams = []
|
||||||
|
this.apiForm.responseParams = []
|
||||||
|
this.$message({
|
||||||
|
type: 'info',
|
||||||
|
message: '表单已重置'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
/* 限制最大宽度，缩小整体窗口 */
|
||||||
|
.api-form-container {
|
||||||
|
max-width: 700px; /* 缩小最大窗口宽度 */
|
||||||
|
margin: 0 auto;
|
||||||
|
background: #fff;
|
||||||
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
border-radius: 4px;
|
||||||
|
/* 对话框内容容器 - 核心滚动配置 */
|
||||||
|
max-height: 70vh; /* 设置最大高度为视口高度的70%，适配不同屏幕 */
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto; /* 垂直方向超出滚动 */
|
||||||
|
overflow-x: hidden; /* 水平方向隐藏，避免横向滚动 */
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-section {
|
||||||
|
margin-bottom: 30px;
|
||||||
|
padding-bottom: 30px;
|
||||||
|
border-bottom: 1px solid #e6e6e6;
|
||||||
|
}
|
||||||
|
.form-section:first-child {
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
.form-section:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 标题+按钮同行布局 */
|
||||||
|
.section-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #1989fa;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.operate-btn {
|
||||||
|
margin: 0; /* 清除默认margin */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 可拖拽调节的文本域样式 */
|
||||||
|
.resize-textarea {
|
||||||
|
resize: both;
|
||||||
|
max-height: 150px; /* 限制文本域最大高度 */
|
||||||
|
min-height: 60px; /* 限制文本域最小高度 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 表格列宽自适应 */
|
||||||
|
.auto-fit-table {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.auto-fit-table /deep/ .el-table__header-wrapper,
|
||||||
|
.auto-fit-table /deep/ .el-table__body-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.auto-fit-table /deep/ .el-table-column {
|
||||||
|
width: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.submit-btn-group .el-button {
|
||||||
|
margin: 0 20px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,367 @@
|
||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||||
|
<el-form-item label="请求路径" prop="requestPath">
|
||||||
|
<el-input
|
||||||
|
id="requestPath" v-model="queryParams.requestPath"
|
||||||
|
placeholder="请输入请求路径"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="接口类型" prop="apiVendor">
|
||||||
|
<el-select id="apiVendor" v-model="queryParams.apiVendor" placeholder="请选择接口类型" clearable>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_param_type"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="接口说明" prop="apiDesc">
|
||||||
|
<el-input
|
||||||
|
id="apiDesc" v-model="queryParams.apiDesc"
|
||||||
|
placeholder="请输入接口说明"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="接口备注" prop="apiRemark">
|
||||||
|
<el-input
|
||||||
|
id="apiRemark" v-model="queryParams.apiRemark"
|
||||||
|
placeholder="请输入接口备注"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<!-- <el-form-item label="逻辑删除标识" prop="isDeleted">
|
||||||
|
<el-select id="isDeleted" v-model="queryParams.isDeleted" placeholder="请选择逻辑删除标识" clearable>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_yes_no"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>-->
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
plain
|
||||||
|
icon="el-icon-plus"
|
||||||
|
size="mini"
|
||||||
|
@click="handleAdd"
|
||||||
|
v-hasPermi="['api:info:add']"
|
||||||
|
>新增</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="success"
|
||||||
|
plain
|
||||||
|
icon="el-icon-edit"
|
||||||
|
size="mini"
|
||||||
|
:disabled="single"
|
||||||
|
@click="handleUpdate"
|
||||||
|
v-hasPermi="['api:info:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
plain
|
||||||
|
icon="el-icon-delete"
|
||||||
|
size="mini"
|
||||||
|
:disabled="multiple"
|
||||||
|
@click="handleDelete"
|
||||||
|
v-hasPermi="['api:info:remove']"
|
||||||
|
>删除</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
icon="el-icon-download"
|
||||||
|
size="mini"
|
||||||
|
@click="handleExport"
|
||||||
|
v-hasPermi="['api:info:export']"
|
||||||
|
>导出</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :border="false" :data="infoList" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
|
<el-table-column label="主键ID" align="center" prop="id" />
|
||||||
|
<el-table-column label="请求路径" align="center" prop="requestPath" />
|
||||||
|
<el-table-column label="接口类型" align="center" prop="apiVendor">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<dict-tag :options="dict.type.sys_param_type" :value="scope.row.apiVendor"/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="接口说明" align="center" prop="apiDesc" />
|
||||||
|
<el-table-column label="接口备注" align="center" prop="apiRemark" />
|
||||||
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
v-hasPermi="['api:info:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['api:info:remove']"
|
||||||
|
>删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-show="total>0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- 添加或修改接口基础信息对话框 -->
|
||||||
|
<el-dialog :title="title" :destroy-on-close="true" class="api-config-dialog"
|
||||||
|
:visible.sync="open" width="760px" append-to-body>
|
||||||
|
<ApiConfigForm />
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {listInfo, getInfo, delInfo, addInfo, updateInfo, genCode} from "@/api/system/api"
|
||||||
|
import ApiConfigForm from "@/views/tool/api/apiForm.vue";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "Info",
|
||||||
|
components: {ApiConfigForm},
|
||||||
|
dicts: ['sys_param_type', 'sys_yes_no'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 遮罩层
|
||||||
|
loading: true,
|
||||||
|
// 选中数组
|
||||||
|
ids: [],
|
||||||
|
// 子表选中数据
|
||||||
|
checkedSysApiParam: [],
|
||||||
|
// 非单个禁用
|
||||||
|
single: true,
|
||||||
|
// 非多个禁用
|
||||||
|
multiple: true,
|
||||||
|
// 显示搜索条件
|
||||||
|
showSearch: true,
|
||||||
|
// 总条数
|
||||||
|
total: 0,
|
||||||
|
// 接口基础信息表格数据
|
||||||
|
infoList: [],
|
||||||
|
// 接口参数表格数据
|
||||||
|
sysApiParamList: [],
|
||||||
|
// 弹出层标题
|
||||||
|
title: "",
|
||||||
|
// 是否显示弹出层
|
||||||
|
open: false,
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
requestPath: null,
|
||||||
|
apiVendor: null,
|
||||||
|
apiDesc: null,
|
||||||
|
apiRemark: null,
|
||||||
|
isDeleted: null
|
||||||
|
},
|
||||||
|
// 表单参数
|
||||||
|
form: {},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
requestPath: [
|
||||||
|
{ required: true, message: "请求路径不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
apiVendor: [
|
||||||
|
{ required: true, message: "接口类型不能为空", trigger: "change" }
|
||||||
|
],
|
||||||
|
apiDesc: [
|
||||||
|
{ required: true, message: "接口说明不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
isDeleted: [
|
||||||
|
{ required: true, message: "逻辑删除标识不能为空", trigger: "change" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询接口基础信息列表 */
|
||||||
|
getList() {
|
||||||
|
this.loading = true
|
||||||
|
listInfo(this.queryParams).then(response => {
|
||||||
|
this.infoList = response.rows
|
||||||
|
this.total = response.total
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 取消按钮
|
||||||
|
cancel() {
|
||||||
|
this.open = false
|
||||||
|
this.reset()
|
||||||
|
},
|
||||||
|
// 表单重置
|
||||||
|
reset() {
|
||||||
|
this.form = {
|
||||||
|
id: null,
|
||||||
|
requestPath: null,
|
||||||
|
apiVendor: null,
|
||||||
|
apiDesc: null,
|
||||||
|
apiRemark: null,
|
||||||
|
createTime: null,
|
||||||
|
updateTime: null,
|
||||||
|
isDeleted: null
|
||||||
|
}
|
||||||
|
this.sysApiParamList = []
|
||||||
|
this.resetForm("form")
|
||||||
|
},
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
resetQuery() {
|
||||||
|
this.resetForm("queryForm")
|
||||||
|
this.handleQuery()
|
||||||
|
},
|
||||||
|
// 多选框选中数据
|
||||||
|
handleSelectionChange(selection) {
|
||||||
|
this.ids = selection.map(item => item.id)
|
||||||
|
this.single = selection.length!==1
|
||||||
|
this.multiple = !selection.length
|
||||||
|
},
|
||||||
|
/** 新增按钮操作 */
|
||||||
|
handleAdd() {
|
||||||
|
this.reset()
|
||||||
|
this.open = true
|
||||||
|
this.title = "添加接口基础信息"
|
||||||
|
},
|
||||||
|
/** 修改按钮操作 */
|
||||||
|
handleUpdate(row) {
|
||||||
|
this.reset()
|
||||||
|
const id = row.id || this.ids
|
||||||
|
getInfo(id).then(response => {
|
||||||
|
this.form = response.data
|
||||||
|
this.sysApiParamList = response.data.sysApiParamList
|
||||||
|
this.open = true
|
||||||
|
this.title = "修改接口基础信息"
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/** 提交按钮 */
|
||||||
|
submitForm() {
|
||||||
|
this.$refs["form"].validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
this.form.sysApiParamList = this.sysApiParamList
|
||||||
|
if (this.form.id != null) {
|
||||||
|
updateInfo(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("修改成功")
|
||||||
|
this.open = false
|
||||||
|
this.getList()
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
|
||||||
|
genCode(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("生成成功")
|
||||||
|
this.open = false
|
||||||
|
})
|
||||||
|
addInfo(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("新增成功")
|
||||||
|
this.open = false
|
||||||
|
this.getList()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/** 删除按钮操作 */
|
||||||
|
handleDelete(row) {
|
||||||
|
const ids = row.id || this.ids
|
||||||
|
this.$modal.confirm('是否确认删除接口基础信息编号为"' + ids + '"的数据项？').then(function() {
|
||||||
|
return delInfo(ids)
|
||||||
|
}).then(() => {
|
||||||
|
this.getList()
|
||||||
|
this.$modal.msgSuccess("删除成功")
|
||||||
|
}).catch(() => {})
|
||||||
|
},
|
||||||
|
/** 接口参数序号 */
|
||||||
|
rowSysApiParamIndex({ row, rowIndex }) {
|
||||||
|
row.index = rowIndex + 1
|
||||||
|
},
|
||||||
|
/** 接口参数添加按钮操作 */
|
||||||
|
handleAddSysApiParam() {
|
||||||
|
let obj = {}
|
||||||
|
obj.paramType = ""
|
||||||
|
obj.paramName = ""
|
||||||
|
obj.required = ""
|
||||||
|
obj.paramDataType = ""
|
||||||
|
obj.paramDesc = ""
|
||||||
|
obj.genEntity = ""
|
||||||
|
this.sysApiParamList.push(obj)
|
||||||
|
},
|
||||||
|
/** 接口参数删除按钮操作 */
|
||||||
|
handleDeleteSysApiParam() {
|
||||||
|
if (this.checkedSysApiParam.length === 0) {
|
||||||
|
this.$modal.msgError("请先选择要删除的接口参数数据")
|
||||||
|
} else {
|
||||||
|
const sysApiParamList = this.sysApiParamList
|
||||||
|
const checkedSysApiParam = this.checkedSysApiParam
|
||||||
|
this.sysApiParamList = sysApiParamList.filter(function(item) {
|
||||||
|
return checkedSysApiParam.indexOf(item.index) === -1
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/** 复选框选中数据 */
|
||||||
|
handleSysApiParamSelectionChange(selection) {
|
||||||
|
this.checkedSysApiParam = selection.map(item => item.index)
|
||||||
|
},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.download('api/info/export', {
|
||||||
|
...this.queryParams
|
||||||
|
}, `info_${new Date().getTime()}.xlsx`)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
|
||||||
|
/* 对话框整体样式 */
|
||||||
|
.api-config-dialog {
|
||||||
|
--el-dialog-body-padding: 0; /* 清除对话框默认内边距 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-config-dialog /deep/ .el-dialog__header {
|
||||||
|
padding: 15px 20px;
|
||||||
|
border-bottom: 1px solid #e6e6e6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-config-dialog /deep/ .el-dialog__body {
|
||||||
|
padding: 20px;
|
||||||
|
overflow: hidden; /* 隐藏外层滚动，仅内层滚动 */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue