.

.editorconfig

@@ -0,0 +1,12 @@
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc

@@ -0,0 +1,7 @@
+{
+  "extends": ["taro/react"],
+  "rules": {
+    "react/jsx-uses-react": "off",
+    "react/react-in-jsx-scope": "off"
+  }
+}

.gitignore

@@ -0,0 +1,9 @@
+dist/
+deploy_versions/
+.temp/
+.rn_temp/
+node_modules/
+.DS_Store
+*.lock
+package-lock.json
+.vscode/

.npmrc

@@ -0,0 +1 @@
+registry=https://registry.npmmirror.com

babel.config.js

@@ -0,0 +1,10 @@
+// babel-preset-taro 更多选项和默认值：
+// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md
+module.exports = {
+  presets: [
+    ['taro', {
+      framework: 'react',
+      ts: false
+    }]
+  ]
+}

config/dev.js

@@ -0,0 +1,9 @@
+module.exports = {
+  env: {
+    NODE_ENV: '"development"'
+  },
+  defineConstants: {
+  },
+  mini: {},
+  h5: {}
+}

config/index.js

@@ -0,0 +1,80 @@
+import { resolve } from 'path'
+
+const config = {
+  projectName: 'machinery-person',
+  date: '2022-3-15',
+  designWidth: 750,
+  deviceRatio: {
+    640: 2.34 / 2,
+    750: 1,
+    828: 1.81 / 2
+  },
+  sourceRoot: 'src',
+  outputRoot: 'dist',
+  plugins: [],
+  defineConstants: {
+  },
+  copy: {
+    patterns: [
+    ],
+    options: {
+    }
+  },
+  alias: {
+    '@/assets': resolve(__dirname, '..', 'src/assets'),
+    '@/components': resolve(__dirname, '..', 'src/components'),
+    '@/layouts': resolve(__dirname, '..', 'src/layouts'),
+    '@/utils': resolve(__dirname, '..', 'src/utils'),
+    '@/store': resolve(__dirname, '..', 'src/store'),
+    '@/services': resolve(__dirname, '..', 'src/services'),
+  },
+  framework: 'react',
+  mini: {
+    postcss: {
+      pxtransform: {
+        enable: true,
+        config: {
+
+        }
+      },
+      url: {
+        enable: true,
+        config: {
+          limit: 1024 // 设定转换尺寸上限
+        }
+      },
+      cssModules: {
+        enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+        config: {
+          namingPattern: 'module', // 转换模式，取值为 global/module
+          generateScopedName: '[name]__[local]___[hash:base64:5]'
+        }
+      }
+    }
+  },
+  h5: {
+    publicPath: '/',
+    staticDirectory: 'static',
+    postcss: {
+      autoprefixer: {
+        enable: true,
+        config: {
+        }
+      },
+      cssModules: {
+        enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+        config: {
+          namingPattern: 'module', // 转换模式，取值为 global/module
+          generateScopedName: '[name]__[local]___[hash:base64:5]'
+        }
+      }
+    }
+  }
+}
+
+export default function (merge) {
+  if (process.env.NODE_ENV === 'development') {
+    return merge({}, config, require('./dev'))
+  }
+  return merge({}, config, require('./prod'))
+}

config/prod.js

@@ -0,0 +1,18 @@
+module.exports = {
+  env: {
+    NODE_ENV: '"production"'
+  },
+  defineConstants: {
+  },
+  mini: {},
+  h5: {
+    /**
+     * 如果h5端编译后体积过大，可以使用webpack-bundle-analyzer插件对打包体积进行分析。
+     * 参考代码如下：
+     * webpackChain (chain) {
+     *   chain.plugin('analyzer')
+     *     .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin, [])
+     * }
+     */
+  }
+}

jsconfig.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}

package.json

@@ -0,0 +1,60 @@
+{
+  "name": "machinery-person",
+  "version": "1.0.0",
+  "private": true,
+  "description": "农机手小程序",
+  "templateInfo": {
+    "name": "default",
+    "typescript": false,
+    "css": "less"
+  },
+  "scripts": {
+    "build:weapp": "taro build --type weapp",
+    "build:swan": "taro build --type swan",
+    "build:alipay": "taro build --type alipay",
+    "build:tt": "taro build --type tt",
+    "build:h5": "taro build --type h5",
+    "build:rn": "taro build --type rn",
+    "build:qq": "taro build --type qq",
+    "build:jd": "taro build --type jd",
+    "build:quickapp": "taro build --type quickapp",
+    "dev:weapp": "npm run build:weapp -- --watch",
+    "dev:swan": "npm run build:swan -- --watch",
+    "dev:alipay": "npm run build:alipay -- --watch",
+    "dev:tt": "npm run build:tt -- --watch",
+    "dev:h5": "npm run build:h5 -- --watch",
+    "dev:rn": "npm run build:rn -- --watch",
+    "dev:qq": "npm run build:qq -- --watch",
+    "dev:jd": "npm run build:jd -- --watch",
+    "dev:quickapp": "npm run build:quickapp -- --watch"
+  },
+  "browserslist": [
+    "last 3 versions",
+    "Android >= 4.1",
+    "ios >= 8"
+  ],
+  "author": "",
+  "dependencies": {
+    "@babel/runtime": "^7.7.7",
+    "@tarojs/components": "3.3.15",
+    "@tarojs/react": "3.3.15",
+    "@tarojs/runtime": "3.3.15",
+    "@tarojs/taro": "3.3.15",
+    "react": "^17.0.0",
+    "react-dom": "^17.0.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.8.0",
+    "@tarojs/mini-runner": "3.3.15",
+    "@tarojs/webpack-runner": "3.3.15",
+    "@types/react": "^17.0.2",
+    "@types/webpack-env": "^1.13.6",
+    "babel-preset-taro": "3.3.15",
+    "eslint": "^6.8.0",
+    "eslint-config-taro": "3.3.15",
+    "eslint-plugin-import": "^2.12.0",
+    "eslint-plugin-react": "^7.8.2",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "stylelint": "9.3.0"
+  }
+}

project.config.json

@@ -0,0 +1,13 @@
+{
+  "miniprogramRoot": "./dist",
+  "projectname": "machinery-person",
+  "description": "农机手小程序",
+  "appid": "wx835627a9b9b3932a",
+  "setting": {
+    "urlCheck": true,
+    "es6": false,
+    "postcss": false,
+    "minified": false
+  },
+  "compileType": "miniprogram"
+}

project.tt.json

@@ -0,0 +1,9 @@
+{
+  "miniprogramRoot": "./",
+  "projectname": "machinery-person",
+  "appid": "wx835627a9b9b3932a",
+  "setting": {
+    "es6": false,
+    "minified": false
+  }
+}

src/app.config.js

@@ -0,0 +1,16 @@
+import { pages } from './routes'
+
+export default {
+  pages,
+  window: {
+    backgroundTextStyle: 'light',
+    navigationBarBackgroundColor: '#fff',
+    navigationBarTitleText: 'WeChat',
+    navigationBarTextStyle: 'black'
+  },
+  permission: {
+    'scope.userLocation': {
+      desc: '您的位置信息将方便您更好的小程序体验'
+    }
+  },
+}

src/app.js

@@ -0,0 +1,55 @@
+import { Component } from 'react'
+import Taro from '@tarojs/taro'
+// import preFetchData from '@/utils/preFetchData'
+// import store, { StoreRoot } from './store'
+import './app.less'
+
+class App extends Component {
+
+  componentDidShow(options) {
+    if (options.path === 'pages/index/index' && options.query?.tab === '1' && options.query?.roomId) {
+      // const { setRoomId } = store.getModel('hotel').getState()
+      // setRoomId(options.query?.roomId)
+    }
+  }
+
+  onLaunch(options) {
+    console.group('APP Launch')
+    console.debug(options)
+    console.groupEnd()
+
+    // const { login } = store.getModel('person').getState()
+
+    // 预拉取数据
+    // preFetchData().then((fetchData) => {
+    //   const { fromType, recommender, scene: qrCodeId, mpOpenId, ...leftParams } = options.query
+    //   Taro.setStorageSync({ key: 'scene', data: qrCodeId })
+
+    //   // // 登录获取人员信息
+    //   // Taro.login({
+    //   //   success: (res) => {
+    //   //     const { code } = res;
+    //   //     login({ code, personId: fetchData.personId, fromType, recommender, qrCodeId, mpOpenId, ...leftParams })
+    //   //   }
+    //   // })
+    // }).catch(() => {
+    //   Taro.showToast({
+    //     title: '网络异常, 请退出重试',
+    //     icon: 'none',
+    //   })
+    // })
+  }
+
+  // this.props.children 是将要会渲染的页面
+  render() {
+    return (
+      // <StoreRoot>
+      <>
+        {this.props.children}
+        </>
+      // </StoreRoot>
+    )
+  }
+}
+
+export default App

src/app.less

@@ -0,0 +1,42 @@
+.page-index {
+  display: flex;
+  flex-direction: column;
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
+  box-sizing: border-box;
+  letter-spacing: 2px;
+  
+  .index-navbar {
+    flex: none;
+  }
+
+  .index-tabbar {
+    flex: none;
+    display: flex;
+    height: 130px;
+    text-align: center;
+    box-sizing: border-box;
+    padding: 14px 0 23px 0;
+    box-shadow: 0px -4px 6px 0px rgba(0, 0, 0, 0.08);
+  }
+
+  .index-container {
+    flex: 1;
+    overflow: hidden;
+    position: relative;
+  }
+}
+
+.purebtn {
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  border: none;
+  outline: none;
+  line-height: 88px;
+
+  &::after {
+    border: none;
+  }
+}

src/components/CustomNav/index.jsx

@@ -0,0 +1,80 @@
+
+import { useState, useEffect, useMemo } from 'react'
+import Taro from '@tarojs/taro'
+import goback from '@/assets/comm/goback.png'
+
+import './style.less'
+import { View } from '@tarojs/components'
+
+export default (props) => {
+  const { logo, title = '首页', home, noback } = props
+
+  // 菜单胶囊
+  const menuBound = useMemo(() => Taro.getMenuButtonBoundingClientRect(), [])
+  // 整体顶部导航
+  const navStyle = useMemo(() => {
+    return {
+      height: `${menuBound.bottom + 8}px`,
+    }
+  }, [menuBound.bottom])
+  // 导航栏
+  const navBarStyle = useMemo(() => {
+    return {
+      top: `${menuBound.top}px`,
+      height: `${menuBound.height}px`
+    }
+  }, [menuBound.top, menuBound.height])
+  // 导航栏按钮
+  const actionStyle = useMemo(() => {
+    return {
+      width: `${menuBound.width + 8}px`,
+      paddingLeft: '8px',
+      lineHeight: `${menuBound.height}px`,
+      height: `${menuBound.height}px`,
+    }
+  }, [menuBound.width, menuBound.height])
+  // 导航栏标题
+  const contentStyle = useMemo(() => {
+    const screenWidth = menuBound.right + 8;
+    return {
+      width: `${screenWidth - menuBound.width * 2 - 16}px`,
+      lineHeight: `${menuBound.height}px`,
+      height: `${menuBound.height}px`,
+      paddingLeft: '8px',
+      paddingRight: '8px',
+    }
+  }, [menuBound.width, menuBound.height, menuBound.right])
+
+  const handleAction = () => {
+    if (home || logo) return;
+
+    if (Taro.getCurrentPages().length > 1) {
+      Taro.navigateBack({ delta: 1 })
+    }
+  }
+
+  useEffect(() => {
+    if (title) {
+      Taro.setNavigationBarTitle({ title })
+    }
+  }, [title])
+
+  return (
+    <view className='custom-nav' style={navStyle}>
+      <view className='custom-nav-bar' style={navBarStyle}>
+        <view className='custom-nav-bar-action' style={actionStyle}>
+          {
+            !logo && !home && (
+              !noback && (
+                <View style={{ width: '100%', height: '100%' }} onClick={handleAction}>
+                  <image className='goback' src={goback} />
+                </View>
+              )
+            )
+          }
+        </view>
+        <view className='custom-nav-bar-content' style={contentStyle}>{title}</view>
+      </view>
+    </view>
+  )
+}

src/components/CustomNav/style.less

@@ -0,0 +1,37 @@
+.custom-nav {
+	display: block;
+	position: relative;
+
+  &-bar {
+    display: flex;
+    position: fixed;
+    width: 100%;
+    z-index: 1024;
+    left: 0;
+
+    &-action {
+      flex: none;
+      box-sizing: border-box;
+
+      .goback{
+        width: 19px;
+        height: 35px;
+        position: absolute;
+        left: 30px;
+        top: 14.5px;
+      }
+    }
+
+    &-content {
+      flex: none;
+      text-align: center;
+      font-size: 32px;
+      cursor: none;
+      pointer-events: none;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      overflow: hidden;
+      box-sizing: border-box;
+    }
+  }
+}

src/index.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
+  <meta content="width=device-width,initial-scale=1,user-scalable=no" name="viewport">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-touch-fullscreen" content="yes">
+  <meta name="format-detection" content="telephone=no,address=no">
+  <meta name="apple-mobile-web-app-status-bar-style" content="white">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
+  <title></title>
+  <script>
+    !function(n){function e(){var e=n.document.documentElement,t=e.getBoundingClientRect().width;e.style.fontSize=t>=640?"40px":t<=320?"20px":t/320*20+"px"}n.addEventListener("resize",(function(){e()})),e()}(window);
+  </script>
+</head>
+<body>
+  <div id="app"></div>
+</body>
+</html>

src/pages/index/components/OrderCard/index.jsx

@@ -0,0 +1,37 @@
+import Taro from "@tarojs/taro"
+import { View, Text } from '@tarojs/components'
+import './style.less'
+
+export default (props) => {
+  return (
+    <View className='card'>
+      <View className='jianbian'>
+        <View className='text'>待作业</View>
+      </View>
+      <View className='cardHead'>
+        <View className='cell' style={{display:'inline-block'}}>
+          <Text className='label'>需求时间</Text>：
+          <Text className='data'>2022-06-02</Text>
+        </View>
+        <Text className='price'><Text style={{fontSize:'44rpx'}}>600</Text>元</Text>
+      </View>
+      <View className='line' />
+      <View className='content'>
+        <View className='cell'>
+          <Text className='label'>农机名称</Text>：<Text className='data'>收割机001</Text>
+        </View>
+        <View className='cell'>
+          <Text className='label'>下单人</Text>：<Text className='data'>张三</Text>
+        </View>
+        <View className='cell'>
+          <Text className='label'>订单时间</Text>：<Text className='data'>2022-03-08</Text>
+        </View>
+        <View className='cell'>
+          <Text className='label'>作业时间</Text>：<Text className='data'>上午06:00--晚上21:00</Text>
+        </View>
+      </View>
+      <View className='line' />
+      <View className='footer'>详情>></View>
+    </View>
+  )
+}

src/pages/index/components/OrderCard/style.less

@@ -0,0 +1,75 @@
+.card{
+  margin-top: 30px;
+  box-shadow: 0px 0px 44px 0px rgba(0, 0, 0, 0.08);
+  border-radius: 40px;
+  position: relative;
+  overflow: hidden;
+  padding: 40px;
+  .jianbian{
+    width: 225px;
+    height: 217px;
+    background: linear-gradient(-30deg, #FFAB8C, #FF703B);
+    border-radius: 137px;
+    border: 1px solid #FFC937;
+    position: absolute;
+    left: -134px;
+    top: -122px;
+    .text{
+      transform:rotate(-45deg);
+      font-size: 28px;
+      font-weight: bold;
+      color: #FFFFFF;
+      position: relative;
+      top: 92px;
+      left: 108px;
+    }
+  }
+  .cardHead{
+    width: 100%;
+    padding: 5px 0 0 38px;
+    position: relative;
+    .price{
+      line-height: 36px;
+      position: absolute;
+      right: 40px;
+      top: 22px;
+      font-size: 30px;
+      font-weight: bold;
+      color: #FF2525;
+    }
+  }
+  .line{
+    width: 100%;
+    border: 1px solid #000;
+    opacity: 0.1;
+    margin: 15px 0;
+  }
+  .content {
+    width: 100%;
+  }
+  .cell{
+    line-height: 32px;
+    padding: 25px 0;
+    font-size: 34px;
+    font-weight: bold;
+    color: #606060;
+    .label{
+      width: 24vw;
+      display: inline-block;
+      text-align: justify;
+      text-align-last: justify;
+    }
+    .data{
+      color: #101010;
+    }
+  }
+  .footer{
+    width: 100%;
+    text-align: center;
+    line-height: 32px;
+    font-size: 34px;
+    font-weight: bold;
+    color: #606060;
+    padding-top: 15px;
+  }
+}

src/pages/index/components/order/index.jsx

@@ -0,0 +1,69 @@
+import React, { useState } from "react"
+import Taro from "@tarojs/taro";
+import { View, Input, Swiper, Image, SwiperItem, Text,ScrollView } from "@tarojs/components"
+import positionImg from '@/assets/comm/position.png'
+import searchImg from '@/assets/comm/search.png'
+import orderImg from '@/assets/comm/orderList.png'
+import OrderCard from "../OrderCard";
+import './style.less'
+
+export default () => {
+
+  const [swiperImgHeightList, setSwiperImgHeightList] = useState([])
+  const [swiperImgWidthList, setSwiperImgWidthList] = useState([])
+  const imglist = [
+    {
+      url: require('@/assets/banner/1.jpg')
+    },
+    {
+      url: require('@/assets/banner/2.jpg')
+    },
+  ]
+  const handleSearch = (e) => {
+    console.log(e.detail.value)
+  }
+  const handleMore=()=>{
+    Taro.navigateTo({ url: '/pages/moreOrder/index' });
+  }
+  return (
+    <View className='orderIndex'>
+      <View className='top'>
+        <View className='left'>
+          <Image src={positionImg} className='pImg' />
+          <Text>邓州市</Text>
+          <View className='icon' />
+        </View>
+        <View className='searchClass'>
+          <Input type='text' className='searchInput' onBlur={handleSearch} placeholder='搜索关键字查询订单' />
+          <Image src={searchImg} className='searchImg' />
+        </View>
+      </View>
+      <ScrollView scrollY style={{height:'calc(100% - 50px)'}}>
+      <View>
+        <Swiper
+          circular
+          autoplay
+          className='swiper'
+        >
+          {imglist.map((item, inx) => (
+            <SwiperItem key={inx}>
+              <Image src={item.url} mode='widthFix' className='storeImage' />
+            </SwiperItem>
+          ))}
+        </Swiper></View>
+      <View className='orderList'>
+        <View className='head'>
+          <Image className='headIcon' src={orderImg} />
+          <Text className='title'>订单列表</Text>
+          <Text className='more' onClick={handleMore}>更多>></Text>
+        </View>
+        
+        <OrderCard />
+        <OrderCard />
+        <View className='listBottom'>暂无更多~</View>
+        
+      </View>
+      </ScrollView>
+    </View>
+  )
+}

src/pages/index/components/order/style.less

@@ -0,0 +1,104 @@
+.orderIndex {
+  height: 100%;
+  .top {
+    display: flex;
+    margin: 30px;
+    margin-bottom: 0;
+    .left {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-right: 30px;
+      font-size: 32px;
+      font-weight: bold;
+      color: #202020;
+      line-height: 68px;
+      .pImg{
+        width: 28px;
+        height: 34px;
+        margin-right: 9px;
+      }
+      .icon{
+        border-top: 11px solid #000;
+        border-left: 11px solid transparent;
+        border-right: 11px solid transparent;
+        height: 0;
+        width: 0;
+        margin-left: 10px;
+      }
+    }
+    .searchClass {
+      display: inline-block;
+      position: relative;
+      flex: 1;
+      .searchInput{
+        background: #F8F8F8;
+        border-radius: 34px;
+        padding-left: 68px;
+        padding-right: 34px;
+        font-size: 28px;
+        height: 68px;
+        line-height: 68px;
+      }
+      .searchImg{
+        width: 30px;
+        height: 30px;
+        position: absolute;
+        left: 31px;
+        top: 19px;
+      }
+    }
+  }
+  .swiper {
+    transition: all 0.3s linear;
+    height: calc( calc(100vw - 60px) * 0.62);
+    text-align: center;
+    margin: 30px;
+    .storeImage {
+      height: 100%;
+    }
+  }
+  .orderList{
+    margin: 30px;
+    padding-top: 30px;
+    .head{
+      font-size: 40px;
+      font-weight: 800;
+      color: #222222;
+      height: 41px;
+      line-height: 41px;      
+      display: flex;
+      align-items: center;
+      .headIcon{
+        width: 34px;
+        height: 38px;
+        vertical-align: middle;
+        margin-right: 20px;
+      }
+      .title{
+        height: 39px;
+        line-height: 39px;
+      }
+      .more{
+        font-size: 34px;
+        font-weight: 500;
+        height: 33px;
+        line-height: 33px;
+        position: absolute;
+        right: 30px;
+
+        color: #666666;
+      }
+    }
+    .listBottom{
+      line-height: 31px;
+      font-size: 32px;
+      font-weight: 500;
+      color: #666666;
+      margin-top: 64px;
+      padding-bottom: 30px;
+      text-align: center;
+    }
+  }
+}
+

src/pages/index/index.config.js

@@ -0,0 +1,7 @@
+export default {
+  navigationBarTitleText: '首页',
+  navigationStyle: 'custom',
+  styleIsolation: 'shared',
+  enableShareAppMessage: true,
+  disableScroll: true,
+}

src/pages/index/index.jsx

@@ -0,0 +1,54 @@
+import Taro from "@tarojs/taro";
+import { useState } from "react";
+import { View, Image } from "@tarojs/components"
+import indexImg from "@/assets/comm/index.png";
+import indexActive from "@/assets/comm/indexActive.png";
+import job from "@/assets/comm/job.png";
+import jobActive from "@/assets/comm/jobActive.png";
+import user from "@/assets/comm/user.png";
+import userActive from "@/assets/comm/userActive.png";
+import CustomNav from "@/components/CustomNav";
+import Order from './components/order'
+import "./index.less";
+
+export default () => {
+  const [currentTab, setCurrentTab] = useState(0);
+  const handleClick = (val) => {
+    setCurrentTab(val);
+  };
+  return (
+    <View className='page-index'>
+      <View className='index-navbar'>
+        <CustomNav home />
+      </View>
+      <View className='index-container'>
+        {currentTab === 0 && <Order />}
+        {currentTab === 1 && <View>888</View>}
+        {currentTab === 2 && <View>999</View>}
+      </View>
+      <View className='index-tabbar'>
+        <View
+          className={['tabberItem', currentTab === 0 ? "activeTabber" : '']}
+          onClick={() => handleClick(0)}
+        >
+          <Image className='tabberImg' src={currentTab === 0 ? indexActive : indexImg}></Image>
+          <View className='text'>首页</View>
+        </View>
+        <View
+          className={['tabberItem', currentTab === 1 ? "activeTabber" : '']}
+          onClick={() => handleClick(1)}
+        >
+          <Image className='tabberImg' src={currentTab === 1 ? jobActive : job}></Image>
+          <View className='text'>作业管理</View>
+        </View>
+        <View
+          className={['tabberItem', currentTab === 2 ? "activeTabber" : '']}
+          onClick={() => handleClick(2)}
+        >
+          <Image className='tabberImg' src={currentTab === 2 ? userActive : user}></Image>
+          <View className='text'>个人中心</View>
+        </View>
+      </View>
+    </View>
+  );
+};

src/pages/index/index.less

@@ -0,0 +1,18 @@
+.tabberItem{
+  flex: 1;
+  font-size: 30px;
+  font-weight: bold;
+  .tabberImg{
+    width: 52px;
+    height: 52px;
+    display: block;
+    margin: auto;
+  }
+  .text{
+    line-height: 29px;
+    margin-top: 12px;
+  }
+}
+.activeTabber {
+  color: #17B540;
+}

src/pages/moreOrder/index.config.js

@@ -0,0 +1,7 @@
+export default {
+  navigationBarTitleText: '更多',
+  navigationStyle: 'custom',
+  styleIsolation: 'shared',
+  enableShareAppMessage: true,
+  disableScroll: true,
+}

src/pages/moreOrder/index.jsx

@@ -0,0 +1,79 @@
+import { View, Input, Image,Text } from "@tarojs/components"
+import CustomNav from "@/components/CustomNav";
+import searchImg from '@/assets/comm/search.png'
+import { useState } from "react";
+import './style.less'
+
+export default () => {
+  const [imageShow, setImageShow] = useState(true)
+  const [currentTab, setCurrentTab] = useState(0);
+  const handleSearch = (e) => {
+    if (e.detail.value) {
+      console.log(e.detail.value)
+      setImageShow(false)
+    } else {
+      setImageShow(true)
+    }
+  }
+  const handleClick = () => {
+    setImageShow(false)
+  }
+  const handleChange =(val)=>{
+    setCurrentTab(val)
+  }
+  return (
+    <View className='page-index'>
+      <View className='index-navbar'>
+        <CustomNav title='更多' />
+      </View>
+      <View className='searchClass'>
+        <Input type='text' className='searchInput' onClick={handleClick} onBlur={handleSearch} placeholder='搜索关键字查询订单' />
+        {
+          imageShow && (
+            <Image src={searchImg} className='searchImg' />
+          )
+        }
+      </View>
+      <View className='tabbar'>
+        <View
+          className={['tabberItem', currentTab === 0 ? "activeTabber" : '']}
+          onClick={() => handleChange(0)}
+        >
+          <View>
+            <Text className='text'>待付款</Text>
+            {
+              currentTab === 0&&<View className='line' />
+            }            
+          </View>
+        </View>
+        <View
+          className={['tabberItem', currentTab === 1 ? "activeTabber" : '']}
+          onClick={() => handleChange(1)}
+        >
+          <View>
+            <Text className='text'>进行中</Text>
+            {
+              currentTab === 1&&<View className='line' />
+            } 
+          </View>
+        </View>
+        <View
+          className={['tabberItem', currentTab === 2 ? "activeTabber" : '']}
+          onClick={() => handleChange(2)}
+        >
+          <View>
+            <Text className='text'>已完成</Text>
+            {
+              currentTab === 2&&<View className='line' />
+            } 
+          </View>
+        </View>
+      </View>
+      <View className='index-container'>
+        {currentTab === 0 && <View>777</View>}
+        {currentTab === 1 && <View>888</View>}
+        {currentTab === 2 && <View>999</View>}
+      </View>
+    </View>
+  )
+}

src/pages/moreOrder/style.less

@@ -0,0 +1,57 @@
+.searchClass {
+  position: relative;
+  padding: 30px;
+  text-align: center;
+  .searchInput{
+    background: #F8F8F8;
+    border-radius: 34px;
+    padding:0 34px;
+    font-size: 28px;
+    height: 68px;
+    line-height: 68px;
+  }
+  .searchImg{
+    width: 30px;
+    height: 30px;
+    position: absolute;
+    left: calc(50vw - 5.5em);
+    top: 50px;
+  }
+}
+.tabbar{
+  display: flex;
+  text-align: center;
+  box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.08);
+  height: 88px;
+  margin: 0 30px;
+  align-items: center;
+  .tabberItem{
+    flex: 1;
+    font-size: 32px;
+    font-weight: 500;
+    color: #999999;
+    height: 100%;
+    &>View{
+      height: 100%;
+      display: flex;
+      justify-content: center;
+      position: relative;
+      .text{
+        line-height: 29px;
+        align-self: center;
+      }
+      .line{
+        width: 12.8vw;
+        height: 6px;
+        background: #06B03B;
+        position: absolute;
+        bottom: 0;
+      }
+    }   
+    
+  }
+  .activeTabber {
+    color: #06B03B;
+    font-weight: 800;
+  }
+}

src/routes.js

@@ -0,0 +1,39 @@
+
+// 客户页面
+const mainPages = [
+  {
+    title: '首页',
+    page: 'pages/index/index',
+    isIndex: true,
+  },
+  {
+    title: '更多',
+    page: 'pages/moreOrder/index',
+  },
+  
+];
+
+// 所有的页面
+const routes = mainPages
+
+// 主包
+const pages = mainPages.map(x => x.page);
+
+
+// 获取路径对应页面
+function getPageBy(path) {
+  return routes.filter(x => path.indexOf(x.page) > -1)[0]
+}
+
+// 获取角色首页
+function getIndexPageOf(role) {
+  return routes.filter(x => x.root === role && x.isIndex)[0]
+}
+
+// eslint-disable-next-line import/no-commonjs
+module.exports = {
+  routes,
+  pages,
+  getPageBy,
+  getIndexPageOf
+}

src/utils/index.js

@@ -0,0 +1,78 @@
+
+/**
+ * queryString 转 object
+ * @param {*} queryStr 
+ * @returns 
+ */
+export function parseQueryString(queryStr) {
+  if (!queryStr) {
+    return;
+  }
+
+  const params = queryStr.split('&').reduce((acc, str) => {
+    if (!str) return acc;
+
+    const kv = str.split('=')
+    if (kv.length !== 2) return acc;
+
+    const key = decodeURIComponent(kv[0])
+    const val = decodeURIComponent(kv[1])
+
+    return {
+      ...acc,
+      [key]: val,
+    }
+  }, {});
+  return params;
+}
+
+/**
+ * object 转 queryStr
+ * @param {*} params 
+ * @returns 
+ */
+export function getQueryString(params) {
+  if (!params) return ;
+
+  const keys = Object.keys(params)
+  const arr = keys.map((key) => {
+    const val = params[key]
+    if (val === null || val === undefined) return false;
+
+    return `${key}=${encodeURIComponent(val)}`
+  })
+
+  return arr.filter(Boolean).join('&')
+}
+
+/**
+ * 随机串
+ * @param {*} prefix 
+ * @returns 
+ */
+export function random(prefix) {
+  const s = Math.random().toString(36).substring(2)
+
+  return prefix ? `${prefix}-${s}` : s
+}
+
+/**
+ * 压缩图片
+ * @param {*} url 
+ * @returns 
+ */
+export function compressImage(url, typ) {
+  if (!url) return url;
+
+  // GIF 不压缩
+  if (url.indexOf('.gif') > -1) return url;
+
+  const style = typ || 'cmp80'
+
+  // eslint-disable-next-line no-undef
+  if (url.indexOf(OSS) > -1) {
+    return `${url}?x-oss-process=style/${style}`.replace('http://', 'https://')
+  }
+
+  return url;
+}

yarn-error.log

@@ -0,0 +1,90 @@
+Arguments: 
+  C:\Program Files\nodejs\node.exe C:\Users\Administrator\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js
+
+PATH: 
+  C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Windows\System32\OpenSSH\;D:\Git\cmd;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files\nodejs\;;C:\Program Files (x86)\Tencent\微信web开发者工具\dll;C:\Program Files\MySQL\MySQL Shell 8.0\bin\;C:\Users\Administrator\AppData\Local\Microsoft\WindowsApps;C:\Users\Administrator\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\Administrator\AppData\Roaming\npm;D:\java8\bin;D:\apache-maven-3.8.4\bin;C:\Program Files\MySQL\MySQL Server 8.0\bin;
+
+Yarn version: 
+  1.22.17
+
+Node version: 
+  14.17.1
+
+Platform: 
+  win32 x64
+
+Trace: 
+  SyntaxError: E:\work\nanyang\machinery-mini\machinery-person\machinery-person\package.json: Unexpected token } in JSON at position 1372
+      at JSON.parse (<anonymous>)
+      at C:\Users\Administrator\AppData\Roaming\npm\node_modules\yarn\lib\cli.js:1625:59
+      at Generator.next (<anonymous>)
+      at step (C:\Users\Administrator\AppData\Roaming\npm\node_modules\yarn\lib\cli.js:310:30)
+      at C:\Users\Administrator\AppData\Roaming\npm\node_modules\yarn\lib\cli.js:321:13
+
+npm manifest: 
+  {
+    "name": "machinery-person",
+    "version": "1.0.0",
+    "private": true,
+    "description": "农机手小程序",
+    "templateInfo": {
+      "name": "default",
+      "typescript": false,
+      "css": "less"
+    },
+    "scripts": {
+      "build:weapp": "taro build --type weapp",
+      "build:swan": "taro build --type swan",
+      "build:alipay": "taro build --type alipay",
+      "build:tt": "taro build --type tt",
+      "build:h5": "taro build --type h5",
+      "build:rn": "taro build --type rn",
+      "build:qq": "taro build --type qq",
+      "build:jd": "taro build --type jd",
+      "build:quickapp": "taro build --type quickapp",
+      "dev:weapp": "npm run build:weapp -- --watch",
+      "dev:swan": "npm run build:swan -- --watch",
+      "dev:alipay": "npm run build:alipay -- --watch",
+      "dev:tt": "npm run build:tt -- --watch",
+      "dev:h5": "npm run build:h5 -- --watch",
+      "dev:rn": "npm run build:rn -- --watch",
+      "dev:qq": "npm run build:qq -- --watch",
+      "dev:jd": "npm run build:jd -- --watch",
+      "dev:quickapp": "npm run build:quickapp -- --watch"
+    },
+    "browserslist": [
+      "last 3 versions",
+      "Android >= 4.1",
+      "ios >= 8"
+    ],
+    "author": "",
+    "dependencies": {
+      "@babel/runtime": "^7.7.7",
+      "@tarojs/components": "3.3.15",
+      "@tarojs/react": "3.3.15",
+      "@tarojs/runtime": "3.3.15",
+      "@tarojs/taro": "3.3.15",
+      "react": "^17.0.0",
+      "react-dom": "^17.0.0",
+    },
+    "devDependencies": {
+      "@babel/core": "^7.8.0",
+      "@tarojs/mini-runner": "3.3.15",
+      "@tarojs/webpack-runner": "3.3.15",
+      "@types/react": "^17.0.2",
+      "@types/webpack-env": "^1.13.6",
+      "babel-preset-taro": "3.3.15",
+      "eslint": "^6.8.0",
+      "eslint-config-taro": "3.3.15",
+      "eslint-plugin-import": "^2.12.0",
+      "eslint-plugin-react": "^7.8.2",
+      "eslint-plugin-react-hooks": "^4.2.0",
+      "stylelint": "9.3.0"
+    }
+  }
+
+yarn manifest: 
+  No manifest
+
+Lockfile: 
+  No lockfile