feat:pc端新增公共接口管理

@@ -5,8 +5,8 @@
       <thead>
       <thead>
         <tr>
         <tr>
           <th></th>
           <th></th>
-          <th>Key</th>
-          <th>Value</th>
+          <th>内置参数</th>
+          <th>参数名</th>
           <th>是否必须</th>
           <th>是否必须</th>
           <th>操作</th>
           <th>操作</th>
         </tr>
         </tr>
@@ -20,9 +20,8 @@
             <Select
             <Select
               v-model:value="item.key"
               v-model:value="item.key"
               placeholder="请选择"
               placeholder="请选择"
-              style="width: 14rem"
               :options="selectOptions"
               :options="selectOptions"
-              @change="handleChange(item.key)"
+              @change="handleChange"
               allowClear
               allowClear
             />
             />
           </td>
           </td>
@@ -31,7 +30,6 @@
               :disabled="item.editDisabled"
               :disabled="item.editDisabled"
               placeholder="请输入"
               placeholder="请输入"
               v-model:value="item.value"
               v-model:value="item.value"
-              style="width: 14rem"
             />
             />
           </td>
           </td>
           <td>
           <td>
@@ -58,7 +56,7 @@
   import { findDictItemByCode } from '/@/api/system/dict';
   import { findDictItemByCode } from '/@/api/system/dict';
   import { PlusOutlined, MinusOutlined } from '@ant-design/icons-vue';
   import { PlusOutlined, MinusOutlined } from '@ant-design/icons-vue';
 
 
-  const props = defineProps({
+  defineProps({
     method: {
     method: {
       type: String,
       type: String,
     },
     },
@@ -75,8 +73,6 @@
       label: '自定义',
       label: '自定义',
       value: 'scope',
       value: 'scope',
     });
     });
-    if (props.method === '2')
-      selectOptions.value = selectOptions.value.filter((f) => f.value !== 'scope');
   };
   };
 
 
   const selectOptions = ref<{ label: string; value: string; disabled?: boolean }[]>([]);
   const selectOptions = ref<{ label: string; value: string; disabled?: boolean }[]>([]);
@@ -124,14 +120,14 @@
   };
   };
 
 
   //Select互斥
   //Select互斥
-  const handleChange = (value: string) => {
-    console.log(value);
+  const handleChange = () => {
     selectOptions.value.forEach((ele) => {
     selectOptions.value.forEach((ele) => {
       ele.disabled = false;
       ele.disabled = false;
       tableArray.content.forEach((element) => {
       tableArray.content.forEach((element) => {
         if (element.key === 'scope') {
         if (element.key === 'scope') {
           element.editDisabled = false;
           element.editDisabled = false;
         } else {
         } else {
+          element.value = '';
           element.editDisabled = true;
           element.editDisabled = true;
         }
         }
         if (element.key === ele.value && element.key !== 'scope') {
         if (element.key === ele.value && element.key !== 'scope') {
@@ -151,8 +147,8 @@
     nextTick(() => (tableArray.content = data));
     nextTick(() => (tableArray.content = data));
     nextTick(() =>
     nextTick(() =>
       setTimeout(() => {
       setTimeout(() => {
-        tableArray.content.forEach((it: any) => {
-          handleChange(it.key);
+        tableArray.content.forEach(() => {
+          handleChange();
         });
         });
       }, 20)
       }, 20)
     );
     );
@@ -168,8 +164,8 @@
       required: false,
       required: false,
     });
     });
     nextTick(() => {
     nextTick(() => {
-      tableArray.content.forEach((it: any) => {
-        handleChange(it.key);
+      tableArray.content.forEach(() => {
+        handleChange();
       });
       });
     });
     });
   };
   };
@@ -198,6 +194,7 @@
     }
     }
 
 
     table td {
     table td {
+      width: 7vw;
       padding: 5px;
       padding: 5px;
       white-space: nowrap;
       white-space: nowrap;
       &:extend(.table-border-color);
       &:extend(.table-border-color);

@@ -44,6 +44,12 @@
     method: {
     method: {
       type: String,
       type: String,
     },
     },
+    paramsType: {
+      type: String,
+    },
+    data: {
+      type: Array,
+    },
   });
   });
 
 
   const getRequestBody = reactive({
   const getRequestBody = reactive({

@@ -3,15 +3,36 @@
     <Tabs @change="handleChange" v-model:activeKey="activeKey">
     <Tabs @change="handleChange" v-model:activeKey="activeKey">
       <TabPane class="tab-pane" forceRender key="Params" tab="Params">
       <TabPane class="tab-pane" forceRender key="Params" tab="Params">
         <EditCellTable ref="editCellTableRef" :method="method" />
         <EditCellTable ref="editCellTableRef" :method="method" />
-        <TestRequest ref="testParRequestRef" :method="method" :data="dataList" />
+        <TestRequest
+          @testInterface="handleTestInterface"
+          ref="testParRequestRef"
+          :method="method"
+          :data="dataList"
+        />
       </TabPane>
       </TabPane>
-      <TabPane v-if="method !== '2'" class="tab-pane" forceRender key="Body" tab="Body">
-        <Body ref="bodyRef" :method="method" />
-        <TestRequest ref="testBodyRequestRef" :method="method" :data="dataList" />
+      <TabPane
+        v-if="method !== '2' && paramsType !== 'GET'"
+        class="tab-pane"
+        forceRender
+        key="Body"
+        tab="Body"
+      >
+        <Body ref="bodyRef" :method="method" :paramsType="paramsType" :data="dataList" />
+        <TestRequest
+          @testInterface="handleTestInterface"
+          ref="testBodyRequestRef"
+          :method="method"
+          :data="dataList"
+        />
       </TabPane>
       </TabPane>
       <TabPane v-if="method !== '2'" class="tab-pane" forceRender key="Header" tab="Header">
       <TabPane v-if="method !== '2'" class="tab-pane" forceRender key="Header" tab="Header">
         <EditCellTable ref="editHeaderCellTableRef" :method="method" />
         <EditCellTable ref="editHeaderCellTableRef" :method="method" />
-        <TestRequest ref="testHeaderRequestRef" :method="method" :data="dataList" />
+        <TestRequest
+          @testInterface="handleTestInterface"
+          ref="testHeaderRequestRef"
+          :method="method"
+          :data="dataList"
+        />
       </TabPane>
       </TabPane>
     </Tabs>
     </Tabs>
   </div>
   </div>
@@ -27,6 +48,9 @@
     method: {
     method: {
       type: String,
       type: String,
     },
     },
+    paramsType: {
+      type: String,
+    },
   });
   });
 
 
   const emits = defineEmits(['activeKey']);
   const emits = defineEmits(['activeKey']);
@@ -43,7 +67,7 @@
 
 
   const testHeaderRequestRef = ref<InstanceType<typeof TestRequest>>();
   const testHeaderRequestRef = ref<InstanceType<typeof TestRequest>>();
 
 
-  const dataList = ref({});
+  const dataList: any = ref(null);
 
 
   const bodyRef = ref<InstanceType<typeof Body>>();
   const bodyRef = ref<InstanceType<typeof Body>>();
 
 
@@ -53,19 +77,23 @@
     testBodyRequestRef.value?.setValue();
     testBodyRequestRef.value?.setValue();
   };
   };
 
 
+  const handleTestInterface = () => {
+    const value = getValue(false);
+    nextTick(() => (dataList.value = value));
+  };
+
   //获取数据
   //获取数据
-  const getValue = () => {
+  const getValue = (status) => {
     const type = activeKey.value;
     const type = activeKey.value;
     const Body = bodyRef.value?.getValue();
     const Body = bodyRef.value?.getValue();
     const Params = editCellTableRef.value?.getValue();
     const Params = editCellTableRef.value?.getValue();
     const Header = editHeaderCellTableRef.value?.getValue();
     const Header = editHeaderCellTableRef.value?.getValue();
-    emits('activeKey', type);
+    status ? emits('activeKey', type) : null;
     return type === 'Params' ? Params : type === 'Body' ? Body : Header;
     return type === 'Params' ? Params : type === 'Body' ? Body : Header;
   };
   };
 
 
   //设置数据
   //设置数据
   const setValue = (data) => {
   const setValue = (data) => {
-    dataList.value = data;
     const Objects = JSON.parse(data?.requestParams);
     const Objects = JSON.parse(data?.requestParams);
     nextTick(() => {
     nextTick(() => {
       if (!Objects) return;
       if (!Objects) return;
@@ -91,6 +119,7 @@
       editCellTableRef.value?.resetValue();
       editCellTableRef.value?.resetValue();
       editHeaderCellTableRef.value?.resetValue();
       editHeaderCellTableRef.value?.resetValue();
       bodyRef.value?.resetValue();
       bodyRef.value?.resetValue();
+      handleChange();
     });
     });
   };
   };
 
 

@@ -4,18 +4,18 @@
       <thead>
       <thead>
         <tr>
         <tr>
           <th></th>
           <th></th>
-          <th>Key</th>
-          <th>Value</th>
-          <th>操作</th>
+          <th>内置参数</th>
+          <th>参数名</th>
         </tr>
         </tr>
       </thead>
       </thead>
       <tbody>
       <tbody>
-        <tr v-for="(item, index) in tableArray.content" :key="index">
+        <tr v-for="(item, index) in tableTestArray.content" :key="index">
           <td>
           <td>
             {{ index + 1 }}
             {{ index + 1 }}
           </td>
           </td>
           <td>
           <td>
             <Select
             <Select
+              :disabled="true"
               v-model:value="item.key"
               v-model:value="item.key"
               placeholder="请选择"
               placeholder="请选择"
               notFoundContent="请选择"
               notFoundContent="请选择"
@@ -73,16 +73,6 @@
               @change="handleValueChange(item)"
               @change="handleValueChange(item)"
             />
             />
           </td>
           </td>
-          <td>
-            <div>
-              <Button type="dashed" @click="add(index)">
-                <template #icon><PlusOutlined /></template
-              ></Button>
-              <Button type="dashed" style="margin-left: 5px" @click="remove(item, index)">
-                <template #icon> <MinusOutlined /></template>
-              </Button>
-            </div>
-          </td>
         </tr>
         </tr>
       </tbody>
       </tbody>
     </table>
     </table>
@@ -90,13 +80,12 @@
 </template>
 </template>
 <script lang="ts" setup name="editCellTable">
 <script lang="ts" setup name="editCellTable">
   import { reactive, ref, onMounted } from 'vue';
   import { reactive, ref, onMounted } from 'vue';
-  import { Select, Button } from 'ant-design-vue';
+  import { Select } from 'ant-design-vue';
   import { findDictItemByCode } from '/@/api/system/dict';
   import { findDictItemByCode } from '/@/api/system/dict';
-  import { PlusOutlined, MinusOutlined } from '@ant-design/icons-vue';
   import { getAllDeviceByOrg } from '/@/api/dataBoard';
   import { getAllDeviceByOrg } from '/@/api/dataBoard';
   import { getDeviceAttributes } from '/@/api/dataBoard';
   import { getDeviceAttributes } from '/@/api/dataBoard';
   import { useApi } from '../../hooks/useApi';
   import { useApi } from '../../hooks/useApi';
-  import { buildUUID } from '/@/utils/uuid';
+  import { cloneDeep } from 'lodash-es';
 
 
   const props = defineProps({
   const props = defineProps({
     method: {
     method: {
@@ -126,18 +115,16 @@
   const treeData = ref([]);
   const treeData = ref([]);
 
 
   type defaultItem = {
   type defaultItem = {
-    id: string;
     key: null | string;
     key: null | string;
     value: null | string;
     value: null | string;
     editDisabled: boolean;
     editDisabled: boolean;
   };
   };
 
 
-  const tableArray = reactive<{
+  const tableTestArray = reactive<{
     content: defaultItem[];
     content: defaultItem[];
   }>({
   }>({
     content: [
     content: [
       {
       {
-        id: buildUUID(),
         key: null,
         key: null,
         value: null,
         value: null,
         editDisabled: false,
         editDisabled: false,
@@ -145,49 +132,37 @@
     ],
     ],
   });
   });
 
 
-  // 新增
-  const add = (index: number) => {
-    tableArray.content.splice(index + 1, 0, {
-      id: buildUUID(),
-      key: null,
-      value: null,
-      editDisabled: false,
-    });
+  //设置数据
+  const setTableArray = (data) => {
+    const list = cloneDeep(data);
+    if (Array.isArray(list)) (tableTestArray.content = list) && getApi(list);
+    if (list.hasOwnProperty('form-data') && Array.isArray(list['form-data']))
+      (tableTestArray.content = list['form-data']) && getApi(list['form-data']);
+    if (
+      list.hasOwnProperty('x-www-form-urlencoded') &&
+      Array.isArray(list['x-www-form-urlencoded'])
+    )
+      (tableTestArray.content = list['x-www-form-urlencoded']) &&
+        getApi(list['x-www-form-urlencoded']);
   };
   };
 
 
-  // 减少
-  const remove = (item, index: number) => {
-    if (item.key === 'organizationId') {
-      entityOptions.value.length = 0;
-      tableArray.content.forEach((f) => {
-        if (f.key === 'entityId') {
-          f.value = null;
-        }
-      });
-    }
-    if (item.key === 'deviceProfileId') {
-      attributeOptions.value.length = 0;
-      tableArray.content.forEach((f) => {
-        if (f.key === 'keys') {
-          f.value = null;
-        }
-      });
-    }
-    if (tableArray.content.length !== 1) {
-      selectOptions.value.forEach((ele) => {
-        if (ele.value == item.key) {
-          ele.disabled = false;
-        }
-      });
-      tableArray.content.splice(index, 1);
-    }
+  const getApi = (list) => {
+    list?.forEach(async (it) => {
+      if (it.key === 'deviceProfileId') {
+        const { options } = await useApi(it.key);
+        valueOptions.value = options;
+      } else if (it.key === 'organizationId') {
+        const { options } = await useApi(it.key);
+        treeData.value = options as any;
+      }
+    });
   };
   };
 
 
   //Select互斥
   //Select互斥
   const handleChange = async (e) => {
   const handleChange = async (e) => {
     selectOptions.value.forEach((ele) => {
     selectOptions.value.forEach((ele) => {
       ele.disabled = false;
       ele.disabled = false;
-      tableArray.content.forEach((element) => {
+      tableTestArray.content.forEach((element) => {
         if (element.key === e.key && element.key !== 'scope') {
         if (element.key === e.key && element.key !== 'scope') {
           element.value = null;
           element.value = null;
         }
         }
@@ -204,7 +179,7 @@
       const { options } = await useApi(e.key);
       const { options } = await useApi(e.key);
       treeData.value = options as any;
       treeData.value = options as any;
     } else if (e.key === 'entityId') {
     } else if (e.key === 'entityId') {
-      const getOrganizationIds = tableArray.content
+      const getOrganizationIds = tableTestArray.content
         .map((f) => {
         .map((f) => {
           if (f.key === 'organizationId') {
           if (f.key === 'organizationId') {
             return f.value;
             return f.value;
@@ -214,7 +189,7 @@
       if (getOrganizationIds.length === 0) return;
       if (getOrganizationIds.length === 0) return;
       getEntityOptions(getOrganizationIds?.at(-1));
       getEntityOptions(getOrganizationIds?.at(-1));
     } else if (e.key === 'keys') {
     } else if (e.key === 'keys') {
-      const getIds = tableArray.content
+      const getIds = tableTestArray.content
         .map((f) => {
         .map((f) => {
           if (f.key === 'deviceProfileId') {
           if (f.key === 'deviceProfileId') {
             return f.value;
             return f.value;
@@ -229,7 +204,7 @@
   };
   };
 
 
   const handleOrgnationChange = async (e) => {
   const handleOrgnationChange = async (e) => {
-    tableArray.content.forEach((f) => {
+    tableTestArray.content.forEach((f) => {
       if (f.key === 'entityId') {
       if (f.key === 'entityId') {
         f.value = null;
         f.value = null;
       }
       }
@@ -253,7 +228,7 @@
 
 
   const handleValueChange = (e) => {
   const handleValueChange = (e) => {
     if (e.key === 'deviceProfileId') {
     if (e.key === 'deviceProfileId') {
-      tableArray.content.forEach((f) => {
+      tableTestArray.content.forEach((f) => {
         if (f.key === 'keys') {
         if (f.key === 'keys') {
           f.value = null;
           f.value = null;
         }
         }
@@ -264,10 +239,11 @@
 
 
   //获取数据
   //获取数据
   const getValue = () => {
   const getValue = () => {
-    return tableArray.content;
+    return tableTestArray.content;
   };
   };
   defineExpose({
   defineExpose({
     getValue,
     getValue,
+    setTableArray,
   });
   });
 </script>
 </script>
 
 
@@ -285,6 +261,7 @@
     }
     }
 
 
     table td {
     table td {
+      width: 7vw;
       padding: 5px;
       padding: 5px;
       white-space: nowrap;
       white-space: nowrap;
       &:extend(.table-border-color);
       &:extend(.table-border-color);

@@ -2,7 +2,7 @@
   <div>
   <div>
     <div class="mt-8">
     <div class="mt-8">
       <div>
       <div>
-        <Button @click="showTestEditCell = true" type="primary"> 测试接口 </Button>
+        <Button @click="handleTest" type="primary"> 测试接口 </Button>
       </div>
       </div>
       <div v-if="showTestEditCell" class="mt-8">
       <div v-if="showTestEditCell" class="mt-8">
         <a-row type="flex" justify="center">
         <a-row type="flex" justify="center">
@@ -35,18 +35,20 @@
   </div>
   </div>
 </template>
 </template>
 <script lang="ts" setup name="testRequest">
 <script lang="ts" setup name="testRequest">
-  import { ref } from 'vue';
+  import { ref, nextTick } from 'vue';
   import { Button } from 'ant-design-vue';
   import { Button } from 'ant-design-vue';
   import { TestEditCellTable } from '../TestEditCellTable/index';
   import { TestEditCellTable } from '../TestEditCellTable/index';
   import { getAllDeviceByOrg } from '/@/api/dataBoard';
   import { getAllDeviceByOrg } from '/@/api/dataBoard';
   import { getDeviceAttributes } from '/@/api/dataBoard';
   import { getDeviceAttributes } from '/@/api/dataBoard';
 
 
-  defineProps({
+  const emits = defineEmits(['testInterface']);
+
+  const props = defineProps({
     method: {
     method: {
       type: String,
       type: String,
     },
     },
     data: {
     data: {
-      type: Object,
+      type: Array,
     },
     },
   });
   });
 
 
@@ -58,11 +60,23 @@
 
 
   // const testNeedKeys = ['organizationId', 'deviceProfileId', 'entityId', 'keys', 'date'];
   // const testNeedKeys = ['organizationId', 'deviceProfileId', 'entityId', 'keys', 'date'];
 
 
+  const handleTest = () => {
+    showTestEditCell.value = true;
+    emits('testInterface');
+    getValue();
+  };
+
+  const getValue = async () => {
+    await nextTick();
+    await nextTick(() => {
+      testEditCellTableRef.value?.setTableArray(props.data);
+    });
+  };
+
   const handleExcute = async () => {
   const handleExcute = async () => {
     const params = testEditCellTableRef.value?.getValue();
     const params = testEditCellTableRef.value?.getValue();
     const keys = params?.map((m) => ({ key: m.key, value: m.value }));
     const keys = params?.map((m) => ({ key: m.key, value: m.value }));
     keys?.forEach(async (it: any) => {
     keys?.forEach(async (it: any) => {
-      console.log(it);
       if (it.key === 'organizationId') {
       if (it.key === 'organizationId') {
         //获取设备
         //获取设备
         const data = await getAllDeviceByOrg(it.value!);
         const data = await getAllDeviceByOrg(it.value!);
@@ -83,6 +97,7 @@
   };
   };
   defineExpose({
   defineExpose({
     setValue,
     setValue,
+    handleTest,
   });
   });
 </script>
 </script>
 
 

@@ -4,7 +4,7 @@
       <Button @click="handleExcute" type="primary"> 测试SQL </Button>
       <Button @click="handleExcute" type="primary"> 测试SQL </Button>
     </div>
     </div>
   </div>
   </div>
-  <div class="mt-8">
+  <div v-if="testResultStatus" class="mt-8">
     <div class="mt-8">
     <div class="mt-8">
       <a-row type="flex" justify="center">
       <a-row type="flex" justify="center">
         <a-col :span="3"> 测试结果 </a-col>
         <a-col :span="3"> 测试结果 </a-col>
@@ -33,7 +33,10 @@
 
 
   const testResult = ref('');
   const testResult = ref('');
 
 
+  const testResultStatus = ref(false);
+
   const handleExcute = async () => {
   const handleExcute = async () => {
+    testResultStatus.value = true;
     testResult.value = '测试结果为：1234';
     testResult.value = '测试结果为：1234';
   };
   };
 
 

@@ -194,7 +194,7 @@ export const schemas: FormSchema[] = [
   },
   },
   {
   {
     field: 'testSlot',
     field: 'testSlot',
-    label: '测试',
+    label: '',
     component: 'Input',
     component: 'Input',
     slot: 'testSql',
     slot: 'testSql',
     colProps: { span: 24 },
     colProps: { span: 24 },

@@ -13,21 +13,25 @@
             ref="simpleRequestRef"
             ref="simpleRequestRef"
             v-if="model['requestContentType'] === '0'"
             v-if="model['requestContentType'] === '0'"
             @activeKey="handleActiveKey"
             @activeKey="handleActiveKey"
+            :paramsType="model['requestHttpType']"
             :method="model['requestContentType']"
             :method="model['requestContentType']"
           />
           />
           <SimpleRequest
           <SimpleRequest
             ref="simpleRequestRef"
             ref="simpleRequestRef"
             @activeKey="handleActiveKey"
             @activeKey="handleActiveKey"
             v-else-if="model['requestContentType'] === '2'"
             v-else-if="model['requestContentType'] === '2'"
+            :paramsType="model['requestHttpType']"
             :method="model['requestContentType']"
             :method="model['requestContentType']"
           />
           />
         </template>
         </template>
         <template #testSql="{ model }">
         <template #testSql="{ model }">
-          <TestSql
-            ref="testSqlRef"
-            v-if="model['requestContentType'] === '1'"
-            :method="model['requestContentType']"
-          />
+          <div style="margin: auto 7.5rem">
+            <TestSql
+              ref="testSqlRef"
+              v-if="model['requestContentType'] === '1'"
+              :method="model['requestContentType']"
+            />
+          </div>
         </template>
         </template>
       </BasicForm>
       </BasicForm>
     </BasicDrawer>
     </BasicDrawer>
@@ -71,8 +75,8 @@
     setDrawerProps({ loading: true });
     setDrawerProps({ loading: true });
     await nextTick();
     await nextTick();
     await resetFields();
     await resetFields();
-    nextTick(() => simpleRequestRef.value?.resetValue());
-    nextTick(() => testSqlRef.value?.resetValue());
+    await nextTick(() => simpleRequestRef.value?.resetValue());
+    await nextTick(() => testSqlRef.value?.resetValue());
     const title = `${!data.isUpdate ? '新增' : '修改'}公共接口`;
     const title = `${!data.isUpdate ? '新增' : '修改'}公共接口`;
     setDrawerProps({ title });
     setDrawerProps({ title });
     isUpdate.value = data.isUpdate;
     isUpdate.value = data.isUpdate;
@@ -112,7 +116,7 @@
     try {
     try {
       const values = await validate();
       const values = await validate();
       if (!values) return;
       if (!values) return;
-      const Objects = simpleRequestRef.value?.getValue();
+      const Objects = simpleRequestRef.value?.getValue(true);
       const data = {
       const data = {
         ...values,
         ...values,
         id: !putId.value ? null : putId.value,
         id: !putId.value ? null : putId.value,