Merge branch 'ww' into 'main_dev'

fix(public interface): 修复动态请求无法选择参数

See merge request yunteng/thingskit-view!29

@@ -8,7 +8,7 @@ export enum ParamsType {
   OPTIONAL
 }
 
-const getOriginUrl = (originUrl: string) => {
+export const getOriginUrl = (originUrl: string) => {
   const locationUrl = 'localhost'
   return originUrl === locationUrl ? location.origin : originUrl
 }

@@ -6,7 +6,7 @@ import { useChartEditStore } from "@/store/modules/chartEditStore/chartEditStore
 import { getJwtToken } from "@/utils/external/auth";
 import { useWebSocket, WebSocketResult } from "@vueuse/core";
 import { onMounted, unref } from "vue";
-import { useFilterFn } from "./useFilterFn";
+import { ExtraRequestConfigType } from "@/store/external/modules/extraComponentInfo.d";
 
 
 interface SocketConnectionPoolType {
@@ -24,14 +24,22 @@ const parse = (value: string) => {
   }
 }
 
-const getSocketInstance = (requestUrl: string) => {
+const getOriginUrl = (url: string) => {
+  const { host, protocol } = location
+  const isLocationUrl = url === 'localhost'
+  const isContentSafetyProtocol = protocol === 'https'
+  return isLocationUrl ? `${isContentSafetyProtocol ? 'wss' : 'ws'}://${host}` : host
+}
+
+const getSocketInstance = (request: ExtraRequestConfigType) => {
+  const { requestUrl, requestOriginUrl } = request
   const socketStore = useSocketStore()
   const index = socketConnectionPool.findIndex(item => item.url === requestUrl)
   if (~index) {
     return socketConnectionPool[index].ws
   }
   const token = getJwtToken()
-  const socketUrl = `${requestUrl}?token=${token}`
+  const socketUrl = `${getOriginUrl(requestOriginUrl || '')}${requestUrl}?token=${token}`
 
   const instance = useWebSocket(socketUrl.replace('undefined', ''), {
     onMessage() {
@@ -44,7 +52,7 @@ const getSocketInstance = (requestUrl: string) => {
     }
   })
 
-  socketConnectionPool.push({ url: requestUrl, ws: instance })
+  socketConnectionPool.push({ url: requestUrl!, ws: instance })
 
   return instance
 }
@@ -62,7 +70,7 @@ export const useChartDataSocket = () => {
 
     if ((requestContentType as RequestContentTypeEnum) !== RequestContentTypeEnum.WEB_SOCKET) return
 
-    const { send } = getSocketInstance(requestUrl!)
+    const { send } = getSocketInstance(request!)
 
     onMounted(() => {
       const message = socketStore.subscribe(targetComponent)
@@ -72,9 +80,8 @@ export const useChartDataSocket = () => {
 
   const sendMessage = async (targetComponent: CreateComponentType) => {
     const { request } = unref(targetComponent)
-    const { requestUrl } = request
     const message = socketStore.subscribe(unref(targetComponent))
-    const { send, data } = getSocketInstance(requestUrl!)
+    const { send, data } = getSocketInstance(request)
     message && send(JSON.stringify(message))
     return socketStore.getComponentValueByKeys(targetComponent, parse(unref(data)))
   }

@@ -16,7 +16,7 @@ const componentMap: { [key in ComponentType]?: any } = {
   [ComponentType.DATE_PICKER]: NDatePicker
 }
 
-const getParamsItemList = computed(() => {
+const getParamsItemList = computed(() => { 
   return props.paramsItemList
 })
 
@@ -35,7 +35,7 @@ const validate = async () => {
   return unref(validFlag)
 }
 const setConfigurationData = async (params: Recordable) => {
-  await nextTick()
+  await nextTick() 
   setDynamicFormValue(params)
 }
 

@@ -324,8 +324,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => {
     getDeviceOption()
   }
 
-  const setParams = (Params: Recordable) => {
-
+  const setParams = (Params: Recordable = {}) => { 
     for (const { key, value } of unref(getParams)) {
       const splitKeys = value ? value.split(GROUP_SEPARATOR) : key.split(GROUP_SEPARATOR)
       if (isDateComponent(key as BuiltInVariable)) {
@@ -350,7 +349,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => {
   }
 
   const setDynamicFormValue = (params: Recordable) => {
-    setParams(params)
+    setParams(params) 
     getOrgOption()
     getDeviceProfileOption()
     getDeviceOption()

@@ -72,12 +72,14 @@ const paramsDynamicFormEl = ref<Nullable<InstanceType<typeof DynamicForm>>>(null
 const bodyContentEl = ref<Nullable<InstanceType<typeof BodyContent>>>(null)
 const socketDynamicFormEl = ref<Nullable<InstanceType<typeof DynamicForm>>>(null)
 
-const handleSelectedInterfaceChange = (_value: string, option: PublicInterfaceRecord) => {
+const handleSelectedInterfaceChange = async (_value: string, option: PublicInterfaceRecord) => {
   requestContentTypeRef.value = option.requestContentType as RequestContentTypeEnum
   requestHttpTypeRef.value = option.requestHttpType as RequestHttpEnum
   const { Header = [], Body } = JSON.parse(option.requestParams) as PublicInterfaceRequestParams
   headerRef.value = isArray(Header) ? (Header as ParamsItemType[]).reduce((prev, next) => ({ ...prev, [next.key]: next.value }), {}) : {}
-  unref(bodyContentEl)?.setConfigurationData(Body)
+  unref(bodyContentEl)?.setConfigurationData(unref(getSelectedInterfaceBody), Body)
+  await nextTick()
+  setDynamicFormValue(option as unknown as ExtraRequestConfigType)
 }
 
 const getGetRequestTypeName = (key: RequestContentTypeEnum) => {
@@ -124,7 +126,6 @@ const setConfigurationData = async (request: ExtraRequestConfigType) => {
   requestParamsBodyTypeRef.value = requestParamsBodyType
   requestBodyRef.value = requestParams
   await nextTick()
-  console.log(request)
   setDynamicFormValue(request)
 }