fix: bug#3734

src/components/ProTableCard/index.less

@@ -160,11 +160,13 @@
       height: 100%;
       color: #fff;
       background-color: rgba(#000, 0);
+      visibility: hidden;
       cursor: pointer;
       transition: all 0.3s;
 
       &.show {
         background-color: rgba(#000, 0.5);
+        visibility: visible;
       }
     }
   }

src/models/location.ts

@@ -0,0 +1,18 @@
+export default {
+  namespace: 'location',
+  state: {
+    locationState: {},
+    path: '',
+  },
+  reducers: {
+    push(s: any, payload: any) {
+      return payload.payload;
+    },
+    cleanLocationState() {
+      return {
+        locationState: {},
+        path: '',
+      };
+    },
+  },
+};

src/pages/device/Instance/index.tsx

@@ -1,10 +1,10 @@
-import {PageContainer} from '@ant-design/pro-layout';
-import type {ActionType, ProColumns} from '@jetlinks/pro-table';
-import type {DeviceInstance} from '@/pages/device/Instance/typings';
+import { PageContainer } from '@ant-design/pro-layout';
+import type { ActionType, ProColumns } from '@jetlinks/pro-table';
+import type { DeviceInstance } from '@/pages/device/Instance/typings';
 import moment from 'moment';
-import {Badge, Button, Dropdown, Menu, message, Popconfirm, Tooltip} from 'antd';
-import {useRef, useState} from 'react';
-import {useHistory} from 'umi';
+import { Badge, Button, Dropdown, Menu, message, Popconfirm, Tooltip } from 'antd';
+import { useEffect, useRef, useState } from 'react';
+import { useHistory } from 'umi';
 import {
   CheckCircleOutlined,
   DeleteOutlined,
@@ -16,23 +16,21 @@ import {
   StopOutlined,
   SyncOutlined,
 } from '@ant-design/icons';
-import {model} from '@formily/reactive';
+import { model } from '@formily/reactive';
 import Service from '@/pages/device/Instance/service';
 import type { MetadataItem } from '@/pages/device/Product/typings';
-import { useIntl, useLocation } from 'umi';
+import { useIntl, connect } from 'umi';
 import Save from './Save';
 import Export from './Export';
 import Import from './Import';
 import Process from './Process';
 import SearchComponent from '@/components/SearchComponent';
-import {ProTableCard} from '@/components';
+import { ProTableCard } from '@/components';
 import SystemConst from '@/utils/const';
 import Token from '@/utils/token';
 import DeviceCard from '@/components/ProTableCard/CardItems/device';
 
 import { getButtonPermission, getMenuPathByParams, MENUS_CODE } from '@/utils/menu';
-import { withRouter } from 'react-router-dom';
-
 
 export const statusMap = new Map();
 statusMap.set('在线', 'success');
@@ -70,9 +68,23 @@ const Instance = (props: any) => {
   const [bindKeys, setBindKeys] = useState<any[]>([]);
   const history = useHistory<Record<string, string>>();
   const intl = useIntl();
-  const location = useLocation();
 
-  console.log(location, props.location.query);
+  useEffect(() => {
+    console.log(searchParams);
+    if (props.path) {
+      const _terms: any[] = [];
+      Object.keys(props.locationState).forEach((key) => {
+        _terms.push({
+          column: key,
+          value: props.locationState[key],
+        });
+      });
+      setSearchParams({
+        terms: _terms,
+      });
+      props.cleanLocationState();
+    }
+  }, [props.path]);
 
   const tools = (record: DeviceInstance) => [
     <Button
@@ -599,4 +611,16 @@ const Instance = (props: any) => {
     </PageContainer>
   );
 };
-export default withRouter(Instance);
+
+const mapState = (state: any) => {
+  return {
+    locationState: state.location.locationState,
+    path: state.location.path,
+  };
+};
+
+const actionCreate = {
+  cleanLocationState: (payload: any) => ({ type: 'location/clean', payload }),
+};
+
+export default connect(mapState, actionCreate)(Instance);

src/pages/device/Product/Detail/index.tsx

@@ -16,9 +16,8 @@ import BaseInfo from '@/pages/device/Product/Detail/BaseInfo';
 import { observer } from '@formily/react';
 import { productModel, service } from '@/pages/device/Product';
 import { useCallback, useEffect, useState } from 'react';
-import { useIntl } from '@@/plugin-locale/localeExports';
+import { useIntl, connect } from 'umi';
 import Metadata from '@/pages/device/components/Metadata';
-// import Alarm from '@/pages/device/components/Alarm';
 import Access from '@/pages/device/Product/Detail/Access';
 import type { DeviceMetadata } from '@/pages/device/Product/typings';
 import { Store } from 'jetlinks-store';
@@ -34,7 +33,7 @@ export const ModelEnum = {
   access: 'access',
 };
 
-const ProductDetail = observer(() => {
+const ProductDetail = observer((props: any) => {
   const intl = useIntl();
   const [mode, setMode] = useState('base');
   const param = useParams<{ id: string }>();
@@ -207,9 +206,15 @@ const ProductDetail = observer(() => {
                 type={'link'}
                 style={{ padding: 0, height: 'auto' }}
                 onClick={() => {
-                  history.push(getMenuPathByCode(MENUS_CODE['device/Instance']), {
+                  const url = getMenuPathByCode(MENUS_CODE['device/Instance']);
+                  const params = {
                     productId: productModel.current?.id,
+                  };
+                  props.push({
+                    locationState: params,
+                    path: url,
                   });
+                  history.push(url, params);
                 }}
               >
                 {productModel.current?.count || 0}
@@ -326,4 +331,16 @@ const ProductDetail = observer(() => {
     </PageContainer>
   );
 });
-export default ProductDetail;
+
+const mapState = (state: any) => ({
+  state: state.state,
+  path: state.path,
+});
+
+const actionCreate = {
+  push: (payload: any) => {
+    return { type: 'location/push', payload };
+  },
+};
+
+export default connect(mapState, actionCreate)(ProductDetail);