|
|
<!DOCTYPE html>
|
|
|
<html>
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<title>接口文档</title>
|
|
|
<link rel="stylesheet" href="https://cdn.bootcss.com/element-ui/2.4.0/theme-chalk/index.css">
|
|
|
<link rel="stylesheet" href="https://unpkg.com/ant-design-vue@1.4.10/dist/antd.min.css">
|
|
|
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/antd/2.13.11/antd.min.css"> -->
|
|
|
<script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.min.js"></script>
|
|
|
<script src="https://unpkg.com/ant-design-vue@1.4.10/dist/antd.min.js"></script>
|
|
|
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/antd/2.13.11/antd.min.js"></script> -->
|
|
|
<script src="https://cdn.bootcss.com/element-ui/2.4.0/index.js"></script>
|
|
|
<!-- <script src="https://unpkg.com/element-ui@2.4.0/lib/index.js"></script>-->
|
|
|
</head>
|
|
|
<body>
|
|
|
<div id="app">
|
|
|
<div>
|
|
|
<el-menu id="header" mode="horizontal">
|
|
|
<el-menu-item index="2" class="head-user-box">
|
|
|
<el-input placeholder="请输入搜索内容" icon="search" v-model="search"></el-input>
|
|
|
</el-menu-item>
|
|
|
<p class="logo-text">{{projectTitle}}</p>
|
|
|
<p class="logo-text2">{{title}}</p>
|
|
|
<!-- 版本 {{version}}
|
|
|
-->
|
|
|
</el-menu>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div class="app-menu left-menu" id="left-menu">
|
|
|
<el-tree ref="apiTree" highlight-current default-expand-all :data="reverseMenus" :props="defaultProps"
|
|
|
@current-change="checkChangeHandle" :filter-node-method="filterNode"
|
|
|
:node-key="node => node.id" :render-content="renderMenuContent"></el-tree>
|
|
|
</div>
|
|
|
<div id="main" v-if="currentApiAction != null" @click="hideTest">
|
|
|
<h2 class="action-title">{{currentApiAction.title}}</h2>
|
|
|
<span class="action-title2"> {{currentApiAction.name}}</span>
|
|
|
<div class="ant-row knife4j-api-post"><div class="knife4j-api-summary" v-if="currentApiAction.methods.length > 0">
|
|
|
<span class="knife4j-api-summary-method" v-for="m in currentApiAction.methods">{{m}}</span>
|
|
|
<span class="knife4j-api-summary-path" v-for="uri in currentApiAction.uris">{{uri}}</span></div></div>
|
|
|
<div class="return el-step__head is-finish">接口返回: <span class="el-step__head is-success">{{currentApiAction.returnDesc}}</span></div>
|
|
|
<div class="comment el-step__head is-finish">描述: <span class="el-step__head is-success">{{currentApiAction.description}}</span></div>
|
|
|
|
|
|
<el-collapse v-model="activeNames">
|
|
|
<el-collapse-item name="1">
|
|
|
<template slot="title">
|
|
|
<h2>请求参数 <i class="header-icon el-icon-edit"></i><span style="color: #F78080;"> {{currentApiAction.contentType}}</span></h2>
|
|
|
</template>
|
|
|
<a-table v-if="!currentApiAction.requestVoid" default-expand-all-rows :columns="reqcolumns" :data-source="reverseParam"
|
|
|
:row-key="genUnionTableKey" size="small" :pagination="false" >
|
|
|
<template slot="nameTemplate" slot-scope="text, record">
|
|
|
<span v-if="record.pathFlag">{{ text }}<span style="color: rgb(0, 100, 255);">（Path参数）</span></span>
|
|
|
<span v-else>{{ text }}</span>
|
|
|
</template>
|
|
|
<template slot="requireTemplate" slot-scope="text">
|
|
|
<span v-if="text" style="color:red">是</span>
|
|
|
<span v-else>否</span>
|
|
|
</template>
|
|
|
<template slot="typeTemplate" slot-scope="text">
|
|
|
<span :class="'knife4j-request-' + text">{{ text }}</span>
|
|
|
</template>
|
|
|
<template slot="datatypeTemplate" slot-scope="text, record">
|
|
|
<data-type :text="text" :record="record"></data-type>
|
|
|
</template>
|
|
|
</a-table>
|
|
|
<div class="api-title">参数示例。统一展示为json方便查看和转换，入参不一定是json！！！</div>
|
|
|
<pre class="knife4j-api-editor-show" v-html="formaterJson(currentApiAction.requestValue)"></pre>
|
|
|
</el-collapse-item>
|
|
|
|
|
|
<el-collapse-item name="2">
|
|
|
<template slot="title">
|
|
|
<h2>返回参数 <i class="header-icon el-icon-check"></i><span style="color: #F78080;"> {{currentApiAction.dataType}}</span></h2>
|
|
|
</template>
|
|
|
<a-table v-if="!currentApiAction.responseVoid" default-expand-all-rows :columns="rescolumns" :data-source="reverseResponse"
|
|
|
:row-key="genUnionTableKey" size="small" :pagination="false" >
|
|
|
<template slot="requireTemplate" slot-scope="text">
|
|
|
<span v-if="text" style="color:red">是</span>
|
|
|
<span v-else>否</span>
|
|
|
</template>
|
|
|
<template slot="typeTemplate" slot-scope="text">
|
|
|
<span :class="'knife4j-request-' + text">{{ text }}</span>
|
|
|
</template>
|
|
|
<template slot="datatypeTemplate" slot-scope="text, record">
|
|
|
<data-type :text="text" :record="record"></data-type>
|
|
|
</template>
|
|
|
</a-table>
|
|
|
<div class="api-title">参数示例。统一展示为json为了方便查看和转换，返回不一定是json！！！</div>
|
|
|
<pre class="knife4j-api-editor-show" v-html="formaterJson(currentApiAction.responseValue)"></pre>
|
|
|
</el-collapse-item>
|
|
|
|
|
|
<el-collapse-item name="3" v-if="currentApiAction.respbody != null">
|
|
|
<template slot="title">
|
|
|
<h2>返回例子 <i class="header-icon el-icon-view"></i></h2>
|
|
|
</template>
|
|
|
<pre>{{reverseRespbody}}</pre>
|
|
|
</el-collapse-item>
|
|
|
</el-collapse>
|
|
|
</div>
|
|
|
|
|
|
<div id="test" :class="testClassName" v-if="currentApiAction != null && isOnline" @click="showTest">
|
|
|
<h2>测试</h2>
|
|
|
<br/>
|
|
|
<div class="test-main">
|
|
|
<el-form ref="testForm" :model="testForm" label-width="120px" class="test-form">
|
|
|
|
|
|
<el-form-item v-if="currentApiAction.methods.length > 0" label="请求方式">
|
|
|
<el-radio-group v-model="request.type">
|
|
|
<el-radio v-for="m in currentApiAction.methods" :label="m">{{m}}</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item v-for="param in reverseParam" :label="param.name" :prop="param.name">
|
|
|
<el-input v-model="testForm[param.name]"></el-input>
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="onTest">测试</el-button>
|
|
|
<el-button @click="resetTestForm">重置</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
|
|
|
<h3>返回内容</h3>
|
|
|
<br/>
|
|
|
<div class="test-respbody">
|
|
|
<el-input ref="respbpdy" v-model="testRespbody" type="textarea" :rows="10" placeholder="返回内容..."></el-input>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
window.apis = {"title":"http://172.16.12.104:XXXX/没部署","apiModules":[{"description":"hive数据库任务","apiActions":[{"title":"拉取表数据","name":"class com.jiuyv.sptcc.agile.batch.syncJiushiData.controller.SyncDataReadTaskController.syncDataByTaskNo","simpleName":"syncDataByTaskNo","description":"默认拉取T-N这一天。.如果传了日期，则按日期拉取","docTags":[{"tagName":"@title","values":"拉取表数据"},{"tagName":"@param","paramName":"taskNo","paramDesc":"任务编码","require":true,"paramType":"String","values":"taskNo 任务编码"},{"tagName":"@param","paramName":"currDate","paramDesc":"日期(2022-01-02) ","require":false,"paramType":"String","values":"currDate 日期(2022-01-02) "}],"uris":["/batch/syncDay/{taskNo}"],"methods":["GET"],"params":[{"name":"taskNo","type":"String","require":true,"description":"任务编码","pathFlag":true},{"name":"currDate","type":"String","require":false,"description":"日期(2022-01-02) ","pathFlag":false}],"paramObjs":[],"returnObj":{"description":"","type":"Object","fieldInfos":[{"name":"code","type":"int","description":"应答码,默认200为成功","require":false,"defaultValue":false,"pathFlag":false},{"name":"data","type":"Object","description":"返回数据","require":false,"defaultValue":false,"pathFlag":false},{"name":"msg","type":"String","description":"应答描述","require":false,"defaultValue":false,"pathFlag":false}]},"respParam":[],"json":true,"dataType":"application/json","requestValue":"{\n \"currDate-日期(2022-01-02) | false\": null\n}","responseValue":"{\n \"code-应答码,默认200为成功 | false\": null, \n \"data-返回数据 | false\": {}, \n \"msg-应答描述 | false\": null\n}","requestVoid":false,"responseVoid":false,"requestListFlag":false,"responseListFlag":false,"pathFlag":true,"pathParams":[{"name":"taskNo","description":"任务编码","require":false,"defaultValue":false,"pathFlag":false}]},{"title":"拉取表历史数据","name":"class com.jiuyv.sptcc.agile.batch.syncJiushiData.controller.SyncDataReadTaskController.syncDataHisByTaskNo","simpleName":"syncDataHisByTaskNo","description":"不传开始日期则不会拉取,从日期开始之后直到T-N","docTags":[{"tagName":"@title","values":"拉取表历史数据"},{"tagName":"@param","paramName":"taskNo","paramDesc":"任务编码","require":true,"paramType":"String","values":"taskNo 任务编码"},{"tagName":"@param","paramName":"startDate","paramDesc":"开始日期(含自身, 2022-01-02)","require":true,"paramType":"String","values":"startDate 开始日期(含自身, 2022-01-02)"},{"tagName":"@param","paramName":"endDate","paramDesc":"结束日期(不含自身，2022-01-05) ","require":false,"paramType":"String","values":"endDate 结束日期(不含自身，2022-01-05) "}],"uris":["/batch/syncDayHis/{taskNo}"],"methods":["GET"],"params":[{"name":"taskNo","type":"String","require":true,"description":"任务编码","pathFlag":true},{"name":"endDate","type":"String","require":false,"description":"结束日期(不含自身，2022-01-05) ","pathFlag":false},{"name":"startDate","type":"String","require":true,"description":"开始日期(含自身, 2022-01-02)","pathFlag":false}],"paramObjs":[],"returnObj":{"description":"","type":"Object","fieldInfos":[{"name":"code","type":"int","description":"应答码,默认200为成功","require":false,"defaultValue":false,"pathFlag":false},{"name":"data","type":"Object","description":"返回数据","require":false,"defaultValue":false,"pathFlag":false},{"name":"msg","type":"String","description":"应答描述","require":false,"defaultValue":false,"pathFlag":false}]},"respParam":[],"json":true,"dataType":"application/json","requestValue":"{\n \"endDate-结束日期(不含自身，2022-01-05) | false\": null\n \"startDate-开始日期(含自身, 2022-01-02) | true\": null\n}","responseValue":"{\n \"code-应答码,默认200为成功 | false\": null, \n \"data-返回数据 | false\": {}, \n \"msg-应答描述 | false\": null\n}","requestVoid":false,"responseVoid":false,"requestListFlag":false,"responseListFlag":false,"pathFlag":true,"pathParams":[{"name":"taskNo","description":"任务编码","require":false,"defaultValue":false,"pathFlag":false}]}],"packagePath":"package com.jiuyv.sptcc.agile.batch.syncJiushiData.controller","className":"SyncDataReadTaskController"}],"projectTitle":"ZL接口文档-表同步任务"};
|
|
|
</script>
|
|
|
<script type="text/javascript">
|
|
|
window.Http = {};
|
|
|
Http.ajax = function(url, params, method) {
|
|
|
|
|
|
var config = {
|
|
|
method: method,
|
|
|
credentials: 'same-origin',
|
|
|
headers: {
|
|
|
'Content-Type': 'application/x-www-form-urlencoded'
|
|
|
},
|
|
|
cache: 'no-store'
|
|
|
};
|
|
|
|
|
|
var search = '';
|
|
|
if (params) {
|
|
|
for (var p in params) {
|
|
|
if (params[p] == null || typeof(params[p]) === 'undefined') {
|
|
|
delete params[p];
|
|
|
} else {
|
|
|
search += p + '=' + encodeURIComponent(params[p]) + '&';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (search) {
|
|
|
search = search.substr(0, search.length - 1);
|
|
|
|
|
|
if (method.toLocaleLowerCase() === 'get') {
|
|
|
if (url.indexOf('?') > 0) {
|
|
|
url += '&' + search;
|
|
|
} else {
|
|
|
url += '?' + search;
|
|
|
}
|
|
|
} else {
|
|
|
config.body = search;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return new Promise(function (resolve, reject) {
|
|
|
fetch(url, config).then(function (response) {
|
|
|
return response.text();
|
|
|
}).then(function (data) {
|
|
|
resolve(data);
|
|
|
}).catch(function (e) {
|
|
|
reject(e);
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 发起Post请求
|
|
|
*
|
|
|
* @param {String} url 请求地址
|
|
|
* @param {object} params 请求参数
|
|
|
*/
|
|
|
Http.Post = function(url, params) {
|
|
|
return Http.ajax(url, params, 'POST');
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 发起Get请求
|
|
|
*
|
|
|
* @param {String} url 请求地址
|
|
|
* @param {Object} params 请求参数
|
|
|
*/
|
|
|
Http.Get = function(url, params) {
|
|
|
return Http.ajax(url, params, 'GET');
|
|
|
}
|
|
|
|
|
|
|
|
|
const requestcolumns = [
|
|
|
{
|
|
|
title: "参数名称",
|
|
|
dataIndex: "name",
|
|
|
scopedSlots: { customRender: "nameTemplate" },
|
|
|
width: "30%"
|
|
|
},
|
|
|
{
|
|
|
title: "数据类型",
|
|
|
dataIndex: "type",
|
|
|
scopedSlots: { customRender: "datatypeTemplate" },
|
|
|
width: "20%"
|
|
|
},
|
|
|
{
|
|
|
title: "是否必须",
|
|
|
dataIndex: "require",
|
|
|
scopedSlots: { customRender: "requireTemplate" },
|
|
|
width: "90px"
|
|
|
},{
|
|
|
title: "参数说明",
|
|
|
dataIndex: "description",
|
|
|
|
|
|
}
|
|
|
];
|
|
|
const responsecolumns = [
|
|
|
{
|
|
|
title: "参数名称",
|
|
|
dataIndex: "name",
|
|
|
width: "30%"
|
|
|
},
|
|
|
{
|
|
|
title: "类型",
|
|
|
dataIndex: "type",
|
|
|
scopedSlots: { customRender: "datatypeTemplate" },
|
|
|
width: "20%"
|
|
|
},
|
|
|
{
|
|
|
title: "参数说明",
|
|
|
dataIndex: "description",
|
|
|
}
|
|
|
];
|
|
|
//dataType组件
|
|
|
var dataType={
|
|
|
name: "DataType",
|
|
|
props: {
|
|
|
text: {
|
|
|
type: String,
|
|
|
required: true
|
|
|
},
|
|
|
record: {
|
|
|
type: Object,
|
|
|
required: true
|
|
|
}
|
|
|
},
|
|
|
data:function(){
|
|
|
return {
|
|
|
validators: []
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.intiValidator();
|
|
|
},
|
|
|
methods: {
|
|
|
intiValidator() {
|
|
|
var that = this;
|
|
|
const record = this.record;
|
|
|
if (record.validateInstance != null) {
|
|
|
var len = that.getJsonKeyLength(record.validateInstance);
|
|
|
var _size = 0;
|
|
|
for (var k in record.validateInstance) {
|
|
|
var str = k + ":" + record.validateInstance[k];
|
|
|
that.validators.push({ key: k, val: str });
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
getJsonKeyLength(json) {
|
|
|
var size = 0;
|
|
|
if (json != null) {
|
|
|
for (var key in json) {
|
|
|
if (json.hasOwnProperty(key)) size++;
|
|
|
}
|
|
|
}
|
|
|
return size;
|
|
|
}
|
|
|
},
|
|
|
template:'<div><span v-if="!record.validateStatus">{{text}}</span><span v-else class="knife4j-request-validate-jsr"><a-tooltip placement="right"><template slot="title"><div v-for="pt in validators" :key="pt.key">{{pt.val}}</div></template>{{text}}</a-tooltip></span></div>'
|
|
|
}
|
|
|
</script>
|
|
|
<script>
|
|
|
new Vue({
|
|
|
el: '#app',
|
|
|
components:{
|
|
|
"DataType":dataType
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
search: '',
|
|
|
activeNames: ['1', '2', '3'],
|
|
|
radio2: '1',
|
|
|
testRespbody: '',
|
|
|
apiModules: [],
|
|
|
testForm : {},
|
|
|
isOnline : true,
|
|
|
testClassName : 'test-off',
|
|
|
defaultProps: {
|
|
|
children: 'children',
|
|
|
label: 'label'
|
|
|
},
|
|
|
request : {
|
|
|
type : 'GET'
|
|
|
},
|
|
|
title : 'http://127.0.0.1:8080',
|
|
|
version: 'v1.0',
|
|
|
projectTitle: "接口文档",
|
|
|
currentApiModule: null,
|
|
|
currentApiAction: null,
|
|
|
reqcolumns: requestcolumns,
|
|
|
rescolumns: responsecolumns,
|
|
|
}
|
|
|
},
|
|
|
|
|
|
mounted() {
|
|
|
if (!window.apis) {
|
|
|
var self = this;
|
|
|
fetch('apis').then(function(response) {
|
|
|
return response.json();
|
|
|
}).then(function(data) {
|
|
|
if (typeof(data) == 'string') {//兼容后端返回数据出问题
|
|
|
data = JSON.parse(data);
|
|
|
}
|
|
|
self.fullData(data);
|
|
|
}).catch(function(e) {
|
|
|
self.$message.error('系统错误,请求api列表 接口失败');
|
|
|
});
|
|
|
} else {
|
|
|
this.isOnline = false;
|
|
|
this.fullData(window.apis);
|
|
|
}
|
|
|
},
|
|
|
|
|
|
computed: {
|
|
|
reverseMenus() {
|
|
|
var menu = [];
|
|
|
var id = 1;
|
|
|
for (var i = 0; i < this.apiModules.length; i++) {
|
|
|
var apiModule = this.apiModules[i];
|
|
|
|
|
|
var children = [];
|
|
|
|
|
|
for (var j = 0; j < apiModule.apiActions.length; j++) {
|
|
|
var apiAction = apiModule.apiActions[j];
|
|
|
apiAction.id = id++;//赋值一个ID
|
|
|
children.push({
|
|
|
label: apiAction.title,
|
|
|
id: apiAction.id,
|
|
|
data: apiAction
|
|
|
});
|
|
|
}
|
|
|
|
|
|
var item = {
|
|
|
label: apiModule.description,
|
|
|
children: children,
|
|
|
//data: apiAction
|
|
|
};
|
|
|
menu.push(item);
|
|
|
}
|
|
|
|
|
|
return menu;
|
|
|
},
|
|
|
|
|
|
reverseParam() {
|
|
|
if (this.currentApiAction) {
|
|
|
var names = {};
|
|
|
var data = [];
|
|
|
this.testForm = {};
|
|
|
for (var i = 0; i < this.currentApiAction.params.length; i++) {
|
|
|
var par = this.currentApiAction.params[i];
|
|
|
data.push(par);
|
|
|
this.$set(this.testForm, par.name, '');//动态绑定监控
|
|
|
|
|
|
names[par.name] = par.name;
|
|
|
}
|
|
|
|
|
|
if (this.currentApiAction.paramObjs) {
|
|
|
for (var i = 0; i < this.currentApiAction.paramObjs.length; i++) {
|
|
|
var paramObj = this.currentApiAction.paramObjs[i];
|
|
|
if (!paramObj.fieldInfos) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
var handlerFunc=function(_this,paramObj,level){
|
|
|
var clevel=level;
|
|
|
for (var j = 0; j < paramObj.fieldInfos.length; j++) {
|
|
|
var fieldInfo = paramObj.fieldInfos[j];
|
|
|
if (names[fieldInfo.name]) {
|
|
|
//@param上已经有了,则不再使用@paramObj中的
|
|
|
continue;
|
|
|
}
|
|
|
data.push(fieldInfo);
|
|
|
}
|
|
|
};
|
|
|
var _this=this;
|
|
|
handlerFunc(_this,paramObj,1);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return data;
|
|
|
}
|
|
|
},
|
|
|
|
|
|
reverseResponse() {
|
|
|
var names = {};
|
|
|
|
|
|
var data = [];
|
|
|
|
|
|
if (this.currentApiAction && this.currentApiAction.respParam && this.currentApiAction.respParam.length > 0) {
|
|
|
for (var i = 0; i < this.currentApiAction.respParam.length; i++) {
|
|
|
var par = this.currentApiAction.respParam[i];
|
|
|
names[par.name] = par.name;
|
|
|
data.push(par);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (this.currentApiAction && this.currentApiAction.returnObj) {
|
|
|
|
|
|
for (var i = 0; i < this.currentApiAction.returnObj.fieldInfos.length; i++) {
|
|
|
var par = this.currentApiAction.returnObj.fieldInfos[i];
|
|
|
|
|
|
if (names[par.name] != null) {
|
|
|
//已经有@resp注解进行了覆盖,就不再采纳@return中的
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
data.push(par);
|
|
|
}
|
|
|
}
|
|
|
return data;
|
|
|
},
|
|
|
|
|
|
reverseRespbody() {
|
|
|
if (this.currentApiAction && this.currentApiAction.respbody) {
|
|
|
try {
|
|
|
var obj = JSON.parse(this.currentApiAction.respbody);
|
|
|
return JSON.stringify(obj, null, 4);
|
|
|
} catch(e) {
|
|
|
|
|
|
}
|
|
|
return this.currentApiAction.respbody;
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
fullData(data) {
|
|
|
if (data && data.title != null) {
|
|
|
this.title = data.title;
|
|
|
}
|
|
|
if (data && data.version != null) {
|
|
|
this.version = data.version;
|
|
|
}
|
|
|
if (data && data.projectTitle != null) {
|
|
|
this.projectTitle = data.projectTitle;
|
|
|
}
|
|
|
this.apiModules = data.apiModules;
|
|
|
if (this.apiModules.length > 0 && this.apiModules[0].apiActions.length > 0) {
|
|
|
this.currentApiModule = this.apiModules[0];
|
|
|
this.currentApiAction = this.apiModules[0].apiActions[0];
|
|
|
if (this.currentApiAction.methods.length > 0) {
|
|
|
this.request.type = this.currentApiAction.methods[0];
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
|
|
|
checkChangeHandle(data, checked, indeterminate) {
|
|
|
var array = this.findModuleAndActionById(data.id);
|
|
|
if (array) {
|
|
|
this.currentApiModule = array[0];
|
|
|
this.currentApiAction = array[1];
|
|
|
if (this.currentApiAction.methods.length > 0) {
|
|
|
this.request.type = this.currentApiAction.methods[0];
|
|
|
} else {
|
|
|
this.request.type = 'get';
|
|
|
}
|
|
|
this.resetTestForm();
|
|
|
}
|
|
|
},
|
|
|
|
|
|
findModuleAndActionById(id) {
|
|
|
for (var i = 0; i < this.apiModules.length; i++) {
|
|
|
var apiModule = this.apiModules[i];
|
|
|
|
|
|
for (var j = 0; j < apiModule.apiActions.length; j++) {
|
|
|
if (apiModule.apiActions[j].id == id) {
|
|
|
return [apiModule, apiModule.apiActions[j]]
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
|
|
|
filterNode(value, data) {
|
|
|
if (!value) return true;
|
|
|
return data.label.toLowerCase().indexOf(value.toLowerCase()) !== -1
|
|
|
|| (data.url && data.url.toLowerCase().indexOf(value.toLowerCase()) !== -1);
|
|
|
},
|
|
|
|
|
|
showTest() {
|
|
|
this.testClassName = 'test-on';
|
|
|
},
|
|
|
|
|
|
hideTest() {
|
|
|
this.testClassName = 'test-off';
|
|
|
},
|
|
|
|
|
|
rebuild() {
|
|
|
window.location = 'rebuild.html';
|
|
|
},
|
|
|
|
|
|
resetTestForm() {
|
|
|
if (this.$refs.testForm) {
|
|
|
this.$refs.testForm.resetFields();
|
|
|
}
|
|
|
},
|
|
|
|
|
|
onTest() {
|
|
|
var self = this;
|
|
|
|
|
|
var uri = '';
|
|
|
|
|
|
if (this.currentApiAction.uris.length > 0) {
|
|
|
uri += '/' + this.currentApiAction.uris[0];
|
|
|
}
|
|
|
var requestType = this.request.type.toLocaleLowerCase();
|
|
|
|
|
|
console.log('请求方式:', requestType, '请求数据:', this.testForm);
|
|
|
|
|
|
Http.ajax(uri, this.testForm, requestType).then((data) => {
|
|
|
self.testRespbody = data;
|
|
|
}).catch((e) => {
|
|
|
console.log(e);
|
|
|
window.resp = e;
|
|
|
self.$message.error('系统错误:' + e);
|
|
|
});
|
|
|
},
|
|
|
addBlankFunc(row){
|
|
|
if(row.level&&row.level>1){
|
|
|
var str=row.name;
|
|
|
for(var ri=1; ri<row.level; ri++){
|
|
|
str = " "+row.name;
|
|
|
}
|
|
|
return str;
|
|
|
}
|
|
|
return row.name;
|
|
|
},
|
|
|
genUnionTableKey() {
|
|
|
var key="param"+new Date().getTime().toString() + Math.floor(Math.random() * 1000000).toString();
|
|
|
return key;
|
|
|
},
|
|
|
formaterJson(json) {
|
|
|
try {
|
|
|
if (typeof json != "string") {
|
|
|
json = JSON.stringify(json, undefined, 2);
|
|
|
}
|
|
|
json = json
|
|
|
.replace(/&/g, "&")
|
|
|
.replace(/</g, "<")
|
|
|
.replace(/>/g, ">");
|
|
|
return json.replace(
|
|
|
/("(\u[a-zA-Z0-9]{4}|\[^u]|[^\"])*"(s*:)?|(true|false|null)|-?d+(?:.d*)?(?:[eE][+-]?d+)?)/g,
|
|
|
function(match) {
|
|
|
var cls = "number";
|
|
|
if (/^"/.test(match)) {
|
|
|
if (/:$/.test(match)) {
|
|
|
cls = "key";
|
|
|
} else {
|
|
|
cls = "string";
|
|
|
}
|
|
|
} else if (/true|false/.test(match)) {
|
|
|
cls = "boolean";
|
|
|
} else if (/null/.test(match)) {
|
|
|
cls = "null";
|
|
|
}
|
|
|
var marr=match.substring(1,match.length-2).split("-");
|
|
|
return '<span class="' + cls + '">\"' + marr[0] + '\":<span class="json-title">'+marr[1]+'</span></span>';
|
|
|
}
|
|
|
);
|
|
|
} catch (error) {
|
|
|
return json;
|
|
|
}
|
|
|
},
|
|
|
renderMenuContent(h, { node }) {
|
|
|
node.data.url="";
|
|
|
var str="";
|
|
|
var data =node.data.data;
|
|
|
if(data){
|
|
|
try{
|
|
|
if(data && data.uris){
|
|
|
str= " "+data.uris[0];
|
|
|
node.data.url=data.uris[0];
|
|
|
}
|
|
|
}catch(b){
|
|
|
}
|
|
|
}
|
|
|
// return h('span', { attrs: { title: node.label+str } }, node.label+str);
|
|
|
return h('span', { attrs: { title: node.label+str,style:"font-size: 14px;" } },[node.label,
|
|
|
h('div', { attrs: { title: node.label+str ,style:"color:#0270e6;font-size: 10px;" } }, str)
|
|
|
]);
|
|
|
}
|
|
|
},
|
|
|
watch : {
|
|
|
search(val) {
|
|
|
this.$refs.apiTree.filter(val);
|
|
|
},
|
|
|
}
|
|
|
})
|
|
|
</script>
|
|
|
</body>
|
|
|
|
|
|
<style>
|
|
|
* {
|
|
|
padding: 0;
|
|
|
margin: 0;
|
|
|
font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;
|
|
|
}
|
|
|
|
|
|
.logo-text {
|
|
|
float: left;
|
|
|
height: 60px;
|
|
|
color: #333;
|
|
|
line-height: 60px;
|
|
|
padding-left: 32px;
|
|
|
font-size: 22px;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
.logo-text2 {
|
|
|
float: left;
|
|
|
height: 60px;
|
|
|
color: #666;
|
|
|
font-size: 18px;
|
|
|
line-height: 60px;
|
|
|
padding-left: 32px;
|
|
|
}
|
|
|
.left-menu {
|
|
|
width: 300px;
|
|
|
border-right: solid 2px #EAEDF1;
|
|
|
display: block;
|
|
|
position: fixed;
|
|
|
bottom: 0px;
|
|
|
z-index: 102;
|
|
|
top: 60px;
|
|
|
padding-top: 7px;
|
|
|
overflow-x: hidden;
|
|
|
}
|
|
|
|
|
|
#header {
|
|
|
height: 60px;
|
|
|
z-index: 200;
|
|
|
}
|
|
|
|
|
|
#header .head-user-box {
|
|
|
width:300px;border-right: solid 2px #EAEDF1;
|
|
|
}
|
|
|
|
|
|
.el-tree {
|
|
|
border: 0px solid #d1dbe5
|
|
|
}
|
|
|
|
|
|
#main {
|
|
|
left: 303px;
|
|
|
padding: 20px 70px 0 20px;
|
|
|
width: auto;
|
|
|
position: absolute;
|
|
|
top: 60px;
|
|
|
bottom: 0px;
|
|
|
right: 0px;
|
|
|
overflow: auto;
|
|
|
}
|
|
|
|
|
|
#main .comment, .uri, .return {
|
|
|
padding: 5px;
|
|
|
}
|
|
|
|
|
|
#test {
|
|
|
right: 0px;
|
|
|
padding: 20px 20px;
|
|
|
position: absolute;
|
|
|
top: 60px;
|
|
|
bottom: 0px;
|
|
|
overflow: auto;
|
|
|
background-color:#FFF;
|
|
|
border-left : 2px solid #eef1f6;
|
|
|
transition:all .2s ease;
|
|
|
-webkit-transition:all .2s ease;
|
|
|
z-index : 1;
|
|
|
}
|
|
|
|
|
|
.test-off {
|
|
|
width : 20px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
|
|
|
.test-on {
|
|
|
width : 800px;
|
|
|
cursor: auto;
|
|
|
}
|
|
|
|
|
|
.test-off .test-main {
|
|
|
display : none;
|
|
|
}
|
|
|
|
|
|
.test-on .test-main {
|
|
|
display : auto;
|
|
|
}
|
|
|
|
|
|
.test-form {
|
|
|
width : 80%;
|
|
|
}
|
|
|
|
|
|
.test-respbody {
|
|
|
padding-left : 50px;
|
|
|
width : 700px;
|
|
|
}
|
|
|
|
|
|
.action-title {
|
|
|
/* background: #EEE; */
|
|
|
height: 50px;
|
|
|
line-height: 50px;
|
|
|
padding-left: 10px;
|
|
|
border-radius: 4px;
|
|
|
font-size: 30px;
|
|
|
color: #3898FF;
|
|
|
font-weight: bold;
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
.action-title2{
|
|
|
font-size: 10px;
|
|
|
color: #929292;
|
|
|
}
|
|
|
.el-table .cell {
|
|
|
line-height: 14px;
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
.el-icon-arrow-down {
|
|
|
color: #3464F2;
|
|
|
font-size: 14px;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
.el-table thead {
|
|
|
font-weight: 500;
|
|
|
color: #393434;
|
|
|
}
|
|
|
</style>
|
|
|
|
|
|
<style>
|
|
|
|
|
|
.content-line {
|
|
|
height: 25px;
|
|
|
line-height: 25px;
|
|
|
}
|
|
|
.content-line-count {
|
|
|
height: 35px;
|
|
|
line-height: 35px;
|
|
|
}
|
|
|
.title {
|
|
|
margin-top: 25px;
|
|
|
}
|
|
|
.knife4j-description {
|
|
|
/* width: 90%;
|
|
|
margin: 15px auto; */
|
|
|
margin-top: 5px;
|
|
|
}
|
|
|
.divider {
|
|
|
margin: 4px 0;
|
|
|
}
|
|
|
.divider-count {
|
|
|
margin: 8px 0;
|
|
|
}
|
|
|
.knife4j-document {
|
|
|
margin-top: 30px;
|
|
|
}
|
|
|
.api-tab {
|
|
|
margin-top: 15px;
|
|
|
}
|
|
|
.ant-tag {
|
|
|
height: 32px;
|
|
|
line-height: 32px;
|
|
|
}
|
|
|
.knife4j-menu-api-deprecated {
|
|
|
text-decoration: line-through;
|
|
|
}
|
|
|
|
|
|
.knife4j-api-title {
|
|
|
margin-top: 10px;
|
|
|
margin-bottom: 5px;
|
|
|
font-size: 16px;
|
|
|
font-weight: 600;
|
|
|
color: #616368;
|
|
|
height: 35px;
|
|
|
line-height: 35px;
|
|
|
}
|
|
|
.knife4j-api-row {
|
|
|
height: 45px;
|
|
|
line-height: 45px;
|
|
|
}
|
|
|
|
|
|
.knife4j-api-summary {
|
|
|
border-color: #49cc90;
|
|
|
display: -webkit-box;
|
|
|
display: -ms-flexbox;
|
|
|
display: flex;
|
|
|
-webkit-box-align: center;
|
|
|
-ms-flex-align: center;
|
|
|
align-items: center;
|
|
|
padding: 2px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
.knife4j-api-summary-method {
|
|
|
font-size: 14px;
|
|
|
font-weight: 700;
|
|
|
min-width: 80px;
|
|
|
padding: 6px 15px;
|
|
|
text-align: center;
|
|
|
border-radius: 3px;
|
|
|
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
|
|
|
font-family: Titillium Web, sans-serif;
|
|
|
color: #fff;
|
|
|
}
|
|
|
.knife4j-api-summary-path {
|
|
|
font-size: 14px;
|
|
|
display: flex;
|
|
|
-webkit-box-flex: 0;
|
|
|
-ms-flex: 0 3 auto;
|
|
|
flex: 0 3 auto;
|
|
|
-webkit-box-align: center;
|
|
|
-ms-flex-align: center;
|
|
|
align-items: center;
|
|
|
word-break: break-all;
|
|
|
padding: 0 32px;
|
|
|
}
|
|
|
|
|
|
.knife4j-api-post {
|
|
|
border-color: #49cc90;
|
|
|
background: rgba(73, 204, 144, 0.1);
|
|
|
}
|
|
|
.knife4j-api-post .knife4j-api-summary-method {
|
|
|
background: #49cc90;
|
|
|
}
|
|
|
|
|
|
.knife4j-api-get {
|
|
|
border-color: #61affe;
|
|
|
background: rgba(97, 175, 254, 0.1);
|
|
|
}
|
|
|
.knife4j-api-get .knife4j-api-summary-method {
|
|
|
background: #61affe;
|
|
|
}
|
|
|
.knife4j-api-head {
|
|
|
border-color: #9012fe;
|
|
|
background: rgba(144, 18, 254, 0.1);
|
|
|
}
|
|
|
.knife4j-api-head .knife4j-api-summary-method {
|
|
|
background: #9012fe;
|
|
|
}
|
|
|
.knife4j-api-put {
|
|
|
border-color: #fca130;
|
|
|
background: rgba(252, 161, 48, 0.1);
|
|
|
}
|
|
|
.knife4j-api-put .knife4j-api-summary-method {
|
|
|
background: #fca130;
|
|
|
}
|
|
|
.knife4j-api-delete {
|
|
|
border-color: #f93e3e;
|
|
|
background: rgba(249, 62, 62, 0.1);
|
|
|
}
|
|
|
.knife4j-api-delete .knife4j-api-summary-method {
|
|
|
background: #f93e3e;
|
|
|
}
|
|
|
.knife4j-api-options {
|
|
|
border-color: #0d5aa7;
|
|
|
background: rgba(13, 90, 167, 0.1);
|
|
|
}
|
|
|
.knife4j-api-options .knife4j-api-summary-method {
|
|
|
background: #0d5aa7;
|
|
|
}
|
|
|
.knife4j-api-patch {
|
|
|
border-color: #50e3c2;
|
|
|
background: rgba(80, 227, 194, 0.1);
|
|
|
}
|
|
|
.knife4j-api-patch .knife4j-api-summary-method {
|
|
|
background: #50e3c2;
|
|
|
}
|
|
|
#knife4jDoc ul{
|
|
|
padding-left: 10px;
|
|
|
list-style: none;
|
|
|
counter-reset: ordered;
|
|
|
}
|
|
|
|
|
|
#knife4jDoc ul li:before {
|
|
|
counter-increment: ordered;
|
|
|
content: counters(ordered,".")" ";
|
|
|
color:#1890ff;
|
|
|
}
|
|
|
.api-basic {
|
|
|
padding: 11px;
|
|
|
}
|
|
|
.api-basic-title {
|
|
|
font-size: 14px;
|
|
|
font-weight: 700;
|
|
|
}
|
|
|
.api-basic-body {
|
|
|
font-size: 14px;
|
|
|
font-family: -webkit-body;
|
|
|
}
|
|
|
.knife4j-api-editor-show {
|
|
|
margin: 15px 0;
|
|
|
font: 100 12px/18px monaco, andale mono, courier new;
|
|
|
padding: 10px 12px;
|
|
|
border: #ccc 1px solid;
|
|
|
border-left-width: 4px;
|
|
|
background-color: #fefefe;
|
|
|
box-shadow: 0 0 4px #eee;
|
|
|
word-break: break-all;
|
|
|
word-wrap: break-word;
|
|
|
color: #444;
|
|
|
width: 60%;
|
|
|
}
|
|
|
.knife4j-api-editor-show .string { color: green; } /*字符串的样式*/
|
|
|
.knife4j-api-editor-show .number { color: darkorange; } /*数字的样式*/
|
|
|
.knife4j-api-editor-show .boolean { color: blue; } /*布尔型数据的样式*/
|
|
|
.knife4j-api-editor-show .null { color: magenta; } /*null值的样式*/
|
|
|
.knife4j-api-editor-show .key { color: red; } /*key值的样式*/
|
|
|
.api-description {
|
|
|
border-left: 4px solid #ddd;
|
|
|
line-height: 30px;
|
|
|
}
|
|
|
.api-body-desc {
|
|
|
padding: 10px;
|
|
|
min-height: 35px;
|
|
|
box-sizing: border-box;
|
|
|
border: 1px solid #e8e8e8;
|
|
|
}
|
|
|
.ant-card-body {
|
|
|
padding: 5px;
|
|
|
}
|
|
|
.api-title {
|
|
|
margin-top: 10px;
|
|
|
margin-bottom: 5px;
|
|
|
font-size: 12px;
|
|
|
font-weight: 600;
|
|
|
height: 30px;
|
|
|
line-height: 30px;
|
|
|
border-left: 4px solid #00ab6d;
|
|
|
text-indent: 8px;
|
|
|
}
|
|
|
.content-line {
|
|
|
height: 25px;
|
|
|
line-height: 25px;
|
|
|
}
|
|
|
.content-line-count {
|
|
|
height: 35px;
|
|
|
line-height: 35px;
|
|
|
}
|
|
|
.divider {
|
|
|
margin: 4px 0;
|
|
|
}
|
|
|
.knife4j-doc-m{
|
|
|
position: fixed;
|
|
|
height: 500px;
|
|
|
width: 400px;
|
|
|
border: 1px solid #b7b4b4;
|
|
|
overflow-y: auto;
|
|
|
right: 12px;
|
|
|
top: 40px;
|
|
|
z-index: 9999;
|
|
|
background: #fcfafa;
|
|
|
}
|
|
|
.json-title{
|
|
|
float: right;
|
|
|
width: 100%;
|
|
|
text-align: right;
|
|
|
margin-top: -17px;
|
|
|
-webkit-user-select: none;
|
|
|
-moz-user-select: none;
|
|
|
-khtml-user-select: none;
|
|
|
-ms-user-select:none;
|
|
|
user-select:none;
|
|
|
}
|
|
|
.json-title:hover {
|
|
|
background-color: #EEE;
|
|
|
}
|
|
|
.el-tree-node__content {
|
|
|
height: 34px;
|
|
|
margin-bottom: 2px;
|
|
|
}
|
|
|
</style>
|
|
|
</html>
|
