Commit 404e3c93e1a444d69e9da13ce53e76cd8ef0e8b6

Authored by ww
1 parent 8b389c18

feat(dynamic request): 新增动态接口body参数和header参数

1   -import { RequestBodyEnum } from "@/enums/httpEnum"
  1 +import { RequestBodyEnum, RequestParams } from "@/enums/httpEnum"
2 2 import { ExternalRequestType, ExtraRequestConfigType } from "@/store/external/modules/extraComponentInfo.d"
3 3 import { RequestConfigType, RequestGlobalConfigType } from "@/store/modules/chartEditStore/chartEditStore.d"
4 4 import { defHttp } from "@/utils/external/http/axios"
... ... @@ -16,12 +16,19 @@ const getOriginUrl = (originUrl: string) => {
16 16 const regOptionalParams = /(?={\?)/g
17 17 const regDynamicParams = /(?={).+?(?<=})/g
18 18
  19 +/**
  20 + * @description 判断是否是动态参数
  21 + * @param url
  22 + */
19 23 export const isDynamicUrl = (url: string) => {
20 24 regDynamicParams.lastIndex = 0
21   -
22 25 return regDynamicParams.test(url)
23 26 }
24 27
  28 +/**
  29 + * @description 解析动态参数
  30 + * @param url
  31 + */
25 32 export const decomposeDynamicParams = (url: string) => {
26 33 regDynamicParams.lastIndex = 0
27 34 regOptionalParams.lastIndex = 0
... ... @@ -35,6 +42,48 @@ export const decomposeDynamicParams = (url: string) => {
35 42 })
36 43 }
37 44
  45 +/**
  46 + * @description 正则替换url中的动态参数
  47 + * @param requestUrl
  48 + * @param Params
  49 + */
  50 +const getDynamicRequestUrl = (requestUrl = '', Params: Recordable) => {
  51 + requestUrl = decodeURI(requestUrl || '')
  52 +
  53 + const paramsList = decomposeDynamicParams(requestUrl)
  54 + requestUrl = paramsList.reduce((prev, next) => {
  55 + const { type, value, originValue } = next
  56 + if (type === ParamsType.REQUIRED) {
  57 + value.forEach(key => {
  58 + prev = prev.replace(key, Reflect.get(Params, key))
  59 + Reflect.deleteProperty(Params, key)
  60 + })
  61 + }
  62 +
  63 + if (type === ParamsType.OPTIONAL) {
  64 + prev = prev.replace(originValue, '')
  65 + }
  66 +
  67 + return prev
  68 + }, requestUrl)
  69 +
  70 + return requestUrl.replaceAll(/[{}?]/g, '')
  71 +}
  72 +
  73 +const transformBodyValue = (body: RequestParams['Body'], requestParamsBodyType: RequestBodyEnum) => {
  74 + let value = Reflect.get(body, requestParamsBodyType)
  75 +
  76 + if (requestParamsBodyType === RequestBodyEnum.FORM_DATA) {
  77 + const formData = new FormData()
  78 + Object.keys(value as RequestParams['Body']['form-data']).forEach(key => {
  79 + formData.append(key, value[key])
  80 + })
  81 + value = formData
  82 + }
  83 +
  84 + return value
  85 +}
  86 +
38 87 export const customRequest = async (request: RequestConfigType) => {
39 88 console.log(request)
40 89 const { requestHttpType, requestParams, requestParamsBodyType, requestOriginUrl } = request as ExtraRequestConfigType
... ... @@ -44,35 +93,13 @@ export const customRequest = async (request: RequestConfigType) => {
44 93 Params = JSON.parse(JSON.stringify(Params))
45 94 const isDynamicUrlFlag = isDynamicUrl(requestUrl || '')
46 95
47   -
48   -
49 96 if (isDynamicUrlFlag) {
50   - requestUrl = decodeURI(requestUrl || '')
51   -
52   - const paramsList = decomposeDynamicParams(requestUrl)
53   - requestUrl = paramsList.reduce((prev, next) => {
54   - const { type, value, originValue } = next
55   - if (type === ParamsType.REQUIRED) {
56   - value.forEach(key => {
57   - prev = prev.replace(key, Reflect.get(Params, key))
58   - Reflect.deleteProperty(Params, key)
59   - })
60   - }
61   -
62   - if (type === ParamsType.OPTIONAL) {
63   - prev = prev.replace(originValue, '')
64   - }
65   -
66   - return prev
67   - }, requestUrl)
68   -
69   - requestUrl = requestUrl.replaceAll(/[{}?]/g, '')
  97 + requestUrl = getDynamicRequestUrl(requestUrl, Params)
70 98 }
71 99
72   - const body = Body[requestParamsBodyType as Exclude<'NONE', keyof typeof RequestBodyEnum>]
  100 + const body = transformBodyValue(Body, requestParamsBodyType)
  101 + console.log({ body, requestParamsBodyType, Params })
73 102
74   - Reflect.deleteProperty(Params, 'date')
75   - console.log(Header)
76 103 return defHttp.request<any>({
77 104 url: requestUrl,
78 105 baseURL: getOriginUrl(requestOriginUrl!),
... ...
1   -import { RequestParams as OriginRequestParams } from "@/enums/httpEnum"
  1 +import { RequestBodyEnum, RequestParams as OriginRequestParams } from "@/enums/httpEnum"
2 2
3 3 export enum PublicInterfaceStateEnum {
4 4 PUBLISH = 1,
5 5 UN_PUBLISH = 0
6 6 }
7 7
8   -export interface RequestParams {
9   - Body: Recordable
10   - Header: Recordable
11   - Params: {
12   - key: string
13   - required: boolean
14   - value: string
15   - }[]
  8 +export interface ParamsItemType {
  9 + key: string
  10 + required: boolean
  11 + value: string
  12 +}
  13 +
  14 +export interface PublicInterfaceRequestParams {
  15 + Body: {
  16 + requestParamsBodyType?: RequestBodyEnum
  17 + [RequestBodyEnum.XML]: string
  18 + [RequestBodyEnum.JSON]: string
  19 + [RequestBodyEnum.FORM_DATA]: ParamsItemType[]
  20 + [RequestBodyEnum.X_WWW_FORM_URLENCODED]: ParamsItemType[]
  21 + }
  22 + Header: ParamsItemType[]
  23 + Params: ParamsItemType[]
16 24 }
17 25
18 26 export interface PublicInterfaceRecord {
... ... @@ -29,7 +37,7 @@ export interface PublicInterfaceRecord {
29 37 requestHttpType: string,
30 38 requestParamsBodyType: string,
31 39 requestUrl: string,
32   - requestParams: string | OriginRequestParams,
  40 + requestParams: string,
33 41 }
34 42
35 43
... ...
1 1 <script lang="ts" setup>
2   -import { PublicInterfaceRecord } from '@/api/external/dynamicRequest/model';
  2 +import { ParamsItemType, PublicInterfaceRecord } from '@/api/external/dynamicRequest/model';
3 3 import { RequestParams } from '@/enums/httpEnum';
4 4 import { FormItemInst, NDatePicker, NForm, NFormItem, NInput, NSelect, NTreeSelect } from 'naive-ui'
5   -import { computed, ref, unref, watch } from 'vue';
6   -import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm';
7   -import { transferData } from './utils';
  5 +import { computed, nextTick, ref, unref, watch } from 'vue';
  6 +import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm';
8 7
9 8 const props = defineProps<{
10   - publicInterfaceRecord: PublicInterfaceRecord
  9 + paramsItemList: ParamsItemType[]
11 10 }>()
12 11
13 12 const componentMap: { [key in ComponentType]?: any } = {
... ... @@ -17,15 +16,16 @@ const componentMap: { [key in ComponentType]?: any } = {
17 16 [ComponentType.DATE_PICKER]: NDatePicker
18 17 }
19 18
20   -const getPublicInterfaceRecord = computed(() => {
21   - return props.publicInterfaceRecord
  19 +const getParamsItemList = computed(() => {
  20 + return props.paramsItemList
22 21 })
  22 +
23 23 const dynamicFormItemEl = ref<FormItemInst[]>()
24 24
25   -const { getDynamicFormSchemas, validFlag, getValue, createForm, clearParams, setDynamicFormValue } = useDynamicPublicForm(getPublicInterfaceRecord)
  25 +const { getDynamicFormSchemas, validFlag, getValue, createForm, clearParams, setDynamicFormValue } = useDynamicPublicForm(getParamsItemList)
26 26
27 27 const getConfigurationData = () => {
28   - return transferData(unref(getPublicInterfaceRecord), unref(getValue))
  28 + return unref(getValue)
29 29 }
30 30
31 31 const validate = async () => {
... ... @@ -34,12 +34,13 @@ const validate = async () => {
34 34 }
35 35 return unref(validFlag)
36 36 }
37   -const setConfigurationData = async (requestParams: RequestParams) => {
38   - setDynamicFormValue(requestParams)
  37 +const setConfigurationData = async (params: Recordable) => {
  38 + await nextTick()
  39 + setDynamicFormValue(params)
39 40 }
40 41
41 42 watch(
42   - () => props.publicInterfaceRecord,
  43 + () => props.paramsItemList,
43 44 (newValue) => {
44 45 if (newValue) {
45 46 clearParams()
... ...
1 1 import { getDictItemByCode } from "@/api/external/common"
2 2 import { DictItem } from "@/api/external/common/model"
3 3 import { getDeviceAttrList, getDeviceList, getDeviceProfileList, getOrgList } from "@/api/external/dynamicRequest"
4   -import { PublicInterfaceRecord, RequestParams } from "@/api/external/dynamicRequest/model"
  4 +import { ParamsItemType, PublicInterfaceRecord, PublicInterfaceRequestParams } from "@/api/external/dynamicRequest/model"
5 5 import { RequestConfigType } from "@/store/modules/chartEditStore/chartEditStore.d"
6 6 import { DatePickerProps, FormItemRule, InputProps, SelectProps, TreeSelectProps } from "naive-ui"
7   -import { computed, onMounted, reactive, Ref, ref, unref, watch } from "vue"
  7 +import { computed, onMounted, reactive, Ref, ref, unref } from "vue"
8 8 import { DictEnum } from '@/enums/external/dictEnum'
9 9
10 10 const GROUP_SEPARATOR = ','
... ... @@ -41,12 +41,10 @@ const isDateComponent = (type: BuiltInVariable) => {
41 41 return [BuiltInVariable.DATE_FIXED, BuiltInVariable.DATE_RANGE].includes(type)
42 42 }
43 43
44   -export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceRecord>) => {
  44 +export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => {
45 45
46   - const getParams = computed(() => {
47   - let params = (publicInterfaceRef.value.requestParams as unknown as RequestParams).Params || []
48   - if (!Array.isArray(params)) params = []
49   - return params
  46 + const getParams = computed<ParamsItemType[]>(() => {
  47 + return unref(paramsItemList) || []
50 48 })
51 49
52 50 const getUsedBuiltInVariable = computed(() => {
... ... @@ -312,8 +310,8 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
312 310
313 311 }
314 312
315   - const getDynamicFormSchemas = computed(() => {
316   - return unref(getParams).reduce((prev, { key, value, required }) => {
  313 + const getDynamicFormSchemas = computed<DynamicFormSchema[]>(() => {
  314 + return unref(getParams).reduce((prev: DynamicFormSchema[], { key, value, required }) => {
317 315 const schemas = toFormSchemas(key, required, value)
318 316 return [...prev, ...schemas]
319 317 }, [] as DynamicFormSchema[])
... ... @@ -342,7 +340,7 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
342 340 for (const temp of splitKeys) {
343 341 params[temp] = Params[temp]
344 342 }
345   - }
  343 + }
346 344 }
347 345
348 346 const clearParams = () => {
... ... @@ -351,9 +349,8 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
351 349 })
352 350 }
353 351
354   - const setDynamicFormValue = (requestParams: RequestConfigType['requestParams']) => {
355   - const { Params } = requestParams
356   - setParams(Params)
  352 + const setDynamicFormValue = (params: Recordable) => {
  353 + setParams(params)
357 354 getOrgOption()
358 355 getDeviceProfileOption()
359 356 getDeviceOption()
... ...
1   -import { PublicInterfaceRecord } from "@/api/external/dynamicRequest/model"
  1 +import { PublicInterfaceRecord, PublicInterfaceRequestParams } from "@/api/external/dynamicRequest/model"
2 2 import { RequestDataTypeEnum, RequestParams } from "@/enums/httpEnum"
3   -import { ExternalRequestType } from "@/store/external/modules/extraComponentInfo.d"
  3 +import { ExtraRequestConfigType } from "@/store/external/modules/extraComponentInfo.d"
4 4 import { unref } from "vue"
5 5
6   -export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, fillParams: Recordable, fillBody: Recordable = {}) => {
7   - const { requestContentType, requestHttpType, id, requestUrl, requestOriginUrl, requestParams } = publicInterfaceRecord
8   - const { Header, Body } = requestParams as RequestParams
  6 +export const extraPublicInterfaceInfo = (publicInterfaceRecord: PublicInterfaceRecord) => {
  7 + const { requestContentType, requestHttpType, id, requestUrl, requestOriginUrl, requestParams = {} } = unref(publicInterfaceRecord)
  8 + const { Body = {} } = requestParams as unknown as PublicInterfaceRequestParams
9 9 const { requestParamsBodyType } = Body as Recordable
10 10 return {
11 11 requestDataPondId: id,
... ... @@ -28,10 +28,15 @@ export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, fillP
28 28 // }
29 29 // requestIntervalUnit
30 30 requestParams: {
31   - Header,
32   - Body: unref(fillBody),
33   - Params: unref(fillParams)
34   - }
  31 + Header: {},
  32 + Body: {
  33 + 'form-data': {},
  34 + 'json': '',
  35 + 'x-www-form-urlencoded': {},
  36 + xml: ''
  37 + },
  38 + Params: {}
  39 + } as RequestParams
35 40
36   - } as ExternalRequestType
  41 + } as ExtraRequestConfigType
37 42 }
... ...
  1 +<script lang="ts" setup>
  2 +import { ParamsItemType, PublicInterfaceRequestParams } from '@/api/external/dynamicRequest/model';
  3 +import { MonacoEditor } from '@/components/Pages/MonacoEditor';
  4 +import { RequestBodyEnum, RequestBodyEnumList, RequestParams } from '@/enums/httpEnum';
  5 +import { NCard, NText, NRadioGroup, NRadio, NSpace } from 'naive-ui';
  6 +import { computed, ref, unref } from 'vue';
  7 +import { DynamicForm } from '../DynamicForm';
  8 +
  9 +const editorValue = ref('')
  10 +
  11 +const requestParamsBodyType = ref(RequestBodyEnum.X_WWW_FORM_URLENCODED)
  12 +
  13 +const paramsItemList = ref<ParamsItemType[]>([])
  14 +
  15 +const dynamicFormEl = ref<Nullable<InstanceType<typeof DynamicForm>>>(null)
  16 +
  17 +const getLanguage = computed(() => {
  18 + return unref(requestParamsBodyType) === RequestBodyEnum.JSON
  19 + ? 'json'
  20 + : unref(requestParamsBodyType) === RequestBodyEnum.XML
  21 + ? 'xml'
  22 + : 'json'
  23 +})
  24 +
  25 +const isDynamicForm = computed(() => {
  26 + return [RequestBodyEnum.FORM_DATA, RequestBodyEnum.X_WWW_FORM_URLENCODED].includes(unref(requestParamsBodyType))
  27 +})
  28 +
  29 +const isEditor = computed(() => {
  30 + return [RequestBodyEnum.XML, RequestBodyEnum.JSON].includes(unref(requestParamsBodyType))
  31 +})
  32 +
  33 +const setConfigurationData = (params: PublicInterfaceRequestParams['Body'], value: Recordable) => {
  34 + const { requestParamsBodyType: type, } = params || {}
  35 + if (!type) return
  36 + requestParamsBodyType.value = type
  37 +
  38 + const paramsValue = Reflect.get(params, type)
  39 + if (unref(isEditor)) {
  40 + editorValue.value = paramsValue
  41 + } else if (unref(isDynamicForm)) {
  42 + paramsItemList.value = paramsValue
  43 + const needSetValue = Reflect.get(value, type)
  44 + unref(dynamicFormEl)?.setConfigurationData(needSetValue)
  45 + }
  46 +
  47 +}
  48 +
  49 +const getConfigurationData = () => {
  50 + const value = unref(dynamicFormEl)?.getConfigurationData()
  51 + const getValue = unref(isDynamicForm) ? value : unref(isEditor) ? unref(editorValue) : {}
  52 + const record = {
  53 + 'form-data': {},
  54 + 'x-www-form-urlencoded': {},
  55 + xml: '',
  56 + json: ''
  57 + } as RequestParams['Body']
  58 +
  59 + Reflect.set(record, unref(requestParamsBodyType), getValue)
  60 + return record
  61 +}
  62 +
  63 +defineExpose({
  64 + getConfigurationData,
  65 + setConfigurationData
  66 +})
  67 +
  68 +</script>
  69 +
  70 +<template>
  71 + <section>
  72 + <NRadioGroup :value="requestParamsBodyType" style="margin-bottom: 20px;">
  73 + <NSpace>
  74 + <NRadio v-for="item in RequestBodyEnumList" :key="item" :value="item" :disabled="item !== requestParamsBodyType">
  75 + {{ item }}
  76 + </NRadio>
  77 + </NSpace>
  78 + </NRadioGroup>
  79 + <NCard>
  80 + <NCard v-if="requestParamsBodyType === RequestBodyEnum.NONE">
  81 + <NText depth="3">该接口没有 Body 体</NText>
  82 + </NCard>
  83 + <DynamicForm v-if="isDynamicForm" ref="dynamicFormEl" :paramsItemList="paramsItemList" />
  84 + <MonacoEditor v-if="isEditor" v-model:modelValue="editorValue" width="600px" height="200px"
  85 + :language="getLanguage" />
  86 + </NCard>
  87 + </section>
  88 +</template>
... ...
1 1 <script lang="ts" setup>
2 2 import { getAllPublicInterface } from '@/api/external/dynamicRequest'
3   -import { PublicInterfaceRecord, PublicInterfaceStateEnum } from '@/api/external/dynamicRequest/model';
  3 +import { ParamsItemType, PublicInterfaceRecord, PublicInterfaceRequestParams, PublicInterfaceStateEnum } from '@/api/external/dynamicRequest/model';
4 4 import { SettingItem, SettingItemBox } from '@/components/Pages/ChartItemSetting';
5 5 import { RequestContentTypeEnum, RequestContentTypeNameEnum } from '@/enums/external/httpEnum';
6 6 import { RequestBodyEnum, RequestHttpEnum, RequestHttpIntervalEnum, RequestParams, RequestParamsTypeEnum } from '@/enums/httpEnum';
... ... @@ -8,9 +8,11 @@ import { NCard, NEmpty, NInputGroup, NInputNumber, NScrollbar, NSelect, NTabPane
8 8 import { ref, computed, unref, nextTick } from 'vue'
9 9 import { selectTimeOptions, selectTypeOptions } from '../../../index.d';
10 10 import ParamsTable from '../RequestModal/ParamsTable.vue';
11   -import RequestBody from '../RequestModal/RequestBody.vue';
  11 +import BodyContent from './BodyContent.vue'
12 12 import { ExtraRequestConfigType } from '@/store/external/modules/extraComponentInfo.d';
13 13 import { DynamicForm } from '../DynamicForm';
  14 +import { extraPublicInterfaceInfo } from '../DynamicForm/utils';
  15 +import { isArray } from '@/utils';
14 16
15 17 const publicInterfaceList = ref<PublicInterfaceRecord[]>([])
16 18
... ... @@ -31,6 +33,14 @@ const getSelectedInterface = computed<PublicInterfaceRecord>(() => {
31 33 return _record
32 34 })
33 35
  36 +const getSelectedInterfaceBody = computed<PublicInterfaceRequestParams['Body']>(() => {
  37 + return (unref(getSelectedInterface).requestParams as unknown as PublicInterfaceRequestParams).Body || {}
  38 +
  39 +})
  40 +const getSelectedInterfaceParams = computed(() => {
  41 + return (unref(getSelectedInterface).requestParams as unknown as PublicInterfaceRequestParams).Params || []
  42 +})
  43 +
34 44 const getPublicInterfaceList = async () => {
35 45 if (unref(publicInterfaceList).length) return
36 46 const result = await getAllPublicInterface({ state: PublicInterfaceStateEnum.PUBLISH })
... ... @@ -58,12 +68,16 @@ const requestParamsBodyTypeRef = ref<RequestBodyEnum>(RequestBodyEnum.X_WWW_FORM
58 68
59 69 const headerRef = ref()
60 70
61   -const paramsDynamicFormEl = ref<InstanceType<typeof DynamicForm>>()
62   -const socketDynamicFormEl = ref<InstanceType<typeof DynamicForm>>()
  71 +const paramsDynamicFormEl = ref<Nullable<InstanceType<typeof DynamicForm>>>(null)
  72 +const bodyContentEl = ref<Nullable<InstanceType<typeof BodyContent>>>(null)
  73 +const socketDynamicFormEl = ref<Nullable<InstanceType<typeof DynamicForm>>>(null)
63 74
64   -const handleSelectedInterfaceChange = (value: string, option: PublicInterfaceRecord) => {
  75 +const handleSelectedInterfaceChange = (_value: string, option: PublicInterfaceRecord) => {
65 76 requestContentTypeRef.value = option.requestContentType as RequestContentTypeEnum
66 77 requestHttpTypeRef.value = option.requestHttpType as RequestHttpEnum
  78 + const { Header = [], Body } = JSON.parse(option.requestParams) as PublicInterfaceRequestParams
  79 + headerRef.value = isArray(Header) ? (Header as ParamsItemType[]).reduce((prev, next) => ({ ...prev, [next.key]: next.value }), {}) : {}
  80 + unref(bodyContentEl)?.setConfigurationData(Body)
67 81 }
68 82
69 83 const getGetRequestTypeName = (key: RequestContentTypeEnum) => {
... ... @@ -75,15 +89,28 @@ const validate = async () => {
75 89 if (unref(socketDynamicFormEl)) return await unref(socketDynamicFormEl)?.validate()
76 90 }
77 91
78   -const setDynamicFormValue = (requestParams: RequestParams) => {
79   - if (unref(paramsDynamicFormEl)) unref(paramsDynamicFormEl)?.setConfigurationData(requestParams)
80   - if (unref(socketDynamicFormEl)) unref(socketDynamicFormEl)?.setConfigurationData(requestParams)
  92 +const setDynamicFormValue = (request: ExtraRequestConfigType) => {
  93 + const { requestParams: { Params, Body } } = request
  94 + if (unref(paramsDynamicFormEl)) unref(paramsDynamicFormEl)?.setConfigurationData(Params)
  95 + if (unref(socketDynamicFormEl)) unref(socketDynamicFormEl)?.setConfigurationData(Params)
  96 + if (unref(bodyContentEl)) {
  97 + unref(bodyContentEl)?.setConfigurationData(unref(getSelectedInterfaceBody), Body)
  98 + }
81 99 }
82 100
  101 +const getDynamicFormValue = (): Recordable => {
  102 + if (unref(paramsDynamicFormEl)) return unref(paramsDynamicFormEl)?.getConfigurationData() || {}
  103 + if (unref(socketDynamicFormEl)) return unref(socketDynamicFormEl)?.getConfigurationData() || {}
  104 + return {}
  105 +}
83 106
84 107 const getConfigurationData = () => {
85   - if (unref(paramsDynamicFormEl)) return unref(paramsDynamicFormEl)?.getConfigurationData()
86   - if (unref(socketDynamicFormEl)) return unref(socketDynamicFormEl)?.getConfigurationData()
  108 + const record = extraPublicInterfaceInfo(unref(getSelectedInterface))
  109 + const bodyValue = unref(bodyContentEl)?.getConfigurationData() || {} as RequestParams['Body']
  110 + record.requestParams[RequestParamsTypeEnum.PARAMS] = getDynamicFormValue()
  111 + record.requestParams[RequestParamsTypeEnum.HEADER] = unref(headerRef)
  112 + record.requestParams[RequestParamsTypeEnum.BODY] = bodyValue
  113 + return record
87 114 }
88 115
89 116 const setConfigurationData = async (request: ExtraRequestConfigType) => {
... ... @@ -97,7 +124,8 @@ const setConfigurationData = async (request: ExtraRequestConfigType) => {
97 124 requestParamsBodyTypeRef.value = requestParamsBodyType
98 125 requestBodyRef.value = requestParams
99 126 await nextTick()
100   - setDynamicFormValue(requestParams)
  127 + console.log(request)
  128 + setDynamicFormValue(request)
101 129 }
102 130
103 131 defineExpose({
... ... @@ -156,13 +184,12 @@ defineExpose({
156 184 :item-right-style="{ gridTemplateColumns: '7fr 1fr' }">
157 185 <NCard v-show="requestParamsTypeRef === RequestParamsTypeEnum.PARAMS" class="dynamic-form">
158 186 <NScrollbar style="max-height: 400px; box-sizing: border-box;">
159   - <DynamicForm ref="paramsDynamicFormEl" :public-interface-record="getSelectedInterface" />
  187 + <DynamicForm ref="paramsDynamicFormEl" :paramsItemList="getSelectedInterfaceParams" />
160 188 <NEmpty v-if="!selectedPublicInterface" description="请选择公共接口" />
161 189 </NScrollbar>
162 190 </NCard>
163 191
164   - <RequestBody v-show="requestParamsTypeRef === RequestParamsTypeEnum.BODY"
165   - v-model:request-params-body-type="requestParamsBodyTypeRef" v-model:value="requestBodyRef" />
  192 + <BodyContent v-show="requestParamsTypeRef === RequestParamsTypeEnum.BODY" ref="bodyContentEl" />
166 193
167 194 <ParamsTable v-show="requestParamsTypeRef === RequestParamsTypeEnum.HEADER" v-model:value="headerRef"
168 195 :disabled="true" />
... ... @@ -172,7 +199,7 @@ defineExpose({
172 199 <SettingItemBox v-if="requestContentTypeRef === RequestContentTypeEnum.WEB_SOCKET">
173 200 <NCard v-if="requestParamsTypeRef === RequestParamsTypeEnum.PARAMS" class="dynamic-form">
174 201 <NScrollbar style="max-height: 400px; box-sizing: border-box;">
175   - <DynamicForm ref="socketDynamicFormEl" :public-interface-record="getSelectedInterface" />
  202 + <DynamicForm ref="socketDynamicFormEl" :paramsItemList="getSelectedInterfaceParams" />
176 203 <NEmpty v-if="!selectedPublicInterface" description="请选择公共接口" />
177 204 </NScrollbar>
178 205 </NCard>
... ...
... ... @@ -89,7 +89,7 @@ const columns: DataTableColumns<DataSource> = [
89 89 size: 'small',
90 90 ghost: true,
91 91 onClick: () => handleSubtractRow(row),
92   - disabled: props.disabled || !unref(canDeleteRow)
  92 + // disabled: props.disabled || !unref(canDeleteRow)
93 93 } as ButtonProps,
94 94 {
95 95 default: () => h(NIcon, () => h(Subtract))
... ... @@ -124,13 +124,7 @@ const props = withDefaults(
124 124 maxRow: 50,
125 125 }
126 126 )
127   -
128   -watch(
129   - () => props.value,
130   - () => {
131   - console.log(props.value)
132   - }
133   -)
  127 +
134 128
135 129 const emit = defineEmits(['update:value'])
136 130
... ... @@ -172,6 +166,11 @@ const handleAddRow = (record: DataSource) => {
172 166
173 167 const handleSubtractRow = (record: DataSource) => {
174 168 const index = unref(dataSource).findIndex(item => item.id === record.id)
  169 + if (unref(dataSource).length === 1) {
  170 + unref(dataSource)[index].keyName = ''
  171 + unref(dataSource)[index].value = ''
  172 + return
  173 + }
175 174 unref(dataSource).splice(index, 1)
176 175 }
177 176
... ...
... ... @@ -70,6 +70,7 @@ const getResult = () => {
70 70 const handleSaveAction = async () => {
71 71 if (!(await validate())) return
72 72 const value = getResult()
  73 + console.log(value)
73 74 if (unref(selectTarget)) {
74 75 chartEditStore.updateComponentList(chartEditStore.fetchTargetIndex(), {
75 76 ...unref(selectTarget)!,
... ...
... ... @@ -44,7 +44,6 @@ export const useSyncRemote = () => {
44 44 * @returns
45 45 */
46 46 const updateStoreInfo = (projectData: DateViewConfigurationInfoType) => {
47   - console.log(projectData)
48 47 projectInfoStore.setProjectInfo(projectData)
49 48 }
50 49
... ... @@ -102,7 +101,6 @@ export const useSyncRemote = () => {
102 101
103 102 // 保存预览图
104 103 if (uploadRes) {
105   - console.log(projectInfoStore.getProjectInfo)
106 104 await saveDataViewList({
107 105 name: dataViewName,
108 106 organizationId,
... ...