（*）添加线路编码

api/app/lib/controllers/data/road.js

@@ -83,7 +83,7 @@ async function getRoadSection (ctx) {
         let findOption = {
             where: {},
             order: [['id', 'DESC']],
-            attributes: ['id', 'routeName', 'startingPlaceName', 'stopPlaceName']
+            attributes: ['id', 'routeName', 'startingPlaceName', 'stopPlaceName', 'routeCode']
         }
 
         if (level) {

weapp/src/packages/components/inputPickers/index.jsx

@@ -0,0 +1,56 @@
+/*
+* 输入框筛选选择器
+*/
+import React, { useState, useEffect } from 'react'
+import { View, Picker, Image, Input, Text } from '@tarojs/components'
+import arrowIcon from '../../../static/img/patrol/arrow-down.svg'
+import './index.scss'
+
+export default function InputPicker(props) {
+  const { title, placeholder, selector, value, onInput, isView } = props
+  const [curSelector, setCurSelector] = useState([])
+
+  useEffect(() => {
+    setCurSelector(selector)
+  }, [])
+
+  useEffect(()=>{
+    handleInput({ detail: { value: value } })
+  },[value])
+
+  function handleInput({ detail: { value: v } }) {
+    onInput(v)
+    if (v) {
+      setCurSelector(selector.filter(item => item && item.includes(v)))
+    } else {
+      setCurSelector(selector)
+    }
+  }
+
+  const handlePickerChange = (e) => {
+    onInput(curSelector[e.detail.value])
+  }
+
+  return (
+    <View className='input-picker'>
+      <View className='input-box'>
+        <View className='title'>{title}</View>
+        <Input
+          className='input'
+          type='text'
+          placeholder={placeholder}
+          border={false}
+          value={value}
+          onInput={handleInput}
+          disabled={isView}
+        />
+      </View>
+      {
+        !isView &&
+        <Picker mode='selector' range={curSelector} onChange={handlePickerChange}>
+          <Image src={arrowIcon} className='img' />
+        </Picker>
+      }
+    </View>
+  )
+}

weapp/src/packages/components/inputPickers/index.scss

@@ -0,0 +1,30 @@
+.input-picker {
+  display: flex;
+  justify-content: space-between;
+  height: 96px;
+  align-items: center;
+  background-color: #fff;
+  margin-bottom: 5px;
+
+  .input-box {
+    padding: 12px 0;
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+
+    .title {
+      margin-left: 12px;
+    }
+
+    .input {
+      margin-left: 20px;
+      flex-grow: 1;
+    }
+  }
+
+  .img {
+    width: 24px;
+    height: 14px;
+    margin: 0 30px;
+  }
+}

weapp/src/packages/patrol/index.jsx

@@ -3,6 +3,7 @@ import Taro, { useRouter } from '@tarojs/taro';
 import { View, RadioGroup, Radio, Image, Input, Picker, Video } from '@tarojs/components';
 import { AtButton, AtTextarea, AtImagePicker } from 'taro-ui';
 import InputPicker from '../components/inputPicker';
+import InputPickers from '../components/inputPickers';
 import VideoUpload from '../../components/uploads'
 import request from '@/services/request';
 import environment from '../../config';
@@ -49,6 +50,10 @@ const Index = () => {
   const [sourceRoadStartSel, setSourceRoadStartSel] = useState([])
   const [sourceRoadEndSel, setSourceRoadEndSel] = useState([])
 
+  const [codeRoadSel, setCodeRoadSel] = useState([])
+  const [roadList, setRoadList] = useState([])
+  const [codeRoad, setCodeRoad] = useState('')
+
   const prjType =
     isAnomaly ?
       [
@@ -169,14 +174,18 @@ const Index = () => {
           let nextSourceRoadSel = []
           let nextSourceRoadStartSel = []
           let nextSourceRoadEndSel = []
+          let nextCodeRoadSel = []
           data.map(item => {
             nextSourceRoadSel.push(item.routeName)
             nextSourceRoadStartSel.push(item.startingPlaceName)
             nextSourceRoadEndSel.push(item.stopPlaceName)
+            nextCodeRoadSel.push(item.routeCode)
           })
           setSourceRoadSel(nextSourceRoadSel)
           setSourceRoadStartSel(nextSourceRoadStartSel)
           setSourceRoadEndSel(nextSourceRoadEndSel)
+          setCodeRoadSel(nextCodeRoadSel)
+          setRoadList(data)
         } else {
           Taro.showToast({ title: res.data.message || '请求出错', icon: 'none' })
         }
@@ -439,7 +448,28 @@ const Index = () => {
       urls: [file.url] // 需要预览的图片http链接列表
     })
   }
+  useEffect(() => {
+    console.log(road, '所在道路的值');
+    let newRoadList = roadList.filter(e => e.routeName.match(road))
+    console.log(newRoadList, '过滤后的列表');
+    let codeRoadSel = []
+    if (newRoadList.length && road != '') {
+      newRoadList.forEach((e, index) => {
+        codeRoadSel.push(e.routeCode)
+      })
+    }
+    console.log(codeRoadSel, '最新的线路列表');
+    setCodeRoadSel(codeRoadSel)
+    if (codeRoadSel.length) {
+      setCodeRoad(codeRoadSel[0])
+    } else {
+      setCodeRoad('')
+    }
 
+  }, [road])
+  console.log(codeRoadSel, '线路编码');
+  console.log(sourceRoadSel, '所在道路');
+  console.log(roadList, '线路列表');
   return (
     <View className='patrol'>
       {/* {
@@ -520,6 +550,18 @@ const Index = () => {
             isView={isView}
           /> : ''
       }
+      {
+        isPatrol || isAnomaly ?
+          <InputPickers
+            key={codeRoadSel} // 添加key保证selector更新重新渲染
+            title='线路编码：'
+            placeholder='请选择或输入您所在的道路'
+            value={codeRoad}
+            onInput={setCodeRoad}
+            selector={codeRoadSel}
+            isView={isView}
+          /> : ''
+      }
 
       {
         isPatrol || isAnomaly ?