Showing
3 changed files
with
44 additions
and
12 deletions
@@ -20,6 +20,17 @@ | @@ -20,6 +20,17 @@ | ||
20 | mode: 'code', | 20 | mode: 'code', |
21 | mainMenuBar: false, | 21 | mainMenuBar: false, |
22 | statusBar: false, | 22 | statusBar: false, |
23 | + onFocus: () => {}, | ||
24 | + onBlur: () => { | ||
25 | + setJsonValue('执行测试结果为:'); | ||
26 | + }, | ||
27 | + onChangeText: (e) => { | ||
28 | + if (e.length === 0) { | ||
29 | + setJsonValue('执行测试结果为:'); | ||
30 | + } else { | ||
31 | + // setJsonValue(undefined); | ||
32 | + } | ||
33 | + }, | ||
23 | } as object; | 34 | } as object; |
24 | let editor = new jsoneditor(jsoneditorRef.value, options); | 35 | let editor = new jsoneditor(jsoneditorRef.value, options); |
25 | editor.set(jsonValue.value); | 36 | editor.set(jsonValue.value); |
@@ -29,6 +40,12 @@ | @@ -29,6 +40,12 @@ | ||
29 | 40 | ||
30 | const getJsonValue = () => unref(jsonInstance).get(); | 41 | const getJsonValue = () => unref(jsonInstance).get(); |
31 | 42 | ||
43 | + // const setJsonMode = (mode) => { | ||
44 | + // nextTick(() => { | ||
45 | + // unref(jsonInstance).setMode(mode); | ||
46 | + // }); | ||
47 | + // }; | ||
48 | + | ||
32 | const setJsonValue = (Json) => { | 49 | const setJsonValue = (Json) => { |
33 | nextTick(() => { | 50 | nextTick(() => { |
34 | unref(jsonInstance).set(Json); | 51 | unref(jsonInstance).set(Json); |
@@ -4,7 +4,7 @@ | @@ -4,7 +4,7 @@ | ||
4 | <a-row> | 4 | <a-row> |
5 | <Button @click="handleExcute" type="primary"> 执行测试请求 </Button> | 5 | <Button @click="handleExcute" type="primary"> 执行测试请求 </Button> |
6 | </a-row> | 6 | </a-row> |
7 | - <div style="display: flex; justify-content: space-between"> | 7 | + <div v-if="isShowTestResult" style="display: flex; justify-content: space-between"> |
8 | <a-row class="mt-8" type="flex" justify="center" align="middle"> | 8 | <a-row class="mt-8" type="flex" justify="center" align="middle"> |
9 | <a-col :span="3"> 测试地址 </a-col> | 9 | <a-col :span="3"> 测试地址 </a-col> |
10 | <a-col :span="21"> | 10 | <a-col :span="21"> |
@@ -37,6 +37,7 @@ | @@ -37,6 +37,7 @@ | ||
37 | import { useUtils } from '../../../hooks/useUtils'; | 37 | import { useUtils } from '../../../hooks/useUtils'; |
38 | import JsonEditor from '../../SimpleRequest/components/jsonEditor.vue'; | 38 | import JsonEditor from '../../SimpleRequest/components/jsonEditor.vue'; |
39 | import { Tag } from 'ant-design-vue'; | 39 | import { Tag } from 'ant-design-vue'; |
40 | + import { useThrottleFn } from '@vueuse/shared'; | ||
40 | 41 | ||
41 | const emits = defineEmits(['emitExcute']); | 42 | const emits = defineEmits(['emitExcute']); |
42 | 43 | ||
@@ -89,12 +90,19 @@ | @@ -89,12 +90,19 @@ | ||
89 | 90 | ||
90 | const isPostToken = ref(''); | 91 | const isPostToken = ref(''); |
91 | 92 | ||
93 | + const isShowTestResult = ref(false); | ||
94 | + | ||
92 | //执行测试接口 | 95 | //执行测试接口 |
93 | const handleExcute = () => { | 96 | const handleExcute = () => { |
94 | emits('emitExcute'); | 97 | emits('emitExcute'); |
95 | - getValue(); | 98 | + useThrottle(); |
99 | + isShowTestResult.value = true; | ||
96 | }; | 100 | }; |
97 | 101 | ||
102 | + const useThrottle = useThrottleFn(() => { | ||
103 | + getValue(); | ||
104 | + }, 2000); | ||
105 | + | ||
98 | const getValue = async () => { | 106 | const getValue = async () => { |
99 | await nextTick(); | 107 | await nextTick(); |
100 | //获取Params和Header和Body | 108 | //获取Params和Header和Body |
@@ -33,20 +33,27 @@ | @@ -33,20 +33,27 @@ | ||
33 | </template> | 33 | </template> |
34 | <template #slotFillAddress="{ model }"> | 34 | <template #slotFillAddress="{ model }"> |
35 | <div> | 35 | <div> |
36 | - <Tag color="blue" style="width: 35vw; white-space: normal; height: auto"> | 36 | + <Tag |
37 | + v-if="model['originUrlType'] === 'server_url'" | ||
38 | + color="blue" | ||
39 | + style="width: 35vw; white-space: normal; height: auto" | ||
40 | + > | ||
37 | {{ | 41 | {{ |
38 | - ` ${ | ||
39 | - model['originUrlType'] !== 'server_url' | ||
40 | - ? !model['requestOriginUrl'] | ||
41 | - ? '' | ||
42 | - : model['requestOriginUrl'] + model['requestHttpTypeAndUrl']?.requestUrl | ||
43 | - : `${templateFillAddress(model['requestContentType'], model['originUrlType'])}${ | ||
44 | - model['requestHttpTypeAndUrl']?.requestUrl | ||
45 | - }` | ||
46 | - } | 42 | + ` ${`${templateFillAddress(model['requestContentType'], model['originUrlType'])}${ |
43 | + model['requestHttpTypeAndUrl']?.requestUrl | ||
44 | + }`} | ||
47 | ` | 45 | ` |
48 | }} | 46 | }} |
49 | </Tag> | 47 | </Tag> |
48 | + <template v-else> | ||
49 | + <Tag | ||
50 | + v-if="model['requestOriginUrl']" | ||
51 | + color="blue" | ||
52 | + style="width: 35vw; white-space: normal; height: auto" | ||
53 | + > | ||
54 | + {{ ` ${model['requestOriginUrl'] + model['requestHttpTypeAndUrl']?.requestUrl}` }} | ||
55 | + </Tag> | ||
56 | + </template> | ||
50 | </div> | 57 | </div> |
51 | </template> | 58 | </template> |
52 | </BasicForm> | 59 | </BasicForm> |