|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
|
|
|
<title>OpenAPI definition</title>
|
|
|
|
|
<link rel="stylesheet" href="https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/ant-design-vue/1.7.8/antd.min.css" />
|
|
|
|
|
<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;
|
|
|
|
|
}
|
|
|
|
|
.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: 16px;
|
|
|
|
|
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;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="knife4jDocument" class="resume_preview_page" style="margin:10px auto;width:88%">
|
|
|
|
|
<div class="htmledit_views" >
|
|
|
|
|
<a-row>
|
|
|
|
|
<!--基础信息-->
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col :span="24">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<h2>{{instance.title}}</h2>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>简介</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.description" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>作者</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.contact" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>版本</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.version" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>host</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.host" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>basePath</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.basePath" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>服务Url</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.termsOfService" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>分组名称</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.name" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>分组url</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.url" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>分组location</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19"><span v-html="instance.location" /></a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-divider class="divider" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="knife4j-description">
|
|
|
|
|
<a-row class="content-line">
|
|
|
|
|
<a-col :span="5">
|
|
|
|
|
<h3>接口统计信息</h3>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="19">
|
|
|
|
|
<a-row class="content-line-count" v-for="param in instance.pathArrs" :key="param.method">
|
|
|
|
|
<a-col :span="3">
|
|
|
|
|
{{param.method}}
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="2">
|
|
|
|
|
<a-tag color="#108ee9">{{param.count}}</a-tag>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-divider class="divider-count" />
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
</div>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
|
|
|
|
|
<!--目录-->
|
|
|
|
|
<a-row id="knife4j-doc-m" class="knife4j-doc-m">
|
|
|
|
|
<a-row style="float: right;width: 57px;z-index: 10000;overflow: hidden;">
|
|
|
|
|
<a-button type="link" id="btnHide">隐藏</a-button>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-row v-if="hideShow" id="knife4jDoc">
|
|
|
|
|
<ul>
|
|
|
|
|
<li><a href="#knife4jDocument">主页</a></li>
|
|
|
|
|
<li v-for="tag in tags" :key="tag.name">
|
|
|
|
|
<a :href="'#'+tag.name">{{tag.name}}</a>
|
|
|
|
|
<ul>
|
|
|
|
|
<li v-for="c in tag.childrens" :key="c.id"><a :href="'#'+c.operationId">{{c.summary}}</a></li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-row>
|
|
|
|
|
<!--分组API信息-->
|
|
|
|
|
<!--遍历tags-->
|
|
|
|
|
<a-row v-for="tag in tags" :key="tag.name">
|
|
|
|
|
<h1 :id="tag.name">{{tag.name}}</h1>
|
|
|
|
|
<div class="knife4j-document" v-for="api in tag.childrens">
|
|
|
|
|
<!--接口基本信息-->
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-row :id="api.operationId" class="knife4j-api-title">
|
|
|
|
|
<span v-if="api.deprecated" class="knife4j-menu-api-deprecated">
|
|
|
|
|
{{ api.summary }}
|
|
|
|
|
</span>
|
|
|
|
|
<span v-else>
|
|
|
|
|
{{ api.summary }}
|
|
|
|
|
</span>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-row :class="'knife4j-api-' + api.methodType.toLowerCase()">
|
|
|
|
|
<div class="knife4j-api-summary">
|
|
|
|
|
<span class="knife4j-api-summary-method">{{ api.methodType }}</span>
|
|
|
|
|
<span class="knife4j-api-summary-path">{{ api.showUrl }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-row class="knife4j-api-row">
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col class="api-basic-title" :span="6">请求数据类型</a-col>
|
|
|
|
|
{{ api.consumes }}
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col class="api-basic-title" :span="6">响应数据类型</a-col>
|
|
|
|
|
{{ api.produces }}
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-row>
|
|
|
|
|
<div v-if="api.author">
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
开发者
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="api.author" v-html="api.author" class="api-body-desc"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<!--接口描述-->
|
|
|
|
|
<div v-if="api.description">
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
接口描述
|
|
|
|
|
</div>
|
|
|
|
|
<div
|
|
|
|
|
v-if="api.description"
|
|
|
|
|
v-html="api.description"
|
|
|
|
|
class="api-body-desc"
|
|
|
|
|
></div>
|
|
|
|
|
</div>
|
|
|
|
|
<!--请求示例-->
|
|
|
|
|
<div v-if="api.requestValue">
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
请求示例
|
|
|
|
|
</div>
|
|
|
|
|
<pre
|
|
|
|
|
class="knife4j-api-editor-show"
|
|
|
|
|
v-html="formaterJson(api.requestValue)"
|
|
|
|
|
></pre>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
请求参数
|
|
|
|
|
</div>
|
|
|
|
|
<a-table default-expand-all-rows :columns="columns" :data-source="api.reqParameters"
|
|
|
|
|
:row-key="genUnionTableKey"
|
|
|
|
|
size="small"
|
|
|
|
|
:pagination="page" >
|
|
|
|
|
<template slot="requireTemplate" slot-scope="text">
|
|
|
|
|
<span v-if="text" style="color:red">{{ text.toLocaleString() }}</span>
|
|
|
|
|
<span v-else>{{ text.toLocaleString() }}</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">
|
|
|
|
|
响应状态
|
|
|
|
|
</div>
|
|
|
|
|
<a-table
|
|
|
|
|
:columns="responseStatuscolumns"
|
|
|
|
|
:data-source="api.responseCodes"
|
|
|
|
|
row-key="code"
|
|
|
|
|
size="small"
|
|
|
|
|
:pagination="page"
|
|
|
|
|
>
|
|
|
|
|
<template slot="descriptionTemplate" slot-scope="text">
|
|
|
|
|
<div v-html="text"></div>
|
|
|
|
|
</template>
|
|
|
|
|
</a-table>
|
|
|
|
|
<!--响应参数-->
|
|
|
|
|
<!--响应参数需要判断是否存在多个code-schema的情况-->
|
|
|
|
|
<div v-if="api.multipartResponseSchema">
|
|
|
|
|
<!--多个响应编码code的情况在离线文档中需要单独遍历分开-->
|
|
|
|
|
<a-tabs v-for="resp in api.multipCodeDatas" :key="resp.code">
|
|
|
|
|
<a-tab-pane :tab="resp.code">
|
|
|
|
|
<!--判断响应头-->
|
|
|
|
|
<div v-if="resp.responseHeaderParameters">
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
响应Header
|
|
|
|
|
</div>
|
|
|
|
|
<a-table
|
|
|
|
|
:columns="responseHeaderColumns"
|
|
|
|
|
:data-source="resp.responseHeaderParameters"
|
|
|
|
|
row-key="id"
|
|
|
|
|
size="small"
|
|
|
|
|
:pagination="page"
|
|
|
|
|
>
|
|
|
|
|
</a-table>
|
|
|
|
|
</div>
|
|
|
|
|
<!--响应参数-->
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
响应参数
|
|
|
|
|
</div>
|
|
|
|
|
<a-table
|
|
|
|
|
:columns="responseParametersColumns"
|
|
|
|
|
:data-source="resp.data"
|
|
|
|
|
row-key="id"
|
|
|
|
|
size="small"
|
|
|
|
|
:pagination="page"
|
|
|
|
|
>
|
|
|
|
|
</a-table>
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
响应示例
|
|
|
|
|
</div>
|
|
|
|
|
<div class="api-editor-show" v-if="resp.responseBasicType">
|
|
|
|
|
{{ resp.responseText }}
|
|
|
|
|
</div>
|
|
|
|
|
<pre
|
|
|
|
|
class="knife4j-api-editor-show"
|
|
|
|
|
v-else
|
|
|
|
|
v-html="formaterJson(resp.responseValue)"
|
|
|
|
|
></pre>
|
|
|
|
|
<!-- <editor-show :value="resp.responseBasicType ? resp.responseText : resp.responseValue"></editor-show> -->
|
|
|
|
|
<!-- <editor :value="resp.responseBasicType ? resp.responseText : resp.responseValue" @init="multiResponseSampleEditorInit" lang="json" theme="eclipse" width="100%" :height="editorMultiHeight"></editor> -->
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
</a-tabs>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-else>
|
|
|
|
|
<!--判断响应头-->
|
|
|
|
|
<div v-if="api.responseHeaderParameters">
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
响应Header
|
|
|
|
|
</div>
|
|
|
|
|
<a-table
|
|
|
|
|
:columns="responseHeaderColumns"
|
|
|
|
|
:data-source="api.responseHeaderParameters"
|
|
|
|
|
row-key="id"
|
|
|
|
|
size="small"
|
|
|
|
|
:pagination="page"
|
|
|
|
|
>
|
|
|
|
|
</a-table>
|
|
|
|
|
</div>
|
|
|
|
|
<!--响应参数-->
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
响应参数
|
|
|
|
|
</div>
|
|
|
|
|
<a-table
|
|
|
|
|
:columns="responseParametersColumns"
|
|
|
|
|
:data-source="api.multipData.data"
|
|
|
|
|
row-key="id"
|
|
|
|
|
size="small"
|
|
|
|
|
:pagination="page"
|
|
|
|
|
>
|
|
|
|
|
</a-table>
|
|
|
|
|
<div class="api-title">
|
|
|
|
|
响应示例
|
|
|
|
|
</div>
|
|
|
|
|
<div class="api-editor-show" v-if="api.multipData.responseBasicType">
|
|
|
|
|
{{ api.multipData.responseText }}
|
|
|
|
|
</div>
|
|
|
|
|
<pre
|
|
|
|
|
class="knife4j-api-editor-show"
|
|
|
|
|
v-else
|
|
|
|
|
v-html="formaterJson(api.multipData.responseValue)"
|
|
|
|
|
></pre>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--接口遍历结束-->
|
|
|
|
|
</div>
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-row>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<script src="https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/vue/2.6.9/vue.js"></script>
|
|
|
|
|
|
|
|
|
|
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/ant-design-vue/1.7.8/antd.min.js"></script>
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
function getData(){
|
|
|
|
|
var datas={"instance":{"title":"OpenAPI definition","description":"OpenAPI definition","contact":"","version":"v0","host":"http://localhost:8888","basePath":"/","termsOfService":"","name":"default","url":"/v3/api-docs","location":"/v3/api-docs","pathArrs":[{"method":"PUT","count":5},{"method":"POST","count":11},{"method":"GET","count":5}]},"hideShow":true,"tags":[{"name":"admin-controller","description":null,"order":2147483647,"author":null,"childrens":[{"id":"8b3586a4f30ffbe54b7661fc3f9f00a0","operationId":"dropStudentOutCourse","deprecated":false,"summary":"dropStudentOutCourse","methodType":"PUT","showUrl":"/admin/dropStudentOutCourse","consumes":["application/x-www-form-urlencoded","application/json"],"produces":["*/*"],"author":null,"description":"","requestValue":"{\n \"student\": {\n \"studentId\": 0,\n \"name\": \"\",\n \"password\": \"\"\n },\n \"course\": {\n \"courseId\": 0,\n \"description\": \"\"\n }\n}","reqParameters":[{"name":"enrollRequest","children":[{"name":"student","children":[{"name":"studentId","children":null,"description":"","in":null,"require":false,"type":"integer","schemaValue":null},{"name":"name","children":null,"description":"","in":null,"require":false,"type":"string","schemaValue":null},{"name":"password","children":null,"description":"","in":null,"require":false,"type":"string","schemaValue":null}],"description":"","in":null,"require":false,"type":"StudentDTO","schemaValue":"StudentDTO"},{"name":"course","children":[{"name":"courseId","children":null,"description":"","in":null,"require":false,"type":"integer","schemaValue":null},{"name":"description","children":null,"description":"","in":null,"require":false,"type":"string","schemaValue":null}],"description":"","in":null,"require":false,"type":"CourseDTO","schemaValue":"CourseDTO"}],"description":"EnrollRequest","in":"body","require":true,"type":"EnrollRequest","schemaValue":"EnrollRequest"}],"responseCodes":[{"code":"200","description":"OK","schema":"ResultString"}],"multipartResponseSchema":false,"multipCodeDatas":[{"code":"200","responseHeaderParameters":null,"data":[{"name":"code","children":null,"description":"","id":"param12","type":"integer(int32)","schemaValue":"integer(int32)"},{"name":"msg","children":null,"description":"","id":"param13","type":"string","schemaValue":null},{"name":"data","children":null,"description":"","id":"param14","type":"string","schemaValue":null}],"responseBasicType":false,"responseText":null,"responseValue":"{\n\t\"code\": 0,\n\t\"msg\": \"\",\n\t\"data\": \"\"\n}"}],"responseHeaderParameters":null,"multipData":{"oas2":false,"code":"200","description":"OK","schema":"ResultString","schemaTitle":null,"refTreetableparameters":[],"responseCodes":[],"responseValue":"{\n\t\"code\": 0,\n\t\"msg\": \"\",\n\t\"data\": \"\"\n}","responseJson":{"code":0,"msg":"","data":""},"responseText":null,"responseBasicType":false,"responseHeaderParameters":null,"responseParameters":[{"name":"code","ignoreFilterName":null,"deprecated":false,"allowEmptyValue":false,"require":false,"type":"integer(int32)","in":null,"schema":true,"schemaValue":"integer(int32)","value":null,"validateStatus":false,"validateInstance":null,"def":null,"description":"","txtValue":null,"enum":null,"id":"param12","pid":"-1","level":1,"show":true,"readOnly":false,"example":null,"childrenTypes":[],"children":null,"parentTypes":["integer(int32)"]},{"name":"msg","ignoreFilterName":null,"deprecated":false,"allowEmptyValue":false,"require":false,"type":"string","in":null,"schema":false,"schemaValue":null,"value":null,"validateStatus":false,"validateInstance":null,"def":null,"description":"","txtValue":null,"enum":null,"id":"param13","pid":"-1","level":1,"show":true,"readOnly":false,"example":null,"childrenTypes":[],"children":null,"parentTypes":[]},{"name":"data","ignoreFilterName":null,"deprecated":false,"allowEmptyValue":false,"require":false,"type":"string","in":null,"schema":false,"schemaValue":null,"value":null,"validateStatus":false,"validateInstance":null,"def":null,"description":"","txtValue":null,"enum":null,"id":"param14"
|
|
|
|
|
//console(datas);
|
|
|
|
|
return datas;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function main(){
|
|
|
|
|
//当前接口json数据
|
|
|
|
|
var d=getData();
|
|
|
|
|
//请求参数table-header
|
|
|
|
|
const requestcolumns = [
|
|
|
|
|
{
|
|
|
|
|
title: "参数名称",
|
|
|
|
|
dataIndex: "name",
|
|
|
|
|
width: "30%"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "参数说明",
|
|
|
|
|
dataIndex: "description",
|
|
|
|
|
width: "25%"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "请求类型",
|
|
|
|
|
dataIndex: "in",
|
|
|
|
|
scopedSlots: { customRender: "typeTemplate" }
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "是否必须",
|
|
|
|
|
dataIndex: "require",
|
|
|
|
|
scopedSlots: { customRender: "requireTemplate" }
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "数据类型",
|
|
|
|
|
dataIndex: "type",
|
|
|
|
|
scopedSlots: { customRender: "datatypeTemplate" }
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "schema",
|
|
|
|
|
dataIndex: "schemaValue",
|
|
|
|
|
width: "15%"
|
|
|
|
|
}
|
|
|
|
|
];
|
|
|
|
|
//响应状态table-header
|
|
|
|
|
const responseStatuscolumns = [
|
|
|
|
|
{
|
|
|
|
|
title: "状态码",
|
|
|
|
|
dataIndex: "code",
|
|
|
|
|
width: "20%"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "说明",
|
|
|
|
|
dataIndex: "description",
|
|
|
|
|
width: "55%",
|
|
|
|
|
scopedSlots: { customRender: "descriptionTemplate" }
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "schema",
|
|
|
|
|
dataIndex: "schema"
|
|
|
|
|
}
|
|
|
|
|
];
|
|
|
|
|
//响应头-header
|
|
|
|
|
const responseHeaderColumns = [
|
|
|
|
|
{
|
|
|
|
|
title: "参数名称",
|
|
|
|
|
dataIndex: "name",
|
|
|
|
|
width: "30%"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "参数说明",
|
|
|
|
|
dataIndex: "description",
|
|
|
|
|
width: "55%"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "数据类型",
|
|
|
|
|
dataIndex: "type"
|
|
|
|
|
}
|
|
|
|
|
];
|
|
|
|
|
const responseParametersColumns = [
|
|
|
|
|
{
|
|
|
|
|
title: "参数名称",
|
|
|
|
|
dataIndex: "name",
|
|
|
|
|
width: "35%"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "参数说明",
|
|
|
|
|
dataIndex: "description",
|
|
|
|
|
width: "40%"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "类型",
|
|
|
|
|
dataIndex: "type"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "schema",
|
|
|
|
|
dataIndex: "schemaValue",
|
|
|
|
|
width: "15%"
|
|
|
|
|
}
|
|
|
|
|
];
|
|
|
|
|
//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>'
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
var data={
|
|
|
|
|
tags:d.tags,
|
|
|
|
|
instance:d.instance,
|
|
|
|
|
columns: requestcolumns,
|
|
|
|
|
responseHeaderColumns: responseHeaderColumns,
|
|
|
|
|
responseStatuscolumns: responseStatuscolumns,
|
|
|
|
|
responseParametersColumns: responseParametersColumns,
|
|
|
|
|
expanRows: true,
|
|
|
|
|
//接收一个响应信息对象,遍历得到树形结构的值
|
|
|
|
|
multipCode: false,
|
|
|
|
|
multipCodeDatas: [],
|
|
|
|
|
multipData: {},
|
|
|
|
|
page: false,
|
|
|
|
|
hideShow:true
|
|
|
|
|
}
|
|
|
|
|
new Vue({
|
|
|
|
|
el:"#knife4jDocument",
|
|
|
|
|
components:{
|
|
|
|
|
"DataType":dataType
|
|
|
|
|
},
|
|
|
|
|
data(){
|
|
|
|
|
return data
|
|
|
|
|
},
|
|
|
|
|
mounted(){
|
|
|
|
|
//初始化完成
|
|
|
|
|
//赋予点击事件;
|
|
|
|
|
document.getElementById("btnHide").addEventListener("click",function(){
|
|
|
|
|
//隐藏目录
|
|
|
|
|
var doc=document.getElementById("knife4jDoc");
|
|
|
|
|
var docGlobal=document.getElementById("knife4j-doc-m");
|
|
|
|
|
if(doc.style.display=="none"){
|
|
|
|
|
doc.style.display="";
|
|
|
|
|
document.getElementById("btnHide").innerHTML="隐 藏";
|
|
|
|
|
docGlobal.style.width="400px";
|
|
|
|
|
docGlobal.style.height="500px";
|
|
|
|
|
}else{
|
|
|
|
|
doc.style.display="none";
|
|
|
|
|
document.getElementById("btnHide").innerHTML="目 录";
|
|
|
|
|
docGlobal.style.width="52px";
|
|
|
|
|
docGlobal.style.height="35px";
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
created(){
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
methods:{
|
|
|
|
|
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";
|
|
|
|
|
}
|
|
|
|
|
return '<span class="' + cls + '">' + match + "</span>";
|
|
|
|
|
}
|
|
|
|
|
);
|
|
|
|
|
} catch (error) {
|
|
|
|
|
return json;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
main();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|