Merge branch 'ft' into 'main_dev'

feat: 新增自定义过滤器编写和优化公共接口管理部分代码 See merge request yunteng/thingskit-front!604

Merge branch 'ft' into 'main_dev'
feat: 新增自定义过滤器编写和优化公共接口管理部分代码 See merge request yunteng/thingskit-front!604
xp.Huang
2 parents 5e7bad23 6e3285a0
Showing 5 changed files with 78 additions and 42 deletions
src/views/dataview/publicApi/components/SimpleRequest/components/aceEditor.vue
src/views/dataview/publicApi/components/SimpleRequest/index.vue
src/views/dataview/publicApi/components/TestInterface/components/excuteTest.vue
src/views/dataview/publicApi/form.vue
src/views/dataview/publicApi/hooks/useUtils.ts
--- a/src/views/dataview/publicApi/components/SimpleRequest/components/aceEditor.vue
View file @0de4e20
+++ b/src/views/dataview/publicApi/components/SimpleRequest/components/aceEditor.vue
View file @0de4e20
@@ -96,7 +96,7 @@
         await nextTick();
         const jsCode = aceEditor.value.getValue();
         const res = getRestData.value ?? props.restData;
-        const fn = new Function('data', 'res', jsCode)(res?.data, res);
+        const fn = new Function('res', jsCode)(res);
         emits('changeAceContent', fn);
       } catch (error) {
         return `过滤函数错误，日志：${error}`;
@@ -115,7 +115,8 @@
     return aceEditor?.value?.getValue();
   };
-  const setValue = (data) => {
+  const setValue = async (data) => {
+    await nextTick();
     return aceEditor?.value?.setValue(data);
   };
--- a/src/views/dataview/publicApi/components/SimpleRequest/index.vue
View file @0de4e20
+++ b/src/views/dataview/publicApi/components/SimpleRequest/index.vue
View file @0de4e20
@@ -94,6 +94,9 @@
     interfaceType: {
       type: String,
     },
+    filterValue: {
+      type: String,
+    },
   });
   const emits = defineEmits(['activeKey']);
@@ -142,7 +145,6 @@
   const onCloseTest = () => excuteTestRef.value?.resetValue(true);
-  //if-else-if-else分支优化
   const dataForTypeMap = [
     [(type) => type === 'Params', (data) => paramsCellTableRef.value?.setValue(data)],
     [(type) => type === 'Body', (data) => bodyRef.value?.setValue(data)],
@@ -191,9 +193,14 @@
     };
   };
-  const handleTestParamsInterface = () => {
+  const commonExcuteRef = () => {
     excuteTestRef.value?.showTest();
     excuteTestRef.value?.resetValue(false);
+    excuteTestRef.value?.editSetFilterValue(props.filterValue);
+  };
+
+  const handleTestParamsInterface = () => {
+    commonExcuteRef();
     let value = getValue(false) as any;
     dataMap.mapParamsObj = {
       list: value?.Params,
@@ -204,8 +211,7 @@
   const handleTestBodyInterface = () => {
     let value = getValue(false) as any;
     const type = value?.Body?.requestParamsBodyType;
-    excuteTestRef.value?.showTest();
-    excuteTestRef.value?.resetValue(false);
+    commonExcuteRef();
     let values = [];
     for (let i in value?.Body) if (i === type) values = value?.Body[i];
     dataMap.mapBodyObj = {
@@ -216,8 +222,7 @@
   };
   const handleTestHeaderInterface = () => {
-    excuteTestRef.value?.showTest();
-    excuteTestRef.value?.resetValue(false);
+    commonExcuteRef();
     let value = getValue(false) as any;
     dataMap.mapHeaderObj = {
       list: value?.Header,
--- a/src/views/dataview/publicApi/components/TestInterface/components/excuteTest.vue
View file @0de4e20
+++ b/src/views/dataview/publicApi/components/TestInterface/components/excuteTest.vue
View file @0de4e20
@@ -22,7 +22,7 @@
             method === RequestMethodTypeEnum.WEBSOCKET
               ? 11
               : httpType === RequestHttpTypeEnum.POST
-              ? 4
+              ? 6
               : 6
           "
         >
@@ -41,7 +41,7 @@
             method === RequestMethodTypeEnum.WEBSOCKET
               ? 12
               : httpType === RequestHttpTypeEnum.POST
-              ? 19
+              ? 17
               : 17
           "
           style="position: relative"
@@ -50,7 +50,7 @@
               (method === RequestMethodTypeEnum.WEBSOCKET
                 ? 1.5
                 : httpType === RequestHttpTypeEnum.POST
-                ? -1.5
+                ? -0.25
                 : 0) + 'vw',
           }"
         >
@@ -236,9 +236,9 @@
           send(JSON.stringify(socketMessage.sendValue));
         },
         onMessage(_, e) {
-          const { data } = JSON.parse(e.data);
-          getRestData.value = data;
-          commonRest(data, jsonEditorRef.value?.setJsonValue);
+          const rest = JSON.parse(e.data);
+          getRestData.value = rest;
+          commonRest(rest, jsonEditorRef.value?.setJsonValue);
         },
         onDisconnected() {
           close();
@@ -308,10 +308,17 @@
     return aceTypeIsJsEditorRef?.value?.getValue();
   };
+  //编辑回显过滤器函数的内容
+  const editSetFilterValue = async (filterValue) => {
+    await nextTick();
+    aceTypeIsJsEditorRef?.value?.setValue(filterValue);
+  };
+
   defineExpose({
     resetValue,
     showTest,
     getFilterValue,
+    editSetFilterValue,
   });
 </script>
--- a/src/views/dataview/publicApi/form.vue
View file @0de4e20
+++ b/src/views/dataview/publicApi/form.vue
View file @0de4e20
@@ -25,6 +25,7 @@
             :requestOriginUrl="model['requestOriginUrl']"
             :originUrlType="model['originUrlType']"
             :interfaceType="model['interfaceType']"
+            :filterValue="editSetFilter"
           />
         </template>
         <template #slotFillAddress="{ model }">
@@ -71,7 +72,13 @@
   import { Tag } from 'ant-design-vue';
   import { RequestMethodTypeEnum, RequestOriginTypeEnum } from './config/enum';
-  const { resetReqHttpType, isServerUrl, resetUpdateSchema } = useUtils();
+  const {
+    resetReqHttpType,
+    isServerUrl,
+    resetUpdateSchema,
+    validateRequestTypeAndUrl,
+    getOriginUrlType,
+  } = useUtils();
   const emits = defineEmits(['success', 'register']);
@@ -81,6 +88,8 @@
   const putId = ref('');
+  const editSetFilter = ref('');
+
   const simpleRequestRef = ref<InstanceType<typeof SimpleRequest>>();
   const templateFillAddress = (method, type) => {
@@ -126,9 +135,11 @@
     setDrawerProps({ title });
     updateSchema(resetUpdateSchema);
     isUpdate.value = data.isUpdate;
-    !isUpdate.value ? (putId.value = '') : (putId.value = data.record.id);
+    !isUpdate.value ? (putId.value = '') : (putId.value = data.record?.id);
     simpleRequestRef.value?.resetValue();
+    editSetFilter.value = '';
     if (isUpdate.value) {
+      editSetFilter.value = data.record?.filter;
       await setFieldsValue({
         ...data.record,
         requestContentType: String(data.record?.requestContentType),
@@ -152,31 +163,14 @@
   });
   const handleSubmit = async () => {
-    setDrawerProps({ loading: true });
     try {
+      setDrawerProps({ loading: true });
       const values = await validate();
       if (!values) return;
-      const isRequestHttpTypeAndUrlEmpty = values?.requestHttpTypeAndUrl;
-      if (values.requestContentType === RequestMethodTypeEnum.COMMOM) {
-        if (
-          !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestHttpType') ||
-          !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl')
-        ) {
-          createMessage.error('请填写请求类型&地址');
-          throw Error('请填写请求类型&地址');
-        }
-      } else if (values.requestContentType === RequestMethodTypeEnum.WEBSOCKET) {
-        if (!Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl')) {
-          createMessage.error('请填写请求类型&地址');
-          throw Error('请填写请求类型&地址');
-        }
-      }
+      validateRequestTypeAndUrl(values);
       const Objects = simpleRequestRef.value?.getValue(true);
       const filter = simpleRequestRef.value?.getFilterValue();
-      const requestOriginUrl =
-        values['originUrlType'] === RequestOriginTypeEnum.SERVER_URL
-          ? 'localhost'
-          : values['requestOriginUrl'];
+      const requestOriginUrl = getOriginUrlType(values);
       const data = {
         ...values,
         id: !putId.value ? null : putId.value,
@@ -186,7 +180,7 @@
           },
           ...Objects,
         }),
-        filter: !filter ? null : filter,
+        filter: !putId.value ? filter : filter ? filter : editSetFilter.value,
         requestOriginUrl,
         requestHttpType: values['requestHttpTypeAndUrl']?.requestHttpType,
         requestUrl: values['requestHttpTypeAndUrl']?.requestUrl,
--- a/src/views/dataview/publicApi/hooks/useUtils.ts
View file @0de4e20
+++ b/src/views/dataview/publicApi/hooks/useUtils.ts
View file @0de4e20
 import { commonHttpPlaceHolder, websocketPlaceHolder } from '../config/constants';
-import { RequestMethodTypeEnum } from '../config/enum';
+import { RequestMethodTypeEnum, RequestOriginTypeEnum } from '../config/enum';
 import { otherHttp } from '/@/utils/http/axios';
 import { tableItems } from '../config/types';
+import { useMessage } from '/@/hooks/web/useMessage';
 export const useUtils = () => {
+  const { createMessage } = useMessage();
   //获取多个key
   const getMultipleKeys = (list) => {
     let temps = [];
@@ -164,10 +166,7 @@ export const useUtils = () => {
     } else if (typeof data === 'string') {
       fn(data);
     } else if (Array.isArray(data)) {
-      const temp = {
-        data,
-      };
-      fn(temp);
+      fn(data);
     } else {
       fn(JSON.stringify(data));
     }
@@ -231,6 +230,34 @@ export const useUtils = () => {
     }
   }
+  //验证请求类型&地址
+  const errorMsg = () => {
+    createMessage.error('请填写请求类型&地址');
+    throw Error('请填写请求类型&地址');
+  };
+  const validateRequestTypeAndUrl = (values) => {
+    const isRequestHttpTypeAndUrlEmpty = values?.requestHttpTypeAndUrl;
+    if (values.requestContentType === RequestMethodTypeEnum.COMMOM) {
+      if (
+        !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestHttpType') ||
+        !Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl')
+      ) {
+        return errorMsg();
+      }
+    } else if (values.requestContentType === RequestMethodTypeEnum.WEBSOCKET) {
+      if (!Reflect.get(isRequestHttpTypeAndUrlEmpty, 'requestUrl')) {
+        return errorMsg();
+      }
+    }
+  };
+
+  //获取originUrlType
+  const getOriginUrlType = (values) => {
+    return values['originUrlType'] === RequestOriginTypeEnum.SERVER_URL
+      ? 'localhost'
+      : values['requestOriginUrl'];
+  };
+
   return {
     getMultipleKeys,
     pushObj,
@@ -246,5 +273,7 @@ export const useUtils = () => {
     commonParams,
     CommonFuncValue,
     ParamsFuncValue,
+    validateRequestTypeAndUrl,
+    getOriginUrlType,
   };
 };