李志伟 3 年前
父节点
当前提交
1e48c129a0

二进制
src/assets/machinery/micon2.png 查看文件


+ 7
- 0
src/pages/machineryDetail/index.config.js 查看文件

1
+export default {
2
+  navigationBarTitleText: '查看详情',
3
+  navigationStyle: 'custom',
4
+  styleIsolation: 'shared',
5
+  enableShareAppMessage: true,
6
+  disableScroll: true,
7
+}

+ 43
- 0
src/pages/machineryDetail/index.jsx 查看文件

1
+import { View, Image, ScrollView } from "@tarojs/components"
2
+import CustomNav from "@/components/CustomNav"
3
+import Jianbian from "@/components/Jianbian"
4
+import withLayout from '@/layouts'
5
+import banner1 from '@/assets/banner/1.jpg'
6
+import banner2 from '@/assets/banner/2.jpg'
7
+import clockImg from '@/assets/machinery/date.png'
8
+import micon from '@/assets/machinery/micon2.png'
9
+import './style.less'
10
+
11
+export default withLayout((props) => {
12
+  return (
13
+    <View className='page-index'>
14
+      <View className='index-navbar'>
15
+        <CustomNav title='查看详情' />
16
+      </View>
17
+      <View className='index-container'>
18
+        <ScrollView scrollY style={{ height: '100%' }}>
19
+          <Image src={banner1} mode='aspectFill' className='detailHead' />
20
+          <View className='detailContent'>
21
+            <Jianbian status='1' />
22
+            <View className='detialName'>收割机001--S001</View>
23
+            <View className='detailTime'>
24
+              <Image src={clockImg} className='clockImg' />
25
+              距离上次使用时间为三天
26
+            </View>
27
+            <View className='title'>
28
+              <Image src={micon} className='detailIcon' />
29
+              作业详情
30
+              <Image src={micon} className='detailIcon' />
31
+            </View>
32
+            <View>
33
+              <Image src={banner1} className='contentImg' />
34
+              <View className='contentText'>6666666</View>
35
+              <Image src={banner2} className='contentImg' />
36
+              <Image src={banner1} className='contentImg' />
37
+            </View>
38
+          </View>
39
+        </ScrollView>
40
+      </View>
41
+    </View>
42
+  )
43
+})

+ 50
- 0
src/pages/machineryDetail/style.less 查看文件

1
+.detailHead{
2
+  width: 100%;
3
+  height: 66.7vw;
4
+}
5
+.detailContent{
6
+  background: #FFFFFF;
7
+  border-radius: 40px 40px 0px 0px;
8
+  padding: 30px;
9
+  position: relative;
10
+  overflow: hidden;
11
+  top: -60px;
12
+  color: #222222;
13
+  font-size: 30px;
14
+  .detialName{
15
+    margin-top: 76px;
16
+    font-size: 36px;
17
+    font-weight: bold;
18
+  }
19
+  .detailTime{
20
+    display: flex;
21
+    align-items: center;
22
+    font-weight: bold;
23
+    margin-top: 40px;
24
+    .clockImg{
25
+      width: 36px;
26
+      height: 36px;
27
+      margin-right: 18px;
28
+    }
29
+  }
30
+  .title{
31
+    display: flex;
32
+    align-items: center;
33
+    margin: 87px 0 50px;
34
+    justify-content: center;
35
+    font-weight: bold;
36
+    .detailIcon{
37
+      width: 34px;
38
+      height: 34px;
39
+      margin: 0 30px;
40
+    }
41
+  }
42
+  .contentImg{
43
+    width: 100%;
44
+    display: block;
45
+  }
46
+  .contentText{
47
+    margin: 30px 0;
48
+  }
49
+
50
+}

+ 5
- 3
src/pages/machineryList/index.jsx 查看文件

1
+import Taro from "@tarojs/taro"
1
 import { View, ScrollView } from "@tarojs/components"
2
 import { View, ScrollView } from "@tarojs/components"
2
 import CustomNav from "@/components/CustomNav"
3
 import CustomNav from "@/components/CustomNav"
4
+import withLayout from '@/layouts'
3
 import MachineryCard from './Card'
5
 import MachineryCard from './Card'
4
 import './style.less'
6
 import './style.less'
5
 
7
 
6
-export default (props) => {
8
+export default withLayout((props) => {
7
   const goMap=()=>{
9
   const goMap=()=>{
8
-    console.log(666)
10
+    Taro.navigateTo({ url: '/pages/machineryDetail/index' });
9
   }
11
   }
10
   return (
12
   return (
11
     <View className='page-index'>
13
     <View className='page-index'>
21
       </View>
23
       </View>
22
     </View>
24
     </View>
23
   )
25
   )
24
-}
26
+})

+ 4
- 0
src/routes.js 查看文件

22
     title: '农机列表',
22
     title: '农机列表',
23
     page: 'pages/machineryList/index',
23
     page: 'pages/machineryList/index',
24
   },
24
   },
25
+  {
26
+    title: '查看详情',
27
+    page: 'pages/machineryDetail/index',
28
+  },
25
   
29
   
26
 ];
30
 ];
27
 
31