列表

src/pages/searchResult/index.tsx

@@ -0,0 +1,65 @@
+import { View } from "@tarojs/components";
+// import styles from "./index.scss";
+import CityFilter from "@/components/CityFilter";
+import Menu from "@/components/Menu";
+import { useListState } from "@/store/listStore";
+import ListContainer from "@/container/listContainer";
+
+import "./index.scss";
+
+const SearchResult = () => {
+  const {
+    distanceData,
+    quickFilterData,
+    distanceQuickFilter,
+    updateState,
+    matches,
+    loading,
+    error,
+    refreshMatches,
+  } = useListState() || {};
+
+  // 距离筛选
+  const handleDistanceOrQuickChange = (name, value) => {
+    updateState({
+      distanceQuickFilter: {
+        ...distanceQuickFilter,
+        [name]: value,
+      },
+    });
+  };
+
+  return (
+    <View>
+      {/* 筛选 */}
+      <View className='searchResultFilterWrapper'>
+        {/* 全城筛选 */}
+        <CityFilter
+          options={distanceData}
+          value={distanceQuickFilter?.distance}
+          wrapperClassName='menuFilter'
+          onChange={handleDistanceOrQuickChange}
+          name="distance"
+        />
+        {/* 智能排序 */}
+        <Menu
+          options={quickFilterData}
+          value={distanceQuickFilter?.quick}
+          onChange={handleDistanceOrQuickChange}
+          wrapperClassName='menuFilter'
+          name="quick"
+        />
+      </View>
+
+      {/* 列表内容 */}
+      <ListContainer
+        data={matches}
+        loading={loading}
+        error={error}
+        reload={refreshMatches}
+      />
+    </View>
+  );
+};
+
+export default SearchResult;