.

src/pages/index/components/User/index.jsx

@@ -44,6 +44,9 @@ export default (props) => {
   const signOut = () => { 
     Taro.reLaunch({ url: '/pages/index/index?tab=2' });
   }
+  const handleMap = () => { 
+    Taro.reLaunch({ url: '/pages/machineryMap/index' });
+  }
   return (
     <ScrollView scrollY style={{ height: '100%' }}>
       {
@@ -102,6 +105,10 @@ export default (props) => {
         <View className='userBox'>
           <MyCell icon={feedback} action={goto} user handleAction={handleFeedback}>意见反馈</MyCell>
         </View>
+
+        <View className='userBox'>
+          <MyCell icon={feedback} action={goto} user handleAction={handleMap}>农机地图</MyCell>
+        </View>
         {
           isLogin && <View className='signOut' onClick={signOut}>退出登录</View>
         }

src/pages/machineryMap/index.config.js

@@ -0,0 +1,7 @@
+export default {
+  navigationBarTitleText: '我的农机',
+  navigationStyle: 'custom',
+  styleIsolation: 'shared',
+  enableShareAppMessage: true,
+  disableScroll: true,
+}

src/pages/machineryMap/index.jsx

@@ -0,0 +1,69 @@
+import Taro from "@tarojs/taro"
+import { useState } from "react"
+import { View, Map,Image } from "@tarojs/components"
+import withLayout from '@/layouts'
+import CustomNav from "@/components/CustomNav"
+import m1 from '@/assets/machinery/greenMachinery.png'
+import m2 from '@/assets/machinery/orangeMachinery.png'
+import picon from '@/assets/comm/position.png'
+import './style.less'
+
+export default withLayout((props) => {
+  const [show,setShow]=useState(false)
+  const markers=[
+    {
+      id:1,
+      longitude:112.105348,
+      latitude:32.697352,
+      iconPath:m1,
+      width:50,
+      height:50
+    },
+    {
+      id:2,
+      longitude:112.120295,
+      latitude:32.686656,
+      iconPath:m2,      
+      width:50,
+      height:50
+    }
+  ]
+  const handleClick=(e)=>{
+    console.log(e.markerId)
+    setShow(true)
+  }
+  const goDetail=()=>{
+    Taro.navigateTo({ url: '/pages/machineryDetail/index' });
+  }
+  return (
+    <View className='page-index'>
+      <View className='index-navbar'>
+        <CustomNav title='我的农机' />
+      </View>
+      <View className='index-container machineryMap'>
+        <Map 
+          longitude={112.116846} 
+          latitude={32.688935} 
+          markers={markers} 
+          className='map' 
+          onMarkerTap={handleClick}
+          onRegionChange={()=>setShow(false)}
+        />
+        {
+          show&&
+          <View className='showModel'>
+          <View className='title'>
+            <View className='name'>收割机001--S001</View>
+            <View className='action' onClick={goDetail}>详情 {">"}{">"}</View>
+          </View>
+          <View className='position'>
+            <Image src={picon} className='picon' />
+            当前位置：&nbsp;&nbsp;邓州市陈楼
+          </View>
+        </View>
+        }
+        
+      </View>
+    </View>
+  )
+})

src/pages/machineryMap/style.less

@@ -0,0 +1,41 @@
+.machineryMap{
+  height: 100%;
+  .map{
+    width: 100vw;
+    height: 100%;
+  }  
+  .showModel{
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    box-sizing: border-box;
+    background: #FFFFFF;
+    border-radius: 40px 40px 0px 0px;
+    padding: 60px 30px;
+    font-weight: bold;
+    font-size: 30px;
+    color: #222222;
+    .title{
+      display: flex;
+      align-items: center;
+      margin-bottom: 40px;
+      .name{
+        font-size: 36px;
+      }
+      .action{
+        color: #666666;
+        position: absolute;
+        right: 30px;
+      }
+    }
+    .position{
+      display: flex;
+      align-items: center;
+      .picon{
+        width: 34px;
+        height: 34px;
+        margin-right: 16px;    
+      }
+    }
+  }
+}

src/routes.js

@@ -22,6 +22,10 @@ const mainPages = [
     title: '农机列表',
     page: 'pages/machineryList/index',
   },
+  {
+    title: '农机地图',
+    page: 'pages/machineryMap/index',
+  },
   {
     title: '查看详情',
     page: 'pages/machineryDetail/index',