|
@@ -1,6 +1,6 @@
|
|
|
-import React, { useEffect, useState } from 'react';
|
|
|
+import React, { useEffect, useState, useRef } from 'react';
|
|
|
import styles from './index.less';
|
|
|
-import { Select } from 'antd';
|
|
|
+import { Select, Spin } from 'antd';
|
|
|
//import { mapListData } from '@/hooks/useMapList';
|
|
|
import { SearchOutlined } from '@ant-design/icons';
|
|
|
import { useModel } from 'umi';
|
|
@@ -21,19 +21,15 @@ const SearchInput: React.FC<SearchInputProps> = ({ mapList }) => {
|
|
|
const [matchData, setMatchData] = useState<mapResType[]>([]);
|
|
|
const [value, setValue] = useState<any>();
|
|
|
const { changeSearchBuildId, changeSearchFloorId, changeSearchText } = useModel('searchInfo');
|
|
|
+ const [loading, setLoading] = useState<boolean>(false);
|
|
|
+ const ref = useRef<any>(0);
|
|
|
+ const searchQuery = (value: string) => {
|
|
|
+ if (ref.current) {
|
|
|
+ clearTimeout(ref.current);
|
|
|
+ }
|
|
|
|
|
|
- //这是搜索 的下拉列表的显示
|
|
|
- const handleSearch = (value: string) => {
|
|
|
- if (value) {
|
|
|
- // let data: mapResType[] = [];
|
|
|
- // mapList.map((item, index) => {
|
|
|
- // if ((item.localName || '').indexOf(value) > -1) {
|
|
|
- // data.push({
|
|
|
- // text: item.localName,
|
|
|
- // value: item.localName,
|
|
|
- // });
|
|
|
- // }
|
|
|
- // });
|
|
|
+ function fake() {
|
|
|
+ setLoading(true);
|
|
|
var paramsObj = {
|
|
|
criteria: {
|
|
|
projectId: projectId,
|
|
@@ -47,11 +43,24 @@ const SearchInput: React.FC<SearchInputProps> = ({ mapList }) => {
|
|
|
var resContent = res.content || [];
|
|
|
console.log('setMatch', 'data');
|
|
|
setMatchData(resContent);
|
|
|
+ setLoading(false);
|
|
|
});
|
|
|
+ }
|
|
|
+ // debugger;
|
|
|
+ if (value) {
|
|
|
+ ref.current = setTimeout(fake, 600);
|
|
|
} else {
|
|
|
setMatchData([]);
|
|
|
}
|
|
|
};
|
|
|
+ //这是搜索 的下拉列表的显示
|
|
|
+ const handleSearch = (value: string) => {
|
|
|
+ //if (value) {
|
|
|
+ searchQuery(value);
|
|
|
+ // } else {
|
|
|
+ // setMatchData([]);
|
|
|
+ // }
|
|
|
+ };
|
|
|
|
|
|
//这是搜索的下拉列表的点击
|
|
|
const handleChange = (sel: string) => {
|
|
@@ -84,19 +93,19 @@ const SearchInput: React.FC<SearchInputProps> = ({ mapList }) => {
|
|
|
|
|
|
return (
|
|
|
<div className={styles.headerSearch}>
|
|
|
- <SearchOutlined style={{ fontSize: 16 }} />
|
|
|
+ {/* <SearchOutlined style={{ fontSize: 16 }} /> */}
|
|
|
<Select
|
|
|
showSearch
|
|
|
value={value}
|
|
|
placeholder="搜索空间"
|
|
|
defaultActiveFirstOption={false}
|
|
|
- showArrow={false}
|
|
|
filterOption={false}
|
|
|
onSearch={handleSearch}
|
|
|
onChange={handleChange}
|
|
|
onInputKeyDown={handelInputKeyDown}
|
|
|
notFoundContent={null}
|
|
|
bordered={false}
|
|
|
+ loading={loading}
|
|
|
style={{ width: 150, borderColor: '#c4c4c4' }}
|
|
|
// suffixIcon={
|
|
|
// <AudioOutlined
|