升级v2.1.2

- 支持使用ref引入model时，仅指定到模型名，及使用@指定引用的方法。
- 接口调试时增加 更新mock数据并执行的操作。
- 修正ParamType类型为route、formdata时mock数据无法正常生成问题。
- 修正参数类型为int是为空的默认值为空的问题。

Author: HGthecode

package.json

@@ -1,6 +1,6 @@
 {
   "name": "apidoc",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",

public/config.js

@@ -13,6 +13,8 @@ const config = {
     TIMEOUT: 30000,
     // 多个可切换的host
     HOSTS: [],
+    // 请求头 encodeURIComponent 转码
+    HEADERS_ENCODEURICOMPONENT: false,
   },
   // 菜单配置
   MENU: {
@@ -81,6 +83,7 @@ const config = {
         "apiPage.mdDetail.title": "{name} 字段的说明",
         "apiPage.debug.mock.reload": "更新Mock",
         "apiPage.debug.excute": "执行 Excute",
+        "apiPage.debug.mockAndExcute": "更新Mock 并执行",
         "apiPage.debug.selectFile": "Select File",
         "apiPage.debug.selectFiles": "Select Files",
         "layout.menu.reload": "更新菜单",

src/api/interface/apiData.ts

@@ -46,6 +46,7 @@ export interface ParamItem {
   require?: boolean;
   source?: string;
   type?: string;
+  mock?: string;
 }
 
 export interface ApiEventItem {

src/utils/helper/codeHelper.ts

@@ -10,7 +10,7 @@ export function renderCodeJsonByParams<T>(params: T[], isMock?: boolean): object
       if (isMock && item.mock) {
         fieldValue = Mock.mock(item.mock);
       }
-      if (!fieldValue) {
+      if (fieldValue === null) {
         switch (item.type) {
           case "int":
             fieldValue = 0;

src/utils/index.ts

@@ -44,7 +44,7 @@ export const copyTextToClipboard = (text: string): boolean => {
  * @param {string} s
  */
 export const trim = (s: string): string => {
-  if (s) {
+  if (s && s.replace) {
     return s.replace(/(^\s*)|(\s*$)/g, "");
   }
   return "";
@@ -243,7 +243,7 @@ export const getRandomNumber = (max: number, min?: number): number => {
 };
 
 // 根据前17位生成末位
-export const createIdcardEndNumber = (idcard: string) => {
+export const createIdcardEndNumber = (idcard: string): string | number => {
   let arrExp = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2]; // 加权因子
   let arrValid = [1, 0, "X", 9, 8, 7, 6, 5, 4, 3, 2]; // 校验码
   let sum = 0;
@@ -255,7 +255,7 @@ export const createIdcardEndNumber = (idcard: string) => {
 };
 
 // 生成身份证号
-export const createIdcard = () => {
+export const createIdcard = (): string => {
   let cityPrefixs = [
     11, 12, 13, 14, 15, 21, 22, 23, 31, 32, 33, 34, 35, 36, 37, 41, 42, 43, 44, 45, 46, 50, 51, 52,
     53, 54, 61, 62, 63, 64, 65, 71, 81, 82,

src/views/apiDetail/debug/Index.vue

@@ -24,7 +24,7 @@
     </div>
     <div>
       <Title :title="t('apiPage.title.params')">
-        <a-button @click="onMockReload">
+        <a-button v-if="isMock" @click="onMockReload">
           <ReloadOutlined />{{ t("apiPage.debug.mock.reload") }}
         </a-button>
       </Title>
@@ -83,7 +83,10 @@
         />
       </div>
     </div>
-    <div class="mb-sm">
+    <div class="excute-buttons">
+      <a-button v-if="isMock" type="primary" :loading="loading" block @click="mockAndExcute">{{
+        t("apiPage.debug.mockAndExcute")
+      }}</a-button>
       <a-button type="primary" :loading="loading" block @click="excute">{{
         t("apiPage.debug.excute")
       }}</a-button>
@@ -149,6 +152,8 @@ import EventPopover from "./EventPopover.vue";
 import { getAppsConfigItemByKey } from "@/utils";
 import { ConfigAppItem } from "@/api/interface/config";
 import { useRoute } from "vue-router";
+import Mock from "mockjs";
+import "@/utils/helper/mockExtend";
 
 interface EventDataState {
   before: ResultState;
@@ -245,6 +250,7 @@ export default defineComponent({
       config: computed(() => store.state.app.config),
       eventData: eventData,
       feConfig: computed(() => store.state.app.feConfig),
+      isMock: false,
     });
     const headersColumns = [
       {
@@ -310,23 +316,34 @@ export default defineComponent({
 
     function handleParamData(paramData: ParamItem[]): ParamItem[] {
       const data = cloneDeep(paramData);
+      let isMock = false;
+      let res: ParamItem[] = [];
       if (data && data.length) {
         // 合并全局参数
         const globalParams = state.globalParams;
         if (globalParams && globalParams.params && globalParams.params.length) {
-          return data.map((item) => {
+          res = data.map((item) => {
             const globalParamFind = globalParams.params.find((p) => p.name === item.name);
             if (globalParamFind && globalParamFind.value) {
               item.default = globalParamFind.value;
             }
+            if (item.mock) {
+              isMock = true;
+            }
             return item;
           });
         } else {
-          return data;
+          res = data.map((item) => {
+            if (item.mock) {
+              isMock = true;
+              item.default = Mock.mock(item.mock);
+            }
+            return item;
+          });
         }
       }
-
-      return [];
+      state.isMock = isMock;
+      return res;
     }
 
     const tableScroll = {
@@ -408,6 +425,13 @@ export default defineComponent({
       }
     }
 
+    function mockAndExcute() {
+      onMockReload();
+      setTimeout(() => {
+        excute();
+      }, 200);
+    }
+
     async function sendRequest(url: string, data?: any) {
       state.loading = true;
       let method = props.currentMethod as string;
@@ -559,9 +583,22 @@ export default defineComponent({
 
     function onMockReload() {
       if (props.detail.param) {
-        const json = renderCodeJsonByParams(props.detail.param, true);
-        state.paramCode = formatJsonCode(json);
+        if (props.detail.paramType === "formdata" || props.detail.paramType === "route") {
+          state.paramFormData = props.detail.param.map((p) => {
+            if (p.mock) {
+              p.default = Mock.mock(p.mock);
+            }
+            return p;
+          });
+        } else {
+          const json = renderCodeJsonByParams(props.detail.param, true);
+          state.paramCode = formatJsonCode(json);
+        }
       }
+      // if (props.detail.param) {
+      //   const json = renderCodeJsonByParams(props.detail.param, true);
+      //   state.paramCode = formatJsonCode(json);
+      // }
     }
 
     return {
@@ -577,6 +614,7 @@ export default defineComponent({
       formatJsonCode,
       onMockReload,
       t,
+      mockAndExcute,
     };
   },
 });

src/views/apiDetail/debug/debug.less

@@ -12,3 +12,13 @@
     border-radius: 4px;
     border: 1px solid var(--color-line);
 }
+.excute-buttons{
+    margin-bottom: 10px;
+    display: flex;
+    button{
+        flex:1;
+    }
+    button+button{
+        margin-left: 10px;
+    }
+}