From 147f2ae0ba59afd39c9f9747895f6b888be994e4 Mon Sep 17 00:00:00 2001 From: liujiangyong Date: Tue, 26 Jul 2022 15:42:00 +0800 Subject: [PATCH] =?UTF-8?q?=E9=81=93=E8=B7=AF=E8=B7=AF=E6=AE=B5=E5=92=8C?= =?UTF-8?q?=E4=BD=8D=E7=BD=AE=E4=BF=A1=E6=81=AF=E6=8E=A5=E5=85=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- weapp/src/app.config.js | 3 + .../packages/components/inputPicker/index.jsx | 2 +- weapp/src/packages/patrol/index.jsx | 332 ++++++++++-------- weapp/src/packages/patrol/index.scss | 37 +- weapp/src/packages/patrolView/index.jsx | 2 +- weapp/src/services/api.js | 11 + 6 files changed, 226 insertions(+), 161 deletions(-) diff --git a/weapp/src/app.config.js b/weapp/src/app.config.js index 34a44b5a..0fefdbef 100644 --- a/weapp/src/app.config.js +++ b/weapp/src/app.config.js @@ -16,6 +16,9 @@ export default { "desc": '需要获取您的地理位置' } }, + requiredPrivateInfos: [ + 'getLocation', + ], window: { backgroundTextStyle: 'light', navigationBarBackgroundColor: "#2C66F3", diff --git a/weapp/src/packages/components/inputPicker/index.jsx b/weapp/src/packages/components/inputPicker/index.jsx index 2525048b..03f9b94a 100644 --- a/weapp/src/packages/components/inputPicker/index.jsx +++ b/weapp/src/packages/components/inputPicker/index.jsx @@ -17,7 +17,7 @@ export default function InputPicker(props) { function handleInput({ detail: { value: v } }) { onInput(v) if (v) { - setCurSelector(selector.filter(item => item.includes(v))) + setCurSelector(selector.filter(item => item && item.includes(v))) } else { setCurSelector(selector) } diff --git a/weapp/src/packages/patrol/index.jsx b/weapp/src/packages/patrol/index.jsx index 3ff00be1..fae9ad98 100644 --- a/weapp/src/packages/patrol/index.jsx +++ b/weapp/src/packages/patrol/index.jsx @@ -1,18 +1,10 @@ import React, { useState, useEffect } from 'react'; import Taro, { useRouter } from '@tarojs/taro'; -import { - View, - RadioGroup, - Radio, - Button, - Image, - Input, - Picker -} from '@tarojs/components'; -import { AtButton, AtTextarea, AtImagePicker, AtAvatar } from 'taro-ui'; +import { View, RadioGroup, Radio, Image, Input, Picker } from '@tarojs/components'; +import { AtButton, AtTextarea, AtImagePicker } from 'taro-ui'; import InputPicker from '../components/inputPicker'; import request from '@/services/request'; -import { postReport, getReportDetail } from '@/services/api'; +import { postReport, getReportDetail, delReport, getRoadSection } from '@/services/api'; import './index.scss'; import arrowIcon from '../../static/img/patrol/arrow-down.svg'; @@ -21,7 +13,6 @@ const Index = () => { const { params: { type } } = router const isView = type === 'view' ? true : false - const [reportType, setReportType] = useState('patrol') // 上报类型 const [projectType, setProjectType] = useState('') // 工程类型 const [road, setRoad] = useState('') // 所在道路 @@ -33,9 +24,16 @@ const Index = () => { const [conserveBeforePic, setConserveBeforePic] = useState([]) // 养护前图片 const [conserveUnderwayPic, setConserveUnderwayPic] = useState([]) // 养护中图片 const [conserveAfterPic, setConserveAfterPic] = useState([]) // 养护后图片 + const [longitude, setLongitude] = useState(0) // 经度 + const [latitude, setLatitude] = useState(0) // 纬度 + + const [sourceRoadSel, setSourceRoadSel] = useState([]) + const [sourceRoadStartSel, setSourceRoadStartSel] = useState([]) + const [sourceRoadEndSel, setSourceRoadEndSel] = useState([]) - const [roadStartSelector, setRoadStartSelector] = useState([]) - const [roadEndSelector, setRoadEndSelector] = useState([]) + const prjTypeSelector = ['道路', '桥梁', '涵洞', '其他'] + const [roadStartSel, setRoadStartSel] = useState([]) + const [roadEndSel, setRoadEndSel] = useState([]) const [canReport, setCanReport] = useState(true) @@ -52,17 +50,9 @@ const Index = () => { } ]) - const rPrjTypeSelector = ['道路', '桥梁', '涵洞', '其他'] - const rRoadSelector = ['富山一路', '金沙大道', '玉湖路'] - - const rRoadStartSelector = ['一段', '二段', '三段'] - const rRoadEndSelector = ['一段', '二段', '三段'] - useEffect(() => { - if (isView) { - Taro.showLoading({ - title: '加载中' - }) + if (isView) { // 查看 + Taro.showLoading({ title: '加载中' }) request.get(getReportDetail(router.params.id)).then(res => { Taro.hideLoading() if (res.statusCode == 200 || res.statusCode == 204) { @@ -84,10 +74,51 @@ const Index = () => { }, err => { Taro.showToast({ title: err.message || '请求出错', icon: 'none' }) }) + } else { // 填报 + Taro.showLoading({ title: '加载中' }) + let key = 'ODQBZ-3FZAU-6VIVL-2XXNM-F7CP7-WVFCY' // 写自己申请的key + Taro.getLocation({ + type: 'wgs84', + success: function (res) { + setLongitude(res.longitude) + setLatitude(res.latitude) + Taro.request({ + url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${res.latitude},${res.longitude}&key=${key}`, + success: function (res) { + // 根据自己项目需求获取res内容 + let addresscity = res.data.result.address_component.province + res.data.result.address_component.city + res.data.result.address_component.district + setAddress(addresscity + res.data.result.address_component.street_number) + } + }) + } + }) + request.get(getRoadSection()).then(res => { + Taro.hideLoading() + if (res.statusCode == 200 || res.statusCode == 204) { + const { data } = res + let nextSourceRoadSel = [] + let nextSourceRoadStartSel = [] + let nextSourceRoadEndSel = [] + data.map(item => { + nextSourceRoadSel.push(item.routeName) + nextSourceRoadStartSel.push(item.startingPlaceName) + nextSourceRoadEndSel.push(item.stopPlaceName) + }) + setSourceRoadSel(nextSourceRoadSel) + setSourceRoadStartSel(nextSourceRoadStartSel) + setSourceRoadEndSel(nextSourceRoadEndSel) + } else { + Taro.showToast({ title: res.data.message || '请求出错', icon: 'none' }) + } + }, err => { + Taro.showToast({ title: err.message || '请求出错', icon: 'none' }) + }) } - setRoadStartSelector(rRoadStartSelector) - setRoadEndSelector(rRoadEndSelector) }, []) + useEffect(() => { + setRoadStartSel(sourceRoadStartSel) + setRoadEndSel(sourceRoadEndSel) + }, [sourceRoadStartSel, sourceRoadEndSel]) useEffect(() => { setTypeList([ @@ -110,7 +141,7 @@ const Index = () => { Taro.showToast({ title: '请完善必填信息', icon: 'none' }) return } - if (rPrjTypeSelector.indexOf(projectType) === -1) { + if (prjTypeSelector.indexOf(projectType) === -1) { Taro.showToast({ title: '工程类型错误', icon: 'none' }) return } @@ -122,8 +153,8 @@ const Index = () => { roadSectionEnd, address, content, - // longitude: 37.000000000000, - // latitude: 69.000000000000 + longitude, + latitude } if (reportType === 'patrol') { data['scenePic'] = scenePic.length > 0 ? scenePic.map(item => item.url) : null @@ -165,22 +196,49 @@ const Index = () => { }) } + function deleteReport() { + Taro.showModal({ + title: '提示', + content: '确定删除吗？', + success: function (res) { + if (res.confirm) { + Taro.showLoading({ + title: '删除中' + }) + request.del(delReport(router.params.id)).then(res => { + Taro.hideLoading() + if (res.statusCode == 200 || res.statusCode == 204) { + Taro.showToast({ title: '删除成功', icon: 'none', duration: 1500 }) + setTimeout(() => { + Taro.navigateBack() + }, 1000) + } else { + Taro.showToast({ title: res.data.message || '请求出错', icon: 'none' }) + } + }, err => { + Taro.showToast({ title: err.message || '请求出错', icon: 'none' }) + }) + } + } + }) + } + function handleInput({ detail: { value } }, type) { switch (type) { case 'roadSectionStart': setRoadSectionStart(value) if (value) { - setRoadStartSelector(rRoadStartSelector.filter(item => item.includes(value))) + setRoadStartSel(sourceRoadStartSel.filter(item => item && item.includes(value))) } else { - setRoadStartSelector(rRoadStartSelector) + setRoadStartSel(sourceRoadStartSel) } break; case 'roadSectionEnd': setRoadSectionEnd(value) if (value) { - setRoadEndSelector(rRoadEndSelector.filter(item => item.includes(value))) + setRoadEndSel(sourceRoadEndSel.filter(item => item && item.includes(value))) } else { - setRoadEndSelector(rRoadEndSelector) + setRoadEndSel(sourceRoadEndSel) } break; case 'address': @@ -221,106 +279,6 @@ const Index = () => { }) } - function renderAddImg() { - return ( - reportType === 'patrol' ? - - 现场图片： - = 3 ? false : true} - files={scenePic} - onChange={files => handleImgChange(files, 'scenePic')} - onImageClick={handleImgClick} - /> - : - - 养护图片: - - - 养护前 - - = 3 ? false : true} - files={conserveBeforePic} - onChange={files => handleImgChange(files, 'conserveBeforePic')} - onImageClick={handleImgClick} - /> - - - 养护中 - - = 3 ? false : true} - files={conserveUnderwayPic} - onChange={files => handleImgChange(files, 'conserveUnderwayPic')} - onImageClick={handleImgClick} - /> - - - 养护后 - - = 3 ? false : true} - files={conserveAfterPic} - onChange={files => handleImgChange(files, 'conserveAfterPic')} - onImageClick={handleImgClick} - /> - - ) - } - - function renderViewImg() { - return ( - reportType === 'patrol' ? - - 现场图片： - - {scenePic.map(item => ( - handleImgClick(undefined, item)} /> - ))} - - : - - 养护图片: - - - 养护前 - - - {conserveBeforePic.map(item => ( - handleImgClick(undefined, item)} /> - ))} - - - - 养护中 - - - {conserveUnderwayPic.map(item => ( - handleImgClick(undefined, item)} /> - ))} - - - - 养护后 - - - {conserveAfterPic.map(item => ( - handleImgClick(undefined, item)} /> - ))} - - - ) - } - return ( @@ -350,15 +308,16 @@ const Index = () => { placeholder='请选择工程类型' value={projectType} onInput={setProjectType} - selector={rPrjTypeSelector} + selector={prjTypeSelector} isView={isView} /> @@ -374,11 +333,11 @@ const Index = () => { disabled={isView} /> { - isView && + !isView && setRoadSectionStart(roadStartSelector[e.detail.value])} + range={roadStartSel} + onChange={e => setRoadSectionStart(roadStartSel[e.detail.value])} > @@ -394,11 +353,11 @@ const Index = () => { disabled={isView} /> { - isView && + !isView && setRoadSectionEnd(roadEndSelector[e.detail.value])} + range={roadEndSel} + onChange={e => setRoadSectionEnd(roadEndSel[e.detail.value])} > @@ -426,12 +385,95 @@ const Index = () => { disabled={isView} /> { - isView ? - renderViewImg() : - renderAddImg() + reportType === 'patrol' ? + + 现场图片： + { + isView ? + + {scenePic.map(item => ( + handleImgClick(undefined, item)} /> + ))} + : + = 3 ? false : true} + files={scenePic} + onChange={files => handleImgChange(files, 'scenePic')} + onImageClick={handleImgClick} + /> + } + : + + 养护图片: + + + 养护前 + + { + isView ? + + {conserveBeforePic.map(item => ( + handleImgClick(undefined, item)} /> + ))} + : + = 3 ? false : true} + files={conserveBeforePic} + onChange={files => handleImgChange(files, 'conserveBeforePic')} + onImageClick={handleImgClick} + /> + } + + + 养护中 + + { + isView ? + + {conserveUnderwayPic.map(item => ( + handleImgClick(undefined, item)} /> + ))} + : + = 3 ? false : true} + files={conserveUnderwayPic} + onChange={files => handleImgChange(files, 'conserveUnderwayPic')} + onImageClick={handleImgClick} + /> + } + + + + 养护后 + + { + isView ? + + {conserveAfterPic.map(item => ( + handleImgClick(undefined, item)} /> + ))} + : + = 3 ? false : true} + files={conserveAfterPic} + onChange={files => handleImgChange(files, 'conserveAfterPic')} + onImageClick={handleImgClick} + /> + } + } { - !isView && 上报 + isView ? + 删除 : + 上报 } ) diff --git a/weapp/src/packages/patrol/index.scss b/weapp/src/packages/patrol/index.scss index d5040252..01890637 100644 --- a/weapp/src/packages/patrol/index.scss +++ b/weapp/src/packages/patrol/index.scss @@ -26,7 +26,7 @@ page { .road-section { display: flex; - justify-content: space-between; + justify-content: left; height: 96px; align-items: center; background-color: #fff; @@ -38,17 +38,18 @@ page { .input { width: 200px; + margin: 0 10px; } .img-r { width: 24px; height: 14px; - margin-right: 30px; + margin: 0 10px; } .img-l { width: 24px; height: 14px; - margin-right: 10px; + margin: 0 10px; } } @@ -72,17 +73,6 @@ page { .patrol-img { background-color: #fff; padding: 20px; - - .img-box { - display: flex; - flex-wrap: wrap; - - .img { - width: 170px; - height: 170px; - margin: 10px 0 0 10px; - } - } } .conserve-img { @@ -93,6 +83,7 @@ page { height: 30px; width: 100%; border-radius: 5px; + margin-top: 10px; display: flex; justify-content: left; align-items: center; @@ -149,8 +140,26 @@ page { } } + .img-box { + display: flex; + flex-wrap: wrap; + + .img { + width: 170px; + height: 170px; + margin: 10px 0 0 10px; + } + } + .sub-btn { width: 70%; margin: 80px auto; } + + .del-btn { + width: 70%; + margin: 80px auto; + background-color: #C23434; + border-color: #C23434; + } } \ No newline at end of file diff --git a/weapp/src/packages/patrolView/index.jsx b/weapp/src/packages/patrolView/index.jsx index 7b55672d..a8863200 100644 --- a/weapp/src/packages/patrolView/index.jsx +++ b/weapp/src/packages/patrolView/index.jsx @@ -37,7 +37,7 @@ function Index() { useEffect(() => { request.get(getReportList(), {}, { hideErrorToast: true, hideLoading: true }).then(res => { if (res.statusCode == 200) { - console.log(res); + // console.log(res); setListData(res.data) return res.data; } else { diff --git a/weapp/src/services/api.js b/weapp/src/services/api.js index 7579a34d..ba5558e2 100644 --- a/weapp/src/services/api.js +++ b/weapp/src/services/api.js @@ -22,6 +22,17 @@ export const getReportDetail = id => { return `/report/${id}/detail`; }; +// 删除上报 +export const delReport = id => { + console.log(id) + return `/report/${id}`; +}; + +// 获取道路路段 +export const getRoadSection = () => { + return `/road/section`; +}; + //行业查询 export const getIndustryUrl = () => { return `/elec/business/industry`