项目开发完成

src/pages/index/index.tsx

@@ -1,11 +1,11 @@
 import Header from './Header'
-import Chart from "./Chart"
-import SiteUrl from "./SiteUrl"
-import BestSellers from "./BestSellers";
-import Help from "./Help";
+// import BestSellers from "./BestSellers";
 import './index.scss'
 import Taro from '@tarojs/taro';
-import {InfiniteLoading} from '@nutui/nutui-react-taro'
+import {Map} from '@tarojs/components'
+import {Search} from '@nutui/icons-react-taro'
+import {Button, Input} from '@nutui/nutui-react-taro'
+// import {InfiniteLoading} from '@nutui/nutui-react-taro'
 import {useShareAppMessage, useShareTimeline} from "@tarojs/taro"
 import {useEffect, useState} from "react";
 import ExpirationTime from "./ExpirationTime";
@@ -13,13 +13,31 @@ import {User} from "@/api/system/user/model";
 import {getSiteInfo, getUserInfo, getWxOpenId} from "@/api/layout";
 import Login from "./Login";
 import {CmsWebsite} from "@/api/cms/cmsWebsite/model";
+import {pageByQQMap, pageHjmCar} from "@/api/hjm/hjmCar";
+import {HjmCar} from "@/api/hjm/hjmCar/model";
+
+export interface Market {
+  // 自增ID
+  id?: number;
+  latitude?: number;
+  longitude?: number;
+  name?: string;
+  title?: string;
+}
 
 function Home() {
   const [website, setWebsite] = useState<CmsWebsite>()
   const [IsLogin, setIsLogin] = useState<boolean>(true)
-  const [current, setCurrent] = useState<User>()
   const [userInfo, setUserInfo] = useState<User>()
+  const [longitude, setLongitude] = useState<any>(108.374959)
+  const [latitude, setLatitude] = useState<any>(22.767024)
+  const [markers, setMarkers] = useState<Market[]>([])
+  const [scale, setScale] = useState<any>(16)
+  const [keywords, setKeywords] = useState<string>('')
+  const [list, setList] = useState<HjmCar[]>([])
   console.log(userInfo?.nickname)
+  console.log(website?.websiteName)
+  console.log(list.length)
   // const [hasMore, setHasMore] = useState(true)
   // const [list, setList] = useState<BszxPay[]>([])
   // const [page, setPage] = useState(1)
@@ -81,6 +99,10 @@ function Home() {
     });
   };
 
+  const onKeywords = (keywords: string) => {
+    setKeywords(keywords)
+  }
+
   // 登录成功后回调
   const handleLogin = (data: User) => {
     setIsLogin(true)
@@ -89,20 +111,79 @@ function Home() {
     reload();
   }
 
-  // 选择站点
-  const handleSite = (data: User) => {
-    setCurrent(data)
-    Taro.reLaunch({
-      url: '/pages/index/index'
-    })
+  // 获取当前位置
+  const getLocation = async () => {
+    try {
+      const res = await Taro.getLocation({
+        type: 'gcj02' //返回可以用于wx.openLocation的经纬度
+      })
+      pageByQQMap({
+        latitude: res.latitude,
+        longitude: res.longitude,
+      }).then(res => {
+        if (res?.list && res?.list.length > 0) {
+          const data = res?.list;
+          const arr = []
+          data?.map((item: HjmCar) => {
+            // @ts-ignore
+            arr.push({
+              id: item.id,
+              latitude: item.latitude,
+              longitude: item.longitude,
+              name: item.organization
+            })
+          })
+          setMarkers(arr)
+        }
+      })
+      if (res.latitude) {
+        setLatitude(res.latitude)
+      }
+      if (res.longitude) {
+        setLongitude(res.longitude)
+      }
+      console.log(res)
+      console.log('当前位置：', res.latitude, res.longitude);
+      return res;
+    } catch (err) {
+      console.error('获取位置失败：', err);
+    }
   }
 
   const reload = () => {
+    pageHjmCar({keywords}).then(res => {
+      setList(res?.list || [])
+      if (res?.list && res?.list.length > 0) {
+        // const data = res?.list[0];
+        // setLongitude(data?.longitude)
+        // setLatitude(data?.latitude)
+      }
+    })
+  };
+
+  useEffect(() => {
+    Taro.hideTabBar()
+    setScale(14)
+    getLocation().then()
     // 获取站点信息
     getSiteInfo().then((data) => {
-      console.log(data,'siteInfo')
+      console.log(data, 'siteInfo')
       setWebsite(data)
     })
+    // Taro.getSetting：获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。
+    Taro.getSetting({
+      success: (res) => {
+        if (res.authSetting['scope.userInfo']) {
+          // 用户已经授权过，可以直接获取用户信息
+          console.log('用户已经授权过，可以直接获取用户信息')
+          reload();
+        } else {
+          // 用户未授权，需要弹出授权窗口
+          console.log('用户未授权，需要弹出授权窗口')
+          showAuthModal();
+        }
+      }
+    });
     // 获取用户信息
     Taro.getUserInfo({
       success: (res) => {
@@ -133,39 +214,58 @@ function Home() {
         });
       }
     });
-  };
-
-  useEffect(() => {
-    // Taro.getSetting：获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。
-    Taro.getSetting({
-      success: (res) => {
-        if (res.authSetting['scope.userInfo']) {
-          // 用户已经授权过，可以直接获取用户信息
-          console.log('用户已经授权过，可以直接获取用户信息')
-          reload();
-        } else {
-          // 用户未授权，需要弹出授权窗口
-          console.log('用户未授权，需要弹出授权窗口')
-          showAuthModal();
-        }
-      }
-    });
   }, []);
 
   return (
     <>
       {!IsLogin ? (<Login done={handleLogin}/>) : (<>
-        <Header website={website} onSite={handleSite}/>
-        <InfiniteLoading
-          className={'top-24 w-full fixed left-0'}
-        >
-          <SiteUrl tenantId={current?.tenantId}/>
-          <Chart/>
-          <ExpirationTime/>
-          <BestSellers/>
-          <Help />
-          <div className={'h-20'}/>
-        </InfiniteLoading>
+        <Header user={userInfo}/>
+        <ExpirationTime/>
+        <div className={'fixed z-20 top-24 left-0 w-full'}>
+          <div className={'px-4'}>
+            <div
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                background: '#fff',
+                padding: '0 10px',
+                borderRadius: '20px'
+              }}
+            >
+              <Search/>
+              <Input
+                placeholder="车辆编号"
+                value={keywords}
+                onChange={onKeywords}
+                onConfirm={reload}
+              />
+              <div
+                className={'flex items-center'}
+              >
+                <Button type="warning" onClick={reload}>
+                  查询
+                </Button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <Map
+          id="map"
+          longitude={longitude}
+          latitude={latitude}
+          scale={scale}
+          // @ts-ignore
+          markers={markers}
+          onTap={(map) => {
+            console.log('map tap',map)
+          }}
+          style={{width: '100%', height: '100vh'}}
+        />
+        {/*<InfiniteLoading*/}
+        {/*  className={'w-full fixed left-0 top-40'}*/}
+        {/*>*/}
+        {/*  <BestSellers data={list}/>*/}
+        {/*</InfiniteLoading>*/}
       </>)}
     </>
   )