manager/zyplayer-doc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加对OpenApi文档的解析支持

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

346
zyplayer-doc-ui/api-ui/src/assets/core/OpenApiAnalysis.js
View File

@@ -1,9 +1,351 @@
import logUtil from '../utils/logUtil.js';
// 无需特殊处理的参数类型
let notNeedHandleTypeArr = ['file', 'string', 'integer', 'long', 'double', 'object', 'number', 'boolean', 'ref'];
/**
* openApi格式的参数解析
* openApi格式的参数解析参数解析
* @author 暮光：城中城
* @since 2017年5月7日
*/
export default {}
export default {
/**
* 解析请求的参数
* @param parameters swagger.parameters
* @param definitionsDataMap 解析的path里对应的数据map，{url + "." + method: swagger.paths.post}
* @returns [] 参数列表：[{
* type: '',
* key: '',
* in: '',
* name: '',
* subType: '',
* required: '否',
* format: '',
* enum: '',
* example: '',
* collectionFormat: 'multi',
* description: '',
* additional: '',
* children: [],
* }]
*/
getRequestParamList(parameters, definitionsDataMap) {
if (!parameters) {
return [];
}
let indexKey = 1;
let requestParamList = [];
for (let i = 0; i < parameters.length; i++) {
let parameter = parameters[i];
let description = parameter.description || '';
let type = parameter.type;
let format = parameter.format;
let example = parameter['x-example'];
let subType = undefined;
let children = undefined;
let additional = undefined;
if (type === 'array') {
// 解析parameter.items.$ref 或 parameter.items.$ref {$ref: "#/definitions/Model"}
// 解析parameter.items.type {type: 'file'}
if (this.isSchemaRef(parameter.items)) {
subType = this.getSchemaRef(parameter.items);
children = this.getParamDefinitions(subType, definitionsDataMap, indexKey, {}, 0);
} else if (parameter.schema) {
if (this.isSchemaRef(parameter.schema.items)) {
subType = this.getSchemaRef(parameter.schema.items);
children = this.getParamDefinitions(subType, definitionsDataMap, indexKey, {}, 0);
} else if (parameter.schema.type) {
subType = parameter.schema.type;
}
} else if (parameter.items && parameter.items.type) {
subType = parameter.items.type;
} else {
logUtil.logMessage('001', type, parameter);
}
} else if (!type) {
if (parameter.schema) {
if (this.isSchemaRef(parameter.schema)) {
// 解析parameter.schema {$ref: "#/definitions/Model"}
type = this.getSchemaRef(parameter.schema);
children = this.getParamDefinitions(type, definitionsDataMap, indexKey, {}, 0);
} else if (parameter.schema.type) {
type = parameter.schema.type;
if (parameter.schema.additionalProperties) {
additional = {};
children = this.getAdditionalProperties(parameter.schema.additionalProperties, additional, definitionsDataMap, indexKey, {}, 0);
format = additional.type;
} else if (parameter.schema.items) {
if (this.isSchemaRef(parameter.schema.items)) {
subType = this.getSchemaRef(parameter.schema.items);
children = this.getParamDefinitions(subType, definitionsDataMap, indexKey, {}, 0);
} else if (parameter.schema.items.type) {
subType = parameter.schema.items.type;
} else {
logUtil.log('0014', type, parameter);
}
} else {
logUtil.log('0011', type, parameter);
}
} else {
logUtil.logMessage('0013', type, parameter);
}
} else if (parameter.items && parameter.items.type) {
// 解析parameter.items {type: "object", $ref: "#/definitions/Model"}
type = parameter.items.type;
if (parameter.items.additionalProperties) {
additional = {};
children = this.getAdditionalProperties(parameter.items.additionalProperties, additional, definitionsDataMap, indexKey, {}, 0);
format = additional.type;
} else {
logUtil.logMessage('0012', type, parameter);
}
} else {
logUtil.logMessage('002', type, parameter);
}
} else {
if (notNeedHandleTypeArr.indexOf(type) >= 0) {
// 无需特殊处理的类型
} else {
logUtil.logMessage('003', type, parameter);
}
}
if (example) {
description = description ? (description + '，') : '';
description += '例：' + example;
}
if (parameter.enum && parameter.enum.length > 0) {
description = description || '枚举类型';
description += '，可选值：' + parameter.enum.join('、');
}
requestParamList.push({
type: type,
key: indexKey,
in: parameter.in,
name: parameter.name,
subType: subType,
required: parameter.required ? '是' : '否',
format: format,
enum: parameter.enum,
example: example,
collectionFormat: parameter.collectionFormat,// 枚举多选时=multi
description: description,
additional: additional,
children: children,
});
indexKey++;
}
return requestParamList;
},
/**
* 解析请求返回的结果集
* @param responses swagger.parameters
* @param definitionsDataMap 解析的path里对应的数据map，{url + "." + method: swagger.paths.post}
* @returns [] 参数列表：[{
* code: '',
* type: '',
* key: '',
* desc: '',
* schemas: [],
* }]
*/
getResponseParamList(responses, definitionsDataMap) {
let responsesList = [];
let indexKey = 1;
Object.keys(responses).forEach(code => {
let codeResponses = responses[code];
let type = undefined;
let children = undefined;
if (this.isSchemaRef(codeResponses.schema)) {
type = this.getSchemaRef(codeResponses.schema);
children = this.getParamDefinitions(type, definitionsDataMap, indexKey, {}, 0);
}
responsesList.push({
code: code,
type: type,
key: indexKey,
desc: codeResponses.description,
schemas: children,
});
indexKey++;
});
return responsesList;
},
/**
* 判断是否包含$ref属性
* @param schema
* @returns {boolean}
*/
isSchemaRef(schema) {
return !!(schema && schema['$ref']);
},
/**
* 获取对象的$ref属性
* @param schema
* @returns {string}
*/
getSchemaRef(schema) {
if (schema['$ref'] && schema['$ref'].indexOf('#/definitions/') === 0) return schema['$ref'].replace('#/definitions/', '');
logUtil.logMessage('9467', '', schema);
return '';
},
/**
* 获取swagger.definitions里的对象信息
* @param ref 对象名
* @param definitionsDataMap 解析的path里对应的数据map，{url + "." + method: swagger.paths.post}
* @param indexKey 层级key
* @param parentRef 父级已用过的ref，防止无限递归
* @param deep 层级深度，大于10层则不再解析，防止层级太深或无线递归
* @returns {undefined|
* {
* type: '',
* name: '',
* key: '',
* subType: '',
* format: '',
* description: '',
* enum: '',
* additional: '',
* example: '',
* children: [],
* }
* }
*/
getParamDefinitions(ref, definitionsDataMap, indexKey, parentRef, deep) {
let definition = definitionsDataMap[ref];
// 层级大于5层 或者 没有类型定义
if (deep >= 10 || !definition) {
return undefined;
}
// 允许重复递归一次
parentRef[ref] = (parentRef[ref] || 0) + 1;
if (parentRef[ref] > 2) {
return undefined;
}
let paramList = [];
let type = definition.type;
let properties = definition.properties;
let indexSub = 1;
if (type === 'object' && properties) {
let currentLevelTypes = {};
Object.keys(properties).forEach(key => {
let parameter = properties[key];
let type = parameter.type;
let format = parameter.format;
let description = parameter.description || '';
let example = parameter['example'] || parameter['x-example'];
let subType = undefined;
let additional = undefined;
let enums = undefined;
let keySub = indexKey + '_' + indexSub;
let children = undefined;
// 把当前层级用过的类型清除，防止多个同类型在一层，后面的不能解析
Object.keys(currentLevelTypes).forEach(currentLevelType => {
parentRef[currentLevelType] = undefined;
});
if (type === 'array') {
// 解析parameter.items {$ref: "#/definitions/Model"}
if (this.isSchemaRef(parameter.items)) {
subType = this.getSchemaRef(parameter.items);
children = this.getParamDefinitions(subType, definitionsDataMap, keySub, parentRef, deep + 1);
} else if (parameter.items && parameter.items.type) {
subType = parameter.items.type;
} else {
logUtil.logMessage('004', type, parameter);
}
} else if (type === 'object') {
if (parameter.additionalProperties) {
additional = {};
children = this.getAdditionalProperties(parameter.additionalProperties, additional, definitionsDataMap, keySub, parentRef, deep + 1);
format = additional.type;
} else {
logUtil.log('0041', type, parameter);
}
} else if (!type) {
if (this.isSchemaRef(parameter)) {
type = this.getSchemaRef(parameter);
children = this.getParamDefinitions(type, definitionsDataMap, keySub, parentRef, deep + 1);
} else {
logUtil.logMessage('005', type, parameter);
}
} else {
if (notNeedHandleTypeArr.indexOf(type) >= 0) {
// 无需特殊处理的类型
} else {
logUtil.logMessage('006', type, parameter);
}
}
if (example) {
description = description ? (description + '，') : '';
description += '例：' + example;
}
if (parameter.items && parameter.items.enum && parameter.items.enum.length > 0) {
enums = parameter.items.enum;
description = description || '枚举类型';
description += '，可选值：' + parameter.items.enum.join('、');
}
paramList.push({
type: type,
name: key,
key: keySub,
subType: subType,
format: format,
description: description,
enum: enums,
additional: additional,
example: example,
children: children,
});
indexSub++;
currentLevelTypes[type] = 1;
});
}
return paramList.length > 0 ? paramList : undefined;
},
/**
* parameter.schema.additionalProperties 类型的参数值处理
* @param additionalProperties
* @param additional
* @param definitionsDataMap
* @param keySub
* @param parentRef
* @param deep
* @returns {
* undefined
* |{type: "", name: "", key: "", subType: "", format: "", description: "", enum: "", additional: "", example: "", children: *[]}
* |{}
* |{children: (undefined|{type: "", name: "", key: "", subType: "", format: "", description: "", enum: "", additional: "", example: "", children: *[]}), type: string}
* }
*/
getAdditionalProperties(additionalProperties, additional, definitionsDataMap, keySub, parentRef, deep) {
if (this.isSchemaRef(additionalProperties)) {
additional.type = this.getSchemaRef(additionalProperties);
additional.children = this.getParamDefinitions(additional.type, definitionsDataMap, keySub, parentRef, deep + 1);
return additional.additional;
} else if (additionalProperties.additionalProperties) {
additional.type = additionalProperties.type;
additional.additional = {};
return this.getAdditionalProperties(additionalProperties.additionalProperties, additional.additional, definitionsDataMap, keySub, parentRef, deep + 1);
} else if (additionalProperties.type === 'array') {
additional.type = additionalProperties.type;
if (this.isSchemaRef(additionalProperties.items)) {
let subType = this.getSchemaRef(additionalProperties.items);
let children = this.getParamDefinitions(subType, definitionsDataMap, keySub, parentRef, deep + 1);
additional.additional = {
type: subType,
children: children
};
return children;
} else {
logUtil.logMessage('007', '', additionalProperties);
}
} else {
additional.type = additionalProperties.type;
if (notNeedHandleTypeArr.indexOf(additional.type) >= 0) {
// 无需特殊处理的类型
} else {
logUtil.logMessage('008', '', additionalProperties);
}
}
return undefined;
},
}

144
zyplayer-doc-ui/api-ui/src/assets/core/OpenApiTreeAnalysis.js Normal file
View File

@@ -0,0 +1,144 @@
const methodArray = ["get", "head", "post", "put", "patch", "delete", "options", "trace"];
/**
* 解析swagger文档paths信息，生成后续需要的关键信息
* @param swagger 文档内容
* @returns {{urlMethodMap: {}, tagPathMap: {}, methodStatistic: {}}} 例：
* {
* urlMethodMap: {
* 'url + "." + method': {swagger.paths.url.method对象信息}
* },
* tagPathMap: {
* 分组名: {url: {...接口信息, path: '', url: '', method: ''}}
* },
* methodStatistic: {
* POST: 132,
* GET: 146,
* TOTAL: 999
* }
* }
*/
export function analysisOpenApiData(swagger) {
let tagPathMap = {}, urlMethodMap = {}, methodStatistic = {};
let swaggerPaths = swagger.paths;
if (!swaggerPaths) {
return {urlMethodMap, tagPathMap, methodStatistic};
}
//console.log(swaggerPaths);
Object.keys(swaggerPaths).forEach(url => {
//console.log(key, swaggerPaths[key]);
let pathMethods = swaggerPaths[url];
for (let method of methodArray) {
if (!pathMethods[method] || !pathMethods[method].tags) {
continue;
}
let methodLower = method.toLowerCase();
methodStatistic[methodLower] = (methodStatistic[methodLower] || 0) + 1;
methodStatistic['total'] = (methodStatistic['total'] || 0) + 1;
pathMethods[method].tags.forEach(tag => {
let pathTag = tagPathMap[tag];
if (!pathTag) {
pathTag = tagPathMap[tag] = {};
}
let pathTagUrl = pathTag[url];
if (!pathTagUrl) {
pathTagUrl = pathTag[url] = {};
}
let tempPath = url + "." + method;
pathTagUrl[method] = pathMethods[method];
pathTagUrl[method].path = tempPath;
pathTagUrl[method].url = url;
pathTagUrl[method].method = method;
// url对应文档的映射
urlMethodMap[tempPath] = pathMethods[method];
});
}
});
return {urlMethodMap, tagPathMap, methodStatistic};
}
/**
* 按tag分组获取左侧菜单目录树
* @param swagger 原始文档信息
* @param tagPathMap 分组信息{分组名: {url: {...接口信息, path: '', url: '', method: ''}}}
* @param keywords 过滤关键字
* @param metaInfo 接口元信息，点击时放入URL的参数
* @returns {{children: [], title: (*|string), key: string}[]}
*/
export function getTreeDataForTag(swagger, tagPathMap, keywords, metaInfo) {
let treeData = [];
let indexTag = 1;
// 遍历分组
let swaggerTags = swagger.tags || [];
if (swaggerTags.length <= 0) {
Object.keys(tagPathMap).forEach(tag => swaggerTags.push({name: tag}));
}
swaggerTags.forEach(tag => {
let indexUrl = 1;
let urlTree = [];
let pathTagNode = tagPathMap[tag.name];
if (!pathTagNode) {
return;
}
// 遍历路劲
Object.keys(pathTagNode).forEach(url => {
let indexMethod = 1;
let pathUrlNode = pathTagNode[url];
// 遍历方法
Object.keys(pathUrlNode).forEach(method => {
let tempTreeId = indexTag + "_" + indexUrl + "_" + indexMethod;
let methodNode = pathUrlNode[method];
if (!searchInPathMethods(url, methodNode, keywords)) {
return;
}
methodNode.treeId = tempTreeId;
let title = methodNode.summary || methodNode.path;
urlTree.push({
title: title,
key: tempTreeId,
isLeaf: true,
method: methodNode.method,
query: {
...metaInfo,
path: methodNode.url,
method: methodNode.method,
}
});
indexMethod++;
});
indexUrl++;
});
if (urlTree.length > 0) {
treeData.push({title: tag.name, key: indexTag, children: urlTree});
}
indexTag++;
});
return [
{
key: 'main',
title: swagger.info.title || 'Swagger接口文档',
children: treeData
}
];
}
/**
* 搜索接口是否包含某关键字，将匹配：URL、path、method、summary、description、tags 属性
* @param url 接口URL
* @param methodNode 接口基本信息
* @param keywords 关键字
* @returns {*|boolean} 是否包含
*/
function searchInPathMethods(url, methodNode, keywords) {
if (!keywords || !url) {
return true;
}
url = url.toLowerCase();
keywords = keywords.toLowerCase();
// 路径中有就不用再去找了
if (url.indexOf(keywords) >= 0) {
return true;
}
let searchData = methodNode.path + methodNode.method + methodNode.summary + methodNode.description + methodNode.tags;
return (searchData && searchData.toLowerCase().indexOf(keywords) >= 0);
}

3
zyplayer-doc-ui/api-ui/src/assets/core/SwaggerTreeAnalysis.js
View File

@@ -70,6 +70,9 @@ export function getTreeDataForTag(swagger, tagPathMap, keywords, metaInfo) {
let indexTag = 1;
// 遍历分组
let swaggerTags = swagger.tags || [];
if (swaggerTags.length <= 0) {
Object.keys(tagPathMap).forEach(tag => swaggerTags.push({name: tag}));
}
swaggerTags.forEach(tag => {
let indexUrl = 1;
let urlTree = [];

5
zyplayer-doc-ui/api-ui/src/components/layouts/MenuLayout.vue
View File

@@ -14,6 +14,7 @@
</div>
<template v-if="docChoice && docChoice.docType">
<DocTreeSwagger v-if="docChoice.docType === 1 || docChoice.docType === 2" ref="swaggerRef"></DocTreeSwagger>
<DocTreeOpenApi v-if="docChoice.docType === 3 || docChoice.docType === 4" ref="openApiRef"></DocTreeOpenApi>
</template>
</a-spin>
</div>
@@ -28,6 +29,7 @@
import MenuChildrenLayout from './MenuChildrenLayout.vue'
import {zyplayerApi} from '../../api'
import DocTreeSwagger from './doc-tree/Swagger.vue'
import DocTreeOpenApi from './doc-tree/OpenApi.vue'
export default {
props: {
@@ -36,7 +38,7 @@
default: false
},
},
components: {MenuChildrenLayout, DocTreeSwagger},
components: {MenuChildrenLayout, DocTreeSwagger, DocTreeOpenApi},
setup(props) {
const store = useStore();
const route = useRoute();
@@ -132,6 +134,7 @@
docChoiceId,
searchKeywords,
swaggerRef,
openApiRef,
docChoice,
docChoiceChange,
};

26
zyplayer-doc-ui/api-ui/src/components/layouts/doc-tree/OpenApi.vue
View File

@@ -23,7 +23,7 @@
import {useStore} from 'vuex';
import { message } from 'ant-design-vue';
import {zyplayerApi} from '../../../api'
import {analysisSwaggerData, getTreeDataForTag} from '../../../assets/core/SwaggerTreeAnalysis.js'
import {analysisOpenApiData, getTreeDataForTag} from '../../../assets/core/OpenApiTreeAnalysis.js'
export default {
setup() {
@@ -32,7 +32,7 @@
const router = useRouter();
let tagPathMap = ref({});
let swaggerDoc = ref({});
let openApiDoc = ref({});
let treeData = ref([]);
let expandedKeys = ref([]);
let choiceDocId = ref('');
@@ -40,10 +40,10 @@
const docChecked = (val, node) => {
if (node.node.key === 'main') {
router.push({path: '/swagger/info'});
router.push({path: '/openapi/info'});
} else if (node.node.isLeaf) {
let dataRef = node.node.dataRef;
router.push({path: '/swagger/view', query: dataRef.query});
router.push({path: '/openapi/view', query: dataRef.query});
}
};
const loadDoc = (docId, keyword, callback) => {
@@ -51,22 +51,22 @@
searchKeywords.value = keyword;
zyplayerApi.apiDocApisDetail({id: docId}).then(res => {
let v2Doc = toJsonObj(res.data);
if (typeof v2Doc !== 'object' || !v2Doc.swagger) {
if (typeof v2Doc !== 'object' || !v2Doc.openapi) {
message.error('获取文档数据请求失败');
return;
}
swaggerDoc.value = v2Doc;
store.commit('setSwaggerDoc', v2Doc);
let treeData = analysisSwaggerData(v2Doc);
store.commit('setSwaggerUrlMethodMap', treeData.urlMethodMap);
store.commit('setMethodStatistic', treeData.methodStatistic);
openApiDoc.value = v2Doc;
store.commit('setOpenApiDoc', v2Doc);
let treeData = analysisOpenApiData(v2Doc);
store.commit('setOpenApiUrlMethodMap', treeData.urlMethodMap);
store.commit('setOpenApiMethodStatistic', treeData.methodStatistic);
tagPathMap.value = treeData.tagPathMap;
loadTreeData();
callback();
setTimeout(() => {
let isViewPage = (route.path === '/swagger/view' && route.query.id);
let isViewPage = (route.path === '/openapi/view' && route.query.id);
if (!isViewPage) {
router.push({path: '/swagger/info'});
router.push({path: '/openapi/info'});
}
}, 0);
});
@@ -74,7 +74,7 @@
const loadTreeData = () => {
expandedKeys.value = ['main'];
let metaInfo = {id: choiceDocId.value};
treeData.value = getTreeDataForTag(swaggerDoc.value, tagPathMap.value, searchKeywords.value, metaInfo);
treeData.value = getTreeDataForTag(openApiDoc.value, tagPathMap.value, searchKeywords.value, metaInfo);
};
const toJsonObj = (value) => {
if (typeof value !== 'string') {

2
zyplayer-doc-ui/api-ui/src/components/layouts/doc-tree/Swagger.vue
View File

@@ -60,7 +60,7 @@
store.commit('setSwaggerDoc', v2Doc);
let treeData = analysisSwaggerData(v2Doc);
store.commit('setSwaggerUrlMethodMap', treeData.urlMethodMap);
store.commit('setMethodStatistic', treeData.methodStatistic);
store.commit('setSwaggerMethodStatistic', treeData.methodStatistic);
tagPathMap.value = treeData.tagPathMap;
loadTreeData();
callback(true);

26
zyplayer-doc-ui/api-ui/src/routes.js
View File

@@ -56,16 +56,38 @@ let routers = [
children: [
{
path: '/swagger/info',
name: '文档信息',
name: 'swagger文档信息',
component: () => import('./views/swagger/DocInfo.vue')
},
{
path: '/swagger/view',
name: '文档展示',
name: 'swagger文档展示',
component: () => import('./views/swagger/DocView.vue')
},
]
},
// 以下是OpenApi的菜单路由
{
path: '/openapi',
name: 'openApi文档',
meta: {
hidden: true,
icon: 'SettingOutlined'
},
component: EmptyKeepAliveLayout,
children: [
{
path: '/openapi/info',
name: 'openApi文档信息',
component: () => import('./views/openapi/DocInfo.vue')
},
{
path: '/openapi/view',
name: 'openApi文档展示',
component: () => import('./views/openapi/DocView.vue')
},
]
},
{
path: '/api',
name: 'API请求',

29
zyplayer-doc-ui/api-ui/src/store/index.js
View File

@@ -9,8 +9,6 @@ export default createStore({
userInfo: {},
// tab多标签的标签名map{xxx: 'val'}
pageTabNameMap: {},
// 方法统计{post: 10, total: 20}
methodStatistic: {},
// 数据库存储的文档信息
apiDoc: {},
// 全局参数
@@ -22,6 +20,17 @@ export default createStore({
swaggerDefinitions: {},
// url对应的map信息 {'url + "." + method': {swagger.paths.url.method对象信息}}
swaggerUrlMethodMap: {},
// 方法统计{post: 10, total: 20}
swaggerMethodStatistic: {},
// openApi原始文档
openApiDoc: {},
// openApi原始definitions
openApiDefinitions: {},
// url对应的map信息 {'url + "." + method': {swagger.paths.url.method对象信息}}
openApiUrlMethodMap: {},
// 方法统计{post: 10, total: 20}
openApiMethodStatistic: {},
}
},
getters: {
@@ -42,6 +51,7 @@ export default createStore({
addDocChangedNum(state) {
state.docChangedNum++;
},
// swagger
setSwaggerDoc(state, swaggerDoc) {
state.swaggerDoc = swaggerDoc;
state.swaggerDefinitions = swaggerDoc.definitions || {};
@@ -49,8 +59,19 @@ export default createStore({
setSwaggerUrlMethodMap(state, swaggerUrlMethodMap) {
state.swaggerUrlMethodMap = swaggerUrlMethodMap;
},
setMethodStatistic(state, methodStatistic) {
state.methodStatistic = methodStatistic;
setSwaggerMethodStatistic(state, swaggerMethodStatistic) {
state.swaggerMethodStatistic = swaggerMethodStatistic;
},
// openApi
setOpenApiDoc(state, openApiDoc) {
state.openApiDoc = openApiDoc;
state.openApiDefinitions = openApiDoc.definitions || {};
},
setOpenApiUrlMethodMap(state, openApiUrlMethodMap) {
state.openApiUrlMethodMap = openApiUrlMethodMap;
},
setOpenApiMethodStatistic(state, openApiMethodStatistic) {
state.openApiMethodStatistic = openApiMethodStatistic;
},
addTableName(state, item) {
let sameObj = Object.assign({}, state.pageTabNameMap);

4
zyplayer-doc-ui/api-ui/src/views/manage/DocManage.vue
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>

48
zyplayer-doc-ui/api-ui/src/views/openapi/DocInfo.vue
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,
};
},

14
zyplayer-doc-ui/api-ui/src/views/openapi/DocView.vue
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();

4
zyplayer-doc-ui/api-ui/src/views/openapi/docView/DocDebugger.vue
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参数处理

8
zyplayer-doc-ui/api-ui/src/views/swagger/DocInfo.vue
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,
};
},