Commit 0de4e209d935ec18f9a3dc2dab63dc52508c97d9
Merge branch 'ft' into 'main_dev'
feat: 新增自定义过滤器编写和优化公共接口管理部分代码 See merge request yunteng/thingskit-front!604
Showing
5 changed files
with
78 additions
and
42 deletions
| ... | ... | @@ -96,7 +96,7 @@ |
| 96 | 96 | await nextTick(); |
| 97 | 97 | const jsCode = aceEditor.value.getValue(); |
| 98 | 98 | const res = getRestData.value ?? props.restData; |
| 99 | - const fn = new Function('data', 'res', jsCode)(res?.data, res); | |
| 99 | + const fn = new Function('res', jsCode)(res); | |
| 100 | 100 | emits('changeAceContent', fn); |
| 101 | 101 | } catch (error) { |
| 102 | 102 | return `过滤函数错误,日志:${error}`; |
| ... | ... | @@ -115,7 +115,8 @@ |
| 115 | 115 | return aceEditor?.value?.getValue(); |
| 116 | 116 | }; |
| 117 | 117 | |
| 118 | - const setValue = (data) => { | |
| 118 | + const setValue = async (data) => { | |
| 119 | + await nextTick(); | |
| 119 | 120 | return aceEditor?.value?.setValue(data); |
| 120 | 121 | }; |
| 121 | 122 | ... | ... |
| ... | ... | @@ -94,6 +94,9 @@ |
| 94 | 94 | interfaceType: { |
| 95 | 95 | type: String, |
| 96 | 96 | }, |
| 97 | + filterValue: { | |
| 98 | + type: String, | |
| 99 | + }, | |
| 97 | 100 | }); |
| 98 | 101 | |
| 99 | 102 | const emits = defineEmits(['activeKey']); |
| ... | ... | @@ -142,7 +145,6 @@ |
| 142 | 145 | |
| 143 | 146 | const onCloseTest = () => excuteTestRef.value?.resetValue(true); |
| 144 | 147 | |
| 145 | - //if-else-if-else分支优化 | |
| 146 | 148 | const dataForTypeMap = [ |
| 147 | 149 | [(type) => type === 'Params', (data) => paramsCellTableRef.value?.setValue(data)], |
| 148 | 150 | [(type) => type === 'Body', (data) => bodyRef.value?.setValue(data)], |
| ... | ... | @@ -191,9 +193,14 @@ |
| 191 | 193 | }; |
| 192 | 194 | }; |
| 193 | 195 | |
| 194 | - const handleTestParamsInterface = () => { | |
| 196 | + const commonExcuteRef = () => { | |
| 195 | 197 | excuteTestRef.value?.showTest(); |
| 196 | 198 | excuteTestRef.value?.resetValue(false); |
| 199 | + excuteTestRef.value?.editSetFilterValue(props.filterValue); | |
| 200 | + }; | |
| 201 | + | |
| 202 | + const handleTestParamsInterface = () => { | |
| 203 | + commonExcuteRef(); | |
| 197 | 204 | let value = getValue(false) as any; |
| 198 | 205 | dataMap.mapParamsObj = { |
| 199 | 206 | list: value?.Params, |
| ... | ... | @@ -204,8 +211,7 @@ |
| 204 | 211 | const handleTestBodyInterface = () => { |
| 205 | 212 | let value = getValue(false) as any; |
| 206 | 213 | const type = value?.Body?.requestParamsBodyType; |
| 207 | - excuteTestRef.value?.showTest(); | |
| 208 | - excuteTestRef.value?.resetValue(false); | |
| 214 | + commonExcuteRef(); | |
| 209 | 215 | let values = []; |
| 210 | 216 | for (let i in value?.Body) if (i === type) values = value?.Body[i]; |
| 211 | 217 | dataMap.mapBodyObj = { |
| ... | ... | @@ -216,8 +222,7 @@ |
| 216 | 222 | }; |
| 217 | 223 | |
| 218 | 224 | const handleTestHeaderInterface = () => { |
| 219 | - excuteTestRef.value?.showTest(); | |
| 220 | - excuteTestRef.value?.resetValue(false); | |
| 225 | + commonExcuteRef(); | |
| 221 | 226 | let value = getValue(false) as any; |
| 222 | 227 | dataMap.mapHeaderObj = { |
| 223 | 228 | list: value?.Header, | ... | ... |
| ... | ... | @@ -22,7 +22,7 @@ |
| 22 | 22 | method === RequestMethodTypeEnum.WEBSOCKET |
| 23 | 23 | ? 11 |
| 24 | 24 | : httpType === RequestHttpTypeEnum.POST |
| 25 | - ? 4 | |
| 25 | + ? 6 | |
| 26 | 26 | : 6 |
| 27 | 27 | " |
| 28 | 28 | > |
| ... | ... | @@ -41,7 +41,7 @@ |
| 41 | 41 | method === RequestMethodTypeEnum.WEBSOCKET |
| 42 | 42 | ? 12 |
| 43 | 43 | : httpType === RequestHttpTypeEnum.POST |
| 44 | - ? 19 | |
| 44 | + ? 17 | |
| 45 | 45 | : 17 |
| 46 | 46 | " |
| 47 | 47 | style="position: relative" |
| ... | ... | @@ -50,7 +50,7 @@ |
| 50 | 50 | (method === RequestMethodTypeEnum.WEBSOCKET |
| 51 | 51 | ? 1.5 |
| 52 | 52 | : httpType === RequestHttpTypeEnum.POST |
| 53 | - ? -1.5 | |
| 53 | + ? -0.25 | |
| 54 | 54 | : 0) + 'vw', |
| 55 | 55 | }" |
| 56 | 56 | > |
| ... | ... | @@ -236,9 +236,9 @@ |
| 236 | 236 | send(JSON.stringify(socketMessage.sendValue)); |
| 237 | 237 | }, |
| 238 | 238 | onMessage(_, e) { |
| 239 | - const { data } = JSON.parse(e.data); | |
| 240 | - getRestData.value = data; | |
| 241 | - commonRest(data, jsonEditorRef.value?.setJsonValue); | |
| 239 | + const rest = JSON.parse(e.data); | |
| 240 | + getRestData.value = rest; | |
| 241 | + commonRest(rest, jsonEditorRef.value?.setJsonValue); | |
| 242 | 242 | }, |
| 243 | 243 | onDisconnected() { |
| 244 | 244 | close(); |
| ... | ... | @@ -308,10 +308,17 @@ |
| 308 | 308 | return aceTypeIsJsEditorRef?.value?.getValue(); |
| 309 | 309 | }; |
| 310 | 310 | |
| 311 | + //编辑回显过滤器函数的内容 | |
| 312 | + const editSetFilterValue = async (filterValue) => { | |
| 313 | + await nextTick(); | |
| 314 | + aceTypeIsJsEditorRef?.value?.setValue(filterValue); | |
| 315 | + }; | |
| 316 | + | |
| 311 | 317 | defineExpose({ |
| 312 | 318 | resetValue, |
| 313 | 319 | showTest, |
| 314 | 320 | getFilterValue, |
| 321 | + editSetFilterValue, | |
| 315 | 322 | }); |
| 316 | 323 | </script> |
| 317 | 324 | ... | ... |
| ... | ... | @@ -25,6 +25,7 @@ |
| 25 | 25 | :requestOriginUrl="model['requestOriginUrl']" |
| 26 | 26 | :originUrlType="model['originUrlType']" |
| 27 | 27 | :interfaceType="model['interfaceType']" |
| 28 | + :filterValue="editSetFilter" | |
| 28 | 29 | /> |
| 29 | 30 | </template> |
| 30 | 31 | <template #slotFillAddress="{ model }"> |
| ... | ... | @@ -71,7 +72,13 @@ |
| 71 | 72 | import { Tag } from 'ant-design-vue'; |
| 72 | 73 | import { RequestMethodTypeEnum, RequestOriginTypeEnum } from './config/enum'; |
| 73 | 74 | |
| 74 | - const { resetReqHttpType, isServerUrl, resetUpdateSchema } = useUtils(); | |
| 75 | + const { | |
| 76 | + resetReqHttpType, | |
| 77 | + isServerUrl, | |
| 78 | + resetUpdateSchema, | |
| 79 | + validateRequestTypeAndUrl, | |
| 80 | + getOriginUrlType, | |
| 81 | + } = useUtils(); | |
| 75 | 82 | |
| 76 | 83 | const emits = defineEmits(['success', 'register']); |
| 77 | 84 | |
| ... | ... | @@ -81,6 +88,8 @@ |
| 81 | 88 | |
| 82 | 89 | const putId = ref(''); |
| 83 | 90 | |
| 91 | + const editSetFilter = ref(''); | |
| 92 | + | |
| 84 | 93 | const simpleRequestRef = ref<InstanceType<typeof SimpleRequest>>(); |
| 85 | 94 | |
| 86 | 95 | const templateFillAddress = (method, type) => { |
| ... | ... | @@ -126,9 +135,11 @@ |
| 126 | 135 | setDrawerProps({ title }); |
| 127 | 136 | updateSchema(resetUpdateSchema); |
| 128 | 137 | isUpdate.value = data.isUpdate; |
| 129 | - !isUpdate.value ? (putId.value = '') : (putId.value = data.record.id); | |
| 138 | + !isUpdate.value ? (putId.value = '') : (putId.value = data.record?.id); | |
| 130 | 139 | simpleRequestRef.value?.resetValue(); |
| 140 | + editSetFilter.value = ''; | |
| 131 | 141 | if (isUpdate.value) { |
| 142 | + editSetFilter.value = data.record?.filter; | |
| 132 | 143 | await setFieldsValue({ |
| 133 | 144 | ...data.record, |
| 134 | 145 | requestContentType: String(data.record?.requestContentType), |
| ... | ... | @@ -152,31 +163,14 @@ |
| 152 | 163 | }); |
| 153 | 164 | |
| 154 | 165 | const handleSubmit = async () => { |
| 155 | - setDrawerProps({ loading: true }); | |
| 156 | 166 | try { |
| 167 | + setDrawerProps({ loading: true }); | |
| 157 | 168 | const values = await validate(); |
| 158 | 169 | if (!values) return; |
| 159 | - const isRequestHttpTypeAndUrlEmpty = values?.requestHttpTypeAndUrl; | |
| 160 | - if (values.requestContentType === RequestMethodTypeEnum.COMMOM) { | |
| 161 | - if ( | |
| 162 | - !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestHttpType') || | |
| 163 | - !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl') | |
| 164 | - ) { | |
| 165 | - createMessage.error('请填写请求类型&地址'); | |
| 166 | - throw Error('请填写请求类型&地址'); | |
| 167 | - } | |
| 168 | - } else if (values.requestContentType === RequestMethodTypeEnum.WEBSOCKET) { | |
| 169 | - if (!Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl')) { | |
| 170 | - createMessage.error('请填写请求类型&地址'); | |
| 171 | - throw Error('请填写请求类型&地址'); | |
| 172 | - } | |
| 173 | - } | |
| 170 | + validateRequestTypeAndUrl(values); | |
| 174 | 171 | const Objects = simpleRequestRef.value?.getValue(true); |
| 175 | 172 | const filter = simpleRequestRef.value?.getFilterValue(); |
| 176 | - const requestOriginUrl = | |
| 177 | - values['originUrlType'] === RequestOriginTypeEnum.SERVER_URL | |
| 178 | - ? 'localhost' | |
| 179 | - : values['requestOriginUrl']; | |
| 173 | + const requestOriginUrl = getOriginUrlType(values); | |
| 180 | 174 | const data = { |
| 181 | 175 | ...values, |
| 182 | 176 | id: !putId.value ? null : putId.value, |
| ... | ... | @@ -186,7 +180,7 @@ |
| 186 | 180 | }, |
| 187 | 181 | ...Objects, |
| 188 | 182 | }), |
| 189 | - filter: !filter ? null : filter, | |
| 183 | + filter: !putId.value ? filter : filter ? filter : editSetFilter.value, | |
| 190 | 184 | requestOriginUrl, |
| 191 | 185 | requestHttpType: values['requestHttpTypeAndUrl']?.requestHttpType, |
| 192 | 186 | requestUrl: values['requestHttpTypeAndUrl']?.requestUrl, | ... | ... |
| 1 | 1 | import { commonHttpPlaceHolder, websocketPlaceHolder } from '../config/constants'; |
| 2 | -import { RequestMethodTypeEnum } from '../config/enum'; | |
| 2 | +import { RequestMethodTypeEnum, RequestOriginTypeEnum } from '../config/enum'; | |
| 3 | 3 | import { otherHttp } from '/@/utils/http/axios'; |
| 4 | 4 | import { tableItems } from '../config/types'; |
| 5 | +import { useMessage } from '/@/hooks/web/useMessage'; | |
| 5 | 6 | |
| 6 | 7 | export const useUtils = () => { |
| 8 | + const { createMessage } = useMessage(); | |
| 7 | 9 | //获取多个key |
| 8 | 10 | const getMultipleKeys = (list) => { |
| 9 | 11 | let temps = []; |
| ... | ... | @@ -164,10 +166,7 @@ export const useUtils = () => { |
| 164 | 166 | } else if (typeof data === 'string') { |
| 165 | 167 | fn(data); |
| 166 | 168 | } else if (Array.isArray(data)) { |
| 167 | - const temp = { | |
| 168 | - data, | |
| 169 | - }; | |
| 170 | - fn(temp); | |
| 169 | + fn(data); | |
| 171 | 170 | } else { |
| 172 | 171 | fn(JSON.stringify(data)); |
| 173 | 172 | } |
| ... | ... | @@ -231,6 +230,34 @@ export const useUtils = () => { |
| 231 | 230 | } |
| 232 | 231 | } |
| 233 | 232 | |
| 233 | + //验证请求类型&地址 | |
| 234 | + const errorMsg = () => { | |
| 235 | + createMessage.error('请填写请求类型&地址'); | |
| 236 | + throw Error('请填写请求类型&地址'); | |
| 237 | + }; | |
| 238 | + const validateRequestTypeAndUrl = (values) => { | |
| 239 | + const isRequestHttpTypeAndUrlEmpty = values?.requestHttpTypeAndUrl; | |
| 240 | + if (values.requestContentType === RequestMethodTypeEnum.COMMOM) { | |
| 241 | + if ( | |
| 242 | + !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestHttpType') || | |
| 243 | + !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl') | |
| 244 | + ) { | |
| 245 | + return errorMsg(); | |
| 246 | + } | |
| 247 | + } else if (values.requestContentType === RequestMethodTypeEnum.WEBSOCKET) { | |
| 248 | + if (!Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl')) { | |
| 249 | + return errorMsg(); | |
| 250 | + } | |
| 251 | + } | |
| 252 | + }; | |
| 253 | + | |
| 254 | + //获取originUrlType | |
| 255 | + const getOriginUrlType = (values) => { | |
| 256 | + return values['originUrlType'] === RequestOriginTypeEnum.SERVER_URL | |
| 257 | + ? 'localhost' | |
| 258 | + : values['requestOriginUrl']; | |
| 259 | + }; | |
| 260 | + | |
| 234 | 261 | return { |
| 235 | 262 | getMultipleKeys, |
| 236 | 263 | pushObj, |
| ... | ... | @@ -246,5 +273,7 @@ export const useUtils = () => { |
| 246 | 273 | commonParams, |
| 247 | 274 | CommonFuncValue, |
| 248 | 275 | ParamsFuncValue, |
| 276 | + validateRequestTypeAndUrl, | |
| 277 | + getOriginUrlType, | |
| 249 | 278 | }; |
| 250 | 279 | }; | ... | ... |