Showing
7 changed files
with
160 additions
and
50 deletions
... | ... | @@ -67,8 +67,8 @@ |
67 | 67 | initVal(); |
68 | 68 | }); |
69 | 69 | |
70 | - function initVal() { | |
71 | - if (props?.type) getOptions(props?.type); | |
70 | + async function initVal() { | |
71 | + if (props?.type) await getOptions(props?.type); | |
72 | 72 | if (props?.value) for (let i in props.value) Reflect.set(valueObj, i, props.value[i]); |
73 | 73 | } |
74 | 74 | ... | ... |
... | ... | @@ -163,6 +163,7 @@ |
163 | 163 | |
164 | 164 | const handleTestParamsInterface = () => { |
165 | 165 | excuteTestRef.value?.showTest(); |
166 | + excuteTestRef.value?.resetValue(false); | |
166 | 167 | let value = getValue(false) as any; |
167 | 168 | dataMap.mapParamsObj = { |
168 | 169 | list: value?.Params, |
... | ... | @@ -174,6 +175,7 @@ |
174 | 175 | let value = getValue(false) as any; |
175 | 176 | const type = value?.Body?.requestParamsBodyType; |
176 | 177 | excuteTestRef.value?.showTest(); |
178 | + excuteTestRef.value?.resetValue(false); | |
177 | 179 | let values = []; |
178 | 180 | for (let i in value?.Body) if (i === type) values = value?.Body[i]; |
179 | 181 | dataMap.mapBodyObj = { |
... | ... | @@ -185,6 +187,7 @@ |
185 | 187 | |
186 | 188 | const handleTestHeaderInterface = () => { |
187 | 189 | excuteTestRef.value?.showTest(); |
190 | + excuteTestRef.value?.resetValue(false); | |
188 | 191 | let value = getValue(false) as any; |
189 | 192 | dataMap.mapHeaderObj = { |
190 | 193 | list: value?.Header, |
... | ... | @@ -207,14 +210,20 @@ |
207 | 210 | }; |
208 | 211 | |
209 | 212 | //设置数据 |
210 | - const setValue = (data) => { | |
211 | - nextTick(() => { | |
212 | - const Objects = JSON.parse(data?.requestParams); | |
213 | - if (!Objects) return; | |
214 | - dataForTypeMap[0][1](isEmpty(Objects?.Params) ? [pushObj] : Objects?.Params); | |
215 | - dataForTypeMap[1][1](isEmpty(Objects?.Body) ? {} : Objects?.Body); | |
216 | - dataForTypeMap[2][1](isEmpty(Objects?.Header) ? [pushObj] : Objects?.Header); | |
217 | - }); | |
213 | + const setValue = (data, flag, defaultValue) => { | |
214 | + if (!flag) { | |
215 | + nextTick(() => { | |
216 | + const Objects = JSON.parse(data?.requestParams); | |
217 | + if (!Objects) return; | |
218 | + dataForTypeMap[0][1](isEmpty(Objects?.Params) ? [pushObj] : Objects?.Params); | |
219 | + dataForTypeMap[1][1](isEmpty(Objects?.Body) ? {} : Objects?.Body); | |
220 | + dataForTypeMap[2][1](isEmpty(Objects?.Header) ? [pushObj] : Objects?.Header); | |
221 | + }); | |
222 | + } else { | |
223 | + nextTick(() => { | |
224 | + dataForTypeMap[0][1](defaultValue); | |
225 | + }); | |
226 | + } | |
218 | 227 | }; |
219 | 228 | |
220 | 229 | //重置数据 | ... | ... |
... | ... | @@ -31,7 +31,11 @@ |
31 | 31 | :options="selectTenantOptions" |
32 | 32 | /> |
33 | 33 | </div> |
34 | - <Button class="ml-2" @click="handleTest(isSingleClickText)" type="primary" | |
34 | + <Button | |
35 | + :disabled="testDisabled" | |
36 | + class="ml-2" | |
37 | + @click="handleTest(isSingleClickText)" | |
38 | + type="primary" | |
35 | 39 | >{{ `${isSingleClickText === 'open' ? '打开' : '关闭'}测试接口` }} |
36 | 40 | </Button> |
37 | 41 | </div> |
... | ... | @@ -43,7 +47,7 @@ |
43 | 47 | <TestBodyCellTable :token="getToken" ref="testEditCellTableRef" /> |
44 | 48 | </div> |
45 | 49 | <div style="width: 30vw" v-else-if="data?.type === 'json'"> |
46 | - <JsonEditor ref="jsonEditorRef" /> | |
50 | + <JsonEditor style="width: 35vw; height: 30vh" ref="jsonEditorRef" /> | |
47 | 51 | </div> |
48 | 52 | <div style="width: 30vw" v-else-if="data?.type === 'xml'"> |
49 | 53 | <a-textarea v-model:value="xmlContent" placeholder="请输入xml" :rows="6" /> |
... | ... | @@ -102,6 +106,8 @@ |
102 | 106 | |
103 | 107 | const showTestEditCell = ref(false); |
104 | 108 | |
109 | + const testDisabled = ref(true); | |
110 | + | |
105 | 111 | const excuteData = ref({}); |
106 | 112 | |
107 | 113 | const selectTenant = ref(undefined); |
... | ... | @@ -121,12 +127,22 @@ |
121 | 127 | const getToken = ref(''); |
122 | 128 | |
123 | 129 | const onSelect = async (e) => { |
130 | + if (e) { | |
131 | + testDisabled.value = false; | |
132 | + } else { | |
133 | + testDisabled.value = true; | |
134 | + } | |
124 | 135 | selectSysTenant.value = undefined; |
125 | 136 | const rest = (await getTenantAllPageLists(e)) as any; |
126 | 137 | selectTenantOptions.value = rest?.map((m) => ({ label: m.realName, value: m.id })); |
127 | 138 | }; |
128 | 139 | |
129 | 140 | const onSelctTenant = async (e) => { |
141 | + if (e) { | |
142 | + testDisabled.value = false; | |
143 | + } else { | |
144 | + testDisabled.value = true; | |
145 | + } | |
130 | 146 | const { token } = await getUserToken(e); |
131 | 147 | getToken.value = token; |
132 | 148 | }; | ... | ... |
1 | 1 | <template> |
2 | 2 | <div v-if="showTestFlag" class="mt-8"> |
3 | 3 | <div> |
4 | - <Button @click="handleExcute" type="primary"> 执行测试请求 </Button> | |
4 | + <a-row> | |
5 | + <Button @click="handleExcute" type="primary"> 执行测试请求 </Button> | |
6 | + </a-row> | |
7 | + <a-row class="mt-8" type="flex" justify="center" align="middle"> | |
8 | + <a-col :span="2"> 测试地址 </a-col> | |
9 | + <a-col :span="22"> | |
10 | + <Tag color="blue" style="width: 31.6vw; white-space: normal; height: auto"> | |
11 | + {{ apiUrl?.split('{?')[0] }} | |
12 | + </Tag> | |
13 | + </a-col> | |
14 | + </a-row> | |
5 | 15 | </div> |
6 | 16 | <div class="mt-8"> |
7 | 17 | <a-row type="flex" justify="center"> |
8 | - <a-col :span="2"> 测试结果 </a-col> | |
9 | - <a-col :span="22"> | |
18 | + <a-col :span="24"> | |
10 | 19 | <JsonEditor |
11 | 20 | v-if="isWebSocketType === '2'" |
12 | 21 | style="width: 35vw; height: 40vh" |
... | ... | @@ -25,6 +34,7 @@ |
25 | 34 | import { useWebSocket } from '@vueuse/core'; |
26 | 35 | import { useUtils } from '../../../hooks/useUtils'; |
27 | 36 | import JsonEditor from '../../SimpleRequest/components/jsonEditor.vue'; |
37 | + import { Tag } from 'ant-design-vue'; | |
28 | 38 | |
29 | 39 | const emits = defineEmits(['emitExcute']); |
30 | 40 | |
... | ... | @@ -73,6 +83,8 @@ |
73 | 83 | |
74 | 84 | const isToken = ref(''); |
75 | 85 | |
86 | + const apiUrl = ref(''); | |
87 | + | |
76 | 88 | const isPostToken = ref(''); |
77 | 89 | |
78 | 90 | //执行测试接口 |
... | ... | @@ -93,7 +105,7 @@ |
93 | 105 | isToken.value = Objects?.Params?.token; |
94 | 106 | const body = Objects?.Body?.params; |
95 | 107 | isPostToken.value = Objects?.Body?.token; |
96 | - const apiUrl = url?.restfulFormat(params); | |
108 | + apiUrl.value = url?.restfulFormat(params); | |
97 | 109 | if (isWebSocketType.value === '2') { |
98 | 110 | socketUrls.value = url; |
99 | 111 | socketMessage.server = `${socketUrls.value}?token=${isToken.value}`; |
... | ... | @@ -105,24 +117,32 @@ |
105 | 117 | resetValue(false); |
106 | 118 | } |
107 | 119 | } else { |
108 | - const resp = await otherHttpRequest( | |
109 | - apiType, | |
110 | - apiUrl?.split('{?')[0], | |
111 | - headers, | |
112 | - params, | |
113 | - body, | |
114 | - isToken.value, | |
115 | - isPostToken.value | |
116 | - ); | |
117 | - if (!resp) return; | |
118 | - if (Object.prototype.toString.call(resp) === '[object Object]') { | |
119 | - jsonEditorRef.value?.setJsonValue(resp); | |
120 | - } else if (typeof resp === 'string') { | |
121 | - jsonEditorRef.value?.setJsonValue(resp); | |
122 | - } else if (Array.isArray(resp)) { | |
123 | - jsonEditorRef.value?.setJsonValue(JSON.stringify(resp)); | |
124 | - } else { | |
125 | - jsonEditorRef.value?.setJsonValue(JSON.stringify(resp)); | |
120 | + try { | |
121 | + const resp = await otherHttpRequest( | |
122 | + apiType, | |
123 | + apiUrl.value?.split('{?')[0], | |
124 | + headers, | |
125 | + params, | |
126 | + body, | |
127 | + isToken.value, | |
128 | + isPostToken.value | |
129 | + ); | |
130 | + if (!resp) return; | |
131 | + if (Object.prototype.toString.call(resp) === '[object Object]') { | |
132 | + jsonEditorRef.value?.setJsonValue(resp); | |
133 | + } else if (typeof resp === 'string') { | |
134 | + jsonEditorRef.value?.setJsonValue(resp); | |
135 | + } else if (Array.isArray(resp)) { | |
136 | + jsonEditorRef.value?.setJsonValue(JSON.stringify(resp)); | |
137 | + } else { | |
138 | + jsonEditorRef.value?.setJsonValue(JSON.stringify(resp)); | |
139 | + } | |
140 | + } catch (e) { | |
141 | + if (Object.prototype.toString.call(e) === '[object Object]') { | |
142 | + jsonEditorRef.value?.setJsonValue(e); | |
143 | + } else { | |
144 | + jsonEditorRef.value?.setJsonValue(JSON.stringify(e)); | |
145 | + } | |
126 | 146 | } |
127 | 147 | } |
128 | 148 | }; |
... | ... | @@ -184,33 +204,42 @@ |
184 | 204 | const { convertObj } = useUtils(); |
185 | 205 | switch (apiType) { |
186 | 206 | case 'GET': |
187 | - const objGet = Object.assign({}, headers, { 'X-Authorization': `Bearer ${token}` }); | |
207 | + const objGet = Object.assign({}, headers, { | |
208 | + 'X-Authorization': `Bearer ${!token ? postToken : token}`, | |
209 | + }); | |
188 | 210 | return await otherHttp.get( |
189 | 211 | { url: apiUrl, params, headers: objGet }, |
190 | 212 | { |
191 | 213 | apiUrl: '', |
192 | 214 | joinPrefix, |
193 | 215 | withToken: false, |
216 | + errorMessageMode: 'none', | |
194 | 217 | } |
195 | 218 | ); |
196 | 219 | case 'POST': |
197 | - const objPost = Object.assign({}, headers, { 'X-Authorization': `Bearer ${postToken}` }); | |
220 | + const objPost = Object.assign({}, headers, { | |
221 | + 'X-Authorization': `Bearer ${!postToken ? token : postToken}`, | |
222 | + }); | |
198 | 223 | return await otherHttp.post( |
199 | 224 | { url: `${apiUrl}?${convertObj(params)}`, data: body, headers: objPost }, |
200 | 225 | { |
201 | 226 | apiUrl: '', |
202 | 227 | joinPrefix, |
203 | 228 | withToken: false, |
229 | + errorMessageMode: 'none', | |
204 | 230 | } |
205 | 231 | ); |
206 | 232 | case 'PUT': |
207 | - const objPut = Object.assign({}, headers, { 'X-Authorization': `Bearer ${postToken}` }); | |
233 | + const objPut = Object.assign({}, headers, { | |
234 | + 'X-Authorization': `Bearer ${!postToken ? token : postToken}`, | |
235 | + }); | |
208 | 236 | return await otherHttp.put( |
209 | 237 | { url: `${apiUrl}?${convertObj(params)}`, data: body, headers: objPut, params }, |
210 | 238 | { |
211 | 239 | apiUrl: '', |
212 | 240 | joinPrefix, |
213 | 241 | withToken: false, |
242 | + errorMessageMode: 'none', | |
214 | 243 | } |
215 | 244 | ); |
216 | 245 | } |
... | ... | @@ -220,8 +249,10 @@ |
220 | 249 | if (flag) { |
221 | 250 | showTestFlag.value = false; |
222 | 251 | } |
223 | - jsonEditorRef.value?.setJsonValue({}); | |
224 | - jsonWebsocketEditorRef.value?.setJsonValue({}); | |
252 | + nextTick(() => { | |
253 | + jsonEditorRef.value?.setJsonValue('执行测试结果为:'); | |
254 | + jsonWebsocketEditorRef.value?.setJsonValue('执行测试结果为:'); | |
255 | + }); | |
225 | 256 | isWebSocketType.value = '0'; |
226 | 257 | }; |
227 | 258 | ... | ... |
... | ... | @@ -31,7 +31,11 @@ |
31 | 31 | :options="selectTenantOptions" |
32 | 32 | /> |
33 | 33 | </div> |
34 | - <Button class="ml-2" @click="handleTest(isSingleClickText)" type="primary" | |
34 | + <Button | |
35 | + :disabled="testDisabled" | |
36 | + class="ml-2" | |
37 | + @click="handleTest(isSingleClickText)" | |
38 | + type="primary" | |
35 | 39 | >{{ `${isSingleClickText === 'open' ? '打开' : '关闭'}测试接口` }} |
36 | 40 | </Button> |
37 | 41 | </div> |
... | ... | @@ -87,6 +91,8 @@ |
87 | 91 | |
88 | 92 | const selectTenantOptions = ref<selectType[]>([]); |
89 | 93 | |
94 | + const testDisabled = ref(true); | |
95 | + | |
90 | 96 | const { createMessage } = useMessage(); |
91 | 97 | |
92 | 98 | const showTestEditCell = ref(false); |
... | ... | @@ -104,12 +110,22 @@ |
104 | 110 | const getToken = ref(''); |
105 | 111 | |
106 | 112 | const onSelect = async (e) => { |
113 | + if (e) { | |
114 | + testDisabled.value = false; | |
115 | + } else { | |
116 | + testDisabled.value = true; | |
117 | + } | |
107 | 118 | selectSysTenant.value = undefined; |
108 | 119 | const rest = (await getTenantAllPageLists(e)) as any; |
109 | 120 | selectTenantOptions.value = rest?.map((m) => ({ label: m.realName, value: m.id })); |
110 | 121 | }; |
111 | 122 | |
112 | 123 | const onSelctTenant = async (e) => { |
124 | + if (e) { | |
125 | + testDisabled.value = false; | |
126 | + } else { | |
127 | + testDisabled.value = true; | |
128 | + } | |
113 | 129 | const { token } = await getUserToken(e); |
114 | 130 | getToken.value = token; |
115 | 131 | }; | ... | ... |
... | ... | @@ -21,7 +21,11 @@ |
21 | 21 | :options="selectTenantOptions" |
22 | 22 | /> |
23 | 23 | </div> |
24 | - <Button class="ml-2" @click="handleTest(isSingleClickText)" type="primary" | |
24 | + <Button | |
25 | + :disabled="isAdmin(role) ? testDisabled : false" | |
26 | + class="ml-2" | |
27 | + @click="handleTest(isSingleClickText)" | |
28 | + type="primary" | |
25 | 29 | >{{ `${isSingleClickText === 'open' ? '打开' : '关闭'}测试接口` }} |
26 | 30 | </Button> |
27 | 31 | </div> |
... | ... | @@ -77,6 +81,8 @@ |
77 | 81 | |
78 | 82 | const selectOptions = ref<selectType[]>([]); |
79 | 83 | |
84 | + const testDisabled = ref(true); | |
85 | + | |
80 | 86 | const selectTenantOptions = ref<selectType[]>([]); |
81 | 87 | |
82 | 88 | const { createMessage } = useMessage(); |
... | ... | @@ -98,24 +104,28 @@ |
98 | 104 | const getToken = ref(''); |
99 | 105 | |
100 | 106 | const onSelect = async (e) => { |
107 | + if (e) { | |
108 | + testDisabled.value = false; | |
109 | + } else { | |
110 | + testDisabled.value = true; | |
111 | + } | |
101 | 112 | selectSysTenant.value = undefined; |
102 | 113 | const rest = (await getTenantAllPageLists(e)) as any; |
103 | 114 | selectTenantOptions.value = rest?.map((m) => ({ label: m.realName, value: m.id })); |
104 | 115 | }; |
105 | 116 | |
106 | 117 | const onSelctTenant = async (e) => { |
118 | + if (e) { | |
119 | + testDisabled.value = false; | |
120 | + } else { | |
121 | + testDisabled.value = true; | |
122 | + } | |
107 | 123 | const { token } = await getUserToken(e); |
108 | 124 | getToken.value = token; |
109 | 125 | }; |
110 | 126 | const isSingleClickText = ref('open'); |
111 | 127 | |
112 | 128 | const handleTest = (o) => { |
113 | - if (isAdmin(role)) { | |
114 | - if (!selectTenant.value || !selectSysTenant.value) { | |
115 | - createMessage.error('请选择租户或者租户管理员'); | |
116 | - throw Error('请选择租户或者租户管理员'); | |
117 | - } | |
118 | - } | |
119 | 129 | if (o === 'open') { |
120 | 130 | showTestEditCell.value = true; |
121 | 131 | emits('testParamsInterface'); | ... | ... |
... | ... | @@ -10,6 +10,9 @@ |
10 | 10 | > |
11 | 11 | <BasicForm @register="registerForm"> |
12 | 12 | <template #selectMethods="{ model }"> |
13 | + <p style="display: none">{{ | |
14 | + watchRequestHttpTypeAndUrl(model['requestHttpTypeAndUrl']) | |
15 | + }}</p> | |
13 | 16 | <SimpleRequest |
14 | 17 | ref="simpleRequestRef" |
15 | 18 | v-if="model['requestContentType'] === '0' || model['requestContentType'] === '2'" |
... | ... | @@ -30,7 +33,7 @@ |
30 | 33 | </template> |
31 | 34 | <template #slotFillAddress="{ model }"> |
32 | 35 | <div> |
33 | - <Tag style="height: 3.3vh; line-height: 3.3vh"> | |
36 | + <Tag color="blue" style="width: 35vw; white-space: normal; height: auto"> | |
34 | 37 | {{ |
35 | 38 | ` ${ |
36 | 39 | model['originUrlType'] !== 'server_url' |
... | ... | @@ -51,7 +54,7 @@ |
51 | 54 | </div> |
52 | 55 | </template> |
53 | 56 | <script lang="ts" setup name="publicApi"> |
54 | - import { ref, nextTick } from 'vue'; | |
57 | + import { ref, nextTick, watch } from 'vue'; | |
55 | 58 | import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; |
56 | 59 | import { BasicForm, useForm } from '/@/components/Form'; |
57 | 60 | import { schemas } from './config'; |
... | ... | @@ -84,6 +87,31 @@ |
84 | 87 | return isServerUrl(method, type); |
85 | 88 | }; |
86 | 89 | |
90 | + const watchRequestHttpTypeAndUrlStr = ref(''); | |
91 | + | |
92 | + const watchRequestHttpTypeAndUrl = (o) => { | |
93 | + watchRequestHttpTypeAndUrlStr.value = o; | |
94 | + }; | |
95 | + | |
96 | + watch( | |
97 | + () => watchRequestHttpTypeAndUrlStr.value, | |
98 | + (newValue: any) => { | |
99 | + if (!newValue?.requestUrl) return; | |
100 | + if (newValue?.requestUrl.includes('{entityType}')) { | |
101 | + simpleRequestRef.value?.setValue(null, true, [ | |
102 | + { | |
103 | + key: 'scope', | |
104 | + value: 'entityType', | |
105 | + required: true, | |
106 | + }, | |
107 | + ]); | |
108 | + } | |
109 | + }, | |
110 | + { | |
111 | + deep: true, | |
112 | + } | |
113 | + ); | |
114 | + | |
87 | 115 | const [registerForm, { resetFields, validate, setFieldsValue, updateSchema }] = useForm({ |
88 | 116 | labelWidth: 120, |
89 | 117 | schemas, |
... | ... | @@ -118,7 +146,7 @@ |
118 | 146 | requestUrl: data.record?.requestUrl, |
119 | 147 | }, |
120 | 148 | }); |
121 | - await nextTick(() => simpleRequestRef.value?.setValue(data.record)); | |
149 | + await nextTick(() => simpleRequestRef.value?.setValue(data.record, false, [])); | |
122 | 150 | updateSchema({ |
123 | 151 | field: 'requestHttpTypeAndUrl', |
124 | 152 | componentProps: { | ... | ... |