Skip to content

A
api-gateway
Commit f0206b2d by 无尘
Options

feat: 增加接口

parent b28fbed5
Showing with 558 additions and 255 deletions
src/assets/js/strlen.js
......@@ -8,9 +8,10 @@ export default {
* 一个汉字算两个字符,一个英文字母或数字算一个字符
*/
getByteLen: function(val) {
let valStr = val == '' || val == null ? '' : val;
let len = 0;
for (let i = 0; i < val.length; i++) {
let a = val.charAt(i);
for (let i = 0; i < valStr.length; i++) {
let a = valStr.charAt(i);
if (a.match(/[^\x00-\xff]/gi) != null) {
len += 2;
} else {
......@@ -23,9 +24,10 @@ export default {
* 一个汉字算一个字,一个英文字母或数字算半个字
*/
getZhLen: function(val) {
let valStr = val == '' || val == null ? '' : val;
let len = 0;
for (let i = 0; i < val.length; i++) {
let a = val.charAt(i);
for (let i = 0; i < valStr.length; i++) {
let a = valStr.charAt(i);
if (a.match(/[^\x00-\xff]/gi) != null) {
len += 1;
} else {
......@@ -57,13 +59,14 @@ export default {
* 限制字数用, 一个汉字算一个字,两个英文/字母算一个字
*/
getByteVal: function(val, max) {
let valStr = val == '' || val == null ? '' : val;
let returnValue = '';
let byteValLen = 0;
for (let i = 0; i < val.length; i++) {
if (val[i].match(/[^\x00-\xff]/gi) != null) byteValLen += 1;
for (let i = 0; i < valStr.length; i++) {
if (valStr[i].match(/[^\x00-\xff]/gi) != null) byteValLen += 1;
else byteValLen += 0.5;
if (byteValLen > max) break;
returnValue += val[i];
returnValue += valStr[i];
}
return returnValue;
},
......@@ -72,13 +75,14 @@ export default {
* 限制字符数用, 一个汉字算两个字符,一个英文/字母算一个字符
*/
getCharVal: function(val, max) {
let valStr = val == '' || val == null ? '' : val;
let returnValue = '';
let byteValLen = 0;
for (let i = 0; i < val.length; i++) {
if (val[i].match(/[^\x00-\xff]/gi) != null) byteValLen += 2;
for (let i = 0; i < valStr.length; i++) {
if (valStr[i].match(/[^\x00-\xff]/gi) != null) byteValLen += 2;
else byteValLen += 1;
if (byteValLen > max) break;
returnValue += val[i];
returnValue += valStr[i];
}
return returnValue;
},
......
src/components/api/api-version-show.vue
......@@ -7,10 +7,10 @@ import apiVersionShow from '@/components/api/api-version-show.vue';
<div class="api-version-content border-box">
<div class="api-version-body">
<div class="operate-btns">
<el-button type="primary" plain @click="handlePublish">发布</el-button>
<el-button type="primary" plain @click="handleDel">删除</el-button>
<el-button type="primary" plain @click="handleGoHistory">回退</el-button>
<el-button type="primary" plain @click="handleGoBack">回滚</el-button>
<el-button :disabled="apiData.status == 2 || apiData.status == 3" type="primary" plain @click="handlePublish">发布</el-button>
<el-button :disabled="apiData.status == 2 || apiData.status == 3" type="primary" plain @click="handleDel">删除</el-button>
<el-button :disabled="apiData.status == 2 || apiData.status == 3" type="primary" plain @click="handleGoHistory">回退</el-button>
<el-button :disabled="apiData.status == 2 || apiData.status == 3" type="primary" plain @click="handleGoBack">回滚</el-button>
</div>
<div class="anchor-wrap">
<div class="el-tabs el-tabs--right">
......@@ -35,18 +35,15 @@ import apiVersionShow from '@/components/api/api-version-show.vue';
</div>
<div class="frontend-set-wrap info-wrap" id="frontend">
<div class="commont-info-title font-14 color-303133 m-t-47">前端配置</div>
<frontend-info-show></frontend-info-show
><!-- :apiData="apiData" -->
<frontend-info-show :apiData="apiData"></frontend-info-show>
</div>
<div class="backend-set-wrap info-wrap" id="backend">
<div class="commont-info-title font-14 color-303133 m-t-47">后端配置</div>
<backend-info-show></backend-info-show
><!-- :apiData="apiData" -->
<backend-info-show :apiData="apiData"></backend-info-show>
</div>
<div class="back-result-wrap info-wrap" id="result">
<div class="commont-info-title font-14 color-303133 m-t-47">返回结果</div>
<back-info-show></back-info-show
><!-- :apiData="apiData" -->
<back-info-show :apiData="apiData"></back-info-show>
</div>
</div>
<go-history :apiData="apiData" :historyShow="historyShow" @hideHistoryDialog="hideHistoryDialog"></go-history>
......@@ -60,7 +57,7 @@ import backendInfoShow from '@/components/api/backend-info-show.vue';
import backInfoShow from '@/components/api/back-info-show.vue';
import publishSet from '@/components/api/publish-set.vue';
import goHistory from '@/components/api/go-history.vue';
import { getRequest } from '@/api/api';
import { getRequest, postRequest } from '@/api/api';
// import { _debounce } from '@/assets/js/public';
import showMsg from '@/assets/js/showmsg';
import errMsg from '@/assets/js/error';
......@@ -77,29 +74,29 @@ export default {
data() {
return {
apiData: {
interfaceId: 'nisi exercitation ipsum et dolore',
interfaceName: '查询',
interfaceGroupId: '1',
interfaceUrl: 'ex laborum Excepteur aliquip labore',
interfaceDescribe: 'test',
projectId: 'irure ',
optType: 'exercitation',
sucReturn: 'ex Excepteur',
errReturn: 'culpa nisi magna consequat velit',
errCode: 'nostrud proident ',
frontParams: 'id labore',
endParams: 'deserunt Ut',
target: 78473123.86374778,
interfaceId: '',
interfaceName: '',
interfaceGroupId: '',
interfaceUrl: '',
interfaceDescribe: '',
projectId: '',
optType: '',
sucReturn: '',
errReturn: '',
errCode: [],
frontParams: {},
endParams: {},
target: '',
requestType: 'POST',
protocol: 'http',
version: 'elit',
version: '',
interfaceType: 'HTTP',
dubboMethod: 'in ess',
dubboInterface: 'ad',
httpPath: 'commodo minim ex sunt',
proxyCode: 'amet proident fugiat anim commodo',
resultParams: 'veniam dolore Ut',
backendRequestType: 'est laborum cillum commodo mini',
dubboMethod: '',
dubboInterface: '',
httpPath: '',
proxyCode: '',
resultParams: '',
backendRequestType: '',
timeout: 43087112
},
activeInfo: 0,
......@@ -114,15 +111,18 @@ export default {
/**
* 发布
*/
handlePublish(index, row) {
handlePublish() {
const that = this;
that.publishShow = true;
that.editRow = that.apiData;
that.editRow = JSON.parse(JSON.stringify(that.apiData));
},
hidePublishDialog() {
hidePublishDialog(flag) {
const that = this;
that.publishShow = false;
that.editRow = {};
if (flag) {
that.apiData.status = 2;
}
},
/**
* 回退
......@@ -154,9 +154,9 @@ export default {
postDelData() {
const that = this;
let para = {
interfaceVerionId: that.apiData.interfaceVerionId
interfaceVersionId: that.apiData.interfaceVersionId
};
getRequest('/gateway-manage/delete-api-version', para)
postRequest('/gateway-manage/delete-api-version', para)
.then(res => {
let resData = res.data;
if (resData.code == '0000') {
......@@ -192,7 +192,7 @@ export default {
postGoBack() {
const that = this;
let para = {
interfaceVerionId: that.apiData.interfaceVerionId
interfaceVersionId: that.apiData.interfaceVersionId
};
getRequest('/gateway-manage/rollback-api', para)
.then(res => {
......@@ -224,18 +224,18 @@ export default {
getData() {
const that = this;
let para = {
search: that.searchValue,
pageNum: that.currentPage,
pageSize: that.pageSize,
sceneCode: that.sceneCode,
interfaceVersionId: that.$route.query.interfaceVersionId,
interfaceId: that.$route.query.interfaceId
};
getRequest('/gateway-manage/page-proxy', para)
getRequest('/gateway-manage/get-api', para)
.then(res => {
let resData = res.data;
if (resData.code == '0000') {
that.tableData = resData.result.result || [];
that.totalCount = resData.result.totalCount;
resData.result.frontParams = JSON.parse(resData.result.frontParams);
resData.result.endParams = JSON.parse(resData.result.endParams);
resData.result.errCode = JSON.parse(resData.result.errCode);
resData.result.resultParams = JSON.parse(resData.result.resultParams);
that.apiData = resData.result || {};
return;
}
errMsg.errorMsg(resData);
......@@ -265,6 +265,7 @@ export default {
},
mounted() {
const that = this;
that.getData();
that.$nextTick(() => {
that.init();
});
......
src/components/api/back-info-show.vue
......@@ -30,22 +30,31 @@ import backInfoShow from '@/components/api/back-info-show.vue';
</div>
<div class="el-table__body-wrapper is-scrolling-none">
<div class="table-content">
<back-info-table :itemData="apiInfoData.resultParams.properties"></back-info-table>
<back-info-table :itemData="apiInfoData.resultParams"></back-info-table>
</div>
</div>
</div>
</el-form-item>
<el-form-item label="错误码:">
<el-table :data="apiInfoData.errCode" style="width: 100%">
<el-table-column prop="errorCode" label="错误码"> </el-table-column>
<el-table-column prop="errorInfo" label="错误信息"> </el-table-column>
<el-table-column prop="orig_error_code" label="错误码"> </el-table-column>
<el-table-column prop="error_code" label="映射错误码"> </el-table-column>
<el-table-column prop="error_info" label="错误信息"> </el-table-column>
</el-table>
</el-form-item>
<el-form-item label="成功返回示例:">
<div class="common-back-pre"></div>
<div class="common-back-pre">
<pre>
{{ apiInfoData.sucReturn }}
</pre>
</div>
</el-form-item>
<el-form-item label="失败返回示例:">
<div class="common-back-pre"></div>
<div class="common-back-pre">
<pre>
{{ apiInfoData.errReturn }}
</pre>
</div>
</el-form-item>
</el-form>
</div>
......
src/components/api/back-info-table.vue
......@@ -5,7 +5,7 @@ import backInfoTable from '@/components/api/back-info-table.vue';
-->
<template>
<div>
<template v-for="(itemValue, itemName, index) in itemData">
<template v-for="(itemValue, itemName, index) in itemData.properties">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%;table-layout: fixed;" :key="index + itemName + 121">
<tbody>
<tr class="el-table__row">
......@@ -24,8 +24,8 @@ import backInfoTable from '@/components/api/back-info-table.vue';
</tr>
</tbody>
</table>
<table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'array'" :itemData="itemValue.items.properties" :key="index + '122' + itemName"> </table-row>
<table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'object'" :itemData="itemValue.properties" :key="index + '122' + itemName"> </table-row>
<table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'array' && Object.keys(itemValue.items.properties).length" :itemData="itemValue.items" :key="index + '122' + itemName"> </table-row>
<table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'object' && Object.keys(itemValue.properties).length" :itemData="itemValue" :key="index + '122' + itemName"> </table-row>
</template>
</div>
</template>
......
src/components/api/back-table-right.vue
......@@ -5,7 +5,7 @@ import backTableRight from '@/components/api/back-table-right.vue';
-->
<template>
<div>
<template v-for="(itemValue, itemName, index) in itemData">
<template v-for="(itemValue, itemName, index) in itemData.properties">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%;table-layout: fixed;" :key="index + itemName + 121">
<tbody>
<tr class="el-table__row">
......@@ -27,8 +27,8 @@ import backTableRight from '@/components/api/back-table-right.vue';
</tr>
</tbody>
</table>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'array'" :itemData="itemValue.items.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'object'" :itemData="itemValue.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'array' && Object.keys(itemValue.items.properties).length" :itemData="itemValue.items" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'object' && Object.keys(itemValue.properties).length" :itemData="itemValue" :key="index + '123' + itemName"> </back-table-row>
</template>
</div>
</template>
......
src/components/api/back-table-tr.vue
......@@ -5,7 +5,7 @@ import backTableTr from '@/components/api/back-table-tr.vue';
-->
<template>
<div>
<template v-for="(itemValue, itemName, index) in itemData">
<template v-for="(itemValue, itemName, index) in itemData.properties">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%;table-layout: fixed;" :key="index + itemName + 121">
<tbody>
<tr class="el-table__row">
......@@ -24,8 +24,8 @@ import backTableTr from '@/components/api/back-table-tr.vue';
</tr>
</tbody>
</table>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'array' && itemValue.items.properties.length" :itemData="itemValue.items.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'object' && itemValue.properties.length" :itemData="itemValue.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'array' && Object.keys(itemValue.items.properties).length" :itemData="itemValue.items" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'object' && Object.keys(itemValue.properties).length" :itemData="itemValue" :key="index + '122' + itemName"> </back-table-row>
</template>
</div>
</template>
......
src/components/api/backend-info-show.vue
......@@ -7,25 +7,37 @@ import backendInfoShow from '@/components/api/backend-info-show.vue';
<div class="backend-info-show border-box">
<el-form label-width="104px" :model="apiInfoData">
<el-form-item label="后端服务:">
{{ apiInfoData.protocol }}
{{ apiInfoData.interfaceType == 0 ? 'http' : 'dubbo' }}
</el-form-item>
<el-form-item label="环境:">
{{ apiInfoData.protocol }}
</el-form-item>
<el-form-item label="API版本号:">
{{ apiInfoData.protocol }}
{{ apiInfoData.version }}
</el-form-item>
<el-form-item v-if="apiInfoData.interfaceType == 0" label="请求路径:">
{{ apiInfoData.backendHttpPath }}
</el-form-item>
<el-form-item v-if="apiInfoData.interfaceType == 1" label="dubbo接口名称:">
{{ apiInfoData.dubboInterface }}
</el-form-item>
<el-form-item v-if="apiInfoData.interfaceType == 1" label="dubbo请求方法:">
{{ apiInfoData.dubboMethod }}
</el-form-item>
<el-form-item v-if="apiInfoData.interfaceType == 1" label="注册中心地址:">
{{ apiInfoData.proxyCode }}
</el-form-item>
<el-form-item label="请求路径:">
{{ apiInfoData.httpPath }}
<el-form-item v-if="apiInfoData.interfaceType == 1" label="请求版本号:">
{{ apiInfoData.dubboVersion }}
</el-form-item>
<el-form-item label="超时时长:">
{{ apiInfoData.timeout }}
</el-form-item>
<el-form-item label="参数映射:">
<div class="table-wrap-body font-0">
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition inline-block vertical-top" style="width: 395px; table-layout: fixed;">
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition inline-block vertical-top" style="width: 30%; table-layout: fixed;">
<div class="el-table__header-wrapper">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__header" style="width: 395px; table-layout: fixed;">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__header" style="width: 100%; table-layout: fixed;">
<thead class="has-gutter">
<tr class="">
<th colspan="1" rowspan="1" class="el-table_1_column_1 is-leaf" style="width: 36px;">
......@@ -46,13 +58,13 @@ import backendInfoShow from '@/components/api/backend-info-show.vue';
</div>
<div class="el-table__body-wrapper is-scrolling-none">
<div class="table-content">
<back-table-tr :itemData="apiInfoData.endParams.properties"></back-table-tr>
<back-table-tr :itemData="apiInfoData.endParams"></back-table-tr>
</div>
</div>
</div>
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition inline-block vertical-top" style="width: 683px; table-layout: fixed;">
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition inline-block vertical-top" style="width: 70%; table-layout: fixed;">
<div class="el-table__header-wrapper">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__header" style="width: 683px; table-layout: fixed;">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__header" style="width: 100%; table-layout: fixed;">
<thead class="has-gutter">
<tr class="">
<th colspan="1" rowspan="1" class="el-table_1_column_1 is-leaf" style="width: 36px;">
......@@ -76,7 +88,7 @@ import backendInfoShow from '@/components/api/backend-info-show.vue';
</div>
<div class="el-table__body-wrapper is-scrolling-none">
<div class="table-content">
<back-table-right :itemData="apiInfoData.endParams.properties"></back-table-right>
<back-table-right :itemData="apiInfoData.endParams"></back-table-right>
</div>
</div>
</div>
......@@ -201,6 +213,7 @@ export default {
vertical-align: top;
}
.table-wrap-body .el-table th {
width: 100%;
padding: 7px 0;
}
.table-content {
......
src/components/api/base-info-show.vue
......@@ -10,7 +10,7 @@ import baseInfoShow from '@/components/api/base-info-show.vue';
{{ apiInfoData.interfaceName }}
</el-form-item>
<el-form-item label="API类型:">
{{ apiInfoData.interfaceType }}
{{ apiInfoData.target == 1 ? '公开' : '私有' }}
</el-form-item>
<el-form-item label="访问类型:">
{{ apiInfoData.requestType }}
......@@ -35,10 +35,10 @@ export default {
data() {
return {
apiInfoData: {
interfaceName: '1',
interfaceType: 'http',
requestType: 'GET',
interfaceDescribe: 'test'
/* interfaceName: '1',
target: '1',
requestType: 'get',
interfaceDescribe: 'test' */
}
};
},
......
src/components/api/go-history.vue
......@@ -66,17 +66,17 @@ export default {
customDialog: false,
selectVersion: '',
tableData: [
{
interfaceVersionId: '1',
version: '123',
status: '', // 0 删除 1更新修改 2发布 3 历史发布版本
proxyType: '',
defaultFlag: false,
sceneCode: '',
sceneName: '测试',
remark: 'test',
createTime: 1564455643252
}
// {
// interfaceVersionId: '1',
// version: '123',
// status: '', // 0 删除 1更新修改 2发布 3 历史发布版本
// proxyType: '',
// defaultFlag: false,
// sceneCode: '',
// sceneName: '测试',
// remark: 'test',
// createTime: 1564455643252
// }
],
pageSize: 20,
currentPage: 1,
......@@ -221,6 +221,7 @@ export default {
mounted() {
const that = this;
that.customDialog = that.historyShow;
that.getData();
}
};
</script>
......
src/components/api/publish-list.vue
......@@ -62,7 +62,7 @@ export default {
],
searchValue: '',
tableData: [
{
/* {
interfaceVersionId: '',
version: '123',
status: '', // 0 删除 1更新修改 2发布 3 历史发布版本
......@@ -72,7 +72,7 @@ export default {
sceneName: '测试',
remark: 'test',
createTime: 1564455643252
}
} */
],
pageSize: 20,
currentPage: 1,
......@@ -122,14 +122,12 @@ export default {
let para = {
pageNum: that.currentPage,
pageSize: that.pageSize,
version: that.formData.version,
sceneCode: that.formData.sceneCode,
interfaceId: that.formData.interfaceId
interfaceId: that.$route.query.interfaceId
};
getRequest('/gateway-manage/page-api-publish-record', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (resData.code == '0000') {
that.tableData = resData.result.result || [];
that.totalCount = resData.result.totalCount;
return;
......@@ -150,13 +148,14 @@ export default {
// 深度观察监听
deep: true
}
}
},
/* 接收数据 */
/* mounted() {
mounted() {
const that = this;
that.getData();
that.$emit('showTab', 4);
} */
}
};
</script>
......
src/components/api/publish-set.vue
......@@ -137,7 +137,7 @@ export default {
that.setData();
return;
}
errMsg.errorInfo(resData);
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
......@@ -152,7 +152,7 @@ export default {
*/
setData(list) {
const that = this;
that.$emit('hidePublishDialog');
that.$emit('hidePublishDialog', true);
/* that.$nextTick(() => {
that.formData.classifyName = '';
}); */
......
src/components/api/record-list.vue
......@@ -80,12 +80,12 @@ export default {
},
rules: {},
tableData: [
{
/* {
interfaceVersionId: '1',
version: '测试',
remark: '描述内容',
createTime: 1564455643252
}
} */
],
pageSize: 5,
currentPage: 1,
......@@ -135,7 +135,7 @@ export default {
*/
handleShow(index, row) {
const that = this;
that.$router.push('/');
that.$router.push(`/apiListManageShow?interfaceId=${row.interfaceId}&interfaceName=${row.interfaceName}&interfaceVersionId=${row.interfaceVersionId}`);
},
/**
* 获取数据
......@@ -152,7 +152,7 @@ export default {
getRequest('/gateway-manage/page-api-publish-record', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (resData.code == '0000') {
that.tableData = resData.result.result || [];
that.totalCount = resData.result.totalCount;
return;
......@@ -175,6 +175,9 @@ export default {
editRow: function(newData, oldData) {
const that = this;
that.formData = JSON.parse(JSON.stringify(newData));
if (Object.keys(newData).length) {
that.getData();
}
}
},
......
src/components/api/sync-set.vue
......@@ -72,14 +72,14 @@ export default {
sceneCode: [{ required: true, message: '请选择环境', trigger: 'change' }]
},
envOptions: [
{
/* {
sceneCode: '1',
sceneName: '测试'
},
{
sceneCode: '2',
sceneName: '正式'
}
} */
]
};
},
......@@ -193,6 +193,7 @@ export default {
/* 接收数据 */
mounted() {
const that = this;
that.getEnvData();
that.customDialog = that.syncShow;
that.formData = JSON.parse(JSON.stringify(that.editRow));
}
......
src/components/api/version-list.vue
......@@ -26,8 +26,8 @@
</el-table-column>
<el-table-column label="发布时间" show-overflow-tooltip>
<template slot-scope="scope">
<div class="color-606266 line-18">{{ scope.row.publishTime | timeStampToYmd }}</div>
<div class="color-606266 line-18">{{ scope.row.publishTime | timeStampToHms }}</div>
<div v-if="scope.row.publishTime" class="color-606266 line-18">{{ scope.row.publishTime | timeStampToYmd }}</div>
<div v-if="scope.row.publishTime" class="color-606266 line-18">{{ scope.row.publishTime | timeStampToHms }}</div>
</template>
</el-table-column>
<el-table-column label="更新时间" show-overflow-tooltip>
......@@ -44,10 +44,10 @@
<el-table-column label="操作" width="340">
<template slot-scope="scope">
<el-button @click="handleEdit(scope.$index, scope.row)" type="text">编辑</el-button>
<el-button @click="handlePublish(scope.$index, scope.row)" type="text">发布</el-button>
<el-button :disabled="scope.row.status == 2 || scope.row.status == 3" @click="handlePublish(scope.$index, scope.row)" type="text">发布</el-button>
<el-button @click="handleSync(scope.$index, scope.row)" type="text">同步</el-button>
<el-button @click="handleShow(scope.$index, scope.row)" type="text">查看</el-button>
<el-button @click="handleDown(scope.$index, scope.row)" type="text">下线</el-button>
<el-button :disabled="scope.row.status != 2 && scope.row.status != 3" @click="handleDown(scope.$index, scope.row)" type="text">下线</el-button>
<el-button @click="handleRecord(scope.$index, scope.row)" type="text">发布记录</el-button>
</template>
</el-table-column>
......@@ -81,17 +81,17 @@ export default {
searchValue: '',
sceneCode: '',
envOptions: [
{
sceneCode: '1',
sceneName: '测试'
},
{
sceneCode: '2',
sceneName: '正式'
}
// {
// sceneCode: '1',
// sceneName: '测试'
// },
// {
// sceneCode: '2',
// sceneName: '正式'
// }
],
tableData: [
{
/* {
interfaceVersionId: '1',
version: '测试',
status: '1', // 0 删除 1更新修改 2发布 3 历史发布版本
......@@ -101,7 +101,7 @@ export default {
createTime: 1564455643252,
updateTime: 1564455643252,
publishTime: 1564455643252
}
} */
],
pageSize: 20,
currentPage: 1,
......@@ -164,7 +164,7 @@ export default {
defaultFlag: val ? '1' : '0',
interfaceVerionId: row.interfaceVerionId
};
getRequest('/gateway-manage/set-default-version', para)
getRequest('/gateway-manage/set-default-version-api', para)
.then(res => {
let resData = res.data;
if (resData.code == '0000') {
......@@ -190,6 +190,7 @@ export default {
},
hidePublishDialog() {
const that = this;
that.getData();
that.publishShow = false;
that.editRow = {};
},
......@@ -231,7 +232,7 @@ export default {
*/
handleEdit(index, row) {
const that = this;
that.$router.push(`/createApi?interfaceId=${that.$route.query.interfaceId}&interfaceName=${that.$route.query.interfaceName}&interfaceVersionId=${row.interfaceVersionId}`);
that.$router.push(`/createApi?projectId=${row.projectId}&interfaceGroupId=${row.interfaceGroupId}&interfaceId=${that.$route.query.interfaceId}&interfaceName=${that.$route.query.interfaceName}&interfaceVersionId=${row.interfaceVersionId}`);
},
/**
* 下线
......@@ -239,7 +240,7 @@ export default {
handleDown(index, row) {
const that = this;
that
.$confirm(`确认将【${row.version}】的【${that.$route.query.interfaceName}】API下线吗？`, '提示', {
.$confirm(`确认将【${row.version}】版本的【${that.$route.query.interfaceName}】API下线吗？`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
......@@ -252,13 +253,14 @@ export default {
postDownData(index, row) {
const that = this;
let para = {
interfaceVerionId: row.interfaceVerionId
interfaceVersionId: row.interfaceVersionId
};
getRequest('/gateway-manage/offline-api', para)
.then(res => {
let resData = res.data;
if (resData.code == '0000') {
showMsg.showmsg('下线成功', 'success');
that.getData();
return;
}
errMsg.errorMsg(resData);
......@@ -280,6 +282,10 @@ export default {
let resData = res.data;
if (resData.code == '0000') {
that.envOptions = resData.result || [];
if (resData.result.length) {
that.sceneCode = resData.result[0].sceneCode;
that.getData();
}
return;
}
errMsg.errorMsg(resData);
......@@ -303,11 +309,16 @@ export default {
sceneCode: that.sceneCode,
interfaceId: that.$route.query.interfaceId
};
getRequest('/gateway-manage/page-proxy', para)
getRequest('/gateway-manage/page-api-version-record', para)
.then(res => {
let resData = res.data;
if (resData.code == '0000') {
that.tableData = resData.result.result || [];
if (resData.result.result.length) {
resData.result.result.forEach(ele => {
ele.defaultFlag = ele.defaultFlag == 1 ? true : false;
});
}
that.totalCount = resData.result.totalCount;
return;
}
......@@ -320,6 +331,10 @@ export default {
});
});
}
},
mounted() {
const that = this;
that.getEnvData();
}
};
</script>
......
src/components/createApi/back-table-left.vue
......@@ -5,7 +5,7 @@ import backTableLeft from '@/components/createApi/back-table-left.vue';
-->
<template>
<div>
<template v-for="(itemValue, itemName, index) in itemData">
<template v-for="(itemValue, itemName, index) in itemData.properties">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%;table-layout: fixed;" :key="index + itemName + 121">
<tbody>
<tr class="el-table__row">
......@@ -16,7 +16,7 @@ import backTableLeft from '@/components/createApi/back-table-left.vue';
<div class="cell">{{ itemName }}</div>
</td>
<td rowspan="1" colspan="1" class="el-table_1_column_2">
<div class="cell">{{ itemValue.originType }}</div>
<div class="cell">{{ itemValue.frontOriginType }}</div>
</td>
<td rowspan="1" colspan="1" class="el-table_1_column_2">
<div class="cell">{{ itemValue.type }}</div>
......@@ -24,8 +24,8 @@ import backTableLeft from '@/components/createApi/back-table-left.vue';
</tr>
</tbody>
</table>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'array' && itemValue.items.properties.length" :itemData="itemValue.items.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'object' && itemValue.properties.length" :itemData="itemValue.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'array' && Object.keys(itemValue.items.properties).length" :itemData="itemValue.items" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row" style="padding-left: 10px;" v-if="itemValue.type == 'object' && Object.keys(itemValue.properties).length" :itemData="itemValue" :key="index + '122' + itemName"> </back-table-row>
</template>
</div>
</template>
......
src/components/createApi/back-table-right.vue
......@@ -5,7 +5,7 @@ import backTableRight from '@/components/createApi/back-table-right.vue';
-->
<template>
<div>
<template v-for="(itemValue, itemName, index) in itemData">
<template v-for="(itemValue, itemName, index) in itemData.properties">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%;table-layout: fixed;" :key="index + itemName + 121">
<tbody>
<tr class="el-table__row">
......@@ -13,13 +13,16 @@ import backTableRight from '@/components/createApi/back-table-right.vue';
<div v-if="itemValue.type == 'object' || itemValue.type == 'array'" class="cell"><i class="el-icon-minus"></i></div>
</td>
<td rowspan="1" colspan="1" class="el-table_1_column_1">
<div class="cell"><el-checkbox v-model="itemValue.isRootKey" :disabled="itemData.isRootKey" @change="changeCheck(itemValue, itemName)"></el-checkbox></div>
</td>
<td rowspan="1" colspan="1" class="el-table_1_column_1">
<div class="cell">
<el-input class="w-110" v-model="itemValue.currentkey" placeholder="请输入参数名"></el-input>
<el-input class="w-110" v-model="itemValue.rootKey" placeholder="请输入参数名" @blur="blurKey(itemValue, itemName)"></el-input>
</div>
</td>
<td v-if="interfaceType == '0'" rowspan="1" colspan="1" class="el-table_1_column_2">
<div class="cell">
<el-select v-model="itemValue.originType" placeholder="请选择参数类型">
<el-select v-model="itemValue.backendOriginType" placeholder="请选择参数位置">
<el-option label="header" value="header"></el-option>
<el-option label="query" value="query"></el-option>
<el-option label="body" value="body"></el-option>
......@@ -34,11 +37,21 @@ import backTableRight from '@/components/createApi/back-table-right.vue';
<el-input class="w-110" v-model="itemValue.defaultVal" placeholder="请输入参数值"></el-input>
</div>
</td>
<td v-if="interfaceType == '1'" rowspan="1" colspan="1" class="el-table_1_column_4">
<div class="cell">
<el-input class="w-110" v-model="itemValue.objectClass" placeholder="请输入包路径"></el-input>
</div>
</td>
<td v-if="interfaceType == '1'" rowspan="1" colspan="1" class="el-table_1_column_4">
<div class="cell">
<el-input class="w-110" v-model="itemValue.sort" placeholder="请输入排序"></el-input>
</div>
</td>
</tr>
</tbody>
</table>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'array'" :itemData="itemValue.items.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'object'" :itemData="itemValue.properties" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'array'" :itemData="itemValue.items" :key="index + '122' + itemName"> </back-table-row>
<back-table-row class="el-table__row child-row" v-if="itemValue.type == 'object'" :itemData="itemValue" :key="index + '122' + itemName"> </back-table-row>
</template>
</div>
</template>
......@@ -64,7 +77,35 @@ export default {
trData: {}
};
},
methods: {
/**
* key 输入变化
*/
blurKey(obj, oldKey) {
const that = this;
if (obj.currentKey != oldKey) {
that.$set(that.itemData.properties, obj.currentKey, obj);
that.$delete(that.itemData.properties, oldKey);
}
console.log(obj, that.itemData);
},
/**
* 改变checkbox
*/
changeCheck(obj, key) {
// const that = this;
if (obj.type == 'object' && Object.keys(obj.properties).length) {
for (let k in obj.properties) {
obj.properties[k].isRootKey = false;
}
}
if (obj.type == 'array' && Object.keys(obj.items.properties).length) {
for (let k in obj.items.properties) {
obj.items.properties[k].isRootKey = false;
}
}
}
},
watch: {
itemData: function(newData, oldData) {
const that = this;
......
src/components/createApi/body-param.vue
......@@ -11,7 +11,7 @@ import headerParam from '@/components/createApi/header-param.vue';
<tr class="el-table__row">
<td rowspan="1" colspan="1" class="el-table_1_column_1">
<div class="cell">
<el-input v-model="itemValue.currentKey"></el-input>
<el-input v-model="itemValue.currentKey" :disabled="itemValue.level == 2" @blur="blurKey(itemValue, itemName)"></el-input>
</div>
</td>
<td rowspan="1" colspan="1" class="el-table_1_column_2">
......@@ -67,7 +67,7 @@ export default {
return {};
}
},
originType: {
frontOriginType: {
type: String,
default() {
return '';
......@@ -82,6 +82,17 @@ export default {
},
methods: {
/**
* key 输入变化
*/
blurKey(obj, oldKey) {
const that = this;
if (obj.currentKey != oldKey) {
that.$set(that.itemData.properties, obj.currentKey, obj);
that.$delete(that.itemData.properties, oldKey);
}
console.log(obj, that.itemData);
},
/**
* 删除一项
*/
handleDel(parentKey, itemKey, index, level) {
......@@ -126,7 +137,8 @@ export default {
that.$set(obj, 'items', {
parentKey: itemKey, // 新增父级的 key
level: parseInt(level) + 1, // 层级
originType: that.originType, //来源类型 query,body,header
frontOriginType: that.frontOriginType, //来源类型 query,body,header
backendOriginType: that.frontOriginType,
type: 'string',
isBackendField: 0, //是否后端字段
defaultVal: 'val', //默认值
......@@ -157,7 +169,8 @@ export default {
that.$set(obj.items.properties, 'field' + length, {
parentKey: itemKey, // 新增父级的 key
level: parseInt(level) + 1, // 层级
originType: that.originType, // 来源类型 query,body,header
frontOriginType: that.frontOriginType, // 来源类型 query,body,header
backendOriginType: that.frontOriginType,
type: 'string',
currentKey: 'field' + length, // 当前的 key
isBackendField: 0, // 是否后端字段
......@@ -178,7 +191,8 @@ export default {
that.$set(obj.properties, 'field' + length, {
parentKey: itemKey, // 新增父级的 key
level: parseInt(level) + 1, // 层级
originType: that.originType, // 来源类型 query,body,header
frontOriginType: that.frontOriginType, // 来源类型 query,body,header
backendOriginType: that.frontOriginType,
type: 'string',
currentKey: 'field' + length, // 当前的 key
isBackendField: 0, // 是否后端字段
......
src/components/createApi/create-base.vue
......@@ -25,7 +25,7 @@ import createBase from '@/components/api/create-base.vue';
</el-select>
</el-form-item>
<el-form-item label="请求路径:" prop="interfaceUrl">
<el-input class="w-329" v-model="apiInfoData.interfaceUrl"></el-input>
<el-input class="w-329" v-model="apiInfoData.interfaceUrl" @blur="blurInterfaceUrl"></el-input>
</el-form-item>
<el-form-item label="描述:">
<limit-textarea :inputWidth="500" :inputValue.sync="apiInfoData.interfaceDescribe" :holder="''" :getByType="'word'" :maxLength="100"> </limit-textarea>
......@@ -39,6 +39,9 @@ import createBase from '@/components/api/create-base.vue';
<script>
import limitTextarea from '@/components/limit-textarea.vue';
import limitInput from '@/components/limit-input.vue';
import { getRequest } from '@/api/api';
import showMsg from '@/assets/js/showmsg';
import errMsg from '@/assets/js/error';
export default {
name: 'create-base',
components: {
......@@ -49,9 +52,11 @@ export default {
data() {
return {
apiInfoData: {
interfaceId: '',
interfaceVersionId: '',
interfaceName: '',
target: '1',
optType: 'GET',
optType: 'get',
interfaceUrl: '',
interfaceDescribe: ''
},
......@@ -66,18 +71,124 @@ export default {
const that = this;
that.$refs[formName].validate(valid => {
if (valid) {
that.$emit('submitNext', that.apiInfoData);
that.$store.dispatch('saveBaseInfo', that.apiInfoData);
that.blurInterfaceUrl(formName);
} else {
return false;
}
});
},
/**
* 请求路径查询
*/
blurInterfaceUrl(formName) {
const that = this;
let para = {
interfaceUrl: that.apiInfoData.interfaceUrl
};
getRequest('/gateway-manage/is-exist-interface-url', para)
.then(res => {
let resData = res.data;
if (resData.code == '0000') {
if (resData.result) {
showMsg.showmsg('接口已存在', 'warning');
return false;
}
if (formName == 'baseForm') {
that.$emit('submitNext', that.apiInfoData);
that.$store.dispatch('saveBaseInfo', that.apiInfoData);
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 处理数据存入 store
*/
handleFontData(data) {
const that = this;
let allData = JSON.parse(JSON.stringify(data));
let front = {
protocol: allData.protocol,
requestType: allData.requestType,
frontParams: {},
headerData: {},
queryData: {},
bodyJsonData: {},
bodyFormData: {}
};
that.$store.dispatch('saveFrontInfo', front);
},
/* handleBackData(data) {
const that = this;
let allData = JSON.parse(JSON.stringify(data));
that.$store.dispatch('saveBackInfo', that.apiInfoData);
}, */
handleResultData(data) {
const that = this;
let allData = JSON.parse(JSON.stringify(data));
let result = {
resultParams: allData.resultParams,
sucReturn: allData.sucReturn, // 成功返回示例
errReturn: allData.errReturn, // 失败返回示例
// 错误码
errCode: allData.errCode
};
that.$store.dispatch('saveResultInfo', result);
},
/**
* 获取数据
*/
getData() {
const that = this;
let para = {
interfaceId: that.$route.query.interfaceId,
interfaceVersionId: that.$route.query.interfaceVersionId
};
getRequest('/gateway-manage/get-api', para)
.then(res => {
let resData = res.data;
if (resData.code == '0000') {
resData.result.frontParams = JSON.parse(resData.result.frontParams);
resData.result.endParams = JSON.parse(resData.result.endParams);
resData.result.errCode = JSON.parse(resData.result.errCode);
resData.result.resultParams = JSON.parse(resData.result.resultParams);
that.apiInfoData.interfaceId = resData.result.interfaceId;
that.apiInfoData.interfaceVersionId = resData.result.interfaceVersionId;
that.apiInfoData.interfaceName = resData.result.interfaceName;
that.apiInfoData.target = String(resData.result.target);
that.apiInfoData.optType = resData.result.optType;
that.apiInfoData.interfaceUrl = resData.result.interfaceUrl;
that.apiInfoData.interfaceDescribe = resData.result.interfaceDescribe;
that.handleFontData(resData.result);
// that.handleBackData(resData.result);
that.handleResultData(resData.result);
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
mounted() {
const that = this;
/* eslint-disable */
console.log(that.$store);
if (that.$route.query.interfaceId) {
that.getData();
}
}
};
</script>
......
src/components/createApi/create-front.vue
......@@ -18,22 +18,22 @@ import createBase from '@/components/api/create-base.vue';
<div class="font-14 color-303133">header</div>
</el-form-item>
<el-form-item label="">
<header-param ref="frontHeaderTable" :itemData="frontData" :originType="'header'"></header-param>
<header-param ref="frontHeaderTable" :itemData="headerData" :frontOriginType="'header'"></header-param>
</el-form-item>
<el-form-item label="参数位置:">
<div class="font-14 color-303133">query</div>
</el-form-item>
<el-form-item label="">
<header-param ref="frontQueryTable" :itemData="frontData" :originType="'query'"></header-param>
<header-param ref="frontQueryTable" :itemData="queryData" :frontOriginType="'query'"></header-param>
</el-form-item>
<el-form-item v-if="apiInfoData.requestType == 'POST'" label="参数位置:">
<div class="font-14 color-303133">body</div>
<div class="font-14 color-303133">
<el-radio v-model="originType" label="json">json</el-radio>
<el-radio v-model="originType" label="form">form</el-radio>
<el-radio v-model="frontOriginType" label="json">json</el-radio>
<el-radio v-model="frontOriginType" label="form">form</el-radio>
</div>
</el-form-item>
<el-form-item v-if="apiInfoData.requestType == 'POST' && originType == 'json'" label="">
<el-form-item v-if="apiInfoData.requestType == 'POST' && frontOriginType == 'json'" label="">
<div class="body-param-wrap">
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition" style="width: 100%; table-layout: fixed;">
<div class="el-table__header-wrapper">
......@@ -67,14 +67,14 @@ import createBase from '@/components/api/create-base.vue';
</div>
<div class="el-table__body-wrapper is-scrolling-none">
<div class="table-content">
<body-param ref="frontBodyTable" :itemData="frontData" :originType="'body'" @refreshData="refreshData"></body-param>
<body-param ref="frontBodyJsonTable" :itemData="bodyJsonData" :frontOriginType="'body'" @refreshData="refreshData"></body-param>
</div>
</div>
</div>
</div>
</el-form-item>
<el-form-item v-if="apiInfoData.requestType == 'POST' && originType == 'form'" label="">
<header-param ref="frontQueryTable" :itemData="frontData" :originType="'form'"></header-param>
<el-form-item v-if="apiInfoData.requestType == 'POST' && frontOriginType == 'form'" label="">
<header-param ref="frontBodyFormTable" :itemData="bodyFormData" :frontOriginType="'body'"></header-param>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitback">上一步</el-button>
......@@ -99,20 +99,74 @@ export default {
data() {
return {
originType: 'body',
frontOriginType: 'json',
apiInfoData: {
protocol: 'http',
originType: 'header',
frontParams: {}
requestType: 'GET',
frontParams: {},
headerData: {},
queryData: {},
bodyJsonData: {},
bodyFormData: {}
},
frontData: {
// header
headerData: {
type: 'object',
level: 1,
properties: {
header: {
level: 2,
currentKey: 'header',
frontOriginType: 'header', //来源类型 query,body,header
backendOriginType: 'header',
type: 'string',
isBackendField: 0, //是否后端字段
defaultVal: 'val', //默认值
isRootKey: 0, //是否是后端参数字段
rootKey: '', //后端参数字段
objectClass: '', //如果是object 并且是dubbo
description: '描述',
example: '示例',
check: true,
properties: {}
}
},
required: []
},
// query
queryData: {
type: 'object',
level: 1,
properties: {
query: {
level: 2,
currentKey: 'query',
frontOriginType: 'query', // 来源类型 query,body,header
backendOriginType: 'query',
type: 'string',
isBackendField: 0, // 是否后端字段
defaultVal: 'val', // 默认值
isRootKey: 0, // 是否是后端参数字段
rootKey: '', // 后端参数字段
objectClass: '', // 如果是object 并且是dubbo
description: '描述',
example: '示例',
check: true,
properties: {}
}
},
required: []
},
// body
bodyJsonData: {
type: 'object',
level: 1,
properties: {
root: {
level: 2,
currentKey: 'root',
originType: 'header', //来源类型 query,body,header
frontOriginType: 'body', //来源类型 query,body,header
backendOriginType: 'body',
type: 'object',
isBackendField: 0, //是否后端字段
defaultVal: 'val', //默认值
......@@ -123,12 +177,36 @@ export default {
example: '示例',
check: true,
properties: {}
},
required: []
},
required: []
},
bodyFormData: {
type: 'object',
level: 1,
properties: {
root: {
level: 2,
currentKey: 'root',
frontOriginType: 'body', //来源类型 query,body,header
backendOriginType: 'body',
type: 'string',
isBackendField: 0, //是否后端字段
defaultVal: 'val', //默认值
isRootKey: 0, //是否是后端参数字段
rootKey: '', //后端参数字段
objectClass: '', //如果是object 并且是dubbo
description: '描述',
example: '示例',
check: true,
properties: {}
}
}
},
required: []
},
rules: {
interfaceName: [{ required: true, message: '请输入API名称', trigger: 'blur' }],
interfaceUrl: [{ required: true, message: '请输入请求路径', trigger: 'blur' }]
requestType: [{ required: true, message: '请选择请求方法', trigger: 'blur' }]
}
};
},
......@@ -138,24 +216,76 @@ export default {
// console.log('refreshData:', data);
that.frontData = data;
},
/**
* 上一步
*/
submitback() {
const that = this;
that.$emit('submitBack');
},
/**
* 下一步
*
*/
submitForm(formName) {
const that = this;
/* console.log('frontData:', that.frontData);
console.log('frontHeaderTable:', that.$refs.frontHeaderTable.trData);
console.log('frontQueryTable:', that.$refs.frontQueryTable.trData);
console.log('frontQueryTable:', that.$refs.frontBodyTable.trData); */
/* console.log('frontData:', that.frontData);*/
console.log('frontHeaderTable:', that.headerData, that.$refs.frontHeaderTable.trData);
console.log('frontQueryTable:', that.queryData, that.$refs.frontQueryTable.trData);
// console.log('frontbodyJsonTable:', that.bodyJsonData, that.$refs.frontBodyJsonTable.trData);
// console.log('frontbodyFormTable:', that.bodyFormData, that.$refs.frontBodyFormTable.trData);
that.$refs[formName].validate(valid => {
if (valid) {
that.$emit('submitNext', that.apiInfoData);
// that.$store.dispatch('saveFrontInfo', that.apiInfoData);
that.handleData();
} else {
return false;
}
});
},
handleData() {
const that = this;
if (that.apiInfoData.requestType == 'POST' && that.frontOriginType == 'json') {
if (Object.keys(that.bodyFormData.properties.root.properties).length) {
for (const key in that.bodyFormData.properties.root.properties) {
if (that.bodyFormData.properties.root.properties[key].check) {
that.bodyFormData.properties.root.required.push(key);
}
}
}
that.apiInfoData.bodyJsonData = that.bodyJsonData;
} else {
that.apiInfoData.bodyJsonData = {};
}
if (that.apiInfoData.requestType == 'POST' && that.frontOriginType == 'form') {
if (Object.keys(that.bodyFormData.properties).length) {
for (const key in that.bodyFormData.properties) {
if (that.bodyFormData.properties[key].check) {
that.bodyFormData.required.push(key);
}
}
}
that.apiInfoData.bodyFormData = that.bodyFormData;
} else {
that.apiInfoData.bodyFormData = {};
}
if (Object.keys(that.headerData.properties).length) {
for (const key in that.headerData.properties) {
if (that.headerData.properties[key].check) {
that.headerData.required.push(key);
}
}
}
if (Object.keys(that.queryData.properties).length) {
for (const key in that.queryData.properties) {
if (that.queryData.properties[key].check) {
that.queryData.required.push(key);
}
}
}
that.apiInfoData.headerData = that.headerData;
that.apiInfoData.queryData = that.queryData;
that.$store.dispatch('saveFrontInfo', that.apiInfoData);
that.$emit('submitNext', that.apiInfoData);
}
},
mounted() {
......
src/components/createApi/header-param.vue
<!--
<header-param :itemData="itemData" :originType="originType"></header-param>
<header-param :itemData="itemData" :frontOriginType="frontOriginType"></header-param>
import headerParam from '@/components/createApi/header-param.vue';
-->
......@@ -37,13 +37,13 @@ import headerParam from '@/components/createApi/header-param.vue';
</div>
<div class="el-table__body-wrapper is-scrolling-none">
<div class="table-content">
<template v-for="(itemValue, itemName, index) in trData.properties">
<template v-for="(itemValue, itemName, index) in itemData.properties">
<table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%; table-layout: fixed;" :key="index + itemName + 121">
<tbody>
<tr class="el-table__row">
<td rowspan="1" colspan="1" class="el-table_1_column_1">
<div class="cell">
<el-input v-model="itemValue.currentKey"></el-input>
<el-input v-model="itemValue.currentKey" @blur="blurKey(itemValue, itemName)"></el-input>
</div>
</td>
<td rowspan="1" colspan="1" class="el-table_1_column_2">
......@@ -98,7 +98,7 @@ export default {
return {};
}
},
originType: {
frontOriginType: {
type: String,
default() {
return '';
......@@ -111,7 +111,7 @@ export default {
type: 'object',
properties: {
name: {
originType: this.originType, //来源类型 query,body,header
frontOriginType: this.frontOriginType, //来源类型 query,body,header
type: 'string',
currentKey: 'name',
isBackendField: 0, //是否后端字段
......@@ -129,18 +129,33 @@ export default {
};
},
methods: {
/**
* key 输入变化
*/
blurKey(obj, oldKey) {
const that = this;
if (obj.currentKey != oldKey) {
that.$set(that.itemData.properties, obj.currentKey, obj);
that.$delete(that.itemData.properties, oldKey);
}
console.log(obj, that.itemData);
},
/**
* 删除
*/
handleDel(obj, itemKey, index) {
const that = this;
// that.$emit('input', that.trData);
that.$delete(that.trData.properties, itemKey);
that.$delete(that.itemData.properties, itemKey);
},
toAddItem() {
const that = this;
// console.log(that.trData.properties);
let length = that.keyLength++;
// console.log(Object.keys(that.trData.properties), length, that.trData.properties);
that.$set(that.trData.properties, 'field' + length, {
originType: that.originType, //来源类型 query,body,header
that.$set(that.itemData.properties, 'field' + length, {
frontOriginType: that.frontOriginType, //来源类型 query,body,header
backendOriginType: that.frontOriginType,
type: 'string',
currentKey: 'field' + length,
isBackendField: 0, //是否后端字段
......
src/components/createApi/result-table.vue
......@@ -11,7 +11,7 @@ import resultTable from '@/components/createApi/result-table.vue';
<tr class="el-table__row">
<td rowspan="1" colspan="1" class="el-table_1_column_1">
<div class="cell">
<el-input v-model="itemValue.currentKey" @blur="blurKey(itemValue, itemName)"></el-input>
<el-input v-model="itemValue.currentKey" :disabled="itemValue.type == 'array' || itemValue.type == 'object'" @blur="blurKey(itemValue, itemName)"></el-input>
</div>
</td>
<td rowspan="1" colspan="1" class="el-table_1_column_2">
......@@ -53,12 +53,6 @@ export default {
default() {
return {};
}
},
originType: {
type: String,
default() {
return '';
}
}
},
data() {
......@@ -73,17 +67,11 @@ export default {
*/
blurKey(obj, oldKey) {
const that = this;
if (obj.type == 'object' && Object.keys(obj.properties).length) {
for (let key in obj.properties) {
obj.properties[key].parentKey = obj.currentKey;
}
}
if (obj.type == 'array' && Object.keys(obj.items.properties).length) {
for (let key in obj.items.properties) {
obj.items.properties[key].parentKey = obj.currentKey;
}
if (obj.currentKey != oldKey) {
that.$set(that.itemData.properties, obj.currentKey, obj);
that.$delete(that.itemData.properties, oldKey);
}
console.log(obj);
console.log(obj, that.itemData);
},
/**
* 更新参数名字段
......@@ -155,16 +143,10 @@ export default {
that.$set(obj, 'items', {
parentKey: itemKey, // 新增父级的 key
level: parseInt(level) + 1, // 层级
originType: that.originType, //来源类型 query,body,header
type: 'string',
isBackendField: 0, //是否后端字段
defaultVal: 'val', //默认值
isRootKey: 0, //是否是后端参数字段
rootKey: '', //后端参数字段
objectClass: '', //如果是object 并且是dubbo
description: '描述',
example: '示例',
check: true,
properties: {}
});
}
......@@ -186,17 +168,11 @@ export default {
that.$set(obj.items.properties, 'field' + length, {
parentKey: itemKey, // 新增父级的 key
level: parseInt(level) + 1, // 层级
originType: that.originType, // 来源类型 query,body,header
type: 'string',
currentKey: 'field' + length, // 当前的 key
isBackendField: 0, // 是否后端字段
defaultVal: 'val', // 默认值
isRootKey: 0, // 是否是后端参数字段
rootKey: '', // 后端参数字段
objectClass: '', // 如果是object 并且是dubbo
description: '描述',
example: '示例',
check: true,
properties: {}
});
that.$forceUpdate();
......@@ -207,17 +183,11 @@ export default {
that.$set(obj.properties, 'field' + length, {
parentKey: itemKey, // 新增父级的 key
level: parseInt(level) + 1, // 层级
originType: that.originType, // 来源类型 query,body,header
type: 'string',
currentKey: 'field' + length, // 当前的 key
isBackendField: 0, // 是否后端字段
defaultVal: 'val', // 默认值
isRootKey: 0, // 是否是后端参数字段
rootKey: '', // 后端参数字段
objectClass: '', // 如果是object 并且是dubbo
description: '描述',
example: '示例',
check: true,
properties: {}
});
// console.log(that.trData);
......
src/store/store.js
......@@ -12,7 +12,8 @@ export default new Vuex.Store({
bgHeight: window.screen.availHeight - 440 - 24 + 'px',
baseInfo: {}, // 基础信息
frontInfo: {}, // 前端配置
backInfo: {} // 后端配置
backInfo: {}, // 后端配置
resultInfo: {} // 返回结果配置
},
mutations: {
[types.LOGIN]: (state, data) => {
......@@ -49,10 +50,14 @@ export default new Vuex.Store({
saveBack: (state, data) => {
state.backInfo = data;
},
saveResult: (state, data) => {
state.resultInfo = data;
},
clearData: state => {
state.baseInfo = {};
state.frontInfo = {};
state.backInfo = {};
state.resultInfo = {};
}
},
actions: {
......@@ -71,6 +76,9 @@ export default new Vuex.Store({
saveBackInfo(context, data) {
context.commit('saveBack', data);
},
saveResultInfo(context, data) {
context.commit('saveResult', data);
},
clearApiData(context, data) {
context.commit('clearData');
}
......
src/views/index/apiList.vue
......@@ -85,7 +85,7 @@ export default {
projectId: this.$route.query.projectId || '',
interfaceGroupId: this.$route.query.interfaceGroupId || '',
searchValue: '',
targetType: '',
targetType: '0',
targetTypeOptions: [
{
value: '0',
......
src/views/index/createApi.vue
......@@ -43,7 +43,6 @@ import createBase from '@/components/createApi/create-base.vue';
import createFront from '@/components/createApi/create-front.vue';
import createBackend from '@/components/createApi/create-backend.vue';
import createResult from '@/components/createApi/create-result.vue';
import { getRequest } from '@/api/api';
export default {
name: 'createApi',
components: {
......@@ -93,54 +92,23 @@ export default {
},
methods: {
/**
* 基础信息下一步
* 下一步
*/
submitNext() {
const that = this;
that.activeStep++;
},
/**
* 前端配置上一步
* 上一步
*/
submitBack() {
const that = this;
that.activeStep--;
},
/**
* 获取数据
*/
getData() {
const that = this;
let para = {
project: that.repProjectName,
router: that.pathName,
requestProject: that.repProjectName
};
getRequest('/haoban-manage-web/menu-detail', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (!resData.result) {
that.$message.error({
duration: 1000,
message: '暂无数据'
});
return;
}
return;
}
that.$message.error({
duration: 1000,
message: resData.message
});
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
// 上一步是基础配置，获取基础配置数据
// 上一步是前端配置，获取前端配置数据
// 上一步是后端配置，获取后端配置数据
}
},
watch: {
......
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