diff --git a/weapp/src/packages/components/inputPicker/index.jsx b/weapp/src/packages/components/inputPicker/index.jsx
new file mode 100644
index 00000000..f6b4b197
--- /dev/null
+++ b/weapp/src/packages/components/inputPicker/index.jsx
@@ -0,0 +1,48 @@
+/*
+* 输入框筛选选择器
+*/
+import React, { useState, useEffect } from 'react'
+import { View, Picker, Image, Input } 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 } = props
+ const [curSelector, setCurSelector] = useState([])
+
+ useEffect(() => {
+ setCurSelector(selector)
+ }, [])
+
+ function handleInput({ detail: { value: v } }) {
+ onInput(v)
+ if (v) {
+ setCurSelector(selector.filter(item => item.includes(v)))
+ } else {
+ setCurSelector(selector)
+ }
+ }
+
+ const handlePickerChange = (e) => {
+ onInput(curSelector[e.detail.value])
+ }
+
+ return (
+
+
+ {title}
+
+
+
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/weapp/src/packages/components/inputPicker/index.scss b/weapp/src/packages/components/inputPicker/index.scss
new file mode 100644
index 00000000..5a167df3
--- /dev/null
+++ b/weapp/src/packages/components/inputPicker/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: 30px;
+ }
+
+ .input {
+ margin-left: 20px;
+ flex-grow: 1;
+ }
+ }
+
+ .img {
+ width: 24px;
+ height: 14px;
+ margin: 0 30px;
+ }
+}
\ No newline at end of file
diff --git a/weapp/src/packages/patrol/index.jsx b/weapp/src/packages/patrol/index.jsx
index 36390b54..aa7140d9 100644
--- a/weapp/src/packages/patrol/index.jsx
+++ b/weapp/src/packages/patrol/index.jsx
@@ -7,86 +7,158 @@ import {
Button,
Image,
Input,
- Textarea,
Picker
} from '@tarojs/components';
-import { AtForm, AtInput, AtButton, AtTextarea, AtImagePicker, AtTimeline } from 'taro-ui';
-// import InputPicker from '../components/inputPicker';
+import { AtButton, AtTextarea, AtImagePicker } from 'taro-ui';
+import InputPicker from '../components/inputPicker';
+import request from '@/services/request';
+import { postReport } from '@/services/api';
import './index.scss';
import arrowIcon from '../../static/img/patrol/arrow-down.svg';
const Index = () => {
- const [isPatrol, setIsPatrol] = useState(true) // 巡查 or 养护
- const [prjTypeSelector, setPrjTypeSelector] = useState([])
- const [roadSelector, setRoadSelector] = useState([])
- const [projectType, setProjectType] = useState('')
- const [road, setRoad] = useState('')
+ const [reportType, setReportType] = useState('patrol') // 上报类型
+ const [projectType, setProjectType] = useState('') // 工程类型
+ const [road, setRoad] = useState('') // 所在道路
+ const [roadSectionStart, setRoadSectionStart] = useState('') // 路段 Start
+ const [roadSectionEnd, setRoadSectionEnd] = useState('') // 路段 End
+ const [address, setAddress] = useState('') // 具体位置
+ const [content, setContent] = useState('') // 巡查内容
+ const [scenePic, setScenePic] = useState([]) // 现场图片
+ const [conserveBeforePic, setConserveBeforePic] = useState([]) // 养护前图片
+ const [conserveUnderwayPic, setConserveUnderwayPic] = useState([]) // 养护中图片
+ const [conserveAfterPic, setConserveAfterPic] = useState([]) // 养护后图片
- const [images, setimages] = useState([])
+ const [roadStartSelector, setRoadStartSelector] = useState([])
+ const [roadEndSelector, setRoadEndSelector] = useState([])
- const reportType = [
- {
- value: '巡查',
- text: '巡查',
- checked: true
- },
- {
- value: '养护',
- text: '养护',
- checked: false
- }
- ]
+ const rPrjTypeSelector = ['道路', '桥梁', '涵洞', '其他']
+ const rRoadSelector = ['富山一路', '金沙大道', '玉湖路']
+
+ const rRoadStartSelector = ['一段', '二段', '三段']
+ const rRoadEndSelector = ['一段', '二段', '三段']
useEffect(() => {
- const prjTypeSelector = ['道路', '桥梁', '涵洞', '其他']
- const roadSelector = ['富山一路', '金沙大道', '玉湖路']
- setPrjTypeSelector(prjTypeSelector)
- setRoadSelector(roadSelector)
+ setRoadStartSelector(rRoadStartSelector)
+ setRoadEndSelector(rRoadEndSelector)
}, [])
- useEffect(() => {
- if (projectType) {
- setPrjTypeSelector(prjTypeSelector.filter(s => s.includes(projectType)))
+ function report() {
+ let data = {
+ reportType,
+ projectType,
+ road,
+ roadSectionStart,
+ roadSectionEnd,
+ address,
+ content,
+ longitude: 37.000000000000,
+ latitude: 69.000000000000
}
- }, [projectType])
- // useEffect(() => {
- // if (projectType) {
- // setPrjTypeSelector(prjTypeSelector.filter(s => s.includes(projectType)))
- // }
- // }, [projectType])
-
- function onTypeChange(e) {
- if (e.detail.value === '巡查') {
- setIsPatrol(true)
+ if (reportType === 'patrol') {
+ data['scenePic'] = scenePic.length > 0 && scenePic.map(item => item.url)
} else {
- setIsPatrol(false)
+ data['conserveBeforePic'] = conserveBeforePic.length > 0 && conserveBeforePic.map(item => item.url)
+ data['conserveUnderwayPic'] = conserveUnderwayPic.length > 0 && conserveUnderwayPic.map(item => item.url)
+ data['conserveAfterPic'] = conserveAfterPic.length > 0 && conserveAfterPic.map(item => item.url)
}
+ for (var key in data) {
+ if (!data[key]) {
+ Taro.showToast({ title: '请完善信息', icon: 'none' })
+ return
+ }
+ }
+ if (rPrjTypeSelector.indexOf(data.projectType) === -1) {
+ Taro.showToast({ title: '工程类型错误', icon: 'none' })
+ return
+ }
+ request.post(postReport(), data).then(res => {
+ if (res.statusCode == 200 || res.statusCode == 204) {
+ Taro.showToast({ title: '上报成功', icon: 'none' })
+ } else {
+ Taro.showToast({ title: res.data.message || '请求出错', icon: 'none' })
+ }
+ }, err => {
+ Taro.showToast({ title: err.message || '请求出错', icon: 'none' })
+ })
}
- function onPrjTypeChange(e) {
- setProjectType(selector[e.detail.value])
+ function handleInput({ detail: { value } }, type) {
+ switch (type) {
+ case 'roadSectionStart':
+ setRoadSectionStart(value)
+ if (value) {
+ setRoadStartSelector(rRoadStartSelector.filter(item => item.includes(value)))
+ } else {
+ setRoadStartSelector(rRoadStartSelector)
+ }
+ break;
+ case 'roadSectionEnd':
+ setRoadSectionEnd(value)
+ if (value) {
+ setRoadEndSelector(rRoadEndSelector.filter(item => item.includes(value)))
+ } else {
+ setRoadEndSelector(rRoadEndSelector)
+ }
+ break;
+ case 'address':
+ setAddress(value)
+ break;
+ case 'content':
+ setContent(value)
+ default:
+ break;
+ }
}
- function onImgPickerChange(files) {
- setimages(files)
+ function handleTypeChange(e) {
+ setReportType(e.detail.value)
}
- function onImageClick(index, file) {
+
+ function handleImgChange(files, type) {
+ switch (type) {
+ case 'scenePic':
+ setScenePic(files)
+ break;
+ case 'conserveBeforePic':
+ setConserveBeforePic(files)
+ break;
+ case 'conserveUnderwayPic':
+ setConserveUnderwayPic(files)
+ break;
+ case 'conserveAfterPic':
+ setConserveAfterPic(files)
+ break;
+ default:
+ break;
+ }
+ }
+ function handleImgClick(index, file) {
Taro.previewImage({
urls: [file.url] // 需要预览的图片http链接列表
})
}
- useEffect(() => {
- console.log(images);
- }, [images])
+ const typeList = [
+ {
+ value: 'patrol',
+ text: '巡查',
+ checked: true
+ },
+ {
+ value: 'conserve',
+ text: '养护',
+ checked: false
+ }
+ ]
return (
-
+
上报类型
-
+
{
- reportType.map((item, i) => {
+ typeList.map((item, i) => {
return (
{
-
- setProjectType(value)}
- />
-
-
-
-
-
- setRoad(value)}
- />
-
-
-
-
-
- {/*
- */}
+ onInput={setRoad}
+ selector={rRoadSelector}
+ />
-
-
+ 所属路段:
+ handleInput(e, 'roadSectionStart')}
/>
-
+ setRoadSectionStart(roadStartSelector[e.detail.value])}
+ >
- 至
+ handleInput(e, 'roadSectionEnd')}
/>
-
+ setRoadSectionEnd(roadEndSelector[e.detail.value])}
+ >
-
+
+ 具体位置:
+ handleInput(e, 'address')}
+ />
+
+
handleInput(e, 'content')}
/>
-
{
- isPatrol ?
-
+ reportType === 'patrol' ?
+
现场图片:
= 3 ? false : true}
- files={images}
- onChange={onImgPickerChange}
- onImageClick={onImageClick}
+ count={3 - scenePic.length}
+ showAddBtn={scenePic.length >= 3 ? false : true}
+ files={scenePic}
+ onChange={files => handleImgChange(files, 'scenePic')}
+ onImageClick={handleImgClick}
/>
:
-
+
养护图片:
@@ -211,9 +264,11 @@ const Index = () => {
= 3 ? false : true}
+ files={conserveBeforePic}
+ onChange={files => handleImgChange(files, 'conserveBeforePic')}
+ onImageClick={handleImgClick}
/>
@@ -221,9 +276,11 @@ const Index = () => {
= 3 ? false : true}
+ files={conserveUnderwayPic}
+ onChange={files => handleImgChange(files, 'conserveUnderwayPic')}
+ onImageClick={handleImgClick}
/>
@@ -231,15 +288,15 @@ const Index = () => {
= 3 ? false : true}
+ files={conserveAfterPic}
+ onChange={files => handleImgChange(files, 'conserveAfterPic')}
+ onImageClick={handleImgClick}
/>
}
-
- 上报
-
+ 上报
)
}
diff --git a/weapp/src/packages/patrol/index.scss b/weapp/src/packages/patrol/index.scss
index 83057e4b..186500ad 100644
--- a/weapp/src/packages/patrol/index.scss
+++ b/weapp/src/packages/patrol/index.scss
@@ -3,6 +3,10 @@ page {
width: 100vw;
background-color: #f6f6f6;
+ .patrol {
+ font-size: 28px;
+ }
+
.report-type {
height: 96px;
background-color: #fff;
@@ -20,32 +24,58 @@ page {
}
}
- .input-picker {
+ .road-section {
display: flex;
justify-content: space-between;
+ height: 96px;
align-items: center;
background-color: #fff;
margin-bottom: 5px;
+ .title {
+ margin-left: 30px;
+ }
+
+ .input {
+ width: 200px;
+ }
+
.img-r {
width: 24px;
height: 14px;
margin-right: 30px;
- // margin-left: 10px;
}
.img-l {
width: 24px;
height: 14px;
+ margin-right: 10px;
+ }
+ }
+
+ .address {
+ background-color: #fff;
+ display: flex;
+ align-items: center;
+ height: 96px;
+ margin-bottom: 5px;
+
+ .title {
+ margin-left: 30px;
+ }
+
+ .input {
+ margin-left: 20px;
+ flex-grow: 1;
}
}
- .patrol-picker {
+ .patrol-img {
background-color: #fff;
padding: 20px;
}
- .conserve-picker {
+ .conserve-img {
background-color: #fff;
padding: 20px;
diff --git a/weapp/src/packages/patrolView/index.jsx b/weapp/src/packages/patrolView/index.jsx
index 04792eea..2b768793 100644
--- a/weapp/src/packages/patrolView/index.jsx
+++ b/weapp/src/packages/patrolView/index.jsx
@@ -35,7 +35,7 @@ function Index() {
throw new Error(error);
}
useEffect(() => {
- request.get(getReportList(),{}, { hideErrorToast: true, hideLoading: true }).then(res => {
+ request.get(getReportList(), {}, { hideErrorToast: true, hideLoading: true }).then(res => {
if (res.statusCode == 200) {
console.log(res);
setListData(res.data)
diff --git a/weapp/src/services/api.js b/weapp/src/services/api.js
index bc0f6aeb..dab3cd0f 100644
--- a/weapp/src/services/api.js
+++ b/weapp/src/services/api.js
@@ -11,6 +11,10 @@ export const getReportList = () => {
return `/report/list`;
};
+export const postReport = () => {
+ return `/report`;
+};
+
//行业查询
export const getIndustryUrl = () => {
return `/elec/business/industry`