feat(search): search component

package.json

@@ -54,6 +54,7 @@
     "not ie <= 10"
   ],
   "dependencies": {
+    "@ahooksjs/use-url-state": "^3.5.0",
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@amap/amap-jsapi-types": "^0.0.8",
     "@ant-design/charts": "^1.3.1",
@@ -63,13 +64,13 @@
     "@ant-design/pro-form": "^1.18.3",
     "@ant-design/pro-layout": "^6.27.2",
     "@ant-design/pro-list": "^1.21.61",
-    "@formily/antd": "2.1.2",
-    "@formily/core": "2.1.2",
-    "@formily/json-schema": "2.1.2",
-    "@formily/react": "2.1.2",
-    "@formily/reactive": "2.1.2",
-    "@formily/reactive-react": "2.1.2",
-    "@formily/shared": "2.1.2",
+    "@formily/antd": "2.1.6",
+    "@formily/core": "2.1.6",
+    "@formily/json-schema": "2.1.6",
+    "@formily/react": "2.1.6",
+    "@formily/reactive": "2.1.6",
+    "@formily/reactive-react": "2.1.6",
+    "@formily/shared": "2.1.6",
     "@jetlinks/pro-list": "^1.10.8",
     "@jetlinks/pro-table": "^2.63.11",
     "@liveqing/liveplayer": "^2.6.4",

src/components/SearchComponent/index.tsx

@@ -34,6 +34,7 @@ import _ from 'lodash';
 import { useIntl } from '@@/plugin-locale/localeExports';
 import classnames from 'classnames';
 import { onlyMessage, randomString } from '@/utils/util';
+import useUrlState from '@ahooksjs/use-url-state';
 
 const ui2Server = (source: SearchTermsUI): SearchTermsServer => [
   { terms: source.terms1 },
@@ -436,13 +437,6 @@ const SearchComponent = <T extends Record<string, any>>(props: Props<T>) => {
     uiParamRef.current = ui2Server(log);
     const _expand =
       (log.terms1 && log.terms1?.length > 1) || (log.terms2 && log.terms2?.length > 1);
-    console.log(
-      _expand,
-      '展开',
-      log,
-      (log.terms1 && log.terms1?.length > 1) || (log.terms2 && log.terms2?.length > 1),
-    );
-    console.log(log.terms1, log.terms2, 'log-terms');
     if (_expand) {
       setExpand(false);
     }
@@ -500,18 +494,21 @@ const SearchComponent = <T extends Record<string, any>>(props: Props<T>) => {
 
     return _value
       .filter((i) => i.terms && i.terms?.length > 0)
-      .map((term) => {
-        term.terms?.map((item) => {
-          if (item.termType === 'like') {
-            item.value = `%${item.value}%`;
+      .map((_term) => {
+        _term.terms = _term.terms
+          ?.filter((term) => term.value !== '')
+          .map((item) => {
+            if (item.termType === 'like' && item.value && item.value !== '') {
+              item.value = `%${item.value}%`;
+              return item;
+            }
             return item;
-          }
-          return item;
-        });
-        return term;
+          });
+        return _term;
       });
   };
 
+  const [url, setUrl] = useUrlState();
   const handleSearch = async () => {
     const value = form.values;
     const filterTerms = (data: Partial<Term>[] | undefined) =>
@@ -519,11 +516,17 @@ const SearchComponent = <T extends Record<string, any>>(props: Props<T>) => {
     const _terms = _.cloneDeep(value);
     _terms.terms1 = filterTerms(_terms.terms1);
     _terms.terms2 = filterTerms(_terms.terms2);
-
-    onSearch({ terms: formatValue(_terms) });
+    const _temp = formatValue(_terms);
+    setUrl({ q: JSON.stringify(value) });
+    onSearch({ terms: _temp });
   };
 
   useEffect(() => {
+    form.setValues(JSON.parse(url.q));
+    handleSearch();
+  }, [url]);
+
+  useEffect(() => {
     if (defaultParam) {
       handleSearch();
     }

src/pages/Northbound/DuerOS/Detail/index.tsx

@@ -65,7 +65,6 @@ const Save = () => {
     service.getProduct().then((resp) => {
       const _temp = resp.result.map((item: any) => ({ label: item.name, value: item.id }));
       Store.set('product-list', _temp);
-      console.log(_temp, 'tmp');
       return _temp;
     });