api文档开发

zyplayer-doc-api/src/main/java/com/zyplayer/doc/api/controller/ApiCustomRequestController.java

@@ -4,6 +4,7 @@ package com.zyplayer.doc.api.controller;
 import com.zyplayer.doc.core.json.DocResponseJson;
 import com.zyplayer.doc.core.json.ResponseJson;
 import com.zyplayer.doc.data.repository.manage.entity.ApiCustomRequest;
+import com.zyplayer.doc.data.service.common.ApiDocAuthJudgeService;
 import com.zyplayer.doc.data.service.manage.ApiCustomRequestService;
 import org.springframework.stereotype.Controller;
 import org.springframework.web.bind.annotation.PostMapping;
@@ -24,6 +25,8 @@ import javax.annotation.Resource;
 @RequestMapping("/api-custom-request")
 public class ApiCustomRequestController {
 	
+	@Resource
+	ApiDocAuthJudgeService apiDocAuthJudgeService;
 	@Resource
 	ApiCustomRequestService apiCustomRequestService;
 	
@@ -42,4 +45,19 @@ public class ApiCustomRequestController {
 		ApiCustomRequest requestSaved = apiCustomRequestService.addRequest(apiCustomRequest);
 		return DocResponseJson.ok(requestSaved);
 	}
+	
+	/**
+	 * 自定义接口详情
+	 *
+	 * @return 文档内容
+	 * @author 暮光：城中城
+	 * @since 2022年01月05日
+	 */
+	@ResponseBody
+	@PostMapping(value = "/detail")
+	public ResponseJson<Object> detail(Long id) {
+		ApiCustomRequest apiCustomRequest = apiCustomRequestService.getById(id);
+		apiDocAuthJudgeService.judgeDevelopAndThrow(apiCustomRequest.getDocId());
+		return DocResponseJson.ok(apiCustomRequest);
+	}
 }

zyplayer-doc-ui/api-ui/src/api/zyplayer.js

@@ -25,5 +25,6 @@ export const zyplayerApi = {
 
     apiCustomFolderAdd: data => apiClient({url: '/api-custom-folder/add', method: 'post', data: data}),
     apiCustomRequestAdd: data => apiClient({url: '/api-custom-request/add', method: 'post', data: data}),
+    apiCustomRequestDetail: data => apiClient({url: '/api-custom-request/detail', method: 'post', data: data}),
 };
 

zyplayer-doc-ui/api-ui/src/assets/core/CustomRequestTreeAnalysis.js

@@ -47,7 +47,6 @@ function getTreeDataChildren(customRequest, keywords, metaInfo, treeIndex) {
                 query: {
                     ...metaInfo,
                     requestId: item.requestId,
-                    folderId: item.folderId,
                 }
             });
             indexApi++;

zyplayer-doc-ui/api-ui/src/components/layouts/PageLayout.vue

@@ -1,11 +1,11 @@
 <template>
 	<div class="page-layout">
-		<a-tabs type="editable-card" v-model:activeKey="activePage" @tab-click="changePage" @edit="editPageTab" style="padding: 5px 10px 0;">
+		<a-tabs type="editable-card" hide-add v-model:activeKey="activePage" @tab-click="changePage" @edit="editPageTab" style="padding: 5px 10px 0;">
-			<template #addIcon>
+<!--			<template #addIcon>-->
-				<a-tooltip title="新建一个API接口">
+<!--				<a-tooltip title="新建一个API接口">-->
-					<plus-outlined />
+<!--					<plus-outlined />-->
-				</a-tooltip>
+<!--				</a-tooltip>-->
-			</template>
+<!--			</template>-->
 			<a-tab-pane closable :tab="pageTabNameMap[item.fullPath]||item.name" :name="getRouteRealPath(item)" :fullPath="item.fullPath" :key="item.fullPath" v-for="item in pageList"/>
 		</a-tabs>
 		<div class="page-body">

zyplayer-doc-ui/api-ui/src/components/params/ParamTable.vue

@@ -83,13 +83,22 @@
         },
         emits: ['update:selected'],
         setup(props, { attrs, slots, emit, expose }) {
-            let paramListRef = ref(props.paramList);
+	        let queryParamSelectedRowKeys = ref([]);
 	        let nextIndex = 10000;
+	        let paramListRef = ref([]);
+	        watch(() => props.paramList, () => {
+		        propsParamInit();
+	        });
+	        onMounted(() => {
+		        propsParamInit();
+	        });
+            const propsParamInit = () => {
+	            paramListRef.value = props.paramList;
+	            console.log('paramListRef.value', paramListRef.value);
 	            // Query参数处理
 	            if (paramListRef.value.length <= 0 || !paramListRef.value[paramListRef.value.length - 1].isLastRow) {
 		            props.paramList.push({name: '', value: undefined, type: 'integer', key: ++nextIndex, isLastRow: true});
 	            }
-            let queryParamSelectedRowKeys = ref([]);
 	            paramListRef.value.forEach(item => {
 		            item.value = item.value || item.example || undefined;
 		            if ((item.enum && item.type === 'array') || item.type === 'file' || item.subType === 'MultipartFile') {
@@ -97,6 +106,7 @@
 		            }
 		            queryParamSelectedRowKeys.value.push(item.key);
 	            });
+            };
             const queryParamRowSelectionChange = (selectedRowKeys, selectedRows) => {
                 queryParamSelectedRowKeys.value = selectedRowKeys;
             };

zyplayer-doc-ui/api-ui/src/views/customRequest/ApiRequest.vue

@@ -1,6 +1,6 @@
 <template>
     <div>
-        <a-input-search v-model:value="docUrl" @search="sendRequest" placeholder="请输入目标URL地址">
+        <a-input-search v-model:value="docInfoShow.apiUrl" @search="sendRequest" placeholder="请输入目标URL地址">
             <template #addonBefore>
                 <a-select v-model:value="docInfoShow.method" style="width: 100px;">
                     <a-select-option :value="method" v-for="method in methodList">{{method.toUpperCase()}}</a-select-option>
@@ -83,11 +83,10 @@
             VerticalAlignTopOutlined, VerticalAlignBottomOutlined, CloseOutlined, ParamTable, ParamBody, ApiRequestResult,
         },
 	    setup(props) {
-            let docUrl = ref('');
             let activePage = ref('urlParam');
             const route = useRoute();
             const store = useStore();
-            store.commit('addTableName', {key: route.fullPath, val: '接口请求' + route.query.id});
+		    const queryParam = {docId: route.query.id, requestId: route.query.requestId};
             let globalParam = store.state.globalParam || [];
             let nextIndex = 1;
             // URL参数处理
@@ -95,28 +94,13 @@
             let urlParamList = ref([]);
             // Header参数处理
             const headerParamRef = ref();
-            let headerParamListProp = [];
+            let headerParamList = ref([]);
-            let headerParamListGlobal = globalParam.filter(item => item.paramType === 2);
-            headerParamListGlobal.forEach(item => {
-                headerParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
-            });
-            let headerParamList = ref(JSON.parse(JSON.stringify(headerParamListProp)));
             // cookie参数处理
             const cookieParamRef = ref();
-            let cookieParamListProp = [];
+            let cookieParamList = ref([]);
-            let cookieParamListGlobal = globalParam.filter(item => item.paramType === 3);
-            cookieParamListGlobal.forEach(item => {
-                cookieParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
-            });
-            let cookieParamList = ref(JSON.parse(JSON.stringify(cookieParamListProp)));
             // form参数处理
             const formParamRef= ref();
-            let formParamListProp = [];
+            let formParamList = ref([]);
-            let formParamListGlobal = globalParam.filter(item => item.paramType === 1);
-            formParamListGlobal.forEach(item => {
-                formParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
-            });
-            let formParamList = ref(JSON.parse(JSON.stringify(formParamListProp)));
             // form参数处理
             const formEncodeParamRef = ref();
             let formEncodeParamList = ref([]);
@@ -131,7 +115,7 @@
             let requestResult = ref({});
             let requestLoading = ref(false);
             const sendRequest = () => {
-                if (!docUrl.value) {
+                if (!docInfoShow.value.apiUrl) {
                     message.error('请输入请求的目标URL地址');
                     return;
                 }
@@ -168,11 +152,13 @@
                 if (bodyParamRef.value) {
                     bodyParamStr = bodyParamRef.value.getParam();
                 }
-                let url = urlParamStr ? (docUrl.value + '?' + urlParamStr) : docUrl.value;
+                let url = urlParamStr ? (docInfoShow.value.apiUrl + '?' + urlParamStr) : docInfoShow.value.apiUrl;
                 formData.append('url', url);
                 formData.append('host', '');
                 formData.append('method', docInfoShow.value.method);
                 formData.append('contentType', '');
+	            formData.append('docId', queryParam.docId);
+	            formData.append('customRequestId', queryParam.requestId);
 	            formData.append('headerParam', JSON.stringify(headerParamArr));
                 formData.append('cookieParam', JSON.stringify(cookieParamArr));
                 formData.append('formParam', JSON.stringify(formParamArr));
@@ -197,8 +183,49 @@
             const activePageChange = () => {
                 queryParamVisible.value = true;
             }
+		    onMounted(async () => {
+			    let detailRes = await zyplayerApi.apiCustomRequestDetail({id: route.query.requestId});
+			    let requestDetail = detailRes.data;
+			    if (!requestDetail) {
+				    console.log('文档加载失败', detailRes);
+			    }
+			    docInfoShow.value = requestDetail;
+			    store.commit('addTableName', {key: route.fullPath, val: requestDetail.apiName});
+			    // Header参数处理
+			    let headerParamListProp = [];
+			    let headerParamListGlobal = globalParam.filter(item => item.paramType === 2);
+			    headerParamListGlobal.forEach(item => {
+				    headerParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
+			    });
+			    if (requestDetail.headerData) {
+				    let headerData = JSON.parse(requestDetail.headerData);
+				    headerData.forEach(item => {
+					    headerParamListProp.unshift({name: item.code, value: item.value, type: 'string', key: 'g' + (nextIndex++)});
+				    });
+			    }
+			    headerParamList.value = headerParamListProp;
+			    // cookie参数处理
+			    let cookieParamListProp = [];
+			    let cookieParamListGlobal = globalParam.filter(item => item.paramType === 3);
+			    cookieParamListGlobal.forEach(item => {
+				    cookieParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
+			    });
+			    if (requestDetail.cookieData) {
+				    let cookieData = JSON.parse(requestDetail.cookieData);
+				    cookieData.forEach(item => {
+					    cookieParamListProp.unshift({name: item.code, value: item.value, type: 'string', key: 'g' + (nextIndex++)});
+				    });
+			    }
+			    cookieParamList.value = cookieParamListProp;
+			    // form参数处理
+			    let formParamListProp = [];
+			    let formParamListGlobal = globalParam.filter(item => item.paramType === 1);
+			    formParamListGlobal.forEach(item => {
+				    formParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
+			    });
+			    formParamList.value = formParamListProp;
+		    });
             return {
-                docUrl,
                 activePage,
                 activePageChange,
                 requestLoading,