增加对OpenApi文档的解析支持

This commit is contained in:
暮光:城中城
2021-11-29 23:16:55 +08:00
parent 91aef6f9f4
commit f587f7c54b
13 changed files with 597 additions and 62 deletions

View File

@@ -61,8 +61,8 @@
<a-radio-group v-model:value="docEdit.docType">
<a-radio :value="1">Swagger URL</a-radio>
<a-radio :value="2">Swagger JSON</a-radio>
<a-radio :value="3" disabled>OpenApi URL</a-radio>
<a-radio :value="4" disabled>OpenApi JSON</a-radio>
<a-radio :value="3">OpenApi URL</a-radio>
<a-radio :value="4">OpenApi JSON</a-radio>
<a-radio :value="5" disabled>自建API</a-radio>
</a-radio-group>
</a-form-item>

View File

@@ -1,36 +1,36 @@
<template>
<a-card>
<a-form :label-col="{span: 4}" :wrapper-col="{span: 20}" v-if="swaggerDocInfo">
<a-form-item label="标题">{{swaggerDocInfo.title}}</a-form-item>
<a-form-item label="版本">{{swaggerDocInfo.version}}</a-form-item>
<a-form-item label="作者" v-if="swaggerDocInfo.contact">
<template v-if="swaggerDocInfo.contact.name">
{{swaggerDocInfo.contact.name}}
<a-form :label-col="{span: 4}" :wrapper-col="{span: 20}" v-if="openApiDocInfo">
<a-form-item label="标题">{{openApiDocInfo.title}}</a-form-item>
<a-form-item label="版本">{{openApiDocInfo.version}}</a-form-item>
<a-form-item label="作者" v-if="openApiDocInfo.contact">
<template v-if="openApiDocInfo.contact.name">
{{openApiDocInfo.contact.name}}
</template>
<template v-if="swaggerDocInfo.contact.email">
<a-divider type="vertical" />{{swaggerDocInfo.contact.email}}
<template v-if="openApiDocInfo.contact.email">
<a-divider type="vertical" />{{openApiDocInfo.contact.email}}
</template>
<template v-if="swaggerDocInfo.contact.url">
<template v-if="openApiDocInfo.contact.url">
<a-divider type="vertical" />
<a :href="swaggerDocInfo.contact.url" target="_blank">{{swaggerDocInfo.contact.url}}</a>
<a :href="openApiDocInfo.contact.url" target="_blank">{{openApiDocInfo.contact.url}}</a>
</template>
</a-form-item>
<a-form-item label="host">{{swaggerDoc.host}}</a-form-item>
<a-form-item label="许可证" v-if="swaggerDocInfo.license">
<a :href="swaggerDocInfo.license.url" target="_blank">{{swaggerDocInfo.license.name}}</a>
<a-form-item label="host">{{openApiDoc.host}}</a-form-item>
<a-form-item label="许可证" v-if="openApiDocInfo.license">
<a :href="openApiDocInfo.license.url" target="_blank">{{openApiDocInfo.license.name}}</a>
</a-form-item>
<a-form-item label="服务条款" v-if="swaggerDocInfo.termsOfService">
<a :href="swaggerDocInfo.termsOfService" target="_blank">{{swaggerDocInfo.termsOfService}}</a>
<a-form-item label="服务条款" v-if="openApiDocInfo.termsOfService">
<a :href="openApiDocInfo.termsOfService" target="_blank">{{openApiDocInfo.termsOfService}}</a>
</a-form-item>
<a-form-item label="文档说明">
<div class="markdown-body" v-html="getDescription(swaggerDocInfo.description)"></div>
<div class="markdown-body" v-html="getDescription(openApiDocInfo.description)"></div>
</a-form-item>
<a-form-item label="接口统计">
<a-row :gutter="[16, 16]">
<template v-for="method in ['get', 'post', 'put', 'delete', 'head', 'patch', 'options', 'trace', 'total']">
<a-col :span="6" v-if="methodStatistic[method]">
<a-col :span="6" v-if="openApiMethodStatistic[method]">
<a-card size="small">
<a-statistic :title="method === 'total'?'总计':method.toUpperCase() + '方法'" :value="methodStatistic[method]" suffix="个"></a-statistic>
<a-statistic :title="method === 'total'?'总计':method.toUpperCase() + '方法'" :value="openApiMethodStatistic[method]" suffix="个"></a-statistic>
</a-card>
</a-col>
</template>
@@ -51,16 +51,16 @@
export default {
setup() {
const store = useStore()
const swaggerDoc = computed(() => store.state.swaggerDoc);
const swaggerDocInfo = computed(() => store.state.swaggerDoc.info);
const methodStatistic = computed(() => store.state.methodStatistic);
const openApiDoc = computed(() => store.state.openApiDoc);
const openApiDocInfo = computed(() => store.state.openApiDoc.info);
const openApiMethodStatistic = computed(() => store.state.openApiMethodStatistic);
const getDescription = description => {
return markdownIt.render(description || '');
};
return {
swaggerDoc,
swaggerDocInfo,
methodStatistic,
openApiDoc,
openApiDocInfo,
openApiMethodStatistic,
getDescription,
};
},

View File

@@ -20,7 +20,7 @@
import {useStore} from 'vuex';
import { message } from 'ant-design-vue';
import { onBeforeRouteLeave, onBeforeRouteUpdate } from 'vue-router'
import swaggerAnalysis from '../../assets/core/SwaggerAnalysis.js'
import openApiAnalysis from '../../assets/core/OpenApiAnalysis.js'
import DocContent from './docView/DocContent.vue'
import DocDebugger from './docView/DocDebugger.vue'
import {markdownIt} from 'mavon-editor'
@@ -47,7 +47,7 @@
let intervalTimer = undefined;
const initLoadDocument = () => {
let path = route.query.path + '.' + route.query.method;
if (Object.keys(store.state.swaggerUrlMethodMap).length <= 0) {
if (Object.keys(store.state.openApiUrlMethodMap).length <= 0) {
console.log('文档尚未加载,等待加载完成');
if (!intervalTimer) {
intervalTimer = setInterval(() => {
@@ -55,7 +55,7 @@
clearInterval(intervalTimer);
return;
}
if (Object.keys(store.state.swaggerUrlMethodMap).length > 0) {
if (Object.keys(store.state.openApiUrlMethodMap).length > 0) {
console.log('文档内容改变,重新加载文档');
initLoadDocument();
}
@@ -63,7 +63,7 @@
}
return;
}
let docInfo = store.state.swaggerUrlMethodMap[path];
let docInfo = store.state.openApiUrlMethodMap[path];
if (!docInfo) {
message.error('没有找到对应的文档');
return;
@@ -87,9 +87,9 @@
produces: produces,
};
// 解析请求参数
let definitionsDataMap = store.state.swaggerDefinitions;
requestParamList.value = swaggerAnalysis.getRequestParamList(docInfo.parameters, definitionsDataMap);
responseParamList.value = swaggerAnalysis.getResponseParamList(docInfo.responses, definitionsDataMap);
let definitionsDataMap = store.state.openApiDefinitions;
requestParamList.value = openApiAnalysis.getRequestParamList(docInfo.parameters, definitionsDataMap);
responseParamList.value = openApiAnalysis.getResponseParamList(docInfo.responses, definitionsDataMap);
}
onMounted(() => {
initLoadDocument();

View File

@@ -99,8 +99,8 @@
const store = useStore();
let apiDoc = store.state.apiDoc || {};
let globalParam = store.state.globalParam || [];
let swaggerDoc = store.state.swaggerDoc || {};
let urlDomain = apiDoc.rewriteDomain || swaggerDoc.host;
let openApiDoc = store.state.openApiDoc || {};
let urlDomain = apiDoc.rewriteDomain || openApiDoc.host;
let docUrl = ref(urlDomain + props.docInfoShow.url);
let activePage = ref('urlParam');
// URL参数处理

View File

@@ -28,9 +28,9 @@
<a-form-item label="接口统计">
<a-row :gutter="[16, 16]">
<template v-for="method in ['get', 'post', 'put', 'delete', 'head', 'patch', 'options', 'trace', 'total']">
<a-col :span="6" v-if="methodStatistic[method]">
<a-col :span="6" v-if="swaggerMethodStatistic[method]">
<a-card size="small">
<a-statistic :title="method === 'total'?'总计':method.toUpperCase() + '方法'" :value="methodStatistic[method]" suffix="个"></a-statistic>
<a-statistic :title="method === 'total'?'总计':method.toUpperCase() + '方法'" :value="swaggerMethodStatistic[method]" suffix="个"></a-statistic>
</a-card>
</a-col>
</template>
@@ -53,14 +53,14 @@
const store = useStore()
const swaggerDoc = computed(() => store.state.swaggerDoc);
const swaggerDocInfo = computed(() => store.state.swaggerDoc.info);
const methodStatistic = computed(() => store.state.methodStatistic);
const swaggerMethodStatistic = computed(() => store.state.swaggerMethodStatistic);
const getDescription = description => {
return markdownIt.render(description || '');
};
return {
swaggerDoc,
swaggerDocInfo,
methodStatistic,
swaggerMethodStatistic,
getDescription,
};
},