Commit 5dda291dc121573b9deee087625e69c88bd14f1f

Authored by ww
1 parent f76ce29a

fix(dynamicForm): 修复公共接口日期类型组件无法回显值

1 import { RequestBodyEnum } from "@/enums/httpEnum" 1 import { RequestBodyEnum } from "@/enums/httpEnum"
  2 +import { ExternalRequestType, ExtraRequestConfigType } from "@/store/external/modules/extraComponentInfo.d"
2 import { RequestConfigType, RequestGlobalConfigType } from "@/store/modules/chartEditStore/chartEditStore.d" 3 import { RequestConfigType, RequestGlobalConfigType } from "@/store/modules/chartEditStore/chartEditStore.d"
3 import { defHttp } from "@/utils/external/http/axios" 4 import { defHttp } from "@/utils/external/http/axios"
4 5
@@ -7,19 +8,9 @@ export enum ParamsType { @@ -7,19 +8,9 @@ export enum ParamsType {
7 OPTIONAL 8 OPTIONAL
8 } 9 }
9 10
10 -export const isFullUrl = (url = '') => {  
11 - try {  
12 - new URL(url)  
13 - return true  
14 - } catch (error) {  
15 - return false  
16 - }  
17 -}  
18 -  
19 -export const getUrl = (url = '') => {  
20 - const isFullUrlFlag = isFullUrl(url)  
21 - const { origin } = window.location  
22 - return isFullUrlFlag ? new URL(url) : { pathname: url, origin } 11 +const getOriginUrl = (originUrl: string) => {
  12 + const locationUrl = 'localhost'
  13 + return originUrl === locationUrl ? location.origin : originUrl
23 } 14 }
24 15
25 const regOptionalParams = /(?={\?)/g 16 const regOptionalParams = /(?={\?)/g
@@ -45,21 +36,21 @@ export const decomposeDynamicParams = (url: string) => { @@ -45,21 +36,21 @@ export const decomposeDynamicParams = (url: string) => {
45 } 36 }
46 37
47 export const customRequest = async (request: RequestConfigType) => { 38 export const customRequest = async (request: RequestConfigType) => {
48 - const { requestHttpType, requestParams, requestParamsBodyType, requestUrl } = request as RequestGlobalConfigType & RequestConfigType 39 + console.log(request)
  40 + const { requestHttpType, requestParams, requestParamsBodyType, requestOriginUrl } = request as ExtraRequestConfigType
  41 + let { requestUrl } = request as ExtraRequestConfigType
49 const { Header, Body } = requestParams 42 const { Header, Body } = requestParams
50 let { Params } = requestParams 43 let { Params } = requestParams
51 Params = JSON.parse(JSON.stringify(Params)) 44 Params = JSON.parse(JSON.stringify(Params))
52 -  
53 const isDynamicUrlFlag = isDynamicUrl(requestUrl || '') 45 const isDynamicUrlFlag = isDynamicUrl(requestUrl || '')
54 - const url = getUrl(requestUrl!)  
55 - const { origin } = url  
56 - let { pathname } = url 46 +
  47 +
57 48
58 if (isDynamicUrlFlag) { 49 if (isDynamicUrlFlag) {
59 - pathname = decodeURI(pathname || '') 50 + requestUrl = decodeURI(requestUrl || '')
60 51
61 - const paramsList = decomposeDynamicParams(pathname)  
62 - pathname = paramsList.reduce((prev, next) => { 52 + const paramsList = decomposeDynamicParams(requestUrl)
  53 + requestUrl = paramsList.reduce((prev, next) => {
63 const { type, value, originValue } = next 54 const { type, value, originValue } = next
64 if (type === ParamsType.REQUIRED) { 55 if (type === ParamsType.REQUIRED) {
65 value.forEach(key => { 56 value.forEach(key => {
@@ -73,19 +64,18 @@ export const customRequest = async (request: RequestConfigType) => { @@ -73,19 +64,18 @@ export const customRequest = async (request: RequestConfigType) => {
73 } 64 }
74 65
75 return prev 66 return prev
76 - }, pathname) 67 + }, requestUrl)
77 68
78 - pathname = pathname.replaceAll(/[{}?]/g, '') 69 + requestUrl = requestUrl.replaceAll(/[{}?]/g, '')
79 } 70 }
80 71
81 const body = Body[requestParamsBodyType as Exclude<'NONE', keyof typeof RequestBodyEnum>] 72 const body = Body[requestParamsBodyType as Exclude<'NONE', keyof typeof RequestBodyEnum>]
82 73
83 - // Object.assign(Params, { startTs: Params.date[0], endTs: Params.date[1] })  
84 Reflect.deleteProperty(Params, 'date') 74 Reflect.deleteProperty(Params, 'date')
85 - 75 + console.log(Header)
86 return defHttp.request<any>({ 76 return defHttp.request<any>({
87 - url: pathname,  
88 - baseURL: origin, 77 + url: requestUrl,
  78 + baseURL: getOriginUrl(requestOriginUrl!),
89 method: requestHttpType, 79 method: requestHttpType,
90 params: Params, 80 params: Params,
91 data: body, 81 data: body,
1 - import { defHttp } from '@/utils/external/http/axios';  
2 -import { DeviceAttributesRecord, GetDeviceListParams, PublicInterfaceRecord } from './model'; 1 +import { defHttp } from '@/utils/external/http/axios';
  2 +import { DeviceAttributesRecord, GetDeviceListParams, PublicInterfaceRecord, PublicInterfaceStateEnum } from './model';
3 import { PaginationResult } from '/#/external/axios'; 3 import { PaginationResult } from '/#/external/axios';
4 4
5 enum Api { 5 enum Api {
@@ -53,8 +53,9 @@ export const getDeviceInterfaceDetail = async (interfaces: string[]) => { @@ -53,8 +53,9 @@ export const getDeviceInterfaceDetail = async (interfaces: string[]) => {
53 }) 53 })
54 } 54 }
55 55
56 -export const getAllPublicInterface = async () => { 56 +export const getAllPublicInterface = async (params?: { state: PublicInterfaceStateEnum }) => {
57 return defHttp.get<PublicInterfaceRecord[]>({ 57 return defHttp.get<PublicInterfaceRecord[]>({
58 - url: Api.GET_PUBLIC_INTERFACE_ALL 58 + // url: `${Api.GET_PUBLIC_INTERFACE_ALL}${params?.state ? `/${params.state}` : ''}`,
  59 + url: Api.GET_PUBLIC_INTERFACE_ALL,
59 }) 60 })
60 } 61 }
1 import { RequestParams as OriginRequestParams } from "@/enums/httpEnum" 1 import { RequestParams as OriginRequestParams } from "@/enums/httpEnum"
2 2
  3 +export enum PublicInterfaceStateEnum {
  4 + PUBLISH = 1,
  5 + UN_PUBLISH = 0
  6 +}
  7 +
3 export interface RequestParams { 8 export interface RequestParams {
4 Body: Recordable 9 Body: Recordable
5 Header: Recordable 10 Header: Recordable
1 -import { ChartEditStoreType } from '../../modules/chartEditStore/chartEditStore.d' 1 +import { ChartEditStoreType, RequestConfigType, } from '../../modules/chartEditStore/chartEditStore.d'
  2 +import { CreateComponentType } from '../../../packages/index.d'
2 3
3 export enum ExtraComponentInfoStoreEnum { 4 export enum ExtraComponentInfoStoreEnum {
4 COMPONENT_LIST = 'componentList' 5 COMPONENT_LIST = 'componentList'
5 -} 6 +}
6 7
7 export interface ExtraComponentInfoStoreType { 8 export interface ExtraComponentInfoStoreType {
8 [ExtraComponentInfoStoreEnum.COMPONENT_LIST]: ChartEditStoreType['componentList'] 9 [ExtraComponentInfoStoreEnum.COMPONENT_LIST]: ChartEditStoreType['componentList']
9 } 10 }
  11 +
  12 +export interface ExternalRequestType {
  13 + requestOriginUrl?: string
  14 +}
  15 +
  16 +export type ExtraRequestConfigType = RequestConfigType & ExternalRequestType
  17 +
  18 +export interface ECreateComponentType extends CreateComponentType {
  19 + request: ExtraRequestConfigType
  20 +}
1 -import { CreateComponentType, CreateComponentGroupType } from "@/packages/index.d";  
2 -import { RequestConfigType } from "@/store/modules/chartEditStore/chartEditStore.d";  
3 import { useChartEditStore } from "@/store/modules/chartEditStore/chartEditStore"; 1 import { useChartEditStore } from "@/store/modules/chartEditStore/chartEditStore";
4 import { defineStore } from "pinia"; 2 import { defineStore } from "pinia";
  3 +import { pinia } from "@/store";
  4 +import { ECreateComponentType } from '@/store/external/modules/extraComponentInfo.d'
5 5
6 -export interface ExternalRequestType {  
7 - test: string  
8 -}  
9 6
10 -export interface ECreateComponentType extends CreateComponentType {  
11 - request: RequestConfigType & ExternalRequestType  
12 -}  
13 7
14 -const chartEditStore = useChartEditStore() 8 +const chartEditStore = useChartEditStore(pinia)
  9 +
15 export const useExternalChartEditStore = defineStore({ 10 export const useExternalChartEditStore = defineStore({
16 id: 'useExtraComponentInfo', 11 id: 'useExtraComponentInfo',
17 actions: { 12 actions: {
18 - updateComponentList(index: number, newData: CreateComponentType) { 13 + updateComponentList(index: number, newData: ECreateComponentType) {
19 chartEditStore.updateComponentList(index, newData) 14 chartEditStore.updateComponentList(index, newData)
20 }, 15 },
  16 +
  17 + /**
  18 + * 新增加属性
  19 + * @description 更新组件请求源地址
  20 + * @param targetComponentId
  21 + * @param requestOriginUrl
  22 + */
  23 + setComponentRequestOriginUrl(targetComponentId: string, requestOriginUrl: string) {
  24 + const index = chartEditStore.fetchTargetIndex(targetComponentId)
  25 + const info = chartEditStore.getComponentList[index];
  26 + (info.request as ECreateComponentType['request']).requestOriginUrl = requestOriginUrl
  27 + this.updateComponentList(index, info)
  28 + }
21 } 29 }
22 }) 30 })
@@ -71,7 +71,6 @@ const handleClickPanel = () => { @@ -71,7 +71,6 @@ const handleClickPanel = () => {
71 // TODO socket 请求时会触发 71 // TODO socket 请求时会触发
72 watchEffect(() => { 72 watchEffect(() => {
73 const filter = targetData.value?.filter 73 const filter = targetData.value?.filter
74 - console.log({ lastFilter, filter, firstFocus })  
75 if (lastFilter !== filter && firstFocus) { 74 if (lastFilter !== filter && firstFocus) {
76 lastFilter = filter 75 lastFilter = filter
77 sendHandle() 76 sendHandle()
1 <script lang="ts" setup> 1 <script lang="ts" setup>
2 -import { getAllPublicInterface, getPublicInterface } from '@/api/external/dynamicRequest'  
3 -import { PublicInterfaceRecord } from '@/api/external/dynamicRequest/model'; 2 +import { getAllPublicInterface } from '@/api/external/dynamicRequest'
  3 +import { PublicInterfaceRecord, PublicInterfaceStateEnum } from '@/api/external/dynamicRequest/model';
4 import { SettingItem, SettingItemBox } from '@/components/Pages/ChartItemSetting'; 4 import { SettingItem, SettingItemBox } from '@/components/Pages/ChartItemSetting';
5 import { RequestContentTypeEnum, RequestContentTypeNameEnum } from '@/enums/external/httpEnum'; 5 import { RequestContentTypeEnum, RequestContentTypeNameEnum } from '@/enums/external/httpEnum';
6 import { RequestBodyEnum, RequestHttpEnum, RequestHttpIntervalEnum, RequestParams, RequestParamsTypeEnum } from '@/enums/httpEnum'; 6 import { RequestBodyEnum, RequestHttpEnum, RequestHttpIntervalEnum, RequestParams, RequestParamsTypeEnum } from '@/enums/httpEnum';
7 -import { RequestConfigType } from '@/store/modules/chartEditStore/chartEditStore.d';  
8 -import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore';  
9 -import { NForm, NCard, NDatePicker, NEmpty, NFormItem, NInput, NInputGroup, NInputNumber, NScrollbar, NSelect, NSpin, NTabPane, NTabs, NTreeSelect, SelectOption, FormInst, NButton, FormItemInst, NText, NSpace, NTag } from 'naive-ui';  
10 -import { ref, reactive, onMounted, computed, unref } from 'vue' 7 +import { NForm, NCard, NDatePicker, NEmpty, NFormItem, NInput, NInputGroup, NInputNumber, NScrollbar, NSelect, NTabPane, NTabs, NTreeSelect, SelectOption, FormItemInst } from 'naive-ui';
  8 +import { ref, computed, unref } from 'vue'
11 import { selectTimeOptions, selectTypeOptions } from '../../../index.d'; 9 import { selectTimeOptions, selectTypeOptions } from '../../../index.d';
12 import ParamsTable from '../RequestModal/ParamsTable.vue'; 10 import ParamsTable from '../RequestModal/ParamsTable.vue';
13 import RequestBody from '../RequestModal/RequestBody.vue'; 11 import RequestBody from '../RequestModal/RequestBody.vue';
14 import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm'; 12 import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm';
15 import { transferData } from './utils'; 13 import { transferData } from './utils';
16 -import { MonacoEditor } from '@/components/Pages/MonacoEditor'; 14 +import { ExtraRequestConfigType } from '@/store/external/modules/extraComponentInfo.d';
17 15
18 const componentMap: { [key in ComponentType]?: any } = { 16 const componentMap: { [key in ComponentType]?: any } = {
19 [ComponentType.SELECT_TREE]: NTreeSelect, 17 [ComponentType.SELECT_TREE]: NTreeSelect,
@@ -42,7 +40,7 @@ const getSelectedInterface = computed(() => { @@ -42,7 +40,7 @@ const getSelectedInterface = computed(() => {
42 40
43 const getPublicInterfaceList = async () => { 41 const getPublicInterfaceList = async () => {
44 if (unref(publicInterfaceList).length) return 42 if (unref(publicInterfaceList).length) return
45 - const result = await getAllPublicInterface() 43 + const result = await getAllPublicInterface({ state: PublicInterfaceStateEnum.PUBLISH })
46 publicInterfaceList.value = result 44 publicInterfaceList.value = result
47 } 45 }
48 46
@@ -50,10 +48,10 @@ const handleFilter = (query: string, option: SelectOption) => { @@ -50,10 +48,10 @@ const handleFilter = (query: string, option: SelectOption) => {
50 return ((option as Recordable).interfaceName).includes(query) 48 return ((option as Recordable).interfaceName).includes(query)
51 } 49 }
52 50
53 -const { getDynamicFormSchemas, params, createForm, validFlag, setDynamicFormValue } = useDynamicPublicForm(getSelectedInterface) 51 +const { getDynamicFormSchemas, getValue, createForm, validFlag, setDynamicFormValue } = useDynamicPublicForm(getSelectedInterface)
54 52
55 const getConfigurationData = () => { 53 const getConfigurationData = () => {
56 - const value = transferData(unref(getSelectedInterface), unref(getSelectedInterface).requestParams as unknown as RequestParams, params) 54 + const value = transferData(unref(getSelectedInterface), unref(getSelectedInterface).requestParams as unknown as RequestParams, unref(getValue))
57 return value 55 return value
58 } 56 }
59 57
@@ -67,7 +65,7 @@ const requestContentTypeRef = ref<RequestContentTypeEnum>() @@ -67,7 +65,7 @@ const requestContentTypeRef = ref<RequestContentTypeEnum>()
67 65
68 const requestParamsTypeRef = ref<RequestParamsTypeEnum>(RequestParamsTypeEnum.PARAMS) 66 const requestParamsTypeRef = ref<RequestParamsTypeEnum>(RequestParamsTypeEnum.PARAMS)
69 67
70 -const requestParams = ref<RequestParams>({ Body: { [RequestBodyEnum.FORM_DATA]: {}, [RequestBodyEnum.JSON]: '', [RequestBodyEnum.XML]: '', [RequestBodyEnum.X_WWW_FORM_URLENCODED]: {} }, Header: {}, Params: {} }) 68 +const requestParamsRef = ref<RequestParams>({ Body: { [RequestBodyEnum.FORM_DATA]: {}, [RequestBodyEnum.JSON]: '', [RequestBodyEnum.XML]: '', [RequestBodyEnum.X_WWW_FORM_URLENCODED]: {} }, Header: {}, Params: {} })
71 69
72 const requestParamsBodyTypeRef = ref<RequestBodyEnum>(RequestBodyEnum.X_WWW_FORM_URLENCODED) 70 const requestParamsBodyTypeRef = ref<RequestBodyEnum>(RequestBodyEnum.X_WWW_FORM_URLENCODED)
73 71
@@ -85,17 +83,17 @@ const getGetRequestTypeName = (key: RequestContentTypeEnum) => { @@ -85,17 +83,17 @@ const getGetRequestTypeName = (key: RequestContentTypeEnum) => {
85 return RequestContentTypeNameEnum[RequestContentTypeEnum[key] as keyof typeof RequestContentTypeEnum] 83 return RequestContentTypeNameEnum[RequestContentTypeEnum[key] as keyof typeof RequestContentTypeEnum]
86 } 84 }
87 85
88 -const setConfigurationData = async (request: RequestConfigType) => { 86 +const setConfigurationData = async (request: ExtraRequestConfigType) => {
89 await getPublicInterfaceList() 87 await getPublicInterfaceList()
90 - const { requestDataPondId, requestParams: params, requestParamsBodyType, requestContentType, requestHttpType, } = request  
91 - const { Header } = params 88 + const { requestDataPondId, requestParams, requestParamsBodyType, requestContentType, requestHttpType } = request
  89 + const { Header } = requestParams
92 selectedPublicInterface.value = requestDataPondId 90 selectedPublicInterface.value = requestDataPondId
93 requestContentTypeRef.value = requestContentType 91 requestContentTypeRef.value = requestContentType
94 requestHttpTypeRef.value = requestHttpType 92 requestHttpTypeRef.value = requestHttpType
95 headerRef.value = Header 93 headerRef.value = Header
96 requestParamsBodyTypeRef.value = requestParamsBodyType 94 requestParamsBodyTypeRef.value = requestParamsBodyType
97 - requestParams.value = params  
98 - setDynamicFormValue(params) 95 + requestParamsRef.value = requestParams
  96 + setDynamicFormValue(requestParams)
99 } 97 }
100 98
101 99
@@ -113,9 +111,6 @@ defineExpose({ @@ -113,9 +111,6 @@ defineExpose({
113 validate 111 validate
114 }) 112 })
115 113
116 -onMounted(() => {  
117 - getPublicInterfaceList()  
118 -})  
119 114
120 </script> 115 </script>
121 116
@@ -178,25 +173,25 @@ onMounted(() => { @@ -178,25 +173,25 @@ onMounted(() => {
178 </NCard> 173 </NCard>
179 174
180 <!-- <section v-if="requestParamsTypeRef === RequestParamsTypeEnum.PARAMS"> 175 <!-- <section v-if="requestParamsTypeRef === RequestParamsTypeEnum.PARAMS">
181 - <NCard>  
182 - <NSpace vertical>  
183 - <NTag type="info">  
184 - <span class="func-keyword">function</span>&nbsp;&nbsp;filter(res)&nbsp;&nbsp;{  
185 - </NTag>  
186 - <MonacoEditor v-model:modelValue="filter" width="380px" height="300px" language="javascript" />  
187 - <NTag type="info">}</NTag>  
188 - </NSpace>  
189 - </NCard>  
190 - <NCard style="margin-top: 20px;">  
191 - <NText>转换结果:</NText>  
192 - <section>  
193 - <NText>{{ params }}</NText>  
194 - </section>  
195 - </NCard>  
196 - </section> --> 176 + <NCard>
  177 + <NSpace vertical>
  178 + <NTag type="info">
  179 + <span class="func-keyword">function</span>&nbsp;&nbsp;filter(res)&nbsp;&nbsp;{
  180 + </NTag>
  181 + <MonacoEditor v-model:modelValue="filter" width="380px" height="300px" language="javascript" />
  182 + <NTag type="info">}</NTag>
  183 + </NSpace>
  184 + </NCard>
  185 + <NCard style="margin-top: 20px;">
  186 + <NText>转换结果:</NText>
  187 + <section>
  188 + <NText>{{ params }}</NText>
  189 + </section>
  190 + </NCard>
  191 + </section> -->
197 192
198 <RequestBody v-if="requestParamsTypeRef === RequestParamsTypeEnum.BODY" 193 <RequestBody v-if="requestParamsTypeRef === RequestParamsTypeEnum.BODY"
199 - v-model:request-params-body-type="requestParamsBodyTypeRef" v-model:value="requestParams" /> 194 + v-model:request-params-body-type="requestParamsBodyTypeRef" v-model:value="requestParamsRef" />
200 195
201 <ParamsTable v-if="requestParamsTypeRef === RequestParamsTypeEnum.HEADER" v-model:value="headerRef" /> 196 <ParamsTable v-if="requestParamsTypeRef === RequestParamsTypeEnum.HEADER" v-model:value="headerRef" />
202 197
@@ -10,18 +10,19 @@ import { DictEnum } from '@/enums/external/dictEnum' @@ -10,18 +10,19 @@ import { DictEnum } from '@/enums/external/dictEnum'
10 const GROUP_SEPARATOR = ',' 10 const GROUP_SEPARATOR = ','
11 11
12 export enum BuiltInVariable { 12 export enum BuiltInVariable {
13 - DATE = 'date',  
14 KEYS = 'keys', 13 KEYS = 'keys',
15 ENTITY_ID = 'entityId', 14 ENTITY_ID = 'entityId',
16 ORGANIZATION_ID = 'organizationId', 15 ORGANIZATION_ID = 'organizationId',
17 DEVICE_PROFILE_ID = 'deviceProfileId', 16 DEVICE_PROFILE_ID = 'deviceProfileId',
  17 + DATE_FIXED = 'fixed_date',
  18 + DATE_RANGE = 'date_range'
18 } 19 }
19 20
20 export enum ComponentType { 21 export enum ComponentType {
21 SELECT = 'select', 22 SELECT = 'select',
22 SELECT_TREE = 'selectTree', 23 SELECT_TREE = 'selectTree',
23 DATE_PICKER = 'datePicker', 24 DATE_PICKER = 'datePicker',
24 - INPUT = 'input' 25 + INPUT = 'input',
25 } 26 }
26 27
27 28
@@ -36,12 +37,16 @@ export interface DynamicFormSchema { @@ -36,12 +37,16 @@ export interface DynamicFormSchema {
36 37
37 export type BuiltInVariableRecord = { [key in BuiltInVariable]: DictItem } 38 export type BuiltInVariableRecord = { [key in BuiltInVariable]: DictItem }
38 39
  40 +const isDateComponent = (type: BuiltInVariable) => {
  41 + return [BuiltInVariable.DATE_FIXED, BuiltInVariable.DATE_RANGE].includes(type)
  42 +}
39 43
40 export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceRecord>) => { 44 export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceRecord>) => {
41 45
42 const getParams = computed(() => { 46 const getParams = computed(() => {
43 let params = (publicInterfaceRef.value.requestParams as unknown as RequestParams).Params || [] 47 let params = (publicInterfaceRef.value.requestParams as unknown as RequestParams).Params || []
44 if (!Array.isArray(params)) params = [] 48 if (!Array.isArray(params)) params = []
  49 + console.log(params)
45 return params 50 return params
46 }) 51 })
47 52
@@ -115,6 +120,27 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco @@ -115,6 +120,27 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
115 if (Array.isArray(result)) optionsSet[BuiltInVariable.KEYS] = result 120 if (Array.isArray(result)) optionsSet[BuiltInVariable.KEYS] = result
116 } 121 }
117 122
  123 + const getValue = computed(() => {
  124 + const value = { ...unref(params) }
  125 + if (Reflect.has(value, BuiltInVariable.DATE_FIXED)) {
  126 + const fieldMapping = unref(getParams).find(item => item.key === BuiltInVariable.DATE_FIXED)
  127 + Reflect.set(value, fieldMapping?.value || '', value[BuiltInVariable.DATE_FIXED])
  128 + Reflect.deleteProperty(value, BuiltInVariable.DATE_FIXED)
  129 + }
  130 +
  131 + if (Reflect.has(value, BuiltInVariable.DATE_RANGE)) {
  132 + const fieldMapping = unref(getParams).find(item => item.key === BuiltInVariable.DATE_RANGE)
  133 + const [start, end] = ((fieldMapping || {}).value || '').split(GROUP_SEPARATOR)
  134 + const [startValue, endValue] = value[BuiltInVariable.DATE_RANGE]
  135 + value[start] = startValue
  136 + value[end] = endValue
  137 +
  138 + Reflect.deleteProperty(value, BuiltInVariable.DATE_RANGE)
  139 + }
  140 +
  141 + return value
  142 + })
  143 +
118 const getSelectOrgTree = computed<TreeSelectProps>(() => { 144 const getSelectOrgTree = computed<TreeSelectProps>(() => {
119 return { 145 return {
120 ...basicPreset('name'), 146 ...basicPreset('name'),
@@ -174,15 +200,25 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco @@ -174,15 +200,25 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
174 const getSelectDate = computed(() => { 200 const getSelectDate = computed(() => {
175 return { 201 return {
176 size: 'small', 202 size: 'small',
177 - value: params[BuiltInVariable.DATE], 203 + value: params[BuiltInVariable.DATE_FIXED],
  204 + type: 'datetime',
  205 + clearable: true,
  206 + defaultTime: '00:00:00',
  207 + onUpdateValue(value) {
  208 + params[BuiltInVariable.DATE_FIXED] = value
  209 + }
  210 + } as DatePickerProps
  211 + })
  212 +
  213 + const getSelectDateRange = computed(() => {
  214 + return {
  215 + size: 'small',
  216 + value: params[BuiltInVariable.DATE_RANGE],
178 type: 'datetimerange', 217 type: 'datetimerange',
179 clearable: true, 218 clearable: true,
180 defaultTime: ['00:00:00', '00:00:00'], 219 defaultTime: ['00:00:00', '00:00:00'],
181 onUpdateValue(value) { 220 onUpdateValue(value) {
182 - // params[BuiltInVariable.DATE] = value  
183 - params.startTs = value[0]  
184 - params.endTs = value[1]  
185 - console.log(params) 221 + params[BuiltInVariable.DATE_RANGE] = value
186 } 222 }
187 } as DatePickerProps 223 } as DatePickerProps
188 }) 224 })
@@ -218,9 +254,14 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco @@ -218,9 +254,14 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
218 key: BuiltInVariable.KEYS, 254 key: BuiltInVariable.KEYS,
219 props: getSelectDeviceAttr 255 props: getSelectDeviceAttr
220 }, 256 },
221 - [BuiltInVariable.DATE]: { 257 + [BuiltInVariable.DATE_RANGE]: {
222 component: ComponentType.DATE_PICKER, 258 component: ComponentType.DATE_PICKER,
223 - key: BuiltInVariable.DATE, 259 + key: BuiltInVariable.DATE_RANGE,
  260 + props: getSelectDateRange
  261 + },
  262 + [BuiltInVariable.DATE_FIXED]: {
  263 + component: ComponentType.DATE_PICKER,
  264 + key: BuiltInVariable.DATE_FIXED,
224 props: getSelectDate 265 props: getSelectDate
225 } 266 }
226 } 267 }
@@ -287,16 +328,22 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco @@ -287,16 +328,22 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
287 } 328 }
288 329
289 const setParams = (Params: Recordable) => { 330 const setParams = (Params: Recordable) => {
290 - unref(getParams).forEach(({ key, value }) => {  
291 - const splitKeys = key.split(GROUP_SEPARATOR)  
292 - splitKeys.forEach(temp => {  
293 - if (unref(getUsedBuiltInVariable).includes(temp)) {  
294 - params[temp] = Params[temp] 331 +
  332 + for (const { key, value } of unref(getParams)) {
  333 + const splitKeys = value ? value.split(GROUP_SEPARATOR) : key.split(GROUP_SEPARATOR)
  334 + if (isDateComponent(key as BuiltInVariable)) {
  335 + if (key as BuiltInVariable === BuiltInVariable.DATE_FIXED) {
  336 + params[key] = Params[splitKeys[0]]
  337 + continue
295 } 338 }
296 - }) 339 + params[key] = [Params[splitKeys[0]], Params[splitKeys[1]]]
  340 + continue
  341 + }
  342 + for (const temp of splitKeys) {
  343 + params[temp] = Params[temp]
  344 + }
  345 + }
297 346
298 - params[value] = Params[value]  
299 - })  
300 } 347 }
301 348
302 const setDynamicFormValue = (requestParams: RequestConfigType['requestParams']) => { 349 const setDynamicFormValue = (requestParams: RequestConfigType['requestParams']) => {
@@ -314,7 +361,7 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco @@ -314,7 +361,7 @@ export const useDynamicPublicForm = (publicInterfaceRef: Ref<PublicInterfaceReco
314 361
315 return { 362 return {
316 validFlag, 363 validFlag,
317 - params, 364 + getValue,
318 getDynamicFormSchemas, 365 getDynamicFormSchemas,
319 setDynamicFormValue, 366 setDynamicFormValue,
320 createForm 367 createForm
1 import { PublicInterfaceRecord } from "@/api/external/dynamicRequest/model" 1 import { PublicInterfaceRecord } from "@/api/external/dynamicRequest/model"
2 import { RequestDataTypeEnum, RequestParams } from "@/enums/httpEnum" 2 import { RequestDataTypeEnum, RequestParams } from "@/enums/httpEnum"
3 -import { RequestConfigType } from "@/store/modules/chartEditStore/chartEditStore.d" 3 +import { ExternalRequestType } from "@/store/external/modules/extraComponentInfo.d"
  4 +import { unref } from "vue"
4 5
5 export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, requestParams: RequestParams, fillParams: Recordable) => { 6 export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, requestParams: RequestParams, fillParams: Recordable) => {
6 const { requestContentType, requestHttpType, id, requestUrl, requestParamsBodyType, requestOriginUrl } = publicInterfaceRecord 7 const { requestContentType, requestHttpType, id, requestUrl, requestParamsBodyType, requestOriginUrl } = publicInterfaceRecord
@@ -12,8 +13,10 @@ export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, reque @@ -12,8 +13,10 @@ export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, reque
12 requestDataType: RequestDataTypeEnum.Pond, 13 requestDataType: RequestDataTypeEnum.Pond,
13 // 请求方式 get/post/del/put/patch 14 // 请求方式 get/post/del/put/patch
14 requestHttpType, 15 requestHttpType,
  16 + // 公共接口的源地址
  17 + requestOriginUrl,
15 // 源后续的 url 18 // 源后续的 url
16 - requestUrl: `${requestOriginUrl}${requestUrl}`, 19 + requestUrl,
17 // 请求内容主体方式 普通/sql 20 // 请求内容主体方式 普通/sql
18 requestContentType, 21 requestContentType,
19 // 请求体类型 22 // 请求体类型
@@ -26,8 +29,8 @@ export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, reque @@ -26,8 +29,8 @@ export const transferData = (publicInterfaceRecord: PublicInterfaceRecord, reque
26 requestParams: { 29 requestParams: {
27 Header, 30 Header,
28 Body, 31 Body,
29 - Params: fillParams 32 + Params: unref(fillParams)
30 } 33 }
31 34
32 - } as RequestConfigType 35 + } as ExternalRequestType
33 } 36 }
@@ -7,8 +7,7 @@ import { ref, unref } from 'vue'; @@ -7,8 +7,7 @@ import { ref, unref } from 'vue';
7 import DefaultRequestContent from './DefaultRequestContent.vue'; 7 import DefaultRequestContent from './DefaultRequestContent.vue';
8 import SqlConfiguration from './SqlConfiguration.vue'; 8 import SqlConfiguration from './SqlConfiguration.vue';
9 import { RequestConfigType } from '@/store/modules/chartEditStore/chartEditStore.d'; 9 import { RequestConfigType } from '@/store/modules/chartEditStore/chartEditStore.d';
10 -import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore';  
11 -import { getUrl } from '@/api/external/customRequest' 10 +import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore';
12 11
13 const chartEditStore = useChartEditStore() 12 const chartEditStore = useChartEditStore()
14 13
@@ -53,9 +52,8 @@ const setConfigurationData = (request: RequestConfigType) => { @@ -53,9 +52,8 @@ const setConfigurationData = (request: RequestConfigType) => {
53 requestIntervalUnitRef.value = requestIntervalUnit 52 requestIntervalUnitRef.value = requestIntervalUnit
54 requestParamsBodyTypeRef.value = requestParamsBodyType 53 requestParamsBodyTypeRef.value = requestParamsBodyType
55 requestSQLContentRef.value = requestSQLContent.sql 54 requestSQLContentRef.value = requestSQLContent.sql
56 - requestParamsRef.value = requestParams  
57 - const { pathname } = getUrl(requestUrl!)  
58 - requestUrlRef.value = pathname 55 + requestParamsRef.value = requestParams
  56 + requestUrlRef.value = requestUrl
59 } 57 }
60 58
61 defineExpose({ 59 defineExpose({