完善设备端物模型界面

apps/web-antd/src/views/thingmodelinfo/deviceThingModelManagement/index.vue

@@ -2,7 +2,7 @@
 import type { VbenFormProps } from '#/adapter/form';
 import type { VxeGridProps } from '#/adapter/vxe-table';
 
-import { h, nextTick, ref } from 'vue';
+import { h, nextTick, onMounted, ref } from 'vue';
 import { useRoute } from 'vue-router';
 
 import { Page, useVbenModal } from '@vben/common-ui';
@@ -73,7 +73,9 @@ const formOptions: VbenFormProps = {
       setTimeout(async () => {
         if (gridApi && gridApi.reload) {
           try {
-            await gridApi.reload();
+            // 使用最新表单值触发查询，确保搜索关键字等一起传递
+            const latestValues = await gridApi.formApi.getValues();
+            await gridApi.reload(latestValues);
           } catch (error) {
             console.error('重新加载设备端物模型列表时出错:', error);
           }
@@ -81,6 +83,16 @@ const formOptions: VbenFormProps = {
       }, 100);
     }
   },
+  // 点击搜索按钮时触发
+  handleSubmit: async (values) => {
+    if (gridApi && gridApi.reload) {
+      try {
+        await gridApi.reload(values);
+      } catch (error) {
+        console.error('搜索设备端物模型列表失败:', error);
+      }
+    }
+  },
 };
 
 const gridOptions: VxeGridProps<any> = {
@@ -106,24 +118,24 @@ const gridOptions: VxeGridProps<any> = {
         const currentProductId =
           formValues?.ioTPlatformProductId || productId.value;
 
-        if (!currentPlatform || !currentProductId) {
-          return {
-            items: [],
-            totalCount: 0,
-          };
-        }
-
         try {
           const { data } = await postDeviceThingModelManagementPageAsync({
+            // 使用 JSON Body 传参，按需附加过滤条件
             body: {
               pageIndex: page.currentPage,
               pageSize: page.pageSize,
+              ...(currentPlatform && {
                 ioTPlatform:
                   typeof currentPlatform === 'string'
                     ? Number.parseInt(currentPlatform)
                     : currentPlatform,
+              }),
+              ...(currentProductId && {
                 ioTPlatformProductId: String(currentProductId),
-              searchKeyWords: formValues?.SearchKeyWords,
+              }),
+              ...(formValues?.SearchKeyWords && {
+                searchKeyWords: formValues.SearchKeyWords,
+              }),
             },
           });
 
@@ -157,7 +169,12 @@ const [ThingModelModal, thingModelModalApi] = useVbenModal({
     if (isOpen && editRow.value.id) {
       // 编辑模式下，模态框打开后设置表单值
       nextTick(() => {
-        editFormApi.setValues({ ...editRow.value });
+        const values: any = { ...editRow.value };
+        // 确保平台类型与下拉框值类型一致（通常为字符串）
+        if (values.ioTPlatform !== undefined && values.ioTPlatform !== null) {
+          values.ioTPlatform = String(values.ioTPlatform);
+        }
+        editFormApi.setValues(values);
       });
     }
   },
@@ -223,7 +240,11 @@ async function submit() {
       );
       thingModelModalApi.close();
       editRow.value = {};
-      gridApi.reload();
+      // 提交成功后，使用当前查询表单的最新参数刷新列表，确保搜索条件等不会丢失
+      if (gridApi && gridApi.reload && gridApi.formApi) {
+        const latestValues = await gridApi.formApi.getValues();
+        await gridApi.reload(latestValues);
+      }
     } else {
       Message.error(
         isEdit ? $t('common.editFail') : $t('common.addFail'),
@@ -264,6 +285,40 @@ async function onDel(record: any) {
     Message.error($t('common.deleteFail'));
   }
 }
+
+// 页面初始化时，自动加载一次列表数据（无产品ID也允许加载）
+onMounted(async () => {
+  await nextTick();
+  setTimeout(async () => {
+    if (!gridApi || !gridApi.reload) return;
+
+    try {
+      // 先把路由参数（如果有）同步到查询表单
+      const formValues = await gridApi.formApi.getValues();
+      const newValues: any = { ...formValues };
+
+      if (route.query.ioTPlatform && !formValues.ioTPlatform) {
+        newValues.ioTPlatform = route.query.ioTPlatform;
+      }
+      if (route.query.productId && !formValues.ioTPlatformProductId) {
+        newValues.ioTPlatformProductId = route.query.productId;
+      }
+
+      if (
+        newValues.ioTPlatform !== formValues.ioTPlatform ||
+        newValues.ioTPlatformProductId !== formValues.ioTPlatformProductId
+      ) {
+        await gridApi.formApi.setValues(newValues);
+        await nextTick();
+      }
+
+      // 无论是否有产品ID，都加载一次列表数据
+      await gridApi.reload(newValues);
+    } catch (error) {
+      console.error('初始化加载设备端物模型列表失败:', error);
+    }
+  }, 300);
+});
 </script>
 
 <template>